@plusui/library 0.1.0

package/dist/components/dropdown/dropdown.d.ts

@@ -0,0 +1,147 @@
+import { Tailwind } from '../base/tailwind-base';
+import { PropertyValues } from 'lit';
+import { PlusDropDownItem } from '../dropdown-item';
+/**
+ * @tag plus-dropdown
+ *
+ * Dropdown component that provides a collapsible menu with selectable options.
+ * Uses Floating UI for intelligent positioning.
+ *
+ * @slot - The default slot for the dropdown trigger button content
+ * @slot suffix - Slot for adding content to the right side of the trigger button
+ * @slot dropdown-item - Slot for dropdown menu items
+ *
+ * @csspart base - The component's base wrapper
+ * @csspart button - The dropdown trigger button
+ * @csspart dropdown-box - The dropdown list container
+ *
+ * @event plus-dropdown-open - Emitted when the dropdown is opened
+ * @event plus-dropdown-close - Emitted when the dropdown is closed
+ * @event plus-dropdown-selected-item - Emitted when an item is selected with the selected item in detail
+ *
+ */
+export default class PlusDropdown extends Tailwind {
+    /**
+     * Query all dropdown items
+     * @private
+     */
+    slots: PlusDropDownItem[];
+    /**
+     * Sets the size of the dropdown button
+     * - sm: Small size
+     * - md: Medium size
+     * - lg: Large size
+     * @default 'md'
+     */
+    size: 'sm' | 'md' | 'lg';
+    /**
+     * Sets the status/color variant of the dropdown button
+     * - default: Neutral color scheme
+     * - primary: Primary color scheme
+     * - success: Green color scheme
+     * - warning: Yellow color scheme
+     * - danger: Red color scheme
+     * - info: Blue color scheme
+     * @default 'default'
+     */
+    status: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
+    /**
+     * Determines the visual style of the dropdown button
+     * - filled: Solid background color
+     * - outlined: Transparent background with border
+     * - dashed: Transparent background with dashed border
+     * - text: No background or border
+     * @default 'filled'
+     */
+    kind: 'filled' | 'outlined' | 'dashed' | 'text';
+    /**
+     * Disables the dropdown interaction
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Sets the text content of the dropdown button if no default slot is provided
+     */
+    text?: string;
+    /**
+     * Tracks whether the dropdown is open or closed
+     * @private
+     */
+    private isVisible;
+    /**
+     * Tracks the currently selected dropdown item
+     * @private
+     */
+    private selectedItem;
+    /**
+     * Reference to the dropdown trigger button
+     * @private
+     */
+    private targetElement;
+    /**
+     * Reference to the dropdown container
+     * @private
+     */
+    private dropdownBox;
+    /**
+     * Cleanup function for Floating UI's autoUpdate
+     * @private
+     */
+    private cleanup?;
+    /**
+     * Unique ID for the dropdown for ARIA relationship
+     * @private
+     */
+    private dropdownId;
+    /**
+     * Updates the dropdown's position using Floating UI
+     * @private
+     */
+    private updatePosition;
+    /**
+     * Handles the click event for the trigger button
+     * @private
+     */
+    private handleClick;
+    /**
+     * Handles keyboard navigation for dropdown items
+     * @param event The keyboard event
+     * @private
+     */
+    private handleKeyDown;
+    /**
+     * Handles the click event for dropdown items
+     * @param event The click event
+     * @private
+     */
+    private handleItemClick;
+    /**
+     * Lifecycle method called after the component's first update
+     * @param _changedProperties Map of changed properties
+     * @private
+     */
+    firstUpdated(_changedProperties: PropertyValues): void;
+    /**
+     * Handles clicks outside of the dropdown to close it
+     * @param event The click event
+     * @private
+     */
+    private handleOutsideClick;
+    /**
+     * Cleans up the Floating UI autoUpdate subscription
+     * @private
+     */
+    private cleanupAutoUpdate;
+    /**
+     * Lifecycle method called when the component is removed from the DOM
+     * @private
+     */
+    disconnectedCallback(): void;
+    /**
+     * Renders the dropdown component
+     * @returns The rendered template
+     */
+    render(): import("lit-html").TemplateResult<1>;
+}
+export { PlusDropdown };
+//# sourceMappingURL=dropdown.d.ts.map

