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

package/carousel/carousel-slide-group.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type CarouselSlideGroupProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const CarouselSlideGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/carousel/carousel-slide.d.ts

@@ -1,5 +1,5 @@
 import type { SlideProps } from '@zag-js/carousel';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 export type CarouselSlideProps = Assign<ComponentPropsWithoutRef<typeof ark.div>, SlideProps>;

package/carousel/carousel-viewport.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type CarouselViewportProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const CarouselViewport: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/carousel/carousel.anatomy.d.ts

@@ -1,3 +1,3 @@
-import type { AnatomyInstance, AnatomyPart } from '@zag-js/anatomy';
-export declare const carouselAnatomy: AnatomyInstance<"root" | "viewport" | "slideGroup" | "slide" | "previousTrigger" | "nextTrigger" | "indicatorGroup" | "indicator" | "control">;
-export declare const parts: Record<"root" | "viewport" | "slideGroup" | "slide" | "previousTrigger" | "nextTrigger" | "indicatorGroup" | "indicator" | "control", AnatomyPart>;
+import { AnatomyInstance, AnatomyPart } from '@zag-js/anatomy';
+export declare const carouselAnatomy: AnatomyInstance<"root" | "viewport" | "slideGroup" | "slide" | "nextSlideTrigger" | "prevSlideTrigger" | "indicatorGroup" | "indicator" | "control">;
+export declare const parts: Record<"root" | "viewport" | "slideGroup" | "slide" | "nextSlideTrigger" | "prevSlideTrigger" | "indicatorGroup" | "indicator" | "control", AnatomyPart>;

package/carousel/carousel.d.ts

@@ -1,5 +1,5 @@
-import type { Context } from '@zag-js/carousel';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef,  type ReactNode } from 'react';
+import { Context } from '@zag-js/carousel';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef, type ReactNode } from 'react';
 import { ark } from '../factory';
 import { type Assign } from '../types';
 import { type CarouselContext } from './carousel-context';
@@ -13,4 +13,4 @@ export declare const Carousel: ForwardRefExoticComponent<Omit<Omit<Omit<Detailed
     asChild?: boolean | undefined;
 }, "ref"> & {
     children: ReactNode | ((pages: CarouselContext) => ReactNode);
-}, "id" | "orientation" | "spacing" | "dir" | "loop" | "align" | "getRootNode" | "ids" | "slidesPerView" | "index" | "onSlideChange"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>>;
+}, "getRootNode" | "id" | "ids" | "orientation" | "spacing" | "dir" | "loop" | "align" | "slidesPerView" | "index" | "onSlideChange"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>>;

package/carousel/carousel.stories.d.ts

@@ -0,0 +1,7 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { Carousel } from './';
+type CarouselType = typeof Carousel;
+declare const meta: Meta<CarouselType>;
+export default meta;
+export declare const Basic: () => JSX.Element;

package/carousel/carousel.test.d.ts

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

package/carousel/index.cjs

@@ -14,9 +14,18 @@ const carouselSlideGroup = require('./carousel-slide-group.cjs');
 const carouselViewport = require('./carousel-viewport.cjs');
 const carousel_anatomy = require('./carousel.anatomy.cjs');
 
+const Carousel = Object.assign(carousel.Carousel, {
+  Root: carousel.Carousel,
+  Control: carouselControl.CarouselControl,
+  Indicator: carouselIndicator.CarouselIndicator,
+  IndicatorGroup: carouselIndicatorGroup.CarouselIndicatorGroup,
+  NextSlideTrigger: carouselNextSlideTrigger.CarouselNextSlideTrigger,
+  PrevSlideTrigger: carouselPrevSlideTrigger.CarouselPrevSlideTrigger,
+  Slide: carouselSlide.CarouselSlide,
+  SlideGroup: carouselSlideGroup.CarouselSlideGroup,
+  Viewport: carouselViewport.CarouselViewport
+});
 
-
-exports.Carousel = carousel.Carousel;
 exports.useCarouselContext = carouselContext.useCarouselContext;
 exports.CarouselControl = carouselControl.CarouselControl;
 exports.CarouselIndicator = carouselIndicator.CarouselIndicator;
