@smartsoft001/react 0.0.0-stage → 2.193.0

package/src/lib/components/drawer/preset/drawer-preset.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartDrawerPreset = SmartDrawerPreset;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const class_names_1 = require("../../../utils/class-names");
+const use_drawer_1 = require("../use-drawer");
+const preset_classes_1 = require("./preset-classes");
+/**
+ * Styled drawer (offcanvas) variation (preset). Register it as
+ * `components.drawer` on `SmartProvider` to restyle every `<SmartDrawer>`, or
+ * render it directly.
+ *
+ * A sliding side panel with a header (title + close button), a body slot and
+ * an optional backdrop. Open/close, side placement (`options.position`), width
+ * (`options.wide`), the backdrop (`options.withOverlay`) and the branded header
+ * (`options.brandedHeader`) are driven by props; no Preline JS runtime is used.
+ */
+function SmartDrawerPreset(props) {
+    const { title, options, className, children } = props;
+    const { open, close } = (0, use_drawer_1.useDrawer)(props);
+    if (!open)
+        return null;
+    const position = options?.position ?? 'right';
+    const brandedHeader = Boolean(options?.brandedHeader);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [options?.withOverlay && ((0, jsx_runtime_1.jsx)("div", { className: (0, preset_classes_1.getDrawerBackdropClasses)(), "aria-hidden": "true", onClick: close })), (0, jsx_runtime_1.jsxs)("aside", { role: "dialog", "aria-modal": "true", tabIndex: -1, className: (0, class_names_1.cn)((0, preset_classes_1.getDrawerPanelClasses)(position, Boolean(options?.wide)), className), "data-position": position, "aria-labelledby": title ? 'smart-drawer-preset-title' : undefined, children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, preset_classes_1.getDrawerHeaderClasses)(brandedHeader), children: [(0, jsx_runtime_1.jsx)("h3", { id: "smart-drawer-preset-title", className: (0, preset_classes_1.getDrawerTitleClasses)(brandedHeader), children: title }), (0, jsx_runtime_1.jsxs)("button", { type: "button", "aria-label": "Close", className: (0, preset_classes_1.getDrawerCloseClasses)(brandedHeader), onClick: close, children: [(0, jsx_runtime_1.jsx)("span", { className: "smart:sr-only", children: "Close" }), (0, jsx_runtime_1.jsxs)("svg", { className: "smart:shrink-0 smart:size-4", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [(0, jsx_runtime_1.jsx)("path", { d: "M18 6 6 18" }), (0, jsx_runtime_1.jsx)("path", { d: "m6 6 12 12" })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, preset_classes_1.getDrawerBodyClasses)(), children: children })] })] }));
+}
+//# sourceMappingURL=drawer-preset.js.map

package/src/lib/components/drawer/preset/drawer-preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-preset.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/drawer/preset/drawer-preset.tsx"],"names":[],"mappings":";;AAsBA,8CAiEC;;AAvFD,4DAAgD;AAEhD,8CAA0C;AAC1C,qDAO0B;AAE1B;;;;;;;;;GASG;AACH,SAAgB,iBAAiB,CAAC,KAAuB;IACvD,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACtD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAA,sBAAS,EAAC,KAAK,CAAC,CAAC;IAEzC,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,MAAM,QAAQ,GAAG,OAAO,EAAE,QAAQ,IAAI,OAAO,CAAC;IAC9C,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;IAEtD,OAAO,CACL,6DACG,OAAO,EAAE,WAAW,IAAI,CACvB,gCACE,SAAS,EAAE,IAAA,yCAAwB,GAAE,iBACzB,MAAM,EAClB,OAAO,EAAE,KAAK,GACd,CACH,EACD,mCACE,IAAI,EAAC,QAAQ,gBACF,MAAM,EACjB,QAAQ,EAAE,CAAC,CAAC,EACZ,SAAS,EAAE,IAAA,gBAAE,EACX,IAAA,sCAAqB,EAAC,QAAQ,EAAE,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,EACvD,SAAS,CACV,mBACc,QAAQ,qBACN,KAAK,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,SAAS,aAEhE,iCAAK,SAAS,EAAE,IAAA,uCAAsB,EAAC,aAAa,CAAC,aACnD,+BACE,EAAE,EAAC,2BAA2B,EAC9B,SAAS,EAAE,IAAA,sCAAqB,EAAC,aAAa,CAAC,YAE9C,KAAK,GACH,EACL,oCACE,IAAI,EAAC,QAAQ,gBACF,OAAO,EAClB,SAAS,EAAE,IAAA,sCAAqB,EAAC,aAAa,CAAC,EAC/C,OAAO,EAAE,KAAK,aAEd,iCAAM,SAAS,EAAC,eAAe,sBAAa,EAC5C,iCACE,SAAS,EAAC,6BAA6B,EACvC,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,iBACV,MAAM,aAElB,iCAAM,CAAC,EAAC,YAAY,GAAG,EACvB,iCAAM,CAAC,EAAC,YAAY,GAAG,IACnB,IACC,IACL,EACN,gCAAK,SAAS,EAAE,IAAA,qCAAoB,GAAE,YAAG,QAAQ,GAAO,IAClD,IACP,CACJ,CAAC;AACJ,CAAC"}

package/src/lib/components/drawer/preset/preset-classes.d.ts