package/dist/components/dropdown/dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAU3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEpD;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,QAAQ;IAChD;;;OAGG;IAKH,KAAK,EAAG,gBAAgB,EAAE,CAAC;IAE3B;;;;;;OAMG;IAEH,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAEhC;;;;;;;;;OASG;IAEH,MAAM,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAC7D;IAEZ;;;;;;;OAOG;IAEH,IAAI,EAAE,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAY;IAE3D;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IAEH,OAAO,CAAC,SAAS,CAAS;IAE1B;;;OAGG;IACM,OAAO,CAAC,YAAY,CAAiC;IAE9D;;;OAGG;IACH,OAAO,CAAC,aAAa,CAA4B;IAEjD;;;OAGG;IACH,OAAO,CAAC,WAAW,CAA4B;IAE/C;;;OAGG;IACH,OAAO,CAAC,OAAO,CAAC,CAAa;IAE7B;;;OAGG;IACH,OAAO,CAAC,UAAU,CAA4D;IAE9E;;;OAGG;IACH,OAAO,CAAC,cAAc,CAmBpB;IAEF;;;OAGG;IACH,OAAO,CAAC,WAAW,CAoBjB;IAEF;;;;OAIG;IACH,OAAO,CAAC,aAAa,CAoCnB;IAEF;;;;OAIG;IACH,OAAO,CAAC,eAAe,CAcrB;IAEF;;;;OAIG;IACM,YAAY,CAAC,kBAAkB,EAAE,cAAc;IAyBxD;;;;OAIG;IACH,OAAO,CAAC,kBAAkB,CAWxB;IAEF;;;OAGG;IACH,OAAO,CAAC,iBAAiB;IAOzB;;;OAGG;IACM,oBAAoB;IAa7B;;;OAGG;IACM,MAAM;CAgChB;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/dropdown/dropdown.js

