@casinogate/ui 2.0.2 → 2.0.3

package/dist/composed/calendar/types.d.ts

@@ -0,0 +1,32 @@
+import type { CalendarMultipleRootProps, CalendarSingleRootProps } from '../../primitives/calendar/types.js';
+import type { DateValue } from '@internationalized/date';
+import type { Snippet } from 'svelte';
+export type CalendarCaptionLayout = 'label' | 'dropdown' | 'dropdown-months' | 'dropdown-years';
+type CalendarDaySnippetArgs = {
+    date: DateValue;
+    month: DateValue;
+};
+type CalendarSharedProps = {
+    /**
+     * How the calendar caption is rendered.
+     * - `'label'`  – formatted month + year heading (default)
+     * - `'dropdown'`  – month and year selects
+     * - `'dropdown-months'`  – month select + formatted year
+     * - `'dropdown-years'`  – formatted month + year select
+     */
+    captionLayout?: CalendarCaptionLayout;
+    /** Custom render for each day cell. Receives the date and the month it belongs to. */
+    day?: Snippet<[CalendarDaySnippetArgs]>;
+    /** Forwarded to the wrapping container. */
+    class?: string;
+};
+export type CalendarSingleProps = Omit<CalendarSingleRootProps, 'children' | 'child' | 'value' | 'onValueChange'> & CalendarSharedProps & {
+    value?: DateValue;
+    onValueChange?: (value: DateValue | undefined) => void;
+};
+export type CalendarMultipleProps = Omit<CalendarMultipleRootProps, 'children' | 'child' | 'value' | 'onValueChange'> & CalendarSharedProps & {
+    value?: DateValue[];
+    onValueChange?: (value: DateValue[]) => void;
+};
+export type CalendarProps = CalendarSingleProps | CalendarMultipleProps;
+export {};

package/dist/composed/calendar/types.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,2 @@
+export * from './root/index.js';
+export type * from './types.js';

package/dist/composed/date-picker/index.js

@@ -0,0 +1 @@
+export * from './root/index.js';

package/dist/composed/date-picker/root/date-picker.root.svelte

