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/tooltip/anatomy/positioner.svelte CHANGED Viewed

@@ -6,13 +6,13 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { TooltipRootContext } from '../modules/root-context.js';
 	import { mergeProps, portal } from '@zag-js/svelte';
 	import { createAttachmentKey, fromAction } from 'svelte/attachments';
 	const props: TooltipPositionerProps = $props();
-	const tooltip = RootContext.consume();
+	const tooltip = TooltipRootContext.consume();
 	const { element, children, ...rest } = $derived(props);

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

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

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

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

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

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

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

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

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

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

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

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

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

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

package/dist/components/tree-view/anatomy/branch-content.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewBranchContentProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/branch-control.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewBranchControlProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/branch-indent-guide.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewBranchIndentGuideProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/branch-indicator.svelte CHANGED Viewed

@@ -7,14 +7,14 @@
 <script lang="ts">
 	import ChevronRight from '../../../internal/components/chevron-right.svelte';
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewBranchIndicatorProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children = chevronRight, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/branch-text.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewBranchTextProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/branch.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewBranchProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/item.svelte CHANGED Viewed

@@ -6,14 +6,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewItemProps = $props();
-	const treeView = RootContext.consume();
-	const nodeProps = NodeContext.consume();
+	const treeView = TreeViewRootContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/label.svelte CHANGED Viewed

@@ -13,12 +13,12 @@
 </script>
 <script lang="ts">
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewLabelProps = $props();
-	const treeView = RootContext.consume();
+	const treeView = TreeViewRootContext.consume();
 	const { level = 3, element, children, ...rest } = $derived(props);

package/dist/components/tree-view/anatomy/node-context.svelte CHANGED Viewed

@@ -8,11 +8,11 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
 	const props: TreeViewNodeContextProps = $props();
-	const nodeProps = NodeContext.consume();
+	const nodeProps = TreeViewNodeContext.consume();
 	const { children } = $derived(props);
 </script>

package/dist/components/tree-view/anatomy/node-context.svelte.d.ts CHANGED Viewed

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

package/dist/components/tree-view/anatomy/node-provider.svelte CHANGED Viewed

@@ -7,14 +7,14 @@
 </script>
 <script lang="ts">
-	import { NodeContext } from '../modules/node-context.js';
+	import { TreeViewNodeContext } from '../modules/node-context.js';
 	import type { NodeProps } from '@zag-js/tree-view';
 	const props: TreeViewNodeProviderProps = $props();
 	const { children, value: nodeProps } = $derived(props);
-	NodeContext.provide(() => nodeProps);
+	TreeViewNodeContext.provide(() => nodeProps);
 </script>
 {@render children?.()}

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

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

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

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

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

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { useTreeView } from '../modules/provider.svelte';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewRootProviderProps = $props();
@@ -18,7 +18,7 @@
 	const attributes = $derived(mergeProps(treeView().getRootProps(), rest));
