@ark-ui/react 3.4.0-0 → 3.4.0

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

@@ -9,6 +9,7 @@ const react = require('react');
 const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
 const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
 const useEvent = require('../../utils/use-event.cjs');
+const useFieldContext = require('../field/use-field-context.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -32,9 +33,17 @@ const colorPicker__namespace = /*#__PURE__*/_interopNamespaceDefault(colorPicker
 const useColorPicker = (props) => {
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
+  const field = useFieldContext.useFieldContext();
   const initialContext = {
     id: react.useId(),
+    ids: {
+      label: field?.ids.label,
+      input: field?.ids.control
+    },
     dir,
+    disabled: field?.disabled,
+    readOnly: field?.readOnly,
+    required: field?.required,
     getRootNode,
     open: props.defaultOpen,
     "open.controlled": props.open !== void 0,

package/dist/components/color-picker/use-color-picker.js

@@ -5,13 +5,22 @@ import { useId } from 'react';
 import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { useEvent } from '../../utils/use-event.js';
+import { useFieldContext } from '../field/use-field-context.js';
 
 const useColorPicker = (props) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
+  const field = useFieldContext();
   const initialContext = {
     id: useId(),
+    ids: {
+      label: field?.ids.label,
+      input: field?.ids.control
+    },
     dir,
+    disabled: field?.disabled,
+    readOnly: field?.readOnly,
+    required: field?.required,
     getRootNode,
     open: props.defaultOpen,
     "open.controlled": props.open !== void 0,

package/dist/components/combobox/combobox-clear-trigger.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxClearTriggerBaseProps = {};
-export interface ComboboxClearTriggerProps extends HTMLArkProps<'button'>, ComboboxClearTriggerBaseProps {
+export interface ComboboxClearTriggerBaseProps extends PolymorphicProps {
+}
+export interface ComboboxClearTriggerProps extends HTMLProps<'button'>, ComboboxClearTriggerBaseProps {
 }
 export declare const ComboboxClearTrigger: ForwardRefExoticComponent<ComboboxClearTriggerProps & RefAttributes<HTMLButtonElement>>;

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

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxClearTriggerBaseProps = {};
-export interface ComboboxClearTriggerProps extends HTMLArkProps<'button'>, ComboboxClearTriggerBaseProps {
+export interface ComboboxClearTriggerBaseProps extends PolymorphicProps {
+}
+export interface ComboboxClearTriggerProps extends HTMLProps<'button'>, ComboboxClearTriggerBaseProps {
 }
 export declare const ComboboxClearTrigger: ForwardRefExoticComponent<ComboboxClearTriggerProps & RefAttributes<HTMLButtonElement>>;

package/dist/components/combobox/combobox-content.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxContentBaseProps = {};
-export interface ComboboxContentProps extends HTMLArkProps<'div'>, ComboboxContentBaseProps {
+export interface ComboboxContentBaseProps extends PolymorphicProps {
+}
+export interface ComboboxContentProps extends HTMLProps<'div'>, ComboboxContentBaseProps {
 }
 export declare const ComboboxContent: ForwardRefExoticComponent<ComboboxContentProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-content.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxContentBaseProps = {};
-export interface ComboboxContentProps extends HTMLArkProps<'div'>, ComboboxContentBaseProps {
+export interface ComboboxContentBaseProps extends PolymorphicProps {
+}
+export interface ComboboxContentProps extends HTMLProps<'div'>, ComboboxContentBaseProps {
 }
 export declare const ComboboxContent: ForwardRefExoticComponent<ComboboxContentProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-control.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxControlBaseProps = {};
-export interface ComboboxControlProps extends HTMLArkProps<'div'>, ComboboxControlBaseProps {
+export interface ComboboxControlBaseProps extends PolymorphicProps {
+}
+export interface ComboboxControlProps extends HTMLProps<'div'>, ComboboxControlBaseProps {
 }
 export declare const ComboboxControl: ForwardRefExoticComponent<ComboboxControlProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-control.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxControlBaseProps = {};
-export interface ComboboxControlProps extends HTMLArkProps<'div'>, ComboboxControlBaseProps {
+export interface ComboboxControlBaseProps extends PolymorphicProps {
+}
+export interface ComboboxControlProps extends HTMLProps<'div'>, ComboboxControlBaseProps {
 }
 export declare const ComboboxControl: ForwardRefExoticComponent<ComboboxControlProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-input.cjs

@@ -7,12 +7,14 @@ const jsxRuntime = require('react/jsx-runtime');
 const react$1 = require('@zag-js/react');
 const react = require('react');
 const factory = require('../factory.cjs');
+const useFieldContext = require('../field/use-field-context.cjs');
 const useComboboxContext = require('./use-combobox-context.cjs');
 
 const ComboboxInput = react.forwardRef((props, ref) => {
   const combobox = useComboboxContext.useComboboxContext();
   const mergedProps = react$1.mergeProps(combobox.getInputProps(), props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
+  const field = useFieldContext.useFieldContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
 });
 ComboboxInput.displayName = "ComboboxInput";
 

package/dist/components/combobox/combobox-input.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxInputBaseProps = {};
-export interface ComboboxInputProps extends HTMLArkProps<'input'>, ComboboxInputBaseProps {
+export interface ComboboxInputBaseProps extends PolymorphicProps {
+}
+export interface ComboboxInputProps extends HTMLProps<'input'>, ComboboxInputBaseProps {
 }
 export declare const ComboboxInput: ForwardRefExoticComponent<ComboboxInputProps & RefAttributes<HTMLInputElement>>;

package/dist/components/combobox/combobox-input.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxInputBaseProps = {};
-export interface ComboboxInputProps extends HTMLArkProps<'input'>, ComboboxInputBaseProps {
+export interface ComboboxInputBaseProps extends PolymorphicProps {
+}
+export interface ComboboxInputProps extends HTMLProps<'input'>, ComboboxInputBaseProps {
 }
 export declare const ComboboxInput: ForwardRefExoticComponent<ComboboxInputProps & RefAttributes<HTMLInputElement>>;

package/dist/components/combobox/combobox-input.js

@@ -3,12 +3,14 @@ import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
 import { ark } from '../factory.js';
+import { useFieldContext } from '../field/use-field-context.js';
 import { useComboboxContext } from './use-combobox-context.js';
 
 const ComboboxInput = forwardRef((props, ref) => {
   const combobox = useComboboxContext();
   const mergedProps = mergeProps(combobox.getInputProps(), props);
-  return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
+  const field = useFieldContext();
+  return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
 });
 ComboboxInput.displayName = "ComboboxInput";
 

package/dist/components/combobox/combobox-item-group-label.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemGroupLabelBaseProps = {};
-export interface ComboboxItemGroupLabelProps extends HTMLArkProps<'div'>, ComboboxItemGroupLabelBaseProps {
+export interface ComboboxItemGroupLabelBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemGroupLabelProps extends HTMLProps<'div'>, ComboboxItemGroupLabelBaseProps {
 }
 export declare const ComboboxItemGroupLabel: ForwardRefExoticComponent<ComboboxItemGroupLabelProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-group-label.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemGroupLabelBaseProps = {};
-export interface ComboboxItemGroupLabelProps extends HTMLArkProps<'div'>, ComboboxItemGroupLabelBaseProps {
+export interface ComboboxItemGroupLabelBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemGroupLabelProps extends HTMLProps<'div'>, ComboboxItemGroupLabelBaseProps {
 }
 export declare const ComboboxItemGroupLabel: ForwardRefExoticComponent<ComboboxItemGroupLabelProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-group.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemGroupBaseProps = {};
-export interface ComboboxItemGroupProps extends HTMLArkProps<'div'>, ComboboxItemGroupBaseProps {
+export interface ComboboxItemGroupBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemGroupProps extends HTMLProps<'div'>, ComboboxItemGroupBaseProps {
 }
 export declare const ComboboxItemGroup: ForwardRefExoticComponent<ComboboxItemGroupProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-group.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemGroupBaseProps = {};
-export interface ComboboxItemGroupProps extends HTMLArkProps<'div'>, ComboboxItemGroupBaseProps {
+export interface ComboboxItemGroupBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemGroupProps extends HTMLProps<'div'>, ComboboxItemGroupBaseProps {
 }
 export declare const ComboboxItemGroup: ForwardRefExoticComponent<ComboboxItemGroupProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-indicator.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemIndicatorBaseProps = {};
-export interface ComboboxItemIndicatorProps extends HTMLArkProps<'div'>, ComboboxItemIndicatorBaseProps {
+export interface ComboboxItemIndicatorBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemIndicatorProps extends HTMLProps<'div'>, ComboboxItemIndicatorBaseProps {
 }
 export declare const ComboboxItemIndicator: ForwardRefExoticComponent<ComboboxItemIndicatorProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-indicator.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemIndicatorBaseProps = {};
-export interface ComboboxItemIndicatorProps extends HTMLArkProps<'div'>, ComboboxItemIndicatorBaseProps {
+export interface ComboboxItemIndicatorBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemIndicatorProps extends HTMLProps<'div'>, ComboboxItemIndicatorBaseProps {
 }
 export declare const ComboboxItemIndicator: ForwardRefExoticComponent<ComboboxItemIndicatorProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-text.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemTextBaseProps = {};
-export interface ComboboxItemTextProps extends HTMLArkProps<'span'>, ComboboxItemTextBaseProps {
+export interface ComboboxItemTextBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemTextProps extends HTMLProps<'span'>, ComboboxItemTextBaseProps {
 }
 export declare const ComboboxItemText: ForwardRefExoticComponent<ComboboxItemTextProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item-text.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxItemTextBaseProps = {};
-export interface ComboboxItemTextProps extends HTMLArkProps<'span'>, ComboboxItemTextBaseProps {
+export interface ComboboxItemTextBaseProps extends PolymorphicProps {
+}
+export interface ComboboxItemTextProps extends HTMLProps<'span'>, ComboboxItemTextBaseProps {
 }
 export declare const ComboboxItemText: ForwardRefExoticComponent<ComboboxItemTextProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item.d.cts

@@ -1,10 +1,9 @@
 import { ItemProps } from '@zag-js/combobox';
-import { Assign } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ComboboxItemBaseProps extends ItemProps {
+export interface ComboboxItemBaseProps extends ItemProps, PolymorphicProps {
 }
-export interface ComboboxItemProps extends Assign<HTMLArkProps<'div'>, ComboboxItemBaseProps> {
+export interface ComboboxItemProps extends HTMLProps<'div'>, ComboboxItemBaseProps {
 }
 export declare const ComboboxItem: ForwardRefExoticComponent<ComboboxItemProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-item.d.ts

@@ -1,10 +1,9 @@
 import { ItemProps } from '@zag-js/combobox';
-import { Assign } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ComboboxItemBaseProps extends ItemProps {
+export interface ComboboxItemBaseProps extends ItemProps, PolymorphicProps {
 }
-export interface ComboboxItemProps extends Assign<HTMLArkProps<'div'>, ComboboxItemBaseProps> {
+export interface ComboboxItemProps extends HTMLProps<'div'>, ComboboxItemBaseProps {
 }
 export declare const ComboboxItem: ForwardRefExoticComponent<ComboboxItemProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-label.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxLabelBaseProps = {};
-export interface ComboboxLabelProps extends HTMLArkProps<'label'>, ComboboxLabelBaseProps {
+export interface ComboboxLabelBaseProps extends PolymorphicProps {
+}
+export interface ComboboxLabelProps extends HTMLProps<'label'>, ComboboxLabelBaseProps {
 }
 export declare const ComboboxLabel: ForwardRefExoticComponent<ComboboxLabelProps & RefAttributes<HTMLLabelElement>>;

package/dist/components/combobox/combobox-label.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxLabelBaseProps = {};
-export interface ComboboxLabelProps extends HTMLArkProps<'label'>, ComboboxLabelBaseProps {
+export interface ComboboxLabelBaseProps extends PolymorphicProps {
+}
+export interface ComboboxLabelProps extends HTMLProps<'label'>, ComboboxLabelBaseProps {
 }
 export declare const ComboboxLabel: ForwardRefExoticComponent<ComboboxLabelProps & RefAttributes<HTMLLabelElement>>;

package/dist/components/combobox/combobox-list.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxListBaseProps = {};
-export interface ComboboxListProps extends HTMLArkProps<'div'>, ComboboxListBaseProps {
+export interface ComboboxListBaseProps extends PolymorphicProps {
+}
+export interface ComboboxListProps extends HTMLProps<'div'>, ComboboxListBaseProps {
 }
 export declare const ComboboxList: ForwardRefExoticComponent<ComboboxListProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-list.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxListBaseProps = {};
-export interface ComboboxListProps extends HTMLArkProps<'div'>, ComboboxListBaseProps {
+export interface ComboboxListBaseProps extends PolymorphicProps {
+}
+export interface ComboboxListProps extends HTMLProps<'div'>, ComboboxListBaseProps {
 }
 export declare const ComboboxList: ForwardRefExoticComponent<ComboboxListProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-positioner.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxPositionerBaseProps = {};
-export interface ComboboxPositionerProps extends HTMLArkProps<'div'>, ComboboxPositionerBaseProps {
+export interface ComboboxPositionerBaseProps extends PolymorphicProps {
+}
+export interface ComboboxPositionerProps extends HTMLProps<'div'>, ComboboxPositionerBaseProps {
 }
 export declare const ComboboxPositioner: ForwardRefExoticComponent<ComboboxPositionerProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-positioner.d.ts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type ComboboxPositionerBaseProps = {};
-export interface ComboboxPositionerProps extends HTMLArkProps<'div'>, ComboboxPositionerBaseProps {
+export interface ComboboxPositionerBaseProps extends PolymorphicProps {
+}
+export interface ComboboxPositionerProps extends HTMLProps<'div'>, ComboboxPositionerBaseProps {
 }
 export declare const ComboboxPositioner: ForwardRefExoticComponent<ComboboxPositionerProps & RefAttributes<HTMLDivElement>>;

package/dist/components/combobox/combobox-root-provider.d.cts

@@ -1,15 +1,15 @@
 import { JSX, RefAttributes } from 'react';
 import { CollectionItem } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { UsePresenceProps } from '../presence';
 import { UseComboboxReturn } from './use-combobox';
 
 interface RootProviderProps<T extends CollectionItem> {
     value: UseComboboxReturn<T>;
 }
-export interface ComboboxRootProviderBaseProps<T extends CollectionItem> extends RootProviderProps<T>, UsePresenceProps {
+export interface ComboboxRootProviderBaseProps<T extends CollectionItem> extends RootProviderProps<T>, UsePresenceProps, PolymorphicProps {
 }
-export interface ComboboxRootProviderProps<T extends CollectionItem> extends HTMLArkProps<'div'>, ComboboxRootProviderBaseProps<T> {
+export interface ComboboxRootProviderProps<T extends CollectionItem> extends HTMLProps<'div'>, ComboboxRootProviderBaseProps<T> {
 }
 export type ComboboxComponent = <T extends CollectionItem>(props: ComboboxRootProviderProps<T> & RefAttributes<HTMLDivElement>) => JSX.Element;
 export declare const ComboboxRootProvider: ComboboxComponent;

package/dist/components/combobox/combobox-root-provider.d.ts

@@ -1,15 +1,15 @@
 import { JSX, RefAttributes } from 'react';
 import { CollectionItem } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { UsePresenceProps } from '../presence';
 import { UseComboboxReturn } from './use-combobox';
 
 interface RootProviderProps<T extends CollectionItem> {
     value: UseComboboxReturn<T>;
 }
-export interface ComboboxRootProviderBaseProps<T extends CollectionItem> extends RootProviderProps<T>, UsePresenceProps {
+export interface ComboboxRootProviderBaseProps<T extends CollectionItem> extends RootProviderProps<T>, UsePresenceProps, PolymorphicProps {
 }
-export interface ComboboxRootProviderProps<T extends CollectionItem> extends HTMLArkProps<'div'>, ComboboxRootProviderBaseProps<T> {
+export interface ComboboxRootProviderProps<T extends CollectionItem> extends HTMLProps<'div'>, ComboboxRootProviderBaseProps<T> {
 }
 export type ComboboxComponent = <T extends CollectionItem>(props: ComboboxRootProviderProps<T> & RefAttributes<HTMLDivElement>) => JSX.Element;
 export declare const ComboboxRootProvider: ComboboxComponent;

package/dist/components/combobox/combobox-root.cjs

@@ -55,6 +55,7 @@ const ComboboxImpl = (props, ref) => {
     "placeholder",
     "positioning",
     "readOnly",
+    "required",
     "scrollToIndexFn",
     "selectionBehavior",
     "translations",

package/dist/components/combobox/combobox-root.d.cts

@@ -1,12 +1,12 @@
 import { JSX, RefAttributes } from 'react';
 import { Assign, CollectionItem } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { UsePresenceProps } from '../presence';
 import { UseComboboxProps } from './use-combobox';
 
-export interface ComboboxRootBaseProps<T extends CollectionItem> extends UseComboboxProps<T>, UsePresenceProps {
+export interface ComboboxRootBaseProps<T extends CollectionItem> extends UseComboboxProps<T>, UsePresenceProps, PolymorphicProps {
 }
-export interface ComboboxRootProps<T extends CollectionItem> extends Assign<HTMLArkProps<'div'>, ComboboxRootBaseProps<T>> {
+export interface ComboboxRootProps<T extends CollectionItem> extends Assign<HTMLProps<'div'>, ComboboxRootBaseProps<T>> {
 }
 export type ComboboxComponent = <T extends CollectionItem>(props: ComboboxRootProps<T> & RefAttributes<HTMLDivElement>) => JSX.Element;
 export declare const ComboboxRoot: ComboboxComponent;

package/dist/components/combobox/combobox-root.d.ts

@@ -1,12 +1,12 @@
 import { JSX, RefAttributes } from 'react';
 import { Assign, CollectionItem } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { UsePresenceProps } from '../presence';
 import { UseComboboxProps } from './use-combobox';
 
-export interface ComboboxRootBaseProps<T extends CollectionItem> extends UseComboboxProps<T>, UsePresenceProps {
+export interface ComboboxRootBaseProps<T extends CollectionItem> extends UseComboboxProps<T>, UsePresenceProps, PolymorphicProps {
 }
-export interface ComboboxRootProps<T extends CollectionItem> extends Assign<HTMLArkProps<'div'>, ComboboxRootBaseProps<T>> {
+export interface ComboboxRootProps<T extends CollectionItem> extends Assign<HTMLProps<'div'>, ComboboxRootBaseProps<T>> {
 }
 export type ComboboxComponent = <T extends CollectionItem>(props: ComboboxRootProps<T> & RefAttributes<HTMLDivElement>) => JSX.Element;
 export declare const ComboboxRoot: ComboboxComponent;

package/dist/components/combobox/combobox-root.js

@@ -51,6 +51,7 @@ const ComboboxImpl = (props, ref) => {
     "placeholder",
     "positioning",
     "readOnly",
+    "required",
     "scrollToIndexFn",
     "selectionBehavior",
     "translations",

package/dist/components/combobox/combobox-trigger.d.cts

@@ -1,10 +1,9 @@
 import { TriggerProps } from '@zag-js/combobox';
-import { Assign } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ComboboxTriggerBaseProps extends TriggerProps {
+export interface ComboboxTriggerBaseProps extends TriggerProps, PolymorphicProps {
 }
-export interface ComboboxTriggerProps extends Assign<HTMLArkProps<'button'>, ComboboxTriggerBaseProps> {
+export interface ComboboxTriggerProps extends HTMLProps<'button'>, ComboboxTriggerBaseProps {
 }
 export declare const ComboboxTrigger: ForwardRefExoticComponent<ComboboxTriggerProps & RefAttributes<HTMLButtonElement>>;

package/dist/components/combobox/combobox-trigger.d.ts

@@ -1,10 +1,9 @@
 import { TriggerProps } from '@zag-js/combobox';
-import { Assign } from '../../types';
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ComboboxTriggerBaseProps extends TriggerProps {
+export interface ComboboxTriggerBaseProps extends TriggerProps, PolymorphicProps {
 }
-export interface ComboboxTriggerProps extends Assign<HTMLArkProps<'button'>, ComboboxTriggerBaseProps> {
+export interface ComboboxTriggerProps extends HTMLProps<'button'>, ComboboxTriggerBaseProps {
 }
 export declare const ComboboxTrigger: ForwardRefExoticComponent<ComboboxTriggerProps & RefAttributes<HTMLButtonElement>>;

package/dist/components/combobox/use-combobox.cjs

@@ -10,6 +10,7 @@ const useEnvironmentContext = require('../../providers/environment/use-environme
 const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
 const createSplitProps = require('../../utils/create-split-props.cjs');
 const useEvent = require('../../utils/use-event.cjs');
+const useFieldContext = require('../field/use-field-context.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -43,8 +44,17 @@ const useCombobox = (props) => {
   );
   const { dir } = useLocaleContext.useLocaleContext();
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
+  const field = useFieldContext.useFieldContext();
   const initialContext = {
     id: react.useId(),
+    ids: {
+      label: field?.ids.label,
+      input: field?.ids.control
+    },
+    disabled: field?.disabled,
+    readOnly: field?.readOnly,
+    required: field?.required,
+    invalid: field?.invalid,
     dir,
     getRootNode,
     collection,

package/dist/components/combobox/use-combobox.js

@@ -6,6 +6,7 @@ import { useEnvironmentContext } from '../../providers/environment/use-environme
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { createSplitProps } from '../../utils/create-split-props.js';
 import { useEvent } from '../../utils/use-event.js';
+import { useFieldContext } from '../field/use-field-context.js';
 
 const useCombobox = (props) => {
   const [collectionOptions, comboboxProps] = createSplitProps()(props, [
@@ -20,8 +21,17 @@ const useCombobox = (props) => {
   );
   const { dir } = useLocaleContext();
   const { getRootNode } = useEnvironmentContext();
+  const field = useFieldContext();
   const initialContext = {
     id: useId(),
+    ids: {
+      label: field?.ids.label,
+      input: field?.ids.control
+    },
+    disabled: field?.disabled,
+    readOnly: field?.readOnly,
+    required: field?.required,
+    invalid: field?.invalid,
     dir,
     getRootNode,
     collection,

package/dist/components/date-picker/date-picker-clear-trigger.d.cts

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type DatePickerClearTriggerBaseProps = {};
-export interface DatePickerClearTriggerProps extends HTMLArkProps<'button'>, DatePickerClearTriggerBaseProps {
+export interface DatePickerClearTriggerBaseProps extends PolymorphicProps {
+}
+export interface DatePickerClearTriggerProps extends HTMLProps<'button'>, DatePickerClearTriggerBaseProps {
 }
 export declare const DatePickerClearTrigger: ForwardRefExoticComponent<DatePickerClearTriggerProps & RefAttributes<HTMLButtonElement>>;

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

@@ -1,7 +1,8 @@
-import { HTMLArkProps } from '../factory';
+import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export type DatePickerClearTriggerBaseProps = {};
-export interface DatePickerClearTriggerProps extends HTMLArkProps<'button'>, DatePickerClearTriggerBaseProps {
+export interface DatePickerClearTriggerBaseProps extends PolymorphicProps {
+}
+export interface DatePickerClearTriggerProps extends HTMLProps<'button'>, DatePickerClearTriggerBaseProps {
 }
 export declare const DatePickerClearTrigger: ForwardRefExoticComponent<DatePickerClearTriggerProps & RefAttributes<HTMLButtonElement>>;