@noambz/ui 0.7.0

package/dist/components/organisms/app-shell/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,YAAY,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,YAAY,EACV,oBAAoB,EACpB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,GACnB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/organisms/app-shell/index.js

@@ -0,0 +1,11 @@
+import { AppShellLayout } from "./app-shell-layout.js";
+import { AppShellPreset } from "./app-shell-preset.js";
+import { SidebarNav } from "./sidebar-nav.js";
+import { ModuleSubnav } from "./module-subnav.js";
+export {
+  AppShellLayout,
+  AppShellPreset,
+  ModuleSubnav,
+  SidebarNav
+};
+//# sourceMappingURL=index.js.map

package/dist/components/organisms/app-shell/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/app-shell/index.ts"],"sourcesContent":["export { AppShellLayout } from \"./app-shell-layout.js\";\nexport type { IAppShellLayoutProps } from \"./app-shell-layout.js\";\nexport { AppShellPreset } from \"./app-shell-preset.js\";\nexport type {\n  IAppShellPresetProps,\n  IAppShellNavItem,\n  IAppShellNavGroup,\n  IAppShellLinkProps,\n} from \"./app-shell-preset.js\";\nexport { SidebarNav } from \"./sidebar-nav.js\";\nexport type { ISidebarNavProps, ISidebarNavItem } from \"./sidebar-nav.js\";\nexport { ModuleSubnav } from \"./module-subnav.js\";\nexport type { IModuleSubnavProps, IModuleSubnavItem } from \"./module-subnav.js\";\n"],"mappings":"AAAA,SAAS,sBAAsB;AAE/B,SAAS,sBAAsB;AAO/B,SAAS,kBAAkB;AAE3B,SAAS,oBAAoB;","names":[]}

package/dist/components/organisms/app-shell/module-subnav.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentType } from "react";
+import type { IAppShellLinkProps } from "./app-shell-preset.js";
+export interface IModuleSubnavItem {
+    id: string;
+    href: string;
+    label: string;
+    active?: boolean;
+}
+export interface IModuleSubnavProps {
+    items: readonly IModuleSubnavItem[];
+    LinkComponent: ComponentType<IAppShellLinkProps>;
+    ariaLabel: string;
+    className?: string;
+}
+/**
+ * Horizontal in-page sub top bar for module-internal routes.
+ * Router-agnostic: inject `LinkComponent` (e.g. `next/link`).
+ * Returns null when `items` is empty.
+ */
+export declare function ModuleSubnav({ items, LinkComponent, ariaLabel, className, }: IModuleSubnavProps): import("react").JSX.Element | null;
+//# sourceMappingURL=module-subnav.d.ts.map

package/dist/components/organisms/app-shell/module-subnav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module-subnav.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/module-subnav.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,SAAS,iBAAiB,EAAE,CAAC;IACpC,aAAa,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;IACjD,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,aAAa,EACb,SAAS,EACT,SAAS,GACV,EAAE,kBAAkB,sCAyBpB"}

package/dist/components/organisms/app-shell/module-subnav.js

@@ -0,0 +1,33 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../utils/cn.js";
+function ModuleSubnav({
+  items,
+  LinkComponent,
+  ariaLabel,
+  className
+}) {
+  if (items.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      "aria-label": ariaLabel,
+      className: cn("mb-6 flex flex-wrap gap-2 border-b border-border-base pb-4", className),
+      children: items.map((item) => /* @__PURE__ */ jsx(
+        LinkComponent,
+        {
+          href: item.href,
+          className: item.active ? "rounded-md bg-primary/10 px-3 py-2 text-sm font-medium text-primary" : "rounded-md border border-border-base px-3 py-2 text-sm font-medium text-muted-foreground transition-colors hover:text-foreground",
+          children: item.label
+        },
+        item.id
+      ))
+    }
+  );
+}
+export {
+  ModuleSubnav
+};
+//# sourceMappingURL=module-subnav.js.map

package/dist/components/organisms/app-shell/module-subnav.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/app-shell/module-subnav.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentType } from \"react\";\n\nimport { cn } from \"../../../utils/cn.js\";\nimport type { IAppShellLinkProps } from \"./app-shell-preset.js\";\n\nexport interface IModuleSubnavItem {\n  id: string;\n  href: string;\n  label: string;\n  active?: boolean;\n}\n\nexport interface IModuleSubnavProps {\n  items: readonly IModuleSubnavItem[];\n  LinkComponent: ComponentType<IAppShellLinkProps>;\n  ariaLabel: string;\n  className?: string;\n}\n\n/**\n * Horizontal in-page sub top bar for module-internal routes.\n * Router-agnostic: inject `LinkComponent` (e.g. `next/link`).\n * Returns null when `items` is empty.\n */\nexport function ModuleSubnav({\n  items,\n  LinkComponent,\n  ariaLabel,\n  className,\n}: IModuleSubnavProps) {\n  if (items.length === 0) {\n    return null;\n  }\n\n  return (\n    <nav\n      aria-label={ariaLabel}\n      className={cn(\"mb-6 flex flex-wrap gap-2 border-b border-border-base pb-4\", className)}\n    >\n      {items.map((item) => (\n        <LinkComponent\n          key={item.id}\n          href={item.href}\n          className={\n            item.active\n              ? \"rounded-md bg-primary/10 px-3 py-2 text-sm font-medium text-primary\"\n              : \"rounded-md border border-border-base px-3 py-2 text-sm font-medium text-muted-foreground transition-colors hover:text-foreground\"\n          }\n        >\n          {item.label}\n        </LinkComponent>\n      ))}\n    </nav>\n  );\n}\n"],"mappings":";AA0CQ;AAtCR,SAAS,UAAU;AAsBZ,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAuB;AACrB,MAAI,MAAM,WAAW,GAAG;AACtB,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,cAAY;AAAA,MACZ,WAAW,GAAG,8DAA8D,SAAS;AAAA,MAEpF,gBAAM,IAAI,CAAC,SACV;AAAA,QAAC;AAAA;AAAA,UAEC,MAAM,KAAK;AAAA,UACX,WACE,KAAK,SACD,wEACA;AAAA,UAGL,eAAK;AAAA;AAAA,QARD,KAAK;AAAA,MASZ,CACD;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/components/organisms/app-shell/module-subnav.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { ModuleSubnav } from "./module-subnav.js";
+declare const meta: Meta<typeof ModuleSubnav>;
+export default meta;
+type Story = StoryObj<typeof ModuleSubnav>;
+export declare const Default: Story;
+export declare const Empty: Story;
+//# sourceMappingURL=module-subnav.stories.d.ts.map

