@ark-ui/solid 0.9.0 → 0.10.0

package/color-picker/index.mjs

@@ -1,17 +1,35 @@
-export { ColorPicker } from './color-picker.mjs';
-export { ColorPickerArea } from './color-picker-area.mjs';
+import { ColorPicker as ColorPicker$1 } from './color-picker.mjs';
+import { ColorPickerArea } from './color-picker-area.mjs';
 export { useColorPickerAreaContext } from './color-picker-area-context.mjs';
-export { ColorPickerAreaGradient } from './color-picker-area-gradient.mjs';
-export { ColorPickerAreaThumb } from './color-picker-area-thumb.mjs';
-export { ColorPickerChannelInput } from './color-picker-channel-input.mjs';
-export { ColorPickerChannelSliderBackground } from './color-picker-channel-slider-background.mjs';
-export { ColorPickerChannelSliderThumb } from './color-picker-channel-slider-thumb.mjs';
-export { ColorPickerChannelSliderTrack } from './color-picker-channel-slider-track.mjs';
-export { ColorPickerContent } from './color-picker-content.mjs';
+import { ColorPickerAreaGradient } from './color-picker-area-gradient.mjs';
+import { ColorPickerAreaThumb } from './color-picker-area-thumb.mjs';
+import { ColorPickerChannelInput } from './color-picker-channel-input.mjs';
+import { ColorPickerChannelSliderBackground } from './color-picker-channel-slider-background.mjs';
+import { ColorPickerChannelSliderThumb } from './color-picker-channel-slider-thumb.mjs';
+import { ColorPickerChannelSliderTrack } from './color-picker-channel-slider-track.mjs';
+import { ColorPickerContent } from './color-picker-content.mjs';
 export { useColorPickerContext } from './color-picker-context.mjs';
-export { ColorPickerEyeDropperTrigger } from './color-picker-eye-dropper-trigger.mjs';
-export { ColorPickerSwatch } from './color-picker-swatch.mjs';
-export { ColorPickerSwatchBackground } from './color-picker-swatch-background.mjs';
+import { ColorPickerEyeDropperTrigger } from './color-picker-eye-dropper-trigger.mjs';
+import { ColorPickerSwatch } from './color-picker-swatch.mjs';
+import { ColorPickerSwatchBackground } from './color-picker-swatch-background.mjs';
 export { useColorPickerSwatchContext } from './color-picker-swatch-context.mjs';
-export { ColorPickerSwatchGroup } from './color-picker-swatch-group.mjs';
+import { ColorPickerSwatchGroup } from './color-picker-swatch-group.mjs';
 export { colorPickerAnatomy } from './color-picker.anatomy.mjs';
+
+const ColorPicker = Object.assign(ColorPicker$1, {
+  Root: ColorPicker$1,
+  Area: ColorPickerArea,
+  AreaGradient: ColorPickerAreaGradient,
+  AreaThumb: ColorPickerAreaThumb,
+  ChannelInput: ColorPickerChannelInput,
+  ChannelSliderBackground: ColorPickerChannelSliderBackground,
+  ChannelSliderThumb: ColorPickerChannelSliderThumb,
+  ChannelSliderTrack: ColorPickerChannelSliderTrack,
+  Content: ColorPickerContent,
+  EyeDropperTrigger: ColorPickerEyeDropperTrigger,
+  Swatch: ColorPickerSwatch,
+  SwatchBackground: ColorPickerSwatchBackground,
+  SwatchGroup: ColorPickerSwatchGroup
+});
+
+export { ColorPicker, ColorPickerArea, ColorPickerAreaGradient, ColorPickerAreaThumb, ColorPickerChannelInput, ColorPickerChannelSliderBackground, ColorPickerChannelSliderThumb, ColorPickerChannelSliderTrack, ColorPickerContent, ColorPickerEyeDropperTrigger, ColorPickerSwatch, ColorPickerSwatchBackground, ColorPickerSwatchGroup };

package/color-picker/use-color-picker.cjs

@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const colorPicker = require('@zag-js/color-picker');
 const solid = require('@zag-js/solid');
 const solidJs = require('solid-js');
+require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

package/color-picker/use-color-picker.d.ts

@@ -1,7 +1,7 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { Accessor } from 'solid-js';
 import * as colorPicker from '@zag-js/color-picker';
