@sprawlify/svelte 0.0.47 → 0.0.49

package/dist/components/steps/steps-root-provider.svelte

@@ -0,0 +1,24 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseStepsReturn } from './use-steps.svelte'
+
+  export interface StepsRootProviderBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+    value: UseStepsReturn
+  }
+  export interface StepsRootProviderProps extends Assign<HTMLProps<'div'>, StepsRootProviderBaseProps> {}
+</script>
+
+<!-- svelte-ignore state_referenced_locally -->
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { StepsProvider } from './use-steps-context'
+
+  let { ref = $bindable(null), value, ...props }: StepsRootProviderProps = $props()
+
+  const mergedProps = $derived(mergeProps(value().getRootProps(), props))
+
+  StepsProvider(value)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/steps/steps-root-provider.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseStepsReturn } from './use-steps.svelte';
+export interface StepsRootProviderBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+    value: UseStepsReturn;
+}
+export interface StepsRootProviderProps extends Assign<HTMLProps<'div'>, StepsRootProviderBaseProps> {
+}
+declare const StepsRootProvider: import("svelte").Component<StepsRootProviderProps, {}, "ref">;
+type StepsRootProvider = ReturnType<typeof StepsRootProvider>;
+export default StepsRootProvider;

package/dist/components/steps/steps-root.svelte

@@ -0,0 +1,49 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseStepsProps } from './use-steps.svelte'
+
+  export interface StepsRootBaseProps extends UseStepsProps, PolymorphicProps<'div'>, RefAttribute {}
+  export interface StepsRootProps extends Assign<HTMLProps<'div'>, StepsRootBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useSteps } from './use-steps.svelte'
+  import { StepsProvider } from './use-steps-context'
+
+  let { ref = $bindable(null), step = $bindable(), ...props }: StepsRootProps = $props()
+  const providedId = $props.id()
+
+  const [useStepsProps, localProps] = $derived(
+    createSplitProps<UseStepsProps>()(props, [
+      'defaultStep',
+      'id',
+      'ids',
+      'count',
+      'linear',
+      'onStepChange',
+      'onStepComplete',
+      'orientation',
+      'step',
+    ]),
+  )
+
+  const resolvedProps = $derived<UseStepsProps>({
+    ...useStepsProps,
+    id: useStepsProps.id ?? providedId,
+    step,
+    onStepChange(details) {
+      useStepsProps.onStepChange?.(details)
+      if (step !== undefined) step = details.step
+    },
+  })
+
+  const stepsApi = useSteps(() => resolvedProps)
+  const mergedProps = $derived(mergeProps(stepsApi().getRootProps(), localProps))
+
+  StepsProvider(stepsApi)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/steps/steps-root.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseStepsProps } from './use-steps.svelte';
+export interface StepsRootBaseProps extends UseStepsProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface StepsRootProps extends Assign<HTMLProps<'div'>, StepsRootBaseProps> {
+}
+declare const StepsRoot: import("svelte").Component<StepsRootProps, {}, "ref" | "step">;
+type StepsRoot = ReturnType<typeof StepsRoot>;
+export default StepsRoot;

package/dist/components/steps/steps-separator.svelte

@@ -0,0 +1,21 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface StepsSeparatorBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface StepsSeparatorProps extends Assign<HTMLProps<'div'>, StepsSeparatorBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useStepsContext } from './use-steps-context'
+  import { useStepsItemPropsContext } from './use-steps-item-props-context'
+
+  let { ref = $bindable(null), ...props }: StepsSeparatorProps = $props()
+
+  const steps = useStepsContext()
+  const itemProps = useStepsItemPropsContext()
+  const mergedProps = $derived(mergeProps(steps().getSeparatorProps(itemProps()), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/steps/steps-separator.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface StepsSeparatorBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface StepsSeparatorProps extends Assign<HTMLProps<'div'>, StepsSeparatorBaseProps> {
+}
+declare const StepsSeparator: import("svelte").Component<StepsSeparatorProps, {}, "ref">;
+type StepsSeparator = ReturnType<typeof StepsSeparator>;
+export default StepsSeparator;

package/dist/components/steps/steps-trigger.svelte

@@ -0,0 +1,21 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface StepsTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
+  export interface StepsTriggerProps extends Assign<HTMLProps<'button'>, StepsTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useStepsContext } from './use-steps-context'
+  import { useStepsItemPropsContext } from './use-steps-item-props-context'
+
+  let { ref = $bindable(null), ...props }: StepsTriggerProps = $props()
+
+  const steps = useStepsContext()
+  const itemProps = useStepsItemPropsContext()
+  const mergedProps = $derived(mergeProps(steps().getTriggerProps(itemProps()), props))
+</script>
+
+<Sprawlify as="button" bind:ref {...mergedProps} />

package/dist/components/steps/steps-trigger.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface StepsTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
+}
+export interface StepsTriggerProps extends Assign<HTMLProps<'button'>, StepsTriggerBaseProps> {
+}
+declare const StepsTrigger: import("svelte").Component<StepsTriggerProps, {}, "ref">;
+type StepsTrigger = ReturnType<typeof StepsTrigger>;
+export default StepsTrigger;

