@noambz/ui 0.7.0

package/dist/components/molecules/language-toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/language-toggle/index.ts"],"sourcesContent":["export { LanguageToggle } from \"./language-toggle.js\";\nexport type { ILanguageToggleProps, ILanguageToggleOption } from \"./language-toggle.js\";\n"],"mappings":"AAAA,SAAS,sBAAsB;","names":[]}

package/dist/components/molecules/language-toggle/language-toggle.d.ts

@@ -0,0 +1,18 @@
+export interface ILanguageToggleOption<TLocale extends string> {
+    value: TLocale;
+    label: string;
+}
+export interface ILanguageToggleProps<TLocale extends string> {
+    locale: TLocale;
+    options: readonly [ILanguageToggleOption<TLocale>, ILanguageToggleOption<TLocale>];
+    onChange: (locale: TLocale) => void;
+    separator?: string;
+}
+/**
+ * Two-locale toggle button. Renders both option labels with the active one
+ * emphasized, and flips to the other locale on click. Unlike the prior
+ * flight-finder version, locale values and labels are provided by the
+ * consumer so the component is not hard-coded to en/he.
+ */
+export declare function LanguageToggle<TLocale extends string>({ locale, options, onChange, separator, }: ILanguageToggleProps<TLocale>): import("react").JSX.Element;
+//# sourceMappingURL=language-toggle.d.ts.map

package/dist/components/molecules/language-toggle/language-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-toggle.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/language-toggle/language-toggle.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,qBAAqB,CAAC,OAAO,SAAS,MAAM;IAC3D,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB,CAAC,OAAO,SAAS,MAAM;IAC1D,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,SAAS,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC;IACnF,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,OAAO,SAAS,MAAM,EAAE,EACrD,MAAM,EACN,OAAO,EACP,QAAQ,EACR,SAAe,GAChB,EAAE,oBAAoB,CAAC,OAAO,CAAC,+BAc/B"}

package/dist/components/molecules/language-toggle/language-toggle.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+function LanguageToggle({
+  locale,
+  options,
+  onChange,
+  separator = "|"
+}) {
+  const [first, second] = options;
+  const other = locale === first.value ? second.value : first.value;
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      onClick: () => onChange(other),
+      className: "flex items-center gap-1.5 rounded-lg border border-border-strong px-3 py-1.5 text-sm font-medium transition-colors hover:bg-surface-muted",
+      children: [
+        /* @__PURE__ */ jsx("span", { className: locale === first.value ? "font-bold" : "opacity-60", children: first.label }),
+        /* @__PURE__ */ jsx("span", { className: "text-muted", children: separator }),
+        /* @__PURE__ */ jsx("span", { className: locale === second.value ? "font-bold" : "opacity-60", children: second.label })
+      ]
+    }
+  );
+}
+export {
+  LanguageToggle
+};
+//# sourceMappingURL=language-toggle.js.map

package/dist/components/molecules/language-toggle/language-toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/language-toggle/language-toggle.tsx"],"sourcesContent":["\"use client\";\n\nexport interface ILanguageToggleOption<TLocale extends string> {\n  value: TLocale;\n  label: string;\n}\n\nexport interface ILanguageToggleProps<TLocale extends string> {\n  locale: TLocale;\n  options: readonly [ILanguageToggleOption<TLocale>, ILanguageToggleOption<TLocale>];\n  onChange: (locale: TLocale) => void;\n  separator?: string;\n}\n\n/**\n * Two-locale toggle button. Renders both option labels with the active one\n * emphasized, and flips to the other locale on click. Unlike the prior\n * flight-finder version, locale values and labels are provided by the\n * consumer so the component is not hard-coded to en/he.\n */\nexport function LanguageToggle<TLocale extends string>({\n  locale,\n  options,\n  onChange,\n  separator = \"|\",\n}: ILanguageToggleProps<TLocale>) {\n  const [first, second] = options;\n  const other = locale === first.value ? second.value : first.value;\n\n  return (\n    <button\n      onClick={() => onChange(other)}\n      className=\"flex items-center gap-1.5 rounded-lg border border-border-strong px-3 py-1.5 text-sm font-medium transition-colors hover:bg-surface-muted\"\n    >\n      <span className={locale === first.value ? \"font-bold\" : \"opacity-60\"}>{first.label}</span>\n      <span className=\"text-muted\">{separator}</span>\n      <span className={locale === second.value ? \"font-bold\" : \"opacity-60\"}>{second.label}</span>\n    </button>\n  );\n}\n"],"mappings":";AA8BI,SAIE,KAJF;AAVG,SAAS,eAAuC;AAAA,EACrD;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AACd,GAAkC;AAChC,QAAM,CAAC,OAAO,MAAM,IAAI;AACxB,QAAM,QAAQ,WAAW,MAAM,QAAQ,OAAO,QAAQ,MAAM;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,MAAM,SAAS,KAAK;AAAA,MAC7B,WAAU;AAAA,MAEV;AAAA,4BAAC,UAAK,WAAW,WAAW,MAAM,QAAQ,cAAc,cAAe,gBAAM,OAAM;AAAA,QACnF,oBAAC,UAAK,WAAU,cAAc,qBAAU;AAAA,QACxC,oBAAC,UAAK,WAAW,WAAW,OAAO,QAAQ,cAAc,cAAe,iBAAO,OAAM;AAAA;AAAA;AAAA,EACvF;AAEJ;","names":[]}