package/dist/components/organisms/app-shell/module-subnav.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module-subnav.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/module-subnav.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAI5D,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAQlD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAYnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAC;AAE3C,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC"}

package/dist/components/organisms/app-shell/module-subnav.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=module-subnav.test.d.ts.map

package/dist/components/organisms/app-shell/module-subnav.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module-subnav.test.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/module-subnav.test.tsx"],"names":[],"mappings":""}

package/dist/components/organisms/app-shell/sidebar-nav.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentType } from "react";
+import type { IAppShellLinkProps } from "./app-shell-preset.js";
+export interface ISidebarNavItem {
+    id: string;
+    href: string;
+    label: string;
+    active?: boolean;
+}
+export interface ISidebarNavProps {
+    items: readonly ISidebarNavItem[];
+    LinkComponent: ComponentType<IAppShellLinkProps>;
+    ariaLabel: string;
+    onNavigate?: () => void;
+    className?: string;
+}
+/**
+ * Vertical sidebar link list. Router-agnostic: inject `LinkComponent`
+ * (e.g. `next/link`). Active state is supplied by the consumer.
+ */
+export declare function SidebarNav({ items, LinkComponent, ariaLabel, onNavigate, className, }: ISidebarNavProps): import("react").JSX.Element;
+//# sourceMappingURL=sidebar-nav.d.ts.map

package/dist/components/organisms/app-shell/sidebar-nav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/sidebar-nav.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,eAAe,EAAE,CAAC;IAClC,aAAa,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;IACjD,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,aAAa,EACb,SAAS,EACT,UAAU,EACV,SAAS,GACV,EAAE,gBAAgB,+BAmBlB"}

package/dist/components/organisms/app-shell/sidebar-nav.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../utils/cn.js";
+function SidebarNav({
+  items,
+  LinkComponent,
+  ariaLabel,
+  onNavigate,
+  className
+}) {
+  return /* @__PURE__ */ jsx("nav", { "aria-label": ariaLabel, className: cn("flex flex-col gap-1 px-3", className), children: items.map((item) => /* @__PURE__ */ jsx(
+    LinkComponent,
+    {
+      href: item.href,
+      onClick: onNavigate,
+      className: item.active ? "rounded-md bg-primary/10 px-3 py-2 text-sm font-medium text-primary" : "rounded-md px-3 py-2 text-sm font-medium text-muted-foreground transition-colors hover:bg-surface-muted hover:text-foreground",
+      children: item.label
+    },
+    item.id
+  )) });
+}
+export {
+  SidebarNav
+};
+//# sourceMappingURL=sidebar-nav.js.map

package/dist/components/organisms/app-shell/sidebar-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/app-shell/sidebar-nav.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentType } from \"react\";\n\nimport { cn } from \"../../../utils/cn.js\";\nimport type { IAppShellLinkProps } from \"./app-shell-preset.js\";\n\nexport interface ISidebarNavItem {\n  id: string;\n  href: string;\n  label: string;\n  active?: boolean;\n}\n\nexport interface ISidebarNavProps {\n  items: readonly ISidebarNavItem[];\n  LinkComponent: ComponentType<IAppShellLinkProps>;\n  ariaLabel: string;\n  onNavigate?: () => void;\n  className?: string;\n}\n\n/**\n * Vertical sidebar link list. Router-agnostic: inject `LinkComponent`\n * (e.g. `next/link`). Active state is supplied by the consumer.\n */\nexport function SidebarNav({\n  items,\n  LinkComponent,\n  ariaLabel,\n  onNavigate,\n  className,\n}: ISidebarNavProps) {\n  return (\n    <nav aria-label={ariaLabel} className={cn(\"flex flex-col gap-1 px-3\", className)}>\n      {items.map((item) => (\n        <LinkComponent\n          key={item.id}\n          href={item.href}\n          onClick={onNavigate}\n          className={\n            item.active\n              ? \"rounded-md bg-primary/10 px-3 py-2 text-sm font-medium text-primary\"\n              : \"rounded-md px-3 py-2 text-sm font-medium text-muted-foreground transition-colors hover:bg-surface-muted hover:text-foreground\"\n          }\n        >\n          {item.label}\n        </LinkComponent>\n      ))}\n    </nav>\n  );\n}\n"],"mappings":";AAoCQ;AAhCR,SAAS,UAAU;AAsBZ,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAqB;AACnB,SACE,oBAAC,SAAI,cAAY,WAAW,WAAW,GAAG,4BAA4B,SAAS,GAC5E,gBAAM,IAAI,CAAC,SACV;AAAA,IAAC;AAAA;AAAA,MAEC,MAAM,KAAK;AAAA,MACX,SAAS;AAAA,MACT,WACE,KAAK,SACD,wEACA;AAAA,MAGL,eAAK;AAAA;AAAA,IATD,KAAK;AAAA,EAUZ,CACD,GACH;AAEJ;","names":[]}

package/dist/components/organisms/app-shell/sidebar-nav.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { SidebarNav } from "./sidebar-nav.js";
+declare const meta: Meta<typeof SidebarNav>;
+export default meta;
+type Story = StoryObj<typeof SidebarNav>;
+export declare const Default: Story;
+//# sourceMappingURL=sidebar-nav.stories.d.ts.map

package/dist/components/organisms/app-shell/sidebar-nav.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/sidebar-nav.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAI5D,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAQ9C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAYjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAEzC,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAC"}

package/dist/components/organisms/app-shell/sidebar-nav.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sidebar-nav.test.d.ts.map

package/dist/components/organisms/app-shell/sidebar-nav.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav.test.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/app-shell/sidebar-nav.test.tsx"],"names":[],"mappings":""}

package/dist/components/organisms/autocomplete/autocomplete.d.ts

