@techzyapp/ui-library 1.0.0

package/dist/components/Modal/index.d.cts

@@ -0,0 +1,2 @@
+export { Modal, Modal as default } from './Modal';
+export type { ModalPlacement, ModalProps, ModalScrollBehavior, ModalSize } from './Modal';

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

@@ -0,0 +1,2 @@
+export { Modal, Modal as default } from './Modal';
+export type { ModalPlacement, ModalProps, ModalScrollBehavior, ModalSize } from './Modal';

package/dist/components/Modal/index.js

@@ -0,0 +1,6 @@
+import { M, M as d } from "../../Modal-BuaPDlKV.js";
+export {
+  M as Modal,
+  d as default
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/MultiSelect/MultiSelect.d.cts

@@ -0,0 +1,72 @@
+import { type CSSProperties, type ReactNode } from 'react';
+import { type ThemeColor } from '../../theme';
+import type { SelectOption, SelectSize } from '../Select';
+export interface MultiSelectProps {
+    /** Label rendered above the field. */
+    label?: ReactNode;
+    /** The selectable options. */
+    options: SelectOption[];
+    /** Preset size — control height, font, chips and option density. */
+    size?: SelectSize;
+    /** Marks the field invalid: red border/ring + the `helperText` in the error color. */
+    error?: boolean;
+    /** Helper / validation text under the field. Adopts the error color while `error`. */
+    helperText?: ReactNode;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Stretches the field to fill its container width. Defaults to `true`. */
+    fullWidth?: boolean;
+    /** Disables the field. */
+    disabled?: boolean;
+    /** Controlled value — the chosen options' `value`s. */
+    value?: string[];
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string[];
+    /** Fires with the next array of selected values. */
+    onChange?: (value: string[]) => void;
+    /** Text shown in the trigger when nothing is selected. Defaults to `"Select…"`. */
+    placeholder?: string;
+    /** Theme palette token tinting the selected chips. Defaults to `primary`. */
+    color?: ThemeColor;
+    /** Shows a clear (×) button in the trigger when anything is selected. Defaults to `true`. */
+    clearable?: boolean;
+    /** Adds a search box inside the popover that filters options by label. */
+    searchable?: boolean;
+    /** Placeholder for the search box. Defaults to `"Search…"`. */
+    searchPlaceholder?: string;
+    /**
+     * Fires with the search query as the user types. **Providing this switches off the built-in
+     * local filtering** — you own `options` (e.g. fetch them from a server for the current query).
+     */
+    onSearchChange?: (query: string) => void;
+    /** Shows a loading indicator in the popover (e.g. while fetching server-side search results). */
+    loading?: boolean;
+    /** Text shown next to the loader while `loading`. Defaults to `"Loading…"`. */
+    loadingText?: ReactNode;
+    /**
+     * Shown in the popover when no option matches. Defaults to `"No options"`. Pass a function
+     * `(query) => node` to vary the message by the current search text — e.g. a "Type to search" hint
+     * while it's empty vs a "No results" message after typing.
+     */
+    noOptionsText?: ReactNode | ((query: string) => ReactNode);
+    /** Form field name — auto-binds to a surrounding `<Form>` (value is a `string[]`). */
+    name?: string;
+    /** Id for the trigger (label association). */
+    id?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+/**
+ * A labeled multi-select — the `string[]` sibling of `Select`. The trigger shows the chosen options
+ * as deletable `Chip`s (wrapping, growing like `TagsField`) or a placeholder; clicking it opens the
+ * same `Dropdown`-style popover (portaled, flips, scroll-locked, trigger-width, animated — shared via
+ * `useFloatingPanel`). Options render as `ListItem`s in a `role="listbox"` `aria-multiselectable`
+ * list; selecting **toggles** an option and keeps the popover open, the chosen ones showing a tick.
+ * Full keyboard support (Arrow/Home/End, Enter/Space to toggle, Escape to close, type-ahead) and
+ * ARIA. Optionally `searchable` + `clearable`; pass `onSearchChange` to drive the search
+ * **server-side** (you own `options` — local filtering is skipped) with a `loading` indicator.
+ * Controlled (`value` + `onChange`) or uncontrolled
+ * (`defaultValue`), and binds to a surrounding `<Form>` by `name` (value = `string[]`; validate with
+ * e.g. `z.array(z.string()).min(1, 'Pick at least one')`). Token-only styling.
+ */
+export declare const MultiSelect: import("react").ForwardRefExoticComponent<MultiSelectProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/MultiSelect/MultiSelect.d.ts

@@ -0,0 +1,72 @@
+import { type CSSProperties, type ReactNode } from 'react';
+import { type ThemeColor } from '../../theme';
+import type { SelectOption, SelectSize } from '../Select';
+export interface MultiSelectProps {
+    /** Label rendered above the field. */
+    label?: ReactNode;
+    /** The selectable options. */
+    options: SelectOption[];
+    /** Preset size — control height, font, chips and option density. */
+    size?: SelectSize;
+    /** Marks the field invalid: red border/ring + the `helperText` in the error color. */
+    error?: boolean;
+    /** Helper / validation text under the field. Adopts the error color while `error`. */
+    helperText?: ReactNode;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Stretches the field to fill its container width. Defaults to `true`. */
+    fullWidth?: boolean;
+    /** Disables the field. */
+    disabled?: boolean;
+    /** Controlled value — the chosen options' `value`s. */
+    value?: string[];
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string[];
+    /** Fires with the next array of selected values. */
+    onChange?: (value: string[]) => void;
+    /** Text shown in the trigger when nothing is selected. Defaults to `"Select…"`. */
+    placeholder?: string;
+    /** Theme palette token tinting the selected chips. Defaults to `primary`. */
+    color?: ThemeColor;
+    /** Shows a clear (×) button in the trigger when anything is selected. Defaults to `true`. */
+    clearable?: boolean;
+    /** Adds a search box inside the popover that filters options by label. */
+    searchable?: boolean;
+    /** Placeholder for the search box. Defaults to `"Search…"`. */
+    searchPlaceholder?: string;
+    /**
+     * Fires with the search query as the user types. **Providing this switches off the built-in
+     * local filtering** — you own `options` (e.g. fetch them from a server for the current query).
+     */
+    onSearchChange?: (query: string) => void;
+    /** Shows a loading indicator in the popover (e.g. while fetching server-side search results). */
+    loading?: boolean;
+    /** Text shown next to the loader while `loading`. Defaults to `"Loading…"`. */
+    loadingText?: ReactNode;
+    /**
+     * Shown in the popover when no option matches. Defaults to `"No options"`. Pass a function
+     * `(query) => node` to vary the message by the current search text — e.g. a "Type to search" hint
+     * while it's empty vs a "No results" message after typing.
+     */
+    noOptionsText?: ReactNode | ((query: string) => ReactNode);
+    /** Form field name — auto-binds to a surrounding `<Form>` (value is a `string[]`). */
+    name?: string;
+    /** Id for the trigger (label association). */
+    id?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+/**
+ * A labeled multi-select — the `string[]` sibling of `Select`. The trigger shows the chosen options
+ * as deletable `Chip`s (wrapping, growing like `TagsField`) or a placeholder; clicking it opens the
+ * same `Dropdown`-style popover (portaled, flips, scroll-locked, trigger-width, animated — shared via
+ * `useFloatingPanel`). Options render as `ListItem`s in a `role="listbox"` `aria-multiselectable`
+ * list; selecting **toggles** an option and keeps the popover open, the chosen ones showing a tick.
+ * Full keyboard support (Arrow/Home/End, Enter/Space to toggle, Escape to close, type-ahead) and
+ * ARIA. Optionally `searchable` + `clearable`; pass `onSearchChange` to drive the search
+ * **server-side** (you own `options` — local filtering is skipped) with a `loading` indicator.
+ * Controlled (`value` + `onChange`) or uncontrolled
+ * (`defaultValue`), and binds to a surrounding `<Form>` by `name` (value = `string[]`; validate with
+ * e.g. `z.array(z.string()).min(1, 'Pick at least one')`). Token-only styling.
+ */
+export declare const MultiSelect: import("react").ForwardRefExoticComponent<MultiSelectProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/MultiSelect/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../MultiSelect-CSJKSWpA.cjs");exports.MultiSelect=e.MultiSelect;exports.default=e.MultiSelect;
+//# sourceMappingURL=index.cjs.map

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

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

package/dist/components/MultiSelect/index.d.cts

@@ -0,0 +1,2 @@
+export { MultiSelect, MultiSelect as default } from './MultiSelect';
+export type { MultiSelectProps } from './MultiSelect';

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

@@ -0,0 +1,2 @@
+export { MultiSelect, MultiSelect as default } from './MultiSelect';
+export type { MultiSelectProps } from './MultiSelect';

package/dist/components/MultiSelect/index.js

@@ -0,0 +1,6 @@
+import { M as a, M as l } from "../../MultiSelect-BGRT_B60.js";
+export {
+  a as MultiSelect,
+  l as default
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/MultilineTextField/MultilineTextField.d.cts

@@ -0,0 +1,28 @@
+import { type ReactNode, type TextareaHTMLAttributes } from 'react';
+export type MultilineTextFieldSize = 'sm' | 'md' | 'lg';
+export interface MultilineTextFieldProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'size' | 'rows'> {
+    /** Label rendered above the field. */
+    label?: ReactNode;
+    /** Preset size — drives the font size (the height is dynamic). */
+    size?: MultilineTextFieldSize;
+    /** Marks the field invalid: red border/focus ring and the `helperText` shown in the error color. */
+    error?: boolean;
+    /** Helper / validation text under the field. Adopts the error color while `error`. */
+    helperText?: ReactNode;
+    /** Adds a red asterisk after the label (visual hint only — combine with native `required` if needed). */
+    required?: boolean;
+    /** Stretches the field to fill its container width. Defaults to `true`. */
+    fullWidth?: boolean;
+    /** Minimum visible rows — the field's starting (and smallest) height. Defaults to `3`. */
+    minRows?: number;
+    /** Maximum rows before the field stops growing and scrolls instead. Defaults to `6` (pass `Infinity` for unbounded growth). */
+    maxRows?: number;
+}
+/**
+ * A labeled multiline text input — the textarea sibling of `TextField`. It shares TextField's chrome
+ * (label, helper/validation text, error state, sizes, `<Form>` binding by `name`), but renders a
+ * `<textarea>` whose **height is dynamic**: it auto-grows with the content from `minRows` up to
+ * `maxRows` (then scrolls). Works controlled (`value` + `onChange`) or uncontrolled
+ * (`defaultValue`). Styling comes entirely from `--tz-*` tokens.
+ */
+export declare const MultilineTextField: import("react").ForwardRefExoticComponent<MultilineTextFieldProps & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/components/MultilineTextField/MultilineTextField.d.ts

@@ -0,0 +1,28 @@
+import { type ReactNode, type TextareaHTMLAttributes } from 'react';
+export type MultilineTextFieldSize = 'sm' | 'md' | 'lg';
+export interface MultilineTextFieldProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'size' | 'rows'> {
+    /** Label rendered above the field. */
+    label?: ReactNode;
+    /** Preset size — drives the font size (the height is dynamic). */
+    size?: MultilineTextFieldSize;
+    /** Marks the field invalid: red border/focus ring and the `helperText` shown in the error color. */
+    error?: boolean;
+    /** Helper / validation text under the field. Adopts the error color while `error`. */
+    helperText?: ReactNode;
+    /** Adds a red asterisk after the label (visual hint only — combine with native `required` if needed). */
+    required?: boolean;
+    /** Stretches the field to fill its container width. Defaults to `true`. */
+    fullWidth?: boolean;
+    /** Minimum visible rows — the field's starting (and smallest) height. Defaults to `3`. */
+    minRows?: number;
+    /** Maximum rows before the field stops growing and scrolls instead. Defaults to `6` (pass `Infinity` for unbounded growth). */
+    maxRows?: number;
+}
+/**
+ * A labeled multiline text input — the textarea sibling of `TextField`. It shares TextField's chrome
+ * (label, helper/validation text, error state, sizes, `<Form>` binding by `name`), but renders a
+ * `<textarea>` whose **height is dynamic**: it auto-grows with the content from `minRows` up to
+ * `maxRows` (then scrolls). Works controlled (`value` + `onChange`) or uncontrolled
+ * (`defaultValue`). Styling comes entirely from `--tz-*` tokens.
+ */
+export declare const MultilineTextField: import("react").ForwardRefExoticComponent<MultilineTextFieldProps & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/components/MultilineTextField/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../MultilineTextField-Dz6Fg8RJ.cjs");exports.MultilineTextField=e.MultilineTextField;exports.default=e.MultilineTextField;
+//# sourceMappingURL=index.cjs.map

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

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

package/dist/components/MultilineTextField/index.d.cts

@@ -0,0 +1,2 @@
+export { MultilineTextField, MultilineTextField as default } from './MultilineTextField';
+export type { MultilineTextFieldProps, MultilineTextFieldSize } from './MultilineTextField';

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

@@ -0,0 +1,2 @@
+export { MultilineTextField, MultilineTextField as default } from './MultilineTextField';
+export type { MultilineTextFieldProps, MultilineTextFieldSize } from './MultilineTextField';

package/dist/components/MultilineTextField/index.js

@@ -0,0 +1,6 @@
+import { M as t, M as a } from "../../MultilineTextField-CwNCJ9lZ.js";
+export {
+  t as MultilineTextField,
+  a as default
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/NumberField/NumberField.d.cts

@@ -0,0 +1,45 @@
+import { type InputHTMLAttributes, type ReactNode } from 'react';
+export type NumberFieldSize = 'sm' | 'md' | 'lg';
+export interface NumberFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'value' | 'defaultValue' | 'onChange' | 'type' | 'min' | 'max' | 'step' | 'prefix'> {
+    /** Label rendered above the field. */
+    label?: ReactNode;
+    /** Preset size — drives the control height, font size and padding. */
+    size?: NumberFieldSize;
+    /** Marks the field invalid: red border/focus ring + the `helperText` in the error color. */
+    error?: boolean;
+    /** Helper / validation text under the field. Adopts the error color while `error`. */
+    helperText?: ReactNode;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Stretches the field to fill its container width. Defaults to `true`. */
+    fullWidth?: boolean;
+    /** Controlled numeric value (`null` = empty). */
+    value?: number | null;
+    /** Initial value for uncontrolled use (`null` = empty). Defaults to `null`. */
+    defaultValue?: number | null;
+    /** Fires with the parsed numeric value (or `null` when the field is empty). */
+    onChange?: (value: number | null) => void;
+    /** Minimum value — clamps on blur and on the stepper, and disables `−` at the floor. Defaults to `0`; pass a negative `min` to allow negatives. */
+    min?: number;
+    /** Maximum value — clamps on blur and on the stepper, and disables `+` at the ceiling. */
+    max?: number;
+    /** Amount the `+`/`−` buttons add or subtract. Defaults to `1`. */
+    step?: number;
+    /** Hides the `+`/`−` stepper buttons (keyboard entry only). */
+    hideStepper?: boolean;
+    /**
+     * Thousands-group separator shown **live** as you type, e.g. `"."` displays `32345345` as
+     * `32.345.345` (or `","`). The caret is preserved across regrouping; the `value`/`onChange`/form
+     * value stay a plain `number`. Best for integers — with `"."` decimals aren't supported (the dot is
+     * the group separator).
+     */
+    thousandSeparator?: string;
+}
+/**
+ * A numeric input with `+`/`−` stepper buttons. Supports `min`/`max` clamping, a `step` amount,
+ * controlled (`value` + `onChange`) or uncontrolled (`defaultValue`) use, optional live thousands
+ * grouping, and — like `TextField` — binds to a surrounding `<Form>` by `name` (its form value is a
+ * real `number`, validated by the Zod schema). `onChange` emits a `number` or `null` (empty). Shares
+ * `TextField`'s field chrome, so label, sizing, error and focus styling are identical.
+ */
+export declare const NumberField: import("react").ForwardRefExoticComponent<NumberFieldProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/NumberField/NumberField.d.ts

@@ -0,0 +1,45 @@
+import { type InputHTMLAttributes, type ReactNode } from 'react';
+export type NumberFieldSize = 'sm' | 'md' | 'lg';
+export interface NumberFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'value' | 'defaultValue' | 'onChange' | 'type' | 'min' | 'max' | 'step' | 'prefix'> {
+    /** Label rendered above the field. */
+    label?: ReactNode;
+    /** Preset size — drives the control height, font size and padding. */
+    size?: NumberFieldSize;
+    /** Marks the field invalid: red border/focus ring + the `helperText` in the error color. */
+    error?: boolean;
+    /** Helper / validation text under the field. Adopts the error color while `error`. */
+    helperText?: ReactNode;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Stretches the field to fill its container width. Defaults to `true`. */
+    fullWidth?: boolean;
+    /** Controlled numeric value (`null` = empty). */
+    value?: number | null;
+    /** Initial value for uncontrolled use (`null` = empty). Defaults to `null`. */
+    defaultValue?: number | null;
+    /** Fires with the parsed numeric value (or `null` when the field is empty). */
+    onChange?: (value: number | null) => void;
+    /** Minimum value — clamps on blur and on the stepper, and disables `−` at the floor. Defaults to `0`; pass a negative `min` to allow negatives. */
+    min?: number;
+    /** Maximum value — clamps on blur and on the stepper, and disables `+` at the ceiling. */
+    max?: number;
+    /** Amount the `+`/`−` buttons add or subtract. Defaults to `1`. */
+    step?: number;
+    /** Hides the `+`/`−` stepper buttons (keyboard entry only). */
+    hideStepper?: boolean;
+    /**
+     * Thousands-group separator shown **live** as you type, e.g. `"."` displays `32345345` as
+     * `32.345.345` (or `","`). The caret is preserved across regrouping; the `value`/`onChange`/form
+     * value stay a plain `number`. Best for integers — with `"."` decimals aren't supported (the dot is
+     * the group separator).
+     */
+    thousandSeparator?: string;
+}
+/**
+ * A numeric input with `+`/`−` stepper buttons. Supports `min`/`max` clamping, a `step` amount,
+ * controlled (`value` + `onChange`) or uncontrolled (`defaultValue`) use, optional live thousands
+ * grouping, and — like `TextField` — binds to a surrounding `<Form>` by `name` (its form value is a
+ * real `number`, validated by the Zod schema). `onChange` emits a `number` or `null` (empty). Shares
+ * `TextField`'s field chrome, so label, sizing, error and focus styling are identical.
+ */
+export declare const NumberField: import("react").ForwardRefExoticComponent<NumberFieldProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/NumberField/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../NumberField-DBpO-Z_7.cjs");exports.NumberField=e.NumberField;exports.default=e.NumberField;
+//# sourceMappingURL=index.cjs.map

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

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

package/dist/components/NumberField/index.d.cts

@@ -0,0 +1,2 @@
+export { NumberField, NumberField as default } from './NumberField';
+export type { NumberFieldProps, NumberFieldSize } from './NumberField';

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

@@ -0,0 +1,2 @@
+export { NumberField, NumberField as default } from './NumberField';
+export type { NumberFieldProps, NumberFieldSize } from './NumberField';

package/dist/components/NumberField/index.js

@@ -0,0 +1,6 @@
+import { N as r, N } from "../../NumberField-DBvhSQCw.js";
+export {
+  r as NumberField,
+  N as default
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/OtpField/OtpField.d.cts

@@ -0,0 +1,55 @@
+import { type CSSProperties, type ReactNode } from 'react';
+import { type ThemeColor } from '../../theme';
+export type OtpFieldSize = 'sm' | 'md' | 'lg';
+/** Which characters the code accepts. */
+export type OtpFieldType = 'numeric' | 'alphabetic' | 'alphanumeric';
+export interface OtpFieldProps {
+    /** Number of input boxes (the code length). Defaults to `4`. */
+    length?: number;
+    /** Which characters are accepted (also drives the mobile keyboard). Defaults to `'numeric'`. */
+    type?: OtpFieldType;
+    /** Controlled value — the concatenated code string. */
+    value?: string;
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string;
+    /** Fires with the full code string on every change. */
+    onChange?: (value: string) => void;
+    /** Fires with the code once every box is filled. */
+    onComplete?: (value: string) => void;
+    /** Field name — the `<Form>` binding key (form value is the code `string`). */
+    name?: string;
+    /** Label rendered above the boxes. */
+    label?: ReactNode;
+    /** Helper / error text under the boxes (shown in the error color while `error`). */
+    helperText?: ReactNode;
+    /** Marks the field invalid — reddens the boxes + helper. */
+    error?: boolean;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Disables every box. */
+    disabled?: boolean;
+    /** Focus the first box on mount. */
+    autoFocus?: boolean;
+    /** Placeholder character shown in empty boxes (e.g. `'•'`). */
+    placeholder?: string;
+    /** Preset size. Defaults to `'md'`. */
+    size?: OtpFieldSize;
+    /** Theme palette token for the focus ring / active box. Defaults to `'primary'`. */
+    color?: ThemeColor;
+    className?: string;
+    style?: CSSProperties;
+}
+/**
+ * A one-time-passcode input — a row of single-character boxes for verification codes. **`length`**
+ * (default `4`) sets the box count; **`type`** (`'numeric'` default · `'alphabetic'` · `'alphanumeric'`)
+ * restricts the accepted characters and the mobile keyboard. Typing advances to the next box, Backspace
+ * clears + steps back, Arrows navigate, and **paste / SMS autofill** (`autocomplete="one-time-code"`)
+ * distributes the whole code across the boxes. The value is the concatenated string — controlled
+ * (`value` + `onChange`) or uncontrolled (`defaultValue`); **`onComplete`** fires when all boxes are
+ * filled. Shares the field-family chrome (`label` · `error` + `helperText` · `required` · `disabled` ·
+ * `size`) and binds to a surrounding `<Form>` by **`name`** (form value = the code string; validate with
+ * e.g. `z.string().length(4)` or a `type`-matching regex). Tinted by `color` via the shared
+ * `--tz-btn-rgb` pattern; `role="group"` with per-box `aria-label`s. Own CSS module (+ TextField's for
+ * the label/helper chrome).
+ */
+export declare const OtpField: import("react").ForwardRefExoticComponent<OtpFieldProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/OtpField/OtpField.d.ts

@@ -0,0 +1,55 @@
+import { type CSSProperties, type ReactNode } from 'react';
+import { type ThemeColor } from '../../theme';
+export type OtpFieldSize = 'sm' | 'md' | 'lg';
+/** Which characters the code accepts. */
+export type OtpFieldType = 'numeric' | 'alphabetic' | 'alphanumeric';
+export interface OtpFieldProps {
+    /** Number of input boxes (the code length). Defaults to `4`. */
+    length?: number;
+    /** Which characters are accepted (also drives the mobile keyboard). Defaults to `'numeric'`. */
+    type?: OtpFieldType;
+    /** Controlled value — the concatenated code string. */
+    value?: string;
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string;
+    /** Fires with the full code string on every change. */
+    onChange?: (value: string) => void;
+    /** Fires with the code once every box is filled. */
+    onComplete?: (value: string) => void;
+    /** Field name — the `<Form>` binding key (form value is the code `string`). */
+    name?: string;
+    /** Label rendered above the boxes. */
+    label?: ReactNode;
+    /** Helper / error text under the boxes (shown in the error color while `error`). */
+    helperText?: ReactNode;
+    /** Marks the field invalid — reddens the boxes + helper. */
+    error?: boolean;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Disables every box. */
+    disabled?: boolean;
+    /** Focus the first box on mount. */
+    autoFocus?: boolean;
+    /** Placeholder character shown in empty boxes (e.g. `'•'`). */
+    placeholder?: string;
+    /** Preset size. Defaults to `'md'`. */
+    size?: OtpFieldSize;
+    /** Theme palette token for the focus ring / active box. Defaults to `'primary'`. */
+    color?: ThemeColor;
+    className?: string;
+    style?: CSSProperties;
+}
+/**
+ * A one-time-passcode input — a row of single-character boxes for verification codes. **`length`**
+ * (default `4`) sets the box count; **`type`** (`'numeric'` default · `'alphabetic'` · `'alphanumeric'`)
+ * restricts the accepted characters and the mobile keyboard. Typing advances to the next box, Backspace
+ * clears + steps back, Arrows navigate, and **paste / SMS autofill** (`autocomplete="one-time-code"`)
+ * distributes the whole code across the boxes. The value is the concatenated string — controlled
+ * (`value` + `onChange`) or uncontrolled (`defaultValue`); **`onComplete`** fires when all boxes are
+ * filled. Shares the field-family chrome (`label` · `error` + `helperText` · `required` · `disabled` ·
+ * `size`) and binds to a surrounding `<Form>` by **`name`** (form value = the code string; validate with
+ * e.g. `z.string().length(4)` or a `type`-matching regex). Tinted by `color` via the shared
+ * `--tz-btn-rgb` pattern; `role="group"` with per-box `aria-label`s. Own CSS module (+ TextField's for
+ * the label/helper chrome).
+ */
+export declare const OtpField: import("react").ForwardRefExoticComponent<OtpFieldProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/OtpField/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../OtpField-BUBYyorC.cjs");exports.OtpField=e.OtpField;exports.default=e.OtpField;
+//# sourceMappingURL=index.cjs.map

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

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

package/dist/components/OtpField/index.d.cts

@@ -0,0 +1,2 @@
+export { OtpField, OtpField as default } from './OtpField';
+export type { OtpFieldProps, OtpFieldSize, OtpFieldType } from './OtpField';

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

@@ -0,0 +1,2 @@
+export { OtpField, OtpField as default } from './OtpField';
+export type { OtpFieldProps, OtpFieldSize, OtpFieldType } from './OtpField';

package/dist/components/OtpField/index.js

@@ -0,0 +1,6 @@
+import { O as t, O } from "../../OtpField-CTq-CUbF.js";
+export {
+  t as OtpField,
+  O as default
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/Overlay/Overlay.d.cts

@@ -0,0 +1,29 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+export interface OverlayProps extends HTMLAttributes<HTMLDivElement> {
+    /** Whether the overlay is mounted + shown — gates the portal and drives the fade-in. */
+    open: boolean;
+    /** Requested dismiss — fired on a backdrop click (`closeOnBackdrop`) or Escape (`closeOnEscape`). */
+    onClose?: () => void;
+    /** Close when the scrim itself (outside the content) is clicked. Defaults to `true`. */
+    closeOnBackdrop?: boolean;
+    /** Close when Escape is pressed while focus is within the overlay. Defaults to `true`. */
+    closeOnEscape?: boolean;
+    /** Lock page scroll while open. Defaults to `true`. */
+    lockScroll?: boolean;
+    /** Scrim darkness — the black backdrop's alpha (0–1). Defaults to `0.45`. */
+    dim?: number;
+    /** Overlay content — typically a centered dialog / box / media. */
+    children?: ReactNode;
+}
+/**
+ * The shared backdrop primitive behind every dimmed, page-blocking surface (`Modal`, the FileUploader
+ * lightbox). Portals a fixed full-viewport scrim to `<body>`, locks page scroll, fades in (opacity keyed
+ * off a rAF `visible` flag → `data-open`), and dismisses on **backdrop-click** (gated on the pointer-down
+ * AND click both landing on the scrim, so a text-selection drag ending on it doesn't close) / **Escape**
+ * (swallowed via `stopPropagation` so it can't reach a React-tree ancestor overlay). Centers its children
+ * by default; consumers layer their own padding / scroll / placement via `className` + `data-*` and read
+ * the shared `data-open` on the scrim for their own box's enter transform. A consumer `onKeyDown` still
+ * fires (after the Escape handling) so it can add e.g. a Tab focus-trap. Internal — no `index.ts`, so it's
+ * never exposed as a package subpath; import it via `../Overlay/Overlay`. The ref points at the scrim div.
+ */
+export declare const Overlay: import("react").ForwardRefExoticComponent<OverlayProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Overlay/Overlay.d.ts

@@ -0,0 +1,29 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+export interface OverlayProps extends HTMLAttributes<HTMLDivElement> {
+    /** Whether the overlay is mounted + shown — gates the portal and drives the fade-in. */
+    open: boolean;
+    /** Requested dismiss — fired on a backdrop click (`closeOnBackdrop`) or Escape (`closeOnEscape`). */
+    onClose?: () => void;
+    /** Close when the scrim itself (outside the content) is clicked. Defaults to `true`. */
+    closeOnBackdrop?: boolean;
+    /** Close when Escape is pressed while focus is within the overlay. Defaults to `true`. */
+    closeOnEscape?: boolean;
+    /** Lock page scroll while open. Defaults to `true`. */
+    lockScroll?: boolean;
+    /** Scrim darkness — the black backdrop's alpha (0–1). Defaults to `0.45`. */
+    dim?: number;
+    /** Overlay content — typically a centered dialog / box / media. */
+    children?: ReactNode;
+}
+/**
+ * The shared backdrop primitive behind every dimmed, page-blocking surface (`Modal`, the FileUploader
+ * lightbox). Portals a fixed full-viewport scrim to `<body>`, locks page scroll, fades in (opacity keyed
+ * off a rAF `visible` flag → `data-open`), and dismisses on **backdrop-click** (gated on the pointer-down
+ * AND click both landing on the scrim, so a text-selection drag ending on it doesn't close) / **Escape**
+ * (swallowed via `stopPropagation` so it can't reach a React-tree ancestor overlay). Centers its children
+ * by default; consumers layer their own padding / scroll / placement via `className` + `data-*` and read
+ * the shared `data-open` on the scrim for their own box's enter transform. A consumer `onKeyDown` still
+ * fires (after the Escape handling) so it can add e.g. a Tab focus-trap. Internal — no `index.ts`, so it's
+ * never exposed as a package subpath; import it via `../Overlay/Overlay`. The ref points at the scrim div.
+ */
+export declare const Overlay: import("react").ForwardRefExoticComponent<OverlayProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/PageLayout/PageLayout.d.cts

@@ -0,0 +1,13 @@
+import { type CardProps } from '../Card';
+/** PageLayout is a flat `Card`, so it gains all of Card's slots minus the `flat` toggle (always flat). */
+export interface PageLayoutProps extends Omit<CardProps, 'flat'> {
+}
+/**
+ * The content container a page's body sits in — a **flat `Card`** (no shadow, the page `background`
+ * color), so it blends with the shell while the Cards/inputs placed inside it read as elevated. Being
+ * a Card, it gains the full Card anatomy: an optional header (`icon` + `title` + `subtitle` +
+ * `actions`), the body (`children`), a `footer` / `footerStart`, and `collapsible`. Rendered by the
+ * consumer inside each route, below the shell's breadcrumbs + page title:
+ * `<PageLayout title="Settings" actions={…}>…</PageLayout>`. Styling uses `--tz-*` tokens only.
+ */
+export declare const PageLayout: import("react").ForwardRefExoticComponent<PageLayoutProps & import("react").RefAttributes<HTMLDivElement>>;