package/dist/components/molecules/language-toggle/language-toggle.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { LanguageToggle } from "./language-toggle.js";
+type Locale = "en" | "he";
+declare const meta: Meta<typeof LanguageToggle<Locale>>;
+export default meta;
+type Story = StoryObj<typeof LanguageToggle<Locale>>;
+export declare const Default: Story;
+export declare const Hebrew: Story;
+//# sourceMappingURL=language-toggle.stories.d.ts.map

package/dist/components/molecules/language-toggle/language-toggle.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-toggle.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/language-toggle/language-toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,KAAK,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;AAO1B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAAC,MAAM,CAAC,CAY7C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;AAErD,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAKpB,CAAC"}

package/dist/components/molecules/multi-toggle/index.d.ts

@@ -0,0 +1,3 @@
+export { MultiToggle } from "./multi-toggle.js";
+export type { IMultiToggleOption, IMultiToggleProps } from "./multi-toggle.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/multi-toggle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-toggle/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/molecules/multi-toggle/index.js

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

package/dist/components/molecules/multi-toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/multi-toggle/index.ts"],"sourcesContent":["export { MultiToggle } from \"./multi-toggle.js\";\nexport type { IMultiToggleOption, IMultiToggleProps } from \"./multi-toggle.js\";\n"],"mappings":"AAAA,SAAS,mBAAmB;","names":[]}

package/dist/components/molecules/multi-toggle/multi-toggle.d.ts

@@ -0,0 +1,26 @@
+import { type VariantProps } from "class-variance-authority";
+import { type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
+export interface IMultiToggleOption<TValue extends string = string> {
+    value: TValue;
+    label: ReactNode;
+    disabled?: boolean;
+}
+declare const rootVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+    fullWidth?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface IMultiToggleProps<TValue extends string = string> extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue">, VariantProps<typeof rootVariants> {
+    value: TValue;
+    onValueChange: (value: TValue) => void;
+    options: ReadonlyArray<IMultiToggleOption<TValue>>;
+    ariaLabel?: string;
+}
+/**
+ * Segmented toggle with exactly one selected value at a time. The consumer is
+ * responsible for persisting state; this component only reports changes.
+ */
+export declare const MultiToggle: <TValue extends string>(props: IMultiToggleProps<TValue> & {
+    ref?: Ref<HTMLDivElement>;
+}) => ReactElement;
+export {};
+//# sourceMappingURL=multi-toggle.d.ts.map

package/dist/components/molecules/multi-toggle/multi-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-toggle.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-toggle/multi-toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAGrG,MAAM,WAAW,kBAAkB,CAAC,MAAM,SAAS,MAAM,GAAG,MAAM;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,YAAY;;;8EAchB,CAAC;AAuBH,MAAM,WAAW,iBAAiB,CAAC,MAAM,SAAS,MAAM,GAAG,MAAM,CAC/D,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,cAAc,CAAC,EACvE,YAAY,CAAC,OAAO,YAAY,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAC;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,EAgCnB,CAAC,MAAM,SAAS,MAAM,EAAE,KAAK,EAAE,iBAAiB,CAAC,MAAM,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,KAAK,YAAY,CAAC"}