-	RootContext.provide(() => treeView());
+	TreeViewRootContext.provide(() => treeView());
 </script>
 {#if element}

package/dist/components/tree-view/anatomy/root.svelte CHANGED Viewed

@@ -9,7 +9,7 @@
 <script lang="ts" generics="T extends TreeNode = TreeNode">
 	import { useTreeView } from '../modules/provider.svelte';
-	import { RootContext } from '../modules/root-context.js';
+	import { TreeViewRootContext } from '../modules/root-context.js';
 	import { mergeProps } from '@zag-js/svelte';
 	const props: TreeViewRootProps<T> = $props();
@@ -25,7 +25,7 @@
 	const attributes = $derived(mergeProps(treeView().getRootProps(), rest));
-	RootContext.provide(() => treeView());
+	TreeViewRootContext.provide(() => treeView());
 </script>
 {#if element}

package/dist/components/tree-view/anatomy/tree.svelte CHANGED Viewed

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

package/dist/components/tree-view/modules/node-context.d.ts CHANGED Viewed

@@ -1,6 +1,5 @@
 import type { NodeProps } from '@zag-js/tree-view';
-export declare const NodeContext: {
-    key: symbol;
+export declare const TreeViewNodeContext: {
     consume(): () => NodeProps;
-    provide(value: () => NodeProps): () => NodeProps;
+    provide: (context: () => NodeProps) => () => NodeProps;
 };

package/dist/components/tree-view/modules/node-context.js CHANGED Viewed

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

package/dist/components/tree-view/modules/provider.svelte.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 import { type PropTypes } from '@zag-js/svelte';
-import type { Api, Props } from '@zag-js/tree-view';
-export declare function useTreeView(props: Props | (() => Props)): () => Api<PropTypes>;
+import type { Api, Props, TreeNode } from '@zag-js/tree-view';
+export declare function useTreeView<T extends TreeNode = TreeNode>(props: Props<T> | (() => Props<T>)): () => Api<PropTypes>;

package/dist/components/tree-view/modules/provider.svelte.js CHANGED Viewed

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

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

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

package/dist/index.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ export * from './components/accordion/index.js';
 export * from './components/app-bar/index.js';
 export * from './components/avatar/index.js';
 export * from './components/carousel/index.js';
+export * from './components/marquee/index.js';
 export * from './components/collapsible/index.js';
 export * from './components/combobox/index.js';
 export * from './components/date-picker/index.js';
@@ -9,12 +10,14 @@ export * from './components/dialog/index.js';
 export * from './components/file-upload/index.js';
 export * from './components/floating-panel/index.js';
 export * from './components/listbox/index.js';
+export * from './components/locale-provider/index.js';
 export * from './components/menu/index.js';
 export * from './components/navigation/index.js';
 export * from './components/pagination/index.js';
 export * from './components/popover/index.js';
 export * from './components/portal/index.js';
 export * from './components/progress/index.js';
+export * from './components/qr-code/index.js';
 export * from './components/rating-group/index.js';
 export * from './components/segmented-control/index.js';
 export * from './components/slider/index.js';

package/dist/index.js CHANGED Viewed

@@ -2,6 +2,7 @@ export * from './components/accordion/index.js';
 export * from './components/app-bar/index.js';
 export * from './components/avatar/index.js';
 export * from './components/carousel/index.js';
+export * from './components/marquee/index.js';
 export * from './components/collapsible/index.js';
 export * from './components/combobox/index.js';
 export * from './components/date-picker/index.js';
@@ -9,12 +10,14 @@ export * from './components/dialog/index.js';
 export * from './components/file-upload/index.js';
 export * from './components/floating-panel/index.js';
 export * from './components/listbox/index.js';
+export * from './components/locale-provider/index.js';
 export * from './components/menu/index.js';
 export * from './components/navigation/index.js';
 export * from './components/pagination/index.js';
 export * from './components/popover/index.js';
 export * from './components/portal/index.js';
 export * from './components/progress/index.js';
+export * from './components/qr-code/index.js';
 export * from './components/rating-group/index.js';
 export * from './components/segmented-control/index.js';
 export * from './components/slider/index.js';

package/dist/internal/create-context.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 export declare function createContext<T>(defaultValue?: T): {
-    key: symbol;
     consume(): T;
-    provide(value: T): T;
+    provide: (context: T) => T;
 };

package/dist/internal/create-context.js CHANGED Viewed

@@ -1,13 +1,15 @@
-import { getContext, setContext } from 'svelte';
+import { createContext as createContextSvelte } from 'svelte';
 export function createContext(defaultValue) {
-    const key = Symbol();
+    const [consume, provide] = createContextSvelte();
     return {
-        key,
         consume() {
-            return getContext(key) || defaultValue;
-        },
-        provide(value) {
-            return setContext(key, value);
+            try {
+                return consume();
+            }
+            catch {
+                return defaultValue;
+            }
         },
+        provide,
     };
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@skeletonlabs/skeleton-svelte",
-  "version": "5.0.0-next.0",
+  "version": "5.0.0-next.10",
   "description": "The Svelte package for Skeleton.",
   "author": "endigo9740 <chris@skeletonlabs.dev>",
   "repository": {
@@ -21,38 +21,41 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@internationalized/date": "3.12.0",
-    "@zag-js/accordion": "1.39.1",
-    "@zag-js/avatar": "1.39.1",
-    "@zag-js/carousel": "1.39.1",
-    "@zag-js/collapsible": "1.39.1",
-    "@zag-js/collection": "1.39.1",
-    "@zag-js/combobox": "1.39.1",
-    "@zag-js/date-picker": "1.39.1",
-    "@zag-js/dialog": "1.39.1",
-    "@zag-js/file-upload": "1.39.1",
-    "@zag-js/floating-panel": "1.39.1",
-    "@zag-js/listbox": "1.39.1",
-    "@zag-js/menu": "1.39.1",
-    "@zag-js/pagination": "1.39.1",
-    "@zag-js/popover": "1.39.1",
-    "@zag-js/progress": "1.39.1",
-    "@zag-js/radio-group": "1.39.1",
-    "@zag-js/rating-group": "1.39.1",
-    "@zag-js/slider": "1.39.1",
-    "@zag-js/steps": "1.39.1",
-    "@zag-js/svelte": "1.39.1",
-    "@zag-js/switch": "1.39.1",
-    "@zag-js/tabs": "1.39.1",
-    "@zag-js/tags-input": "1.39.1",
-    "@zag-js/toast": "1.39.1",
-    "@zag-js/toggle-group": "1.39.1",
-    "@zag-js/tooltip": "1.39.1",
-    "@zag-js/tree-view": "1.39.1",
-    "@skeletonlabs/skeleton-common": "5.0.0-next.0"
+    "@internationalized/date": "3.12.1",
+    "@zag-js/accordion": "1.41.0",
+    "@zag-js/avatar": "1.41.0",
+    "@zag-js/carousel": "1.41.0",
+    "@zag-js/collapsible": "1.41.0",
+    "@zag-js/collection": "1.41.0",
+    "@zag-js/combobox": "1.41.0",
+    "@zag-js/date-picker": "1.41.0",
+    "@zag-js/dialog": "1.41.0",
+    "@zag-js/file-upload": "1.41.0",
+    "@zag-js/floating-panel": "1.41.0",
+    "@zag-js/i18n-utils": "1.41.0",
+    "@zag-js/listbox": "1.41.0",
+    "@zag-js/marquee": "1.41.0",
+    "@zag-js/menu": "1.41.0",
+    "@zag-js/pagination": "1.41.0",
+    "@zag-js/popover": "1.41.0",
+    "@zag-js/progress": "1.41.0",
+    "@zag-js/qr-code": "1.41.0",
+    "@zag-js/radio-group": "1.41.0",
+    "@zag-js/rating-group": "1.41.0",
+    "@zag-js/slider": "1.41.0",
+    "@zag-js/steps": "1.41.0",
+    "@zag-js/svelte": "1.41.0",
+    "@zag-js/switch": "1.41.0",
+    "@zag-js/tabs": "1.41.0",
+    "@zag-js/tags-input": "1.41.0",
+    "@zag-js/toast": "1.41.0",
+    "@zag-js/toggle-group": "1.41.0",
+    "@zag-js/tooltip": "1.41.0",
+    "@zag-js/tree-view": "1.41.0",
+    "@skeletonlabs/skeleton-common": "5.0.0-next.10"
   },
   "peerDependencies": {
-    "svelte": "^5.29.0"
+    "svelte": "^5.40.0"
   },
   "license": "MIT",
   "type": "module"