npm - @skeletonlabs/skeleton-svelte - Versions diffs - 5.0.0-next.0 → 5.0.0-next.10 - Mend

@skeletonlabs/skeleton-svelte 5.0.0-next.0 → 5.0.0-next.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (445) hide show

package/dist/components/date-picker/anatomy/table-cell-trigger.svelte CHANGED Viewed

@@ -6,16 +6,16 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { TableCellContext } from '../modules/table-cell-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerTableCellContext } from '../modules/table-cell-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTableCellTriggerProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
-	const tableCellProps = TableCellContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
+	const tableCellProps = DatePickerTableCellContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/table-cell.svelte CHANGED Viewed

@@ -9,16 +9,16 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { TableCellContext } from '../modules/table-cell-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerTableCellContext } from '../modules/table-cell-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { splitTableCellProps } from '@zag-js/date-picker';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTableCellProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const [tableCellProps, componentProps] = $derived(
 		splitTableCellProps(props as unknown as TableCellProps) as unknown as [
@@ -39,7 +39,7 @@
 	const attributes = $derived(mergeProps(refinedTableCellProps, rest));
-	TableCellContext.provide(() => tableCellProps);
+	DatePickerTableCellContext.provide(() => tableCellProps);
 </script>
 {#if element}

package/dist/components/date-picker/anatomy/table-head.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTableHeadProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/table-header.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTableHeaderProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/table-row.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTableRowProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/table.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTableProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/trigger.svelte CHANGED Viewed

@@ -7,12 +7,12 @@
 <script lang="ts">
 	import CalendarIcon from '../../../internal/components/calendar.svelte';
-	import { RootContext } from '../modules/root-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerTriggerProps = $props();
-	const datePicker = RootContext.consume();
+	const datePicker = DatePickerRootContext.consume();
 	const { element, children = calendarIcon, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/view-control.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerViewControlProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/view-trigger.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerViewTriggerProps = $props();
-	const datePicker = RootContext.consume();
-	const viewProps = ViewContext.consume();
+	const datePicker = DatePickerRootContext.consume();
+	const viewProps = DatePickerViewContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/date-picker/anatomy/view.svelte CHANGED Viewed

@@ -7,21 +7,21 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
-	import { ViewContext } from '../modules/view-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
+	import { DatePickerViewContext } from '../modules/view-context.js';
 	import { splitViewProps } from '@zag-js/date-picker';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerViewProps = $props();
-	const datePicker = RootContext.consume();
+	const datePicker = DatePickerRootContext.consume();
 	const [viewProps, componentProps] = $derived(splitViewProps(props));
 	const { element, children, ...rest } = $derived(componentProps);
 	const attributes = $derived(mergeProps(datePicker().getViewProps(viewProps), rest));
-	ViewContext.provide(() => viewProps);
+	DatePickerViewContext.provide(() => viewProps);
 </script>
 {#if element}

package/dist/components/date-picker/anatomy/year-select.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DatePickerRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DatePickerYearSelectProps = $props();
-	const datePicker = RootContext.consume();
+	const datePicker = DatePickerRootContext.consume();
 	const { element, ...rest } = $derived(props);

package/dist/components/date-picker/modules/provider.svelte.js CHANGED Viewed

@@ -1,7 +1,12 @@
+import { LocaleProviderRootContext } from '../../locale-provider/modules/root-context.js';
 import { connect, machine } from '@zag-js/date-picker';
 import { normalizeProps, useMachine } from '@zag-js/svelte';
 export function useDatePicker(props) {
-    const service = useMachine(machine, props);
+    const locale = LocaleProviderRootContext.consume();
+    const service = useMachine(machine, () => ({
+        dir: locale().dir,
+        ...(typeof props === 'function' ? props() : props),
+    }));
     const datePicker = $derived(connect(service, normalizeProps));
     return () => datePicker;
 }

package/dist/components/date-picker/modules/root-context.js CHANGED Viewed

@@ -1,2 +1,2 @@
 import { createContext } from '../../../internal/create-context.js';
-export const RootContext = createContext();
+export const DatePickerRootContext = createContext();

package/dist/components/date-picker/modules/table-cell-context.d.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import type { Union } from '../../../internal/union.js';
 import type { DayTableCellProps, TableCellProps } from '@zag-js/date-picker';
-export declare const TableCellContext: {
-    key: symbol;
+export declare const DatePickerTableCellContext: {
     consume(): () => Union<TableCellProps, DayTableCellProps>;
-    provide(value: () => Union<TableCellProps, DayTableCellProps>): () => Union<TableCellProps, DayTableCellProps>;
+    provide: (context: () => Union<TableCellProps, DayTableCellProps>) => () => Union<TableCellProps, DayTableCellProps>;
 };

package/dist/components/date-picker/modules/table-cell-context.js CHANGED Viewed

@@ -1,2 +1,2 @@
 import { createContext } from '../../../internal/create-context.js';
-export const TableCellContext = createContext();
+export const DatePickerTableCellContext = createContext();

package/dist/components/date-picker/modules/view-context.d.ts CHANGED Viewed

@@ -1,6 +1,5 @@
 import type { ViewProps } from '@zag-js/date-picker';
-export declare const ViewContext: {
-    key: symbol;
+export declare const DatePickerViewContext: {
     consume(): () => ViewProps;
-    provide(value: () => ViewProps): () => ViewProps;
+    provide: (context: () => ViewProps) => () => ViewProps;
 };

package/dist/components/date-picker/modules/view-context.js CHANGED Viewed

@@ -1,2 +1,2 @@
 import { createContext } from '../../../internal/create-context.js';
-export const ViewContext = createContext(() => ({ view: 'day' }));
+export const DatePickerViewContext = createContext(() => ({ view: 'day' }));

package/dist/components/dialog/anatomy/backdrop.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogBackdropProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, ...rest } = $derived(props);

package/dist/components/dialog/anatomy/close-trigger.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogCloseTriggerProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/dialog/anatomy/content.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogContentProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/dialog/anatomy/description.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogDescriptionProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/dialog/anatomy/positioner.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogPositionerProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/dialog/anatomy/root-context.svelte CHANGED Viewed

@@ -8,11 +8,11 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	const props: DialogRootContextProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { children } = $derived(props);
 </script>

package/dist/components/dialog/anatomy/root-context.svelte.d.ts CHANGED Viewed

@@ -3,7 +3,6 @@ import type { Snippet } from 'svelte';
 export interface DialogRootContextProps {
     children: Snippet<[ReturnType<typeof useDialog>]>;
 }
-import { RootContext } from '../modules/root-context.js';
 declare const RootContext: import("svelte").Component<DialogRootContextProps, {}, "">;
 type RootContext = ReturnType<typeof RootContext>;
 export default RootContext;

package/dist/components/dialog/anatomy/root-provider.svelte CHANGED Viewed

@@ -8,13 +8,13 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	const props: DialogRootProviderProps = $props();
 	const { children, value: dialog } = $derived(props);
-	RootContext.provide(() => dialog());
+	DialogRootContext.provide(() => dialog());
 </script>
 {@render children?.()}

package/dist/components/dialog/anatomy/root.svelte CHANGED Viewed

@@ -7,7 +7,7 @@
 <script lang="ts">
 	import { useDialog } from '../modules/provider.svelte';
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { splitProps } from '@zag-js/dialog';
 	const props: DialogRootProps = $props();
@@ -21,7 +21,7 @@
 		id: id,
 	}));
-	RootContext.provide(() => dialog());
+	DialogRootContext.provide(() => dialog());
 </script>
 {@render children?.()}

package/dist/components/dialog/anatomy/title.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogTitleProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/dialog/anatomy/trigger.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { DialogRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: DialogTriggerProps = $props();
-	const dialog = RootContext.consume();
+	const dialog = DialogRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/dialog/modules/provider.svelte.js CHANGED Viewed

@@ -1,7 +1,12 @@
+import { LocaleProviderRootContext } from '../../locale-provider/modules/root-context.js';
 import { connect, machine } from '@zag-js/dialog';
 import { normalizeProps, useMachine } from '@zag-js/svelte';
 export function useDialog(props) {
-    const service = useMachine(machine, props);
+    const locale = LocaleProviderRootContext.consume();
+    const service = useMachine(machine, () => ({
+        dir: locale().dir,
+        ...(typeof props === 'function' ? props() : props),
+    }));
     const dialog = $derived(connect(service, normalizeProps));
     return () => dialog;
 }

package/dist/components/dialog/modules/root-context.js CHANGED Viewed

@@ -1,2 +1,2 @@
 import { createContext } from '../../../internal/create-context.js';
-export const RootContext = createContext();
+export const DialogRootContext = createContext();

package/dist/components/file-upload/anatomy/clear-trigger.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadClearTriggerProps = $props();
-	const fileUpload = RootContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/dropzone.svelte CHANGED Viewed

@@ -7,12 +7,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadDropzoneProps = $props();
-	const fileUpload = RootContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/hidden-input.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadHiddenInputProps = $props();
-	const fileUpload = RootContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
 	const { element, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/item-delete-trigger.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { ItemContext } from '../modules/item-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadItemContext } from '../modules/item-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadItemDeleteTriggerProps = $props();
-	const fileUpload = RootContext.consume();
-	const itemProps = ItemContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
+	const itemProps = FileUploadItemContext.consume();
 	const { element, children = times, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/item-group.svelte CHANGED Viewed

@@ -6,12 +6,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadItemGroupProps = $props();
-	const fileUpload = RootContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/item-name.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { ItemContext } from '../modules/item-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadItemContext } from '../modules/item-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadItemNameProps = $props();
-	const fileUpload = RootContext.consume();
-	const itemProps = ItemContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
+	const itemProps = FileUploadItemContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/item-size-text.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { ItemContext } from '../modules/item-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadItemContext } from '../modules/item-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadItemSizeTextProps = $props();
-	const fileUpload = RootContext.consume();
-	const itemProps = ItemContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
+	const itemProps = FileUploadItemContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/file-upload/anatomy/item.svelte CHANGED Viewed

@@ -8,20 +8,20 @@
 </script>
 <script lang="ts">
-	import { ItemContext } from '../modules/item-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { FileUploadItemContext } from '../modules/item-context.js';
+	import { FileUploadRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: FileUploadItemProps = $props();
-	const fileUpload = RootContext.consume();
+	const fileUpload = FileUploadRootContext.consume();
 	const [itemProps, componentProps] = $derived(splitItemProps(props));
 	const { element, children, ...rest } = $derived(componentProps);
 	const attributes = $derived(mergeProps(fileUpload().getItemProps(itemProps), rest));
-	ItemContext.provide(() => itemProps);
+	FileUploadItemContext.provide(() => itemProps);
 </script>
 {#if element}