package/dist/components/molecules/multi-toggle/multi-toggle.js

@@ -0,0 +1,75 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { forwardRef } from "react";
+import { cn } from "../../../utils/cn.js";
+const rootVariants = cva("inline-flex rounded-lg border border-border-strong bg-surface p-0.5", {
+  variants: {
+    size: {
+      sm: "h-8",
+      md: "h-9",
+      lg: "h-11"
+    },
+    fullWidth: {
+      true: "w-full"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+const itemVariants = cva(
+  "inline-flex flex-1 items-center justify-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+  {
+    variants: {
+      size: {
+        sm: "h-7 px-2 text-xs",
+        md: "h-8 px-3 text-sm",
+        lg: "h-10 px-4 text-base"
+      },
+      active: {
+        true: "bg-background text-foreground shadow-sm",
+        false: "text-muted-foreground hover:text-foreground"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      active: false
+    }
+  }
+);
+const MultiToggle = forwardRef(
+  function MultiToggleImpl({ className, size, fullWidth, value, onValueChange, options, ariaLabel, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "radiogroup",
+        "aria-label": ariaLabel,
+        className: cn(rootVariants({ size, fullWidth }), className),
+        ...props,
+        children: options.map((option) => {
+          const active = option.value === value;
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              role: "radio",
+              "aria-checked": active,
+              disabled: option.disabled,
+              onClick: () => onValueChange(option.value),
+              className: cn(itemVariants({ size, active })),
+              children: option.label
+            },
+            option.value
+          );
+        })
+      }
+    );
+  }
+);
+MultiToggle.displayName = "MultiToggle";
+export {
+  MultiToggle
+};
+//# sourceMappingURL=multi-toggle.js.map

package/dist/components/molecules/multi-toggle/multi-toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/multi-toggle/multi-toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { forwardRef, type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from \"react\";\nimport { cn } from \"../../../utils/cn.js\";\n\nexport interface IMultiToggleOption<TValue extends string = string> {\n  value: TValue;\n  label: ReactNode;\n  disabled?: boolean;\n}\n\nconst rootVariants = cva(\"inline-flex rounded-lg border border-border-strong bg-surface p-0.5\", {\n  variants: {\n    size: {\n      sm: \"h-8\",\n      md: \"h-9\",\n      lg: \"h-11\",\n    },\n    fullWidth: {\n      true: \"w-full\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\nconst itemVariants = cva(\n  \"inline-flex flex-1 items-center justify-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n  {\n    variants: {\n      size: {\n        sm: \"h-7 px-2 text-xs\",\n        md: \"h-8 px-3 text-sm\",\n        lg: \"h-10 px-4 text-base\",\n      },\n      active: {\n        true: \"bg-background text-foreground shadow-sm\",\n        false: \"text-muted-foreground hover:text-foreground\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n      active: false,\n    },\n  },\n);\n\nexport interface IMultiToggleProps<TValue extends string = string>\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\">,\n    VariantProps<typeof rootVariants> {\n  value: TValue;\n  onValueChange: (value: TValue) => void;\n  options: ReadonlyArray<IMultiToggleOption<TValue>>;\n  ariaLabel?: string;\n}\n\n/**\n * Segmented toggle with exactly one selected value at a time. The consumer is\n * responsible for persisting state; this component only reports changes.\n */\nexport const MultiToggle = forwardRef<HTMLDivElement, IMultiToggleProps>(\n  function MultiToggleImpl(\n    { className, size, fullWidth, value, onValueChange, options, ariaLabel, ...props },\n    ref,\n  ) {\n    return (\n    <div\n      ref={ref}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      className={cn(rootVariants({ size, fullWidth }), className)}\n      {...props}\n    >\n      {options.map((option) => {\n        const active = option.value === value;\n        return (\n          <button\n            key={option.value}\n            type=\"button\"\n            role=\"radio\"\n            aria-checked={active}\n            disabled={option.disabled}\n            onClick={() => onValueChange(option.value)}\n            className={cn(itemVariants({ size, active }))}\n          >\n            {option.label}\n          </button>\n        );\n      })}\n      </div>\n    );\n  },\n) as <TValue extends string>(props: IMultiToggleProps<TValue> & { ref?: Ref<HTMLDivElement> }) => ReactElement;\n\n(MultiToggle as unknown as { displayName?: string }).displayName = \"MultiToggle\";\n"],"mappings":";AA8EU;AA5EV,SAAS,WAA8B;AACvC,SAAS,kBAAoF;AAC7F,SAAS,UAAU;AAQnB,MAAM,eAAe,IAAI,uEAAuE;AAAA,EAC9F,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACA,WAAW;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,EACR;AACF,CAAC;AAED,MAAM,eAAe;AAAA,EACnB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,QAAQ;AAAA,IACV;AAAA,EACF;AACF;AAeO,MAAM,cAAc;AAAA,EACzB,SAAS,gBACP,EAAE,WAAW,MAAM,WAAW,OAAO,eAAe,SAAS,WAAW,GAAG,MAAM,GACjF,KACA;AACA,WACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,cAAY;AAAA,QACZ,WAAW,GAAG,aAAa,EAAE,MAAM,UAAU,CAAC,GAAG,SAAS;AAAA,QACzD,GAAG;AAAA,QAEH,kBAAQ,IAAI,CAAC,WAAW;AACvB,gBAAM,SAAS,OAAO,UAAU;AAChC,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,MAAK;AAAA,cACL,MAAK;AAAA,cACL,gBAAc;AAAA,cACd,UAAU,OAAO;AAAA,cACjB,SAAS,MAAM,cAAc,OAAO,KAAK;AAAA,cACzC,WAAW,GAAG,aAAa,EAAE,MAAM,OAAO,CAAC,CAAC;AAAA,cAE3C,iBAAO;AAAA;AAAA,YARH,OAAO;AAAA,UASd;AAAA,QAEJ,CAAC;AAAA;AAAA,IACD;AAAA,EAEJ;AACF;AAEC,YAAoD,cAAc;","names":[]}

