@salutejs/plasma-new-hope 0.77.1-canary.1201.8930079977.0 → 0.77.1-canary.1202.8938243709.0

package/styled-components/es/examples/sds_engineer/components/Dropdown/Dropdown.stories.tsx

@@ -0,0 +1,277 @@
+import React, { useRef, useState } from 'react';
+import type { ComponentProps } from 'react';
+import type { Meta, StoryObj } from '@storybook/react';
+import styled from 'styled-components';
+import { css } from 'styled-components';
+import { action } from '@storybook/addon-actions';
+
+import { WithTheme, argTypesFromConfig } from '../../../_helpers';
+import { mergeConfig } from '../../../../engines';
+import { dropdownConfig } from '../../../../components/Dropdown';
+import { Checkbox } from '../Checkbox/Checkbox';
+import { Radiobox } from '../Radiobox/Radiobox';
+import { Button } from '../Button/Button';
+
+import { Dropdown, DropdownDivider, DropdownFooter, DropdownGroup, DropdownHeader, DropdownItem } from './Dropdown';
+import { config } from './Dropdown.config';
+
+type StoryDropdownPropsCustom = {
+    skidding?: number;
+    distance?: number;
+};
+
+type StoryDropdownProps = ComponentProps<typeof Dropdown> & StoryDropdownPropsCustom;
+
+const placements: Array<string> = ['top', 'bottom', 'right', 'left', 'auto'];
+const triggers: Array<string> = ['click', 'hover'];
+
+const meta: Meta<StoryDropdownProps> = {
+    title: 'sds_engineer/Dropdown',
+    decorators: [WithTheme],
+    component: Dropdown,
+    argTypes: {
+        placement: {
+            options: placements,
+            control: {
+                type: 'select',
+            },
+        },
+        trigger: {
+            options: triggers,
+            control: {
+                type: 'select',
+            },
+        },
+        ...argTypesFromConfig(mergeConfig(dropdownConfig, config)),
+    },
+    args: {
+        placement: 'bottom',
+        trigger: 'click',
+        closeOnOverlayClick: true,
+        closeOnEsc: true,
+        isFocusTrapped: true,
+        skidding: 0,
+        distance: 6,
+    },
+};
+
+export default meta;
+
+const StyledCheckbox = styled(Checkbox)`
+    margin-left: 0rem;
+    margin-bottom: 0rem;
+`;
+
+const StyledRadiobox = styled(Radiobox)`
+    margin-left: 0rem;
+    margin-bottom: 0rem;
+`;
+
+const headerClass = css`
+    text-transform: uppercase;
+    color: rgba(23, 23, 23, 0.56);
+`;
+
+const TrashIcon = (props) => (
+    <svg width="100%" viewBox="0 0 24 24" fill="none" {...props}>
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M8 5.5A2.5 2.5 0 0110.5 3h3A2.5 2.5 0 0116 5.5V6h-2v-.5a.5.5 0 00-.5-.5h-3a.5.5 0 00-.5.5V6H8v-.5zM4 8a1 1 0 011-1h14a1 1 0 110 2h-1v9.5a2.5 2.5 0 01-2.5 2.5h-7A2.5 2.5 0 016 18.5V9H5a1 1 0 01-1-1z"
+            fill="currentColor"
+        />
+    </svg>
+);
+
+const StyledTrashIcon = styled(TrashIcon)`
+    width: 1.25rem;
+    height: 1.25rem;
+`;
+
+const onChange = action('onChange');
+const onSelect = action('onSelect');
+const onClick = action('onClick');
+
+const dropdownItems = [...Array(4).keys()].map((num) => ({
+    value: `item_${num}`,
+    child: `Item ${num}`,
+}));
+
+const StoryDefault = (args: StoryDropdownProps) => {
+    const [selected, setSelected] = useState('');
+    const [isOpen, setIsOpen] = useState(false);
+    const [isOpenDropdown2, setIsOpenDropdown2] = useState(false);
+
+    const onMainClose = () => {
+        setIsOpen(false);
+        setIsOpenDropdown2(false);
+    };
+
+    const onMainToggle = (openValue: boolean) => {
+        setIsOpen(openValue);
+
+        if (!openValue) {
+            onMainClose();
+        }
+    };
+
+    const handleSelect = (value: string, text: string) => {
+        setSelected(value);
+        onSelect(value, text);
+    };
+
+    return (
+        <div>
+            <h3>This is header</h3>
+            <Dropdown target={<Button>Target</Button>} isOpen={isOpen} onToggle={onMainToggle} {...args}>
+                <DropdownHeader className={headerClass}>Header</DropdownHeader>
+                <DropdownDivider />
+                {dropdownItems.map((item) => (
+                    <DropdownItem
+                        key={item.value}
+                        isSelected={item.value === selected}
+                        onSelect={() => handleSelect(item.value, item.child)}
+                        onClick={onClick}
+                        value={item.value}
+                    >
+                        {item.child}
+                    </DropdownItem>
+                ))}
+                <Dropdown
+                    target={<DropdownItem>Nested dropdown ➞</DropdownItem>}
+                    onToggle={(is) => setIsOpenDropdown2(is)}
+                    isOpen={isOpenDropdown2}
+                    offset={[0, 0]}
+                >
+                    <DropdownGroup label="This is radiogroup">
+                        <DropdownItem
+                            contentLeft={StyledRadiobox}
+                            name="test"
+                            value="1"
+                            onChange={onChange}
+                            text="Nested 1"
+                        />
+
+                        <DropdownItem
+                            contentLeft={StyledRadiobox}
+                            name="test"
+                            value="2"
+                            onChange={onChange}
+                            text="Nested 2"
+                        />
+                        <DropdownItem
+                            contentLeft={StyledRadiobox}
+                            name="test"
+                            value="3"
+                            onChange={onChange}
+                            text="Nested 3"
+                        />
+                    </DropdownGroup>
+                    <DropdownItem contentLeft={StyledCheckbox} text="Nested 4" />
+                    <DropdownItem contentRight={StyledCheckbox} text="Nested 5" />
+
+                    <DropdownItem contentLeft={StyledTrashIcon} text="Nested 6" />
+                    <Button onClick={() => setIsOpenDropdown2(false)}>Close nested</Button>
+                </Dropdown>
+
+                <DropdownItem onClick={onClick} value="disabled" disabled>
+                    disabled
+                </DropdownItem>
+
+                <DropdownGroup label="Group">
+                    <DropdownItem
+                        contentLeft={StyledRadiobox}
+                        name="test"
+                        value="1"
+                        disabled
+                        onChange={onChange}
+                        text="Disabled 1"
+                    />
+
+                    <DropdownItem name="test" value="2" disabled text="Disabled group 2" />
+                </DropdownGroup>
+
+                <DropdownDivider />
+                <DropdownFooter className={headerClass}>Footer</DropdownFooter>
+            </Dropdown>
+        </div>
+    );
+};
+
+export const Default: StoryObj<StoryDropdownProps> = {
+    render: (args) => <StoryDefault {...args} />,
+};
+
+const StoryContextMenu = (args: StoryDropdownProps) => {
+    const [contextPosition, setContextPosition] = useState([0, 0]);
+    const dropdownRef = useRef<HTMLDivElement | null>(null);
+    const [selected, setSelected] = useState('');
+    const [isOpen, setIsOpen] = useState(false);
+
+    const onMainToggle = (openValue: boolean) => {
+        setIsOpen(openValue);
+    };
+
+    const handleSelect = (value: string, text: string) => {
+        setSelected(value);
+        onSelect(value, text);
+        setIsOpen(false);
+    };
+
+    const onClickAway = (event: React.MouseEvent<HTMLDivElement>) => {
+        event.preventDefault();
+        if (dropdownRef?.current && !dropdownRef.current?.contains(event.target as Element)) {
+            setIsOpen(false);
+        }
+    };
+
+    const onContextMenu = (event: React.MouseEvent<HTMLDivElement>) => {
+        event.preventDefault();
+
+        const { clientX, clientY } = event;
+
+        setContextPosition([clientX, clientY]);
+        setIsOpen(true);
+    };
+
+    return (
+        <div
+            style={{
+                width: '100%',
+                height: '100%',
+                background: 'gainsboro',
+            }}
+            onClick={onClickAway}
+            onContextMenu={onContextMenu}
+        >
+            <div>Right-click the mouse button - to open</div>
+            <div>Left-click the mouse button - to close</div>
+            <div
+                ref={dropdownRef}
+                style={{ position: 'absolute', top: `${contextPosition[1]}px`, left: `${contextPosition[0]}px` }}
+            >
+                <Dropdown isOpen={isOpen} onToggle={onMainToggle} {...args}>
+                    <DropdownHeader className={headerClass}>Header</DropdownHeader>
+                    <DropdownDivider />
+                    {dropdownItems.map((item) => (
+                        <DropdownItem
+                            key={item.value}
+                            isSelected={item.value === selected}
+                            onSelect={() => handleSelect(item.value, item.child)}
+                            onClick={onClick}
+                            value={item.value}
+                        >
+                            {item.child}
+                        </DropdownItem>
+                    ))}
+                    <DropdownDivider />
+                    <DropdownFooter className={headerClass}>Footer</DropdownFooter>
+                </Dropdown>
+            </div>
+        </div>
+    );
+};
+
+export const ContextMenu: StoryObj<StoryDropdownProps> = {
+    render: (args) => <StoryContextMenu {...args} />,
+};

