@skeletonlabs/skeleton-svelte 4.6.0 → 4.7.0

package/dist/components/accordion/anatomy/item-content.svelte

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAccordion } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AccordionItemContentProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			accordion().getItemContentProps(itemProps()),
 			{
-				class: classesAccordion.itemContent,
+				class: classes.accordion.itemContent,
 			},
 			rest,
 		),

package/dist/components/accordion/anatomy/item-indicator.svelte

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAccordion } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AccordionItemIndicatorProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			accordion().getItemIndicatorProps(itemProps()),
 			{
-				class: classesAccordion.itemIndicator,
+				class: classes.accordion.itemIndicator,
 			},
 			rest,
 		),

package/dist/components/accordion/anatomy/item-trigger.svelte

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAccordion } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AccordionItemTriggerProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			accordion().getItemTriggerProps(itemProps()),
 			{
-				class: classesAccordion.itemTrigger,
+				class: classes.accordion.itemTrigger,
 			},
 			rest,
 		),

package/dist/components/accordion/anatomy/item.svelte

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAccordion } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitItemProps } from '@zag-js/accordion';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -24,7 +24,7 @@
 		mergeProps(
 			accordion().getItemProps(itemProps),
 			{
-				class: classesAccordion.item,
+				class: classes.accordion.item,
 			},
 			rest,
 		),

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

@@ -10,7 +10,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAccordion } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AccordionRootProviderProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			accordion().getRootProps(),
 			{
-				class: classesAccordion.root,
+				class: classes.accordion.root,
 			},
 			rest,
 		),

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

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { useAccordion } from '../modules/provider.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAccordion } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitProps } from '@zag-js/accordion';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -28,7 +28,7 @@
 		mergeProps(
 			accordion().getRootProps(),
 			{
-				class: classesAccordion.root,
+				class: classes.accordion.root,
 			},
 			rest,
 		),