package/dist/components/molecules/multi-toggle/multi-toggle.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { MultiToggle } from "./multi-toggle.js";
+declare const meta: Meta<typeof MultiToggle>;
+export default meta;
+type Story = StoryObj<typeof MultiToggle>;
+export declare const Default: Story;
+export declare const FullWidth: Story;
+export declare const Sizes: Story;
+//# sourceMappingURL=multi-toggle.stories.d.ts.map

package/dist/components/molecules/multi-toggle/multi-toggle.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-toggle.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-toggle/multi-toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAIlC,CAAC;AACF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAS1C,eAAO,MAAM,OAAO,EAAE,KAYrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAevB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAWnB,CAAC"}

package/dist/components/molecules/number-input/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberInput, type INumberInputProps } from "./number-input.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/number-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/number-input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,iBAAiB,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/molecules/number-input/index.js

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

package/dist/components/molecules/number-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/number-input/index.ts"],"sourcesContent":["export { NumberInput, type INumberInputProps } from \"./number-input.js\";\n"],"mappings":"AAAA,SAAS,mBAA2C;","names":[]}

package/dist/components/molecules/number-input/number-input.d.ts

@@ -0,0 +1,22 @@
+import { type IInputProps } from "../../atoms/input/input.js";
+export interface INumberInputProps extends Omit<IInputProps, "type" | "onChange" | "value" | "defaultValue"> {
+    value?: number | "";
+    defaultValue?: number;
+    min?: number;
+    max?: number;
+    step?: number;
+    /** Called with the parsed number (or `null` when cleared). */
+    onChange?: (value: number | null) => void;
+    /** Accessible labels for the stepper buttons. */
+    incrementLabel?: string;
+    decrementLabel?: string;
+    /** Hide the +/- stepper buttons. */
+    hideSteppers?: boolean;
+}
+/**
+ * Numeric input with increment / decrement buttons that respect `min`, `max`,
+ * and `step`. Calls `onChange` with a parsed `number`, or `null` when the
+ * field is cleared.
+ */
+export declare const NumberInput: import("react").ForwardRefExoticComponent<INumberInputProps & import("react").RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=number-input.d.ts.map