@@ -0,0 +1,7 @@
+export type SmartDrawerPresetPosition = 'left' | 'right';
+export declare function getDrawerPanelClasses(position: SmartDrawerPresetPosition, wide: boolean): string;
+export declare function getDrawerBackdropClasses(): string;
+export declare function getDrawerHeaderClasses(branded: boolean): string;
+export declare function getDrawerTitleClasses(branded: boolean): string;
+export declare function getDrawerCloseClasses(branded: boolean): string;
+export declare function getDrawerBodyClasses(): string;

package/src/lib/components/drawer/preset/preset-classes.js

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDrawerPanelClasses = getDrawerPanelClasses;
+exports.getDrawerBackdropClasses = getDrawerBackdropClasses;
+exports.getDrawerHeaderClasses = getDrawerHeaderClasses;
+exports.getDrawerTitleClasses = getDrawerTitleClasses;
+exports.getDrawerCloseClasses = getDrawerCloseClasses;
+exports.getDrawerBodyClasses = getDrawerBodyClasses;
+const PANEL_BASE = [
+    'smart:fixed',
+    'smart:top-0',
+    'smart:h-full',
+    'smart:w-full',
+    'smart:z-50',
+    'smart:transition-all',
+    'smart:duration-300',
+    'smart:transform',
+    'smart:translate-x-0',
+    'smart:bg-white',
+    'smart:dark:bg-gray-800',
+].join(' ');
+const PANEL_BY_POSITION = {
+    right: 'smart:end-0 smart:border-s smart:border-gray-200 smart:dark:border-gray-700',
+    left: 'smart:start-0 smart:border-e smart:border-gray-200 smart:dark:border-gray-700',
+};
+const PANEL_WIDTH_DEFAULT = 'smart:max-w-xs';
+const PANEL_WIDTH_WIDE = 'smart:max-w-md';
+const BACKDROP = [
+    'smart:fixed',
+    'smart:inset-0',
+    'smart:z-40',
+    'smart:bg-gray-900/50',
+    'smart:dark:bg-gray-900/80',
+    'smart:transition-all',
+    'smart:duration-300',
+].join(' ');
+const HEADER_BASE = [
+    'smart:flex',
+    'smart:justify-between',
+    'smart:items-center',
+    'smart:py-3',
+    'smart:px-4',
+    'smart:border-b',
+].join(' ');
+const HEADER_PLAIN = 'smart:border-gray-200 smart:dark:border-gray-700';
+const HEADER_BRANDED = 'smart:bg-blue-600 smart:border-blue-700 smart:dark:bg-blue-500 smart:dark:border-blue-600';
+const TITLE_PLAIN = 'smart:font-semibold smart:text-gray-900 smart:dark:text-white';
+const TITLE_BRANDED = 'smart:font-semibold smart:text-white';
+const CLOSE_PLAIN = [
+    'smart:size-8',
+    'smart:inline-flex',
+    'smart:justify-center',
+    'smart:items-center',
+    'smart:gap-x-2',
+    'smart:rounded-full',
+    'smart:bg-gray-100',
+    'smart:border',
+    'smart:border-gray-200',
+    'smart:text-gray-800',
+    'smart:hover:bg-gray-200',
+    'smart:focus:outline-none',
+    'smart:focus:bg-gray-200',
+    'smart:disabled:opacity-50',
+    'smart:disabled:pointer-events-none',
+    'smart:dark:bg-gray-700',
+    'smart:dark:border-gray-600',
+    'smart:dark:text-gray-200',
+    'smart:dark:hover:bg-gray-600',
+].join(' ');
+const CLOSE_BRANDED = [
+    'smart:size-8',
+    'smart:inline-flex',
+    'smart:justify-center',
+    'smart:items-center',
+    'smart:gap-x-2',
+    'smart:rounded-full',
+    'smart:bg-white/10',
+    'smart:border',
+    'smart:border-white/20',
+    'smart:text-white',
+    'smart:hover:bg-white/20',
+    'smart:focus:outline-none',
+    'smart:focus:bg-white/20',
+    'smart:disabled:opacity-50',
+    'smart:disabled:pointer-events-none',
+].join(' ');
+const BODY = 'smart:p-4';
+function getDrawerPanelClasses(position, wide) {
+    const width = wide ? PANEL_WIDTH_WIDE : PANEL_WIDTH_DEFAULT;
+    return [PANEL_BASE, PANEL_BY_POSITION[position], width].join(' ');
+}
+function getDrawerBackdropClasses() {
+    return BACKDROP;
+}
+function getDrawerHeaderClasses(branded) {
+    return `${HEADER_BASE} ${branded ? HEADER_BRANDED : HEADER_PLAIN}`;
+}
+function getDrawerTitleClasses(branded) {
+    return branded ? TITLE_BRANDED : TITLE_PLAIN;
+}
+function getDrawerCloseClasses(branded) {
+    return branded ? CLOSE_BRANDED : CLOSE_PLAIN;
+}
+function getDrawerBodyClasses() {
+    return BODY;
+}
+//# sourceMappingURL=preset-classes.js.map

package/src/lib/components/drawer/preset/preset-classes.js.map

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

package/src/lib/components/drawer/standard/drawer-standard.d.ts