package/dist/components/steps/steps.d.ts

@@ -0,0 +1,15 @@
+export type { StepChangeDetails } from '@sprawlify/primitives/machines/steps';
+export { default as CompletedContent, type StepsCompletedContentBaseProps as CompletedContentBaseProps, type StepsCompletedContentProps as CompletedContentProps, } from './steps-completed-content.svelte';
+export { default as Content, type StepsContentBaseProps as ContentBaseProps, type StepsContentProps as ContentProps, } from './steps-content.svelte';
+export { default as Context, type StepsContextProps as ContextProps } from './steps-context.svelte';
+export { default as Indicator, type StepsIndicatorBaseProps as IndicatorBaseProps, type StepsIndicatorProps as IndicatorProps, } from './steps-indicator.svelte';
+export { default as Item, type StepsItemBaseProps as ItemBaseProps, type StepsItemProps as ItemProps, } from './steps-item.svelte';
+export { default as ItemContext, type StepsItemContextProps as ItemContextProps } from './steps-item-context.svelte';
+export { default as List, type StepsListBaseProps as ListBaseProps, type StepsListProps as ListProps, } from './steps-list.svelte';
+export { default as NextTrigger, type StepsNextTriggerBaseProps as NextTriggerBaseProps, type StepsNextTriggerProps as NextTriggerProps, } from './steps-next-trigger.svelte';
+export { default as PrevTrigger, type StepsPrevTriggerBaseProps as PrevTriggerBaseProps, type StepsPrevTriggerProps as PrevTriggerProps, } from './steps-prev-trigger.svelte';
+export { default as Progress, type StepsProgressBaseProps as ProgressBaseProps, type StepsProgressProps as ProgressProps, } from './steps-progress.svelte';
+export { default as Root, type StepsRootBaseProps as RootBaseProps, type StepsRootProps as RootProps, } from './steps-root.svelte';
+export { default as RootProvider, type StepsRootProviderBaseProps as RootProviderBaseProps, type StepsRootProviderProps as RootProviderProps, } from './steps-root-provider.svelte';
+export { default as Separator, type StepsSeparatorBaseProps as SeparatorBaseProps, type StepsSeparatorProps as SeparatorProps, } from './steps-separator.svelte';
+export { default as Trigger, type StepsTriggerBaseProps as TriggerBaseProps, type StepsTriggerProps as TriggerProps, } from './steps-trigger.svelte';

package/dist/components/steps/steps.js

@@ -0,0 +1,14 @@
+export { default as CompletedContent, } from './steps-completed-content.svelte';
+export { default as Content, } from './steps-content.svelte';
+export { default as Context } from './steps-context.svelte';
+export { default as Indicator, } from './steps-indicator.svelte';
+export { default as Item, } from './steps-item.svelte';
+export { default as ItemContext } from './steps-item-context.svelte';
+export { default as List, } from './steps-list.svelte';
+export { default as NextTrigger, } from './steps-next-trigger.svelte';
+export { default as PrevTrigger, } from './steps-prev-trigger.svelte';
+export { default as Progress, } from './steps-progress.svelte';
+export { default as Root, } from './steps-root.svelte';
+export { default as RootProvider, } from './steps-root-provider.svelte';
+export { default as Separator, } from './steps-separator.svelte';
+export { default as Trigger, } from './steps-trigger.svelte';

package/dist/components/steps/use-steps-context.d.ts

@@ -0,0 +1,4 @@
+import type { UseStepsReturn } from './use-steps.svelte';
+export interface UseStepsContext extends UseStepsReturn {
+}
+export declare const StepsProvider: (opts: UseStepsContext) => void, useStepsContext: (fallback?: UseStepsContext | undefined) => UseStepsContext;

package/dist/components/steps/use-steps-context.js