@@ -27,3 +36,4 @@ exports.CarouselSlide = carouselSlide.CarouselSlide;
 exports.CarouselSlideGroup = carouselSlideGroup.CarouselSlideGroup;
 exports.CarouselViewport = carouselViewport.CarouselViewport;
 exports.carouselAnatomy = carousel_anatomy.carouselAnatomy;
+exports.Carousel = Carousel;

package/carousel/index.d.ts

@@ -1,11 +1,77 @@
-export { Carousel, type CarouselProps } from './carousel';
-export { useCarouselContext } from './carousel-context';
-export { CarouselControl, type CarouselControlProps } from './carousel-control';
-export { CarouselIndicator, type CarouselIndicatorProps } from './carousel-indicator';
-export { CarouselIndicatorGroup, type CarouselIndicatorGroupProps, } from './carousel-indicator-group';
-export { CarouselNextSlideTrigger, type CarouselNextSlideTriggerProps, } from './carousel-next-slide-trigger';
-export { CarouselPrevSlideTrigger, type CarouselPrevSlideTriggerProps, } from './carousel-prev-slide-trigger';
-export { CarouselSlide, type CarouselSlideProps } from './carousel-slide';
-export { CarouselSlideGroup, type CarouselSlideGroupProps } from './carousel-slide-group';
-export { CarouselViewport, type CarouselViewportProps } from './carousel-viewport';
-export { carouselAnatomy } from './carousel.anatomy';
+import { PublicApi, Context, SlideIndicatorProps, SlideProps } from '@zag-js/carousel';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, ReactNode, CSSProperties, RefAttributes, ButtonHTMLAttributes } from 'react';
+/// <reference types="react" />
+import { type CarouselProps } from './carousel';
+import { useCarouselContext } from './carousel-context';
+import { CarouselControl, type CarouselControlProps } from './carousel-control';
+import { CarouselIndicator, type CarouselIndicatorProps } from './carousel-indicator';
+import { CarouselIndicatorGroup, type CarouselIndicatorGroupProps } from './carousel-indicator-group';
+import { CarouselNextSlideTrigger, type CarouselNextSlideTriggerProps } from './carousel-next-slide-trigger';
+import { CarouselPrevSlideTrigger, type CarouselPrevSlideTriggerProps } from './carousel-prev-slide-trigger';
+import { CarouselSlide, type CarouselSlideProps } from './carousel-slide';
+import { CarouselSlideGroup, type CarouselSlideGroupProps } from './carousel-slide-group';
+import { CarouselViewport, type CarouselViewportProps } from './carousel-viewport';
+import { carouselAnatomy } from './carousel.anatomy';
+declare const Carousel: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & {
+    children: ReactNode | ((pages: PublicApi<JSX.IntrinsicElements & {
+        element: HTMLAttributes<HTMLElement>;
+        style: CSSProperties;
+    }>) => ReactNode);
+}, "getRootNode" | "id" | "ids" | "orientation" | "spacing" | "dir" | "loop" | "align" | "slidesPerView" | "index" | "onSlideChange"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>> & {
+    Root: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & {
+        children: ReactNode | ((pages: PublicApi<JSX.IntrinsicElements & {
+            element: HTMLAttributes<HTMLElement>;
+            style: CSSProperties;
+        }>) => ReactNode);
+    }, "getRootNode" | "id" | "ids" | "orientation" | "spacing" | "dir" | "loop" | "align" | "slidesPerView" | "index" | "onSlideChange"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>>;
+    Control: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Indicator: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, keyof SlideIndicatorProps> & SlideIndicatorProps & RefAttributes<HTMLButtonElement>>;
+    IndicatorGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    NextSlideTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    PrevSlideTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    Slide: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, "index"> & SlideProps & RefAttributes<HTMLDivElement>>;
+    SlideGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Viewport: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+};
+export { Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselNextSlideTrigger, CarouselPrevSlideTrigger, CarouselSlide, CarouselSlideGroup, CarouselViewport, carouselAnatomy, useCarouselContext, };
+export type { CarouselControlProps, CarouselIndicatorGroupProps, CarouselIndicatorProps, CarouselNextSlideTriggerProps, CarouselPrevSlideTriggerProps, CarouselProps, CarouselSlideGroupProps, CarouselSlideProps, CarouselViewportProps, };

