ui-ingredients 0.0.19 → 0.0.21

package/dist/date-picker/index.d.ts

@@ -1 +1,30 @@
+export { parse as parseDate } from '@zag-js/date-picker';
+export { datePickerAnatomy } from './anatomy.js';
 export * as DatePicker from './date-picker.js';
+export type { DatePickerClearTriggerProps } from './clear-trigger.svelte';
+export type { DatePickerContentProps } from './content.svelte';
+export type { DatePickerControlProps } from './control.svelte';
+export type { DatePickerDayTableCellTriggerProps } from './day-table-cell-trigger.svelte';
+export type { DatePickerDayTableCellProps } from './day-table-cell.svelte';
+export type { DatePickerInputProps } from './input.svelte';
+export type { DatePickerLabelProps } from './label.svelte';
+export type { DatePickerMonthSelectProps } from './month-select.svelte';
+export type { DatePickerMonthTableCellTriggerProps } from './month-table-cell-trigger.svelte';
+export type { DatePickerMonthTableCellProps } from './month-table-cell.svelte';
+export type { DatePickerNextTriggerProps } from './next-trigger.svelte';
+export type { DatePickerPositionerProps } from './positioner.svelte';
+export type { DatePickerPresetTriggerProps } from './preset-trigger.svelte';
+export type { DatePickerPrevTriggerProps } from './prev-trigger.svelte';
+export type { DatePickerRangeTextProps } from './range-text.svelte';
+export type { DatePickerProps } from './root.svelte';
+export type { DatePickerTableBodyProps } from './table-body.svelte';
+export type { DatePickerTableHeadProps } from './table-head.svelte';
+export type { DatePickerTableHeaderProps } from './table-header.svelte';
+export type { DatePickerTableRowProps } from './table-row.svelte';
+export type { DatePickerTableProps } from './table.svelte';
+export type { DatePickerTriggerProps } from './trigger.svelte';
+export type { DatePickerViewControlProps } from './view-control.svelte';
+export type { DatePickerViewProps } from './view.svelte';
+export type { DatePickerYearSelectProps } from './year-select.svelte';
+export type { DatePickerYearTableCellTriggerProps } from './year-table-cell-trigger.svelte';
+export type { DatePickerYearTableCellProps } from './year-table-cell.svelte';

package/dist/date-picker/index.js

@@ -1 +1,3 @@
+export { parse as parseDate } from '@zag-js/date-picker';
+export { datePickerAnatomy } from './anatomy.js';
 export * as DatePicker from './date-picker.js';

package/dist/date-picker/input.svelte

@@ -1,3 +1,19 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {Assign, HtmlProps} from '../types.js';
+  import type {InputProps} from '@zag-js/date-picker';
 
-<script lang="ts"></script>
+  export interface DatePickerInputProps extends Assign<HtmlProps<'input'>, InputProps> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+
+  let {index, children, ...props}: DatePickerInputProps = $props();
+
+  let datePicker = datePickerContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getInputProps({index})));
+</script>
+
+<input {...attrs} />

package/dist/date-picker/input.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const Input: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const Input: $$__sveltets_2_IsomorphicComponent<DatePickerInputProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type Input = InstanceType<typeof Input>;
 export default Input;

package/dist/date-picker/label.svelte

@@ -1,3 +1,21 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {Assign, HtmlProps} from '../types.js';
+  import type {LabelProps} from '@zag-js/date-picker';
 
-<script lang="ts"></script>
+  export interface DatePickerLabelProps extends Assign<HtmlProps<'label'>, LabelProps> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+
+  let {index, children, ...props}: DatePickerLabelProps = $props();
+
+  let datePicker = datePickerContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getLabelProps({index})));
+</script>
+
+<label {...attrs}>
+  {@render children?.()}
+</label>

package/dist/date-picker/label.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const Label: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const Label: $$__sveltets_2_IsomorphicComponent<DatePickerLabelProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type Label = InstanceType<typeof Label>;
 export default Label;

package/dist/date-picker/month-select.svelte

@@ -1,3 +1,41 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {HtmlProps} from '../types.js';
 
