@fragments-sdk/ui 0.9.0 → 0.9.2

package/dist/components/List/List.module.scss.js

@@ -0,0 +1,48 @@
+const list = "_list_16fbx_1";
+const none = "_none_16fbx_8";
+const disc = "_disc_16fbx_12";
+const decimal = "_decimal_16fbx_17";
+const icon = "_icon_16fbx_22";
+const gapNone = "_gap-none_16fbx_26";
+const gapXs = "_gap-xs_16fbx_30";
+const gapSm = "_gap-sm_16fbx_34";
+const gapMd = "_gap-md_16fbx_38";
+const gapLg = "_gap-lg_16fbx_42";
+const item = "_item_16fbx_46";
+const iconItem = "_iconItem_16fbx_50";
+const iconWrapper = "_iconWrapper_16fbx_56";
+const itemContent = "_itemContent_16fbx_64";
+const styles = {
+  list,
+  none,
+  disc,
+  decimal,
+  icon,
+  gapNone,
+  gapXs,
+  gapSm,
+  gapMd,
+  gapLg,
+  item,
+  iconItem,
+  iconWrapper,
+  itemContent
+};
+export {
+  decimal,
+  styles as default,
+  disc,
+  gapLg,
+  gapMd,
+  gapNone,
+  gapSm,
+  gapXs,
+  icon,
+  iconItem,
+  iconWrapper,
+  item,
+  itemContent,
+  list,
+  none
+};
+//# sourceMappingURL=List.module.scss.js.map

package/dist/components/List/List.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/List/index.cjs

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const List_module = require("./List.module.scss.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const ListContext = React__namespace.createContext({ variant: "disc" });
+function useListContext() {
+  return React__namespace.useContext(ListContext);
+}
+function ListRoot({
+  children,
+  as: Component = "ul",
+  variant = "disc",
+  gap = "sm",
+  className,
+  style,
+  ...htmlProps
+}) {
+  const classes = [
+    List_module.default.list,
+    List_module.default[variant],
+    List_module.default[`gap-${gap}`],
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx(ListContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ...htmlProps, className: classes, style, children }) });
+}
+function ListItem({ children, icon, className, style, ...htmlProps }) {
+  const { variant } = useListContext();
+  const classes = [
+    List_module.default.item,
+    variant === "icon" && List_module.default.iconItem,
+    className
+  ].filter(Boolean).join(" ");
+  if (variant === "icon" && icon) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("li", { ...htmlProps, className: classes, style, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: List_module.default.iconWrapper, children: icon }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: List_module.default.itemContent, children })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("li", { ...htmlProps, className: classes, style, children });
+}
+const List = Object.assign(ListRoot, {
+  Item: ListItem
+});
+exports.List = List;
+exports.ListItem = ListItem;
+exports.ListRoot = ListRoot;
+exports.useListContext = useListContext;
+//# sourceMappingURL=index.cjs.map