@@ -0,0 +1,6 @@
+import { createContext } from '../../utils/create-context';
+export const [StepsProvider, useStepsContext] = createContext({
+    name: 'StepsContext',
+    hookName: 'useStepsContext',
+    providerName: '<StepsProvider />',
+});

package/dist/components/steps/use-steps-item-context.d.ts

@@ -0,0 +1,5 @@
+import type { Accessor } from '../../types';
+import type { ItemState } from '@sprawlify/primitives/machines/steps';
+export interface UseStepsItemContext extends Accessor<ItemState> {
+}
+export declare const StepsItemProvider: (opts: UseStepsItemContext) => void, useStepsItemContext: (fallback?: UseStepsItemContext | undefined) => UseStepsItemContext;

package/dist/components/steps/use-steps-item-context.js

@@ -0,0 +1,6 @@
+import { createContext } from '../../utils/create-context';
+export const [StepsItemProvider, useStepsItemContext] = createContext({
+    name: 'StepsItemContext',
+    hookName: 'useStepsItemContext',
+    providerName: '<StepsItemProvider />',
+});

package/dist/components/steps/use-steps-item-props-context.d.ts

@@ -0,0 +1,5 @@
+import type { Accessor } from '../../types';
+import type { ItemProps } from '@sprawlify/primitives/machines/steps';
+export interface UseStepsItemPropsContext extends Accessor<ItemProps> {
+}
+export declare const StepsItemPropsProvider: (opts: UseStepsItemPropsContext) => void, useStepsItemPropsContext: (fallback?: UseStepsItemPropsContext | undefined) => UseStepsItemPropsContext;

package/dist/components/steps/use-steps-item-props-context.js

@@ -0,0 +1,6 @@
+import { createContext } from '../../utils/create-context';
+export const [StepsItemPropsProvider, useStepsItemPropsContext] = createContext({
+    name: 'StepsItemPropsContext',
+    hookName: 'useStepsItemPropsContext',
+    providerName: '<StepsItemPropsProvider />',
+});

package/dist/components/steps/use-steps.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Accessor, Optional } from '../../types';
+import * as steps from '@sprawlify/primitives/machines/steps';
+import { type PropTypes } from '../../core';
+import { type MaybeFunction } from '@sprawlify/primitives/utils';
+export interface UseStepsProps extends Optional<Omit<steps.Props, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseStepsReturn extends Accessor<steps.Api<PropTypes>> {
+}
+export declare const useSteps: (props?: MaybeFunction<UseStepsProps>) => () => steps.Api<PropTypes>;

package/dist/components/steps/use-steps.svelte.js

@@ -0,0 +1,20 @@
+import { useEnvironmentContext } from '../../providers/environment';
+import { useLocaleContext } from '../../providers/locale';
+import * as steps from '@sprawlify/primitives/machines/steps';
+import { normalizeProps, useMachine } from '../../core';
+import { runIfFn } from '@sprawlify/primitives/utils';
+export const useSteps = (props) => {
+    const env = useEnvironmentContext();
+    const locale = useLocaleContext();
+    const machineProps = $derived.by(() => {
+        const resolvedProps = runIfFn(props);
+        return {
+            dir: locale().dir,
+            getRootNode: env().getRootNode,
+            ...resolvedProps,
+        };
+    });
+    const service = useMachine(steps.machine, () => machineProps);
+    const api = $derived(steps.connect(service, normalizeProps));
+    return () => api;
+};

package/dist/components/switch/index.d.ts

@@ -0,0 +1,12 @@
+export type { CheckedChangeDetails as SwitchCheckedChangeDetails } from '@sprawlify/primitives/machines/switch';
+export { default as SwitchContext, type SwitchContextProps } from './switch-context.svelte';
+export { default as SwitchControl, type SwitchControlBaseProps, type SwitchControlProps } from './switch-control.svelte';
+export { default as SwitchHiddenInput, type SwitchHiddenInputBaseProps, type SwitchHiddenInputProps, } from './switch-hidden-input.svelte';
+export { default as SwitchLabel, type SwitchLabelBaseProps, type SwitchLabelProps } from './switch-label.svelte';
+export { default as SwitchRoot, type SwitchRootBaseProps, type SwitchRootProps } from './switch-root.svelte';
+export { default as SwitchRootProvider, type SwitchRootProviderBaseProps, type SwitchRootProviderProps, } from './switch-root-provider.svelte';
+export { default as SwitchThumb, type SwitchThumbBaseProps, type SwitchThumbProps } from './switch-thumb.svelte';
+export { switchAnatomy } from './switch-anatomy';
+export { useSwitch, type UseSwitchProps, type UseSwitchReturn } from './use-switch.svelte';
+export { useSwitchContext, type UseSwitchContext } from './use-switch-context';
+export * as Switch from './switch';

