import {render} from 'react-dom';
import React from 'react';
import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown';
import Popup from '@jetbrains/ring-ui/components/popup/popup';
const container = document.getElementById('dropdown');
const dropdown = (
Popup content
);
render(dropdown, container);
import {render} from 'react-dom';
import React from 'react';
import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown';
import Button from '@jetbrains/ring-ui/components/button/button';
import PopupMenu from '@jetbrains/ring-ui/components/popup-menu/popup-menu';
const container = document.getElementById('dropdown');
const actions = ['Cut', 'Copy', 'Paste'];
const dropdown = (
Edit}
>
({label}))}
/>
);
render(dropdown, container);
:global(.chevron) svg {
transition: transform 0.3s ease-out;
transform-origin: 50% 40%;
transform: rotate(0deg);
}
:global(.rotated) svg {
transform: rotate(180deg);
}
import {render} from 'react-dom';
import React from 'react';
import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown';
import Popup from '@jetbrains/ring-ui/components/popup/popup';
import Button from '@jetbrains/ring-ui/components/button/button';
import {ChevronDownIcon} from '@jetbrains/ring-ui/components/icon';
const container = document.getElementById('dropdown');
const dropdown = (
}
>
Popup content
);
render(dropdown, container);
import {render} from 'react-dom';
import React from 'react';
import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown';
import Popup from '@jetbrains/ring-ui/components/popup/popup';
const container = document.getElementById('dropdown');
const dropdown = (
Outer popup
Inner popup
);
render(dropdown, container);
import {render} from 'react-dom';
import React from 'react';
import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown';
import Popup from '@jetbrains/ring-ui/components/popup/popup';
import Link from '@jetbrains/ring-ui/components/link/link';
const container = document.getElementById('dropdown');
const dropdown = (
Hover over me}
clickMode={false}
hoverMode
>
Popup content
);
render(dropdown, container);