package/carousel/index.mjs

@@ -1,11 +1,25 @@
-export { Carousel } from './carousel.mjs';
+import { Carousel as Carousel$1 } from './carousel.mjs';
 export { useCarouselContext } from './carousel-context.mjs';
-export { CarouselControl } from './carousel-control.mjs';
-export { CarouselIndicator } from './carousel-indicator.mjs';
-export { CarouselIndicatorGroup } from './carousel-indicator-group.mjs';
-export { CarouselNextSlideTrigger } from './carousel-next-slide-trigger.mjs';
-export { CarouselPrevSlideTrigger } from './carousel-prev-slide-trigger.mjs';
-export { CarouselSlide } from './carousel-slide.mjs';
-export { CarouselSlideGroup } from './carousel-slide-group.mjs';
-export { CarouselViewport } from './carousel-viewport.mjs';
+import { CarouselControl } from './carousel-control.mjs';
+import { CarouselIndicator } from './carousel-indicator.mjs';
+import { CarouselIndicatorGroup } from './carousel-indicator-group.mjs';
+import { CarouselNextSlideTrigger } from './carousel-next-slide-trigger.mjs';
+import { CarouselPrevSlideTrigger } from './carousel-prev-slide-trigger.mjs';
+import { CarouselSlide } from './carousel-slide.mjs';
+import { CarouselSlideGroup } from './carousel-slide-group.mjs';
+import { CarouselViewport } from './carousel-viewport.mjs';
 export { carouselAnatomy } from './carousel.anatomy.mjs';
+
+const Carousel = Object.assign(Carousel$1, {
+  Root: Carousel$1,
+  Control: CarouselControl,
+  Indicator: CarouselIndicator,
+  IndicatorGroup: CarouselIndicatorGroup,
+  NextSlideTrigger: CarouselNextSlideTrigger,
+  PrevSlideTrigger: CarouselPrevSlideTrigger,
+  Slide: CarouselSlide,
+  SlideGroup: CarouselSlideGroup,
+  Viewport: CarouselViewport
+});
+
+export { Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselNextSlideTrigger, CarouselPrevSlideTrigger, CarouselSlide, CarouselSlideGroup, CarouselViewport };

package/carousel/use-carousel.cjs

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

package/carousel/use-carousel.d.ts

@@ -1,4 +1,5 @@
-import type { HTMLAttributes, CSSProperties } from 'react';
+import { HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import * as carousel from '@zag-js/carousel';
 import { type Optional } from '../types';
 export type UseCarouselProps = Optional<carousel.Context, 'id'>;

package/carousel/use-carousel.mjs

@@ -2,6 +2,7 @@
 import * as carousel from '@zag-js/carousel';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useCarousel = (props) => {

package/checkbox/checkbox-context.d.ts

@@ -1,5 +1,6 @@
-import type { PublicApi } from '@zag-js/checkbox';
-import type { Provider, HTMLAttributes, CSSProperties } from 'react';
+import { PublicApi } from '@zag-js/checkbox';
+import { Provider, HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import { type UseCheckboxReturn } from './use-checkbox';
 export type CheckboxContext = UseCheckboxReturn;
 export declare const CheckboxProvider: Provider<PublicApi<JSX.IntrinsicElements & {

package/checkbox/checkbox-control.cjs

@@ -10,9 +10,12 @@ const factory = require('../factory.cjs');
 const checkboxContext = require('./checkbox-context.cjs');
 
 const CheckboxControl = react.forwardRef((props, ref) => {
-  const { controlProps } = checkboxContext.useCheckboxContext();
+  const { controlProps, hiddenInputProps } = checkboxContext.useCheckboxContext();
   const mergedProps = react$1.mergeProps(controlProps, props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }),
+    /* @__PURE__ */ jsxRuntime.jsx("input", { ...hiddenInputProps })
+  ] });
 });
 CheckboxControl.displayName = "CheckboxControl";
 

