@skeletonlabs/skeleton-svelte 1.5.1 → 2.0.0-next.1

package/dist/components/Toast/Toaster.svelte

@@ -1,72 +0,0 @@
-<script lang="ts">
-	import { normalizeProps, useMachine } from '@zag-js/svelte';
-	import * as toast from '@zag-js/toast';
-	import Toast from './Toast.svelte';
-	import type { ToasterProps } from './types.js';
-
-	const {
-		// Toaster
-		toaster,
-		// Toast
-		base = 'flex justify-between items-center gap-3',
-		width = 'min-w-xs',
-		padding = 'p-3',
-		rounded = 'rounded-container',
-		classes = '',
-		// Message
-		messageBase = 'grid',
-		messageClasses = '',
-		// Title
-		titleBase = 'font-semibold',
-		titleClasses = '',
-		// Description
-		descriptionBase = 'text-sm',
-		descriptionClasses = '',
-		// Dismiss Button
-		btnDismissBase = 'btn-icon hover:preset-tonal',
-		btnDismissClasses = '',
-		btnDismissTitle = 'Dismiss',
-		btnDismissAriaLabel = 'Dismiss',
-		// State
-		stateInfo = 'preset-outlined-surface-200-800 preset-filled-surface-50-950',
-		stateSuccess = 'preset-filled-success-500',
-		stateWarning = 'preset-filled-warning-500',
-		stateError = 'preset-filled-error-500'
-	}: ToasterProps = $props();
-
-	const id = $props.id();
-	const service = useMachine(toast.group.machine, () => ({
-		id: id,
-		store: toaster
-	}));
-	const api = $derived(toast.group.connect(service, normalizeProps));
-</script>
-
-<div {...api.getGroupProps()} data-testid="toaster-root">
-	{#each api.getToasts() as toast, index (toast.id)}
-		<Toast
-			{base}
-			{width}
-			{padding}
-			{rounded}
-			{classes}
-			{messageBase}
-			{messageClasses}
-			{titleBase}
-			{titleClasses}
-			{descriptionBase}
-			{descriptionClasses}
-			{btnDismissBase}
-			{btnDismissClasses}
-			{btnDismissTitle}
-			{btnDismissAriaLabel}
-			{stateInfo}
-			{stateError}
-			{stateWarning}
-			{stateSuccess}
-			{toast}
-			{index}
-			parent={service}
-		></Toast>
-	{/each}
-</div>

package/dist/components/Toast/Toaster.svelte.d.ts

@@ -1,4 +0,0 @@
-import type { ToasterProps } from './types.js';
-declare const Toaster: import("svelte").Component<ToasterProps, {}, "">;
-type Toaster = ReturnType<typeof Toaster>;
-export default Toaster;

package/dist/components/Toast/create-toaster.d.ts

@@ -1,2 +0,0 @@
-import * as toast from '@zag-js/toast';
-export declare function createToaster(options?: toast.StoreProps): toast.Store<any>;

package/dist/components/Toast/create-toaster.js

@@ -1,4 +0,0 @@
-import * as toast from '@zag-js/toast';
-export function createToaster(options = {}) {
-    return toast.createStore(options);
-}

package/dist/components/Toast/types.d.ts

@@ -1,47 +0,0 @@
-import * as toast from '@zag-js/toast';
-export interface ToasterProps extends toast.StoreProps {
-    toaster: toast.Store;
-    /** Provide base classes for the root element. */
-    base?: string;
-    /** Provide width classes for the root element. */
-    width?: string;
-    /** Provide padding classes for the root element. */
-    padding?: string;
-    /** Provide border radius classes for the root element. */
-    rounded?: string;
-    /** Provide arbitrary classes for the toast cards. */
-    classes?: string;
-    /** Provide base classes for the message. */
-    messageBase?: string;
-    /** Provide classes for the message. */
-    messageClasses?: string;
-    /** Provide base classes for the title. */
-    titleBase?: string;
-    /** Provide classes for the title. */
-    titleClasses?: string;
-    /** Provide base classes for the description. */
-    descriptionBase?: string;
-    /** Provide classes for the description. */
-    descriptionClasses?: string;
-    /** Provide base classes for the dismiss button. */
-    btnDismissBase?: string;
-    /** Provide arbitrary classes for the dismiss button. */
-    btnDismissClasses?: string;
-    /** Provide the title attribute for the dismiss button. */
-    btnDismissTitle?: string;
-    /** Provide the aria-label attribute for the dismiss button. */
-    btnDismissAriaLabel?: string;
-    /** Provide base classes for info toasts. */
-    stateInfo?: string;
-    /** Provide base classes for success toasts. */
-    stateSuccess?: string;
-    /** Provide base classes for warning toasts. */
-    stateWarning?: string;
-    /** Provide base classes for error toasts. */
-    stateError?: string;
-}
-export interface ToastProps extends Omit<ToasterProps, 'toaster'> {
-    toast: toast.Options;
-    index: number;
-    parent: toast.GroupService;
-}

package/dist/components/Toast/types.js

@@ -1 +0,0 @@
-import * as toast from '@zag-js/toast';

package/dist/components/Tooltip/Tooltip.svelte

@@ -1,78 +0,0 @@
-<script lang="ts">
-	import { fade } from 'svelte/transition';
-
-	import * as tooltip from '@zag-js/tooltip';
-	import { useMachine, normalizeProps, mergeProps } from '@zag-js/svelte';
-	import type { TooltipProps } from './types.js';
-
-	const {
-		zIndex = 'auto',
-		// Arrow
-		arrow = false,
-		arrowBackground = 'var(--color-surface-950-50)',
-		arrowSize = '10px',
-		// Base
-		base = '',
-		classes = '',
-		// Trigger
-		triggerBase = '',
-		triggerBackground = '',
-		triggerClasses = '',
-		triggerAriaLabel = '',
-		// Positioner
-		positionerBase = '',
-		positionerClasses = '',
-		// Content
-		contentBase = '',
-		contentBackground = '',
-		contentClasses = '',
-		// Arrow
-		arrowBase = '',
-		// arrowBackground = '',
-		arrowClasses = '',
-		// Snippets
-		trigger,
-		content,
-		// Events
-		onmouseover,
-		onclick,
-		// Zag ---
-		...zagProps
-	}: TooltipProps = $props();
-
-	// Zag
-	const id = $props.id();
-	const service = useMachine(tooltip.machine, () => ({
-		id: id,
-		...zagProps
-	}));
-	const api = $derived(tooltip.connect(service, normalizeProps));
-	const triggerProps = $derived(mergeProps(api.getTriggerProps(), { onmouseover, onclick }));
-</script>
-
-<span class="{base} {classes}" data-testid="tooltip">
-	<!-- Snippet: Trigger -->
-	{#if trigger}
-		<button {...triggerProps} class="{triggerBase} {triggerBackground} {triggerClasses}" type="button" aria-label={triggerAriaLabel}>
-			{@render trigger()}
-		</button>
-	{/if}
-	<!-- Tooltip Content -->
-	<div {...api.getPositionerProps()} class="{positionerBase} {positionerClasses}">
-		<!-- Popover -->
-		{#if api.open}
-			<div {...api.getContentProps()} transition:fade={{ duration: 100 }} style="z-index: {zIndex};">
-				<!-- Arrow -->
-				{#if arrow}
-					<div {...api.getArrowProps()} style:--arrow-size={arrowSize}>
-						<div {...api.getArrowTipProps()} class="{arrowBase} {arrowClasses}" style:--arrow-background={arrowBackground}></div>
-					</div>
-				{/if}
-				<!-- Snippet Content -->
-				<div class="{contentBase} {contentBackground} {contentClasses}">
-					{@render content?.()}
-				</div>
-			</div>
-		{/if}
-	</div>
-</span>

package/dist/components/Tooltip/Tooltip.svelte.d.ts

@@ -1,4 +0,0 @@
-import type { TooltipProps } from './types.js';
-declare const Tooltip: import("svelte").Component<TooltipProps, {}, "">;
-type Tooltip = ReturnType<typeof Tooltip>;
-export default Tooltip;

package/dist/components/Tooltip/types.d.ts

@@ -1,47 +0,0 @@
-import type { Snippet } from 'svelte';
-import * as tooltip from '@zag-js/tooltip';
-import type { HTMLButtonAttributes } from 'svelte/elements';
-export interface TooltipProps extends Omit<tooltip.Props, 'id'> {
-    /** Set a positioner style for z-index, ex: "10" */
-    zIndex?: string;
-    /** Enable display of the popover arrow. */
-    arrow?: boolean;
-    /** Set a style value for --arrow-background, ex: "var(--color-surface-50-950)" */
-    arrowBackground?: string;
-    /** Set a style value for --arrow-size, ex: "10px" */
-    arrowSize?: string;
-    /** Set base classes for the root element. */
-    base?: string;
-    /** Provide arbitrary classes for the root element. */
-    classes?: string;
-    /** Set base styles for the trigger. */
-    triggerBase?: string;
-    /** Set background styles for the trigger. */
-    triggerBackground?: string;
-    /** Provide arbitrary styles for the trigger. */
-    triggerClasses?: string;
-    /** Set the aria-label for the trigger. */
-    triggerAriaLabel?: string;
-    /** Set base classes for the positioner. */
-    positionerBase?: string;
-    /** Provide arbitrary classes for the positioner. */
-    positionerClasses?: string;
-    /** Set base styles for the content. */
-    contentBase?: string;
-    /** Set background styles for the content. */
-    contentBackground?: string;
-    /** Provide arbitrary styles for the content. */
-    contentClasses?: string;
-    /** Set base classes for the arrow. */
-    arrowBase?: string;
-    /** Provide arbitrary classes for the arrow. */
-    arrowClasses?: string;
-    /** Provide the template contents inside the trigger button. */
-    trigger?: Snippet;
-    /** Provide the template contents of the tooltip itself. */
-    content?: Snippet;
-    /** Handle the tooltip button hover event. */
-    onmouseover?: HTMLButtonAttributes['onmouseover'];
-    /** Handle the tooltip button click event. */
-    onclick?: HTMLButtonAttributes['onclick'];
-}

package/dist/components/Tooltip/types.js

@@ -1 +0,0 @@
-import * as tooltip from '@zag-js/tooltip';

package/dist/composed/accordion/modules/types.js

@@ -1 +0,0 @@
-import * as accordion from '@zag-js/accordion';

package/dist/composed/index.d.ts

@@ -1,2 +0,0 @@
-export * from './accordion/index.js';
-export * from './avatar/index.js';

package/dist/composed/index.js

@@ -1,2 +0,0 @@
-export * from './accordion/index.js';
-export * from './avatar/index.js';