-<script lang="ts"></script>
+  export interface DatePickerMonthSelectProps extends HtmlProps<'select'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+
+  let {children, ...props}: DatePickerMonthSelectProps = $props();
+
+  let datePicker = datePickerContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getMonthSelectProps()));
+
+  const months = [
+    'January',
+    'February',
+    'March',
+    'April',
+    'May',
+    'June',
+    'July',
+    'August',
+    'September',
+    'October',
+    'November',
+    'December',
+  ];
+</script>
+
+<select {...attrs}>
+  {#if children}
+    {@render children()}
+  {:else}
+    {#each months as month, index}
+      <option value={index}>{month}</option>
+    {/each}
+  {/if}
+</select>

package/dist/date-picker/month-select.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const MonthSelect: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const MonthSelect: $$__sveltets_2_IsomorphicComponent<DatePickerMonthSelectProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type MonthSelect = InstanceType<typeof MonthSelect>;
 export default MonthSelect;

package/dist/date-picker/month-table-cell-trigger.svelte

@@ -1,3 +1,21 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {HtmlProps} from '../types.js';
 
-<script lang="ts"></script>
+  export interface DatePickerMonthTableCellTriggerProps extends HtmlProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext, datePickerTableCellPropsContext} from './context.svelte.js';
+
+  let {children, ...props}: DatePickerMonthTableCellTriggerProps = $props();
+
+  let datePicker = datePickerContext.get();
+  let tableCellProps = datePickerTableCellPropsContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getMonthTableCellTriggerProps(tableCellProps)));
+</script>
+
+<button type="button" {...attrs}>
+  {@render children?.()}
+</button>

package/dist/date-picker/month-table-cell-trigger.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const MonthTableCellTrigger: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const MonthTableCellTrigger: $$__sveltets_2_IsomorphicComponent<DatePickerMonthTableCellTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type MonthTableCellTrigger = InstanceType<typeof MonthTableCellTrigger>;
 export default MonthTableCellTrigger;

package/dist/date-picker/month-table-cell.svelte

@@ -1,3 +1,40 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {Assign, HtmlProps} from '../types.js';
+  import type {TableCellProps, TableCellState} from '@zag-js/date-picker';
+  import type {Snippet} from 'svelte';
 
-<script lang="ts"></script>
+  export interface DatePickerMonthTableCellProps
+    extends Assign<Omit<HtmlProps<'div'>, 'children'>, TableCellProps> {
+    children?: Snippet<[state: TableCellState]>;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext, datePickerTableCellPropsContext} from './context.svelte.js';
+
+  let {
+    /**/
+    value,
+    disabled,
+    columns,
+    children,
+    ...props
+  }: DatePickerMonthTableCellProps = $props();
+
+  let datePicker = datePickerContext.get();
+  let tableCellProps: TableCellProps = $derived({
+    value,
+    disabled,
+    columns,
+  });
+
+  let state = $derived(datePicker.getMonthTableCellState(tableCellProps));
+  let attrs = $derived(mergeProps(props, datePicker.getMonthTableCellProps(tableCellProps)));
+
+  datePickerTableCellPropsContext.set(() => tableCellProps);
+</script>
+
+<div {...attrs}>
+  {@render children?.(state)}
+</div>

package/dist/date-picker/month-table-cell.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const MonthTableCell: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const MonthTableCell: $$__sveltets_2_IsomorphicComponent<DatePickerMonthTableCellProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type MonthTableCell = InstanceType<typeof MonthTableCell>;
 export default MonthTableCell;

package/dist/date-picker/next-trigger.svelte

@@ -1,3 +1,21 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {HtmlProps} from '../types.js';
 
-<script lang="ts"></script>
+  export interface DatePickerNextTriggerProps extends HtmlProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext, datePickerViewPropsContext} from './context.svelte.js';
+
+  let {children, ...props}: DatePickerNextTriggerProps = $props();
+
+  let datePicker = datePickerContext.get();
+  let viewProps = datePickerViewPropsContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getNextTriggerProps(viewProps)));
+</script>
+
+<button type="button" {...attrs}>
+  {@render children?.()}
+</button>

package/dist/date-picker/next-trigger.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const NextTrigger: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const NextTrigger: $$__sveltets_2_IsomorphicComponent<DatePickerNextTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type NextTrigger = InstanceType<typeof NextTrigger>;
 export default NextTrigger;

package/dist/date-picker/positioner.svelte

@@ -1,3 +1,20 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {HtmlProps} from '../types.js';
 
-<script lang="ts"></script>
+  export interface DatePickerPositionerProps extends HtmlProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+
+  let {children, ...props}: DatePickerPositionerProps = $props();
+
+  let datePicker = datePickerContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getPositionerProps()));
+</script>
+
+<div {...attrs}>
+  {@render children?.()}
+</div>

package/dist/date-picker/positioner.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const Positioner: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const Positioner: $$__sveltets_2_IsomorphicComponent<DatePickerPositionerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type Positioner = InstanceType<typeof Positioner>;
 export default Positioner;

package/dist/date-picker/preset-trigger.svelte

@@ -1,3 +1,22 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {Assign, HtmlProps} from '../types.js';
+  import type {PresetTriggerProps} from '@zag-js/date-picker';
 
-<script lang="ts"></script>
+  export interface DatePickerPresetTriggerProps
+    extends Assign<HtmlProps<'button'>, PresetTriggerProps> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+
+  let {value, children, ...props}: DatePickerPresetTriggerProps = $props();
+
+  let datePicker = datePickerContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getPresetTriggerProps({value})));
+</script>
+
+<button type="button" {...attrs}>
+  {@render children?.()}
+</button>