package/dist/components/List/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/List/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './List.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport interface ListProps extends React.HTMLAttributes<HTMLUListElement | HTMLOListElement> {\n  children: React.ReactNode;\n  /** List type */\n  as?: 'ul' | 'ol';\n  /** List style variant */\n  variant?: 'none' | 'disc' | 'decimal' | 'icon';\n  /** Spacing between items */\n  gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg';\n}\n\nexport interface ListItemProps extends React.HTMLAttributes<HTMLLIElement> {\n  children: React.ReactNode;\n  /** Icon to display (only used with variant=\"icon\") */\n  icon?: React.ReactNode;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface ListContextValue {\n  variant: NonNullable<ListProps['variant']>;\n}\n\nconst ListContext = React.createContext<ListContextValue>({ variant: 'disc' });\n\nfunction useListContext() {\n  return React.useContext(ListContext);\n}\n\n// ============================================\n// Components\n// ============================================\n\nfunction ListRoot({\n  children,\n  as: Component = 'ul',\n  variant = 'disc',\n  gap = 'sm',\n  className,\n  style,\n  ...htmlProps\n}: ListProps) {\n  const classes = [\n    styles.list,\n    styles[variant],\n    styles[`gap-${gap}`],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <ListContext.Provider value={{ variant }}>\n      <Component {...htmlProps} className={classes} style={style}>\n        {children}\n      </Component>\n    </ListContext.Provider>\n  );\n}\n\nfunction ListItem({ children, icon, className, style, ...htmlProps }: ListItemProps) {\n  const { variant } = useListContext();\n\n  const classes = [\n    styles.item,\n    variant === 'icon' && styles.iconItem,\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  if (variant === 'icon' && icon) {\n    return (\n      <li {...htmlProps} className={classes} style={style}>\n        <span className={styles.iconWrapper}>{icon}</span>\n        <span className={styles.itemContent}>{children}</span>\n      </li>\n    );\n  }\n\n  return (\n    <li {...htmlProps} className={classes} style={style}>\n      {children}\n    </li>\n  );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const List = Object.assign(ListRoot, {\n  Item: ListItem,\n});\n\n// Re-export individual components for tree-shaking\nexport { ListRoot, ListItem, useListContext };\n"],"names":["React","styles","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAM,cAAcA,iBAAM,cAAgC,EAAE,SAAS,QAAQ;AAE7E,SAAS,iBAAiB;AACxB,SAAOA,iBAAM,WAAW,WAAW;AACrC;AAMA,SAAS,SAAS;AAAA,EAChB;AAAA,EACA,IAAI,YAAY;AAAA,EAChB,UAAU;AAAA,EACV,MAAM;AAAA,EACN;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAc;AACZ,QAAM,UAAU;AAAA,IACdC,YAAAA,QAAO;AAAA,IACPA,YAAAA,QAAO,OAAO;AAAA,IACdA,YAAAA,QAAO,OAAO,GAAG,EAAE;AAAA,IACnB;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,wCACG,YAAY,UAAZ,EAAqB,OAAO,EAAE,QAAA,GAC7B,UAAAC,2BAAAA,IAAC,WAAA,EAAW,GAAG,WAAW,WAAW,SAAS,OAC3C,UACH,GACF;AAEJ;AAEA,SAAS,SAAS,EAAE,UAAU,MAAM,WAAW,OAAO,GAAG,aAA4B;AACnF,QAAM,EAAE,QAAA,IAAY,eAAA;AAEpB,QAAM,UAAU;AAAA,IACdD,YAAAA,QAAO;AAAA,IACP,YAAY,UAAUA,YAAAA,QAAO;AAAA,IAC7B;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,MAAI,YAAY,UAAU,MAAM;AAC9B,2CACG,MAAA,EAAI,GAAG,WAAW,WAAW,SAAS,OACrC,UAAA;AAAA,MAAAC,2BAAAA,IAAC,QAAA,EAAK,WAAWD,YAAAA,QAAO,aAAc,UAAA,MAAK;AAAA,MAC3CC,2BAAAA,IAAC,QAAA,EAAK,WAAWD,YAAAA,QAAO,aAAc,SAAA,CAAS;AAAA,IAAA,GACjD;AAAA,EAEJ;AAEA,wCACG,MAAA,EAAI,GAAG,WAAW,WAAW,SAAS,OACpC,UACH;AAEJ;AAMO,MAAM,OAAO,OAAO,OAAO,UAAU;AAAA,EAC1C,MAAM;AACR,CAAC;;;;;"}

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

@@ -0,0 +1,26 @@
+import * as React from 'react';
+export interface ListProps extends React.HTMLAttributes<HTMLUListElement | HTMLOListElement> {
+    children: React.ReactNode;
+    /** List type */
+    as?: 'ul' | 'ol';
+    /** List style variant */
+    variant?: 'none' | 'disc' | 'decimal' | 'icon';
+    /** Spacing between items */
+    gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg';
+}
+export interface ListItemProps extends React.HTMLAttributes<HTMLLIElement> {
+    children: React.ReactNode;
+    /** Icon to display (only used with variant="icon") */
+    icon?: React.ReactNode;
+}
+interface ListContextValue {
+    variant: NonNullable<ListProps['variant']>;
+}
+declare function useListContext(): ListContextValue;
+declare function ListRoot({ children, as: Component, variant, gap, className, style, ...htmlProps }: ListProps): import("react/jsx-runtime").JSX.Element;
+declare function ListItem({ children, icon, className, style, ...htmlProps }: ListItemProps): import("react/jsx-runtime").JSX.Element;
+export declare const List: typeof ListRoot & {
+    Item: typeof ListItem;
+};
+export { ListRoot, ListItem, useListContext };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/List/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;IAC1F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,gBAAgB;IAChB,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACjB,yBAAyB;IACzB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;IAC/C,4BAA4B;IAC5B,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC1C;AAED,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;IACxE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,sDAAsD;IACtD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAMD,UAAU,gBAAgB;IACxB,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;CAC5C;AAID,iBAAS,cAAc,qBAEtB;AAMD,iBAAS,QAAQ,CAAC,EAChB,QAAQ,EACR,EAAE,EAAE,SAAgB,EACpB,OAAgB,EAChB,GAAU,EACV,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EACb,EAAE,SAAS,2CAiBX;AAED,iBAAS,QAAQ,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,2CAyBlF;AAMD,eAAO,MAAM,IAAI;;CAEf,CAAC;AAGH,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/List/index.js

@@ -0,0 +1,49 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import styles from "./List.module.scss.js";
+const ListContext = React.createContext({ variant: "disc" });
+function useListContext() {
+  return React.useContext(ListContext);
+}
+function ListRoot({
+  children,
+  as: Component = "ul",
+  variant = "disc",
+  gap = "sm",
+  className,
+  style,
+  ...htmlProps
+}) {
+  const classes = [
+    styles.list,
+    styles[variant],
+    styles[`gap-${gap}`],
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(ListContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsx(Component, { ...htmlProps, className: classes, style, children }) });
+}
+function ListItem({ children, icon, className, style, ...htmlProps }) {
+  const { variant } = useListContext();
+  const classes = [
+    styles.item,
+    variant === "icon" && styles.iconItem,
+    className
+  ].filter(Boolean).join(" ");
+  if (variant === "icon" && icon) {
+    return /* @__PURE__ */ jsxs("li", { ...htmlProps, className: classes, style, children: [
+      /* @__PURE__ */ jsx("span", { className: styles.iconWrapper, children: icon }),
+      /* @__PURE__ */ jsx("span", { className: styles.itemContent, children })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("li", { ...htmlProps, className: classes, style, children });
+}
+const List = Object.assign(ListRoot, {
+  Item: ListItem
+});
+export {
+  List,
+  ListItem,
+  ListRoot,
+  useListContext
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/List/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './List.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport interface ListProps extends React.HTMLAttributes<HTMLUListElement | HTMLOListElement> {\n  children: React.ReactNode;\n  /** List type */\n  as?: 'ul' | 'ol';\n  /** List style variant */\n  variant?: 'none' | 'disc' | 'decimal' | 'icon';\n  /** Spacing between items */\n  gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg';\n}\n\nexport interface ListItemProps extends React.HTMLAttributes<HTMLLIElement> {\n  children: React.ReactNode;\n  /** Icon to display (only used with variant=\"icon\") */\n  icon?: React.ReactNode;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface ListContextValue {\n  variant: NonNullable<ListProps['variant']>;\n}\n\nconst ListContext = React.createContext<ListContextValue>({ variant: 'disc' });\n\nfunction useListContext() {\n  return React.useContext(ListContext);\n}\n\n// ============================================\n// Components\n// ============================================\n\nfunction ListRoot({\n  children,\n  as: Component = 'ul',\n  variant = 'disc',\n  gap = 'sm',\n  className,\n  style,\n  ...htmlProps\n}: ListProps) {\n  const classes = [\n    styles.list,\n    styles[variant],\n    styles[`gap-${gap}`],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <ListContext.Provider value={{ variant }}>\n      <Component {...htmlProps} className={classes} style={style}>\n        {children}\n      </Component>\n    </ListContext.Provider>\n  );\n}\n\nfunction ListItem({ children, icon, className, style, ...htmlProps }: ListItemProps) {\n  const { variant } = useListContext();\n\n  const classes = [\n    styles.item,\n    variant === 'icon' && styles.iconItem,\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  if (variant === 'icon' && icon) {\n    return (\n      <li {...htmlProps} className={classes} style={style}>\n        <span className={styles.iconWrapper}>{icon}</span>\n        <span className={styles.itemContent}>{children}</span>\n      </li>\n    );\n  }\n\n  return (\n    <li {...htmlProps} className={classes} style={style}>\n      {children}\n    </li>\n  );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const List = Object.assign(ListRoot, {\n  Item: ListItem,\n});\n\n// Re-export individual components for tree-shaking\nexport { ListRoot, ListItem, useListContext };\n"],"names":[],"mappings":";;;AAiCA,MAAM,cAAc,MAAM,cAAgC,EAAE,SAAS,QAAQ;AAE7E,SAAS,iBAAiB;AACxB,SAAO,MAAM,WAAW,WAAW;AACrC;AAMA,SAAS,SAAS;AAAA,EAChB;AAAA,EACA,IAAI,YAAY;AAAA,EAChB,UAAU;AAAA,EACV,MAAM;AAAA,EACN;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAc;AACZ,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,IACP,OAAO,OAAO;AAAA,IACd,OAAO,OAAO,GAAG,EAAE;AAAA,IACnB;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,6BACG,YAAY,UAAZ,EAAqB,OAAO,EAAE,QAAA,GAC7B,UAAA,oBAAC,WAAA,EAAW,GAAG,WAAW,WAAW,SAAS,OAC3C,UACH,GACF;AAEJ;AAEA,SAAS,SAAS,EAAE,UAAU,MAAM,WAAW,OAAO,GAAG,aAA4B;AACnF,QAAM,EAAE,QAAA,IAAY,eAAA;AAEpB,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,IACP,YAAY,UAAU,OAAO;AAAA,IAC7B;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,MAAI,YAAY,UAAU,MAAM;AAC9B,gCACG,MAAA,EAAI,GAAG,WAAW,WAAW,SAAS,OACrC,UAAA;AAAA,MAAA,oBAAC,QAAA,EAAK,WAAW,OAAO,aAAc,UAAA,MAAK;AAAA,MAC3C,oBAAC,QAAA,EAAK,WAAW,OAAO,aAAc,SAAA,CAAS;AAAA,IAAA,GACjD;AAAA,EAEJ;AAEA,6BACG,MAAA,EAAI,GAAG,WAAW,WAAW,SAAS,OACpC,UACH;AAEJ;AAMO,MAAM,OAAO,OAAO,OAAO,UAAU;AAAA,EAC1C,MAAM;AACR,CAAC;"}

package/dist/components/Listbox/Listbox.module.scss.cjs

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const listbox = "_listbox_1b0sq_1";
+const item = "_item_1b0sq_16";
+const itemSelected = "_itemSelected_1b0sq_57";
+const itemActive = "_itemActive_1b0sq_61";
+const itemDisabled = "_itemDisabled_1b0sq_65";
+const group = "_group_1b0sq_70";
+const groupLabel = "_groupLabel_1b0sq_76";
+const empty = "_empty_1b0sq_83";
+const styles = {
+  listbox,
+  item,
+  itemSelected,
+  itemActive,
+  itemDisabled,
+  group,
+  groupLabel,
+  empty
+};
+exports.default = styles;
+exports.empty = empty;
+exports.group = group;
+exports.groupLabel = groupLabel;
+exports.item = item;
+exports.itemActive = itemActive;
+exports.itemDisabled = itemDisabled;
+exports.itemSelected = itemSelected;
+exports.listbox = listbox;
+//# sourceMappingURL=Listbox.module.scss.cjs.map

package/dist/components/Listbox/Listbox.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Listbox.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Listbox/Listbox.module.scss.js

@@ -0,0 +1,30 @@
+const listbox = "_listbox_1b0sq_1";
+const item = "_item_1b0sq_16";
+const itemSelected = "_itemSelected_1b0sq_57";
+const itemActive = "_itemActive_1b0sq_61";
+const itemDisabled = "_itemDisabled_1b0sq_65";
+const group = "_group_1b0sq_70";
+const groupLabel = "_groupLabel_1b0sq_76";
+const empty = "_empty_1b0sq_83";
+const styles = {
+  listbox,
+  item,
+  itemSelected,
+  itemActive,
+  itemDisabled,
+  group,
+  groupLabel,
+  empty
+};
+export {
+  styles as default,
+  empty,
+  group,
+  groupLabel,
+  item,
+  itemActive,
+  itemDisabled,
+  itemSelected,
+  listbox
+};
+//# sourceMappingURL=Listbox.module.scss.js.map

package/dist/components/Listbox/Listbox.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Listbox.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;"}

package/dist/components/Listbox/index.cjs

@@ -0,0 +1,237 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const Listbox_module = require("./Listbox.module.scss.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const ListboxContext = React__namespace.createContext(null);
+function ListboxRoot({
+  children,
+  className,
+  style,
+  "aria-label": ariaLabel,
+  tabIndex,
+  onKeyDown,
+  onFocus,
+  ...htmlProps
+}) {
+  const classes = [Listbox_module.default.listbox, className].filter(Boolean).join(" ");
+  const listboxRef = React__namespace.useRef(null);
+  const [activeId, setActiveId] = React__namespace.useState(null);
+  const getEnabledOptions = React__namespace.useCallback(() => {
+    const listbox = listboxRef.current;
+    if (!listbox) return [];
+    return Array.from(
+      listbox.querySelectorAll('[role="option"]')
+    ).filter((option) => option.getAttribute("aria-disabled") !== "true");
+  }, []);
+  const moveActive = React__namespace.useCallback(
+    (direction) => {
+      const options = getEnabledOptions();
+      if (options.length === 0) return;
+      if (direction === "first") {
+        setActiveId(options[0].id);
+        return;
+      }
+      if (direction === "last") {
+        setActiveId(options[options.length - 1].id);
+        return;
+      }
+      const currentIndex = activeId ? options.findIndex((option) => option.id === activeId) : -1;
+      if (direction === "next") {
+        const nextIndex = currentIndex < 0 ? 0 : (currentIndex + 1) % options.length;
+        setActiveId(options[nextIndex].id);
+      } else {
+        const prevIndex = currentIndex < 0 ? options.length - 1 : (currentIndex - 1 + options.length) % options.length;
+        setActiveId(options[prevIndex].id);
+      }
+    },
+    [activeId, getEnabledOptions]
+  );
+  React__namespace.useEffect(() => {
+    if (!activeId) return;
+    const listbox = listboxRef.current;
+    if (!listbox) return;
+    const escapedId = typeof CSS !== "undefined" && typeof CSS.escape === "function" ? CSS.escape(activeId) : activeId.replace(/["\\]/g, "\\$&");
+    const activeOption = listbox.querySelector(`#${escapedId}`);
+    if (!activeOption) return;
+    const frame = window.requestAnimationFrame(() => {
+      activeOption.scrollIntoView({ block: "nearest" });
+    });
+    return () => {
+      window.cancelAnimationFrame(frame);
+    };
+  }, [activeId]);
+  const selectActiveItem = React__namespace.useCallback(() => {
+    if (!activeId) return;
+    const listbox = listboxRef.current;
+    if (!listbox) return;
+    const escapedId = typeof CSS !== "undefined" && typeof CSS.escape === "function" ? CSS.escape(activeId) : activeId.replace(/["\\]/g, "\\$&");
+    const activeOption = listbox.querySelector(`#${escapedId}`);
+    if (activeOption && activeOption.getAttribute("aria-disabled") !== "true") {
+      activeOption.click();
+    }
+  }, [activeId]);
+  const setDefaultActiveIfNeeded = React__namespace.useCallback(() => {
+    if (activeId) return;
+    const options = getEnabledOptions();
+    if (options.length === 0) return;
+    const selectedOption = options.find((option) => option.getAttribute("aria-selected") === "true");
+    setActiveId((selectedOption ?? options[0]).id);
+  }, [activeId, getEnabledOptions]);
+  const handleKeyDown = (event) => {
+    onKeyDown == null ? void 0 : onKeyDown(event);
+    if (event.defaultPrevented) return;
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        moveActive("next");
+        break;
+      case "ArrowUp":
+        event.preventDefault();
+        moveActive("prev");
+        break;
+      case "Home":
+        event.preventDefault();
+        moveActive("first");
+        break;
+      case "End":
+        event.preventDefault();
+        moveActive("last");
+        break;
+      case "Enter":
+      case " ":
+        event.preventDefault();
+        selectActiveItem();
+        break;
+    }
+  };
+  const handleFocus = (event) => {
+    setDefaultActiveIfNeeded();
+    onFocus == null ? void 0 : onFocus(event);
+  };
+  const contextValue = React__namespace.useMemo(
+    () => ({
+      activeId,
+      setActiveId
+    }),
+    [activeId]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(ListboxContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref: listboxRef,
+      ...htmlProps,
+      role: "listbox",
+      "aria-label": ariaLabel,
+      "aria-activedescendant": activeId ?? void 0,
+      tabIndex: tabIndex ?? 0,
+      className: classes,
+      style,
+      onKeyDown: handleKeyDown,
+      onFocus: handleFocus,
+      children
+    }
+  ) });
+}
+function ListboxItem({
+  children,
+  selected = false,
+  disabled = false,
+  onClick,
+  onMouseEnter,
+  className,
+  style,
+  ...htmlProps
+}) {
+  const context = React__namespace.useContext(ListboxContext);
+  const generatedId = React__namespace.useId();
+  const itemId = htmlProps.id ?? `listbox-item-${generatedId}`;
+  const classes = [
+    Listbox_module.default.item,
+    selected && Listbox_module.default.itemSelected,
+    disabled && Listbox_module.default.itemDisabled,
+    (context == null ? void 0 : context.activeId) === itemId && Listbox_module.default.itemActive,
+    className
+  ].filter(Boolean).join(" ");
+  const handleMouseEnter = (event) => {
+    if (!disabled) {
+      context == null ? void 0 : context.setActiveId(itemId);
+    }
+    onMouseEnter == null ? void 0 : onMouseEnter(event);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...htmlProps,
+      id: itemId,
+      role: "option",
+      "aria-selected": selected,
+      "aria-disabled": disabled,
+      "data-active": (context == null ? void 0 : context.activeId) === itemId || void 0,
+      onClick: disabled ? void 0 : onClick,
+      onMouseEnter: handleMouseEnter,
+      className: classes,
+      style,
+      children
+    }
+  );
+}
+function ListboxGroup({ children, label, className, ...htmlProps }) {
+  const classes = [Listbox_module.default.group, className].filter(Boolean).join(" ");
+  const labelId = React__namespace.useId();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ...htmlProps,
+      role: "group",
+      "aria-labelledby": label ? labelId : void 0,
+      className: classes,
+      children: [
+        label && /* @__PURE__ */ jsxRuntime.jsx("div", { id: labelId, className: Listbox_module.default.groupLabel, children: label }),
+        children
+      ]
+    }
+  );
+}
+function ListboxEmpty({ children, className, ...htmlProps }) {
+  const classes = [Listbox_module.default.empty, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...htmlProps,
+      role: "option",
+      "aria-disabled": "true",
+      "aria-selected": "false",
+      className: classes,
+      children
+    }
+  );
+}
+const Listbox = Object.assign(ListboxRoot, {
+  Item: ListboxItem,
+  Group: ListboxGroup,
+  Empty: ListboxEmpty
+});
+exports.Listbox = Listbox;
+exports.ListboxEmpty = ListboxEmpty;
+exports.ListboxGroup = ListboxGroup;
+exports.ListboxItem = ListboxItem;
+exports.ListboxRoot = ListboxRoot;
+//# sourceMappingURL=index.cjs.map

package/dist/components/Listbox/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/Listbox/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Listbox.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport interface ListboxProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\nexport interface ListboxItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick'> {\n  children: React.ReactNode;\n  /** Whether this item is currently selected/highlighted */\n  selected?: boolean;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Click handler */\n  onClick?: () => void;\n}\n\nexport interface ListboxGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n  /** Group label */\n  label?: string;\n}\n\nexport interface ListboxEmptyProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\ninterface ListboxContextValue {\n  activeId: string | null;\n  setActiveId: (id: string | null) => void;\n}\n\nconst ListboxContext = React.createContext<ListboxContextValue | null>(null);\n\n// ============================================\n// Components\n// ============================================\n\nfunction ListboxRoot({\n  children,\n  className,\n  style,\n  'aria-label': ariaLabel,\n  tabIndex,\n  onKeyDown,\n  onFocus,\n  ...htmlProps\n}: ListboxProps) {\n  const classes = [styles.listbox, className].filter(Boolean).join(' ');\n  const listboxRef = React.useRef<HTMLDivElement>(null);\n  const [activeId, setActiveId] = React.useState<string | null>(null);\n\n  const getEnabledOptions = React.useCallback(() => {\n    const listbox = listboxRef.current;\n    if (!listbox) return [] as HTMLDivElement[];\n\n    return Array.from(\n      listbox.querySelectorAll<HTMLDivElement>('[role=\"option\"]')\n    ).filter((option) => option.getAttribute('aria-disabled') !== 'true');\n  }, []);\n\n  const moveActive = React.useCallback(\n    (direction: 'next' | 'prev' | 'first' | 'last') => {\n      const options = getEnabledOptions();\n      if (options.length === 0) return;\n\n      if (direction === 'first') {\n        setActiveId(options[0].id);\n        return;\n      }\n\n      if (direction === 'last') {\n        setActiveId(options[options.length - 1].id);\n        return;\n      }\n\n      const currentIndex = activeId\n        ? options.findIndex((option) => option.id === activeId)\n        : -1;\n\n      if (direction === 'next') {\n        const nextIndex = currentIndex < 0 ? 0 : (currentIndex + 1) % options.length;\n        setActiveId(options[nextIndex].id);\n      } else {\n        const prevIndex = currentIndex < 0\n          ? options.length - 1\n          : (currentIndex - 1 + options.length) % options.length;\n        setActiveId(options[prevIndex].id);\n      }\n    },\n    [activeId, getEnabledOptions]\n  );\n\n  React.useEffect(() => {\n    if (!activeId) return;\n    const listbox = listboxRef.current;\n    if (!listbox) return;\n\n    const escapedId = typeof CSS !== 'undefined' && typeof CSS.escape === 'function'\n      ? CSS.escape(activeId)\n      : activeId.replace(/[\"\\\\]/g, '\\\\$&');\n    const activeOption = listbox.querySelector<HTMLElement>(`#${escapedId}`);\n    if (!activeOption) return;\n\n    const frame = window.requestAnimationFrame(() => {\n      activeOption.scrollIntoView({ block: 'nearest' });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frame);\n    };\n  }, [activeId]);\n\n  const selectActiveItem = React.useCallback(() => {\n    if (!activeId) return;\n    const listbox = listboxRef.current;\n    if (!listbox) return;\n\n    const escapedId = typeof CSS !== 'undefined' && typeof CSS.escape === 'function'\n      ? CSS.escape(activeId)\n      : activeId.replace(/[\"\\\\]/g, '\\\\$&');\n    const activeOption = listbox.querySelector<HTMLElement>(`#${escapedId}`);\n    if (activeOption && activeOption.getAttribute('aria-disabled') !== 'true') {\n      activeOption.click();\n    }\n  }, [activeId]);\n\n  const setDefaultActiveIfNeeded = React.useCallback(() => {\n    if (activeId) return;\n    const options = getEnabledOptions();\n    if (options.length === 0) return;\n\n    const selectedOption = options.find((option) => option.getAttribute('aria-selected') === 'true');\n    setActiveId((selectedOption ?? options[0]).id);\n  }, [activeId, getEnabledOptions]);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    if (event.defaultPrevented) return;\n\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault();\n        moveActive('next');\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        moveActive('prev');\n        break;\n      case 'Home':\n        event.preventDefault();\n        moveActive('first');\n        break;\n      case 'End':\n        event.preventDefault();\n        moveActive('last');\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        selectActiveItem();\n        break;\n      default:\n        break;\n    }\n  };\n\n  const handleFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n    setDefaultActiveIfNeeded();\n    onFocus?.(event);\n  };\n\n  const contextValue = React.useMemo<ListboxContextValue>(\n    () => ({\n      activeId,\n      setActiveId,\n    }),\n    [activeId]\n  );\n\n  return (\n    <ListboxContext.Provider value={contextValue}>\n      <div\n        ref={listboxRef}\n        {...htmlProps}\n        role=\"listbox\"\n        aria-label={ariaLabel}\n        aria-activedescendant={activeId ?? undefined}\n        tabIndex={tabIndex ?? 0}\n        className={classes}\n        style={style}\n        onKeyDown={handleKeyDown}\n        onFocus={handleFocus}\n      >\n        {children}\n      </div>\n    </ListboxContext.Provider>\n  );\n}\n\nfunction ListboxItem({\n  children,\n  selected = false,\n  disabled = false,\n  onClick,\n  onMouseEnter,\n  className,\n  style,\n  ...htmlProps\n}: ListboxItemProps) {\n  const context = React.useContext(ListboxContext);\n  const generatedId = React.useId();\n  const itemId = (htmlProps.id as string | undefined) ?? `listbox-item-${generatedId}`;\n  const classes = [\n    styles.item,\n    selected && styles.itemSelected,\n    disabled && styles.itemDisabled,\n    context?.activeId === itemId && styles.itemActive,\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const handleMouseEnter = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!disabled) {\n      context?.setActiveId(itemId);\n    }\n    onMouseEnter?.(event);\n  };\n\n  return (\n    <div\n      {...htmlProps}\n      id={itemId}\n      role=\"option\"\n      aria-selected={selected}\n      aria-disabled={disabled}\n      data-active={context?.activeId === itemId || undefined}\n      onClick={disabled ? undefined : onClick}\n      onMouseEnter={handleMouseEnter}\n      className={classes}\n      style={style}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction ListboxGroup({ children, label, className, ...htmlProps }: ListboxGroupProps) {\n  const classes = [styles.group, className].filter(Boolean).join(' ');\n  const labelId = React.useId();\n\n  return (\n    <div\n      {...htmlProps}\n      role=\"group\"\n      aria-labelledby={label ? labelId : undefined}\n      className={classes}\n    >\n      {label && <div id={labelId} className={styles.groupLabel}>{label}</div>}\n      {children}\n    </div>\n  );\n}\n\nfunction ListboxEmpty({ children, className, ...htmlProps }: ListboxEmptyProps) {\n  const classes = [styles.empty, className].filter(Boolean).join(' ');\n  return (\n    <div\n      {...htmlProps}\n      role=\"option\"\n      aria-disabled=\"true\"\n      aria-selected=\"false\"\n      className={classes}\n    >\n      {children}\n    </div>\n  );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const Listbox = Object.assign(ListboxRoot, {\n  Item: ListboxItem,\n  Group: ListboxGroup,\n  Empty: ListboxEmpty,\n});\n\n// Re-export individual components\nexport { ListboxRoot, ListboxItem, ListboxGroup, ListboxEmpty };\n"],"names":["React","styles","jsx","jsxs"],"mappings":"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"}

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

@@ -0,0 +1,32 @@
+import * as React from 'react';
+export interface ListboxProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export interface ListboxItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick'> {
+    children: React.ReactNode;
+    /** Whether this item is currently selected/highlighted */
+    selected?: boolean;
+    /** Whether this item is disabled */
+    disabled?: boolean;
+    /** Click handler */
+    onClick?: () => void;
+}
+export interface ListboxGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    /** Group label */
+    label?: string;
+}
+export interface ListboxEmptyProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+declare function ListboxRoot({ children, className, style, 'aria-label': ariaLabel, tabIndex, onKeyDown, onFocus, ...htmlProps }: ListboxProps): import("react/jsx-runtime").JSX.Element;
+declare function ListboxItem({ children, selected, disabled, onClick, onMouseEnter, className, style, ...htmlProps }: ListboxItemProps): import("react/jsx-runtime").JSX.Element;
+declare function ListboxGroup({ children, label, className, ...htmlProps }: ListboxGroupProps): import("react/jsx-runtime").JSX.Element;
+declare function ListboxEmpty({ children, className, ...htmlProps }: ListboxEmptyProps): import("react/jsx-runtime").JSX.Element;
+export declare const Listbox: typeof ListboxRoot & {
+    Item: typeof ListboxItem;
+    Group: typeof ListboxGroup;
+    Empty: typeof ListboxEmpty;
+};
+export { ListboxRoot, ListboxItem, ListboxGroup, ListboxEmpty };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Listbox/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC7F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAaD,iBAAS,WAAW,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,SAAS,EACb,EAAE,YAAY,2CAuJd;AAED,iBAAS,WAAW,CAAC,EACnB,QAAQ,EACR,QAAgB,EAChB,QAAgB,EAChB,OAAO,EACP,YAAY,EACZ,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EACb,EAAE,gBAAgB,2CAqClB;AAED,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,iBAAiB,2CAepF;AAED,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,iBAAiB,2CAa7E;AAMD,eAAO,MAAM,OAAO;;;;CAIlB,CAAC;AAGH,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,CAAC"}