+import { type PropTypes } from '@zag-js/solid';
+import { type Accessor } from 'solid-js';
 import { type Optional } from '../types';
 export type UseColorPickerProps = Optional<colorPicker.Context, 'id'>;
-export type UseColorPickerReturn = ReturnType<typeof useColorPicker>;
-export declare const useColorPicker: (props: UseColorPickerProps) => Accessor<colorPicker.PublicApi<PropTypes>>;
+export type UseColorPickerReturn = Accessor<colorPicker.Api<PropTypes>>;
+export declare const useColorPicker: (props: UseColorPickerProps) => UseColorPickerReturn;

package/color-picker/use-color-picker.mjs

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

package/combobox/combobox-clear-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type ComboboxClearTriggerProps = HTMLArkProps<'button'>;
 export declare const ComboboxClearTrigger: (props: ComboboxClearTriggerProps) => JSX.Element;

package/combobox/combobox-content.cjs

@@ -10,7 +10,7 @@ const comboboxContext = require('./combobox-context.cjs');
 const ComboboxContent = props => {
   const combobox = comboboxContext.useComboboxContext();
   const contentProps = solid.mergeProps(() => combobox().contentProps, props);
-  return web.createComponent(factory.ark.ul, contentProps);
+  return web.createComponent(factory.ark.div, contentProps);
 };
 
 exports.ComboboxContent = ComboboxContent;

package/combobox/combobox-content.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
-export type ComboboxContentProps = HTMLArkProps<'ul'>;
+export type ComboboxContentProps = HTMLArkProps<'div'>;
 export declare const ComboboxContent: (props: ComboboxContentProps) => JSX.Element;

package/combobox/combobox-content.mjs

@@ -6,7 +6,7 @@ import { useComboboxContext } from './combobox-context.mjs';
 const ComboboxContent = props => {
   const combobox = useComboboxContext();
   const contentProps = mergeProps(() => combobox().contentProps, props);
-  return createComponent(ark.ul, contentProps);
+  return createComponent(ark.div, contentProps);
 };
 
 export { ComboboxContent };

package/combobox/combobox-context.d.ts

@@ -1,7 +1,4 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { PublicApi } from '@zag-js/combobox';
-import type { Accessor } from 'solid-js';
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import { type UseComboboxReturn } from './use-combobox';
 export type ComboboxContext = UseComboboxReturn;
-export declare const ComboboxProvider: ContextProviderComponent<Accessor<PublicApi<PropTypes>>>, useComboboxContext: () => Accessor<PublicApi<PropTypes>>;
+export declare const ComboboxProvider: ContextProviderComponent<UseComboboxReturn>, useComboboxContext: () => UseComboboxReturn;

package/combobox/combobox-control.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type ComboboxControlProps = HTMLArkProps<'div'>;
 export declare const ComboboxControl: (props: ComboboxControlProps) => JSX.Element;

package/combobox/combobox-input.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type ComboboxInputProps = HTMLArkProps<'input'>;
 export declare const ComboboxInput: (props: ComboboxInputProps) => JSX.Element;

package/combobox/combobox-label.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type ComboboxLabelProps = HTMLArkProps<'label'>;
 export declare const ComboboxLabel: (props: ComboboxLabelProps) => JSX.Element;

package/combobox/combobox-option-group-label.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const comboboxContext = require('./combobox-context.cjs');
+
+const ComboboxOptionGroupLabel = props => {
+  const [labelParams, restProps] = createSplitProps.createSplitProps()(props, ['htmlFor']);
+  const api = comboboxContext.useComboboxContext();
+  const groupLabelProps = solid.mergeProps(() => api().getOptionGroupLabelProps(labelParams), restProps);
+  return web.createComponent(factory.ark.div, groupLabelProps);
+};
+
+exports.ComboboxOptionGroupLabel = ComboboxOptionGroupLabel;

package/combobox/combobox-option-group-label.d.ts

@@ -0,0 +1,6 @@
+import { JSX } from 'solid-js';
+import type { OptionGroupLabelProps } from '@zag-js/select';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export type ComboboxOptionGroupLabelProps = Assign<HTMLArkProps<'div'>, OptionGroupLabelProps>;
+export declare const ComboboxOptionGroupLabel: (props: ComboboxOptionGroupLabelProps) => JSX.Element;

package/combobox/combobox-option-group-label.mjs