package/dist/components/switch/index.js

@@ -0,0 +1,11 @@
+export { default as SwitchContext } from './switch-context.svelte';
+export { default as SwitchControl } from './switch-control.svelte';
+export { default as SwitchHiddenInput, } from './switch-hidden-input.svelte';
+export { default as SwitchLabel } from './switch-label.svelte';
+export { default as SwitchRoot } from './switch-root.svelte';
+export { default as SwitchRootProvider, } from './switch-root-provider.svelte';
+export { default as SwitchThumb } from './switch-thumb.svelte';
+export { switchAnatomy } from './switch-anatomy';
+export { useSwitch } from './use-switch.svelte';
+export { useSwitchContext } from './use-switch-context';
+export * as Switch from './switch';

package/dist/components/switch/switch-anatomy.d.ts

@@ -0,0 +1 @@
+export { anatomy as switchAnatomy } from '@sprawlify/primitives/machines/switch';

package/dist/components/switch/switch-anatomy.js

@@ -0,0 +1 @@
+export { anatomy as switchAnatomy } from '@sprawlify/primitives/machines/switch';

package/dist/components/switch/switch-context.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Snippet } from 'svelte'
+  import type { UseSwitchContext } from './use-switch-context'
+
+  export interface SwitchContextProps {
+    render: Snippet<[UseSwitchContext]>
+  }
+</script>
+
+<script lang="ts">
+  import { useSwitchContext } from './use-switch-context'
+
+  let { render }: SwitchContextProps = $props()
+
+  const switchMachine = useSwitchContext()
+</script>
+
+{@render render(switchMachine)}

package/dist/components/switch/switch-context.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { UseSwitchContext } from './use-switch-context';
+export interface SwitchContextProps {
+    render: Snippet<[UseSwitchContext]>;
+}
+declare const SwitchContext: import("svelte").Component<SwitchContextProps, {}, "">;
+type SwitchContext = ReturnType<typeof SwitchContext>;
+export default SwitchContext;

package/dist/components/switch/switch-control.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface SwitchControlBaseProps extends PolymorphicProps<'span'>, RefAttribute {}
+  export interface SwitchControlProps extends Assign<HTMLProps<'span'>, SwitchControlBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useSwitchContext } from './use-switch-context'
+
+  let { ref = $bindable(null), ...props }: SwitchControlProps = $props()
+
+  const switchMachine = useSwitchContext()
+  const mergedProps = $derived(mergeProps(switchMachine().getControlProps(), props))
+</script>
+
+<Sprawlify as="span" bind:ref {...mergedProps} />

package/dist/components/switch/switch-control.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface SwitchControlBaseProps extends PolymorphicProps<'span'>, RefAttribute {
+}
+export interface SwitchControlProps extends Assign<HTMLProps<'span'>, SwitchControlBaseProps> {
+}
+declare const SwitchControl: import("svelte").Component<SwitchControlProps, {}, "ref">;
+type SwitchControl = ReturnType<typeof SwitchControl>;
+export default SwitchControl;

package/dist/components/switch/switch-hidden-input.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface SwitchHiddenInputBaseProps extends PolymorphicProps<'input'>, RefAttribute {}
+  export interface SwitchHiddenInputProps extends Assign<HTMLProps<'input'>, SwitchHiddenInputBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useSwitchContext } from './use-switch-context'
+
+  let { ref = $bindable(null), ...props }: SwitchHiddenInputProps = $props()
+
+  const switchMachine = useSwitchContext()
+  const mergedProps = $derived(mergeProps(switchMachine().getHiddenInputProps(), props))
+</script>
+
+<Sprawlify as="input" bind:ref {...mergedProps} />

package/dist/components/switch/switch-hidden-input.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface SwitchHiddenInputBaseProps extends PolymorphicProps<'input'>, RefAttribute {
+}
+export interface SwitchHiddenInputProps extends Assign<HTMLProps<'input'>, SwitchHiddenInputBaseProps> {
+}
+declare const SwitchHiddenInput: import("svelte").Component<SwitchHiddenInputProps, {}, "ref">;
+type SwitchHiddenInput = ReturnType<typeof SwitchHiddenInput>;
+export default SwitchHiddenInput;

