@usefragments/ui 1.0.0

package/dist/components/Link/index.js

@@ -0,0 +1,63 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import styles from "./Link.module.scss.js";
+function composeEventHandlers(childHandler, parentHandler) {
+  if (!childHandler) return parentHandler;
+  if (!parentHandler) return childHandler;
+  return ((...args) => {
+    childHandler(...args);
+    parentHandler(...args);
+  });
+}
+const LinkRoot = React.forwardRef(
+  function Link2({
+    children,
+    variant = "default",
+    underline = "hover",
+    external = false,
+    asChild = false,
+    className,
+    style,
+    target,
+    rel,
+    ...props
+  }, ref) {
+    const classes = [
+      styles.link,
+      styles[variant],
+      styles[`underline-${underline}`],
+      className
+    ].filter(Boolean).join(" ");
+    const externalProps = external ? {
+      target: target || "_blank",
+      rel: rel || "noopener noreferrer"
+    } : { target, rel };
+    if (asChild && React.isValidElement(children)) {
+      const childProps = children.props;
+      const mergedProps = {
+        ref,
+        className: childProps.className ? `${classes} ${childProps.className}` : classes,
+        style: { ...style, ...childProps.style },
+        ...externalProps,
+        ...props
+      };
+      for (const [key, parentValue] of Object.entries({ ...externalProps, ...props })) {
+        if (!key.startsWith("on") || typeof parentValue !== "function") continue;
+        const childValue = childProps[key];
+        if (typeof childValue !== "function") continue;
+        mergedProps[key] = composeEventHandlers(
+          childValue,
+          parentValue
+        );
+      }
+      return React.cloneElement(children, mergedProps);
+    }
+    return /* @__PURE__ */ jsx("a", { ref, className: classes, style, ...externalProps, ...props, children });
+  }
+);
+const Link = Object.assign(LinkRoot, {
+  Root: LinkRoot
+});
+export {
+  Link
+};

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

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const list = "_list_xlgbz_1";
+const none = "_none_xlgbz_8";
+const disc = "_disc_xlgbz_12";
+const decimal = "_decimal_xlgbz_17";
+const icon = "_icon_xlgbz_22";
+const gapNone = "_gap-none_xlgbz_26";
+const gapXs = "_gap-xs_xlgbz_30";
+const gapSm = "_gap-sm_xlgbz_34";
+const gapMd = "_gap-md_xlgbz_38";
+const gapLg = "_gap-lg_xlgbz_42";
+const item = "_item_xlgbz_46";
+const iconItem = "_iconItem_xlgbz_50";
+const iconWrapper = "_iconWrapper_xlgbz_56";
+const itemContent = "_itemContent_xlgbz_64";
+const styles = {
+  list,
+  none,
+  disc,
+  decimal,
+  icon,
+  "gap-none": "_gap-none_xlgbz_26",
+  gapNone,
+  "gap-xs": "_gap-xs_xlgbz_30",
+  gapXs,
+  "gap-sm": "_gap-sm_xlgbz_34",
+  gapSm,
+  "gap-md": "_gap-md_xlgbz_38",
+  gapMd,
+  "gap-lg": "_gap-lg_xlgbz_42",
+  gapLg,
+  item,
+  iconItem,
+  iconWrapper,
+  itemContent
+};
+exports.decimal = decimal;
+exports.default = styles;
+exports.disc = disc;
+exports.gapLg = gapLg;
+exports.gapMd = gapMd;
+exports.gapNone = gapNone;
+exports.gapSm = gapSm;
+exports.gapXs = gapXs;
+exports.icon = icon;
+exports.iconItem = iconItem;
+exports.iconWrapper = iconWrapper;
+exports.item = item;
+exports.itemContent = itemContent;
+exports.list = list;
+exports.none = none;

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

@@ -0,0 +1,52 @@
+const list = "_list_xlgbz_1";
+const none = "_none_xlgbz_8";
+const disc = "_disc_xlgbz_12";
+const decimal = "_decimal_xlgbz_17";
+const icon = "_icon_xlgbz_22";
+const gapNone = "_gap-none_xlgbz_26";
+const gapXs = "_gap-xs_xlgbz_30";
+const gapSm = "_gap-sm_xlgbz_34";
+const gapMd = "_gap-md_xlgbz_38";
+const gapLg = "_gap-lg_xlgbz_42";
+const item = "_item_xlgbz_46";
+const iconItem = "_iconItem_xlgbz_50";
+const iconWrapper = "_iconWrapper_xlgbz_56";
+const itemContent = "_itemContent_xlgbz_64";
+const styles = {
+  list,
+  none,
+  disc,
+  decimal,
+  icon,
+  "gap-none": "_gap-none_xlgbz_26",
+  gapNone,
+  "gap-xs": "_gap-xs_xlgbz_30",
+  gapXs,
+  "gap-sm": "_gap-sm_xlgbz_34",
+  gapSm,
+  "gap-md": "_gap-md_xlgbz_38",
+  gapMd,
+  "gap-lg": "_gap-lg_xlgbz_42",
+  gapLg,
+  item,
+  iconItem,
+  iconWrapper,
+  itemContent
+};
+export {
+  decimal,
+  styles as default,
+  disc,
+  gapLg,
+  gapMd,
+  gapNone,
+  gapSm,
+  gapXs,
+  icon,
+  iconItem,
+  iconWrapper,
+  item,
+  itemContent,
+  list,
+  none
+};

package/dist/components/List/index.cjs

@@ -0,0 +1,65 @@
+"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;

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,48 @@
+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
+};

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

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const listbox = "_listbox_30ia5_1";
+const item = "_item_30ia5_25";
+const itemSelected = "_itemSelected_30ia5_65";
+const itemActive = "_itemActive_30ia5_71";
+const itemDisabled = "_itemDisabled_30ia5_82";
+const group = "_group_30ia5_88";
+const groupLabel = "_groupLabel_30ia5_94";
+const empty = "_empty_30ia5_103";
+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;

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

@@ -0,0 +1,29 @@
+const listbox = "_listbox_30ia5_1";
+const item = "_item_30ia5_25";
+const itemSelected = "_itemSelected_30ia5_65";
+const itemActive = "_itemActive_30ia5_71";
+const itemDisabled = "_itemDisabled_30ia5_82";
+const group = "_group_30ia5_88";
+const groupLabel = "_groupLabel_30ia5_94";
+const empty = "_empty_30ia5_103";
+const styles = {
+  listbox,
+  item,
+  itemSelected,
+  itemActive,
+  itemDisabled,
+  group,
+  groupLabel,
+  empty
+};
+export {
+  styles as default,
+  empty,
+  group,
+  groupLabel,
+  item,
+  itemActive,
+  itemDisabled,
+  itemSelected,
+  listbox
+};

package/dist/components/Listbox/index.cjs

@@ -0,0 +1,246 @@
+"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,
+  onKeyDown,
+  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);
+  };
+  const handleKeyDown = (event) => {
+    onKeyDown == null ? void 0 : onKeyDown(event);
+    if (event.defaultPrevented || disabled) return;
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      event.currentTarget.click();
+    }
+  };
+  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,
+      onKeyDown: handleKeyDown,
+      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;

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?: (event: React.MouseEvent<HTMLDivElement>) => 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, onKeyDown, 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,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC7D;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,SAAS,EACT,YAAY,EACZ,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EACb,EAAE,gBAAgB,2CA+ClB;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"}