package/checkbox/checkbox-control.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type CheckboxControlProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const CheckboxControl: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/checkbox/checkbox-control.mjs

@@ -1,14 +1,17 @@
 'use client';
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
 import { useCheckboxContext } from './checkbox-context.mjs';
 
 const CheckboxControl = forwardRef((props, ref) => {
-  const { controlProps } = useCheckboxContext();
+  const { controlProps, hiddenInputProps } = useCheckboxContext();
   const mergedProps = mergeProps(controlProps, props);
-  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }),
+    /* @__PURE__ */ jsx("input", { ...hiddenInputProps })
+  ] });
 });
 CheckboxControl.displayName = "CheckboxControl";
 

package/checkbox/checkbox-label.d.ts

@@ -1,8 +1,8 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type CheckboxLabelProps = ComponentPropsWithoutRef<typeof ark.span>;
 export declare const CheckboxLabel: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-    ref?: ((instance: HTMLSpanElement | null) => void) | RefObject<HTMLSpanElement> | null | undefined;
+    ref?: RefObject<HTMLSpanElement> | ((instance: HTMLSpanElement | null) => void) | null | undefined;
 } & {
     asChild?: boolean | undefined;
 }, "ref"> & RefAttributes<HTMLSpanElement>>;

package/checkbox/checkbox.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, LabelHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef,  type ReactNode } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, LabelHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef, type ReactNode } from 'react';
 import { ark } from '../factory';
 import { type Assign } from '../types';
 import { type CheckboxContext } from './checkbox-context';
@@ -10,6 +10,6 @@ export declare const Checkbox: ForwardRefExoticComponent<Omit<Omit<Omit<Detailed
     ref?: ((instance: HTMLLabelElement | null) => void) | RefObject<HTMLLabelElement> | null | undefined;
 } & {
     asChild?: boolean | undefined;
-}, "ref">, "name" | "value" | "children" | "form" | "id" | "onChange" | "dir" | "disabled" | "checked" | "required" | "getRootNode" | "ids" | "invalid"> & Omit<UseCheckboxProps, "children"> & {
+}, "ref">, "name" | "value" | "children" | "getRootNode" | "form" | "id" | "ids" | "disabled" | "onChange" | "dir" | "checked" | "required" | "invalid"> & Omit<UseCheckboxProps, "children"> & {
     children: ReactNode | ((pages: CheckboxContext) => ReactNode);
 } & RefAttributes<HTMLLabelElement>>;

package/checkbox/checkbox.stories.d.ts

@@ -0,0 +1,10 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { Checkbox } from '.';
+type CheckboxType = typeof Checkbox;
+declare const meta: Meta<CheckboxType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Controlled: () => JSX.Element;
+export declare const Indeterminate: () => JSX.Element;
+export declare const RenderProp: () => JSX.Element;

package/checkbox/checkbox.test.d.ts

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

package/checkbox/index.cjs

@@ -2,21 +2,23 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const checkbox = require('./checkbox.cjs');
+const checkbox$1 = require('./checkbox.cjs');
 const checkboxContext = require('./checkbox-context.cjs');
 const checkboxControl = require('./checkbox-control.cjs');
-const checkboxInput = require('./checkbox-input.cjs');
 const checkboxLabel = require('./checkbox-label.cjs');
-const checkbox$1 = require('@zag-js/checkbox');
-
+const checkbox = require('@zag-js/checkbox');
 
+const Checkbox = Object.assign(checkbox$1.Checkbox, {
+  Root: checkbox$1.Checkbox,
+  Control: checkboxControl.CheckboxControl,
+  Label: checkboxLabel.CheckboxLabel
+});
 
-exports.Checkbox = checkbox.Checkbox;
 exports.useCheckboxContext = checkboxContext.useCheckboxContext;
 exports.CheckboxControl = checkboxControl.CheckboxControl;
-exports.CheckboxInput = checkboxInput.CheckboxInput;
 exports.CheckboxLabel = checkboxLabel.CheckboxLabel;
 Object.defineProperty(exports, 'checkboxAnatomy', {
-	enumerable: true,
-	get: () => checkbox$1.anatomy
+  enumerable: true,
+  get: () => checkbox.anatomy
 });