@@ -0,0 +1,43 @@
+import { type ReactNode } from "react";
+export interface IAutocompleteRenderItemArgs<TItem> {
+    item: TItem;
+    highlighted: boolean;
+    selected: boolean;
+    index: number;
+}
+export interface IAutocompleteBaseProps<TItem> {
+    items: ReadonlyArray<TItem>;
+    getItemKey: (item: TItem) => string;
+    getItemLabel: (item: TItem) => string;
+    /** Text searched against when filtering. Defaults to `getItemLabel`. */
+    getItemSearchText?: (item: TItem) => string;
+    renderItem?: (args: IAutocompleteRenderItemArgs<TItem>) => ReactNode;
+    placeholder?: string;
+    emptyText?: ReactNode;
+    disabled?: boolean;
+    className?: string;
+    ariaLabel?: string;
+    /** Max list height (CSS length). Defaults to `16rem`. */
+    maxListHeight?: string;
+}
+export interface IAutocompleteSingleProps<TItem> extends IAutocompleteBaseProps<TItem> {
+    multi?: false;
+    value: string | null;
+    onChange: (key: string | null) => void;
+}
+export interface IAutocompleteMultiProps<TItem> extends IAutocompleteBaseProps<TItem> {
+    multi: true;
+    value: ReadonlyArray<string>;
+    onChange: (keys: string[]) => void;
+    /** Max visible selected tags inside the input chip area before collapsing to count. */
+    maxVisibleTags?: number;
+}
+export type IAutocompleteProps<TItem> = IAutocompleteSingleProps<TItem> | IAutocompleteMultiProps<TItem>;
+/**
+ * Generic single- or multi-select combobox. Opens on focus, filters by
+ * substring against `getItemSearchText(item)` (falls back to the label).
+ * Supports keyboard nav (ArrowUp/Down/Enter/Escape, Backspace to remove last
+ * tag in multi mode), click-outside close, and custom item rendering.
+ */
+export declare function Autocomplete<TItem>(props: IAutocompleteProps<TItem>): import("react").JSX.Element;
+//# sourceMappingURL=autocomplete.d.ts.map

package/dist/components/organisms/autocomplete/autocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/autocomplete/autocomplete.tsx"],"names":[],"mappings":"AAEA,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,2BAA2B,CAAC,KAAK;IAChD,IAAI,EAAE,KAAK,CAAC;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,sBAAsB,CAAC,KAAK;IAC3C,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5B,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,MAAM,CAAC;IACpC,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,MAAM,CAAC;IACtC,wEAAwE;IACxE,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,MAAM,CAAC;IAC5C,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,2BAA2B,CAAC,KAAK,CAAC,KAAK,SAAS,CAAC;IACrE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yDAAyD;IACzD,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,wBAAwB,CAAC,KAAK,CAAE,SAAQ,sBAAsB,CAAC,KAAK,CAAC;IACpF,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CACxC;AAED,MAAM,WAAW,uBAAuB,CAAC,KAAK,CAAE,SAAQ,sBAAsB,CAAC,KAAK,CAAC;IACnF,KAAK,EAAE,IAAI,CAAC;IACZ,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,uFAAuF;IACvF,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,kBAAkB,CAAC,KAAK,IAAI,wBAAwB,CAAC,KAAK,CAAC,GAAG,uBAAuB,CAAC,KAAK,CAAC,CAAC;AASzG;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,KAAK,EAAE,kBAAkB,CAAC,KAAK,CAAC,+BA8QnE"}

package/dist/components/organisms/autocomplete/autocomplete.js