package/types/components/Combobox/ui/ComboboxItem/ComboboxItem.d.ts

@@ -1,43 +1,41 @@
-import React from 'react';
-import type { RootProps } from '../../../../engines';
-import { ComboboxItemProps } from './ComboboxItem.type';
-export declare const comboboxItemRoot: (Root: RootProps<HTMLDivElement, ComboboxItemProps>) => React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> & {
+/// <reference types="react" />
+export declare const comboboxItemRoot: (Root: import("../../../..").RootProps<HTMLDivElement, import("../../../Dropdown/ui/DropdownItem/DropdownItem.type").DropdownItemProps>) => import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement>, "onSelect"> & {
     id?: string | undefined;
     disabled?: boolean | undefined;
-    label?: React.ReactNode;
+    label?: import("react").ReactNode;
     role?: string | undefined;
-    contentLeft?: string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal | React.ComponentClass<any, any> | React.FunctionComponent<any> | null | undefined;
-    contentRight?: string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal | React.ComponentClass<any, any> | React.FunctionComponent<any> | null | undefined;
+    contentLeft?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactFragment | import("react").ReactPortal | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | null | undefined;
+    contentRight?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactFragment | import("react").ReactPortal | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | null | undefined;
     name?: string | undefined;
     checked?: boolean | undefined;
     text?: string | undefined;
     value?: string | number | boolean | undefined;
     isSelected?: boolean | undefined;
-    onClick?: ((event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void) | undefined;
+    onClick?: ((event: import("react").MouseEvent<HTMLDivElement, MouseEvent>) => void) | undefined;
     onSelect?: ((value?: any, text?: any) => void) | undefined;
     size?: string | undefined;
     view?: string | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
+} & import("react").RefAttributes<HTMLDivElement>>;
 export declare const comboboxItemConfig: {
     name: string;
     tag: string;
-    layout: (Root: RootProps<HTMLDivElement, ComboboxItemProps>) => React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> & {
+    layout: (Root: import("../../../..").RootProps<HTMLDivElement, import("../../../Dropdown/ui/DropdownItem/DropdownItem.type").DropdownItemProps>) => import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement>, "onSelect"> & {
         id?: string | undefined;
         disabled?: boolean | undefined;
-        label?: React.ReactNode;
+        label?: import("react").ReactNode;
         role?: string | undefined;
-        contentLeft?: string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal | React.ComponentClass<any, any> | React.FunctionComponent<any> | null | undefined;
-        contentRight?: string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal | React.ComponentClass<any, any> | React.FunctionComponent<any> | null | undefined;
+        contentLeft?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactFragment | import("react").ReactPortal | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | null | undefined;
+        contentRight?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactFragment | import("react").ReactPortal | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | null | undefined;
         name?: string | undefined;
         checked?: boolean | undefined;
         text?: string | undefined;
         value?: string | number | boolean | undefined;
         isSelected?: boolean | undefined;
-        onClick?: ((event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void) | undefined;
+        onClick?: ((event: import("react").MouseEvent<HTMLDivElement, MouseEvent>) => void) | undefined;
         onSelect?: ((value?: any, text?: any) => void) | undefined;
         size?: string | undefined;
         view?: string | undefined;
-    } & React.RefAttributes<HTMLDivElement>>;
+    } & import("react").RefAttributes<HTMLDivElement>>;
     base: import("@linaria/core").LinariaClassName;
     variations: {
         view: {

package/types/components/Combobox/ui/ComboboxItem/ComboboxItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ui/ComboboxItem/ComboboxItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAGhE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAQrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,eAAO,MAAM,gBAAgB,SAAU,UAAU,cAAc,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;wCA4G9E,CAAC;AAEN,eAAO,MAAM,kBAAkB;;;mBA9GQ,UAAU,cAAc,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+HlF,CAAC"}
+{"version":3,"file":"ComboboxItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ui/ComboboxItem/ComboboxItem.tsx"],"names":[],"mappings":";AAMA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;kDAAmB,CAAC;AAEjD,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiB9B,CAAC"}

package/types/components/Combobox/ui/ComboboxItem/ComboboxItem.styles.d.ts

@@ -1,7 +1,3 @@
-/// <reference types="react" />
-export declare const StyledContentLeft: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const StyledContentRight: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const StyledText: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const baseContent: string;
+export declare const mappingOverride: string;
 export declare const base: import("@linaria/core").LinariaClassName;
 //# sourceMappingURL=ComboboxItem.styles.d.ts.map

package/types/components/Combobox/ui/ComboboxItem/ComboboxItem.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxItem.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ui/ComboboxItem/ComboboxItem.styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,iBAAiB,qKAK7B,CAAC;AAEF,eAAO,MAAM,kBAAkB,qKAM9B,CAAC;AAEF,eAAO,MAAM,UAAU,qKAEtB,CAAC;AAGF,eAAO,MAAM,WAAW,QA0DvB,CAAC;AAEF,eAAO,MAAM,IAAI,0CAEhB,CAAC"}
+{"version":3,"file":"ComboboxItem.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ui/ComboboxItem/ComboboxItem.styles.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,eAAe,QA+B3B,CAAC;AAEF,eAAO,MAAM,IAAI,0CAGhB,CAAC"}

package/types/components/Combobox/ui/ComboboxItem/ComboboxItem.type.d.ts

@@ -1,60 +1,3 @@
-import type { HTMLAttributes, ReactNode, MouseEvent, ElementType } from 'react';
-declare type ComboboxItemCustomProps = {
-    /**
-     * Уникальный идентификатор элемента
-     */
-    id?: string;
-    /**
-     * Компонент не активен
-     */
-    disabled?: boolean;
-    /**
-     * Метка-подпись к элементу
-     */
-    label?: ReactNode;
-    /**
-     * WAI-ARIA role элемента меню
-     */
-    role?: string;
-    /**
-     * Слот для контента слева
-     */
-    contentLeft?: ElementType | ReactNode;
-    /**
-     * Слот для контента справа
-     */
-    contentRight?: ElementType | ReactNode;
-    /**
-     *  Название слота контента
-     */
-    name?: string;
-    /**
-     *  Отмечен ли данный элемент
-     */
-    checked?: boolean;
-    /**
-     *  Содержимое контента
-     */
-    text?: string;
-    /**
-     *  Значение контента
-     */
-    value?: string | number | boolean;
-    /**
-     *  Значение контента
-     */
-    isSelected?: boolean;
-    /**
-     *  Коллбек при клике на элемент
-     */
-    onClick?: (event: MouseEvent<HTMLDivElement>) => void;
-    /**
-     *  Коллбек при выборе элемента
-     */
-    onSelect?: (value?: any, text?: any) => void;
-    size?: string;
-    view?: string;
-};
-export declare type ComboboxItemProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & ComboboxItemCustomProps;
-export {};
+import { DropdownItemProps } from '../../../Dropdown/ui/DropdownItem/DropdownItem.type';
+export declare type ComboboxItemProps = DropdownItemProps;
 //# sourceMappingURL=ComboboxItem.type.d.ts.map

package/types/components/Combobox/ui/ComboboxItem/ComboboxItem.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxItem.type.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ui/ComboboxItem/ComboboxItem.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEhF,aAAK,uBAAuB,GAAG;IAC3B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IACtC;;OAEG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IACvC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAClC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACtD;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC7C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,iBAAiB,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"ComboboxItem.type.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ui/ComboboxItem/ComboboxItem.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qDAAqD,CAAC;AAExF,oBAAY,iBAAiB,GAAG,iBAAiB,CAAC"}

package/types/components/Dropdown/Dropdown.d.ts

@@ -2,14 +2,14 @@ import React from 'react';
 import { RootProps } from '../../engines';
 import type { DropdownProps } from './Dropdown.types';
 /**
- * Выпадающий список.
+ * Выпадающий список без внешнего контроля видимости.
  */
-export declare const dropdownRoot: (Root: RootProps<HTMLDivElement, DropdownProps>) => React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
+export declare const dropdownRoot: (Root: RootProps<HTMLDivElement, DropdownProps>) => React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & import("./Dropdown.types").CustomDropdownProps & React.RefAttributes<HTMLDivElement>>;
 export declare const dropdownConfig: {
     name: string;
     tag: string;
-    layout: (Root: RootProps<HTMLDivElement, DropdownProps>) => React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
-    base: import("@linaria/core").LinariaClassName;
+    layout: (Root: RootProps<HTMLDivElement, DropdownProps>) => React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & import("./Dropdown.types").CustomDropdownProps & React.RefAttributes<HTMLDivElement>>;
+    base: string;
     variations: {
         view: {
             css: import("@linaria/core").LinariaClassName;

package/types/components/Dropdown/Dropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAU1C,OAAO,KAAK,EAAE,aAAa,EAA0B,MAAM,kBAAkB,CAAC;AAK9E;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,cAAc,EAAE,aAAa,CAAC,yFAgItE,CAAC;AAEN,eAAO,MAAM,cAAc;;;mBAlIQ,UAAU,cAAc,EAAE,aAAa,CAAC;;;;;;;;;;;;;;CAmJ1E,CAAC"}
+{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAGlD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAM1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEtD;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,cAAc,EAAE,aAAa,CAAC,iKA6DtE,CAAC;AAEN,eAAO,MAAM,cAAc;;;mBA/DQ,UAAU,cAAc,EAAE,aAAa,CAAC;;;;;;;;;;;;;;CAgF1E,CAAC"}

package/types/components/Dropdown/Dropdown.styles.d.ts

@@ -1,15 +1,8 @@
 /// <reference types="react" />
-import { DropdownProps } from './Dropdown.types';
 export declare const StyledPopover: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("../../engines/types").PropsType<{
     view: {
         css: import("@linaria/core").LinariaClassName;
     };
 }> & import("react").HTMLAttributes<HTMLDivElement> & import("../Popover/Popover.types").CustomPopoverProps & import("react").RefAttributes<HTMLDivElement>>;
-export declare const Ul: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLUListElement> & import("react").HTMLAttributes<HTMLUListElement> & {
-    listHeight: DropdownProps['listHeight'];
-    listOverflow: DropdownProps['listOverflow'];
-    isInnerUl?: boolean | undefined;
-    listWidth?: DropdownProps['listWidth'];
-}>;
-export declare const base: import("@linaria/core").LinariaClassName;
+export declare const StyledDropdown: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 //# sourceMappingURL=Dropdown.styles.d.ts.map

package/types/components/Dropdown/Dropdown.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.styles.ts"],"names":[],"mappings":";AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,eAAO,MAAM,aAAa;;;;4JAIzB,CAAC;AAEF,eAAO,MAAM,EAAE;gBACC,aAAa,CAAC,YAAY,CAAC;kBACzB,aAAa,CAAC,cAAc,CAAC;;gBAE/B,aAAa,CAAC,WAAW,CAAC;EAczC,CAAC;AAEF,eAAO,MAAM,IAAI,0CAEhB,CAAC"}
+{"version":3,"file":"Dropdown.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.styles.ts"],"names":[],"mappings":";AAUA,eAAO,MAAM,aAAa;;;;4JAIzB,CAAC;AAEF,eAAO,MAAM,cAAc,qKAY1B,CAAC"}

package/types/components/Dropdown/Dropdown.tokens.d.ts

@@ -1,35 +1,45 @@
 export declare const classes: {
-    dropdownRoot: string;
-    dropdownItemIsFocused: string;
-    dropdownItemIsDisabled: string;
-    dropdownItemIsActive: string;
     dropdownItemIsSelected: string;
+    dropdownItemIsDisabled: string;
 };
 export declare const tokens: {
     background: string;
     boxShadow: string;
     width: string;
+    height: string;
     borderRadius: string;
-    padding: string;
-    disclosureIconColor: string;
+    paddingTop: string;
+    paddingRight: string;
+    paddingBottom: string;
+    paddingLeft: string;
     itemBackground: string;
     itemColor: string;
     itemBackgroundHover: string;
+    itemBackgroundSelected: string;
+    itemColorSelected: string;
+    itemBackgroundSelectedHover: string;
+    itemColorSelectedHover: string;
+    itemWidth: string;
+    itemHeight: string;
     itemBorderRadius: string;
     itemPaddingTop: string;
-    itemPaddingTopTight: string;
     itemPaddingRight: string;
     itemPaddingBottom: string;
-    itemPaddingBottomTight: string;
     itemPaddingLeft: string;
+    itemMarginTop: string;
+    itemMarginRight: string;
+    itemMarginBottom: string;
+    itemMarginLeft: string;
     itemFontFamily: string;
     itemFontSize: string;
     itemFontStyle: string;
     itemFontWeightBold: string;
     itemFontLetterSpacing: string;
     itemFontLineHeight: string;
-    disabledOpacity: string;
-    focusColor: string;
+    itemContentLeftColor: string;
+    itemContentRightColor: string;
+    itemContentLeftWidth: string;
+    itemContentRightWidth: string;
     footerBackground: string;
     footerWidth: string;
     footerHeight: string;
@@ -97,19 +107,7 @@ export declare const tokens: {
     groupLabelMarginRight: string;
     groupLabelMarginBottom: string;
     groupLabelMarginLeft: string;
-    itemBackgroundSelected: string;
-    itemColorSelected: string;
-    itemBackgroundSelectedHover: string;
-    itemColorSelectedHover: string;
-    itemContentLeftColor: string;
-    itemContentRightColor: string;
-    itemWidth: string;
-    itemHeight: string;
-    itemMarginTop: string;
-    itemMarginRight: string;
-    itemMarginBottom: string;
-    itemMarginLeft: string;
-    itemContentLeftWidth: string;
-    itemContentRightWidth: string;
+    disabledOpacity: string;
+    focusColor: string;
 };
 //# sourceMappingURL=Dropdown.tokens.d.ts.map

package/types/components/Dropdown/Dropdown.tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;CAMnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmHlB,CAAC"}
+{"version":3,"file":"Dropdown.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;CAGnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiHlB,CAAC"}