@ark-ui/solid 0.2.0 → 0.4.0

package/dist/rating-group/rating-context.d.ts

@@ -1,16 +1,6 @@
+import type { ItemState } from '@zag-js/rating-group/dist/rating-group.types';
 import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
 import { type connect } from '@zag-js/rating-group';
+import type { Accessor } from 'solid-js';
 export type RatingContext = ReturnType<ReturnType<typeof connect>['getRatingState']>;
-export declare const RatingProvider: ContextProviderComponent<{
-    isEqual: boolean;
-    isValueEmpty: boolean;
-    isHighlighted: boolean;
-    isHalf: boolean;
-    isChecked: boolean;
-}>, useRatingContext: () => {
-    isEqual: boolean;
-    isValueEmpty: boolean;
-    isHighlighted: boolean;
-    isHalf: boolean;
-    isChecked: boolean;
-};
+export declare const RatingProvider: ContextProviderComponent<Accessor<ItemState>>, useRatingContext: () => Accessor<ItemState>;

package/dist/rating-group/rating-group-context.d.ts

@@ -1,3 +1,4 @@
+import type { ItemProps, ItemState } from '@zag-js/rating-group/dist/rating-group.types';
 import type { Accessor, JSX } from 'solid-js';
 import type { ContextProviderComponent } from 'solid-js/types/reactive/signal';
 import { type UseRatingGroupReturn } from './use-rating-group';