@@ -0,0 +1,3 @@
+import { SmartDrawerProps } from '../drawer.types';
+/** The default drawer rendering (`<smart-drawer-standard>`). */
+export declare function SmartDrawerStandard(props: SmartDrawerProps): import("react/jsx-runtime").JSX.Element | null;

package/src/lib/components/drawer/standard/drawer-standard.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartDrawerStandard = SmartDrawerStandard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const use_drawer_1 = require("../use-drawer");
+/** The default drawer rendering (`<smart-drawer-standard>`). */
+function SmartDrawerStandard(props) {
+    const { title, options, className, children } = props;
+    const { open, close } = (0, use_drawer_1.useDrawer)(props);
+    if (!open)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [options?.withOverlay && ((0, jsx_runtime_1.jsx)("div", { className: "drawer-overlay", onClick: close })), (0, jsx_runtime_1.jsxs)("aside", { role: "dialog", "aria-modal": "true", className: className, "data-position": options?.position ?? 'right', "aria-labelledby": title ? 'smart-drawer-title' : undefined, children: [title && ((0, jsx_runtime_1.jsxs)("header", { children: [(0, jsx_runtime_1.jsx)("h2", { id: "smart-drawer-title", children: title }), (0, jsx_runtime_1.jsx)("button", { type: "button", "aria-label": "Close", onClick: close, children: "\u00D7" })] })), children] })] }));
+}
+//# sourceMappingURL=drawer-standard.js.map

package/src/lib/components/drawer/standard/drawer-standard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-standard.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/drawer/standard/drawer-standard.tsx"],"names":[],"mappings":";;AAIA,kDA8BC;;AAjCD,8CAA0C;AAE1C,gEAAgE;AAChE,SAAgB,mBAAmB,CAAC,KAAuB;IACzD,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACtD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAA,sBAAS,EAAC,KAAK,CAAC,CAAC;IAEzC,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,OAAO,CACL,6DACG,OAAO,EAAE,WAAW,IAAI,CACvB,gCAAK,SAAS,EAAC,gBAAgB,EAAC,OAAO,EAAE,KAAK,GAAI,CACnD,EACD,mCACE,IAAI,EAAC,QAAQ,gBACF,MAAM,EACjB,SAAS,EAAE,SAAS,mBACL,OAAO,EAAE,QAAQ,IAAI,OAAO,qBAC1B,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,aAExD,KAAK,IAAI,CACR,+CACE,+BAAI,EAAE,EAAC,oBAAoB,YAAE,KAAK,GAAM,EACxC,mCAAQ,IAAI,EAAC,QAAQ,gBAAY,OAAO,EAAC,OAAO,EAAE,KAAK,uBAE9C,IACF,CACV,EACA,QAAQ,IACH,IACP,CACJ,CAAC;AACJ,CAAC"}

package/src/lib/components/drawer/use-drawer.d.ts

@@ -0,0 +1,12 @@
+import { SmartDrawerProps } from './drawer.types';
+/**
+ * The behaviour every drawer variant shares (the Angular
+ * `DrawerBaseComponent`): the `open` state, controlled through `open` /
+ * `onOpenChange` or kept internally from `defaultOpen`, and `close()`, which
+ * hides the drawer and reports `onClosed`.
+ */
+export declare function useDrawer({ open: openProp, defaultOpen, onOpenChange, onClosed, }: SmartDrawerProps): {
+    open: boolean;
+    setOpen: (value: boolean) => void;
+    close: () => void;
+};

package/src/lib/components/drawer/use-drawer.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDrawer = useDrawer;
+const react_1 = require("react");
+/**
+ * The behaviour every drawer variant shares (the Angular
+ * `DrawerBaseComponent`): the `open` state, controlled through `open` /
+ * `onOpenChange` or kept internally from `defaultOpen`, and `close()`, which
+ * hides the drawer and reports `onClosed`.
+ */
+function useDrawer({ open: openProp, defaultOpen = false, onOpenChange, onClosed, }) {
+    const [innerOpen, setInnerOpen] = (0, react_1.useState)(defaultOpen);
+    const controlled = openProp !== undefined;
+    const open = controlled ? openProp : innerOpen;
+    const setOpen = (0, react_1.useCallback)((value) => {
+        if (value === open)
+            return;
+        if (!controlled)
+            setInnerOpen(value);
+        onOpenChange?.(value);
+    }, [open, controlled, onOpenChange]);
+    const close = (0, react_1.useCallback)(() => {
+        setOpen(false);
+        onClosed?.();
+    }, [setOpen, onClosed]);
+    return { open, setOpen, close };
+}
+//# sourceMappingURL=use-drawer.js.map

package/src/lib/components/drawer/use-drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-drawer.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/drawer/use-drawer.ts"],"names":[],"mappings":";;AAUA,8BAyBC;AAnCD,iCAA8C;AAI9C;;;;;GAKG;AACH,SAAgB,SAAS,CAAC,EACxB,IAAI,EAAE,QAAQ,EACd,WAAW,GAAG,KAAK,EACnB,YAAY,EACZ,QAAQ,GACS;IACjB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,WAAW,CAAC,CAAC;IACxD,MAAM,UAAU,GAAG,QAAQ,KAAK,SAAS,CAAC;IAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAE/C,MAAM,OAAO,GAAG,IAAA,mBAAW,EACzB,CAAC,KAAc,EAAE,EAAE;QACjB,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO;QAC3B,IAAI,CAAC,UAAU;YAAE,YAAY,CAAC,KAAK,CAAC,CAAC;QACrC,YAAY,EAAE,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,EACD,CAAC,IAAI,EAAE,UAAU,EAAE,YAAY,CAAC,CACjC,CAAC;IAEF,MAAM,KAAK,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAC7B,OAAO,CAAC,KAAK,CAAC,CAAC;QACf,QAAQ,EAAE,EAAE,CAAC;IACf,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IAExB,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AAClC,CAAC"}