+exports.Checkbox = Checkbox;

package/checkbox/index.d.ts

@@ -1,7 +1,42 @@
-export type { CheckedState } from '@zag-js/checkbox';
-export { Checkbox, type CheckboxProps } from './checkbox';
-export { useCheckboxContext } from './checkbox-context';
-export { CheckboxControl, type CheckboxControlProps } from './checkbox-control';
-export { CheckboxInput, type CheckboxInputProps } from './checkbox-input';
-export { CheckboxLabel, type CheckboxLabelProps } from './checkbox-label';
-export { checkboxAnatomy } from './checkbox.anatomy';
+import { UseCheckboxProps } from './use-checkbox';
+import { ForwardRefExoticComponent, DetailedHTMLProps, LabelHTMLAttributes, RefObject, ReactNode, HTMLAttributes, CSSProperties, RefAttributes } from 'react';
+/// <reference types="react" />
+import { PublicApi, CheckedState } from '@zag-js/checkbox';
+import { type CheckboxProps } from './checkbox';
+import { useCheckboxContext } from './checkbox-context';
+import { CheckboxControl, type CheckboxControlProps } from './checkbox-control';
+import { CheckboxLabel, type CheckboxLabelProps } from './checkbox-label';
+import { checkboxAnatomy } from './checkbox.anatomy';
+declare const Checkbox: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+    ref?: ((instance: HTMLLabelElement | null) => void) | RefObject<HTMLLabelElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, "name" | "value" | "children" | "getRootNode" | "form" | "id" | "ids" | "disabled" | "onChange" | "dir" | "checked" | "required" | "invalid"> & Omit<UseCheckboxProps, "children"> & {
+    children: ReactNode | ((pages: PublicApi<JSX.IntrinsicElements & {
+        element: HTMLAttributes<HTMLElement>;
+        style: CSSProperties;
+    }>) => ReactNode);
+} & RefAttributes<HTMLLabelElement>> & {
+    Root: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+        ref?: ((instance: HTMLLabelElement | null) => void) | RefObject<HTMLLabelElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, "name" | "value" | "children" | "getRootNode" | "form" | "id" | "ids" | "disabled" | "onChange" | "dir" | "checked" | "required" | "invalid"> & Omit<UseCheckboxProps, "children"> & {
+        children: ReactNode | ((pages: PublicApi<JSX.IntrinsicElements & {
+            element: HTMLAttributes<HTMLElement>;
+            style: CSSProperties;
+        }>) => ReactNode);
+    } & RefAttributes<HTMLLabelElement>>;
+    Control: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Label: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+        ref?: RefObject<HTMLSpanElement> | ((instance: HTMLSpanElement | null) => void) | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLSpanElement>>;
+};
+export { Checkbox, CheckboxControl, CheckboxLabel, checkboxAnatomy, useCheckboxContext };
+export type { CheckboxControlProps, CheckboxLabelProps, CheckboxProps, CheckedState };

package/checkbox/index.mjs

@@ -1,6 +1,13 @@
-export { Checkbox } from './checkbox.mjs';
+import { Checkbox as Checkbox$1 } from './checkbox.mjs';
 export { useCheckboxContext } from './checkbox-context.mjs';
-export { CheckboxControl } from './checkbox-control.mjs';
-export { CheckboxInput } from './checkbox-input.mjs';
-export { CheckboxLabel } from './checkbox-label.mjs';
+import { CheckboxControl } from './checkbox-control.mjs';
+import { CheckboxLabel } from './checkbox-label.mjs';
 export { anatomy as checkboxAnatomy } from '@zag-js/checkbox';
+
+const Checkbox = Object.assign(Checkbox$1, {
+  Root: Checkbox$1,
+  Control: CheckboxControl,
+  Label: CheckboxLabel
+});
+
+export { Checkbox, CheckboxControl, CheckboxLabel };

package/checkbox/use-checkbox.cjs

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

package/checkbox/use-checkbox.d.ts