package/dist/components/molecules/number-input/number-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-input.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/number-input/number-input.tsx"],"names":[],"mappings":"AASA,OAAO,EAAS,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAKrE,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,cAAc,CAAC;IACzE,KAAK,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1C,iDAAiD;IACjD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oCAAoC;IACpC,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAQD;;;;GAIG;AACH,eAAO,MAAM,WAAW,gHAuGvB,CAAC"}

package/dist/components/molecules/number-input/number-input.js

@@ -0,0 +1,115 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  forwardRef,
+  useCallback,
+  useImperativeHandle,
+  useRef
+} from "react";
+import { Input } from "../../atoms/input/input.js";
+import { cn } from "../../../utils/cn.js";
+const DEFAULT_NUMBER_INPUT_STEP = 1;
+function clamp(value, min, max) {
+  if (min !== void 0 && value < min) return min;
+  if (max !== void 0 && value > max) return max;
+  return value;
+}
+const NumberInput = forwardRef(
+  ({
+    value,
+    defaultValue,
+    min,
+    max,
+    step = DEFAULT_NUMBER_INPUT_STEP,
+    onChange,
+    incrementLabel = "Increase value",
+    decrementLabel = "Decrease value",
+    hideSteppers = false,
+    className,
+    disabled,
+    ...props
+  }, forwardedRef) => {
+    const innerRef = useRef(null);
+    useImperativeHandle(forwardedRef, () => innerRef.current);
+    const isControlled = value !== void 0;
+    const emit = useCallback(
+      (next) => {
+        const clamped = clamp(next, min, max);
+        onChange?.(clamped);
+        if (!isControlled && innerRef.current) {
+          innerRef.current.value = String(clamped);
+        }
+      },
+      [isControlled, min, max, onChange]
+    );
+    const readCurrent = useCallback(() => {
+      if (isControlled) {
+        return typeof value === "number" ? value : 0;
+      }
+      const raw = innerRef.current?.value ?? "";
+      const parsed = parseFloat(raw);
+      return Number.isFinite(parsed) ? parsed : 0;
+    }, [isControlled, value]);
+    const handleChange = (event) => {
+      const raw = event.target.value;
+      if (raw === "" || raw === "-") {
+        onChange?.(null);
+        return;
+      }
+      const parsed = parseFloat(raw);
+      if (Number.isFinite(parsed)) {
+        onChange?.(clamp(parsed, min, max));
+      }
+    };
+    const canDecrement = !disabled && (min === void 0 || readCurrent() > min);
+    const canIncrement = !disabled && (max === void 0 || readCurrent() < max);
+    return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          ref: innerRef,
+          type: "number",
+          inputMode: "decimal",
+          min,
+          max,
+          step,
+          value,
+          defaultValue,
+          onChange: handleChange,
+          disabled,
+          className: cn(hideSteppers ? "" : "pe-10", "[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"),
+          ...props
+        }
+      ),
+      !hideSteppers ? /* @__PURE__ */ jsxs("div", { className: "absolute inset-y-1 end-1 flex flex-col items-stretch gap-px", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": incrementLabel,
+            onClick: () => emit(readCurrent() + step),
+            disabled: !canIncrement,
+            className: "flex h-1/2 w-7 items-center justify-center rounded-t-md text-muted-foreground transition-colors hover:bg-surface-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+            children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 10 6", className: "h-2 w-2.5", fill: "currentColor", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "M5 0l5 6H0z" }) })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": decrementLabel,
+            onClick: () => emit(readCurrent() - step),
+            disabled: !canDecrement,
+            className: "flex h-1/2 w-7 items-center justify-center rounded-b-md text-muted-foreground transition-colors hover:bg-surface-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+            children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 10 6", className: "h-2 w-2.5", fill: "currentColor", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "M5 6l5-6H0z" }) })
+          }
+        )
+      ] }) : null
+    ] });
+  }
+);
+NumberInput.displayName = "NumberInput";
+export {
+  NumberInput
+};
+//# sourceMappingURL=number-input.js.map