@@ -0,0 +1,332 @@
+import { _ as __decorate, n } from '../../property-DiPQx9S3.js';
+import { r } from '../../state-D1d5Sfj8.js';
+import { o } from '../../query-assigned-elements-B8Evmg7O.js';
+import Tailwind from '../base/tailwind-base.js';
+import { x } from '../../lit-element-ByzbtpGk.js';
+import { c as computePosition, o as offset, s as shift, f as flip, b as autoUpdate } from '../../floating-ui.dom-OBaMlALa.js';
+import { dropdownStyle } from './dropdown.style.js';
+import '../../base-Cl6v8-BZ.js';
+import '../../styles/global.js';
+import '../../style-inject.es-tgCJW-Cu.js';
+import '../../index-B9iart53.js';
+
+/**
+ * @tag plus-dropdown
+ *
+ * Dropdown component that provides a collapsible menu with selectable options.
+ * Uses Floating UI for intelligent positioning.
+ *
+ * @slot - The default slot for the dropdown trigger button content
+ * @slot suffix - Slot for adding content to the right side of the trigger button
+ * @slot dropdown-item - Slot for dropdown menu items
+ *
+ * @csspart base - The component's base wrapper
+ * @csspart button - The dropdown trigger button
+ * @csspart dropdown-box - The dropdown list container
+ *
+ * @event plus-dropdown-open - Emitted when the dropdown is opened
+ * @event plus-dropdown-close - Emitted when the dropdown is closed
+ * @event plus-dropdown-selected-item - Emitted when an item is selected with the selected item in detail
+ *
+ */
+class PlusDropdown extends Tailwind {
+    constructor() {
+        super(...arguments);
+        /**
+         * Sets the size of the dropdown button
+         * - sm: Small size
+         * - md: Medium size
+         * - lg: Large size
+         * @default 'md'
+         */
+        this.size = 'md';
+        /**
+         * Sets the status/color variant of the dropdown button
+         * - default: Neutral color scheme
+         * - primary: Primary color scheme
+         * - success: Green color scheme
+         * - warning: Yellow color scheme
+         * - danger: Red color scheme
+         * - info: Blue color scheme
+         * @default 'default'
+         */
+        this.status = 'default';
+        /**
+         * Determines the visual style of the dropdown button
+         * - filled: Solid background color
+         * - outlined: Transparent background with border
+         * - dashed: Transparent background with dashed border
+         * - text: No background or border
+         * @default 'filled'
+         */
+        this.kind = 'filled';
+        /**
+         * Disables the dropdown interaction
+         * @default false
+         */
+        this.disabled = false;
+        /**
+         * Tracks whether the dropdown is open or closed
+         * @private
+         */
+        this.isVisible = false;
+        /**
+         * Tracks the currently selected dropdown item
+         * @private
+         */
+        this.selectedItem = null;
+        /**
+         * Reference to the dropdown trigger button
+         * @private
+         */
+        this.targetElement = null;
+        /**
+         * Reference to the dropdown container
+         * @private
+         */
+        this.dropdownBox = null;
+        /**
+         * Unique ID for the dropdown for ARIA relationship
+         * @private
+         */
+        this.dropdownId = `dropdown-${Math.random().toString(36).substring(2, 9)}`;
+        /**
+         * Updates the dropdown's position using Floating UI
+         * @private
+         */
+        this.updatePosition = () => {
+            if (!this.dropdownBox || !this.targetElement)
+                return;
+            computePosition(this.targetElement, this.dropdownBox, {
+                placement: 'bottom-start',
+                middleware: [
+                    offset(4),
+                    shift({
+                        padding: 4,
+                        boundary: document.documentElement,
+                    }),
+                    flip({
+                        fallbackPlacements: ['top-start', 'bottom-start'],
+                        padding: 4,
+                    }),
+                ],
+            }).then(({ x, y }) => {
+                Object.assign(this.dropdownBox.style, { left: `${x}px`, top: `${y}px` });
+            });
+        };
+        /**
+         * Handles the click event for the trigger button
+         * @private
+         */
+        this.handleClick = () => {
+            if (this.disabled)
+                return;
+            this.isVisible = !this.isVisible;
+            if (this.isVisible) {
+                if (!this.targetElement || !this.dropdownBox) {
+                    console.error('Target element or dropdown box is not available');
+                    return;
+                }
+                this.updatePosition();
+                this.cleanup = autoUpdate(this.targetElement, this.dropdownBox, this.updatePosition);
+                this.emit('plus-dropdown-open');
+            }
+            else {
+                this.cleanupAutoUpdate();
+                this.emit('plus-dropdown-close');
+            }
+        };
+        /**
+         * Handles keyboard navigation for dropdown items
+         * @param event The keyboard event
+         * @private
+         */
+        this.handleKeyDown = (event) => {
+            if (this.disabled)
+                return;
+            const items = this.slots.filter((item) => !item.disabled);
+            const currentIndex = items.indexOf(this.selectedItem);
+            let newIndex = currentIndex;
+            switch (event.key) {
+                case 'ArrowDown':
+                    newIndex = (currentIndex + 1) % items.length;
+                    break;
+                case 'ArrowUp':
+                    newIndex = (currentIndex - 1 + items.length) % items.length;
+                    break;
+                case 'Enter':
+                case ' ':
+                    if (this.selectedItem) {
+                        this.handleItemClick(new Event('click'));
+                    }
+                    break;
+                case 'Escape':
+                    this.isVisible = false;
+                    this.cleanupAutoUpdate();
+                    break;
+                default:
+                    return;
+            }
+            if (newIndex !== currentIndex) {
+                this.selectedItem = items[newIndex];
+                this.slots.forEach((item) => {
+                    item.selected = item === this.selectedItem;
+                });
+            }
+            event.preventDefault();
+        };
+        /**
+         * Handles the click event for dropdown items
+         * @param event The click event
+         * @private
+         */
+        this.handleItemClick = (event) => {
+            const target = event.target;
+            const clickedItem = this.slots.find((item) => item.contains(target));
+            if (clickedItem && !clickedItem.disabled) {
+                this.selectedItem = clickedItem;
+                this.slots.forEach((item) => {
+                    item.selected = item === clickedItem;
+                });
+                this.emit('plus-dropdown-selected-item', {
+                    detail: { selectedItem: this.selectedItem },
+                });
+                this.isVisible = false;
+                this.cleanupAutoUpdate();
+            }
+        };
+        /**
+         * Handles clicks outside of the dropdown to close it
+         * @param event The click event
+         * @private
+         */
+        this.handleOutsideClick = (event) => {
+            const path = event.composedPath();
+            if (this.dropdownBox &&
+                this.targetElement &&
+                !path.includes(this.dropdownBox) &&
+                !path.includes(this.targetElement)) {
+                this.isVisible = false;
+                this.cleanupAutoUpdate();
+            }
+        };
+    }
+    /**
+     * Lifecycle method called after the component's first update
+     * @param _changedProperties Map of changed properties
+     * @private
+     */
+    firstUpdated(_changedProperties) {
+        super.firstUpdated(_changedProperties);
+        this.targetElement = this.shadowRoot?.querySelector('plus-button') || null;
+        this.dropdownBox = this.shadowRoot?.querySelector('.dropdown-box') || null;
+        if (this.dropdownBox) {
+            this.dropdownBox.addEventListener('click', this.handleItemClick);
+        }
+        this.slots.forEach((item) => {
+            item.size = this.size;
+        });
+        if (this.targetElement) {
+            this.targetElement.addEventListener('click', this.handleClick);
+            this.targetElement.addEventListener('keydown', this.handleKeyDown);
+        }
+        else {
+            console.error('Target element (plus-button) not found');
+        }
+        if (!this.dropdownBox) {
+            console.error('Dropdown box not found');
+        }
+        document.addEventListener('click', this.handleOutsideClick, true);
+    }
+    /**
+     * Cleans up the Floating UI autoUpdate subscription
+     * @private
+     */
+    cleanupAutoUpdate() {
+        if (this.cleanup) {
+            this.cleanup();
+            this.cleanup = undefined;
+        }
+    }
+    /**
+     * Lifecycle method called when the component is removed from the DOM
+     * @private
+     */
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.cleanupAutoUpdate();
+        if (this.targetElement) {
+            this.targetElement.removeEventListener('click', this.handleClick);
+            this.targetElement.removeEventListener('keydown', this.handleKeyDown);
+        }
+        if (this.dropdownBox) {
+            this.dropdownBox.removeEventListener('click', this.handleItemClick);
+        }
+        document.removeEventListener('click', this.handleOutsideClick, true);
+    }
+    /**
+     * Renders the dropdown component
+     * @returns The rendered template
+     */
+    render() {
+        return x `
+      <plus-button
+        ?disabled=${this.disabled}
+        kind=${this.kind}
+        status=${this.status}
+        size=${this.size}
+        aria-expanded=${this.isVisible}
+        aria-haspopup="listbox"
+        aria-controls=${this.dropdownId}
+        role="button"
+        part="button"
+        ><slot>${this.text}</slot>
+        <slot name="suffix">
+          <plus-svg-icon
+            iconName=${this.isVisible ? 'chevron-up' : 'chevron-down'}
+            size="sm"
+          ></plus-svg-icon>
+        </slot>
+      </plus-button>
+      <div
+        id=${this.dropdownId}
+        class=${dropdownStyle({ isOpen: this.isVisible })}
+        role="listbox"
+        aria-label="Dropdown options"
+        ?hidden=${!this.isVisible}
+        part="dropdown-box"
+      >
+        <slot name="dropdown-item"></slot>
+      </div>
+    `;
+    }
+}
+__decorate([
+    o({
+        selector: 'plus-dropdown-item',
+        slot: 'dropdown-item',
+    })
+], PlusDropdown.prototype, "slots", void 0);
+__decorate([
+    n({ type: String })
+], PlusDropdown.prototype, "size", void 0);
+__decorate([
+    n({ type: String })
+], PlusDropdown.prototype, "status", void 0);
+__decorate([
+    n({ type: String })
+], PlusDropdown.prototype, "kind", void 0);
+__decorate([
+    n({ type: Boolean })
+], PlusDropdown.prototype, "disabled", void 0);
+__decorate([
+    n({ type: String })
+], PlusDropdown.prototype, "text", void 0);
+__decorate([
+    r()
+], PlusDropdown.prototype, "isVisible", void 0);
+__decorate([
+    r()
+], PlusDropdown.prototype, "selectedItem", void 0);
+
+export { PlusDropdown, PlusDropdown as default };