package/dist/date-picker/preset-trigger.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const PresetTrigger: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const PresetTrigger: $$__sveltets_2_IsomorphicComponent<DatePickerPresetTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type PresetTrigger = InstanceType<typeof PresetTrigger>;
 export default PresetTrigger;

package/dist/date-picker/prev-trigger.svelte

@@ -1,3 +1,21 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {HtmlProps} from '../types.js';
 
-<script lang="ts"></script>
+  export interface DatePickerPrevTriggerProps extends HtmlProps<'button'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext, datePickerViewPropsContext} from './context.svelte.js';
+
+  let {children, ...props}: DatePickerPrevTriggerProps = $props();
+
+  let datePicker = datePickerContext.get();
+  let viewProps = datePickerViewPropsContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getPrevTriggerProps(viewProps)));
+</script>
+
+<button type="button" {...attrs}>
+  {@render children?.()}
+</button>

package/dist/date-picker/prev-trigger.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const PrevTrigger: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const PrevTrigger: $$__sveltets_2_IsomorphicComponent<DatePickerPrevTriggerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type PrevTrigger = InstanceType<typeof PrevTrigger>;
 export default PrevTrigger;

package/dist/date-picker/range-text.svelte

@@ -1,3 +1,24 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {HtmlProps} from '../types.js';
 
-<script lang="ts"></script>
+  export interface DatePickerRangeTextProps extends HtmlProps<'div'> {}
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+
+  let {children, ...props}: DatePickerRangeTextProps = $props();
+
+  let datePicker = datePickerContext.get();
+
+  let attrs = $derived(mergeProps(props, datePicker.getRangeTextProps()));
+</script>
+
+<div {...attrs}>
+  {#if children}
+    {@render children()}
+  {:else}
+    {datePicker.visibleRangeText.formatted}
+  {/if}
+</div>

package/dist/date-picker/range-text.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const RangeText: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const RangeText: $$__sveltets_2_IsomorphicComponent<DatePickerRangeTextProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type RangeText = InstanceType<typeof RangeText>;
 export default RangeText;

package/dist/date-picker/root.svelte

@@ -1,3 +1,88 @@
-<script lang="ts" module></script>
+<script lang="ts" module>
+  import type {Assign, HtmlProps} from '../types.js';
+  import type {Snippet} from 'svelte';
+  import type {CreateDatePickerProps, CreateDatePickerReturn} from './create-date-picker.svelte.js';
 
-<script lang="ts"></script>
+  export interface DatePickerProps
+    extends Assign<Omit<HtmlProps<'div'>, 'children'>, CreateDatePickerProps> {
+    children?: Snippet<[datePicker: CreateDatePickerReturn]>;
+  }
+</script>
+
+<script lang="ts">
+  import {mergeProps} from '@zag-js/svelte';
+  import {datePickerContext} from './context.svelte.js';
+  import {createDatePicker} from './create-date-picker.svelte.js';
+
+  let {
+    id,
+    ids,
+    min,
+    max,
+    name,
+    open,
+    view,
+    value,
+    modal,
+    locale,
+    disabled,
+    readOnly,
+    timeZone,
+    fixedWeeks,
+    startOfWeek,
+    defaultOpen,
+    positioning,
+    numOfMonths,
+    translations,
+    focusedValue,
+    closeOnSelect,
+    selectionMode,
+    format,
+    onViewChange,
+    onOpenChange,
+    onValueChange,
+    onFocusChange,
+    isDateUnavailable,
+    children,
+    ...props
+  }: DatePickerProps = $props();
+
+  let datePicker = createDatePicker({
+    id,
+    ids,
+    min,
+    max,
+    name,
+    open,
+    view,
+    value: $state.snapshot(value),
+    modal,
+    locale,
+    disabled,
+    readOnly,
+    timeZone,
+    fixedWeeks,
+    defaultOpen,
+    startOfWeek,
+    positioning,
+    numOfMonths,
+    translations,
+    focusedValue,
+    closeOnSelect,
+    selectionMode,
+    format,
+    onViewChange,
+    onOpenChange,
+    onValueChange,
+    onFocusChange,
+    isDateUnavailable,
+  });
+
+  let attrs = $derived(mergeProps(props, datePicker.getRootProps()));
+
+  datePickerContext.set(datePicker);
+</script>
+
+<div {...attrs}>
+  {@render children?.(datePicker)}
+</div>

package/dist/date-picker/root.svelte.d.ts

@@ -2,7 +2,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: {
+    (internal: unknown, props: Props & {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -11,8 +11,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const Root: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+declare const Root: $$__sveltets_2_IsomorphicComponent<DatePickerProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type Root = InstanceType<typeof Root>;
 export default Root;