package/dist/components/molecules/number-input/number-input.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/number-input/number-input.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n  type InputHTMLAttributes,\n} from \"react\";\nimport { Input, type IInputProps } from \"../../atoms/input/input.js\";\nimport { cn } from \"../../../utils/cn.js\";\n\nconst DEFAULT_NUMBER_INPUT_STEP = 1;\n\nexport interface INumberInputProps\n  extends Omit<IInputProps, \"type\" | \"onChange\" | \"value\" | \"defaultValue\"> {\n  value?: number | \"\";\n  defaultValue?: number;\n  min?: number;\n  max?: number;\n  step?: number;\n  /** Called with the parsed number (or `null` when cleared). */\n  onChange?: (value: number | null) => void;\n  /** Accessible labels for the stepper buttons. */\n  incrementLabel?: string;\n  decrementLabel?: string;\n  /** Hide the +/- stepper buttons. */\n  hideSteppers?: boolean;\n}\n\nfunction clamp(value: number, min: number | undefined, max: number | undefined) {\n  if (min !== undefined && value < min) return min;\n  if (max !== undefined && value > max) return max;\n  return value;\n}\n\n/**\n * Numeric input with increment / decrement buttons that respect `min`, `max`,\n * and `step`. Calls `onChange` with a parsed `number`, or `null` when the\n * field is cleared.\n */\nexport const NumberInput = forwardRef<HTMLInputElement, INumberInputProps>(\n  (\n    {\n      value,\n      defaultValue,\n      min,\n      max,\n      step = DEFAULT_NUMBER_INPUT_STEP,\n      onChange,\n      incrementLabel = \"Increase value\",\n      decrementLabel = \"Decrease value\",\n      hideSteppers = false,\n      className,\n      disabled,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    const innerRef = useRef<HTMLInputElement | null>(null);\n    useImperativeHandle(forwardedRef, () => innerRef.current as HTMLInputElement);\n\n    const isControlled = value !== undefined;\n\n    const emit = useCallback(\n      (next: number) => {\n        const clamped = clamp(next, min, max);\n        onChange?.(clamped);\n        if (!isControlled && innerRef.current) {\n          innerRef.current.value = String(clamped);\n        }\n      },\n      [isControlled, min, max, onChange],\n    );\n\n    const readCurrent = useCallback((): number => {\n      if (isControlled) {\n        return typeof value === \"number\" ? value : 0;\n      }\n      const raw = innerRef.current?.value ?? \"\";\n      const parsed = parseFloat(raw);\n      return Number.isFinite(parsed) ? parsed : 0;\n    }, [isControlled, value]);\n\n    const handleChange: InputHTMLAttributes<HTMLInputElement>[\"onChange\"] = (event) => {\n      const raw = event.target.value;\n      if (raw === \"\" || raw === \"-\") {\n        onChange?.(null);\n        return;\n      }\n      const parsed = parseFloat(raw);\n      if (Number.isFinite(parsed)) {\n        onChange?.(clamp(parsed, min, max));\n      }\n    };\n\n    const canDecrement = !disabled && (min === undefined || readCurrent() > min);\n    const canIncrement = !disabled && (max === undefined || readCurrent() < max);\n\n    return (\n      <div className={cn(\"relative\", className)}>\n        <Input\n          ref={innerRef}\n          type=\"number\"\n          inputMode=\"decimal\"\n          min={min}\n          max={max}\n          step={step}\n          value={value}\n          defaultValue={defaultValue}\n          onChange={handleChange}\n          disabled={disabled}\n          className={cn(hideSteppers ? \"\" : \"pe-10\", \"[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none\")}\n          {...props}\n        />\n        {!hideSteppers ? (\n          <div className=\"absolute inset-y-1 end-1 flex flex-col items-stretch gap-px\">\n            <button\n              type=\"button\"\n              aria-label={incrementLabel}\n              onClick={() => emit(readCurrent() + step)}\n              disabled={!canIncrement}\n              className=\"flex h-1/2 w-7 items-center justify-center rounded-t-md text-muted-foreground transition-colors hover:bg-surface-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none\"\n            >\n              <svg viewBox=\"0 0 10 6\" className=\"h-2 w-2.5\" fill=\"currentColor\" aria-hidden>\n                <path d=\"M5 0l5 6H0z\" />\n              </svg>\n            </button>\n            <button\n              type=\"button\"\n              aria-label={decrementLabel}\n              onClick={() => emit(readCurrent() - step)}\n              disabled={!canDecrement}\n              className=\"flex h-1/2 w-7 items-center justify-center rounded-b-md text-muted-foreground transition-colors hover:bg-surface-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none\"\n            >\n              <svg viewBox=\"0 0 10 6\" className=\"h-2 w-2.5\" fill=\"currentColor\" aria-hidden>\n                <path d=\"M5 6l5-6H0z\" />\n              </svg>\n            </button>\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\nNumberInput.displayName = \"NumberInput\";\n"],"mappings":"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","names":[]}