package/dist/components/dropdown/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.ts"],"names":[],"mappings":"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"}

package/dist/components/dropdown/dropdown.style.d.ts

@@ -0,0 +1,37 @@
+export declare const dropdownStyle: import("tailwind-variants").TVReturnType<{
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}, undefined, string[], import("tailwind-variants/dist/config").TVConfig<{
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}, {
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}>, {
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}, undefined, string[], import("tailwind-variants/dist/config").TVConfig<{
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}, {
+    isOpen: {
+        true: string;
+        false: string;
+    };
+}>, unknown, unknown, undefined>>;
+//# sourceMappingURL=dropdown.style.d.ts.map

package/dist/components/dropdown/dropdown.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.style.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCAUxB,CAAC"}

package/dist/components/dropdown/dropdown.style.js

@@ -0,0 +1,15 @@
+import { c as ce } from '../../index-B9iart53.js';
+
+const dropdownStyle = ce({
+    base: [
+        'dropdown-box antialiased flex flex-col max-w-80 max-h-80 absolute z-10 w-full shadow-lg overflow-y-auto',
+    ],
+    variants: {
+        isOpen: {
+            true: '',
+            false: 'hidden',
+        },
+    },
+});
+
+export { dropdownStyle };

package/dist/components/dropdown/dropdown.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.style.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,MAAM,aAAa,GAAG,EAAE,CAAC;IAC9B,IAAI,EAAE;QACJ,yGAAyG;KAC1G;IACD,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,IAAI,EAAE,EAAE;YACR,KAAK,EAAE,QAAQ;SAChB;KACF;CACF,CAAC,CAAC"}