@@ -0,0 +1,14 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { useComboboxContext } from './combobox-context.mjs';
+
+const ComboboxOptionGroupLabel = props => {
+  const [labelParams, restProps] = createSplitProps()(props, ['htmlFor']);
+  const api = useComboboxContext();
+  const groupLabelProps = mergeProps(() => api().getOptionGroupLabelProps(labelParams), restProps);
+  return createComponent(ark.div, groupLabelProps);
+};
+
+export { ComboboxOptionGroupLabel };

package/combobox/combobox-option-group.cjs

@@ -4,13 +4,15 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
 const solid = require('@zag-js/solid');
+const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
 const comboboxContext = require('./combobox-context.cjs');
 
 const ComboboxOptionGroup = props => {
+  const [optionGroupProps, localProps] = createSplitProps.createSplitProps()(props, ['id']);
   const combobox = comboboxContext.useComboboxContext();
-  const contentProps = solid.mergeProps(() => combobox().contentProps, props);
-  return web.createComponent(factory.ark.ul, contentProps);
+  const mergedProps = solid.mergeProps(() => combobox().getOptionGroupProps(optionGroupProps), localProps);
+  return web.createComponent(factory.ark.div, mergedProps);
 };
 
 exports.ComboboxOptionGroup = ComboboxOptionGroup;

package/combobox/combobox-option-group.d.ts

@@ -1,6 +1,6 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import type { OptionGroupProps } from '@zag-js/combobox';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
-export type ComboboxOptionGroupProps = Assign<HTMLArkProps<'ul'>, OptionGroupProps>;
+export type ComboboxOptionGroupProps = Assign<HTMLArkProps<'div'>, OptionGroupProps>;
 export declare const ComboboxOptionGroup: (props: ComboboxOptionGroupProps) => JSX.Element;

package/combobox/combobox-option-group.mjs

@@ -1,12 +1,14 @@
 import { createComponent } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import { useComboboxContext } from './combobox-context.mjs';
 
 const ComboboxOptionGroup = props => {
+  const [optionGroupProps, localProps] = createSplitProps()(props, ['id']);
   const combobox = useComboboxContext();
-  const contentProps = mergeProps(() => combobox().contentProps, props);
-  return createComponent(ark.ul, contentProps);
+  const mergedProps = mergeProps(() => combobox().getOptionGroupProps(optionGroupProps), localProps);
+  return createComponent(ark.div, mergedProps);
 };
 
 export { ComboboxOptionGroup };

package/combobox/combobox-option.cjs