package/src/lib/components/dropdown/dropdown.d.ts

@@ -0,0 +1,10 @@
+import { SmartDropdownProps } from './dropdown.types';
+/**
+ * `<smart-dropdown>`: renders the implementation registered as
+ * `components.dropdown` on `SmartProvider` (the Angular
+ * `DROPDOWN_STANDARD_COMPONENT_TOKEN`), `SmartDropdownStandard` by default.
+ *
+ * The Angular `[(open)]` model is `open` + `onOpenChange`; leave `open`
+ * undefined for an uncontrolled dropdown (initial state from `defaultOpen`).
+ */
+export declare function SmartDropdown(props: SmartDropdownProps): import("react/jsx-runtime").JSX.Element;

package/src/lib/components/dropdown/dropdown.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartDropdown = SmartDropdown;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const dropdown_standard_1 = require("./standard/dropdown-standard");
+const hooks_1 = require("../../providers/hooks");
+/**
+ * `<smart-dropdown>`: renders the implementation registered as
+ * `components.dropdown` on `SmartProvider` (the Angular
+ * `DROPDOWN_STANDARD_COMPONENT_TOKEN`), `SmartDropdownStandard` by default.
+ *
+ * The Angular `[(open)]` model is `open` + `onOpenChange`; leave `open`
+ * undefined for an uncontrolled dropdown (initial state from `defaultOpen`).
+ */
+function SmartDropdown(props) {
+    const Component = (0, hooks_1.useSmartComponent)('dropdown', dropdown_standard_1.SmartDropdownStandard);
+    return (0, jsx_runtime_1.jsx)(Component, { ...props });
+}
+//# sourceMappingURL=dropdown.js.map

package/src/lib/components/dropdown/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/dropdown/dropdown.tsx"],"names":[],"mappings":";;AAYA,sCAIC;;AAfD,oEAAqE;AACrE,iDAA0D;AAE1D;;;;;;;GAOG;AACH,SAAgB,aAAa,CAAC,KAAyB;IACrD,MAAM,SAAS,GAAG,IAAA,yBAAiB,EAAC,UAAU,EAAE,yCAAqB,CAAC,CAAC;IAEvE,OAAO,uBAAC,SAAS,OAAK,KAAK,GAAI,CAAC;AAClC,CAAC"}

package/src/lib/components/dropdown/dropdown.types.d.ts

@@ -0,0 +1,23 @@
+import type { ReactNode } from 'react';
+import { IDropdownItem, IDropdownOptions } from '../../models';
+export interface SmartDropdownProps {
+    items?: IDropdownItem[];
+    /** Trigger text; without it the standard trigger renders `children`. */
+    triggerLabel?: string;
+    /**
+     * Whether the menu is shown (the Angular `open` model). Leave it
+     * `undefined` for an uncontrolled dropdown that starts from `defaultOpen`.
+     */
+    open?: boolean;
+    /** Initial `open` of an uncontrolled dropdown. */
+    defaultOpen?: boolean;
+    /** The `openChange` half of the Angular `[(open)]` binding. */
+    onOpenChange?: (open: boolean) => void;
+    options?: IDropdownOptions;
+    className?: string;
+    /** The Angular `selectedItem` output; the menu closes afterwards. */
+    onSelectedItem?: (value: {
+        itemId: string;
+    }) => void;
+    children?: ReactNode;
+}

package/src/lib/components/dropdown/dropdown.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=dropdown.types.js.map

package/src/lib/components/dropdown/dropdown.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.types.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/dropdown/dropdown.types.ts"],"names":[],"mappings":""}

package/src/lib/components/dropdown/index.d.ts

@@ -0,0 +1,6 @@
+export * from './dropdown';
+export * from './dropdown.types';
+export * from './preset/dropdown-preset';
+export * from './preset/preset-classes';
+export * from './standard/dropdown-standard';
+export * from './use-dropdown';

package/src/lib/components/dropdown/index.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./dropdown"), exports);
+tslib_1.__exportStar(require("./dropdown.types"), exports);
+tslib_1.__exportStar(require("./preset/dropdown-preset"), exports);
+tslib_1.__exportStar(require("./preset/preset-classes"), exports);
+tslib_1.__exportStar(require("./standard/dropdown-standard"), exports);
+tslib_1.__exportStar(require("./use-dropdown"), exports);
+//# sourceMappingURL=index.js.map

package/src/lib/components/dropdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/dropdown/index.ts"],"names":[],"mappings":";;;AAAA,qDAA2B;AAC3B,2DAAiC;AACjC,mEAAyC;AACzC,kEAAwC;AACxC,uEAA6C;AAC7C,yDAA+B"}

package/src/lib/components/dropdown/preset/dropdown-preset.d.ts