package/dist/components/dropdown/index.d.ts

@@ -0,0 +1,2 @@
+export * from './dropdown.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/dropdown/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/index.ts"],"names":[],"mappings":"AAEA,cAAc,eAAe,CAAC"}

package/dist/components/dropdown/index.js

@@ -0,0 +1,16 @@
+import PlusDropdown from './dropdown.js';
+import '../../property-DiPQx9S3.js';
+import '../../lit-element-ByzbtpGk.js';
+import '../../state-D1d5Sfj8.js';
+import '../../query-assigned-elements-B8Evmg7O.js';
+import '../../base-Cl6v8-BZ.js';
+import '../base/tailwind-base.js';
+import '../../styles/global.js';
+import '../../style-inject.es-tgCJW-Cu.js';
+import '../../floating-ui.dom-OBaMlALa.js';
+import './dropdown.style.js';
+import '../../index-B9iart53.js';
+
+customElements.define('plus-dropdown', PlusDropdown);
+
+export { PlusDropdown };

package/dist/components/dropdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,cAAc,eAAe,CAAC;AAE9B,cAAc,CAAC,MAAM,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC"}

package/dist/components/dropdown-item/dropdown-item.d.ts

@@ -0,0 +1,63 @@
+import Tailwind from '../base/tailwind-base';
+/**
+ * @tag plus-dropdown-item
+ *
+ * Dropdown item component that represents a selectable option within a dropdown menu.
+ * Automatically registers itself as a dropdown-item slot.
+ *
+ * @slot - The default slot for dropdown item content
+ *
+ * @csspart base - The component's base wrapper
+ * @csspart item - The listbox item element
+ *
+ * @event click - Emitted when the dropdown item is clicked
+ *
+ * @cssproperty --i-bg-default - Controls the default background color
+ * @cssproperty --i-bg-hovered - Controls the background color when hovered
+ * @cssproperty --i-bg-pressed - Controls the background color when pressed
+ * @cssproperty --i-text-color - Controls the text color
+ * @cssproperty --i-selected-bg - Controls the background color when selected
+ */
+export default class PlusDropDownItem extends Tailwind {
+    /**
+     * Sets the size of the dropdown item
+     * - sm: Small size
+     * - md: Medium size
+     * - lg: Large size
+     * @default 'md'
+     */
+    size: 'sm' | 'md' | 'lg';
+    /**
+     * Disables the dropdown item interaction
+     * When disabled, the item cannot be clicked or selected
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Indicates whether the dropdown item is currently selected
+     * The selected state is managed by the parent PlusDropdown component
+     * @default false
+     */
+    selected: boolean;
+    /**
+     * Sets the text content of the dropdown item
+     * If provided, this will be used as the item's content,
+     * and also as the aria-label for accessibility
+     */
+    text?: string;
+    /**
+     * Lifecycle method called when the component is added to the DOM
+     * Automatically sets itself to be slotted as a dropdown-item
+     * @private
+     */
+    connectedCallback(): void;
+    /**
+     * Renders the dropdown item
+     * Uses plus-list-box-item as the underlying component
+     * with proper ARIA attributes for accessibility
+     * @returns The rendered template
+     */
+    render(): import("lit-html").TemplateResult<1>;
+}
+export { PlusDropDownItem };
+//# sourceMappingURL=dropdown-item.d.ts.map

package/dist/components/dropdown-item/dropdown-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-item.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-item/dropdown-item.ts"],"names":[],"mappings":"AACA,OAAO,QAAQ,MAAM,uBAAuB,CAAC;AAK7C;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,OAAO,gBAAiB,SAAQ,QAAQ;IACpD;;;;;;OAMG;IAEH,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAEhC;;;;OAIG;IAMH,QAAQ,EAAE,OAAO,CAAS;IAE1B;;;;OAIG;IAMH,QAAQ,EAAE,OAAO,CAAS;IAE1B;;;;OAIG;IAEH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACM,iBAAiB,IAAI,IAAI;IAKlC;;;;;OAKG;IACM,MAAM;CAehB;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}