@@ -10,20 +11,12 @@ export declare const RatingGroupProvider: ContextProviderComponent<Accessor<{
     hoveredValue: number;
     size: number;
     sizeArray: number[];
-    getRatingState(index: number): {
-        isEqual: boolean;
-        isValueEmpty: boolean;
-        isHighlighted: boolean;
-        isHalf: boolean;
-        isChecked: boolean;
-    };
+    getRatingState(props: ItemProps): ItemState;
     rootProps: JSX.HTMLAttributes<any>;
     hiddenInputProps: JSX.InputHTMLAttributes<HTMLInputElement>;
     labelProps: JSX.HTMLAttributes<any>;
     controlProps: JSX.HTMLAttributes<any>;
-    getRatingProps({ index }: {
-        index: number;
-    }): JSX.HTMLAttributes<any>;
+    getRatingProps(props: ItemProps): JSX.HTMLAttributes<any>;
 }>>, useRatingGroupContext: () => Accessor<{
     setValue(value: number): void;
     clearValue(): void;
@@ -32,18 +25,10 @@ export declare const RatingGroupProvider: ContextProviderComponent<Accessor<{
     hoveredValue: number;
     size: number;
     sizeArray: number[];
-    getRatingState(index: number): {
-        isEqual: boolean;
-        isValueEmpty: boolean;
-        isHighlighted: boolean;
-        isHalf: boolean;
-        isChecked: boolean;
-    };
+    getRatingState(props: ItemProps): ItemState;
     rootProps: JSX.HTMLAttributes<any>;
     hiddenInputProps: JSX.InputHTMLAttributes<HTMLInputElement>;
     labelProps: JSX.HTMLAttributes<any>;
     controlProps: JSX.HTMLAttributes<any>;
-    getRatingProps({ index }: {
-        index: number;
-    }): JSX.HTMLAttributes<any>;
+    getRatingProps(props: ItemProps): JSX.HTMLAttributes<any>;
 }>;

package/dist/rating-group/rating-group-control.cjs

@@ -3,17 +3,18 @@
 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 runIfFn = require('../run-if-fn.cjs');
 const ratingGroupContext = require('./rating-group-context.cjs');
 
 const RatingGroupControl = props => {
-  const ratingGroup = ratingGroupContext.useRatingGroupContext();
-  const view = solidJs.children(() => runIfFn.runIfFn(props.children, ratingGroup));
-  return web.createComponent(factory.ark.div, web.mergeProps(() => ratingGroup().controlProps, props, {
+  const api = ratingGroupContext.useRatingGroupContext();
+  const getChildren = () => runIfFn.runIfFn(props.children, api);
+  const controlProps = solid.mergeProps(() => api().controlProps, props);
+  return web.createComponent(factory.ark.div, web.mergeProps(controlProps, {
     get children() {
-      return view();
+      return getChildren();
     }
   }));
 };

package/dist/rating-group/rating-group-control.d.ts

@@ -1,7 +1,8 @@
 import { type JSX } from 'solid-js/jsx-runtime';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 import { type RatingGroupContext } from './rating-group-context';
-export type RatingGroupControlProps = Omit<HTMLArkProps<'div'>, 'children'> & {
+export type RatingGroupControlProps = Assign<HTMLArkProps<'div'>, {
     children: JSX.Element | ((context: RatingGroupContext) => JSX.Element);
-};
+}>;
 export declare const RatingGroupControl: (props: RatingGroupControlProps) => JSX.Element;

package/dist/rating-group/rating-group-control.mjs

@@ -1,15 +1,16 @@
-import { createComponent, mergeProps } from 'solid-js/web';
-import { children } from 'solid-js';
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { runIfFn } from '../run-if-fn.mjs';
 import { useRatingGroupContext } from './rating-group-context.mjs';
 
 const RatingGroupControl = props => {
-  const ratingGroup = useRatingGroupContext();
-  const view = children(() => runIfFn(props.children, ratingGroup));
-  return createComponent(ark.div, mergeProps(() => ratingGroup().controlProps, props, {
+  const api = useRatingGroupContext();
+  const getChildren = () => runIfFn(props.children, api);
+  const controlProps = mergeProps(() => api().controlProps, props);
+  return createComponent(ark.div, mergeProps$1(controlProps, {
     get children() {
-      return view();
+      return getChildren();
     }
   }));
 };

package/dist/rating-group/rating-group-label.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const ratingGroupContext = require('./rating-group-context.cjs');
 
 const RatingGroupLabel = props => {
   const ratingGroup = ratingGroupContext.useRatingGroupContext();
-  return web.createComponent(factory.ark.label, web.mergeProps(() => ratingGroup().labelProps, props));
+  const labelProps = solid.mergeProps(() => ratingGroup().labelProps, props);
+  return web.createComponent(factory.ark.label, labelProps);
 };
 
 exports.RatingGroupLabel = RatingGroupLabel;

package/dist/rating-group/rating-group-label.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useRatingGroupContext } from './rating-group-context.mjs';
 
 const RatingGroupLabel = props => {
   const ratingGroup = useRatingGroupContext();
-  return createComponent(ark.label, mergeProps(() => ratingGroup().labelProps, props));
+  const labelProps = mergeProps(() => ratingGroup().labelProps, props);
+  return createComponent(ark.label, labelProps);
 };
 
 export { RatingGroupLabel };

package/dist/rating-group/rating-group.cjs

@@ -3,20 +3,22 @@
 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 ratingGroupContext = require('./rating-group-context.cjs');
 const useRatingGroup = require('./use-rating-group.cjs');
 
 const RatingGroup = props => {
-  const [useRatingGroupProps, inputProps] = createSplitProps.createSplitProps()(props, ['allowHalf', 'autoFocus', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'max', 'name', 'onChange', 'onHover', 'readOnly', 'translations', 'value']);
-  const ratingGroup = useRatingGroup.useRatingGroup(useRatingGroupProps);
+  const [ratingParams, restProps] = createSplitProps.createSplitProps()(props, ['allowHalf', 'autoFocus', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'max', 'name', 'onChange', 'onHover', 'readOnly', 'translations', 'value']);
+  const api = useRatingGroup.useRatingGroup(ratingParams);
+  const rootProps = solid.mergeProps(() => api().rootProps, restProps);
   return web.createComponent(ratingGroupContext.RatingGroupProvider, {
-    value: ratingGroup,
+    value: api,
     get children() {
-      return web.createComponent(factory.ark.div, web.mergeProps(() => ratingGroup().rootProps, {
+      return web.createComponent(factory.ark.div, web.mergeProps(rootProps, {
         get children() {
-          return [web.memo(() => props.children), web.createComponent(factory.ark.input, web.mergeProps(() => ratingGroup().hiddenInputProps, inputProps))];
+          return [web.memo(() => restProps.children), web.createComponent(factory.ark.input, web.mergeProps(() => api().hiddenInputProps))];
         }
       }));
     }

package/dist/rating-group/rating-group.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 import { type UseRatingGroupProps } from './use-rating-group';
-export type RatingGroupProps = Assign<HTMLArkProps<'input'>, UseRatingGroupProps>;
+export type RatingGroupProps = Assign<HTMLArkProps<'div'>, UseRatingGroupProps>;
 export declare const RatingGroup: (props: RatingGroupProps) => JSX.Element;

package/dist/rating-group/rating-group.mjs

@@ -1,18 +1,20 @@
-import { createComponent, mergeProps, memo } from 'solid-js/web';
+import { createComponent, mergeProps as mergeProps$1, memo } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import { RatingGroupProvider } from './rating-group-context.mjs';
 import { useRatingGroup } from './use-rating-group.mjs';
 
 const RatingGroup = props => {
-  const [useRatingGroupProps, inputProps] = createSplitProps()(props, ['allowHalf', 'autoFocus', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'max', 'name', 'onChange', 'onHover', 'readOnly', 'translations', 'value']);
-  const ratingGroup = useRatingGroup(useRatingGroupProps);
+  const [ratingParams, restProps] = createSplitProps()(props, ['allowHalf', 'autoFocus', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'max', 'name', 'onChange', 'onHover', 'readOnly', 'translations', 'value']);
+  const api = useRatingGroup(ratingParams);
+  const rootProps = mergeProps(() => api().rootProps, restProps);
   return createComponent(RatingGroupProvider, {
-    value: ratingGroup,
+    value: api,
     get children() {
-      return createComponent(ark.div, mergeProps(() => ratingGroup().rootProps, {
+      return createComponent(ark.div, mergeProps$1(rootProps, {
         get children() {
-          return [memo(() => props.children), createComponent(ark.input, mergeProps(() => ratingGroup().hiddenInputProps, inputProps))];
+          return [memo(() => restProps.children), createComponent(ark.input, mergeProps$1(() => api().hiddenInputProps))];
         }
       }));
     }

package/dist/rating-group/rating.cjs

@@ -3,24 +3,25 @@
 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 createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
 const runIfFn = require('../run-if-fn.cjs');
 const ratingContext = require('./rating-context.cjs');
 const ratingGroupContext = require('./rating-group-context.cjs');
 
 const Rating = props => {
-  const ratingGroup = ratingGroupContext.useRatingGroupContext();
-  const ratingState = ratingGroup().getRatingState(props.index);
-  const view = solidJs.children(() => runIfFn.runIfFn(props.children, ratingState));
-  return web.createComponent(factory.ark.span, web.mergeProps(() => ratingGroup().getRatingProps({
-    index: props.index
-  }), props, {
+  const [ratingParams, restProps] = createSplitProps.createSplitProps()(props, ['index']);
+  const api = ratingGroupContext.useRatingGroupContext();
+  const ratingState = () => api().getRatingState(ratingParams);
+  const getChildren = () => runIfFn.runIfFn(restProps.children, ratingState);
+  const ratingProps = solid.mergeProps(() => api().getRatingProps(ratingParams), restProps);
+  return web.createComponent(factory.ark.span, web.mergeProps(ratingProps, {
     get children() {
       return web.createComponent(ratingContext.RatingProvider, {
         value: ratingState,
         get children() {
-          return view();
+          return getChildren();
         }
       });
     }

package/dist/rating-group/rating.d.ts

@@ -1,8 +1,10 @@
+import type { ItemProps } from '@zag-js/rating-group';
+import type { Accessor } from 'solid-js';
 import { type JSX } from 'solid-js/jsx-runtime';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 import { type RatingContext } from './rating-context';
-export type RatingProps = Omit<HTMLArkProps<'span'>, 'children'> & {
-    index: number;
-    children: (state: RatingContext) => JSX.Element | JSX.Element;
-};
+export type RatingProps = Assign<HTMLArkProps<'span'>, ItemProps & {
+    children: (state: Accessor<RatingContext>) => JSX.Element | JSX.Element;
+}>;
 export declare const Rating: (props: RatingProps) => JSX.Element;

package/dist/rating-group/rating.mjs

@@ -1,22 +1,23 @@
-import { createComponent, mergeProps } from 'solid-js/web';
-import { children } from 'solid-js';
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import { runIfFn } from '../run-if-fn.mjs';
 import { RatingProvider } from './rating-context.mjs';
 import { useRatingGroupContext } from './rating-group-context.mjs';
 
 const Rating = props => {
-  const ratingGroup = useRatingGroupContext();
-  const ratingState = ratingGroup().getRatingState(props.index);
-  const view = children(() => runIfFn(props.children, ratingState));
-  return createComponent(ark.span, mergeProps(() => ratingGroup().getRatingProps({
-    index: props.index
-  }), props, {
+  const [ratingParams, restProps] = createSplitProps()(props, ['index']);
+  const api = useRatingGroupContext();
+  const ratingState = () => api().getRatingState(ratingParams);
+  const getChildren = () => runIfFn(restProps.children, ratingState);
+  const ratingProps = mergeProps(() => api().getRatingProps(ratingParams), restProps);
+  return createComponent(ark.span, mergeProps$1(ratingProps, {
     get children() {
       return createComponent(RatingProvider, {
         value: ratingState,
         get children() {
-          return view();
+          return getChildren();
         }
       });
     }

package/dist/rating-group/use-rating-group.cjs

@@ -28,7 +28,7 @@ const rating__namespace = /*#__PURE__*/_interopNamespaceDefault(rating);
 
 const useRatingGroup = props => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solidJs.mergeProps({
+  const context = solid.mergeProps({
     id: solidJs.createUniqueId(),
     getRootNode
   }, props);

package/dist/rating-group/use-rating-group.d.ts

@@ -11,18 +11,10 @@ export declare const useRatingGroup: (props: UseRatingGroupProps) => Accessor<{
     hoveredValue: number;
     size: number;
     sizeArray: number[];
-    getRatingState(index: number): {
-        isEqual: boolean;
-        isValueEmpty: boolean;
-        isHighlighted: boolean;
-        isHalf: boolean;
-        isChecked: boolean;
-    };
+    getRatingState(props: rating.ItemProps): rating.ItemState;
     rootProps: JSX.HTMLAttributes<any>;
     hiddenInputProps: JSX.InputHTMLAttributes<HTMLInputElement>;
     labelProps: JSX.HTMLAttributes<any>;
     controlProps: JSX.HTMLAttributes<any>;
-    getRatingProps({ index }: {
-        index: number;
-    }): JSX.HTMLAttributes<any>;
+    getRatingProps(props: rating.ItemProps): JSX.HTMLAttributes<any>;
 }>;

package/dist/rating-group/use-rating-group.mjs

@@ -1,6 +1,6 @@
 import * as rating from '@zag-js/rating-group';
-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 useRatingGroup = props => {

package/dist/select/select-content.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const selectContext = require('./select-context.cjs');
 
 const SelectContent = props => {
-  const select = selectContext.useSelectContext();
-  return web.createComponent(factory.ark.ul, web.mergeProps(() => select().contentProps, props));
+  const api = selectContext.useSelectContext();
+  const contentProps = solid.mergeProps(() => api().contentProps, props);
+  return web.createComponent(factory.ark.ul, contentProps);
 };
 
 exports.SelectContent = SelectContent;

package/dist/select/select-content.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useSelectContext } from './select-context.mjs';
 
 const SelectContent = props => {
-  const select = useSelectContext();
-  return createComponent(ark.ul, mergeProps(() => select().contentProps, props));
+  const api = useSelectContext();
+  const contentProps = mergeProps(() => api().contentProps, props);
+  return createComponent(ark.ul, contentProps);
 };
 
 export { SelectContent };

package/dist/select/select-label.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const selectContext = require('./select-context.cjs');
 
 const SelectLabel = props => {
-  const select = selectContext.useSelectContext();
-  return web.createComponent(factory.ark.label, web.mergeProps(() => select().labelProps, props));
+  const api = selectContext.useSelectContext();
+  const labelProps = solid.mergeProps(() => api().labelProps, props);
+  return web.createComponent(factory.ark.label, labelProps);
 };
 
 exports.SelectLabel = SelectLabel;

package/dist/select/select-label.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useSelectContext } from './select-context.mjs';
 
 const SelectLabel = props => {
-  const select = useSelectContext();
-  return createComponent(ark.label, mergeProps(() => select().labelProps, props));
+  const api = useSelectContext();
+  const labelProps = mergeProps(() => api().labelProps, props);
+  return createComponent(ark.label, labelProps);
 };
 
 export { SelectLabel };

package/dist/select/select-option-group-label.cjs

@@ -3,14 +3,16 @@
 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 selectContext = require('./select-context.cjs');
 
 const SelectOptionGroupLabel = props => {
-  const [optionProps, labelProps] = createSplitProps.createSplitProps()(props, ['htmlFor']);
-  const select = selectContext.useSelectContext();
-  return web.createComponent(factory.ark.label, web.mergeProps(() => select().getOptionGroupLabelProps(optionProps), labelProps));
+  const [labelParams, restProps] = createSplitProps.createSplitProps()(props, ['htmlFor']);
+  const api = selectContext.useSelectContext();
+  const groupLabelProps = solid.mergeProps(() => api().getOptionGroupLabelProps(labelParams), restProps);
+  return web.createComponent(factory.ark.label, groupLabelProps);
 };
 
 exports.SelectOptionGroupLabel = SelectOptionGroupLabel;

package/dist/select/select-option-group-label.d.ts

@@ -1,9 +1,9 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
-type OptionGroupLabelProps = {
+import type { Assign } from '../types';
+type GroupLabelParams = {
     htmlFor: string;
 };
-export type SelectOptionGroupLabelProps = Assign<HTMLArkProps<'label'>, OptionGroupLabelProps>;
+export type SelectOptionGroupLabelProps = Assign<HTMLArkProps<'label'>, GroupLabelParams>;
 export declare const SelectOptionGroupLabel: (props: SelectOptionGroupLabelProps) => JSX.Element;
 export {};

package/dist/select/select-option-group-label.mjs

@@ -1,12 +1,14 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+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 { useSelectContext } from './select-context.mjs';
 
 const SelectOptionGroupLabel = props => {
-  const [optionProps, labelProps] = createSplitProps()(props, ['htmlFor']);
-  const select = useSelectContext();
-  return createComponent(ark.label, mergeProps(() => select().getOptionGroupLabelProps(optionProps), labelProps));
+  const [labelParams, restProps] = createSplitProps()(props, ['htmlFor']);
+  const api = useSelectContext();
+  const groupLabelProps = mergeProps(() => api().getOptionGroupLabelProps(labelParams), restProps);
+  return createComponent(ark.label, groupLabelProps);
 };
 
 export { SelectOptionGroupLabel };

package/dist/select/select-option-group.cjs

@@ -3,14 +3,16 @@
 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 selectContext = require('./select-context.cjs');
 
 const SelectOptionGroup = props => {
-  const [getOptionGroupProps, divProps] = createSplitProps.createSplitProps()(props, ['id']);
-  const select = selectContext.useSelectContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => select().getOptionGroupProps(getOptionGroupProps), divProps));
+  const [optionGroupParams, restProps] = createSplitProps.createSplitProps()(props, ['id']);
+  const api = selectContext.useSelectContext();
+  const groupProps = solid.mergeProps(() => api().getOptionGroupProps(optionGroupParams), restProps);
+  return web.createComponent(factory.ark.div, groupProps);
 };
 
 exports.SelectOptionGroup = SelectOptionGroup;

package/dist/select/select-option-group.d.ts

@@ -1,9 +1,9 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
-type GetOptionGroupProps = {
+import type { Assign } from '../types';
+type OptionGroupParams = {
     id: string;
 };
-export type SelectOptionGroupProps = Assign<HTMLArkProps<'div'>, GetOptionGroupProps>;
+export type SelectOptionGroupProps = Assign<HTMLArkProps<'div'>, OptionGroupParams>;
 export declare const SelectOptionGroup: (props: SelectOptionGroupProps) => JSX.Element;
 export {};

package/dist/select/select-option-group.mjs

@@ -1,12 +1,14 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+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 { useSelectContext } from './select-context.mjs';
 
 const SelectOptionGroup = props => {
-  const [getOptionGroupProps, divProps] = createSplitProps()(props, ['id']);
-  const select = useSelectContext();
-  return createComponent(ark.div, mergeProps(() => select().getOptionGroupProps(getOptionGroupProps), divProps));
+  const [optionGroupParams, restProps] = createSplitProps()(props, ['id']);
+  const api = useSelectContext();
+  const groupProps = mergeProps(() => api().getOptionGroupProps(optionGroupParams), restProps);
+  return createComponent(ark.div, groupProps);
 };
 
 export { SelectOptionGroup };

package/dist/select/select-option.cjs

@@ -3,16 +3,18 @@
 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 selectContext = require('./select-context.cjs');
 
 const SelectOption = props => {
-  const [optionProps, liProps] = createSplitProps.createSplitProps()(props, ['disabled', 'label', 'value', 'valueText']);
-  const select = selectContext.useSelectContext();
-  return web.createComponent(factory.ark.li, web.mergeProps(() => select().getOptionProps(optionProps), liProps, {
+  const [optionParams, restProps] = createSplitProps.createSplitProps()(props, ['disabled', 'label', 'value', 'valueText']);
+  const api = selectContext.useSelectContext();
+  const optionProps = solid.mergeProps(() => api().getOptionProps(optionParams), restProps);
+  return web.createComponent(factory.ark.li, web.mergeProps(optionProps, {
     get children() {
-      return liProps.children ? liProps.children : optionProps.label;
+      return restProps.children ?? optionParams.label;
     }
   }));
 };

package/dist/select/select-option.d.ts

@@ -1,8 +1,8 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 import { useSelectContext } from './select-context';
-type OptionProps = Parameters<ReturnType<ReturnType<typeof useSelectContext>>['getOptionProps']>[0];
-export type SelectOptionProps = Assign<HTMLArkProps<'li'>, OptionProps>;
+type OptionParams = Parameters<ReturnType<ReturnType<typeof useSelectContext>>['getOptionProps']>[0];
+export type SelectOptionProps = Assign<HTMLArkProps<'li'>, OptionParams>;
 export declare const SelectOption: (props: SelectOptionProps) => JSX.Element;
 export {};

package/dist/select/select-option.mjs

@@ -1,14 +1,16 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import { useSelectContext } from './select-context.mjs';
 
 const SelectOption = props => {
-  const [optionProps, liProps] = createSplitProps()(props, ['disabled', 'label', 'value', 'valueText']);
-  const select = useSelectContext();
-  return createComponent(ark.li, mergeProps(() => select().getOptionProps(optionProps), liProps, {
+  const [optionParams, restProps] = createSplitProps()(props, ['disabled', 'label', 'value', 'valueText']);
+  const api = useSelectContext();
+  const optionProps = mergeProps(() => api().getOptionProps(optionParams), restProps);
+  return createComponent(ark.li, mergeProps$1(optionProps, {
     get children() {
-      return liProps.children ? liProps.children : optionProps.label;
+      return restProps.children ?? optionParams.label;
     }
   }));
 };

package/dist/select/select-positioner.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const selectContext = require('./select-context.cjs');
 
 const SelectPositioner = props => {
-  const select = selectContext.useSelectContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => select().positionerProps, props));
+  const api = selectContext.useSelectContext();
+  const positionerProps = solid.mergeProps(() => api().positionerProps, props);
+  return web.createComponent(factory.ark.div, positionerProps);
 };
 
 exports.SelectPositioner = SelectPositioner;