package/dist/components/app-bar/anatomy/headline.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <script lang="ts">
-	import { classesAppBar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AppBarHeadlineProps = $props();
@@ -16,7 +16,7 @@
 	const attributes = $derived(
 		mergeProps(
 			{
-				class: classesAppBar.headline,
+				class: classes.appBar.headline,
 			},
 			rest,
 		),

package/dist/components/app-bar/anatomy/lead.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <script lang="ts">
-	import { classesAppBar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AppBarLeadProps = $props();
@@ -16,7 +16,7 @@
 	const attributes = $derived(
 		mergeProps(
 			{
-				class: classesAppBar.lead,
+				class: classes.appBar.lead,
 			},
 			rest,
 		),

package/dist/components/app-bar/anatomy/root.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <script lang="ts">
-	import { classesAppBar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AppBarRootProps = $props();
@@ -16,7 +16,7 @@
 	const attributes = $derived(
 		mergeProps(
 			{
-				class: classesAppBar.root,
+				class: classes.appBar.root,
 			},
 			rest,
 		),

package/dist/components/app-bar/anatomy/toolbar.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <script lang="ts">
-	import { classesAppBar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AppBarToolbarProps = $props();
@@ -16,7 +16,7 @@
 	const attributes = $derived(
 		mergeProps(
 			{
-				class: classesAppBar.toolbar,
+				class: classes.appBar.toolbar,
 			},
 			rest,
 		),

package/dist/components/app-bar/anatomy/trail.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <script lang="ts">
-	import { classesAppBar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AppBarTrailProps = $props();
@@ -16,7 +16,7 @@
 	const attributes = $derived(
 		mergeProps(
 			{
-				class: classesAppBar.trail,
+				class: classes.appBar.trail,
 			},
 			rest,
 		),

package/dist/components/avatar/anatomy/fallback.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAvatar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AvatarFallbackProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			avatar().getFallbackProps(),
 			{
-				class: classesAvatar.fallback,
+				class: classes.avatar.fallback,
 			},
 			rest,
 		),

package/dist/components/avatar/anatomy/image.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAvatar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AvatarImageProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			avatar().getImageProps(),
 			{
-				class: classesAvatar.image,
+				class: classes.avatar.image,
 			},
 			rest,
 		),

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

@@ -10,7 +10,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAvatar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: AvatarRootProviderProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			avatar().getRootProps(),
 			{
-				class: classesAvatar.root,
+				class: classes.avatar.root,
 			},
 			rest,
 		),

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

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { useAvatar } from '../modules/provider.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesAvatar } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitProps } from '@zag-js/avatar';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -28,7 +28,7 @@
 		mergeProps(
 			avatar().getRootProps(),
 			{
-				class: classesAvatar.root,
+				class: classes.avatar.root,
 			},
 			rest,
 		),

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

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCollapsible } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: CollapsibleContentProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			collapsible().getContentProps(),
 			{
-				class: classesCollapsible.content,
+				class: classes.collapsible.content,
 			},
 			rest,
 		),

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

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCollapsible } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: CollapsibleIndicatorProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			collapsible().getIndicatorProps(),
 			{
-				class: classesCollapsible.indicator,
+				class: classes.collapsible.indicator,
 			},
 			rest,
 		),

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

@@ -10,7 +10,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCollapsible } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: CollapsibleRootProviderProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			collapsible().getRootProps(),
 			{
-				class: classesCollapsible.root,
+				class: classes.collapsible.root,
 			},
 			rest,
 		),

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

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { useCollapsible } from '../modules/provider.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCollapsible } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitProps } from '@zag-js/collapsible';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -28,7 +28,7 @@
 		mergeProps(
 			collapsible().getRootProps(),
 			{
-				class: classesCollapsible.root,
+				class: classes.collapsible.root,
 			},
 			rest,
 		),

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

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCollapsible } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: CollapsibleTriggerProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			collapsible().getTriggerProps(),
 			{
-				class: classesCollapsible.trigger,
+				class: classes.collapsible.trigger,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/clear-trigger.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxClearTriggerProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			combobox().getClearTriggerProps(),
 			{
-				class: classesCombobox.clearTrigger,
+				class: classes.combobox.clearTrigger,
 			},
 			rest,
 		),

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

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxContentProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			combobox().getContentProps(),
 			{
-				class: classesCombobox.content,
+				class: classes.combobox.content,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/control.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxControlProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			combobox().getControlProps(),
 			{
-				class: classesCombobox.control,
+				class: classes.combobox.control,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/input.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxInputProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			combobox().getInputProps(),
 			{
-				class: classesCombobox.input,
+				class: classes.combobox.input,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/item-group-label.svelte

@@ -11,7 +11,7 @@
 <script lang="ts">
 	import { ItemGroupContext } from '../modules/item-group-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { type ItemGroupLabelProps, splitItemGroupLabelProps } from '@zag-js/combobox';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -32,7 +32,7 @@
 		mergeProps(
 			combobox().getItemGroupLabelProps(itemGroupLabelProps),
 			{
-				class: classesCombobox.itemGroupLabel,
+				class: classes.combobox.itemGroupLabel,
 			},
 			rest,
 		),

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

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { ItemGroupContext } from '../modules/item-group-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitItemGroupProps } from '@zag-js/combobox';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -30,7 +30,7 @@
 		mergeProps(
 			combobox().getItemGroupProps(itemGroupProps),
 			{
-				class: classesCombobox.itemGroup,
+				class: classes.combobox.itemGroup,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/item-indicator.svelte

@@ -9,7 +9,7 @@
 	import Check from '../../../internal/components/check.svelte';
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxItemIndicatorProps = $props();
@@ -23,7 +23,7 @@
 		mergeProps(
 			combobox().getItemIndicatorProps(itemProps()),
 			{
-				class: classesCombobox.itemIndicator,
+				class: classes.combobox.itemIndicator,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/item-text.svelte

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxItemTextProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			combobox().getItemTextProps(itemProps()),
 			{
-				class: classesCombobox.itemText,
+				class: classes.combobox.itemText,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/item.svelte

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { ItemContext } from '../modules/item-context.js';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitItemProps } from '@zag-js/combobox';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -24,7 +24,7 @@
 		mergeProps(
 			combobox().getItemProps(itemProps),
 			{
-				class: classesCombobox.item,
+				class: classes.combobox.item,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/label.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxLabelProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			combobox().getLabelProps(),
 			{
-				class: classesCombobox.label,
+				class: classes.combobox.label,
 			},
 			rest,
 		),

package/dist/components/combobox/anatomy/positioner.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxPositionerProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			combobox().getPositionerProps(),
 			{
-				class: classesCombobox.positioner,
+				class: classes.combobox.positioner,
 			},
 			rest,
 		),

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

@@ -10,7 +10,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxRootProviderProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			combobox().getRootProps(),
 			{
-				class: classesCombobox.root,
+				class: classes.combobox.root,
 			},
 			rest,
 		),

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

@@ -12,7 +12,7 @@
 <script lang="ts">
 	import { useCombobox } from '../modules/provider.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitProps } from '@zag-js/combobox';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -30,7 +30,7 @@
 		mergeProps(
 			combobox().getRootProps(),
 			{
-				class: classesCombobox.root,
+				class: classes.combobox.root,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import ChevronDownIcon from '../../../internal/components/chevron-down.svelte';
 	import { RootContext } from '../modules/root-context.js';
-	import { classesCombobox } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: ComboboxTriggerProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			combobox().getTriggerProps(),
 			{
-				class: classesCombobox.trigger,
+				class: classes.combobox.trigger,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/content.svelte

@@ -7,7 +7,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerContentProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			datePicker().getContentProps(),
 			{
-				class: classesDatePicker.content,
+				class: classes.datePicker.content,
 			},
 			rest,
 		),