@@ -0,0 +1,276 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  useCallback,
+  useEffect,
+  useId,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { cn } from "../../../utils/cn.js";
+import { useClickOutside } from "../../../hooks/useClickOutside.js";
+const HIGHLIGHT_NONE = -1;
+const CLEAR_CHAR = "\xD7";
+function defaultRenderItem(args, getItemLabel) {
+  return /* @__PURE__ */ jsx("span", { className: "truncate", children: getItemLabel(args.item) });
+}
+function Autocomplete(props) {
+  const {
+    items,
+    getItemKey,
+    getItemLabel,
+    getItemSearchText,
+    renderItem,
+    placeholder,
+    emptyText = "No results",
+    disabled = false,
+    className,
+    ariaLabel,
+    maxListHeight = "16rem"
+  } = props;
+  const listboxId = useId();
+  const inputRef = useRef(null);
+  const listRef = useRef(null);
+  const wrapperRef = useRef(null);
+  const [query, setQuery] = useState("");
+  const [open, setOpen] = useState(false);
+  const [highlighted, setHighlighted] = useState(HIGHLIGHT_NONE);
+  const selectedKeys = useMemo(() => {
+    if (props.multi) return new Set(props.value);
+    return new Set(props.value ? [props.value] : []);
+  }, [props]);
+  const itemsByKey = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const item of items) map.set(getItemKey(item), item);
+    return map;
+  }, [items, getItemKey]);
+  const selectedItems = useMemo(() => {
+    if (!props.multi) return [];
+    const result = [];
+    for (const key of props.value) {
+      const item = itemsByKey.get(key);
+      if (item) result.push(item);
+    }
+    return result;
+  }, [props, itemsByKey]);
+  const filteredItems = useMemo(() => {
+    if (!query.trim()) return items;
+    const needle = query.toLowerCase();
+    return items.filter((item) => {
+      const hay = (getItemSearchText ?? getItemLabel)(item).toLowerCase();
+      return hay.includes(needle);
+    });
+  }, [items, query, getItemLabel, getItemSearchText]);
+  useClickOutside(wrapperRef, () => setOpen(false));
+  useEffect(() => {
+    setHighlighted(HIGHLIGHT_NONE);
+  }, [query, open]);
+  useEffect(() => {
+    if (highlighted < 0 || !listRef.current) return;
+    const child = listRef.current.children[highlighted];
+    child?.scrollIntoView({ block: "nearest" });
+  }, [highlighted]);
+  const commitSelection = useCallback(
+    (item) => {
+      const key = getItemKey(item);
+      if (props.multi) {
+        const already = props.value.includes(key);
+        const next = already ? props.value.filter((k) => k !== key) : [...props.value, key];
+        props.onChange(next);
+        setQuery("");
+        inputRef.current?.focus();
+      } else {
+        props.onChange(key === props.value ? null : key);
+        setQuery("");
+        setOpen(false);
+      }
+    },
+    [getItemKey, props]
+  );
+  const removeKey = useCallback(
+    (key) => {
+      if (!props.multi) {
+        props.onChange(null);
+        return;
+      }
+      props.onChange(props.value.filter((k) => k !== key));
+    },
+    [props]
+  );
+  const clearAll = useCallback(() => {
+    if (props.multi) props.onChange([]);
+    else props.onChange(null);
+    setQuery("");
+  }, [props]);
+  const onKeyDown = (event) => {
+    if (disabled) return;
+    if (props.multi && event.key === "Backspace" && !query && props.value.length > 0) {
+      removeKey(props.value[props.value.length - 1]);
+      return;
+    }
+    if (!open) {
+      if (event.key === "ArrowDown" || event.key === "Enter") {
+        event.preventDefault();
+        setOpen(true);
+      }
+      return;
+    }
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        setHighlighted((prev) => Math.min(prev + 1, filteredItems.length - 1));
+        break;
+      case "ArrowUp":
+        event.preventDefault();
+        setHighlighted((prev) => Math.max(prev - 1, 0));
+        break;
+      case "Enter":
+        event.preventDefault();
+        if (highlighted >= 0 && filteredItems[highlighted]) commitSelection(filteredItems[highlighted]);
+        break;
+      case "Escape":
+        setOpen(false);
+        setQuery("");
+        break;
+    }
+  };
+  const singleLabel = !props.multi && props.value ? itemsByKey.get(props.value) : void 0;
+  const singleDisplay = singleLabel ? getItemLabel(singleLabel) : "";
+  const showClear = props.multi ? props.value.length > 0 : Boolean(props.value);
+  const renderFn = renderItem ?? ((args) => defaultRenderItem(args, getItemLabel));
+  const activeOptionId = highlighted >= 0 && filteredItems[highlighted] ? `${listboxId}-opt-${getItemKey(filteredItems[highlighted])}` : void 0;
+  const maxVisibleTags = props.multi ? props.maxVisibleTags ?? Infinity : Infinity;
+  const visibleTags = selectedItems.slice(0, maxVisibleTags);
+  const overflowTags = selectedItems.length - visibleTags.length;
+  return /* @__PURE__ */ jsxs("div", { ref: wrapperRef, className: cn("relative", className), children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex min-h-9 w-full flex-wrap items-center gap-1 rounded-lg border border-border-strong bg-background px-2 py-1 text-sm transition-colors focus-within:ring-2 focus-within:ring-ring",
+          disabled && "cursor-not-allowed opacity-50"
+        ),
+        onClick: () => inputRef.current?.focus(),
+        children: [
+          props.multi ? visibleTags.map((item) => {
+            const key = getItemKey(item);
+            return /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: "inline-flex items-center gap-1 rounded-md bg-blue-50 px-2 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-950 dark:text-blue-300",
+                children: [
+                  getItemLabel(item),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: (event) => {
+                        event.stopPropagation();
+                        removeKey(key);
+                      },
+                      "aria-label": `Remove ${getItemLabel(item)}`,
+                      className: "text-blue-400 transition-colors hover:text-blue-600",
+                      children: CLEAR_CHAR
+                    }
+                  )
+                ]
+              },
+              key
+            );
+          }) : null,
+          props.multi && overflowTags > 0 ? /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: "inline-flex items-center rounded-md bg-surface-muted px-2 py-0.5 text-xs font-medium text-muted-foreground",
+              title: selectedItems.slice(visibleTags.length).map((i) => getItemLabel(i)).join(", "),
+              children: [
+                "+",
+                overflowTags
+              ]
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: inputRef,
+              type: "text",
+              role: "combobox",
+              "aria-expanded": open,
+              "aria-controls": listboxId,
+              "aria-activedescendant": activeOptionId,
+              "aria-autocomplete": "list",
+              "aria-label": ariaLabel,
+              disabled,
+              value: props.multi ? query : open ? query : singleDisplay || query,
+              placeholder,
+              onChange: (event) => {
+                setQuery(event.target.value);
+                if (!open) setOpen(true);
+                if (!props.multi && props.value && event.target.value !== singleDisplay) props.onChange(null);
+              },
+              onFocus: () => {
+                if (!open) setOpen(true);
+                if (!props.multi && props.value) setQuery("");
+              },
+              onKeyDown,
+              className: "min-w-[4rem] flex-1 bg-transparent text-foreground placeholder:text-muted-foreground outline-none"
+            }
+          ),
+          showClear ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: (event) => {
+                event.stopPropagation();
+                clearAll();
+              },
+              "aria-label": "Clear selection",
+              className: "text-muted-foreground transition-colors hover:text-foreground",
+              children: CLEAR_CHAR
+            }
+          ) : null
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsx(
+      "ul",
+      {
+        ref: listRef,
+        id: listboxId,
+        role: "listbox",
+        style: { maxHeight: maxListHeight },
+        className: "absolute inset-x-0 top-full z-20 mt-1 overflow-y-auto rounded-lg border border-border-base bg-surface p-1 shadow-lg",
+        children: filteredItems.length === 0 ? /* @__PURE__ */ jsx("li", { className: "px-3 py-4 text-center text-sm text-muted-foreground", children: emptyText }) : filteredItems.map((item, index) => {
+          const key = getItemKey(item);
+          const isHighlighted = index === highlighted;
+          const isSelected = selectedKeys.has(key);
+          return /* @__PURE__ */ jsxs(
+            "li",
+            {
+              id: `${listboxId}-opt-${key}`,
+              role: "option",
+              "aria-selected": isSelected,
+              onClick: () => commitSelection(item),
+              onMouseEnter: () => setHighlighted(index),
+              className: cn(
+                "flex cursor-pointer items-center justify-between gap-2 rounded-md px-2 py-1.5 text-sm",
+                isHighlighted && "bg-surface-muted",
+                isSelected && "text-blue-700 dark:text-blue-300"
+              ),
+              children: [
+                renderFn({ item, highlighted: isHighlighted, selected: isSelected, index }),
+                isSelected ? /* @__PURE__ */ jsx("span", { className: "text-xs", children: "\u2713" }) : null
+              ]
+            },
+            key
+          );
+        })
+      }
+    ) : null
+  ] });
+}
+export {
+  Autocomplete
+};
+//# sourceMappingURL=autocomplete.js.map