@@ -0,0 +1,144 @@
+<script lang="ts" module>
+  import { DateFormatter, getLocalTimeZone, type DateValue } from '@internationalized/date';
+
+  const defaultFormatter = new DateFormatter('en-US', { dateStyle: 'medium' });
+
+  const defaultFormatValue = (value: DateValue | undefined): string => {
+    if (!value) return '';
+    return defaultFormatter.format(value.toDate(getLocalTimeZone()));
+  };
+</script>
+
+<script lang="ts">
+  import { Icon } from '../../../atomic/icons/index.js';
+  import { formatMonthCaption, formatYearCaption } from '../../calendar/api/index.js';
+  import { Calendar } from '../../../primitives/calendar/index.js';
+  import { DatePicker as Primitive } from '../../../primitives/date-picker/index.js';
+  import type { DatePickerProps } from '../types.js';
+
+  let {
+    value = $bindable(),
+    open = $bindable(false),
+    placeholder = 'Pick a date',
+    formatValue = defaultFormatValue,
+    enableSegments = false,
+    captionLayout = 'label',
+    locale = 'en-US',
+    monthFormat = 'long',
+    yearFormat = 'numeric',
+    name,
+    disabledPortal = false,
+    triggerVariant = 'primary',
+    triggerSize = 'md',
+    triggerRounded = 'sm',
+    triggerFullWidth = true,
+    triggerClass,
+    triggerProps,
+    inputClass,
+    inputProps,
+    contentClass,
+    contentProps,
+    ...restProps
+  }: DatePickerProps = $props();
+
+  const displayLabel = $derived(formatValue(value) || placeholder);
+</script>
+
+<Primitive.Root bind:value bind:open {locale} {monthFormat} {yearFormat} {...restProps}>
+  {#if enableSegments}
+    <Primitive.Input {name} class={inputClass} {...inputProps}>
+      {#snippet children({ segments })}
+        {#each segments as { part, value: segmentValue }, i (i)}
+          <Primitive.Segment {part}>{segmentValue}</Primitive.Segment>
+        {/each}
+
+        <Primitive.Trigger
+          variant={triggerVariant}
+          size={triggerSize}
+          rounded={triggerRounded}
+          fullWidth={triggerFullWidth}
+          class={triggerClass}
+          hasChevron={false}
+          {...triggerProps}
+        >
+          <Icon.Calendar width={18} height={18} />
+        </Primitive.Trigger>
+      {/snippet}
+    </Primitive.Input>
+  {:else}
+    <Primitive.Trigger
+      variant={triggerVariant}
+      size={triggerSize}
+      rounded={triggerRounded}
+      fullWidth={triggerFullWidth}
+      class={triggerClass}
+      {...triggerProps}
+    >
+      {displayLabel}
+    </Primitive.Trigger>
+  {/if}
+
+  <Primitive.Portal disabled={disabledPortal}>
+    <Primitive.Content class={contentClass} {...contentProps}>
+      <Primitive.Calendar>
+        {#snippet children({ months, weekdays })}
+          {@const currentMonth = months[0]?.value}
+          <Calendar.Header>
+            <Calendar.PrevButton />
+
+            {#if captionLayout === 'dropdown'}
+              <div class="cgui:flex cgui:items-center cgui:gap-2">
+                <Calendar.MonthSelect />
+                <Calendar.YearSelect />
+              </div>
+            {:else if captionLayout === 'dropdown-months' && currentMonth}
+              <div class="cgui:flex cgui:items-center cgui:gap-2">
+                <Calendar.MonthSelect />
+                <span class="cgui:text-body cgui:text-fg-darkest cgui:font-medium">
+                  {formatYearCaption(currentMonth, locale, yearFormat)}
+                </span>
+              </div>
+            {:else if captionLayout === 'dropdown-years' && currentMonth}
+              <div class="cgui:flex cgui:items-center cgui:gap-2">
+                <span class="cgui:text-body cgui:text-fg-darkest cgui:font-medium">
+                  {formatMonthCaption(currentMonth, locale, monthFormat)}
+                </span>
+                <Calendar.YearSelect />
+              </div>
+            {:else}
+              <Calendar.Heading />
+            {/if}
+
+            <Calendar.NextButton />
+          </Calendar.Header>
+
+          <Calendar.Body>
+            {#each months as month, i (i)}
+              <Calendar.Grid>
+                <Calendar.GridHead>
+                  <Calendar.GridRow>
+                    {#each weekdays as weekday, j (j)}
+                      <Calendar.HeadCell>{weekday}</Calendar.HeadCell>
+                    {/each}
+                  </Calendar.GridRow>
+                </Calendar.GridHead>
+
+                <Calendar.GridBody>
+                  {#each month.weeks as weekDates, w (w)}
+                    <Calendar.GridRow>
+                      {#each weekDates as date, d (d)}
+                        <Calendar.Cell {date} month={month.value}>
+                          <Calendar.Day>{date.day}</Calendar.Day>
+                        </Calendar.Cell>
+                      {/each}
+                    </Calendar.GridRow>
+                  {/each}
+                </Calendar.GridBody>
+              </Calendar.Grid>
+            {/each}
+          </Calendar.Body>
+        {/snippet}
+      </Primitive.Calendar>
+    </Primitive.Content>
+  </Primitive.Portal>
+</Primitive.Root>

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

@@ -0,0 +1,4 @@
+import type { DatePickerProps } from '../types.js';
+declare const DatePicker: import("svelte").Component<DatePickerProps, {}, "value" | "open">;
+type DatePicker = ReturnType<typeof DatePicker>;
+export default DatePicker;

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

@@ -0,0 +1 @@
+export { default as DatePicker } from './date-picker.root.svelte';

package/dist/composed/date-picker/root/index.js

@@ -0,0 +1 @@
+export { default as DatePicker } from './date-picker.root.svelte';

package/dist/composed/date-picker/types.d.ts

@@ -0,0 +1,45 @@
+import type { DatePickerContentProps, DatePickerInputProps, DatePickerRootProps, DatePickerTriggerProps } from '../../primitives/date-picker/types.js';
+import type { DateValue } from '@internationalized/date';
+import type { CalendarCaptionLayout } from '../calendar/types.js';
+export type DatePickerFormatValue = (value: DateValue | undefined) => string;
+export type DatePickerProps = Omit<DatePickerRootProps, 'children' | 'child' | 'placeholder'> & {
+    /**
+     * Formatter used to render the selected date in the trigger label.
+     * Receives the current value and returns the string shown to the user.
+     * Defaults to a medium-style locale formatter.
+     */
+    formatValue?: DatePickerFormatValue;
+    /**
+     * When true, renders a segmented date input (day/month/year) alongside a
+     * calendar icon button trigger. When false (default), renders a single
+     * Select-style trigger button that shows the formatted value.
+     */
+    enableSegments?: boolean;
+    /**
+     * How the calendar caption is rendered inside the popover.
+     * - `'label'`  – formatted month + year heading (default)
+     * - `'dropdown'`  – month and year selects
+     * - `'dropdown-months'`  – month select + formatted year
+     * - `'dropdown-years'`  – formatted month + year select
+     */
+    captionLayout?: CalendarCaptionLayout;
+    /** Placeholder shown in the trigger when no value is selected. */
+    placeholder?: string;
+    /** Form field name. Only emitted when `enableSegments` is true. */
+    name?: string;
+    /** Disable rendering the popover into a portal. */
+    disabledPortal?: boolean;
+    /** Style overrides forwarded to the trigger primitive. */
+    triggerVariant?: DatePickerTriggerProps['variant'];
+    triggerSize?: DatePickerTriggerProps['size'];
+    triggerRounded?: DatePickerTriggerProps['rounded'];
+    triggerFullWidth?: DatePickerTriggerProps['fullWidth'];
+    triggerClass?: string;
+    triggerProps?: Omit<DatePickerTriggerProps, 'class' | 'children' | 'child' | 'ref' | 'variant' | 'size' | 'rounded' | 'fullWidth'>;
+    /** Style overrides forwarded to the segmented input wrapper. */
+    inputClass?: string;
+    inputProps?: Omit<DatePickerInputProps, 'class' | 'children' | 'child' | 'ref' | 'name'>;
+    /** Style overrides forwarded to the popover content. */
+    contentClass?: string;
+    contentProps?: Omit<DatePickerContentProps, 'class' | 'children' | 'child' | 'ref'>;
+};

package/dist/composed/date-picker/types.js

@@ -0,0 +1 @@
+export {};

package/dist/composed/index.d.ts

@@ -1,8 +1,10 @@
 export * from './breadcrumb/index.js';
+export * from './calendar/index.js';
 export * from './collapsible/index.js';
 export * from './combobox/index.js';
 export * from './command/index.js';
 export * from './data-table/index.js';
+export * from './date-picker/index.js';
 export * from './dialog/index.js';
 export * from './drawer/index.js';
 export * from './dropdown/index.js';

package/dist/composed/index.js

@@ -1,8 +1,10 @@
 export * from './breadcrumb/index.js';
+export * from './calendar/index.js';
 export * from './collapsible/index.js';
 export * from './combobox/index.js';
 export * from './command/index.js';
 export * from './data-table/index.js';
+export * from './date-picker/index.js';
 export * from './dialog/index.js';
 export * from './drawer/index.js';
 export * from './dropdown/index.js';

package/dist/internal/utils/tailwindcss.d.ts

@@ -5,5 +5,5 @@ export declare function cn(...inputs: CnOptions): string;
 export declare const tv: TV;
 export declare const numberToPx: (value: number) => string;
 export declare const numberToRem: (value: number, base?: number) => string;
-export type WithVariants<TSource extends Record<string, any>, TVariants extends VariantProps<any>> = TSource & Without<TVariants, TSource>;
+export type WithVariants<TSource extends Record<string, unknown>, TStyles extends VariantProps<any>> = TSource & Without<TStyles, TSource>;
 export type { VariantProps };

package/dist/primitives/calendar/components/calendar.body.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { calendarBodyVariants } from '../styles.js';
+  import type { CalendarBodyProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, child, children, ...restProps }: CalendarBodyProps = $props();
+
+  const sharedProps = $derived({
+    class: cn(calendarBodyVariants(), className),
+    ...restProps,
+  });
+</script>
+
+{#if child}
+  {@render child?.({ props: sharedProps })}
+{:else}
+  <div bind:this={ref} {...sharedProps}>
+    {@render children?.()}
+  </div>
+{/if}

package/dist/primitives/calendar/components/calendar.body.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarBodyProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarBodyProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.cell.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarCellVariants } from '../styles.js';
+  import type { CalendarCellProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarCellProps = $props();
+</script>
+
+<Primitive.Cell bind:ref class={cn(calendarCellVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.cell.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarCellProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarCellProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.day.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarDayVariants } from '../styles.js';
+  import type { CalendarDayProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarDayProps = $props();
+</script>
+
+<Primitive.Day bind:ref class={cn(calendarDayVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.day.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarDayProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarDayProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.grid-body.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarGridBodyVariants } from '../styles.js';
+  import type { CalendarGridBodyProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarGridBodyProps = $props();
+</script>
+
+<Primitive.GridBody bind:ref class={cn(calendarGridBodyVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.grid-body.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarGridBodyProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarGridBodyProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.grid-head.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarGridHeadVariants } from '../styles.js';
+  import type { CalendarGridHeadProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarGridHeadProps = $props();
+</script>
+
+<Primitive.GridHead bind:ref class={cn(calendarGridHeadVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.grid-head.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarGridHeadProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarGridHeadProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.grid-row.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarGridRowVariants } from '../styles.js';
+  import type { CalendarGridRowProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarGridRowProps = $props();
+</script>
+
+<Primitive.GridRow bind:ref class={cn(calendarGridRowVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.grid-row.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarGridRowProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarGridRowProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.grid.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarGridVariants } from '../styles.js';
+  import type { CalendarGridProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarGridProps = $props();
+</script>
+
+<Primitive.Grid bind:ref class={cn(calendarGridVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.grid.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarGridProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarGridProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.head-cell.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarHeadCellVariants } from '../styles.js';
+  import type { CalendarHeadCellProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarHeadCellProps = $props();
+</script>
+
+<Primitive.HeadCell bind:ref class={cn(calendarHeadCellVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.head-cell.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarHeadCellProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarHeadCellProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.header.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarHeaderVariants } from '../styles.js';
+  import type { CalendarHeaderProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarHeaderProps = $props();
+</script>
+
+<Primitive.Header bind:ref class={cn(calendarHeaderVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.header.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarHeaderProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarHeaderProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.heading.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { calendarHeadingVariants } from '../styles.js';
+  import type { CalendarHeadingProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarHeadingProps = $props();
+</script>
+
+<Primitive.Heading bind:ref class={cn(calendarHeadingVariants(), className)} {...restProps} />

package/dist/primitives/calendar/components/calendar.heading.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarHeadingProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarHeadingProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.month-select.svelte

@@ -0,0 +1,37 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  // import { calendarMonthSelectStyles } from '../styles.js';
+  import { Select } from '../../select/index.js';
+  import type { CalendarMonthSelectProps } from '../types.js';
+
+  let { ref = $bindable(null), class: className, ...restProps }: CalendarMonthSelectProps = $props();
+</script>
+
+<Primitive.MonthSelect bind:ref class={cn(className)} {...restProps}>
+  {#snippet child({ monthItems, selectedMonthItem, props })}
+    <Select.Root
+      type="single"
+      value={String(selectedMonthItem.value)}
+      onValueChange={(v) => {
+        if ('onchange' in props && typeof props.onchange === 'function') {
+          props.onchange?.({ target: { value: String(v) } } as unknown as Event);
+        }
+      }}
+      disabled={props?.disabled as boolean}
+    >
+      <Select.Trigger class="cgui:min-w-28 cgui:shrink">
+        {selectedMonthItem.label}
+      </Select.Trigger>
+      <Select.Content class="cgui:max-h-40">
+        <Select.Viewport>
+          {#each monthItems as monthItem, i (i)}
+            <Select.Item value={monthItem.value.toString()}>
+              {monthItem.label}
+            </Select.Item>
+          {/each}
+        </Select.Viewport>
+      </Select.Content>
+    </Select.Root>
+  {/snippet}
+</Primitive.MonthSelect>

package/dist/primitives/calendar/components/calendar.month-select.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar as Primitive } from 'bits-ui';
+declare const Calendar: import("svelte").Component<Omit<Omit<Primitive.MonthSelectProps, "child">, "children">, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.next-button.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+  import { Icon } from '../../../atomic/icons/index.js';
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { mergeProps } from 'svelte-toolbelt';
+  import { calendarHeaderButtonVariants } from '../styles.js';
+  import type { CalendarNextButtonProps } from '../types.js';
+
+  let { class: className, children, ref = $bindable(null), child, ...restProps }: CalendarNextButtonProps = $props();
+
+  const classNames = $derived(cn(calendarHeaderButtonVariants(), className));
+
+  const mergedProps = $derived(mergeProps(restProps, { class: classNames }));
+</script>
+
+{#if child}
+  {@render child?.({ props: mergedProps })}
+{:else}
+  <Primitive.NextButton bind:ref {...mergedProps}>
+    {#if children}
+      {@render children?.()}
+    {:else}
+      <Icon.ChevronRight />
+    {/if}
+  </Primitive.NextButton>
+{/if}

package/dist/primitives/calendar/components/calendar.next-button.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarNextButtonProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarNextButtonProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.prev-button.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+  import { Icon } from '../../../atomic/icons/index.js';
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { Calendar as Primitive } from 'bits-ui';
+  import { mergeProps } from 'svelte-toolbelt';
+  import { calendarHeaderButtonVariants } from '../styles.js';
+  import type { CalendarPrevButtonProps } from '../types.js';
+
+  let { class: className, children, ref = $bindable(null), child, ...restProps }: CalendarPrevButtonProps = $props();
+
+  const classNames = $derived(cn(calendarHeaderButtonVariants(), className));
+
+  const mergedProps = $derived(mergeProps(restProps, { class: classNames }));
+</script>
+
+{#if child}
+  {@render child?.({ props: mergedProps })}
+{:else}
+  <Primitive.PrevButton bind:ref {...mergedProps}>
+    {#if children}
+      {@render children?.()}
+    {:else}
+      <Icon.ChevronLeft />
+    {/if}
+  </Primitive.PrevButton>
+{/if}

package/dist/primitives/calendar/components/calendar.prev-button.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarPrevButtonProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarPrevButtonProps, {}, "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/primitives/calendar/components/calendar.root.svelte

@@ -0,0 +1,35 @@
+<script lang="ts">
+  import { Calendar as Primitive } from 'bits-ui';
+
+  import { cn } from '../../../internal/utils/tailwindcss.js';
+  import { boxWith } from 'svelte-toolbelt';
+  import { CalendarRootStylesContext, calendarRootVariants } from '../styles.js';
+  import type { CalendarRootProps } from '../types.js';
+
+  let {
+    value = $bindable(),
+    ref = $bindable(null),
+    placeholder = $bindable(),
+    class: className,
+    //
+    rounded = 'md',
+    ...restProps
+  }: CalendarRootProps = $props();
+
+  CalendarRootStylesContext.set({
+    rounded: boxWith(() => rounded),
+  });
+</script>
+
+<Primitive.Root
+  bind:value={value as never}
+  bind:placeholder
+  bind:ref
+  class={cn(
+    calendarRootVariants({
+      rounded,
+    }),
+    className
+  )}
+  {...restProps}
+/>

package/dist/primitives/calendar/components/calendar.root.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarRootProps } from '../types.js';
+declare const Calendar: import("svelte").Component<CalendarRootProps, {}, "placeholder" | "value" | "ref">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;