@thomasfosterau/components 0.0.0 → 0.2.0

package/dist/fields/TextInput.svelte

@@ -0,0 +1,26 @@
+<!-- @component
+A daisyUI `input` over a native `<input>`, with a bindable `value` and `FieldControl` wiring.
+-->
+<!--
+  TextInput — daisyUI `input` over a native `<input>`, with a bindable `value`
+  and the `FieldControl` wiring (`describedBy` → `aria-describedby`, `invalid`
+  → `aria-invalid` + `input-error`).
+
+  ARIA contract: a native input, so the role, the keyboard and the validation
+  semantics are the platform's. The component adds only the two attributes
+  that tie it back to its `FormField`; everything else — `name`, `autocomplete`,
+  `maxlength`, `pattern`, `data-*` — passes straight through, because a
+  control that swallows those cannot be submitted, tested or hooked into.
+-->
+<script lang="ts">import { inputSize } from "./field-types.js";
+let { value = $bindable(""), type = "text", size = "md", invalid = false, describedBy = "", labelId: _labelId, class: className, ...rest } = $props();
+</script>
+
+<input
+  {...rest}
+  {type}
+  bind:value
+  aria-invalid={invalid ? 'true' : undefined}
+  aria-describedby={describedBy === '' ? undefined : describedBy}
+  class={['input w-full', inputSize[size], invalid && 'input-error', className]}
+/>

package/dist/fields/TextInput.svelte.d.ts

@@ -0,0 +1,36 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+import { type FieldSize } from './field-types.ts';
+interface Props extends Omit<HTMLInputAttributes, 'type' | 'value' | 'size'> {
+    /**
+     * The text. Bindable.
+     * @defaultValue `''`
+     */
+    value?: string | undefined;
+    /**
+     * The text-ish `type`s. Dates have `DateInput`, files have `FileInput`.
+     * @defaultValue `'text'`
+     */
+    type?: 'text' | 'email' | 'url' | 'password' | 'tel' | 'number' | 'search' | undefined;
+    /**
+     * daisyUI size step.
+     * @defaultValue `'md'`
+     */
+    size?: FieldSize | undefined;
+    /** `FieldControl`: the field is in error — sets `aria-invalid` and the error style. */
+    invalid?: boolean | undefined;
+    /**
+     * Ids for `aria-describedby`; empty means none.
+     * @defaultValue `''`
+     */
+    describedBy?: string | undefined;
+    /**
+     * `FieldControl`: the visible label's id. Not used — this control is
+     * labelable, so the `FormField`'s `<label for>` already names it; taken
+     * here so a spread `FieldControl` does not leak it as an attribute.
+     */
+    labelId?: string | undefined;
+}
+/** A daisyUI `input` over a native `<input>`, with a bindable `value` and `FieldControl` wiring. */
+declare const TextInput: import("svelte").Component<Props, {}, "value">;
+type TextInput = ReturnType<typeof TextInput>;
+export default TextInput;

package/dist/fields/Textarea.svelte

@@ -0,0 +1,22 @@
+<!-- @component
+A daisyUI `textarea` with a bindable `value` and `FieldControl` wiring. `rows` defaults to `4`.
+-->
+<!--
+  Textarea — daisyUI `textarea` with a bindable `value` and the same
+  `FieldControl` wiring as `TextInput`.
+
+  ARIA contract: a native `<textarea>`; the component adds `aria-describedby`
+  and `aria-invalid` and nothing else.
+-->
+<script lang="ts">import { textareaSize } from "./field-types.js";
+let { value = $bindable(""), size = "md", invalid = false, describedBy = "", labelId: _labelId, rows = 4, class: className, ...rest } = $props();
+</script>
+
+<textarea
+  {...rest}
+  {rows}
+  bind:value
+  aria-invalid={invalid ? 'true' : undefined}
+  aria-describedby={describedBy === '' ? undefined : describedBy}
+  class={['textarea w-full', textareaSize[size], invalid && 'textarea-error', className]}
+></textarea>

package/dist/fields/Textarea.svelte.d.ts