@@ -1,4 +1,5 @@
-import type { HTMLAttributes, CSSProperties } from 'react';
+import { HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import * as checkbox from '@zag-js/checkbox';
 import { type Optional } from '../types';
 export type UseCheckboxProps = Optional<checkbox.Context, 'id'>;

package/checkbox/use-checkbox.mjs

@@ -2,6 +2,7 @@
 import * as checkbox from '@zag-js/checkbox';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useCheckbox = (props) => {

package/color-picker/color-picker-area-context.d.ts

@@ -1,3 +1,4 @@
-import type { Provider } from 'react';
+import { Provider } from 'react';
+/// <reference types="react" />
 import type { ColorAreaProps } from '@zag-js/color-picker';
 export declare const ColorPickerAreaProvider: Provider<ColorAreaProps>, useColorPickerAreaContext: () => ColorAreaProps;

package/color-picker/color-picker-area-gradient.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerAreaGradientProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerAreaGradient: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/color-picker/color-picker-area-thumb.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerAreaThumbProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerAreaThumb: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

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

@@ -1,5 +1,5 @@
 import type { ColorAreaProps } from '@zag-js/color-picker';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 export type ColorPickerAreaProps = Assign<ComponentPropsWithoutRef<typeof ark.div>, ColorAreaProps>;

package/color-picker/color-picker-channel-input.d.ts

@@ -1,5 +1,5 @@
 import type { ColorChannelInputProps } from '@zag-js/color-picker';
-import type { ForwardRefExoticComponent, InputHTMLAttributes, DetailedHTMLProps, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, InputHTMLAttributes, DetailedHTMLProps, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 export type ColorPickerChannelInputProps = Assign<ColorChannelInputProps, ComponentPropsWithoutRef<typeof ark.input>>;

package/color-picker/color-picker-channel-slider-background.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerChannelSliderBackgroundProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerChannelSliderBackground: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/color-picker/color-picker-channel-slider-context.d.ts

@@ -1,3 +1,4 @@
-import type { Provider } from 'react';
+import { Provider } from 'react';
+/// <reference types="react" />
 import type { ColorChannelProps } from '@zag-js/color-picker';
 export declare const ColorPickerChannelSliderProvider: Provider<ColorChannelProps>, useColorPickerChannelSliderContext: () => ColorChannelProps;

package/color-picker/color-picker-channel-slider-thumb.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerChannelSliderThumbProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerChannelSliderThumb: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/color-picker/color-picker-channel-slider-track.d.ts

@@ -1,5 +1,5 @@
 import type { ColorChannelProps } from '@zag-js/color-picker';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 export type ColorPickerChannelSliderTrackProps = Assign<ComponentPropsWithoutRef<typeof ark.div>, ColorChannelProps>;

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

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerContentProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerContent: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

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

@@ -1,5 +1,6 @@
-import type { PublicApi } from '@zag-js/color-picker';
-import type { Provider, HTMLAttributes, CSSProperties } from 'react';
+import { PublicApi } from '@zag-js/color-picker';
+import { Provider, HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import { type UseColorPickerReturn } from './use-color-picker';
 export type ColorPickerContext = UseColorPickerReturn;
 export declare const ColorPickerProvider: Provider<PublicApi<JSX.IntrinsicElements & {

package/color-picker/color-picker-eye-dropper-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerEyeDropperTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const ColorPickerEyeDropperTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/color-picker/color-picker-swatch-background.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerSwatchBackgroundProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerSwatchBackground: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/color-picker/color-picker-swatch-context.d.ts

@@ -1,3 +1,4 @@
-import type { Provider } from 'react';
+import { Provider } from 'react';
+/// <reference types="react" />
 import type { ColorSwatchProps } from '@zag-js/color-picker';
 export declare const ColorPickerSwatchProvider: Provider<ColorSwatchProps>, useColorPickerSwatchContext: () => ColorSwatchProps;

package/color-picker/color-picker-swatch-group.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type ColorPickerSwatchGroupProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const ColorPickerSwatchGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

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

@@ -1,5 +1,5 @@
 import type { ColorSwatchProps } from '@zag-js/color-picker';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 export type ColorPickerSwatchProps = Assign<ComponentPropsWithoutRef<typeof ark.button>, ColorSwatchProps>;