@ark-ui/react 0.9.0 → 0.10.0-beta.1

package/menu/menu-item.cjs

@@ -4,13 +4,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const menuContext = require('./menu-context.cjs');
 
-const MenuItem = forwardRef.forwardRef((props, ref) => {
+const MenuItem = react.forwardRef((props, ref) => {
   const api = menuContext.useMenuContext();
   const [menuItemProps, buttonProps] = createSplitProps.createSplitProps()(props, [
     "id",
@@ -18,8 +18,9 @@ const MenuItem = forwardRef.forwardRef((props, ref) => {
     "valueText",
     "closeOnSelect"
   ]);
-  const mergedProps = react.mergeProps(api?.getItemProps(menuItemProps) ?? {}, buttonProps);
+  const mergedProps = react$1.mergeProps(api?.getItemProps(menuItemProps) ?? {}, buttonProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
 });
+MenuItem.displayName = "MenuItem";
 
 exports.MenuItem = MenuItem;

package/menu/menu-item.d.ts

@@ -1,8 +1,13 @@
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
+import type { ItemProps } from '@zag-js/menu';
+import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
 import { type Assign } from '../types';
 import { type UseMenuReturn } from './use-menu';
 type MenuItemParams = Parameters<UseMenuReturn['api']['getItemProps']>[0];
-export type MenuItemProps = Assign<HTMLArkProps<'button'>, MenuItemParams>;
-export declare const MenuItem: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, MenuItemProps>>;
+export type MenuItemProps = Assign<ComponentPropsWithoutRef<typeof ark.button>, MenuItemParams>;
+export declare const MenuItem: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, keyof ItemProps> & ItemProps & RefAttributes<HTMLDivElement>>;
 export {};

package/menu/menu-item.mjs

@@ -1,9 +1,9 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuItem = forwardRef((props, ref) => {
@@ -17,5 +17,6 @@ const MenuItem = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api?.getItemProps(menuItemProps) ?? {}, buttonProps);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
 });
+MenuItem.displayName = "MenuItem";
 
 export { MenuItem };

package/menu/menu-option-item.cjs

@@ -5,15 +5,14 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
 require('@zag-js/menu');
-const react = require('@zag-js/react');
-require('react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const runIfFn = require('../run-if-fn.cjs');
 const menuContext = require('./menu-context.cjs');
 
-const MenuOptionItem = forwardRef.forwardRef((props, ref) => {
+const MenuOptionItem = react.forwardRef((props, ref) => {
   const api = menuContext.useMenuContext();
   const [optionProps, { children, ...divProps }] = createSplitProps.createSplitProps()(props, [
     "id",
@@ -26,8 +25,9 @@ const MenuOptionItem = forwardRef.forwardRef((props, ref) => {
     "onCheckedChange"
   ]);
   const view = runIfFn.runIfFn(children, { isActive: api?.isOptionChecked(optionProps) ?? false });
-  const mergedProps = react.mergeProps(api?.getOptionItemProps(optionProps) ?? {}, divProps);
+  const mergedProps = react$1.mergeProps(api?.getOptionItemProps(optionProps) ?? {}, divProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: view });
 });
+MenuOptionItem.displayName = "MenuOptionItem";
 
 exports.MenuOptionItem = MenuOptionItem;

package/menu/menu-option-item.d.ts

@@ -1,12 +1,23 @@
-import { type connect } from '@zag-js/menu';
-import type { ForwardRefExoticComponent, type ReactNode } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
+import type { ItemProps, type connect } from '@zag-js/menu';
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef,  type ReactNode } from 'react';
+import { ark } from '../factory';
 import { type Assign } from '../types';
 export type MenuOptionItemState = {
     isActive: boolean;
 };
 export type MenuOptionItemParams = Parameters<ReturnType<typeof connect>['getOptionItemProps']>[0];
-export type MenuOptionItemProps = Assign<HTMLArkProps<'div'>, MenuOptionItemParams & {
+export type MenuOptionItemProps = Assign<ComponentPropsWithoutRef<typeof ark.div>, MenuOptionItemParams & {
     children?: ReactNode | ((state: MenuOptionItemState) => ReactNode);
 }>;
-export declare const MenuOptionItem: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, MenuOptionItemProps>>;
+export declare const MenuOptionItem: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, "name" | "value" | "children" | "type" | keyof ItemProps | "onCheckedChange"> & Partial<ItemProps> & {
+    name: string;
+    type: "checkbox" | "radio";
+    value: string;
+    onCheckedChange?: ((checked: boolean) => void) | undefined;
+} & {
+    children?: ReactNode | ((state: MenuOptionItemState) => ReactNode);
+} & RefAttributes<HTMLDivElement>>;

package/menu/menu-option-item.mjs

@@ -2,10 +2,9 @@
 import { jsx } from 'react/jsx-runtime';
 import '@zag-js/menu';
 import { mergeProps } from '@zag-js/react';
-import 'react';
+import { forwardRef } from 'react';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { runIfFn } from '../run-if-fn.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
@@ -25,5 +24,6 @@ const MenuOptionItem = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api?.getOptionItemProps(optionProps) ?? {}, divProps);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: view });
 });
+MenuOptionItem.displayName = "MenuOptionItem";
 
 export { MenuOptionItem };

package/menu/menu-positioner.cjs

@@ -4,15 +4,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const menuContext = require('./menu-context.cjs');
 
-const MenuPositioner = forwardRef.forwardRef((props, ref) => {
+const MenuPositioner = react.forwardRef((props, ref) => {
   const api = menuContext.useMenuContext();
-  const mergedProps = react.mergeProps(api?.positionerProps ?? {}, props);
+  const mergedProps = react$1.mergeProps(api?.positionerProps ?? {}, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
 });
+MenuPositioner.displayName = "MenuPositioner";
 
 exports.MenuPositioner = MenuPositioner;

package/menu/menu-positioner.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type MenuPositionerProps = HTMLArkProps<'div'>;
-export declare const MenuPositioner: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, MenuPositionerProps>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type MenuPositionerProps = ComponentPropsWithoutRef<typeof ark.div>;
+export declare const MenuPositioner: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLDivElement>>;

package/menu/menu-positioner.mjs

@@ -1,8 +1,8 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuPositioner = forwardRef((props, ref) => {
@@ -10,5 +10,6 @@ const MenuPositioner = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api?.positionerProps ?? {}, props);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
 });
+MenuPositioner.displayName = "MenuPositioner";
 
 export { MenuPositioner };

package/menu/menu-separator.cjs

@@ -4,15 +4,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const menuContext = require('./menu-context.cjs');
 
-const MenuSeparator = forwardRef.forwardRef((props, ref) => {
+const MenuSeparator = react.forwardRef((props, ref) => {
   const api = menuContext.useMenuContext();
-  const mergedProps = react.mergeProps(api?.separatorProps ?? {}, props);
+  const mergedProps = react$1.mergeProps(api?.separatorProps ?? {}, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.hr, { ...mergedProps, ref });
 });
+MenuSeparator.displayName = "MenuSeparator";
 
 exports.MenuSeparator = MenuSeparator;

package/menu/menu-separator.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type MenuSeparatorProps = HTMLArkProps<'hr'>;
-export declare const MenuSeparator: ForwardRefExoticComponent<Assign<AsChildComponentProps<"hr">, MenuSeparatorProps>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type MenuSeparatorProps = ComponentPropsWithoutRef<typeof ark.hr>;
+export declare const MenuSeparator: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLHRElement>, HTMLHRElement>, "ref"> & {
+    ref?: ((instance: HTMLHRElement | null) => void) | RefObject<HTMLHRElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLHRElement>>;

package/menu/menu-separator.mjs

@@ -1,8 +1,8 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuSeparator = forwardRef((props, ref) => {
@@ -10,5 +10,6 @@ const MenuSeparator = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api?.separatorProps ?? {}, props);
   return /* @__PURE__ */ jsx(ark.hr, { ...mergedProps, ref });
 });
+MenuSeparator.displayName = "MenuSeparator";
 
 export { MenuSeparator };

package/menu/menu-trigger-item.cjs

@@ -4,15 +4,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const menuContext = require('./menu-context.cjs');
 
-const MenuTriggerItem = forwardRef.forwardRef((props, ref) => {
+const MenuTriggerItem = react.forwardRef((props, ref) => {
   const getTriggerItemProps = menuContext.useMenuTriggerItemContext();
-  const mergedProps = react.mergeProps(getTriggerItemProps?.() ?? {}, props);
+  const mergedProps = react$1.mergeProps(getTriggerItemProps?.() ?? {}, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
 });
+MenuTriggerItem.displayName = "MenuTriggerItem";
 
 exports.MenuTriggerItem = MenuTriggerItem;

package/menu/menu-trigger-item.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type MenuTriggerItemProps = HTMLArkProps<'div'>;
-export declare const MenuTriggerItem: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, MenuTriggerItemProps>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type MenuTriggerItemProps = ComponentPropsWithoutRef<typeof ark.div>;
+export declare const MenuTriggerItem: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLDivElement>>;

package/menu/menu-trigger-item.mjs

@@ -1,8 +1,8 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useMenuTriggerItemContext } from './menu-context.mjs';
 
 const MenuTriggerItem = forwardRef((props, ref) => {
@@ -10,5 +10,6 @@ const MenuTriggerItem = forwardRef((props, ref) => {
   const mergedProps = mergeProps(getTriggerItemProps?.() ?? {}, props);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
 });
+MenuTriggerItem.displayName = "MenuTriggerItem";
 
 export { MenuTriggerItem };

package/menu/menu-trigger.cjs

@@ -4,15 +4,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const menuContext = require('./menu-context.cjs');
 
-const MenuTrigger = forwardRef.forwardRef((props, ref) => {
+const MenuTrigger = react.forwardRef((props, ref) => {
   const api = menuContext.useMenuContext();
-  const mergedProps = react.mergeProps(api?.triggerProps ?? {}, props);
+  const mergedProps = react$1.mergeProps(api?.triggerProps ?? {}, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
 });
+MenuTrigger.displayName = "MenuTrigger";
 
 exports.MenuTrigger = MenuTrigger;

package/menu/menu-trigger.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type MenuTriggerProps = HTMLArkProps<'button'>;
-export declare const MenuTrigger: ForwardRefExoticComponent<Assign<AsChildComponentProps<"button">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type MenuTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
+export declare const MenuTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLButtonElement>>;

package/menu/menu-trigger.mjs

@@ -1,8 +1,8 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuTrigger = forwardRef((props, ref) => {
@@ -10,5 +10,6 @@ const MenuTrigger = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api?.triggerProps ?? {}, props);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
 });
+MenuTrigger.displayName = "MenuTrigger";
 
 export { MenuTrigger };

package/menu/menu.cjs

@@ -4,7 +4,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
+const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const runIfFn = require('../run-if-fn.cjs');
 const useEffectOnce = require('../use-effect-once.cjs');
@@ -42,12 +42,12 @@ const Menu = (props) => {
     parentApi.setChild(machine);
     api.setParent(parentMachine);
   });
-  React.useEffect(() => {
+  react.useEffect(() => {
     if (isOpen && !api.isOpen) {
       api.open();
     }
   }, [isOpen, api]);
-  const getTriggerItemProps = React.useCallback(
+  const getTriggerItemProps = react.useCallback(
     () => parentApi.getTriggerItemProps(api),
     [api, parentApi]
   );

package/menu/use-menu.cjs

@@ -4,8 +4,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const menu = require('@zag-js/menu');
-const react = require('@zag-js/react');
-const React = require('react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {
@@ -30,12 +30,12 @@ const menu__namespace = /*#__PURE__*/_interopNamespaceDefault(menu);
 const useMenu = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
   const context = {
-    id: React.useId(),
+    id: react.useId(),
     getRootNode,
     ...props
   };
-  const [state, send, machine] = react.useMachine(menu__namespace.machine(context), { context });
-  const api = menu__namespace.connect(state, send, react.normalizeProps);
+  const [state, send, machine] = react$1.useMachine(menu__namespace.machine(context), { context });
+  const api = menu__namespace.connect(state, send, react$1.normalizeProps);
   return { api, machine };
 };
 

package/number-input/number-input-control.cjs

@@ -4,15 +4,18 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const numberInputContext = require('./number-input-context.cjs');
 
-const NumberInputControl = forwardRef.forwardRef((props, ref) => {
-  const { controlProps } = numberInputContext.useNumberInputContext();
-  const mergedProps = react.mergeProps(controlProps, props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-});
+const NumberInputControl = react.forwardRef(
+  (props, ref) => {
+    const { controlProps } = numberInputContext.useNumberInputContext();
+    const mergedProps = react$1.mergeProps(controlProps, props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+  }
+);
+NumberInputControl.displayName = "NumberInputControl";
 
 exports.NumberInputControl = NumberInputControl;

package/number-input/number-input-control.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type NumberInputControlProps = HTMLArkProps<'div'>;
-export declare const NumberInputControl: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type NumberInputControlProps = ComponentPropsWithoutRef<typeof ark.div>;
+export declare const NumberInputControl: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLDivElement>>;

package/number-input/number-input-control.mjs

@@ -1,14 +1,17 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useNumberInputContext } from './number-input-context.mjs';
 
-const NumberInputControl = forwardRef((props, ref) => {
-  const { controlProps } = useNumberInputContext();
-  const mergedProps = mergeProps(controlProps, props);
-  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-});
+const NumberInputControl = forwardRef(
+  (props, ref) => {
+    const { controlProps } = useNumberInputContext();
+    const mergedProps = mergeProps(controlProps, props);
+    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+  }
+);
+NumberInputControl.displayName = "NumberInputControl";
 
 export { NumberInputControl };

package/number-input/number-input-decrement-trigger.cjs

@@ -4,16 +4,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
-require('react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const numberInputContext = require('./number-input-context.cjs');
 
-const NumberInputDecrementTrigger = forwardRef.forwardRef((props, ref) => {
+const NumberInputDecrementTrigger = react.forwardRef((props, ref) => {
   const { decrementTriggerProps } = numberInputContext.useNumberInputContext();
-  const mergedProps = react.mergeProps(decrementTriggerProps, props);
+  const mergedProps = react$1.mergeProps(decrementTriggerProps, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
 });
+NumberInputDecrementTrigger.displayName = "NumberInputDecrementTrigger";
 
 exports.NumberInputDecrementTrigger = NumberInputDecrementTrigger;

package/number-input/number-input-decrement-trigger.d.ts

@@ -1,7 +1,8 @@
-import type { AsChildComponentProps } from '../factory';
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent, type ReactElement } from 'react';
-export type NumberInputDecrementTriggerProps = {
-    children: ReactElement;
-};
-export declare const NumberInputDecrementTrigger: ForwardRefExoticComponent<Assign<AsChildComponentProps<"button">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type NumberInputDecrementTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
+export declare const NumberInputDecrementTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLButtonElement>>;

package/number-input/number-input-decrement-trigger.mjs

@@ -1,9 +1,8 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
-import 'react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useNumberInputContext } from './number-input-context.mjs';
 
 const NumberInputDecrementTrigger = forwardRef((props, ref) => {
@@ -11,5 +10,6 @@ const NumberInputDecrementTrigger = forwardRef((props, ref) => {
   const mergedProps = mergeProps(decrementTriggerProps, props);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
 });
+NumberInputDecrementTrigger.displayName = "NumberInputDecrementTrigger";
 
 export { NumberInputDecrementTrigger };

package/number-input/number-input-field.cjs

@@ -4,15 +4,18 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const numberInputContext = require('./number-input-context.cjs');
 
-const NumberInputField = forwardRef.forwardRef((props, ref) => {
-  const { inputProps } = numberInputContext.useNumberInputContext();
-  const mergedProps = react.mergeProps(inputProps, props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
-});
+const NumberInputField = react.forwardRef(
+  (props, ref) => {
+    const { inputProps } = numberInputContext.useNumberInputContext();
+    const mergedProps = react$1.mergeProps(inputProps, props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
+  }
+);
+NumberInputField.displayName = "NumberInputField";
 
 exports.NumberInputField = NumberInputField;

package/number-input/number-input-field.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type NumberInputFieldProps = HTMLArkProps<'input'>;
-export declare const NumberInputField: ForwardRefExoticComponent<Assign<AsChildComponentProps<"input">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, InputHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type NumberInputFieldProps = ComponentPropsWithoutRef<typeof ark.input>;
+export declare const NumberInputField: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void) | RefObject<HTMLInputElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLInputElement>>;

package/number-input/number-input-field.mjs

@@ -1,14 +1,17 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useNumberInputContext } from './number-input-context.mjs';
 
-const NumberInputField = forwardRef((props, ref) => {
-  const { inputProps } = useNumberInputContext();
-  const mergedProps = mergeProps(inputProps, props);
-  return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
-});
+const NumberInputField = forwardRef(
+  (props, ref) => {
+    const { inputProps } = useNumberInputContext();
+    const mergedProps = mergeProps(inputProps, props);
+    return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
+  }
+);
+NumberInputField.displayName = "NumberInputField";
 
 export { NumberInputField };