package/dist/components/switch/switch-label.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface SwitchLabelBaseProps extends PolymorphicProps<'span'>, RefAttribute {}
+  export interface SwitchLabelProps extends Assign<HTMLProps<'span'>, SwitchLabelBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useSwitchContext } from './use-switch-context'
+
+  let { ref = $bindable(null), ...props }: SwitchLabelProps = $props()
+
+  const switchMachine = useSwitchContext()
+  const mergedProps = $derived(mergeProps(switchMachine().getLabelProps(), props))
+</script>
+
+<Sprawlify as="span" bind:ref {...mergedProps} />

package/dist/components/switch/switch-label.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface SwitchLabelBaseProps extends PolymorphicProps<'span'>, RefAttribute {
+}
+export interface SwitchLabelProps extends Assign<HTMLProps<'span'>, SwitchLabelBaseProps> {
+}
+declare const SwitchLabel: import("svelte").Component<SwitchLabelProps, {}, "ref">;
+type SwitchLabel = ReturnType<typeof SwitchLabel>;
+export default SwitchLabel;

package/dist/components/switch/switch-root-provider.svelte

@@ -0,0 +1,24 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseSwitchReturn } from './use-switch.svelte'
+
+  export interface SwitchRootProviderBaseProps extends PolymorphicProps<'label'>, RefAttribute {
+    value: UseSwitchReturn
+  }
+  export interface SwitchRootProviderProps extends Assign<HTMLProps<'label'>, SwitchRootProviderBaseProps> {}
+</script>
+
+<!-- svelte-ignore state_referenced_locally -->
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { SwitchProvider } from './use-switch-context'
+
+  let { ref = $bindable(null), value, ...props }: SwitchRootProviderProps = $props()
+
+  const mergedProps = $derived(mergeProps(value().getRootProps(), props))
+
+  SwitchProvider(value)
+</script>
+
+<Sprawlify as="label" bind:ref {...mergedProps} />

package/dist/components/switch/switch-root-provider.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseSwitchReturn } from './use-switch.svelte';
+export interface SwitchRootProviderBaseProps extends PolymorphicProps<'label'>, RefAttribute {
+    value: UseSwitchReturn;
+}
+export interface SwitchRootProviderProps extends Assign<HTMLProps<'label'>, SwitchRootProviderBaseProps> {
+}
+declare const SwitchRootProvider: import("svelte").Component<SwitchRootProviderProps, {}, "ref">;
+type SwitchRootProvider = ReturnType<typeof SwitchRootProvider>;
+export default SwitchRootProvider;

package/dist/components/switch/switch-root.svelte

@@ -0,0 +1,53 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseSwitchProps } from './use-switch.svelte'
+
+  export interface SwitchRootBaseProps extends UseSwitchProps, PolymorphicProps<'label'>, RefAttribute {}
+  export interface SwitchRootProps extends Assign<HTMLProps<'label'>, SwitchRootBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useSwitch } from './use-switch.svelte'
+  import { SwitchProvider } from './use-switch-context'
+
+  let { ref = $bindable(null), checked = $bindable(), ...props }: SwitchRootProps = $props()
+  const providedId = $props.id()
+
+  const [useSwitchProps, localProps] = $derived(
+    createSplitProps<UseSwitchProps>()(props, [
+      'checked',
+      'defaultChecked',
+      'disabled',
+      'form',
+      'id',
+      'ids',
+      'invalid',
+      'label',
+      'name',
+      'onCheckedChange',
+      'readOnly',
+      'required',
+      'value',
+    ]),
+  )
+
+  const resolvedProps = $derived<UseSwitchProps>({
+    ...useSwitchProps,
+    id: useSwitchProps.id ?? providedId,
+    checked,
+    onCheckedChange(details) {
+      useSwitchProps.onCheckedChange?.(details)
+      if (checked !== undefined) checked = details.checked
+    },
+  })
+
+  const switchMachine = useSwitch(() => resolvedProps)
+  const mergedProps = $derived(mergeProps(switchMachine().getRootProps(), localProps))
+
+  SwitchProvider(switchMachine)
+</script>
+
+<Sprawlify as="label" bind:ref {...mergedProps} />

