@skeletonlabs/skeleton-svelte 4.7.1 → 4.7.2

package/dist/components/tabs/anatomy/content.svelte

@@ -8,7 +8,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 	import { splitContentProps } from '@zag-js/tabs';
 
@@ -19,15 +18,7 @@
 	const [contentProps, componentProps] = $derived(splitContentProps(props));
 	const { element, children, ...rest } = $derived(componentProps);
 
-	const attributes = $derived(
-		mergeProps(
-			tabs().getContentProps(contentProps),
-			{
-				class: classes.tabs.content,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tabs().getContentProps(contentProps), rest));
 </script>
 
 {#if element}

package/dist/components/tabs/anatomy/indicator.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TabsIndicatorProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tabs().getIndicatorProps(),
-			{
-				class: classes.tabs.indicator,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tabs().getIndicatorProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tabs/anatomy/list.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TabsListProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tabs().getListProps(),
-			{
-				class: classes.tabs.list,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tabs().getListProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tabs/anatomy/root-provider.svelte

@@ -10,21 +10,12 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TabsRootProviderProps = $props();
 	const { element, children, value: tabs, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tabs().getRootProps(),
-			{
-				class: classes.tabs.root,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tabs().getRootProps(), rest));
 
 	RootContext.provide(() => tabs());
 </script>

package/dist/components/tabs/anatomy/root.svelte

@@ -9,7 +9,6 @@
 <script lang="ts">
 	import { useTabs } from '../modules/provider.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 	import { splitProps } from '@zag-js/tabs';
 
@@ -23,15 +22,7 @@
 		id: id,
 	}));
 
-	const attributes = $derived(
-		mergeProps(
-			tabs().getRootProps(),
-			{
-				class: classes.tabs.root,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tabs().getRootProps(), rest));
 
 	RootContext.provide(() => tabs());
 </script>

package/dist/components/tabs/anatomy/trigger.svelte

@@ -8,7 +8,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 	import { splitTriggerProps } from '@zag-js/tabs';
 
@@ -19,15 +18,7 @@
 	const [triggerProps, componentProps] = $derived(splitTriggerProps(props));
 	const { element, children, ...rest } = $derived(componentProps);
 
-	const attributes = $derived(
-		mergeProps(
-			tabs().getTriggerProps(triggerProps),
-			{
-				class: classes.tabs.trigger,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tabs().getTriggerProps(triggerProps), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/clear-trigger.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputClearTriggerProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getClearTriggerProps(),
-			{
-				class: classes.tagsInput.clearTrigger,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getClearTriggerProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/control.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputControlProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getControlProps(),
-			{
-				class: classes.tagsInput.control,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getControlProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/hidden-input.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputHiddenInputProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getHiddenInputProps(),
-			{
-				class: classes.tagsInput.hiddenInput,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getHiddenInputProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/input.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputInputProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getInputProps(),
-			{
-				class: classes.tagsInput.input,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getInputProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/item-delete-trigger.svelte

@@ -8,7 +8,6 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputItemDeleteTriggerProps = $props();
@@ -18,15 +17,7 @@
 
 	const { element, children = times, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getItemDeleteTriggerProps(itemProps()),
-			{
-				class: classes.tagsInput.itemDeleteTrigger,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getItemDeleteTriggerProps(itemProps()), rest));
 </script>
 
 {#snippet times()}

package/dist/components/tags-input/anatomy/item-input.svelte

@@ -8,7 +8,6 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputItemInputProps = $props();
@@ -18,15 +17,7 @@
 
 	const { element, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getItemInputProps(itemProps()),
-			{
-				class: classes.tagsInput.itemInput,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getItemInputProps(itemProps()), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/item-preview.svelte

@@ -8,7 +8,6 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputItemPreviewProps = $props();
@@ -18,15 +17,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getItemPreviewProps(itemProps()),
-			{
-				class: classes.tagsInput.itemPreview,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getItemPreviewProps(itemProps()), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/item-text.svelte

@@ -8,7 +8,6 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputItemTextProps = $props();
@@ -18,15 +17,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getItemTextProps(itemProps()),
-			{
-				class: classes.tagsInput.itemText,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getItemTextProps(itemProps()), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/item.svelte

@@ -9,7 +9,6 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 	import { splitItemProps } from '@zag-js/tags-input';
 
@@ -20,15 +19,7 @@
 	const [itemProps, componentProps] = $derived(splitItemProps(props));
 	const { element, children, ...rest } = $derived(componentProps);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getItemProps(itemProps),
-			{
-				class: classes.tagsInput.item,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getItemProps(itemProps), rest));
 
 	ItemContext.provide(() => itemProps);
 </script>

package/dist/components/tags-input/anatomy/label.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputLabelProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getLabelProps(),
-			{
-				class: classes.tagsInput.label,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getLabelProps(), rest));
 </script>
 
 {#if element}

package/dist/components/tags-input/anatomy/root-provider.svelte

@@ -10,21 +10,12 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: TagsInputRootProviderProps = $props();
 	const { element, children, value: tagsInput, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getRootProps(),
-			{
-				class: classes.tagsInput.root,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getRootProps(), rest));
 
 	RootContext.provide(() => tagsInput());
 </script>

package/dist/components/tags-input/anatomy/root.svelte

@@ -9,7 +9,6 @@
 <script lang="ts">
 	import { useTagsInput } from '../modules/provider.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 	import { splitProps } from '@zag-js/tags-input';
 
@@ -23,15 +22,7 @@
 		id: id,
 	}));
 
-	const attributes = $derived(
-		mergeProps(
-			tagsInput().getRootProps(),
-			{
-				class: classes.tagsInput.root,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(tagsInput().getRootProps(), rest));
 
 	RootContext.provide(() => tagsInput());
 </script>

package/dist/components/toast/anatomy/action-trigger.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ToastActionTriggerProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			toast().getActionTriggerProps(),
-			{
-				class: classes.toast.actionTrigger,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toast().getActionTriggerProps(), rest));
 </script>
 
 {#if element}

package/dist/components/toast/anatomy/close-trigger.svelte

@@ -8,7 +8,6 @@
 <script lang="ts">
 	import X from '../../../internal/components/x.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ToastCloseTriggerProps = $props();
@@ -17,15 +16,7 @@
 
 	const { element, children = x, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			toast().getCloseTriggerProps(),
-			{
-				class: classes.toast.closeTrigger,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toast().getCloseTriggerProps(), rest));
 </script>
 
 {#snippet x()}

package/dist/components/toast/anatomy/description.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ToastDescriptionProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			toast().getDescriptionProps(),
-			{
-				class: classes.toast.description,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toast().getDescriptionProps(), rest));
 </script>
 
 {#if element}

package/dist/components/toast/anatomy/group.svelte

@@ -12,7 +12,6 @@
 
 <script lang="ts">
 	import { GroupContext } from '../modules/group-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps, normalizeProps, useMachine } from '@zag-js/svelte';
 	import { group } from '@zag-js/toast';
 
@@ -27,15 +26,7 @@
 	}));
 	const api = $derived(group.connect(service, normalizeProps));
 
-	const attributes = $derived(
-		mergeProps(
-			api.getGroupProps(),
-			{
-				class: classes.toast.group,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(api.getGroupProps(), rest));
 
 	GroupContext.provide(() => service);
 </script>

package/dist/components/toast/anatomy/message.svelte

@@ -6,7 +6,6 @@
 </script>
 
 <script lang="ts">
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ToastMessageProps = $props();
@@ -16,7 +15,8 @@
 	const attributes = $derived(
 		mergeProps(
 			{
-				class: classes.toast.message,
+				'data-scope': 'toast',
+				'data-part': 'message',
 			},
 			rest,
 		),

package/dist/components/toast/anatomy/root.svelte

@@ -11,7 +11,6 @@
 <script lang="ts">
 	import { GroupContext } from '../modules/group-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps, normalizeProps, useMachine } from '@zag-js/svelte';
 	import { connect, machine } from '@zag-js/toast';
 
@@ -27,15 +26,7 @@
 	}));
 	const toast = $derived(connect(service, normalizeProps));
 
-	const attributes = $derived(
-		mergeProps(
-			toast.getRootProps(),
-			{
-				class: classes.toast.root,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toast.getRootProps(), rest));
 
 	RootContext.provide(() => toast);
 </script>

package/dist/components/toast/anatomy/title.svelte

@@ -7,7 +7,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ToastTitleProps = $props();
@@ -16,15 +15,7 @@
 
 	const { element, children, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			toast().getTitleProps(),
-			{
-				class: classes.toast.title,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toast().getTitleProps(), rest));
 </script>
 
 {#if element}

package/dist/components/toggle-group/anatomy/item.svelte

@@ -8,7 +8,6 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 	import { splitItemProps } from '@zag-js/toggle-group';
 
@@ -19,15 +18,7 @@
 	const [itemProps, componentProps] = $derived(splitItemProps(props));
 	const { element, children, ...rest } = $derived(componentProps);
 
-	const attributes = $derived(
-		mergeProps(
-			toggleGroup().getItemProps(itemProps),
-			{
-				class: classes.toggleGroup.item,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toggleGroup().getItemProps(itemProps), rest));
 </script>
 
 {#if element}

package/dist/components/toggle-group/anatomy/root-provider.svelte

@@ -10,22 +10,13 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ToggleGroupRootProviderProps = $props();
 
 	const { element, children, value: toggleGroup, ...rest } = $derived(props);
 
-	const attributes = $derived(
-		mergeProps(
-			toggleGroup().getRootProps(),
-			{
-				class: classes.toggleGroup.root,
-			},
-			rest,
-		),
-	);
+	const attributes = $derived(mergeProps(toggleGroup().getRootProps(), rest));
 
 	RootContext.provide(() => toggleGroup());
 </script>