@@ -0,0 +1,14 @@
+import { SmartDropdownProps } from '../dropdown.types';
+/**
+ * Styled dropdown variation (preset). Register it as `components.dropdown` on
+ * `SmartProvider` to restyle every `<SmartDropdown>`, or render it directly.
+ *
+ * Open/close is driven by the shared `open` state and a click toggle;
+ * Preline's JS plugin is NOT used, but its visual classes and ARIA
+ * (`aria-haspopup` / `aria-expanded`) are preserved. Supports the shared
+ * `SmartDropdownVariant` set: `simple`, `with-dividers`, `with-icons`,
+ * `with-header` and a borderless `minimal` trigger (defaults to `simple`).
+ * The trigger shows `triggerLabel` (`Actions` without it); `children` are not
+ * rendered, as in Angular.
+ */
+export declare function SmartDropdownPreset(props: SmartDropdownProps): import("react/jsx-runtime").JSX.Element;

package/src/lib/components/dropdown/preset/dropdown-preset.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartDropdownPreset = SmartDropdownPreset;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const class_names_1 = require("../../../utils/class-names");
+const use_dropdown_1 = require("../use-dropdown");
+const preset_classes_1 = require("./preset-classes");
+/**
+ * Visible (non-divider) items, split into sections at each `divider` item when
+ * the with-dividers variant is active so each group renders in its own block.
+ */
+function toGroups(items, variant) {
+    if (variant !== 'with-dividers') {
+        return [items.filter((item) => !item.divider)];
+    }
+    const result = [];
+    let current = [];
+    for (const item of items) {
+        if (item.divider) {
+            if (current.length)
+                result.push(current);
+            current = [];
+        }
+        else {
+            current.push(item);
+        }
+    }
+    if (current.length)
+        result.push(current);
+    return result;
+}
+/**
+ * Styled dropdown variation (preset). Register it as `components.dropdown` on
+ * `SmartProvider` to restyle every `<SmartDropdown>`, or render it directly.
+ *
+ * Open/close is driven by the shared `open` state and a click toggle;
+ * Preline's JS plugin is NOT used, but its visual classes and ARIA
+ * (`aria-haspopup` / `aria-expanded`) are preserved. Supports the shared
+ * `SmartDropdownVariant` set: `simple`, `with-dividers`, `with-icons`,
+ * `with-header` and a borderless `minimal` trigger (defaults to `simple`).
+ * The trigger shows `triggerLabel` (`Actions` without it); `children` are not
+ * rendered, as in Angular.
+ */
+function SmartDropdownPreset(props) {
+    const { items = [], triggerLabel, options, className } = props;
+    const { open, toggle, selectItem } = (0, use_dropdown_1.useDropdown)(props);
+    const variant = options?.variant ?? 'simple';
+    const headerLabel = options?.headerLabel;
+    const showIcons = variant === 'with-icons' || variant === 'with-header';
+    const groups = (0, react_1.useMemo)(() => toGroups(items, variant), [items, variant]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, class_names_1.cn)(preset_classes_1.DROPDOWN_CONTAINER, className), children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", className: (0, preset_classes_1.getDropdownTriggerClasses)(variant), "aria-haspopup": "menu", "aria-expanded": open, "aria-label": triggerLabel ?? 'Dropdown', onClick: toggle, children: [triggerLabel ?? 'Actions', (0, jsx_runtime_1.jsx)("svg", { className: (0, preset_classes_1.getDropdownChevronClasses)(open), xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("path", { d: "m6 9 6 6 6-6" }) })] }), open && ((0, jsx_runtime_1.jsxs)("div", { className: (0, preset_classes_1.getDropdownMenuClasses)(variant), role: "menu", "aria-orientation": "vertical", children: [variant === 'with-header' && headerLabel && ((0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.DROPDOWN_HEADER, children: (0, jsx_runtime_1.jsx)("p", { className: preset_classes_1.DROPDOWN_HEADER_TEXT, children: headerLabel }) })), groups.map((group, index) => ((0, jsx_runtime_1.jsx)("div", { "data-role": "group", className: preset_classes_1.DROPDOWN_GROUP, children: group.map((item) => ((0, jsx_runtime_1.jsxs)("button", { type: "button", role: "menuitem", className: preset_classes_1.DROPDOWN_ITEM, disabled: item.disabled, onClick: () => selectItem(item.id), children: [showIcons && item.icon && ((0, jsx_runtime_1.jsx)("span", { className: preset_classes_1.DROPDOWN_ICON, "aria-hidden": "true", children: item.icon })), item.label] }, item.id))) }, index)))] }))] }));
+}
+//# sourceMappingURL=dropdown-preset.js.map

