iryx-ui 0.6.0 → 0.8.0

package/README.md

@@ -288,9 +288,13 @@ app.use(createIryxUi({ unstyled: true }))
 | --- | --- |
 | `IForm` | Validating form wrapper — any Standard Schema validator, or your own function |
 | `IFormField` | Label, description, hint, help and error text around a control |
-| `IInput` | Text field with `sm`/`md`/`lg` sizes, `invalid` state, `v-model` |
+| `IInput` | Text field with `sm`/`md`/`lg` sizes, `invalid` state, `v-model`, `leading`/`trailing` slots, `clearable`, `loading`, `debounce` |
 | `INumberInput` | Decimal-safe numeric field — the model is a **string**, with `min`/`max`/`step`, `precision` and locale-aware display |
-| `ITextarea` | Multi-line field with matching sizes and `invalid` state |
+| `IFileUpload` | Drag-and-drop file field with `accept` / `maxSize` / `maxFiles`, thumbnails and a remove action |
+| `IDatePicker` | Calendar in a popover; the model is an ISO `YYYY-MM-DD` **string** |
+| `IDateRangePicker` | Two-month range calendar; the model is `{ start, end }` ISO strings |
+| `IPasswordInput` | Masked field with a show/hide toggle and an optional strength meter |
+| `ITextarea` | Multi-line field with matching sizes, `invalid` state and optional `autosize` |
 | `ILabel` | Field label with optional `required` asterisk |
 | `ICheckbox` | Tri-state checkbox (`true` / `false` / `'indeterminate'`), optional `label` + `description` |
 | `ISelect` | Listbox with keyboard nav and typeahead, driven by an `items` array, with optional groups |
