@skeletonlabs/skeleton-svelte 4.5.3 → 4.6.1

package/dist/components/date-picker/anatomy/control.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: DatePickerControlProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			datePicker().getControlProps(),
 			{
-				class: classesDatePicker.control,
+				class: classes.datePicker.control,
 			},
 			rest,
 		),

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

@@ -8,7 +8,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 { splitInputProps } from '@zag-js/date-picker';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -23,7 +23,7 @@
 		mergeProps(
 			datePicker().getInputProps(inputProps),
 			{
-				class: classesDatePicker.input,
+				class: classes.datePicker.input,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/label.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: DatePickerLabelProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			datePicker().getLabelProps(),
 			{
-				class: classesDatePicker.label,
+				class: classes.datePicker.label,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/month-select.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: DatePickerMonthSelectProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			datePicker().getMonthSelectProps(),
 			{
-				class: classesDatePicker.monthSelect,
+				class: classes.datePicker.monthSelect,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/next-trigger.svelte

@@ -9,7 +9,7 @@
 	import ChevronRightIcon from '../../../internal/components/chevron-right.svelte';
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerNextTriggerProps = $props();
@@ -23,7 +23,7 @@
 		mergeProps(
 			datePicker().getNextTriggerProps(viewProps()),
 			{
-				class: classesDatePicker.nextTrigger,
+				class: classes.datePicker.nextTrigger,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/positioner.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: DatePickerPositionerProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			datePicker().getPositionerProps(),
 			{
-				class: classesDatePicker.positioner,
+				class: classes.datePicker.positioner,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/preset-trigger.svelte

@@ -8,7 +8,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 { splitPresetTriggerProps } from '@zag-js/date-picker';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -23,7 +23,7 @@
 		mergeProps(
 			datePicker().getPresetTriggerProps(presetTriggerProps),
 			{
-				class: classesDatePicker.presetTrigger,
+				class: classes.datePicker.presetTrigger,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/prev-trigger.svelte

@@ -9,7 +9,7 @@
 	import ChevronLeftIcon from '../../../internal/components/chevron-left.svelte';
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerPrevTriggerProps = $props();
@@ -23,7 +23,7 @@
 		mergeProps(
 			datePicker().getPrevTriggerProps(viewProps()),
 			{
-				class: classesDatePicker.prevTrigger,
+				class: classes.datePicker.prevTrigger,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/range-text.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: DatePickerRangeTextProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getRangeTextProps(),
 			{
-				class: classesDatePicker.rangeText,
+				class: classes.datePicker.rangeText,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/root-provider.svelte

@@ -10,7 +10,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: DatePickerRootProviderProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			datePicker().getRootProps(),
 			{
-				class: classesDatePicker.root,
+				class: classes.datePicker.root,
 			},
 			rest,
 		),

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

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

package/dist/components/date-picker/anatomy/table-body.svelte

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerTableBodyProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getTableBodyProps(viewProps()),
 			{
-				class: classesDatePicker.tableBody,
+				class: classes.datePicker.tableBody,
 			},
 			rest,
 		),

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

@@ -9,7 +9,7 @@
 	import { RootContext } from '../modules/root-context.js';
 	import { TableCellContext } from '../modules/table-cell-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerTableCellTriggerProps = $props();
@@ -33,7 +33,7 @@
 		mergeProps(
 			refinedTableCellProps,
 			{
-				class: classesDatePicker.tableCellTrigger,
+				class: classes.datePicker.tableCellTrigger,
 			},
 			rest,
 		),

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

@@ -14,7 +14,7 @@
 	import { RootContext } from '../modules/root-context.js';
 	import { TableCellContext } from '../modules/table-cell-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitTableCellProps } from '@zag-js/date-picker';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -44,7 +44,7 @@
 		mergeProps(
 			refinedTableCellProps,
 			{
-				class: classesDatePicker.tableCell,
+				class: classes.datePicker.tableCell,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerTableHeadProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getTableHeadProps(viewProps()),
 			{
-				class: classesDatePicker.tableHead,
+				class: classes.datePicker.tableHead,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerTableHeaderProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getTableHeaderProps(viewProps()),
 			{
-				class: classesDatePicker.tableHeader,
+				class: classes.datePicker.tableHeader,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerTableRowProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getTableRowProps(viewProps()),
 			{
-				class: classesDatePicker.tableRow,
+				class: classes.datePicker.tableRow,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerTableProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getTableProps(viewProps()),
 			{
-				class: classesDatePicker.table,
+				class: classes.datePicker.table,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import CalendarIcon from '../../../internal/components/calendar.svelte';
 	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: DatePickerTriggerProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			datePicker().getTriggerProps(),
 			{
-				class: classesDatePicker.trigger,
+				class: classes.datePicker.trigger,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerViewControlProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getViewControlProps(viewProps()),
 			{
-				class: classesDatePicker.viewControl,
+				class: classes.datePicker.viewControl,
 			},
 			rest,
 		),

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

@@ -8,7 +8,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: DatePickerViewTriggerProps = $props();
@@ -22,7 +22,7 @@
 		mergeProps(
 			datePicker().getViewTriggerProps(viewProps()),
 			{
-				class: classesDatePicker.viewTrigger,
+				class: classes.datePicker.viewTrigger,
 			},
 			rest,
 		),

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

@@ -9,7 +9,7 @@
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
 	import { ViewContext } from '../modules/view-context.js';
-	import { classesDatePicker } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { splitViewProps } from '@zag-js/date-picker';
 	import { mergeProps } from '@zag-js/svelte';
 
@@ -24,7 +24,7 @@
 		mergeProps(
 			datePicker().getViewProps(viewProps),
 			{
-				class: classesDatePicker.view,
+				class: classes.datePicker.view,
 			},
 			rest,
 		),

package/dist/components/date-picker/anatomy/year-select.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: DatePickerYearSelectProps = $props();
@@ -20,7 +20,7 @@
 		mergeProps(
 			datePicker().getYearSelectProps(),
 			{
-				class: classesDatePicker.yearSelect,
+				class: classes.datePicker.yearSelect,
 			},
 			rest,
 		),

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@@ -0,0 +1,36 @@
+<script lang="ts" module>
+	import type { HTMLAttributes } from '../../../internal/html-attributes.js';
+	import type { PropsWithElement } from '../../../internal/props-with-element.js';
+
+	export interface FileUploadClearTriggerProps extends PropsWithElement<'button'>, HTMLAttributes<'button'> {}
+</script>
+
+<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: FileUploadClearTriggerProps = $props();
+
+	const fileUpload = RootContext.consume();
+
+	const { element, children, ...rest } = $derived(props);
+
+	const attributes = $derived(
+		mergeProps(
+			fileUpload().getClearTriggerProps(),
+			{
+				class: classes.fileUpload.clearTrigger,
+			},
+			rest,
+		),
+	);
+</script>
+
+{#if element}
+	{@render element(attributes)}
+{:else}
+	<button {...attributes}>
+		{@render children?.()}
+	</button>
+{/if}

package/dist/components/file-upload/anatomy/clear-trigger.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { HTMLAttributes } from '../../../internal/html-attributes.js';
+import type { PropsWithElement } from '../../../internal/props-with-element.js';
+export interface FileUploadClearTriggerProps extends PropsWithElement<'button'>, HTMLAttributes<'button'> {
+}
+declare const ClearTrigger: import("svelte").Component<FileUploadClearTriggerProps, {}, "">;
+type ClearTrigger = ReturnType<typeof ClearTrigger>;
+export default ClearTrigger;

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

@@ -8,7 +8,7 @@
 
 <script lang="ts">
 	import { RootContext } from '../modules/root-context.js';
-	import { classesFileUpload } from '@skeletonlabs/skeleton-common';
+	import * as classes from '@skeletonlabs/skeleton-common/classes';
 	import { mergeProps } from '@zag-js/svelte';
 
 	const props: FileUploadDropzoneProps = $props();
@@ -21,7 +21,7 @@
 		mergeProps(
 			fileUpload().getDropzoneProps(props),
 			{
-				class: classesFileUpload.dropzone,
+				class: classes.fileUpload.dropzone,
 			},
 			rest,
 		),

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

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