package/src/lib/components/dropdown/preset/dropdown-preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-preset.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/dropdown/preset/dropdown-preset.tsx"],"names":[],"mappings":";;AAyDA,kDAuEC;;AAhID,iCAAgC;AAGhC,4DAAgD;AAEhD,kDAA8C;AAC9C,qDAW0B;AAE1B;;;GAGG;AACH,SAAS,QAAQ,CACf,KAAsB,EACtB,OAAmC;IAEnC,IAAI,OAAO,KAAK,eAAe,EAAE,CAAC;QAChC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;IACjD,CAAC;IAED,MAAM,MAAM,GAAsB,EAAE,CAAC;IACrC,IAAI,OAAO,GAAoB,EAAE,CAAC;IAClC,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE,CAAC;QACzB,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,OAAO,CAAC,MAAM;gBAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACzC,OAAO,GAAG,EAAE,CAAC;QACf,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC;IACH,CAAC;IACD,IAAI,OAAO,CAAC,MAAM;QAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACzC,OAAO,MAAM,CAAC;AAChB,CAAC;AAED;;;;;;;;;;;GAWG;AACH,SAAgB,mBAAmB,CAAC,KAAyB;IAC3D,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC/D,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,0BAAW,EAAC,KAAK,CAAC,CAAC;IAExD,MAAM,OAAO,GAAG,OAAO,EAAE,OAAO,IAAI,QAAQ,CAAC;IAC7C,MAAM,WAAW,GAAG,OAAO,EAAE,WAAW,CAAC;IACzC,MAAM,SAAS,GAAG,OAAO,KAAK,YAAY,IAAI,OAAO,KAAK,aAAa,CAAC;IACxE,MAAM,MAAM,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC;IAEzE,OAAO,CACL,iCAAK,SAAS,EAAE,IAAA,gBAAE,EAAC,mCAAkB,EAAE,SAAS,CAAC,aAC/C,oCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAA,0CAAyB,EAAC,OAAO,CAAC,mBAC/B,MAAM,mBACL,IAAI,gBACP,YAAY,IAAI,UAAU,EACtC,OAAO,EAAE,MAAM,aAEd,YAAY,IAAI,SAAS,EAC1B,gCACE,SAAS,EAAE,IAAA,0CAAyB,EAAC,IAAI,CAAC,EAC1C,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,iBACV,MAAM,YAElB,iCAAM,CAAC,EAAC,cAAc,GAAG,GACrB,IACC,EAER,IAAI,IAAI,CACP,iCACE,SAAS,EAAE,IAAA,uCAAsB,EAAC,OAAO,CAAC,EAC1C,IAAI,EAAC,MAAM,sBACM,UAAU,aAE1B,OAAO,KAAK,aAAa,IAAI,WAAW,IAAI,CAC3C,gCAAK,SAAS,EAAE,gCAAe,YAC7B,8BAAG,SAAS,EAAE,qCAAoB,YAAG,WAAW,GAAK,GACjD,CACP,EACA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5B,6CAA2B,OAAO,EAAC,SAAS,EAAE,+BAAc,YACzD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,oCAEE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,UAAU,EACf,SAAS,EAAE,8BAAa,EACxB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,aAEjC,SAAS,IAAI,IAAI,CAAC,IAAI,IAAI,CACzB,iCAAM,SAAS,EAAE,8BAAa,iBAAc,MAAM,YAC/C,IAAI,CAAC,IAAI,GACL,CACR,EACA,IAAI,CAAC,KAAK,KAZN,IAAI,CAAC,EAAE,CAaL,CACV,CAAC,IAjBM,KAAK,CAkBT,CACP,CAAC,IACE,CACP,IACG,CACP,CAAC;AACJ,CAAC"}

package/src/lib/components/dropdown/preset/preset-classes.d.ts

@@ -0,0 +1,11 @@
+import { SmartDropdownVariant } from '../../../models';
+export type SmartDropdownPresetVariant = SmartDropdownVariant;
+export declare const DROPDOWN_CONTAINER = "smart:relative smart:inline-flex";
+export declare const DROPDOWN_GROUP = "smart:p-1 smart:space-y-0.5";
+export declare const DROPDOWN_ITEM: string;
+export declare const DROPDOWN_ICON: string;
+export declare const DROPDOWN_HEADER: string;
+export declare const DROPDOWN_HEADER_TEXT: string;
+export declare function getDropdownTriggerClasses(variant: SmartDropdownPresetVariant): string;
+export declare function getDropdownMenuClasses(variant: SmartDropdownPresetVariant): string;
+export declare function getDropdownChevronClasses(open: boolean): string;

package/src/lib/components/dropdown/preset/preset-classes.js