@@ -0,0 +1,31 @@
+import type { HTMLTextareaAttributes } from 'svelte/elements';
+import { type FieldSize } from './field-types.ts';
+interface Props extends Omit<HTMLTextareaAttributes, 'value'> {
+    /**
+     * The text. Bindable.
+     * @defaultValue `''`
+     */
+    value?: string | undefined;
+    /**
+     * daisyUI size step.
+     * @defaultValue `'md'`
+     */
+    size?: FieldSize | undefined;
+    /** `FieldControl`: the field is in error — sets `aria-invalid` and the error style. */
+    invalid?: boolean | undefined;
+    /**
+     * `FieldControl`: space-separated ids for `aria-describedby`.
+     * @defaultValue `''`
+     */
+    describedBy?: string | undefined;
+    /**
+     * `FieldControl`: the visible label's id. Not used — this control is
+     * labelable, so the `FormField`'s `<label for>` already names it; taken
+     * here so a spread `FieldControl` does not leak it as an attribute.
+     */
+    labelId?: string | undefined;
+}
+/** A daisyUI `textarea` with a bindable `value` and `FieldControl` wiring. `rows` defaults to `4`. */
+declare const Textarea: import("svelte").Component<Props, {}, "value">;
+type Textarea = ReturnType<typeof Textarea>;
+export default Textarea;

package/dist/fields/TimeField.svelte

@@ -0,0 +1,30 @@
+<!-- @component
+Segmented hour / minute entry on bits-ui `TimeField`, with the locale's or a forced 12/24-hour clock.
+-->
+<!--
+  TimeField — a time of day typed into segments (hour, minute, optionally
+  second, and AM/PM on a 12-hour clock), each a `role="spinbutton"`. The
+  clock follows the locale unless `hourCycle` forces 12 or 24, so the
+  control no longer depends on what the browser's native time input does.
+
+  ARIA contract: see `SegmentGroup`. With `name`, bits-ui posts the ISO
+  time (`14:30:00`) through a hidden input.
+-->
+<script lang="ts">import { TimeField } from "bits-ui";
+import { getComponentsContext } from "../context.svelte.js";
+import { definedProps } from "./calendar-props.js";
+import SegmentGroup from "./SegmentGroup.svelte";
+import { segmentedField } from "./segmented-field.js";
+let { value = $bindable(), minValue, maxValue, granularity = "minute", ...shared } = $props();
+const context = getComponentsContext();
+const field = $derived(segmentedField(shared, context.locale()));
+</script>
+
+<TimeField.Root
+  bind:value={() => value as Time, (next) => (value = next)}
+  {...field.root}
+  {...definedProps({ minValue, maxValue })}
+  {granularity}
+>
+  <SegmentGroup parts={TimeField} group={field.group} />
+</TimeField.Root>

package/dist/fields/TimeField.svelte.d.ts

@@ -0,0 +1,19 @@
+import { TimeField } from 'bits-ui';
+import { type SegmentedFieldProps, type TimeValue } from './segmented-field.ts';
+interface Props extends SegmentedFieldProps {
+    /** The time; `undefined` while empty or incomplete. Bindable. */
+    value?: TimeValue | undefined;
+    /** Earliest valid time. */
+    minValue?: TimeValue | undefined;
+    /** Latest valid time. */
+    maxValue?: TimeValue | undefined;
+    /**
+     * The smallest segment shown.
+     * @defaultValue `'minute'`
+     */
+    granularity?: 'hour' | 'minute' | 'second' | undefined;
+}
+/** Segmented hour / minute entry on bits-ui `TimeField`, with the locale's or a forced 12/24-hour clock. */
+declare const TimeField: import("svelte").Component<Props, {}, "value">;
+type TimeField = ReturnType<typeof TimeField>;
+export default TimeField;

package/dist/fields/Toggle.svelte