@@ -434,6 +438,201 @@ const framework = ref('vue')
 </template>
 ```
 
+#### Input affixes, clearing, loading and debounce
+
+`IInput` renders its chrome on a wrapper element, so `leading` and `trailing`
+slot content sits *inside* the field and takes real space — a long value is
+truncated by the affix rather than sliding underneath it.
+
+```vue
+<IInput v-model="search" clearable placeholder="Search invoices…">
+  <template #leading>
+    <HugeiconsIcon :icon="Search01Icon" />
+  </template>
+</IInput>
+
+<IInput v-model="team" placeholder="your-team">
+  <template #trailing>
+    <span class="text-sm">.example.com</span>
+  </template>
+</IInput>
+
+<!-- Spinner in the trailing area; the field stays editable. -->
+<IInput v-model="slug" :loading="checking" />
+
+<!-- The model updates 500ms after the last keystroke. -->
+<IInput v-model="query" :debounce="500" clearable />
+```
+
+| Prop | Effect |
+| --- | --- |
+| `clearable` | Clear button in the trailing area whenever the field is non-empty |
+| `loading` | Spinner in the trailing area. Does **not** disable the field |
+| `debounce` | Milliseconds to wait after the last keystroke before the model updates. `0` (default) updates on every keystroke |
+| `clearLabel` | Accessible name for the clear button, for non-English apps |
+
+The displayed text always updates on the keystroke — only the model lags. Blur
+and Enter flush a pending update immediately, so a submit never reads a stale
+value, and an external write (a reset or prefill) cancels whatever is queued.
+
+`class` lands on the wrapper, since that is the element carrying the field
+chrome; use `ui` to reach the parts (`root`, `input`, `leading`, `trailing`,
+`clear`). Stray attributes like `name`, `autocomplete` and `maxlength` are
+forwarded to the `<input>` itself. `ref` exposes the element as `.input` for
+focus management.
+
+#### Files
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const logo = ref<File[]>([])
+</script>
+
+<template>
+  <IFileUpload
+    v-model="logo"
+    accept="image/*"
+    :max-size="2 * 1024 * 1024"
+    label="Drag your logo here"
+    browse-label="Browse images"
+    hint="PNG, JPG or SVG up to 2 MB"
+    @reject="onReject"
+  />
+</template>
+```
+
+The model is **always a `File[]`**, even without `multiple` — a `File | File[]`
+union would make every caller narrow the type before touching it, and the
+single case is just an array holding at most one. Without `multiple`, picking
+again replaces rather than appends.
+
+| Prop | Effect |
+| --- | --- |
+| `multiple` | Accept more than one file |
+| `accept` | Native syntax: `image/*`, `.pdf`, `image/png` |
+| `maxSize` | Largest accepted size, in bytes |
+| `maxFiles` | Cap on how many files may be held at once |
+| `label` | Prompt in the zone, above the hint |
+| `browseLabel` | Text on the browse button |
+| `hint` | Fine print under the prompt — the accepted types belong here |
+
+Every string is a prop, including `removeLabel` and the three rejection
+messages, so nothing bakes in English.
+
+`accept` is enforced in the component as well as on the input, because a
+dragged-in file bypasses the native filter entirely. Refused files raise
+`@reject` with `{ file, reason }` — `'type'`, `'size'` or `'count'` — so you
+can word your own message; the built-in text is available through the
+`tooLargeText`, `wrongTypeText` and `tooManyText` props.
+
+Image files get a thumbnail, anything else a placeholder of the same size so
+rows stay aligned. The object URLs behind those thumbnails are revoked as soon
+as a file leaves the list or the component unmounts.
+
+#### Dates
+
+The model is an ISO `YYYY-MM-DD` **string**, never a `Date`.
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const issuedOn = ref<string | null>('2026-08-15')
+const period = ref({ start: '2026-08-01', end: '2026-08-31' })
+</script>
+
+<template>
+  <IDatePicker v-model="issuedOn" clearable />
+  <IDateRangePicker v-model="period" clearable />
+</template>
+```
+
+A `Date` is a timestamp, so it always carries a time zone. `new Date('2026-08-15')`
+parses as UTC midnight, and a user west of Greenwich formatting it locally sees
+the 14th — which silently moves a record into the wrong reporting period. A
+calendar date has no zone, so it stays the day you picked. Internally the
+components use `@internationalized/date`; that never reaches your model, so
+formatting the string with `dayjs` or anything else on the way out is fine.
+
+| Prop | Effect |
+| --- | --- |
+| `min` / `max` | Selectable bounds, as ISO strings |
+| `locale` | Month names, weekday initials, and the trigger's text |
+| `format` | `Intl.DateTimeFormatOptions` for the trigger, e.g. `{ dateStyle: 'full' }` |
+| `weekStartsOn` | `0` is Sunday. Defaults to the locale's convention |
+| `clearable` | Adds a clear action to the footer |
+| `months` | Range picker only — months side by side, default `2` |
+| `separator` | Range picker only — text between the two dates |
+
+Navigation and footer labels (`todayLabel`, `clearLabel`, `previousLabel`,
+`nextLabel`) are all props, so nothing bakes in English.
+
+Both render their calendar at a fixed six weeks, so a short month cannot stretch
+its rows to match a taller neighbour and the popover does not resize as you page
+through it. The range picker draws only the committed range — the days between
+the endpoints take a flat tint while the two ends take the solid fill, so a long
+span still shows where it begins and ends.
+
+The helpers behind them are exported, for formatting the same values elsewhere:
+
+```ts
+import { formatIsoDate, isoToday, toCalendarDate, toIsoDate } from 'iryx-ui'
+
+formatIsoDate('2026-08-15', 'en-GB', { dateStyle: 'long' }) // '15 August 2026'
+formatIsoDate('nonsense') // '' — malformed input is "no selection", not a crash
+```
+
+#### Passwords
+
+`IPasswordInput` is `IInput` with a reveal toggle in the trailing area, plus an
+optional four-segment strength meter.
+
+```vue
+<IPasswordInput v-model="password" strength />
+
+<!-- Toggle only, no meter -->
+<IPasswordInput v-model="password" />
+
+<!-- No toggle either -->
+<IPasswordInput v-model="password" :toggle="false" />
+```
+
+The score counts length (8 and 12 characters), mixed case, a digit and a
+symbol, capped at four. It is a deliberately transparent nudge toward better
+passwords, **not** a security control — enforce real policy in the `IForm`
+validator, where it can actually reject a value.
+
+Every string is overridable, since components must not bake in English:
+
+```vue
+<IPasswordInput
+  v-model="password"
+  strength
+  show-label="Afficher le mot de passe"
+  hide-label="Masquer le mot de passe"
+  :strength-labels="['Faible', 'Moyen', 'Bon', 'Fort']"
+/>
+```
+
+`class` lands on the wrapper that stacks the field above the meter; `ui` reaches
+`root`, `input`, `toggle`, `meter`, `track`, `segment` and `label`.
+
+#### Autosizing textareas
+
+```vue
+<!-- Grows without limit -->
+<ITextarea v-model="note" autosize />
+
+<!-- Between 2 and 8 rows, then scrolls -->
+<ITextarea v-model="note" :autosize="{ min: 2, max: 8 }" />
+```
+
+`autosize` overrides `rows` and drops the drag handle, since the measured
+height is the point. The field shrinks as well as grows, and re-measures when
+the model changes from outside — a reset or a prefill resizes correctly.
+
 `ISelect` and `IRadioGroup` accept plain strings or `{ label, value, disabled }` objects. Both also take a default slot if you'd rather compose the Reka primitives yourself.
 
 `ISelect` also takes groups — an entry with its own `items` becomes a labelled

package/dist/component-names.d.ts

@@ -3,5 +3,5 @@
  * Consumed by the Vue plugin (global registration) and the Nuxt module
  * (auto-imports). Keep in sync with `src/components/index.ts`.
  */
-export declare const componentNames: readonly ["Alert", "App", "Badge", "Banner", "Breadcrumb", "Button", "ButtonGroup", "Card", "Checkbox", "Combobox", "ConfirmDialog", "Dialog", "DropdownMenu", "EmptyState", "Form", "FormField", "Input", "Label", "NumberInput", "Pagination", "Progress", "RadioGroup", "Select", "Separator", "Skeleton", "Stat", "Stepper", "Switch", "Table", "Tabs", "Textarea", "Toaster", "Tooltip"];
+export declare const componentNames: readonly ["Alert", "App", "Badge", "Banner", "Breadcrumb", "Button", "ButtonGroup", "Card", "Checkbox", "Combobox", "ConfirmDialog", "DatePicker", "DateRangePicker", "Dialog", "DropdownMenu", "EmptyState", "FileUpload", "Form", "FormField", "Input", "Label", "NumberInput", "Pagination", "PasswordInput", "Progress", "RadioGroup", "Select", "Separator", "Skeleton", "Stat", "Stepper", "Switch", "Table", "Tabs", "Textarea", "Toaster", "Tooltip"];
 export type ComponentName = (typeof componentNames)[number];

package/dist/components/DatePicker.vue.d.ts

@@ -0,0 +1,52 @@
+export interface DatePickerProps {
+    size?: 'sm' | 'md' | 'lg';
+    placeholder?: string;
+    disabled?: boolean;
+    /** Mark the field as invalid — styles the border and ring red. */
+    invalid?: boolean;
+    id?: string;
+    /** Earliest selectable date, as an ISO `YYYY-MM-DD` string. */
+    min?: string;
+    /** Latest selectable date, as an ISO `YYYY-MM-DD` string. */
+    max?: string;
+    /** Locale for the month names, weekday initials and the trigger's text. */
+    locale?: string;
+    /** How the selected date reads on the trigger. */
+    format?: Intl.DateTimeFormatOptions;
+    /** 0 is Sunday. Defaults to the locale's own convention. */
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    /** Offer a "clear" action in the footer. */
+    clearable?: boolean;
+    /** Footer and navigation labels — override for non-English apps. */
+    todayLabel?: string;
+    clearLabel?: string;
+    previousLabel?: string;
+    nextLabel?: string;
+    /** Skip built-in classes; you take over styling entirely. */
+    unstyled?: boolean;
+    /** Applied to the trigger, which is the element carrying the field chrome. */
+    class?: string;
+    /** Override classes per slot, e.g. `{ content: 'p-4' }`. */
+    ui?: Partial<Record<'trigger' | 'placeholder' | 'content' | 'header' | 'heading' | 'nav' | 'months' | 'grid' | 'headCell' | 'cell' | 'cellTrigger' | 'footer' | 'action', string>>;
+}
+type __VLS_Props = DatePickerProps;
+type __VLS_ModelProps = {
+    /** ISO `YYYY-MM-DD`, never a `Date`. See `composables/date.ts` for why. */
+    modelValue?: string | null;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | null) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
+}>, {
+    unstyled: boolean;
+    placeholder: string;
+    invalid: boolean;
+    todayLabel: string;
+    clearLabel: string;
+    previousLabel: string;
+    nextLabel: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/DateRangePicker.vue.d.ts

@@ -0,0 +1,60 @@
+/** Both ends are ISO `YYYY-MM-DD` strings, and either may be absent. */
+export interface DateRange {
+    start: string | null;
+    end: string | null;
+}
+export interface DateRangePickerProps {
+    size?: 'sm' | 'md' | 'lg';
+    placeholder?: string;
+    disabled?: boolean;
+    /** Mark the field as invalid — styles the border and ring red. */
+    invalid?: boolean;
+    id?: string;
+    /** Earliest selectable date, as an ISO `YYYY-MM-DD` string. */
+    min?: string;
+    /** Latest selectable date, as an ISO `YYYY-MM-DD` string. */
+    max?: string;
+    /** Locale for the month names, weekday initials and the trigger's text. */
+    locale?: string;
+    /** How each end of the range reads on the trigger. */
+    format?: Intl.DateTimeFormatOptions;
+    /** 0 is Sunday. Defaults to the locale's own convention. */
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    /** Months shown side by side. Two makes picking a span across a boundary sane. */
+    months?: number;
+    /** Offer a "clear" action in the footer. */
+    clearable?: boolean;
+    /** Separator between the two dates on the trigger. */
+    separator?: string;
+    /** Footer and navigation labels — override for non-English apps. */
+    clearLabel?: string;
+    previousLabel?: string;
+    nextLabel?: string;
+    /** Skip built-in classes; you take over styling entirely. */
+    unstyled?: boolean;
+    /** Applied to the trigger, which is the element carrying the field chrome. */
+    class?: string;
+    /** Override classes per slot, e.g. `{ content: 'p-4' }`. */
+    ui?: Partial<Record<'trigger' | 'placeholder' | 'content' | 'header' | 'heading' | 'nav' | 'months' | 'grid' | 'headCell' | 'cell' | 'cellTrigger' | 'footer' | 'action', string>>;
+}
+type __VLS_Props = DateRangePickerProps;
+type __VLS_ModelProps = {
+    modelValue?: DateRange;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: DateRange) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: DateRange) => any) | undefined;
+}>, {
+    unstyled: boolean;
+    separator: string;
+    placeholder: string;
+    invalid: boolean;
+    months: number;
+    clearLabel: string;
+    previousLabel: string;
+    nextLabel: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/FileUpload.vue.d.ts

@@ -0,0 +1,64 @@
+/** Why a file was turned away, so the caller can word its own message. */
+export interface FileRejection {
+    file: File;
+    reason: 'type' | 'size' | 'count';
+}
+export interface FileUploadProps {
+    /** Accept more than one file. The model is an array either way. */
+    multiple?: boolean;
+    /** Same syntax as the native attribute: `image/*`, `.pdf`, `image/png`. */
+    accept?: string;
+    /** Largest accepted size, in bytes. */
+    maxSize?: number;
+    /** Cap on how many files may be held at once. */
+    maxFiles?: number;
+    disabled?: boolean;
+    /** Mark the field as invalid — styles the border and ring red. */
+    invalid?: boolean;
+    id?: string;
+    /** Prompt inside the drop zone. */
+    label?: string;
+    /** Secondary line under the prompt — good place for the accepted types. */
+    hint?: string;
+    /** Text on the browse button. */
+    browseLabel?: string;
+    /** Labels and messages — override for non-English apps. */
+    removeLabel?: string;
+    tooLargeText?: string;
+    wrongTypeText?: string;
+    tooManyText?: string;
+    /** Skip built-in classes; you take over styling entirely. */
+    unstyled?: boolean;
+    /** Applied to the outer wrapper, which stacks the zone above the list. */
+    class?: string;
+    /** Override classes per slot, e.g. `{ dropzone: 'py-10' }`. */
+    ui?: Partial<Record<'root' | 'dropzone' | 'input' | 'icon' | 'label' | 'browse' | 'hint' | 'list' | 'item' | 'thumbnail' | 'placeholder' | 'details' | 'name' | 'meta' | 'remove' | 'error', string>>;
+}
+type __VLS_Props = FileUploadProps;
+type __VLS_ModelProps = {
+    /**
+     * Always an array, even when `multiple` is false — a `File | File[]` union
+     * would make every caller narrow the type before touching it, and the single
+     * case is just an array that holds at most one.
+     */
+    modelValue?: File[];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: File[]) => any;
+    reject: (rejections: FileRejection[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: File[]) => any) | undefined;
+    onReject?: ((rejections: FileRejection[]) => any) | undefined;
+}>, {
+    unstyled: boolean;
+    label: string;
+    invalid: boolean;
+    browseLabel: string;
+    removeLabel: string;
+    tooLargeText: string;
+    wrongTypeText: string;
+    tooManyText: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/Input.vue.d.ts

@@ -7,16 +7,46 @@ export interface InputProps {
     /** Mark the field as invalid — styles the border and ring red. */
     invalid?: boolean;
     id?: string;
+    /** Show a clear button in the trailing area while the field has a value. */
+    clearable?: boolean;
+    /** Show a spinner in the trailing area. Does not disable the field. */
+    loading?: boolean;
+    /**
+     * Milliseconds to wait after the last keystroke before the model updates.
+     * `0` (the default) updates on every keystroke. Blur and Enter flush a
+     * pending update immediately, so a submit never reads a stale value.
+     */
+    debounce?: number;
+    /** Accessible name for the clear button — override for non-English apps. */
+    clearLabel?: string;
     /** Skip built-in classes; you take over styling entirely. */
     unstyled?: boolean;
+    /** Applied to the outer field, which is the element carrying the chrome. */
     class?: string;
+    /** Override classes per slot, e.g. `{ input: 'text-right' }`. */
+    ui?: {
+        root?: string;
+        input?: string;
+        leading?: string;
+        trailing?: string;
+        clear?: string;
+    };
 }
 type __VLS_Props = InputProps;
 type __VLS_ModelProps = {
     modelValue?: string | number | null;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare var __VLS_1: {}, __VLS_3: {};
+type __VLS_Slots = {} & {
+    leading?: (props: typeof __VLS_1) => any;
+} & {
+    trailing?: (props: typeof __VLS_3) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
+    /** The underlying element, for focus management by the caller. */
+    input: import("vue").Ref<HTMLInputElement | undefined, HTMLInputElement | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: string | number | null | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string | number | null | undefined) => any) | undefined;
@@ -24,6 +54,14 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     unstyled: boolean;
     type: string;
     invalid: boolean;
+    clearLabel: string;
+    debounce: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Pagination.vue.d.ts

@@ -42,12 +42,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
 }>, {
     unstyled: boolean;
     label: string;
+    nextLabel: string;
     total: number;
     itemsPerPage: number;
     siblingCount: number;
     showEdges: boolean;
     prevLabel: string;
-    nextLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/PasswordInput.vue.d.ts

@@ -0,0 +1,54 @@
+export interface PasswordInputProps {
+    size?: 'sm' | 'md' | 'lg';
+    placeholder?: string;
+    disabled?: boolean;
+    required?: boolean;
+    /** Mark the field as invalid — styles the border and ring red. */
+    invalid?: boolean;
+    id?: string;
+    /** Show the reveal toggle in the trailing area. */
+    toggle?: boolean;
+    /** Render a four-segment strength meter under the field. */
+    strength?: boolean;
+    /** Accessible names for the reveal toggle — override for non-English apps. */
+    showLabel?: string;
+    hideLabel?: string;
+    /**
+     * Words for scores 1–4, weakest first. Score 0 shows nothing, so this takes
+     * exactly four entries. Override for non-English apps.
+     */
+    strengthLabels?: [string, string, string, string];
+    /** Skip built-in classes; you take over styling entirely. */
+    unstyled?: boolean;
+    /** Applied to the outer wrapper, which stacks the field above the meter. */
+    class?: string;
+    /** Override classes per slot, e.g. `{ meter: 'mt-1' }`. */
+    ui?: {
+        root?: string;
+        input?: string;
+        toggle?: string;
+        meter?: string;
+        track?: string;
+        segment?: string;
+        label?: string;
+    };
+}
+type __VLS_Props = PasswordInputProps;
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    unstyled: boolean;
+    invalid: boolean;
+    toggle: boolean;
+    showLabel: string;
+    hideLabel: string;
+    strengthLabels: [string, string, string, string];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/Textarea.vue.d.ts

@@ -1,6 +1,18 @@
 export interface TextareaProps {
     size?: 'sm' | 'md' | 'lg';
+    /**
+     * Fixed height in rows. Ignored when `autosize` is set — pass the bounds
+     * through `autosize` instead.
+     */
     rows?: number;
+    /**
+     * Grow with the content. `true` grows without limit; `{ min, max }` bounds
+     * it in rows, and the field scrolls once it hits `max`.
+     */
+    autosize?: boolean | {
+        min?: number;
+        max?: number;
+    };
     placeholder?: string;
     disabled?: boolean;
     required?: boolean;
@@ -16,7 +28,10 @@ type __VLS_ModelProps = {
     modelValue?: string | null;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    /** The underlying element, for focus management by the caller. */
+    textarea: import("vue").Ref<HTMLTextAreaElement | undefined, HTMLTextAreaElement | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: string | null | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string | null | undefined) => any) | undefined;

package/dist/components/index.d.ts

@@ -9,15 +9,19 @@ export { default as Card } from './Card.vue';
 export { default as Checkbox } from './Checkbox.vue';
 export { default as Combobox } from './Combobox.vue';
 export { default as ConfirmDialog } from './ConfirmDialog.vue';
+export { default as DatePicker } from './DatePicker.vue';
+export { default as DateRangePicker } from './DateRangePicker.vue';
 export { default as Dialog } from './Dialog.vue';
 export { default as DropdownMenu } from './DropdownMenu.vue';
 export { default as EmptyState } from './EmptyState.vue';
+export { default as FileUpload } from './FileUpload.vue';
 export { default as Form } from './Form.vue';
 export { default as FormField } from './FormField.vue';
 export { default as Input } from './Input.vue';
 export { default as Label } from './Label.vue';
 export { default as NumberInput } from './NumberInput.vue';
 export { default as Pagination } from './Pagination.vue';
+export { default as PasswordInput } from './PasswordInput.vue';
 export { default as Progress } from './Progress.vue';
 export { default as RadioGroup } from './RadioGroup.vue';
 export { default as Select } from './Select.vue';

package/dist/composables/date.d.ts

@@ -0,0 +1,21 @@
+import type { DateValue } from '@internationalized/date';
+import { CalendarDate } from '@internationalized/date';
+/**
+ * Parse an ISO date, or `undefined` if it is absent or malformed.
+ *
+ * Malformed input resolves to "no selection" rather than throwing: the value
+ * often comes from a URL or a stale draft, and a blank calendar is a better
+ * outcome for the user than a crashed render.
+ */
+export declare function toCalendarDate(iso: string | null | undefined): CalendarDate | undefined;
+/** Back to the canonical `YYYY-MM-DD`. */
+export declare function toIsoDate(date: DateValue | null | undefined): string | null;
+/** Today in the viewer's own zone, as an ISO date string. */
+export declare function isoToday(): string;
+/**
+ * Render an ISO date for display. Returns `''` for absent or malformed input
+ * so a caller can fall back to a placeholder.
+ */
+export declare function formatIsoDate(iso: string | null | undefined, locale?: string, options?: Intl.DateTimeFormatOptions): string;
+export { CalendarDate };
+export type { DateValue };

package/dist/index.d.ts

@@ -12,15 +12,19 @@ export type { CardProps } from './components/Card.vue';
 export type { CheckboxProps } from './components/Checkbox.vue';
 export type { ComboboxItemGroup, ComboboxItemOption, ComboboxItems, ComboboxProps } from './components/Combobox.vue';
 export type { ConfirmDialogProps } from './components/ConfirmDialog.vue';
+export type { DatePickerProps } from './components/DatePicker.vue';
+export type { DateRange, DateRangePickerProps } from './components/DateRangePicker.vue';
 export type { DialogProps } from './components/Dialog.vue';
 export type { DropdownMenuProps } from './components/DropdownMenu.vue';
 export type { EmptyStateProps } from './components/EmptyState.vue';
+export type { FileRejection, FileUploadProps } from './components/FileUpload.vue';
 export type { FormProps } from './components/Form.vue';
 export type { FormFieldProps } from './components/FormField.vue';
 export type { InputProps } from './components/Input.vue';
 export type { LabelProps } from './components/Label.vue';
 export type { NumberInputProps } from './components/NumberInput.vue';
 export type { PaginationProps } from './components/Pagination.vue';
+export type { PasswordInputProps } from './components/PasswordInput.vue';
 export type { ProgressProps } from './components/Progress.vue';
 export type { RadioGroupItemOption, RadioGroupProps } from './components/RadioGroup.vue';
 export type { SelectItemGroup, SelectItemOption, SelectItems, SelectProps } from './components/Select.vue';
@@ -38,6 +42,7 @@ export * from './composables/appearance';
 export * from './composables/button-group';
 export * from './composables/confirm';
 export * from './composables/data-table';
+export * from './composables/date';
 export * from './composables/decimal';
 export * from './composables/dropdown-menu';
 export * from './composables/form';