@@ -0,0 +1,117 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DROPDOWN_HEADER_TEXT = exports.DROPDOWN_HEADER = exports.DROPDOWN_ICON = exports.DROPDOWN_ITEM = exports.DROPDOWN_GROUP = exports.DROPDOWN_CONTAINER = void 0;
+exports.getDropdownTriggerClasses = getDropdownTriggerClasses;
+exports.getDropdownMenuClasses = getDropdownMenuClasses;
+exports.getDropdownChevronClasses = getDropdownChevronClasses;
+const TRIGGER_BASE = [
+    'smart:inline-flex',
+    'smart:items-center',
+    'smart:gap-x-2',
+    'smart:text-sm',
+    'smart:font-medium',
+    'smart:rounded-lg',
+    'smart:text-gray-800',
+    'smart:dark:text-gray-200',
+    'smart:hover:bg-gray-100',
+    'smart:dark:hover:bg-gray-700',
+    'smart:focus:outline-none',
+    'smart:focus:bg-gray-100',
+    'smart:dark:focus:bg-gray-700',
+    'smart:disabled:opacity-50',
+    'smart:disabled:pointer-events-none',
+].join(' ');
+// Solid (default) trigger: layered surface, border and subtle shadow.
+const TRIGGER_SOLID = [
+    'smart:py-3',
+    'smart:px-4',
+    'smart:bg-white',
+    'smart:dark:bg-gray-800',
+    'smart:border',
+    'smart:border-gray-200',
+    'smart:dark:border-gray-700',
+    'smart:shadow-2xs',
+].join(' ');
+// Minimal trigger: borderless ghost button (no Preline JS equivalent, kept faithful
+// to a "minimal" look — transparent until hovered/focused).
+const TRIGGER_MINIMAL = ['smart:py-2', 'smart:px-3'].join(' ');
+const MENU_BASE = [
+    'smart:absolute',
+    'smart:left-0',
+    'smart:top-full',
+    'smart:z-10',
+    'smart:mt-2',
+    'smart:min-w-60',
+    'smart:rounded-lg',
+    'smart:border',
+    'smart:border-gray-200',
+    'smart:dark:border-gray-700',
+    'smart:bg-white',
+    'smart:dark:bg-gray-800',
+    'smart:shadow-md',
+].join(' ');
+const MENU_DIVIDED = [
+    'smart:divide-y',
+    'smart:divide-gray-200',
+    'smart:dark:divide-gray-700',
+].join(' ');
+exports.DROPDOWN_CONTAINER = 'smart:relative smart:inline-flex';
+exports.DROPDOWN_GROUP = 'smart:p-1 smart:space-y-0.5';
+exports.DROPDOWN_ITEM = [
+    'smart:flex',
+    'smart:w-full',
+    'smart:items-center',
+    'smart:gap-x-3.5',
+    'smart:py-2',
+    'smart:px-3',
+    'smart:rounded-lg',
+    'smart:text-left',
+    'smart:text-sm',
+    'smart:text-gray-800',
+    'smart:dark:text-gray-200',
+    'smart:hover:bg-gray-100',
+    'smart:dark:hover:bg-gray-700',
+    'smart:focus:outline-none',
+    'smart:focus:bg-gray-100',
+    'smart:dark:focus:bg-gray-700',
+    'smart:disabled:opacity-50',
+    'smart:disabled:pointer-events-none',
+].join(' ');
+exports.DROPDOWN_ICON = [
+    'smart:shrink-0',
+    'smart:size-4',
+    'smart:inline-flex',
+    'smart:items-center',
+    'smart:justify-center',
+].join(' ');
+exports.DROPDOWN_HEADER = [
+    'smart:py-3',
+    'smart:px-4',
+    'smart:border-b',
+    'smart:border-gray-200',
+    'smart:dark:border-gray-700',
+].join(' ');
+exports.DROPDOWN_HEADER_TEXT = [
+    'smart:text-sm',
+    'smart:font-medium',
+    'smart:text-gray-900',
+    'smart:dark:text-white',
+].join(' ');
+const CHEVRON_BASE = [
+    'smart:size-4',
+    'smart:transition-transform',
+    'smart:duration-200',
+].join(' ');
+function getDropdownTriggerClasses(variant) {
+    const variantClass = variant === 'minimal' ? TRIGGER_MINIMAL : TRIGGER_SOLID;
+    return `${TRIGGER_BASE} ${variantClass}`;
+}
+function getDropdownMenuClasses(variant) {
+    return variant === 'with-dividers'
+        ? `${MENU_BASE} ${MENU_DIVIDED}`
+        : MENU_BASE;
+}
+function getDropdownChevronClasses(open) {
+    return open ? `${CHEVRON_BASE} smart:rotate-180` : CHEVRON_BASE;
+}
+//# sourceMappingURL=preset-classes.js.map

package/src/lib/components/dropdown/preset/preset-classes.js.map

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

package/src/lib/components/dropdown/standard/dropdown-standard.d.ts

@@ -0,0 +1,3 @@
+import { SmartDropdownProps } from '../dropdown.types';
+/** The default dropdown rendering (`<smart-dropdown-standard>`). */
+export declare function SmartDropdownStandard(props: SmartDropdownProps): import("react/jsx-runtime").JSX.Element;

package/src/lib/components/dropdown/standard/dropdown-standard.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartDropdownStandard = SmartDropdownStandard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const use_dropdown_1 = require("../use-dropdown");
+/** The default dropdown rendering (`<smart-dropdown-standard>`). */
+function SmartDropdownStandard(props) {
+    const { items = [], triggerLabel, options, className, children } = props;
+    const { open, toggle, selectItem } = (0, use_dropdown_1.useDropdown)(props);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: className, children: [(0, jsx_runtime_1.jsx)("button", { type: "button", className: "smart-dropdown-trigger", "aria-expanded": open, onClick: toggle, children: triggerLabel ? triggerLabel : children }), open && ((0, jsx_runtime_1.jsxs)("ul", { role: "menu", children: [options?.variant === 'with-header' && options?.headerLabel && ((0, jsx_runtime_1.jsx)("li", { role: "presentation", className: "smart-dropdown-header", children: options.headerLabel })), items.map((item) => item.divider ? ((0, jsx_runtime_1.jsx)("li", { role: "separator" }, item.id)) : ((0, jsx_runtime_1.jsx)("li", { role: "menuitem", children: (0, jsx_runtime_1.jsx)("button", { type: "button", disabled: item.disabled, onClick: () => selectItem(item.id), children: item.label }) }, item.id)))] }))] }));
+}
+//# sourceMappingURL=dropdown-standard.js.map