package/dist/components/switch/switch-root.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseSwitchProps } from './use-switch.svelte';
+export interface SwitchRootBaseProps extends UseSwitchProps, PolymorphicProps<'label'>, RefAttribute {
+}
+export interface SwitchRootProps extends Assign<HTMLProps<'label'>, SwitchRootBaseProps> {
+}
+declare const SwitchRoot: import("svelte").Component<SwitchRootProps, {}, "checked" | "ref">;
+type SwitchRoot = ReturnType<typeof SwitchRoot>;
+export default SwitchRoot;

package/dist/components/switch/switch-thumb.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface SwitchThumbBaseProps extends PolymorphicProps<'span'>, RefAttribute {}
+  export interface SwitchThumbProps extends Assign<HTMLProps<'span'>, SwitchThumbBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useSwitchContext } from './use-switch-context'
+
+  let { ref = $bindable(null), ...props }: SwitchThumbProps = $props()
+
+  const switchMachine = useSwitchContext()
+  const mergedProps = $derived(mergeProps(switchMachine().getThumbProps(), props))
+</script>
+
+<Sprawlify as="span" bind:ref {...mergedProps} />

package/dist/components/switch/switch-thumb.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface SwitchThumbBaseProps extends PolymorphicProps<'span'>, RefAttribute {
+}
+export interface SwitchThumbProps extends Assign<HTMLProps<'span'>, SwitchThumbBaseProps> {
+}
+declare const SwitchThumb: import("svelte").Component<SwitchThumbProps, {}, "ref">;
+type SwitchThumb = ReturnType<typeof SwitchThumb>;
+export default SwitchThumb;

package/dist/components/switch/switch.d.ts

@@ -0,0 +1,8 @@
+export type { CheckedChangeDetails } from '@sprawlify/primitives/machines/switch';
+export { default as Context, type SwitchContextProps as ContextProps } from './switch-context.svelte';
+export { default as Control, type SwitchControlBaseProps as ControlBaseProps, type SwitchControlProps as ControlProps, } from './switch-control.svelte';
+export { default as HiddenInput, type SwitchHiddenInputBaseProps as HiddenInputBaseProps, type SwitchHiddenInputProps as HiddenInputProps, } from './switch-hidden-input.svelte';
+export { default as Label, type SwitchLabelBaseProps as LabelBaseProps, type SwitchLabelProps as LabelProps, } from './switch-label.svelte';
+export { default as Root, type SwitchRootBaseProps as RootBaseProps, type SwitchRootProps as RootProps, } from './switch-root.svelte';
+export { default as RootProvider, type SwitchRootProviderBaseProps as RootProviderBaseProps, type SwitchRootProviderProps as RootProviderProps, } from './switch-root-provider.svelte';
+export { default as Thumb, type SwitchThumbBaseProps as ThumbBaseProps, type SwitchThumbProps as ThumbProps, } from './switch-thumb.svelte';

package/dist/components/switch/switch.js

@@ -0,0 +1,7 @@
+export { default as Context } from './switch-context.svelte';
+export { default as Control, } from './switch-control.svelte';
+export { default as HiddenInput, } from './switch-hidden-input.svelte';
+export { default as Label, } from './switch-label.svelte';
+export { default as Root, } from './switch-root.svelte';
+export { default as RootProvider, } from './switch-root-provider.svelte';
+export { default as Thumb, } from './switch-thumb.svelte';

package/dist/components/switch/use-switch-context.d.ts

@@ -0,0 +1,4 @@
+import type { UseSwitchReturn } from './use-switch.svelte';
+export interface UseSwitchContext extends UseSwitchReturn {
+}
+export declare const SwitchProvider: (opts: UseSwitchContext) => void, useSwitchContext: (fallback?: UseSwitchContext | undefined) => UseSwitchContext;

package/dist/components/switch/use-switch-context.js

@@ -0,0 +1,6 @@
+import { createContext } from '../../utils/create-context';
+export const [SwitchProvider, useSwitchContext] = createContext({
+    name: 'SwitchContext',
+    hookName: 'useSwitchContext',
+    providerName: '<SwitchProvider />',
+});

package/dist/components/switch/use-switch.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Accessor, Optional } from '../../types';
+import { type PropTypes } from '../../core';
+import * as sprawlifySwitch from '@sprawlify/primitives/machines/switch';
+import { type MaybeFunction } from '@sprawlify/primitives/utils';
+export interface UseSwitchProps extends Optional<Omit<sprawlifySwitch.Props, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseSwitchReturn extends Accessor<sprawlifySwitch.Api<PropTypes>> {
+}
+export declare const useSwitch: (props?: MaybeFunction<UseSwitchProps>) => () => sprawlifySwitch.Api<PropTypes>;