@@ -0,0 +1,72 @@
+<!-- @component
+A switch for an on/off setting that takes effect immediately, rather than a checkbox submitted with a form.
+-->
+<!--
+  Toggle — a switch: an on/off setting that takes effect immediately, rather
+  than a checkbox whose value is submitted with a form.
+
+  ARIA contract: a native `<input type="checkbox">` carrying `role="switch"`,
+  so the platform supplies the keyboard (Space) and the checked state while
+  the role tells assistive technology to announce "on"/"off" rather than
+  "ticked". The visible `label` is inside the `<label>` and so IS the
+  accessible name; `description` is deliberately outside it and reached
+  through `aria-describedby`, because a paragraph of explanation inside the
+  label would be read as part of the name every time focus lands.
+
+  Why the control is NOT `bind:checked`: the browser flips a checkbox the
+  instant it is clicked, but `onChange` may refuse the change — the
+  registration failed, the reader denied a permission, the server said no.
+  So the switch reports an INTENTION, and whatever `onChange` resolves to is
+  written back onto the control. Without that write-back a refused change
+  leaves the switch showing a state that is not true until the next reload.
+  A thrown `onChange` is treated as a refusal for the same reason, and left
+  for the caller to report — a switch is not the place to render an error.
+-->
+<script lang="ts">import { toggleSize } from "./field-types.js";
+let { checked = $bindable(false), label, description, onChange, size = "md", invalid = false, describedBy = "", labelId: _labelId, disabled = false, class: className, ...rest } = $props();
+const uid = $props.id();
+const descriptionId = `${uid}-description`;
+let pending = $state(false);
+const described = $derived([description === undefined ? "" : descriptionId, describedBy].filter((part) => part !== "").join(" "));
+const settle = async (control) => {
+	const next = control.checked;
+	if (onChange === undefined) {
+		checked = next;
+		return;
+	}
+	if (pending) {
+		control.checked = checked;
+		return;
+	}
+	pending = true;
+	try {
+		checked = await onChange(next);
+	} catch {} finally {
+		pending = false;
+		control.checked = checked;
+	}
+};
+</script>
+
+<div class={['flex flex-col gap-1', className]}>
+  <label class="label cursor-pointer justify-start gap-3">
+    <input
+      {...rest}
+      type="checkbox"
+      role="switch"
+      {checked}
+      disabled={disabled || pending}
+      aria-busy={pending ? 'true' : undefined}
+      aria-invalid={invalid ? 'true' : undefined}
+      aria-describedby={described === '' ? undefined : described}
+      onchange={(event) => {
+        void settle(event.currentTarget);
+      }}
+      class={['toggle', toggleSize[size], invalid && 'toggle-error']}
+    />
+    <span>{label}</span>
+  </label>
+  {#if description !== undefined}
+    <p id={descriptionId} class="fieldset-label">{description}</p>
+  {/if}
+</div>

package/dist/fields/Toggle.svelte.d.ts

@@ -0,0 +1,38 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+import { type FieldSize } from './field-types.ts';
+interface Props extends Omit<HTMLInputAttributes, 'type' | 'checked' | 'size' | 'onchange'> {
+    /** Whether the switch is on. Bindable. */
+    checked?: boolean | undefined;
+    /** Text beside the switch; becomes its accessible name. */
+    label: string;
+    /** Explanation under the switch, reached through `aria-describedby`. */
+    description?: string | undefined;
+    /**
+     * Apply the change. Whatever it resolves to is what the switch ends up
+     * showing, so returning `false` from a request for `true` rejects it.
+     * Omitted, the switch is uncontrolled and simply follows the click.
+     */
+    onChange?: ((next: boolean) => Promise<boolean> | boolean) | undefined;
+    /**
+     * daisyUI size step.
+     * @defaultValue `'md'`
+     */
+    size?: FieldSize | undefined;
+    /** `FieldControl`: the field is in error — sets `aria-invalid` and the error style. */
+    invalid?: boolean | undefined;
+    /**
+     * `FieldControl`: space-separated ids for `aria-describedby`.
+     * @defaultValue `''`
+     */
+    describedBy?: string | undefined;
+    /**
+     * `FieldControl`: the visible label's id. Not used — this control is
+     * labelable, so the `FormField`'s `<label for>` already names it; taken
+     * here so a spread `FieldControl` does not leak it as an attribute.
+     */
+    labelId?: string | undefined;
+}
+/** A switch for an on/off setting that takes effect immediately, rather than a checkbox submitted with a form. */
+declare const Toggle: import("svelte").Component<Props, {}, "checked">;
+type Toggle = ReturnType<typeof Toggle>;
+export default Toggle;

package/dist/fields/VideoInput.svelte

@@ -0,0 +1,35 @@
+<!-- @component
+A `FileInput` plus the progress readout for an upload the caller performs.
+-->
+<!--
+  VideoInput — a `FileInput` plus the progress readout for an upload the
+  CALLER performs.
+
+  The division is deliberate and is the same one `FileInput` states: this owns
+  the SELECTION and the PROGRESS UI, the caller owns the transfer. It receives
+  the chosen file through `onSelect`, drives the upload however it likes —
+  resumable, direct-to-storage, whatever the provider needs — and reports back
+  by writing `progress`. A tus or S3 client is a real dependency and belongs
+  in the app, not in a package every page imports.
+
+  ARIA contract: `FileInput`'s, plus a native `<progress>` named by
+  `progressLabel`. The bar appears only while a transfer is actually in
+  flight (0 < progress < 100), so a reader is not handed a permanently
+  stalled-looking control.
+-->
+<script lang="ts">import FileInput from "./FileInput.svelte";
+let { file = $bindable(), progress = $bindable(0), progressLabel = "Upload progress", accept = "video/*", onSelect, class: className, ...rest } = $props();
+const uploading = $derived(file !== undefined && progress > 0 && progress < 100);
+const select = (chosen) => {
+	progress = 0;
+	onSelect?.(chosen);
+};
+</script>
+
+<div class={['flex flex-col gap-2', className]}>
+  <FileInput {...rest} {accept} bind:file onSelect={select} />
+  {#if uploading}
+    <progress class="progress progress-primary w-full" value={progress} max="100" aria-label={progressLabel}
+    ></progress>
+  {/if}
+</div>

package/dist/fields/VideoInput.svelte.d.ts

@@ -0,0 +1,46 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+import type { FieldSize } from './field-types.ts';
+interface Props extends Omit<HTMLInputAttributes, 'type' | 'value' | 'files' | 'size'> {
+    /** The chosen file. */
+    file?: File | undefined;
+    /**
+     * Transfer progress, 0–100. The caller writes this as its upload advances.
+     * @defaultValue `0`
+     */
+    progress?: number | undefined;
+    /**
+     * Accessible name of the progress bar.
+     * @defaultValue `'Upload progress'`
+     */
+    progressLabel?: string | undefined;
+    /**
+     * The `accept` filter passed to the file input.
+     * @defaultValue `'video/*'`
+     */
+    accept?: string | undefined;
+    /** Largest accepted file, in bytes; a larger file is rejected with `tooLargeMessage`. */
+    maxBytes?: number | undefined;
+    /**
+     * Shown when the chosen file exceeds `maxBytes`.
+     * @defaultValue `'That file is too large.'` (from `FileInput`)
+     */
+    tooLargeMessage?: string | undefined;
+    /** Called with the accepted file — the caller starts the transfer here. */
+    onSelect?: ((file: File | undefined) => void) | undefined;
+    /** daisyUI size step. */
+    size?: FieldSize | undefined;
+    /** `FieldControl`: the field is in error — sets `aria-invalid` and the error style. */
+    invalid?: boolean | undefined;
+    /** `FieldControl`: space-separated ids for `aria-describedby`. */
+    describedBy?: string | undefined;
+    /**
+     * `FieldControl`: the visible label's id. Not used — the file input is
+     * labelable, so `<label for>` names it; passed through to `FileInput`,
+     * which drops it.
+     */
+    labelId?: string | undefined;
+}
+/** A `FileInput` plus the progress readout for an upload the caller performs. */
+declare const VideoInput: import("svelte").Component<Props, {}, "progress" | "file">;
+type VideoInput = ReturnType<typeof VideoInput>;
+export default VideoInput;

package/dist/fields/calendar-props.d.ts

@@ -0,0 +1,119 @@
+/**
+ * Small helpers `Calendar` and `RangeCalendar` share when handing their props
+ * to bits-ui.
+ *
+ * @module
+ */
+import type { DateValue } from '@internationalized/date';
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+/** bits-ui's calendars take ONE locale string; ours takes `Intl`'s list. The first entry wins. */
+export declare function firstLocale(locales: string | readonly string[] | undefined): string | undefined;
+/**
+ * Drop the `undefined` entries of an options object. The workspace compiles
+ * with `exactOptionalPropertyTypes`, and bits-ui declares its optional props
+ * as bare `?: T`, so an option this library leaves unset must be absent, not
+ * `undefined`, when it is spread onto a bits-ui root.
+ */
+export declare function definedProps<T extends Record<string, unknown>>(options: T): {
+    [K in keyof T]?: Exclude<T[K], undefined>;
+};
+/**
+ * The props `Calendar` and `RangeCalendar` share — everything but the value.
+ * Each maps onto the bits-ui root prop of the same name, except `locales`
+ * (bits-ui takes one locale; the first entry is used) and the `FieldControl`
+ * members.
+ */
+export interface CalendarBaseProps extends Omit<HTMLAttributes<HTMLDivElement>, 'placeholder' | 'children' | 'id'> {
+    /**
+     * A date in the month to show (bits-ui's `placeholder`); omitted, the
+     * selected date's month, else today's. Bindable: it follows paging.
+     */
+    month?: DateValue | undefined;
+    /** Earliest selectable date. */
+    minValue?: DateValue | undefined;
+    /** Latest selectable date. */
+    maxValue?: DateValue | undefined;
+    /** Days that cannot be chosen at all; rendered disabled. */
+    isDateDisabled?: ((date: DateValue) => boolean) | undefined;
+    /** Days shown but marked unavailable — booked, frost, closed. */
+    isDateUnavailable?: ((date: DateValue) => boolean) | undefined;
+    /**
+     * Months shown side by side.
+     * @defaultValue `1`
+     */
+    numberOfMonths?: number | undefined;
+    /** 0 = Sunday … 6 = Saturday; omitted, the locale's own week start. */
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    /**
+     * Always render six weeks, so the grid never changes height.
+     * @defaultValue `false`
+     */
+    fixedWeeks?: boolean | undefined;
+    /** BCP 47 locale(s); the first is used. Falls back to the context's `locale()`. */
+    locales?: string | readonly string[] | undefined;
+    /**
+     * Accessible name of the calendar, before the visible month.
+     * @defaultValue `'Calendar'`
+     */
+    calendarLabel?: string | undefined;
+    /**
+     * Accessible name of the previous-month button.
+     * @defaultValue `'Previous month'`
+     */
+    previousLabel?: string | undefined;
+    /**
+     * Accessible name of the next-month button.
+     * @defaultValue `'Next month'`
+     */
+    nextLabel?: string | undefined;
+    /**
+     * No interaction at all.
+     * @defaultValue `false`
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Navigable, but the value cannot change.
+     * @defaultValue `false`
+     */
+    readonly?: boolean | undefined;
+    /** Extra decoration in a day cell (a dot for "something planted"). */
+    day?: Snippet<[{
+        date: DateValue;
+        selected: boolean;
+        unavailable: boolean;
+    }]> | undefined;
+    /** `FieldControl`: the root's `id`. */
+    id?: string | undefined;
+    /** `FieldControl`: the visible label's id; the calendar is `aria-labelledby` it. */
+    labelId?: string | undefined;
+    /**
+     * `FieldControl`: space-separated ids for `aria-describedby`.
+     * @defaultValue `''`
+     */
+    describedBy?: string | undefined;
+    /**
+     * `FieldControl`: the field is in error — draws the error border.
+     * @defaultValue `false`
+     */
+    invalid?: boolean | undefined;
+    /** `FieldControl`: accepted for the spread; a calendar has no empty-value validation of its own. */
+    required?: boolean | undefined;
+}
+/** What `calendarRoot` hands `CalendarMonths`. */
+export interface CalendarMonthsOptions {
+    readonly locale: string;
+    readonly previousLabel: string;
+    readonly nextLabel: string;
+    readonly day: CalendarBaseProps['day'];
+}
+/**
+ * Turn the shared props into what both bits-ui roots and `CalendarMonths`
+ * take: the defaults applied, the unset options dropped, the `FieldControl`
+ * members mapped onto ARIA, and every other attribute passed through. One
+ * function, so `Calendar` and `RangeCalendar` cannot disagree about a default.
+ */
+export declare function calendarRoot(props: Omit<CalendarBaseProps, 'month'>, contextLocale: string | readonly string[] | undefined): {
+    readonly root: Record<string, unknown>;
+    readonly months: CalendarMonthsOptions;
+};

package/dist/fields/calendar-props.js

@@ -0,0 +1,51 @@
+/**
+ * Small helpers `Calendar` and `RangeCalendar` share when handing their props
+ * to bits-ui.
+ *
+ * @module
+ */
+/** bits-ui's calendars take ONE locale string; ours takes `Intl`'s list. The first entry wins. */
+export function firstLocale(locales) {
+    return typeof locales === 'string' ? locales : locales?.[0];
+}
+/**
+ * Drop the `undefined` entries of an options object. The workspace compiles
+ * with `exactOptionalPropertyTypes`, and bits-ui declares its optional props
+ * as bare `?: T`, so an option this library leaves unset must be absent, not
+ * `undefined`, when it is spread onto a bits-ui root.
+ */
+export function definedProps(options) {
+    return Object.fromEntries(Object.entries(options).filter(([, value]) => value !== undefined));
+}
+/**
+ * Turn the shared props into what both bits-ui roots and `CalendarMonths`
+ * take: the defaults applied, the unset options dropped, the `FieldControl`
+ * members mapped onto ARIA, and every other attribute passed through. One
+ * function, so `Calendar` and `RangeCalendar` cannot disagree about a default.
+ */
+export function calendarRoot(props, contextLocale) {
+    const { minValue, maxValue, isDateDisabled, isDateUnavailable, numberOfMonths = 1, weekStartsOn, fixedWeeks = false, locales = contextLocale, calendarLabel = 'Calendar', previousLabel = 'Previous month', nextLabel = 'Next month', disabled = false, readonly = false, day, id, labelId, describedBy = '', invalid = false, required: _required, class: className, ...rest } = props;
+    const locale = firstLocale(locales) ?? 'en';
+    return {
+        root: {
+            ...rest,
+            ...definedProps({ id, minValue, maxValue, isDateDisabled, isDateUnavailable, weekStartsOn }),
+            numberOfMonths,
+            weekdayFormat: 'short',
+            fixedWeeks,
+            locale,
+            calendarLabel,
+            disabled,
+            readonly,
+            'aria-labelledby': labelId,
+            'aria-describedby': describedBy === '' ? undefined : describedBy,
+            class: [
+                'card card-border bg-base-100 inline-block p-3',
+                invalid && 'border-error',
+                disabled && 'opacity-50',
+                className,
+            ],
+        },
+        months: { locale, previousLabel, nextLabel, day },
+    };
+}

package/dist/fields/dates.d.ts

@@ -0,0 +1,28 @@
+/**
+ * `@thomasfosterau/components/dates` — the bits-ui date controls, behind
+ * their own entry.
+ *
+ * They bring bits-ui's calendar state machines and `@internationalized/date`'s
+ * calendar maths, so they are not re-exported from the root barrel or from
+ * `fields`: the separate entry makes that cost visible at the import site,
+ * lets an app `import()` them lazily on the one page that needs them, and
+ * keeps any always-loaded component from pulling them in by accident (the
+ * #129 failure mode). `DateInput`, the native control, stays in the barrel
+ * and remains the default for a single date on a form.
+ *
+ * `parseDate`, `parseTime`, `Time` and the `DateValue` type are re-exported
+ * so a caller converts at the edge without a direct dependency:
+ * `parseDate('2026-10-23')` / `parseTime('14:30')` in, `value.toString()`
+ * (ISO) out.
+ *
+ * @module
+ */
+export { default as Calendar } from './Calendar.svelte';
+export { default as DateField } from './DateField.svelte';
+export { default as DatePicker } from './DatePicker.svelte';
+export { default as DateRangePicker } from './DateRangePicker.svelte';
+export { default as RangeCalendar } from './RangeCalendar.svelte';
+export { default as TimeField } from './TimeField.svelte';
+export type { CalendarBaseProps } from './calendar-props.ts';
+export type { PickerProps, SegmentedFieldProps, TimeValue } from './segmented-field.ts';
+export { parseDate, parseTime, Time, type DateValue } from '@internationalized/date';

package/dist/fields/dates.js

@@ -0,0 +1,26 @@
+/**
+ * `@thomasfosterau/components/dates` — the bits-ui date controls, behind
+ * their own entry.
+ *
+ * They bring bits-ui's calendar state machines and `@internationalized/date`'s
+ * calendar maths, so they are not re-exported from the root barrel or from
+ * `fields`: the separate entry makes that cost visible at the import site,
+ * lets an app `import()` them lazily on the one page that needs them, and
+ * keeps any always-loaded component from pulling them in by accident (the
+ * #129 failure mode). `DateInput`, the native control, stays in the barrel
+ * and remains the default for a single date on a form.
+ *
+ * `parseDate`, `parseTime`, `Time` and the `DateValue` type are re-exported
+ * so a caller converts at the edge without a direct dependency:
+ * `parseDate('2026-10-23')` / `parseTime('14:30')` in, `value.toString()`
+ * (ISO) out.
+ *
+ * @module
+ */
+export { default as Calendar } from './Calendar.svelte';
+export { default as DateField } from './DateField.svelte';
+export { default as DatePicker } from './DatePicker.svelte';
+export { default as DateRangePicker } from './DateRangePicker.svelte';
+export { default as RangeCalendar } from './RangeCalendar.svelte';
+export { default as TimeField } from './TimeField.svelte';
+export { parseDate, parseTime, Time } from '@internationalized/date';