package/src/lib/components/dropdown/standard/dropdown-standard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-standard.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/dropdown/standard/dropdown-standard.tsx"],"names":[],"mappings":";;AAIA,sDAwCC;;AA3CD,kDAA8C;AAE9C,oEAAoE;AACpE,SAAgB,qBAAqB,CAAC,KAAyB;IAC7D,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACzE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,0BAAW,EAAC,KAAK,CAAC,CAAC;IAExD,OAAO,CACL,iCAAK,SAAS,EAAE,SAAS,aACvB,mCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,wBAAwB,mBACnB,IAAI,EACnB,OAAO,EAAE,MAAM,YAEd,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,GAChC,EACR,IAAI,IAAI,CACP,gCAAI,IAAI,EAAC,MAAM,aACZ,OAAO,EAAE,OAAO,KAAK,aAAa,IAAI,OAAO,EAAE,WAAW,IAAI,CAC7D,+BAAI,IAAI,EAAC,cAAc,EAAC,SAAS,EAAC,uBAAuB,YACtD,OAAO,CAAC,WAAW,GACjB,CACN,EACA,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAClB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACb,+BAAkB,IAAI,EAAC,WAAW,IAAzB,IAAI,CAAC,EAAE,CAAqB,CACtC,CAAC,CAAC,CAAC,CACF,+BAAkB,IAAI,EAAC,UAAU,YAC/B,mCACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,YAEjC,IAAI,CAAC,KAAK,GACJ,IAPF,IAAI,CAAC,EAAE,CAQX,CACN,CACF,IACE,CACN,IACG,CACP,CAAC;AACJ,CAAC"}

package/src/lib/components/dropdown/use-dropdown.d.ts

@@ -0,0 +1,15 @@
+import { SmartDropdownProps } from './dropdown.types';
+/**
+ * The behaviour every dropdown variant shares (the Angular
+ * `DropdownBaseComponent`): the `open` state, controlled through `open` /
+ * `onOpenChange` or kept internally from `defaultOpen`; `toggle()`,
+ * `close()`, and `selectItem(id)`, which reports `onSelectedItem` and closes
+ * the menu.
+ */
+export declare function useDropdown({ open: openProp, defaultOpen, onOpenChange, onSelectedItem, }: SmartDropdownProps): {
+    open: boolean;
+    setOpen: (value: boolean) => void;
+    toggle: () => void;
+    close: () => void;
+    selectItem: (itemId: string) => void;
+};

package/src/lib/components/dropdown/use-dropdown.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDropdown = useDropdown;
+const react_1 = require("react");
+/**
+ * The behaviour every dropdown variant shares (the Angular
+ * `DropdownBaseComponent`): the `open` state, controlled through `open` /
+ * `onOpenChange` or kept internally from `defaultOpen`; `toggle()`,
+ * `close()`, and `selectItem(id)`, which reports `onSelectedItem` and closes
+ * the menu.
+ */
+function useDropdown({ open: openProp, defaultOpen = false, onOpenChange, onSelectedItem, }) {
+    const [innerOpen, setInnerOpen] = (0, react_1.useState)(defaultOpen);
+    const controlled = openProp !== undefined;
+    const open = controlled ? openProp : innerOpen;
+    const setOpen = (0, react_1.useCallback)((value) => {
+        if (value === open)
+            return;
+        if (!controlled)
+            setInnerOpen(value);
+        onOpenChange?.(value);
+    }, [open, controlled, onOpenChange]);
+    const toggle = (0, react_1.useCallback)(() => setOpen(!open), [setOpen, open]);
+    const close = (0, react_1.useCallback)(() => setOpen(false), [setOpen]);
+    const selectItem = (0, react_1.useCallback)((itemId) => {
+        onSelectedItem?.({ itemId });
+        setOpen(false);
+    }, [onSelectedItem, setOpen]);
+    return { open, setOpen, toggle, close, selectItem };
+}
+//# sourceMappingURL=use-dropdown.js.map

package/src/lib/components/dropdown/use-dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-dropdown.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/dropdown/use-dropdown.ts"],"names":[],"mappings":";;AAWA,kCAgCC;AA3CD,iCAA8C;AAI9C;;;;;;GAMG;AACH,SAAgB,WAAW,CAAC,EAC1B,IAAI,EAAE,QAAQ,EACd,WAAW,GAAG,KAAK,EACnB,YAAY,EACZ,cAAc,GACK;IACnB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,WAAW,CAAC,CAAC;IACxD,MAAM,UAAU,GAAG,QAAQ,KAAK,SAAS,CAAC;IAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAE/C,MAAM,OAAO,GAAG,IAAA,mBAAW,EACzB,CAAC,KAAc,EAAE,EAAE;QACjB,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO;QAC3B,IAAI,CAAC,UAAU;YAAE,YAAY,CAAC,KAAK,CAAC,CAAC;QACrC,YAAY,EAAE,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,EACD,CAAC,IAAI,EAAE,UAAU,EAAE,YAAY,CAAC,CACjC,CAAC;IAEF,MAAM,MAAM,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;IAElE,MAAM,KAAK,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3D,MAAM,UAAU,GAAG,IAAA,mBAAW,EAC5B,CAAC,MAAc,EAAE,EAAE;QACjB,cAAc,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;QAC7B,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,EACD,CAAC,cAAc,EAAE,OAAO,CAAC,CAC1B,CAAC;IAEF,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC;AACtD,CAAC"}