package/dist/components/organisms/autocomplete/autocomplete.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/autocomplete/autocomplete.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../../utils/cn.js\";\nimport { useClickOutside } from \"../../../hooks/useClickOutside.js\";\n\nconst HIGHLIGHT_NONE = -1;\nconst CLEAR_CHAR = \"\\u00D7\";\n\nexport interface IAutocompleteRenderItemArgs<TItem> {\n  item: TItem;\n  highlighted: boolean;\n  selected: boolean;\n  index: number;\n}\n\nexport interface IAutocompleteBaseProps<TItem> {\n  items: ReadonlyArray<TItem>;\n  getItemKey: (item: TItem) => string;\n  getItemLabel: (item: TItem) => string;\n  /** Text searched against when filtering. Defaults to `getItemLabel`. */\n  getItemSearchText?: (item: TItem) => string;\n  renderItem?: (args: IAutocompleteRenderItemArgs<TItem>) => ReactNode;\n  placeholder?: string;\n  emptyText?: ReactNode;\n  disabled?: boolean;\n  className?: string;\n  ariaLabel?: string;\n  /** Max list height (CSS length). Defaults to `16rem`. */\n  maxListHeight?: string;\n}\n\nexport interface IAutocompleteSingleProps<TItem> extends IAutocompleteBaseProps<TItem> {\n  multi?: false;\n  value: string | null;\n  onChange: (key: string | null) => void;\n}\n\nexport interface IAutocompleteMultiProps<TItem> extends IAutocompleteBaseProps<TItem> {\n  multi: true;\n  value: ReadonlyArray<string>;\n  onChange: (keys: string[]) => void;\n  /** Max visible selected tags inside the input chip area before collapsing to count. */\n  maxVisibleTags?: number;\n}\n\nexport type IAutocompleteProps<TItem> = IAutocompleteSingleProps<TItem> | IAutocompleteMultiProps<TItem>;\n\nfunction defaultRenderItem<TItem>(\n  args: IAutocompleteRenderItemArgs<TItem>,\n  getItemLabel: (item: TItem) => string,\n): ReactNode {\n  return <span className=\"truncate\">{getItemLabel(args.item)}</span>;\n}\n\n/**\n * Generic single- or multi-select combobox. Opens on focus, filters by\n * substring against `getItemSearchText(item)` (falls back to the label).\n * Supports keyboard nav (ArrowUp/Down/Enter/Escape, Backspace to remove last\n * tag in multi mode), click-outside close, and custom item rendering.\n */\nexport function Autocomplete<TItem>(props: IAutocompleteProps<TItem>) {\n  const {\n    items,\n    getItemKey,\n    getItemLabel,\n    getItemSearchText,\n    renderItem,\n    placeholder,\n    emptyText = \"No results\",\n    disabled = false,\n    className,\n    ariaLabel,\n    maxListHeight = \"16rem\",\n  } = props;\n\n  const listboxId = useId();\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLUListElement>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  const [query, setQuery] = useState(\"\");\n  const [open, setOpen] = useState(false);\n  const [highlighted, setHighlighted] = useState<number>(HIGHLIGHT_NONE);\n\n  const selectedKeys = useMemo<ReadonlySet<string>>(() => {\n    if (props.multi) return new Set(props.value);\n    return new Set(props.value ? [props.value] : []);\n  }, [props]);\n\n  const itemsByKey = useMemo(() => {\n    const map = new Map<string, TItem>();\n    for (const item of items) map.set(getItemKey(item), item);\n    return map;\n  }, [items, getItemKey]);\n\n  const selectedItems = useMemo(() => {\n    if (!props.multi) return [];\n    const result: TItem[] = [];\n    for (const key of props.value) {\n      const item = itemsByKey.get(key);\n      if (item) result.push(item);\n    }\n    return result;\n  }, [props, itemsByKey]);\n\n  const filteredItems = useMemo(() => {\n    if (!query.trim()) return items;\n    const needle = query.toLowerCase();\n    return items.filter((item) => {\n      const hay = (getItemSearchText ?? getItemLabel)(item).toLowerCase();\n      return hay.includes(needle);\n    });\n  }, [items, query, getItemLabel, getItemSearchText]);\n\n  useClickOutside(wrapperRef, () => setOpen(false));\n\n  useEffect(() => {\n    setHighlighted(HIGHLIGHT_NONE);\n  }, [query, open]);\n\n  useEffect(() => {\n    if (highlighted < 0 || !listRef.current) return;\n    const child = listRef.current.children[highlighted] as HTMLElement | undefined;\n    child?.scrollIntoView({ block: \"nearest\" });\n  }, [highlighted]);\n\n  const commitSelection = useCallback(\n    (item: TItem) => {\n      const key = getItemKey(item);\n      if (props.multi) {\n        const already = props.value.includes(key);\n        const next = already ? props.value.filter((k) => k !== key) : [...props.value, key];\n        props.onChange(next);\n        setQuery(\"\");\n        inputRef.current?.focus();\n      } else {\n        props.onChange(key === props.value ? null : key);\n        setQuery(\"\");\n        setOpen(false);\n      }\n    },\n    [getItemKey, props],\n  );\n\n  const removeKey = useCallback(\n    (key: string) => {\n      if (!props.multi) {\n        props.onChange(null);\n        return;\n      }\n      props.onChange(props.value.filter((k) => k !== key));\n    },\n    [props],\n  );\n\n  const clearAll = useCallback(() => {\n    if (props.multi) props.onChange([]);\n    else props.onChange(null);\n    setQuery(\"\");\n  }, [props]);\n\n  const onKeyDown = (event: ReactKeyboardEvent<HTMLInputElement>) => {\n    if (disabled) return;\n    if (props.multi && event.key === \"Backspace\" && !query && props.value.length > 0) {\n      removeKey(props.value[props.value.length - 1]);\n      return;\n    }\n    if (!open) {\n      if (event.key === \"ArrowDown\" || event.key === \"Enter\") {\n        event.preventDefault();\n        setOpen(true);\n      }\n      return;\n    }\n    switch (event.key) {\n      case \"ArrowDown\":\n        event.preventDefault();\n        setHighlighted((prev) => Math.min(prev + 1, filteredItems.length - 1));\n        break;\n      case \"ArrowUp\":\n        event.preventDefault();\n        setHighlighted((prev) => Math.max(prev - 1, 0));\n        break;\n      case \"Enter\":\n        event.preventDefault();\n        if (highlighted >= 0 && filteredItems[highlighted]) commitSelection(filteredItems[highlighted]);\n        break;\n      case \"Escape\":\n        setOpen(false);\n        setQuery(\"\");\n        break;\n    }\n  };\n\n  const singleLabel = !props.multi && props.value ? itemsByKey.get(props.value) : undefined;\n  const singleDisplay = singleLabel ? getItemLabel(singleLabel) : \"\";\n  const showClear = props.multi ? props.value.length > 0 : Boolean(props.value);\n\n  const renderFn = renderItem ?? ((args: IAutocompleteRenderItemArgs<TItem>) => defaultRenderItem(args, getItemLabel));\n\n  const activeOptionId =\n    highlighted >= 0 && filteredItems[highlighted]\n      ? `${listboxId}-opt-${getItemKey(filteredItems[highlighted])}`\n      : undefined;\n\n  const maxVisibleTags = props.multi ? props.maxVisibleTags ?? Infinity : Infinity;\n  const visibleTags = selectedItems.slice(0, maxVisibleTags);\n  const overflowTags = selectedItems.length - visibleTags.length;\n\n  return (\n    <div ref={wrapperRef} className={cn(\"relative\", className)}>\n      <div\n        className={cn(\n          \"flex min-h-9 w-full flex-wrap items-center gap-1 rounded-lg border border-border-strong bg-background px-2 py-1 text-sm transition-colors focus-within:ring-2 focus-within:ring-ring\",\n          disabled && \"cursor-not-allowed opacity-50\",\n        )}\n        onClick={() => inputRef.current?.focus()}\n      >\n        {props.multi\n          ? visibleTags.map((item) => {\n              const key = getItemKey(item);\n              return (\n                <span\n                  key={key}\n                  className=\"inline-flex items-center gap-1 rounded-md bg-blue-50 px-2 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-950 dark:text-blue-300\"\n                >\n                  {getItemLabel(item)}\n                  <button\n                    type=\"button\"\n                    onClick={(event) => {\n                      event.stopPropagation();\n                      removeKey(key);\n                    }}\n                    aria-label={`Remove ${getItemLabel(item)}`}\n                    className=\"text-blue-400 transition-colors hover:text-blue-600\"\n                  >\n                    {CLEAR_CHAR}\n                  </button>\n                </span>\n              );\n            })\n          : null}\n        {props.multi && overflowTags > 0 ? (\n          <span\n            className=\"inline-flex items-center rounded-md bg-surface-muted px-2 py-0.5 text-xs font-medium text-muted-foreground\"\n            title={selectedItems\n              .slice(visibleTags.length)\n              .map((i) => getItemLabel(i))\n              .join(\", \")}\n          >\n            +{overflowTags}\n          </span>\n        ) : null}\n        <input\n          ref={inputRef}\n          type=\"text\"\n          role=\"combobox\"\n          aria-expanded={open}\n          aria-controls={listboxId}\n          aria-activedescendant={activeOptionId}\n          aria-autocomplete=\"list\"\n          aria-label={ariaLabel}\n          disabled={disabled}\n          value={props.multi ? query : open ? query : singleDisplay || query}\n          placeholder={placeholder}\n          onChange={(event) => {\n            setQuery(event.target.value);\n            if (!open) setOpen(true);\n            if (!props.multi && props.value && event.target.value !== singleDisplay) props.onChange(null);\n          }}\n          onFocus={() => {\n            if (!open) setOpen(true);\n            if (!props.multi && props.value) setQuery(\"\");\n          }}\n          onKeyDown={onKeyDown}\n          className=\"min-w-[4rem] flex-1 bg-transparent text-foreground placeholder:text-muted-foreground outline-none\"\n        />\n        {showClear ? (\n          <button\n            type=\"button\"\n            onClick={(event) => {\n              event.stopPropagation();\n              clearAll();\n            }}\n            aria-label=\"Clear selection\"\n            className=\"text-muted-foreground transition-colors hover:text-foreground\"\n          >\n            {CLEAR_CHAR}\n          </button>\n        ) : null}\n      </div>\n      {open ? (\n        <ul\n          ref={listRef}\n          id={listboxId}\n          role=\"listbox\"\n          style={{ maxHeight: maxListHeight }}\n          className=\"absolute inset-x-0 top-full z-20 mt-1 overflow-y-auto rounded-lg border border-border-base bg-surface p-1 shadow-lg\"\n        >\n          {filteredItems.length === 0 ? (\n            <li className=\"px-3 py-4 text-center text-sm text-muted-foreground\">{emptyText}</li>\n          ) : (\n            filteredItems.map((item, index) => {\n              const key = getItemKey(item);\n              const isHighlighted = index === highlighted;\n              const isSelected = selectedKeys.has(key);\n              return (\n                <li\n                  key={key}\n                  id={`${listboxId}-opt-${key}`}\n                  role=\"option\"\n                  aria-selected={isSelected}\n                  onClick={() => commitSelection(item)}\n                  onMouseEnter={() => setHighlighted(index)}\n                  className={cn(\n                    \"flex cursor-pointer items-center justify-between gap-2 rounded-md px-2 py-1.5 text-sm\",\n                    isHighlighted && \"bg-surface-muted\",\n                    isSelected && \"text-blue-700 dark:text-blue-300\",\n                  )}\n                >\n                  {renderFn({ item, highlighted: isHighlighted, selected: isSelected, index })}\n                  {isSelected ? <span className=\"text-xs\">{\"\\u2713\"}</span> : null}\n                </li>\n              );\n            })\n          )}\n        </ul>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";AA6DS,cA2KO,YA3KP;AA3DT;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP,SAAS,UAAU;AACnB,SAAS,uBAAuB;AAEhC,MAAM,iBAAiB;AACvB,MAAM,aAAa;AAyCnB,SAAS,kBACP,MACA,cACW;AACX,SAAO,oBAAC,UAAK,WAAU,YAAY,uBAAa,KAAK,IAAI,GAAE;AAC7D;AAQO,SAAS,aAAoB,OAAkC;AACpE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,EAClB,IAAI;AAEJ,QAAM,YAAY,MAAM;AACxB,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,UAAU,OAAyB,IAAI;AAC7C,QAAM,aAAa,OAAuB,IAAI;AAE9C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,QAAM,CAAC,aAAa,cAAc,IAAI,SAAiB,cAAc;AAErE,QAAM,eAAe,QAA6B,MAAM;AACtD,QAAI,MAAM,MAAO,QAAO,IAAI,IAAI,MAAM,KAAK;AAC3C,WAAO,IAAI,IAAI,MAAM,QAAQ,CAAC,MAAM,KAAK,IAAI,CAAC,CAAC;AAAA,EACjD,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,aAAa,QAAQ,MAAM;AAC/B,UAAM,MAAM,oBAAI,IAAmB;AACnC,eAAW,QAAQ,MAAO,KAAI,IAAI,WAAW,IAAI,GAAG,IAAI;AACxD,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,UAAU,CAAC;AAEtB,QAAM,gBAAgB,QAAQ,MAAM;AAClC,QAAI,CAAC,MAAM,MAAO,QAAO,CAAC;AAC1B,UAAM,SAAkB,CAAC;AACzB,eAAW,OAAO,MAAM,OAAO;AAC7B,YAAM,OAAO,WAAW,IAAI,GAAG;AAC/B,UAAI,KAAM,QAAO,KAAK,IAAI;AAAA,IAC5B;AACA,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,UAAU,CAAC;AAEtB,QAAM,gBAAgB,QAAQ,MAAM;AAClC,QAAI,CAAC,MAAM,KAAK,EAAG,QAAO;AAC1B,UAAM,SAAS,MAAM,YAAY;AACjC,WAAO,MAAM,OAAO,CAAC,SAAS;AAC5B,YAAM,OAAO,qBAAqB,cAAc,IAAI,EAAE,YAAY;AAClE,aAAO,IAAI,SAAS,MAAM;AAAA,IAC5B,CAAC;AAAA,EACH,GAAG,CAAC,OAAO,OAAO,cAAc,iBAAiB,CAAC;AAElD,kBAAgB,YAAY,MAAM,QAAQ,KAAK,CAAC;AAEhD,YAAU,MAAM;AACd,mBAAe,cAAc;AAAA,EAC/B,GAAG,CAAC,OAAO,IAAI,CAAC;AAEhB,YAAU,MAAM;AACd,QAAI,cAAc,KAAK,CAAC,QAAQ,QAAS;AACzC,UAAM,QAAQ,QAAQ,QAAQ,SAAS,WAAW;AAClD,WAAO,eAAe,EAAE,OAAO,UAAU,CAAC;AAAA,EAC5C,GAAG,CAAC,WAAW,CAAC;AAEhB,QAAM,kBAAkB;AAAA,IACtB,CAAC,SAAgB;AACf,YAAM,MAAM,WAAW,IAAI;AAC3B,UAAI,MAAM,OAAO;AACf,cAAM,UAAU,MAAM,MAAM,SAAS,GAAG;AACxC,cAAM,OAAO,UAAU,MAAM,MAAM,OAAO,CAAC,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,MAAM,OAAO,GAAG;AAClF,cAAM,SAAS,IAAI;AACnB,iBAAS,EAAE;AACX,iBAAS,SAAS,MAAM;AAAA,MAC1B,OAAO;AACL,cAAM,SAAS,QAAQ,MAAM,QAAQ,OAAO,GAAG;AAC/C,iBAAS,EAAE;AACX,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF;AAAA,IACA,CAAC,YAAY,KAAK;AAAA,EACpB;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,QAAgB;AACf,UAAI,CAAC,MAAM,OAAO;AAChB,cAAM,SAAS,IAAI;AACnB;AAAA,MACF;AACA,YAAM,SAAS,MAAM,MAAM,OAAO,CAAC,MAAM,MAAM,GAAG,CAAC;AAAA,IACrD;AAAA,IACA,CAAC,KAAK;AAAA,EACR;AAEA,QAAM,WAAW,YAAY,MAAM;AACjC,QAAI,MAAM,MAAO,OAAM,SAAS,CAAC,CAAC;AAAA,QAC7B,OAAM,SAAS,IAAI;AACxB,aAAS,EAAE;AAAA,EACb,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,YAAY,CAAC,UAAgD;AACjE,QAAI,SAAU;AACd,QAAI,MAAM,SAAS,MAAM,QAAQ,eAAe,CAAC,SAAS,MAAM,MAAM,SAAS,GAAG;AAChF,gBAAU,MAAM,MAAM,MAAM,MAAM,SAAS,CAAC,CAAC;AAC7C;AAAA,IACF;AACA,QAAI,CAAC,MAAM;AACT,UAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,SAAS;AACtD,cAAM,eAAe;AACrB,gBAAQ,IAAI;AAAA,MACd;AACA;AAAA,IACF;AACA,YAAQ,MAAM,KAAK;AAAA,MACjB,KAAK;AACH,cAAM,eAAe;AACrB,uBAAe,CAAC,SAAS,KAAK,IAAI,OAAO,GAAG,cAAc,SAAS,CAAC,CAAC;AACrE;AAAA,MACF,KAAK;AACH,cAAM,eAAe;AACrB,uBAAe,CAAC,SAAS,KAAK,IAAI,OAAO,GAAG,CAAC,CAAC;AAC9C;AAAA,MACF,KAAK;AACH,cAAM,eAAe;AACrB,YAAI,eAAe,KAAK,cAAc,WAAW,EAAG,iBAAgB,cAAc,WAAW,CAAC;AAC9F;AAAA,MACF,KAAK;AACH,gBAAQ,KAAK;AACb,iBAAS,EAAE;AACX;AAAA,IACJ;AAAA,EACF;AAEA,QAAM,cAAc,CAAC,MAAM,SAAS,MAAM,QAAQ,WAAW,IAAI,MAAM,KAAK,IAAI;AAChF,QAAM,gBAAgB,cAAc,aAAa,WAAW,IAAI;AAChE,QAAM,YAAY,MAAM,QAAQ,MAAM,MAAM,SAAS,IAAI,QAAQ,MAAM,KAAK;AAE5E,QAAM,WAAW,eAAe,CAAC,SAA6C,kBAAkB,MAAM,YAAY;AAElH,QAAM,iBACJ,eAAe,KAAK,cAAc,WAAW,IACzC,GAAG,SAAS,QAAQ,WAAW,cAAc,WAAW,CAAC,CAAC,KAC1D;AAEN,QAAM,iBAAiB,MAAM,QAAQ,MAAM,kBAAkB,WAAW;AACxE,QAAM,cAAc,cAAc,MAAM,GAAG,cAAc;AACzD,QAAM,eAAe,cAAc,SAAS,YAAY;AAExD,SACE,qBAAC,SAAI,KAAK,YAAY,WAAW,GAAG,YAAY,SAAS,GACvD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,YAAY;AAAA,QACd;AAAA,QACA,SAAS,MAAM,SAAS,SAAS,MAAM;AAAA,QAEtC;AAAA,gBAAM,QACH,YAAY,IAAI,CAAC,SAAS;AACxB,kBAAM,MAAM,WAAW,IAAI;AAC3B,mBACE;AAAA,cAAC;AAAA;AAAA,gBAEC,WAAU;AAAA,gBAET;AAAA,+BAAa,IAAI;AAAA,kBAClB;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,SAAS,CAAC,UAAU;AAClB,8BAAM,gBAAgB;AACtB,kCAAU,GAAG;AAAA,sBACf;AAAA,sBACA,cAAY,UAAU,aAAa,IAAI,CAAC;AAAA,sBACxC,WAAU;AAAA,sBAET;AAAA;AAAA,kBACH;AAAA;AAAA;AAAA,cAdK;AAAA,YAeP;AAAA,UAEJ,CAAC,IACD;AAAA,UACH,MAAM,SAAS,eAAe,IAC7B;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO,cACJ,MAAM,YAAY,MAAM,EACxB,IAAI,CAAC,MAAM,aAAa,CAAC,CAAC,EAC1B,KAAK,IAAI;AAAA,cACb;AAAA;AAAA,gBACG;AAAA;AAAA;AAAA,UACJ,IACE;AAAA,UACJ;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,MAAK;AAAA,cACL,MAAK;AAAA,cACL,iBAAe;AAAA,cACf,iBAAe;AAAA,cACf,yBAAuB;AAAA,cACvB,qBAAkB;AAAA,cAClB,cAAY;AAAA,cACZ;AAAA,cACA,OAAO,MAAM,QAAQ,QAAQ,OAAO,QAAQ,iBAAiB;AAAA,cAC7D;AAAA,cACA,UAAU,CAAC,UAAU;AACnB,yBAAS,MAAM,OAAO,KAAK;AAC3B,oBAAI,CAAC,KAAM,SAAQ,IAAI;AACvB,oBAAI,CAAC,MAAM,SAAS,MAAM,SAAS,MAAM,OAAO,UAAU,cAAe,OAAM,SAAS,IAAI;AAAA,cAC9F;AAAA,cACA,SAAS,MAAM;AACb,oBAAI,CAAC,KAAM,SAAQ,IAAI;AACvB,oBAAI,CAAC,MAAM,SAAS,MAAM,MAAO,UAAS,EAAE;AAAA,cAC9C;AAAA,cACA;AAAA,cACA,WAAU;AAAA;AAAA,UACZ;AAAA,UACC,YACC;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAS,CAAC,UAAU;AAClB,sBAAM,gBAAgB;AACtB,yBAAS;AAAA,cACX;AAAA,cACA,cAAW;AAAA,cACX,WAAU;AAAA,cAET;AAAA;AAAA,UACH,IACE;AAAA;AAAA;AAAA,IACN;AAAA,IACC,OACC;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,IAAI;AAAA,QACJ,MAAK;AAAA,QACL,OAAO,EAAE,WAAW,cAAc;AAAA,QAClC,WAAU;AAAA,QAET,wBAAc,WAAW,IACxB,oBAAC,QAAG,WAAU,uDAAuD,qBAAU,IAE/E,cAAc,IAAI,CAAC,MAAM,UAAU;AACjC,gBAAM,MAAM,WAAW,IAAI;AAC3B,gBAAM,gBAAgB,UAAU;AAChC,gBAAM,aAAa,aAAa,IAAI,GAAG;AACvC,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,IAAI,GAAG,SAAS,QAAQ,GAAG;AAAA,cAC3B,MAAK;AAAA,cACL,iBAAe;AAAA,cACf,SAAS,MAAM,gBAAgB,IAAI;AAAA,cACnC,cAAc,MAAM,eAAe,KAAK;AAAA,cACxC,WAAW;AAAA,gBACT;AAAA,gBACA,iBAAiB;AAAA,gBACjB,cAAc;AAAA,cAChB;AAAA,cAEC;AAAA,yBAAS,EAAE,MAAM,aAAa,eAAe,UAAU,YAAY,MAAM,CAAC;AAAA,gBAC1E,aAAa,oBAAC,UAAK,WAAU,WAAW,oBAAS,IAAU;AAAA;AAAA;AAAA,YAbvD;AAAA,UAcP;AAAA,QAEJ,CAAC;AAAA;AAAA,IAEL,IACE;AAAA,KACN;AAEJ;","names":[]}

