@ark-ui/solid 0.3.0 → 0.4.0

package/README.md

@@ -34,6 +34,7 @@ At the moment, `@ark-ui/solid`offers the following components:
 - [Select](https://ark-ui.com/docs/solid/components/select)
 - [Slider](https://ark-ui.com/docs/solid/components/slider)
 - [Splitter](https://ark-ui.com/docs/solid/components/splitter)
+- [Switch](https://ark-ui.com/docs/solid/components/switch)
 - [Tabs](https://ark-ui.com/docs/solid/components/tabs)
 - [Tags Input](https://ark-ui.com/docs/solid/components/tags-input)
 - [Toast](https://ark-ui.com/docs/solid/components/toast)

package/dist/accordion/accordion-context.d.ts

@@ -1,4 +1,4 @@
-import type { ItemProps } from '@zag-js/accordion/dist/accordion.types';
+import type { ItemProps, ItemState } from '@zag-js/accordion/dist/accordion.types';
 import type { Accessor, JSX } from 'solid-js';
 import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
 import { type UseAccordionReturn } from './use-accordion';
@@ -11,11 +11,7 @@ export declare const AccordionProvider: ContextProviderComponent<Accessor<{
     focusedValue: string | null;
     value: string | string[] | null;
     setValue: (value: string | string[]) => void;
-    getItemState: (props: ItemProps) => {
-        isOpen: boolean;
-        isFocused: boolean;
-        isDisabled: boolean;
-    };
+    getItemState: (props: ItemProps) => ItemState;
 }>>, useAccordionContext: () => Accessor<{
     rootProps: JSX.HTMLAttributes<any>;
     getItemProps(props: ItemProps): JSX.HTMLAttributes<any>;
@@ -24,9 +20,5 @@ export declare const AccordionProvider: ContextProviderComponent<Accessor<{
     focusedValue: string | null;
     value: string | string[] | null;
     setValue: (value: string | string[]) => void;
-    getItemState: (props: ItemProps) => {
-        isOpen: boolean;
-        isFocused: boolean;
-        isDisabled: boolean;
-    };
+    getItemState: (props: ItemProps) => ItemState;
 }>;

package/dist/accordion/use-accordion.cjs

@@ -28,7 +28,7 @@ const accordion__namespace = /*#__PURE__*/_interopNamespaceDefault(accordion);
 
 const useAccordion = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(accordion__namespace.machine(context), { context });
   return solidJs.createMemo(() => accordion__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/accordion/use-accordion.d.ts

@@ -1,4 +1,3 @@
-import type { ItemProps } from '@zag-js/accordion/dist/accordion.types';
 import type { Accessor, JSX } from 'solid-js';
 import * as accordion from '@zag-js/accordion';
 import { type Optional } from '../types';
@@ -6,15 +5,11 @@ export type UseAccordionProps = Optional<accordion.Context, 'id'>;
 export type UseAccordionReturn = ReturnType<typeof useAccordion>;
 export declare const useAccordion: (props: UseAccordionProps) => Accessor<{
     rootProps: JSX.HTMLAttributes<any>;
-    getItemProps(props: ItemProps): JSX.HTMLAttributes<any>;
-    getContentProps(props: ItemProps): JSX.HTMLAttributes<any>;
-    getTriggerProps(props: ItemProps): JSX.ButtonHTMLAttributes<HTMLButtonElement>;
+    getItemProps(props: accordion.ItemProps): JSX.HTMLAttributes<any>;
+    getContentProps(props: accordion.ItemProps): JSX.HTMLAttributes<any>;
+    getTriggerProps(props: accordion.ItemProps): JSX.ButtonHTMLAttributes<HTMLButtonElement>;
     focusedValue: string | null;
     value: string | string[] | null;
     setValue: (value: string | string[]) => void;
-    getItemState: (props: ItemProps) => {
-        isOpen: boolean;
-        isFocused: boolean;
-        isDisabled: boolean;
-    };
+    getItemState: (props: accordion.ItemProps) => accordion.ItemState;
 }>;

package/dist/accordion/use-accordion.mjs

@@ -1,6 +1,6 @@
 import * as accordion from '@zag-js/accordion';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useAccordion = (props) => {

package/dist/carousel/use-carousel.cjs

@@ -28,7 +28,7 @@ const carousel__namespace = /*#__PURE__*/_interopNamespaceDefault(carousel);
 
 const useCarousel = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(carousel__namespace.machine(context), { context });
   return solidJs.createMemo(() => carousel__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/carousel/use-carousel.mjs

@@ -1,6 +1,6 @@
 import * as carousel from '@zag-js/carousel';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useCarousel = (props) => {

package/dist/checkbox/checkbox-context.d.ts

@@ -1,3 +1,4 @@
+import type { CheckedState } from '@zag-js/checkbox/dist/checkbox.types';
 import type { Accessor, JSX } from 'solid-js';
 import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
 import { type UseCheckboxReturn } from './use-checkbox';
@@ -5,12 +6,11 @@ export type CheckboxContext = UseCheckboxReturn;
 export declare const CheckboxProvider: ContextProviderComponent<Accessor<{
     isChecked: boolean;
     isDisabled: boolean | undefined;
-    isIndeterminate: boolean | undefined;
-    isFocused: boolean;
-    isReadOnly: boolean | undefined;
-    view: string;
-    setChecked(checked: boolean): void;
-    setIndeterminate(indeterminate: boolean): void;
+    isIndeterminate: boolean;
+    isFocused: boolean | undefined;
+    checkedState: CheckedState;
+    setChecked(checked: CheckedState): void;
+    toggleChecked(): void;
     rootProps: JSX.LabelHTMLAttributes<HTMLLabelElement>;
     labelProps: JSX.HTMLAttributes<any>;
     controlProps: JSX.HTMLAttributes<any>;
@@ -18,12 +18,11 @@ export declare const CheckboxProvider: ContextProviderComponent<Accessor<{
 }>>, useCheckboxContext: () => Accessor<{
     isChecked: boolean;
     isDisabled: boolean | undefined;
-    isIndeterminate: boolean | undefined;
-    isFocused: boolean;
-    isReadOnly: boolean | undefined;
-    view: string;
-    setChecked(checked: boolean): void;
-    setIndeterminate(indeterminate: boolean): void;
+    isIndeterminate: boolean;
+    isFocused: boolean | undefined;
+    checkedState: CheckedState;
+    setChecked(checked: CheckedState): void;
+    toggleChecked(): void;
     rootProps: JSX.LabelHTMLAttributes<HTMLLabelElement>;
     labelProps: JSX.HTMLAttributes<any>;
     controlProps: JSX.HTMLAttributes<any>;

package/dist/checkbox/checkbox.cjs

@@ -11,7 +11,7 @@ const checkboxContext = require('./checkbox-context.cjs');
 const useCheckbox = require('./use-checkbox.cjs');
 
 const Checkbox = props => {
-  const [useCheckboxProps, labelprops] = createSplitProps.createSplitProps()(props, ['aria-describedby', 'aria-label', 'aria-labelledby', 'checked', 'dir', 'disabled', 'focusable', 'form', 'getRootNode', 'id', 'ids', 'indeterminate', 'invalid', 'name', 'onChange', 'readOnly', 'required', 'value']);
+  const [useCheckboxProps, labelprops] = createSplitProps.createSplitProps()(props, ['checked', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'invalid', 'name', 'onChange', 'required', 'value']);
   const api = useCheckbox.useCheckbox(useCheckboxProps);
   const rootProps = solid.mergeProps(() => api().rootProps, labelprops);
   const getChildren = () => runIfFn.runIfFn(props.children, api);

package/dist/checkbox/checkbox.mjs

@@ -7,7 +7,7 @@ import { CheckboxProvider } from './checkbox-context.mjs';
 import { useCheckbox } from './use-checkbox.mjs';
 
 const Checkbox = props => {
-  const [useCheckboxProps, labelprops] = createSplitProps()(props, ['aria-describedby', 'aria-label', 'aria-labelledby', 'checked', 'dir', 'disabled', 'focusable', 'form', 'getRootNode', 'id', 'ids', 'indeterminate', 'invalid', 'name', 'onChange', 'readOnly', 'required', 'value']);
+  const [useCheckboxProps, labelprops] = createSplitProps()(props, ['checked', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'invalid', 'name', 'onChange', 'required', 'value']);
   const api = useCheckbox(useCheckboxProps);
   const rootProps = mergeProps(() => api().rootProps, labelprops);
   const getChildren = () => runIfFn(props.children, api);

package/dist/checkbox/index.d.ts

@@ -1,3 +1,4 @@
+export type { CheckedState } from '@zag-js/checkbox/dist/checkbox.types';
 export { Checkbox, type CheckboxProps } from './checkbox';
 export { CheckboxControl, type CheckboxControlProps } from './checkbox-control';
 export { CheckboxInput, type CheckboxInputProps } from './checkbox-input';

package/dist/checkbox/use-checkbox.cjs

@@ -28,7 +28,7 @@ const checkbox__namespace = /*#__PURE__*/_interopNamespaceDefault(checkbox);
 
 const useCheckbox = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(checkbox__namespace.machine(context), { context });
   return solidJs.createMemo(() => checkbox__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/checkbox/use-checkbox.d.ts

@@ -1,3 +1,4 @@
+import type { CheckedState } from '@zag-js/checkbox/dist/checkbox.types';
 import type { Accessor, JSX } from 'solid-js';
 import * as checkbox from '@zag-js/checkbox';
 import { type Optional } from '../types';
@@ -6,12 +7,11 @@ export type UseCheckboxReturn = ReturnType<typeof useCheckbox>;
 export declare const useCheckbox: (props: UseCheckboxProps) => Accessor<{
     isChecked: boolean;
     isDisabled: boolean | undefined;
-    isIndeterminate: boolean | undefined;
-    isFocused: boolean;
-    isReadOnly: boolean | undefined;
-    view: string;
-    setChecked(checked: boolean): void;
-    setIndeterminate(indeterminate: boolean): void;
+    isIndeterminate: boolean;
+    isFocused: boolean | undefined;
+    checkedState: CheckedState;
+    setChecked(checked: CheckedState): void;
+    toggleChecked(): void;
     rootProps: JSX.LabelHTMLAttributes<HTMLLabelElement>;
     labelProps: JSX.HTMLAttributes<any>;
     controlProps: JSX.HTMLAttributes<any>;

package/dist/checkbox/use-checkbox.mjs

@@ -1,6 +1,6 @@
 import * as checkbox from '@zag-js/checkbox';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useCheckbox = (props) => {

package/dist/combobox/use-combobox.cjs

@@ -28,7 +28,7 @@ const combobox__namespace = /*#__PURE__*/_interopNamespaceDefault(combobox);
 
 const useCombobox = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(combobox__namespace.machine(context), { context });
   return solidJs.createMemo(() => combobox__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/combobox/use-combobox.d.ts

@@ -1,4 +1,4 @@
-import type { OptionData, OptionProps, OptionGroupProps } from '@zag-js/combobox/dist/combobox.types';
+import type { OptionData } from '@zag-js/combobox/dist/combobox.types';
 import type { Accessor, JSX } from 'solid-js';
 import * as combobox from '@zag-js/combobox';
 import { type Optional } from '../types';
@@ -23,11 +23,11 @@ export declare const useCombobox: (props: UseComboboxProps) => Accessor<{
     triggerProps: JSX.ButtonHTMLAttributes<HTMLButtonElement>;
     contentProps: JSX.HTMLAttributes<any>;
     clearTriggerProps: JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-    getOptionState(props: OptionProps): {
+    getOptionState(props: combobox.OptionProps): {
         disabled: boolean | undefined;
         focused: boolean;
         checked: boolean;
     };
-    getOptionProps(props: OptionProps): JSX.HTMLAttributes<any>;
-    getOptionGroupProps(props: OptionGroupProps): JSX.HTMLAttributes<any>;
+    getOptionProps(props: combobox.OptionProps): JSX.HTMLAttributes<any>;
+    getOptionGroupProps(props: combobox.OptionGroupProps): JSX.HTMLAttributes<any>;
 }>;

package/dist/combobox/use-combobox.mjs

@@ -1,6 +1,6 @@
 import * as combobox from '@zag-js/combobox';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useCombobox = (props) => {

package/dist/dialog/use-dialog.cjs

@@ -28,7 +28,7 @@ const dialog__namespace = /*#__PURE__*/_interopNamespaceDefault(dialog);
 
 const useDialog = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(dialog__namespace.machine(context), { context });
   return solidJs.createMemo(() => dialog__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/dialog/use-dialog.mjs

@@ -1,6 +1,6 @@
 import * as dialog from '@zag-js/dialog';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useDialog = (props) => {

package/dist/editable/editable-edit-trigger.cjs

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
-const solidJs = require('solid-js');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const editableContext = require('./editable-context.cjs');
 
 const EditableEditTrigger = props => {
   const editable = editableContext.useEditableContext();
-  const triggerProps = solidJs.mergeProps(() => editable().editTriggerProps, props);
+  const triggerProps = solid.mergeProps(() => editable().editTriggerProps, props);
   return web.createComponent(factory.ark.button, triggerProps);
 };
 

package/dist/editable/editable-edit-trigger.mjs

@@ -1,5 +1,5 @@
 import { createComponent } from 'solid-js/web';
-import { mergeProps } from 'solid-js';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useEditableContext } from './editable-context.mjs';
 

package/dist/editable/editable-preview.cjs

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
-const solidJs = require('solid-js');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const editableContext = require('./editable-context.cjs');
 
 const EditablePreview = props => {
   const editable = editableContext.useEditableContext();
-  const previewProps = solidJs.mergeProps(() => editable().previewProps, props);
+  const previewProps = solid.mergeProps(() => editable().previewProps, props);
   return web.createComponent(factory.ark.span, previewProps);
 };
 

package/dist/editable/editable-preview.mjs

@@ -1,5 +1,5 @@
 import { createComponent } from 'solid-js/web';
-import { mergeProps } from 'solid-js';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useEditableContext } from './editable-context.mjs';
 

package/dist/editable/editable-submit-trigger.cjs

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
-const solidJs = require('solid-js');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const editableContext = require('./editable-context.cjs');
 
 const EditableSubmitTrigger = props => {
   const dialog = editableContext.useEditableContext();
-  const triggerProps = solidJs.mergeProps(() => dialog().submitTriggerProps, props);
+  const triggerProps = solid.mergeProps(() => dialog().submitTriggerProps, props);
   return web.createComponent(factory.ark.button, triggerProps);
 };
 

package/dist/editable/editable-submit-trigger.mjs

@@ -1,5 +1,5 @@
 import { createComponent } from 'solid-js/web';
-import { mergeProps } from 'solid-js';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useEditableContext } from './editable-context.mjs';
 

package/dist/editable/use-editable.cjs

@@ -28,7 +28,7 @@ const editable__namespace = /*#__PURE__*/_interopNamespaceDefault(editable);
 
 const useEditable = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(editable__namespace.machine(context), { context });
   return solidJs.createMemo(() => editable__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/editable/use-editable.mjs

@@ -1,6 +1,6 @@
 import * as editable from '@zag-js/editable';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useEditable = (props) => {

package/dist/hover-card/hover-card.cjs

@@ -4,16 +4,18 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
 const createSplitProps = require('../create-split-props.cjs');
+const runIfFn = require('../run-if-fn.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 const useHoverCard = require('./use-hover-card.cjs');
 
 const HoverCard = props => {
-  const [useHoverCardProps, restProps] = createSplitProps.createSplitProps()(props, ['closeDelay', 'dir', 'getRootNode', 'id', 'ids', 'onClose', 'onOpen', 'open', 'openDelay', 'positioning']);
-  const hoverCard = useHoverCard.useHoverCard(useHoverCardProps);
+  const [hoverCardProps, localProps] = createSplitProps.createSplitProps()(props, ['closeDelay', 'dir', 'getRootNode', 'id', 'ids', 'onClose', 'onOpen', 'open', 'openDelay', 'positioning']);
+  const api = useHoverCard.useHoverCard(hoverCardProps);
+  const getChildren = () => runIfFn.runIfFn(localProps.children, api);
   return web.createComponent(hoverCardContext.HoverCardProvider, {
-    value: hoverCard,
+    value: api,
     get children() {
-      return restProps.children;
+      return getChildren();
     }
   });
 };

package/dist/hover-card/hover-card.d.ts

@@ -1,6 +1,6 @@
 import { type JSX } from 'solid-js';
-import { type UseHoverCardProps } from './use-hover-card';
+import { type UseHoverCardProps, type UseHoverCardReturn } from './use-hover-card';
 export type HoverCardProps = UseHoverCardProps & {
-    children: JSX.Element;
+    children?: JSX.Element | ((state: UseHoverCardReturn) => JSX.Element);
 };
 export declare const HoverCard: (props: HoverCardProps) => JSX.Element;

package/dist/hover-card/hover-card.mjs

@@ -1,15 +1,17 @@
 import { createComponent } from 'solid-js/web';
 import { createSplitProps } from '../create-split-props.mjs';
+import { runIfFn } from '../run-if-fn.mjs';
 import { HoverCardProvider } from './hover-card-context.mjs';
 import { useHoverCard } from './use-hover-card.mjs';
 
 const HoverCard = props => {
-  const [useHoverCardProps, restProps] = createSplitProps()(props, ['closeDelay', 'dir', 'getRootNode', 'id', 'ids', 'onClose', 'onOpen', 'open', 'openDelay', 'positioning']);
-  const hoverCard = useHoverCard(useHoverCardProps);
+  const [hoverCardProps, localProps] = createSplitProps()(props, ['closeDelay', 'dir', 'getRootNode', 'id', 'ids', 'onClose', 'onOpen', 'open', 'openDelay', 'positioning']);
+  const api = useHoverCard(hoverCardProps);
+  const getChildren = () => runIfFn(localProps.children, api);
   return createComponent(HoverCardProvider, {
-    value: hoverCard,
+    value: api,
     get children() {
-      return restProps.children;
+      return getChildren();
     }
   });
 };

package/dist/hover-card/use-hover-card.cjs

@@ -28,7 +28,7 @@ const hoverCard__namespace = /*#__PURE__*/_interopNamespaceDefault(hoverCard);
 
 const useHoverCard = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(hoverCard__namespace.machine(context), { context });
   return solidJs.createMemo(() => hoverCard__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/hover-card/use-hover-card.mjs

@@ -1,6 +1,6 @@
 import * as hoverCard from '@zag-js/hover-card';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useHoverCard = (props) => {

package/dist/index.cjs

@@ -152,6 +152,12 @@ const splitter = require('./splitter/splitter.cjs');
 const splitterPanel = require('./splitter/splitter-panel.cjs');
 const splitterResizeTrigger = require('./splitter/splitter-resize-trigger.cjs');
 const splitter$1 = require('@zag-js/splitter');
+const _switch = require('./switch/switch.cjs');
+const switchControl = require('./switch/switch-control.cjs');
+const switchInput = require('./switch/switch-input.cjs');
+const switchLabel = require('./switch/switch-label.cjs');
+const switchThumb = require('./switch/switch-thumb.cjs');
+const zagSwitch = require('@zag-js/switch');
 const tabContent = require('./tabs/tab-content.cjs');
 const tabIndicator = require('./tabs/tab-indicator.cjs');
 const tabList = require('./tabs/tab-list.cjs');
@@ -386,6 +392,15 @@ Object.defineProperty(exports, 'splitterAnatomy', {
 	enumerable: true,
 	get: () => splitter$1.anatomy
 });
+exports.Switch = _switch.Switch;
+exports.SwitchControl = switchControl.SwitchControl;
+exports.SwitchInput = switchInput.SwitchInput;
+exports.SwitchLabel = switchLabel.SwitchLabel;
+exports.SwitchThumb = switchThumb.SwitchThumb;
+Object.defineProperty(exports, 'switchAnatomy', {
+	enumerable: true,
+	get: () => zagSwitch.anatomy
+});
 exports.TabContent = tabContent.TabContent;
 exports.TabIndicator = tabIndicator.TabIndicator;
 exports.TabList = tabList.TabList;

package/dist/index.d.ts

@@ -19,6 +19,7 @@ export * from './rating-group';
 export * from './select';
 export * from './slider';
 export * from './splitter';
+export * from './switch';
 export * from './tabs';
 export * from './tags-input';
 export * from './toast';

package/dist/index.mjs

@@ -148,6 +148,12 @@ export { Splitter } from './splitter/splitter.mjs';
 export { SplitterPanel } from './splitter/splitter-panel.mjs';
 export { SplitterResizeTrigger } from './splitter/splitter-resize-trigger.mjs';
 export { anatomy as splitterAnatomy } from '@zag-js/splitter';
+export { Switch } from './switch/switch.mjs';
+export { SwitchControl } from './switch/switch-control.mjs';
+export { SwitchInput } from './switch/switch-input.mjs';
+export { SwitchLabel } from './switch/switch-label.mjs';
+export { SwitchThumb } from './switch/switch-thumb.mjs';
+export { anatomy as switchAnatomy } from '@zag-js/switch';
 export { TabContent } from './tabs/tab-content.mjs';
 export { TabIndicator } from './tabs/tab-indicator.mjs';
 export { TabList } from './tabs/tab-list.mjs';

package/dist/menu/use-menu.cjs

@@ -28,7 +28,7 @@ const menu__namespace = /*#__PURE__*/_interopNamespaceDefault(menu);
 
 const useMenu = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send, machine] = solid.useMachine(menu__namespace.machine(context), { context });
   return solidJs.createMemo(() => ({
     api: () => menu__namespace.connect(state, send, solid.normalizeProps),

package/dist/menu/use-menu.mjs

@@ -1,6 +1,6 @@
 import * as menu from '@zag-js/menu';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useMenu = (props) => {

package/dist/number-input/use-number-input.cjs

@@ -28,7 +28,7 @@ const numberInput__namespace = /*#__PURE__*/_interopNamespaceDefault(numberInput
 
 const useNumberInput = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(numberInput__namespace.machine(context), { context });
   return solidJs.createMemo(() => numberInput__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/number-input/use-number-input.mjs

@@ -1,6 +1,6 @@
 import * as numberInput from '@zag-js/number-input';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useNumberInput = (props) => {

package/dist/pagination/use-pagination.cjs

@@ -28,7 +28,7 @@ const pagination__namespace = /*#__PURE__*/_interopNamespaceDefault(pagination);
 
 const usePagination = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(pagination__namespace.machine(context), { context });
   return solidJs.createMemo(() => pagination__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/pagination/use-pagination.mjs

@@ -1,6 +1,6 @@
 import * as pagination from '@zag-js/pagination';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const usePagination = (props) => {

package/dist/pin-input/use-pin-input.cjs

@@ -28,7 +28,7 @@ const pinInput__namespace = /*#__PURE__*/_interopNamespaceDefault(pinInput);
 
 const usePinInput = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(pinInput__namespace.machine(context), { context });
   return solidJs.createMemo(() => pinInput__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/pin-input/use-pin-input.mjs

@@ -1,6 +1,6 @@
 import * as pinInput from '@zag-js/pin-input';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const usePinInput = (props) => {

package/dist/popover/use-popover.cjs

@@ -28,7 +28,7 @@ const popover__namespace = /*#__PURE__*/_interopNamespaceDefault(popover);
 
 const usePopover = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
   const [state, send] = solid.useMachine(popover__namespace.machine(context), { context });
   return solidJs.createMemo(() => popover__namespace.connect(state, send, solid.normalizeProps));
 };

package/dist/popover/use-popover.mjs

@@ -1,6 +1,6 @@
 import * as popover from '@zag-js/popover';
-import { useMachine, normalizeProps } from '@zag-js/solid';
-import { mergeProps, createUniqueId, createMemo } from 'solid-js';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const usePopover = (props) => {