package/dist/components/molecules/number-input/number-input.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { NumberInput } from "./number-input.js";
+declare const meta: Meta<typeof NumberInput>;
+export default meta;
+type Story = StoryObj<typeof NumberInput>;
+export declare const Uncontrolled: Story;
+export declare const Controlled: Story;
+export declare const DecimalStep: Story;
+export declare const WithoutSteppers: Story;
+//# sourceMappingURL=number-input.stories.d.ts.map

package/dist/components/molecules/number-input/number-input.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-input.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/number-input/number-input.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAIlC,CAAC;AACF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAM1C,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAgBxB,CAAC;AAIF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAK7B,CAAC"}

package/dist/components/molecules/number-input/number-input.test.d.ts

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

package/dist/components/molecules/number-input/number-input.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-input.test.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/number-input/number-input.test.tsx"],"names":[],"mappings":""}

package/dist/components/molecules/otp-input/index.d.ts

@@ -0,0 +1,2 @@
+export { OTPInput, type IOTPInputProps } from "./otp-input.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/otp-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/otp-input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/molecules/otp-input/index.js

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

package/dist/components/molecules/otp-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/otp-input/index.ts"],"sourcesContent":["export { OTPInput, type IOTPInputProps } from \"./otp-input.js\";\n"],"mappings":"AAAA,SAAS,gBAAqC;","names":[]}

package/dist/components/molecules/otp-input/otp-input.d.ts

@@ -0,0 +1,27 @@
+export interface IOTPInputProps {
+    /** Number of code slots. Defaults to 6. */
+    length?: number;
+    /** Controlled value (string of exactly `length` chars, short-padded). */
+    value?: string;
+    /** Default value for uncontrolled usage. */
+    defaultValue?: string;
+    /** Fires with the current concatenated string after every keystroke. */
+    onChange?: (value: string) => void;
+    /** Fires once when the user fills the final slot. */
+    onComplete?: (value: string) => void;
+    /** Restrict input. Defaults to digits only. */
+    pattern?: "numeric" | "alphanumeric" | "any";
+    disabled?: boolean;
+    autoFocus?: boolean;
+    invalid?: boolean;
+    "aria-label"?: string;
+    className?: string;
+    name?: string;
+}
+/**
+ * One-time-password style input. Renders `length` separate character slots
+ * that auto-advance on input and paste-splits across slots. Pressing
+ * backspace on an empty slot focuses the previous slot.
+ */
+export declare const OTPInput: import("react").ForwardRefExoticComponent<IOTPInputProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=otp-input.d.ts.map

package/dist/components/molecules/otp-input/otp-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"otp-input.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/otp-input/otp-input.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,cAAc;IAC7B,2CAA2C;IAC3C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,qDAAqD;IACrD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,+CAA+C;IAC/C,OAAO,CAAC,EAAE,SAAS,GAAG,cAAc,GAAG,KAAK,CAAC;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAQD;;;;GAIG;AACH,eAAO,MAAM,QAAQ,2GA0HpB,CAAC"}

package/dist/components/molecules/otp-input/otp-input.js