package/dist/components/organisms/autocomplete/autocomplete.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { Autocomplete } from "./autocomplete.js";
+interface ITicker {
+    symbol: string;
+    name: string;
+    exchange: string;
+}
+declare const meta: Meta<typeof Autocomplete<ITicker>>;
+export default meta;
+type Story = StoryObj<typeof Autocomplete<ITicker>>;
+export declare const Single: Story;
+export declare const Multi: Story;
+export declare const MultiWithOverflow: Story;
+//# sourceMappingURL=autocomplete.stories.d.ts.map

package/dist/components/organisms/autocomplete/autocomplete.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/autocomplete/autocomplete.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,UAAU,OAAO;IACf,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;CAClB;AAeD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAAC,OAAO,CAAC,CAI5C,CAAC;AACF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;AAEpD,eAAO,MAAM,MAAM,EAAE,KAkBpB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KA6BnB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAkB/B,CAAC"}

package/dist/components/organisms/autocomplete/index.d.ts

@@ -0,0 +1,3 @@
+export { Autocomplete } from "./autocomplete.js";
+export type { IAutocompleteProps, IAutocompleteSingleProps, IAutocompleteMultiProps, IAutocompleteRenderItemArgs, } from "./autocomplete.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/organisms/autocomplete/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/autocomplete/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,YAAY,EACV,kBAAkB,EAClB,wBAAwB,EACxB,uBAAuB,EACvB,2BAA2B,GAC5B,MAAM,mBAAmB,CAAC"}