@@ -14,7 +14,7 @@ const ComboboxOption = props => {
   const [childrenProps, restProps] = solidJs.splitProps(localProps, ['children']);
   const combobox = comboboxContext.useComboboxContext();
   const mergedProps = solid.mergeProps(() => combobox().getOptionProps(optionProps), restProps);
-  return web.createComponent(factory.ark.li, web.mergeProps(mergedProps, {
+  return web.createComponent(factory.ark.div, web.mergeProps(mergedProps, {
     get children() {
       return childrenProps.children || optionProps.label;
     }

package/combobox/combobox-option.d.ts

@@ -1,8 +1,6 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
+import type { OptionProps } from '@zag-js/combobox';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
-import { useComboboxContext } from './combobox-context';
-type OptionProps = Parameters<ReturnType<ReturnType<typeof useComboboxContext>>['getOptionProps']>[0];
-export type ComboboxOptionProps = Assign<HTMLArkProps<'li'>, OptionProps>;
+export type ComboboxOptionProps = Assign<HTMLArkProps<'div'>, OptionProps>;
 export declare const ComboboxOption: (props: ComboboxOptionProps) => JSX.Element;
-export {};

package/combobox/combobox-option.mjs

@@ -10,7 +10,7 @@ const ComboboxOption = props => {
   const [childrenProps, restProps] = splitProps(localProps, ['children']);
   const combobox = useComboboxContext();
   const mergedProps = mergeProps(() => combobox().getOptionProps(optionProps), restProps);
-  return createComponent(ark.li, mergeProps$1(mergedProps, {
+  return createComponent(ark.div, mergeProps$1(mergedProps, {
     get children() {
       return childrenProps.children || optionProps.label;
     }

package/combobox/combobox-positioner.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type ComboboxPositionerProps = HTMLArkProps<'div'>;
 export declare const ComboboxPositioner: (props: ComboboxPositionerProps) => JSX.Element;

package/combobox/combobox-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type ComboboxTriggerProps = HTMLArkProps<'button'>;
 export declare const ComboboxTrigger: (props: ComboboxTriggerProps) => JSX.Element;

package/combobox/combobox.cjs

@@ -11,7 +11,7 @@ const comboboxContext = require('./combobox-context.cjs');
 const useCombobox = require('./use-combobox.cjs');
 
 const Combobox = props => {
-  const [useComboboxProps, localProps] = createSplitProps.createSplitProps()(props, ['allowCustomValue', 'ariaHidden', 'autoFocus', 'blurOnSelect', 'dir', 'disabled', 'focusOnClear', 'form', 'getRootNode', 'id', 'ids', 'inputBehavior', 'inputValue', 'invalid', 'isCustomValue', 'loop', 'name', 'onClose', 'onHighlight', 'onInputChange', 'onInputChange', 'onInteractOutside', 'onOpen', 'onSelect', 'openOnClick', 'placeholder', 'positioning', 'readOnly', 'selectInputOnFocus', 'selectOnTab', 'selectionBehavior', 'selectionData', 'translations']);
+  const [useComboboxProps, localProps] = createSplitProps.createSplitProps()(props, ['allowCustomValue', 'ariaHidden', 'autoFocus', 'blurOnSelect', 'dir', 'disabled', 'focusOnClear', 'form', 'getRootNode', 'id', 'ids', 'inputBehavior', 'inputValue', 'invalid', 'isCustomValue', 'loop', 'name', 'onClose', 'onFocusOutside', 'onHighlight', 'onInputChange', 'onInputChange', 'onInteractOutside', 'onInteractOutside', 'onOpen', 'onPointerDownOutside', 'onSelect', 'openOnClick', 'placeholder', 'positioning', 'readOnly', 'selectionBehavior', 'selectionData', 'selectOnTab', 'translations']);
   const combobox = useCombobox.useCombobox(useComboboxProps);
   const rootProps = solid.mergeProps(() => combobox().rootProps, localProps);
   const getChildren = () => runIfFn.runIfFn(localProps.children, combobox);

package/combobox/combobox.mjs

@@ -7,7 +7,7 @@ import { ComboboxProvider } from './combobox-context.mjs';
 import { useCombobox } from './use-combobox.mjs';
 
 const Combobox = props => {
-  const [useComboboxProps, localProps] = createSplitProps()(props, ['allowCustomValue', 'ariaHidden', 'autoFocus', 'blurOnSelect', 'dir', 'disabled', 'focusOnClear', 'form', 'getRootNode', 'id', 'ids', 'inputBehavior', 'inputValue', 'invalid', 'isCustomValue', 'loop', 'name', 'onClose', 'onHighlight', 'onInputChange', 'onInputChange', 'onInteractOutside', 'onOpen', 'onSelect', 'openOnClick', 'placeholder', 'positioning', 'readOnly', 'selectInputOnFocus', 'selectOnTab', 'selectionBehavior', 'selectionData', 'translations']);
+  const [useComboboxProps, localProps] = createSplitProps()(props, ['allowCustomValue', 'ariaHidden', 'autoFocus', 'blurOnSelect', 'dir', 'disabled', 'focusOnClear', 'form', 'getRootNode', 'id', 'ids', 'inputBehavior', 'inputValue', 'invalid', 'isCustomValue', 'loop', 'name', 'onClose', 'onFocusOutside', 'onHighlight', 'onInputChange', 'onInputChange', 'onInteractOutside', 'onInteractOutside', 'onOpen', 'onPointerDownOutside', 'onSelect', 'openOnClick', 'placeholder', 'positioning', 'readOnly', 'selectionBehavior', 'selectionData', 'selectOnTab', 'translations']);
   const combobox = useCombobox(useComboboxProps);
   const rootProps = mergeProps(() => combobox().rootProps, localProps);
   const getChildren = () => runIfFn(localProps.children, combobox);

package/combobox/combobox.stories.d.ts

@@ -0,0 +1,5 @@
+import { JSX } from 'solid-js';
+import type { Meta } from 'storybook-solidjs';
+declare const meta: Meta;
+export default meta;
+export declare const Basic: () => JSX.Element;

package/combobox/combobox.test.d.ts

@@ -0,0 +1 @@
+export {};

package/combobox/index.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const combobox = require('./combobox.cjs');
+const combobox$1 = require('./combobox.cjs');
 const comboboxClearTrigger = require('./combobox-clear-trigger.cjs');
 const comboboxContent = require('./combobox-content.cjs');
 const comboboxContext = require('./combobox-context.cjs');
@@ -11,13 +11,25 @@ const comboboxInput = require('./combobox-input.cjs');
 const comboboxLabel = require('./combobox-label.cjs');
 const comboboxOption = require('./combobox-option.cjs');
 const comboboxOptionGroup = require('./combobox-option-group.cjs');
+const comboboxOptionGroupLabel = require('./combobox-option-group-label.cjs');
 const comboboxPositioner = require('./combobox-positioner.cjs');
 const comboboxTrigger = require('./combobox-trigger.cjs');
-const combobox$1 = require('@zag-js/combobox');
-
+const combobox = require('@zag-js/combobox');
 
+const Combobox = Object.assign(combobox$1.Combobox, {
+  Root: combobox$1.Combobox,
+  ClearTrigger: comboboxClearTrigger.ComboboxClearTrigger,
+  Content: comboboxContent.ComboboxContent,
+  Control: comboboxControl.ComboboxControl,
+  Input: comboboxInput.ComboboxInput,
+  Label: comboboxLabel.ComboboxLabel,
+  Option: comboboxOption.ComboboxOption,
+  OptionGroup: comboboxOptionGroup.ComboboxOptionGroup,
+  OptionGroupLabel: comboboxOptionGroupLabel.ComboboxOptionGroupLabel,
+  Positioner: comboboxPositioner.ComboboxPositioner,
+  Trigger: comboboxTrigger.ComboboxTrigger
+});
 
-exports.Combobox = combobox.Combobox;
 exports.ComboboxClearTrigger = comboboxClearTrigger.ComboboxClearTrigger;
 exports.ComboboxContent = comboboxContent.ComboboxContent;
 exports.useComboboxContext = comboboxContext.useComboboxContext;
@@ -26,9 +38,11 @@ exports.ComboboxInput = comboboxInput.ComboboxInput;
 exports.ComboboxLabel = comboboxLabel.ComboboxLabel;
 exports.ComboboxOption = comboboxOption.ComboboxOption;
 exports.ComboboxOptionGroup = comboboxOptionGroup.ComboboxOptionGroup;
+exports.ComboboxOptionGroupLabel = comboboxOptionGroupLabel.ComboboxOptionGroupLabel;
 exports.ComboboxPositioner = comboboxPositioner.ComboboxPositioner;
 exports.ComboboxTrigger = comboboxTrigger.ComboboxTrigger;
 Object.defineProperty(exports, 'comboboxAnatomy', {
-	enumerable: true,
-	get: () => combobox$1.anatomy
+  enumerable: true,
+  get: () => combobox.anatomy
 });
+exports.Combobox = Combobox;

package/combobox/index.d.ts

@@ -1,12 +1,29 @@
-export { Combobox, type ComboboxProps } from './combobox';
-export { ComboboxClearTrigger, type ComboboxClearTriggerProps } from './combobox-clear-trigger';
-export { ComboboxContent, type ComboboxContentProps } from './combobox-content';
-export { useComboboxContext } from './combobox-context';
-export { ComboboxControl, type ComboboxControlProps } from './combobox-control';
-export { ComboboxInput, type ComboboxInputProps } from './combobox-input';
-export { ComboboxLabel, type ComboboxLabelProps } from './combobox-label';
-export { ComboboxOption, type ComboboxOptionProps } from './combobox-option';
-export { ComboboxOptionGroup, type ComboboxOptionGroupProps } from './combobox-option-group';
-export { ComboboxPositioner, type ComboboxPositionerProps } from './combobox-positioner';
-export { ComboboxTrigger, type ComboboxTriggerProps } from './combobox-trigger';
-export { comboboxAnatomy } from './combobox.anatomy';
+import { JSX } from 'solid-js';
+import { type ComboboxProps } from './combobox';
+import { ComboboxClearTrigger, type ComboboxClearTriggerProps } from './combobox-clear-trigger';
+import { ComboboxContent, type ComboboxContentProps } from './combobox-content';
+import { useComboboxContext } from './combobox-context';
+import { ComboboxControl, type ComboboxControlProps } from './combobox-control';
+import { ComboboxInput, type ComboboxInputProps } from './combobox-input';
+import { ComboboxLabel, type ComboboxLabelProps } from './combobox-label';
+import { ComboboxOption, type ComboboxOptionProps } from './combobox-option';
+import { ComboboxOptionGroup, type ComboboxOptionGroupProps } from './combobox-option-group';
+import { ComboboxOptionGroupLabel, type ComboboxOptionGroupLabelProps } from './combobox-option-group-label';
+import { ComboboxPositioner, type ComboboxPositionerProps } from './combobox-positioner';
+import { ComboboxTrigger, type ComboboxTriggerProps } from './combobox-trigger';
+import { comboboxAnatomy } from './combobox.anatomy';
+declare const Combobox: ((props: ComboboxProps) => JSX.Element) & {
+    Root: (props: ComboboxProps) => JSX.Element;
+    ClearTrigger: (props: ComboboxClearTriggerProps) => JSX.Element;
+    Content: (props: ComboboxContentProps) => JSX.Element;
+    Control: (props: ComboboxControlProps) => JSX.Element;
+    Input: (props: ComboboxInputProps) => JSX.Element;
+    Label: (props: ComboboxLabelProps) => JSX.Element;
+    Option: (props: ComboboxOptionProps) => JSX.Element;
+    OptionGroup: (props: ComboboxOptionGroupProps) => JSX.Element;
+    OptionGroupLabel: (props: ComboboxOptionGroupLabelProps) => JSX.Element;
+    Positioner: (props: ComboboxPositionerProps) => JSX.Element;
+    Trigger: (props: ComboboxTriggerProps) => JSX.Element;
+};
+export { Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxLabel, ComboboxOption, ComboboxOptionGroup, ComboboxOptionGroupLabel, ComboboxPositioner, ComboboxTrigger, comboboxAnatomy, useComboboxContext, };
+export type { ComboboxClearTriggerProps, ComboboxContentProps, ComboboxControlProps, ComboboxInputProps, ComboboxLabelProps, ComboboxOptionGroupLabelProps, ComboboxOptionGroupProps, ComboboxOptionProps, ComboboxPositionerProps, ComboboxProps, ComboboxTriggerProps, };

package/combobox/index.mjs

@@ -1,12 +1,29 @@
-export { Combobox } from './combobox.mjs';
-export { ComboboxClearTrigger } from './combobox-clear-trigger.mjs';
-export { ComboboxContent } from './combobox-content.mjs';
+import { Combobox as Combobox$1 } from './combobox.mjs';
+import { ComboboxClearTrigger } from './combobox-clear-trigger.mjs';
+import { ComboboxContent } from './combobox-content.mjs';
 export { useComboboxContext } from './combobox-context.mjs';
-export { ComboboxControl } from './combobox-control.mjs';
-export { ComboboxInput } from './combobox-input.mjs';
-export { ComboboxLabel } from './combobox-label.mjs';
-export { ComboboxOption } from './combobox-option.mjs';
-export { ComboboxOptionGroup } from './combobox-option-group.mjs';
-export { ComboboxPositioner } from './combobox-positioner.mjs';
-export { ComboboxTrigger } from './combobox-trigger.mjs';
+import { ComboboxControl } from './combobox-control.mjs';
+import { ComboboxInput } from './combobox-input.mjs';
+import { ComboboxLabel } from './combobox-label.mjs';
+import { ComboboxOption } from './combobox-option.mjs';
+import { ComboboxOptionGroup } from './combobox-option-group.mjs';
+import { ComboboxOptionGroupLabel } from './combobox-option-group-label.mjs';
+import { ComboboxPositioner } from './combobox-positioner.mjs';
+import { ComboboxTrigger } from './combobox-trigger.mjs';
 export { anatomy as comboboxAnatomy } from '@zag-js/combobox';
+
+const Combobox = Object.assign(Combobox$1, {
+  Root: Combobox$1,
+  ClearTrigger: ComboboxClearTrigger,
+  Content: ComboboxContent,
+  Control: ComboboxControl,
+  Input: ComboboxInput,
+  Label: ComboboxLabel,
+  Option: ComboboxOption,
+  OptionGroup: ComboboxOptionGroup,
+  OptionGroupLabel: ComboboxOptionGroupLabel,
+  Positioner: ComboboxPositioner,
+  Trigger: ComboboxTrigger
+});
+
+export { Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxLabel, ComboboxOption, ComboboxOptionGroup, ComboboxOptionGroupLabel, ComboboxPositioner, ComboboxTrigger };

package/combobox/use-combobox.cjs

@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const combobox = require('@zag-js/combobox');
 const solid = require('@zag-js/solid');
 const solidJs = require('solid-js');
+require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

package/combobox/use-combobox.d.ts

@@ -1,7 +1,7 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { Accessor } from 'solid-js';
 import * as combobox from '@zag-js/combobox';
+import { type PropTypes } from '@zag-js/solid';
+import { type Accessor } from 'solid-js';
 import { type Optional } from '../types';
 export type UseComboboxProps = Optional<combobox.Context, 'id'>;
-export type UseComboboxReturn = ReturnType<typeof useCombobox>;
-export declare const useCombobox: (props: UseComboboxProps) => Accessor<combobox.PublicApi<PropTypes>>;
+export type UseComboboxReturn = Accessor<combobox.Api<PropTypes>>;
+export declare const useCombobox: (props: UseComboboxProps) => UseComboboxReturn;

package/combobox/use-combobox.mjs

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

package/create-split-props.test.d.ts

@@ -0,0 +1 @@
+export {};

package/date-picker/date-picker-cell-context.d.ts

@@ -1,3 +1,3 @@
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import type { CellProps } from '@zag-js/date-picker';
 export declare const DatePickerCellProvider: ContextProviderComponent<CellProps>, useDatePickerCellContext: () => CellProps;

package/date-picker/date-picker-clear-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerClearTriggerProps = HTMLArkProps<'button'>;
 export declare const DatePickerClearTrigger: (props: DatePickerClearTriggerProps) => JSX.Element;

package/date-picker/date-picker-column-header.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerColumnHeaderProps = HTMLArkProps<'div'>;
 export declare const DatePickerColumnHeader: (props: DatePickerColumnHeaderProps) => JSX.Element;

package/date-picker/date-picker-content.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerContentProps = HTMLArkProps<'div'>;
 export declare const DatePickerContent: (props: DatePickerContentProps) => JSX.Element;

package/date-picker/date-picker-context.d.ts

@@ -1,7 +1,4 @@
-import type { PropTypes } from '@zag-js/solid';
-import type { PublicApi } from '@zag-js/date-picker';
-import type { Accessor } from 'solid-js';
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import { type UseDatePickerReturn } from './use-date-picker';
 export type DatePickerContext = UseDatePickerReturn;
-export declare const DatePickerProvider: ContextProviderComponent<Accessor<PublicApi<PropTypes>>>, useDatePickerContext: () => Accessor<PublicApi<PropTypes>>;
+export declare const DatePickerProvider: ContextProviderComponent<UseDatePickerReturn>, useDatePickerContext: () => UseDatePickerReturn;

package/date-picker/date-picker-control.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerControlProps = HTMLArkProps<'div'>;
 export declare const DatePickerControl: (props: DatePickerControlProps) => JSX.Element;

package/date-picker/date-picker-day-cell-context.d.ts

@@ -1,3 +1,3 @@
-import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
+import { ContextProviderComponent } from 'solid-js';
 import type { DayCellProps } from '@zag-js/date-picker';
 export declare const DatePickerDayCellProvider: ContextProviderComponent<DayCellProps>, useDatePickerDayCellContext: () => DayCellProps;

package/date-picker/date-picker-day-cell-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerDayCellTriggerProps = HTMLArkProps<'button'>;
 export declare const DatePickerDayCellTrigger: (props: DatePickerDayCellTriggerProps) => JSX.Element;

package/date-picker/date-picker-day-cell.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import type { DayCellProps } from '@zag-js/date-picker';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';

package/date-picker/date-picker-grid.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import type { GridProps } from '@zag-js/date-picker';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';

package/date-picker/date-picker-input.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerInputProps = HTMLArkProps<'input'>;
 export declare const DatePickerInput: (props: DatePickerInputProps) => JSX.Element;

package/date-picker/date-picker-month-cell-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerMonthCellTriggerProps = HTMLArkProps<'button'>;
 export declare const DatePickerMonthCellTrigger: (props: DatePickerMonthCellTriggerProps) => JSX.Element;

package/date-picker/date-picker-month-cell.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import type { CellProps } from '@zag-js/date-picker';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';