@@ -0,0 +1,134 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import {
+  forwardRef,
+  useEffect,
+  useId,
+  useRef,
+  useState
+} from "react";
+import { cn } from "../../../utils/cn.js";
+const DEFAULT_OTP_LENGTH = 6;
+function getPatternRegex(pattern) {
+  if (pattern === "alphanumeric") return /^[a-zA-Z0-9]$/;
+  if (pattern === "any") return /^.$/;
+  return /^[0-9]$/;
+}
+const OTPInput = forwardRef(
+  ({
+    length = DEFAULT_OTP_LENGTH,
+    value,
+    defaultValue,
+    onChange,
+    onComplete,
+    pattern = "numeric",
+    disabled,
+    autoFocus,
+    invalid,
+    className,
+    name,
+    "aria-label": ariaLabel = "Verification code"
+  }, ref) => {
+    const baseId = useId();
+    const refs = useRef([]);
+    const isControlled = value !== void 0;
+    const [inner, setInner] = useState(defaultValue ?? "");
+    const current = isControlled ? value ?? "" : inner;
+    useEffect(() => {
+      if (autoFocus) refs.current[0]?.focus();
+    }, [autoFocus]);
+    const chars = Array.from({ length }, (_, i) => current[i] ?? "");
+    const regex = getPatternRegex(pattern);
+    const setValue = (next) => {
+      const sliced = next.slice(0, length);
+      if (!isControlled) setInner(sliced);
+      onChange?.(sliced);
+      if (sliced.length === length) onComplete?.(sliced);
+    };
+    const focusIndex = (index) => {
+      const clamped = Math.max(0, Math.min(length - 1, index));
+      refs.current[clamped]?.focus();
+      refs.current[clamped]?.select();
+    };
+    const handleChange = (index, rawInput) => {
+      const char = rawInput.slice(-1);
+      if (char && !regex.test(char)) return;
+      const next = chars.map((c, i) => i === index ? char : c);
+      const joined = next.join("").slice(0, length);
+      setValue(joined);
+      if (char) focusIndex(index + 1);
+    };
+    const handleKeyDown = (index, event) => {
+      if (event.key === "Backspace") {
+        if (chars[index]) {
+          const next = chars.map((c, i) => i === index ? "" : c).join("");
+          setValue(next);
+        } else if (index > 0) {
+          const next = chars.map((c, i) => i === index - 1 ? "" : c).join("");
+          setValue(next);
+          focusIndex(index - 1);
+        }
+        event.preventDefault();
+      } else if (event.key === "ArrowLeft") {
+        focusIndex(index - 1);
+        event.preventDefault();
+      } else if (event.key === "ArrowRight") {
+        focusIndex(index + 1);
+        event.preventDefault();
+      }
+    };
+    const handlePaste = (index, event) => {
+      event.preventDefault();
+      const pasted = event.clipboardData.getData("text").trim();
+      const filtered = Array.from(pasted).filter((c) => regex.test(c)).join("");
+      if (!filtered) return;
+      const before = chars.slice(0, index).join("");
+      const joined = (before + filtered).slice(0, length).padEnd(length, "").trimEnd();
+      setValue(joined);
+      const nextFocus = Math.min(length - 1, before.length + filtered.length);
+      focusIndex(nextFocus);
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "group",
+        "aria-label": ariaLabel,
+        className: cn("inline-flex items-center gap-2", className),
+        children: chars.map((char, index) => /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: (node) => {
+              refs.current[index] = node;
+            },
+            id: `${baseId}-${index}`,
+            name: name ? `${name}[${index}]` : void 0,
+            type: "text",
+            inputMode: pattern === "numeric" ? "numeric" : "text",
+            autoComplete: index === 0 ? "one-time-code" : "off",
+            maxLength: 1,
+            value: char,
+            "aria-invalid": invalid || void 0,
+            disabled,
+            onChange: (e) => handleChange(index, e.target.value),
+            onKeyDown: (e) => handleKeyDown(index, e),
+            onPaste: (e) => handlePaste(index, e),
+            onFocus: (e) => e.currentTarget.select(),
+            className: cn(
+              "h-12 w-10 rounded-lg border text-center text-lg font-semibold text-foreground",
+              "bg-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              "disabled:cursor-not-allowed disabled:opacity-50",
+              invalid ? "border-red-500" : "border-border-strong"
+            )
+          },
+          index
+        ))
+      }
+    );
+  }
+);
+OTPInput.displayName = "OTPInput";
+export {
+  OTPInput
+};
+//# sourceMappingURL=otp-input.js.map