package/dist/components/organisms/autocomplete/index.js

@@ -0,0 +1,5 @@
+import { Autocomplete } from "./autocomplete.js";
+export {
+  Autocomplete
+};
+//# sourceMappingURL=index.js.map

package/dist/components/organisms/autocomplete/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/organisms/autocomplete/index.ts"],"sourcesContent":["export { Autocomplete } from \"./autocomplete.js\";\nexport type {\n  IAutocompleteProps,\n  IAutocompleteSingleProps,\n  IAutocompleteMultiProps,\n  IAutocompleteRenderItemArgs,\n} from \"./autocomplete.js\";\n"],"mappings":"AAAA,SAAS,oBAAoB;","names":[]}

package/dist/components/organisms/charts/bar-chart.d.ts

@@ -0,0 +1,24 @@
+export interface IBarChartDatum {
+    label: string;
+    value: number;
+    /** Per-bar color override (otherwise uses the chart's default color). */
+    color?: string;
+}
+export interface IBarChartProps {
+    data: ReadonlyArray<IBarChartDatum>;
+    /** Default bar color when a datum doesn't set its own. */
+    color?: string;
+    heightPx?: number;
+    yFormatter?: (value: number) => string;
+    tooltipValueFormatter?: (value: number) => string;
+    className?: string;
+    ariaLabel?: string;
+    showGrid?: boolean;
+    /** Show the x-axis category labels. */
+    showLabels?: boolean;
+}
+/**
+ * Simple categorical bar chart. Use for signal counts, breakdowns by tag, etc.
+ */
+export declare function BarChart({ data, color, heightPx, yFormatter, tooltipValueFormatter, className, ariaLabel, showGrid, showLabels, }: IBarChartProps): import("react").JSX.Element;
+//# sourceMappingURL=bar-chart.d.ts.map

package/dist/components/organisms/charts/bar-chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bar-chart.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/charts/bar-chart.tsx"],"names":[],"mappings":"AA2BA,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACpC,0DAA0D;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAiB,EACjB,QAA4B,EAC5B,UAAU,EACV,qBAAqB,EACrB,SAAS,EACT,SAAS,EACT,QAAe,EACf,UAAiB,GAClB,EAAE,cAAc,+BA4ChB"}