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

package/CHANGELOG.md

@@ -6,23 +6,31 @@ description: All notable changes to this project will be documented in this file
 
 ## [Unreleased]
 
-## [0.10.0] - 2023-08-02
+## [0.11.0-beta.1] - 2023-08-08
 
-## Added
+- Add support for dot noation imports
 
-- Developers can now set default options for all `Toast` components in their application, ensuring a consistent look and feel across the board.
+## [0.11.0-beta.0] - 2023-08-07
 
-## [0.10.0-beta.1] - 2023-07-29
+### Added
 
-### Changed
+- Added `ComboboxOptionGroup` and `ComboboxClearTrigger` components to the `Combobox` component.
+- Added `DatePickerPositioner` component to the `DatePicker` component to help with positioning the calendar.
+- Added `ComboboxOptionGroupLabel` to the `Combobox` component. This component can be used to render a label for a group of options in the `ComboboxOptionGroup` component.
 
-- Simplified forwardRef setup
+### Removed
 
-## [0.10.0-beta.0] - 2023-07-29
+- BREAKING: Removed `CheckboxInput`. This component is no longer required.
 
-### Changed
+## [0.10.0] - 2023-08-02
 
+### Added
+
+- Developers can now set default options for all `Toast` components in their application, ensuring a consistent look and feel across the board.
 - Updated number input `onChange` handler to allow synchronous updates to the value when using the scrubber.
+
+### Changed
+
 - Improved TypeScript typings in our factory functions. The changes allow for more accurate type inference for the `ref` property when dealing with both intrinsic HTML elements and custom React components.
 
 ## [0.9.0] - 2023-07-21
@@ -152,7 +160,7 @@ description: All notable changes to this project will be documented in this file
 - Add `Toast`
 - Add `Tooltip`
 
-[unreleased]: https://github.com/chakra-ui/ark/compare/@ark-ui/react@0.10.0...HEAD
+[unreleased]: https://github.com/chakra-ui/ark/compare/@ark-ui/react@0.11.0-beta.1...HEAD
 [0.1.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.1.0
 [0.2.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.2.0
 [0.3.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.3.0
@@ -166,7 +174,7 @@ description: All notable changes to this project will be documented in this file
 [0.8.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.8.0
 [0.8.1]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.8.1
 [0.9.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.9.0
-[0.10.0-beta.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.10.0-beta.0
-[0.10.0-beta.1]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.10.0-beta.1
-
 [0.10.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.10.0
+[0.11.0-beta.0]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.11.0-beta.0
+
+[0.11.0-beta.1]: https://github.com/chakra-ui/ark/releases/tag/@ark-ui/react@0.11.0-beta.1

package/accordion/accordion-content.cjs

@@ -7,10 +7,11 @@ const jsxRuntime = require('react/jsx-runtime');
 const react$1 = require('@zag-js/react');
 const react = require('react');
 const factory = require('../factory.cjs');
-const splitPresenceProps = require('../presence/split-presence-props.cjs');
+require('../presence/index.cjs');
 const accordionContext = require('./accordion-context.cjs');
 const accordionItemContext = require('./accordion-item-context.cjs');
 const accordionItemPresence = require('./accordion-item-presence.cjs');
+const splitPresenceProps = require('../presence/split-presence-props.cjs');
 
 const AccordionContent = react.forwardRef(
   function AccordionContent2(props, ref) {

package/accordion/accordion-content.d.ts

@@ -1,5 +1,5 @@
-import type { PresenceProps } from '../presence';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { PresenceProps } from '../presence';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import { type AccordionItemPresenceProps } from './accordion-item-presence';
 export type AccordionContentProps = ComponentPropsWithoutRef<typeof ark.div> & Omit<AccordionItemPresenceProps, 'children'>;

package/accordion/accordion-content.mjs

@@ -3,10 +3,11 @@ import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { splitPresenceProps } from '../presence/split-presence-props.mjs';
+import '../presence/index.mjs';
 import { useAccordionContext } from './accordion-context.mjs';
 import { useAccordionItemContext } from './accordion-item-context.mjs';
 import { AccordionItemPresence } from './accordion-item-presence.mjs';
+import { splitPresenceProps } from '../presence/split-presence-props.mjs';
 
 const AccordionContent = forwardRef(
   function AccordionContent2(props, ref) {

package/accordion/accordion-context.d.ts

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

package/accordion/accordion-item-context.d.ts

@@ -1,4 +1,5 @@
-import type { Provider } from 'react';
+import { Provider } from 'react';
+/// <reference types="react" />
 import { type AccordionContext } from './accordion-context';
 export type AccordionItemContext = ReturnType<AccordionContext['getItemState']> & {
     value: string;

package/accordion/accordion-item-presence.cjs

@@ -4,13 +4,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const presence = require('../presence/presence.cjs');
+const index = require('../presence/index.cjs');
 const accordionItemContext = require('./accordion-item-context.cjs');
 
 const AccordionItemPresence = (props) => {
   const { present, ...rest } = props;
   const { isOpen } = accordionItemContext.useAccordionItemContext();
-  return /* @__PURE__ */ jsxRuntime.jsx(presence.Presence, { present: present !== void 0 ? present : isOpen, ...rest });
+  return /* @__PURE__ */ jsxRuntime.jsx(index.Presence, { present: present !== void 0 ? present : isOpen, ...rest });
 };
 
 exports.AccordionItemPresence = AccordionItemPresence;

package/accordion/accordion-item-presence.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'react/jsx-runtime';
+import { JSX } from 'react/jsx-runtime';
 import { type PresenceProps } from '../presence';
 export type AccordionItemPresenceProps = PresenceProps;
 export declare const AccordionItemPresence: (props: AccordionItemPresenceProps) => JSX.Element;

package/accordion/accordion-item-presence.mjs

@@ -1,6 +1,6 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
-import { Presence } from '../presence/presence.mjs';
+import { Presence } from '../presence/index.mjs';
 import { useAccordionItemContext } from './accordion-item-context.mjs';
 
 const AccordionItemPresence = (props) => {

package/accordion/accordion-item.d.ts

@@ -1,5 +1,5 @@
 import type { ItemProps, ItemState } from '@zag-js/accordion';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, ReactNode, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, ReactNode, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 export type AccordionItemProps = ItemProps & Assign<ComponentPropsWithoutRef<typeof ark.div>, {

package/accordion/accordion-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 AccordionTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const AccordionTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/accordion/accordion.d.ts

@@ -1,5 +1,5 @@
-import type { Context } from '@zag-js/accordion';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { Context } from '@zag-js/accordion';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import type { Assign } from '../types';
 import { type UseAccordionProps } from './use-accordion';
@@ -8,6 +8,6 @@ export declare const Accordion: ForwardRefExoticComponent<Omit<Omit<Omit<Detaile
     ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
 } & {
     asChild?: boolean | undefined;
-}, "ref">, "value" | "id" | "orientation" | "onChange" | "defaultValue" | "dir" | "disabled" | "multiple" | "getRootNode" | "ids" | "collapsible"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
+}, "ref">, "value" | "getRootNode" | "id" | "ids" | "disabled" | "orientation" | "onChange" | "defaultValue" | "dir" | "multiple" | "collapsible"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
     defaultValue?: string | string[] | null | undefined;
 } & RefAttributes<HTMLDivElement>>;

package/accordion/accordion.stories.d.ts

@@ -0,0 +1,14 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { Accordion } from '.';
+type AccordionType = typeof Accordion;
+declare const meta: Meta<AccordionType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Initial: () => JSX.Element;
+export declare const RenderProp: () => JSX.Element;
+export declare const Collapsible: () => JSX.Element;
+export declare const Multiple: () => JSX.Element;
+export declare const Controlled: () => JSX.Element;
+export declare const Vertical: () => JSX.Element;
+export declare const Disabled: () => JSX.Element;

package/accordion/accordion.test.d.ts

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

package/accordion/index.cjs

@@ -2,23 +2,28 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const accordion = require('./accordion.cjs');
+const accordion$1 = require('./accordion.cjs');
 const accordionContent = require('./accordion-content.cjs');
 const accordionContext = require('./accordion-context.cjs');
 const accordionItem = require('./accordion-item.cjs');
 const accordionItemContext = require('./accordion-item-context.cjs');
 const accordionTrigger = require('./accordion-trigger.cjs');
-const accordion$1 = require('@zag-js/accordion');
-
+const accordion = require('@zag-js/accordion');
 
+const Accordion = Object.assign(accordion$1.Accordion, {
+  Root: accordion$1.Accordion,
+  Content: accordionContent.AccordionContent,
+  Item: accordionItem.AccordionItem,
+  Trigger: accordionTrigger.AccordionTrigger
+});
 
-exports.Accordion = accordion.Accordion;
 exports.AccordionContent = accordionContent.AccordionContent;
 exports.useAccordionContext = accordionContext.useAccordionContext;
 exports.AccordionItem = accordionItem.AccordionItem;
 exports.useAccordionItemContext = accordionItemContext.useAccordionItemContext;
 exports.AccordionTrigger = accordionTrigger.AccordionTrigger;
 Object.defineProperty(exports, 'accordionAnatomy', {
-	enumerable: true,
-	get: () => accordion$1.anatomy
+  enumerable: true,
+  get: () => accordion.anatomy
 });
+exports.Accordion = Accordion;

package/accordion/index.d.ts

@@ -1,7 +1,45 @@
-export { Accordion, type AccordionProps } from './accordion';
-export { AccordionContent, type AccordionContentProps } from './accordion-content';
-export { useAccordionContext } from './accordion-context';
-export { AccordionItem, type AccordionItemProps } from './accordion-item';
-export { useAccordionItemContext } from './accordion-item-context';
-export { AccordionTrigger, type AccordionTriggerProps } from './accordion-trigger';
-export { accordionAnatomy } from './accordion.anatomy';
+import { PresenceProps } from '..';
+import { Context, ItemProps, ItemState } from '@zag-js/accordion';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, ReactNode, ButtonHTMLAttributes } from 'react';
+/// <reference types="react" />
+import { type AccordionProps } from './accordion';
+import { AccordionContent, type AccordionContentProps } from './accordion-content';
+import { useAccordionContext } from './accordion-context';
+import { AccordionItem, type AccordionItemProps } from './accordion-item';
+import { useAccordionItemContext } from './accordion-item-context';
+import { AccordionTrigger, type AccordionTriggerProps } from './accordion-trigger';
+import { accordionAnatomy } from './accordion.anatomy';
+declare const Accordion: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, "value" | "getRootNode" | "id" | "ids" | "disabled" | "orientation" | "onChange" | "defaultValue" | "dir" | "multiple" | "collapsible"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
+    defaultValue?: string | string[] | null | undefined;
+} & 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">, "value" | "getRootNode" | "id" | "ids" | "disabled" | "orientation" | "onChange" | "defaultValue" | "dir" | "multiple" | "collapsible"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
+        defaultValue?: string | string[] | null | undefined;
+    } & RefAttributes<HTMLDivElement>>;
+    Content: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;
+    Item: ForwardRefExoticComponent<ItemProps & Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, "children"> & {
+        children?: ReactNode | ((props: ItemState) => ReactNode);
+    } & RefAttributes<HTMLDivElement>>;
+    Trigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+};
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, accordionAnatomy, useAccordionContext, useAccordionItemContext, };
+export type { AccordionContentProps, AccordionItemProps, AccordionProps, AccordionTriggerProps };

package/accordion/index.mjs

@@ -1,7 +1,16 @@
-export { Accordion } from './accordion.mjs';
-export { AccordionContent } from './accordion-content.mjs';
+import { Accordion as Accordion$1 } from './accordion.mjs';
+import { AccordionContent } from './accordion-content.mjs';
 export { useAccordionContext } from './accordion-context.mjs';
-export { AccordionItem } from './accordion-item.mjs';
+import { AccordionItem } from './accordion-item.mjs';
 export { useAccordionItemContext } from './accordion-item-context.mjs';
-export { AccordionTrigger } from './accordion-trigger.mjs';
+import { AccordionTrigger } from './accordion-trigger.mjs';
 export { anatomy as accordionAnatomy } from '@zag-js/accordion';
+
+const Accordion = Object.assign(Accordion$1, {
+  Root: Accordion$1,
+  Content: AccordionContent,
+  Item: AccordionItem,
+  Trigger: AccordionTrigger
+});
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/accordion/use-accordion.cjs

@@ -6,6 +6,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const accordion = require('@zag-js/accordion');
 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/accordion/use-accordion.d.ts

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

package/accordion/use-accordion.mjs

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

package/avatar/avatar-context.d.ts

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

package/avatar/avatar-fallback.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 AvatarFallbackProps = ComponentPropsWithoutRef<typeof ark.span>;
 export declare const AvatarFallback: 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/avatar/avatar-image.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, ImgHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, ImgHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type AvatarImageProps = ComponentPropsWithoutRef<typeof ark.img>;
 export declare const AvatarImage: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {

package/avatar/avatar.d.ts

@@ -1,5 +1,5 @@
-import type { Context } from '@zag-js/avatar';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { Context } from '@zag-js/avatar';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import { type Assign } from '../types';
 import { type UseAvatarProps } from './use-avatar';
@@ -8,4 +8,4 @@ export declare const Avatar: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHT
     ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
 } & {
     asChild?: boolean | undefined;
-}, "ref">, "id" | "onLoad" | "onError" | "getRootNode"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>>;
+}, "ref">, "getRootNode" | "id" | "onLoad" | "onError"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>>;

package/avatar/avatar.stories.d.ts

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

package/avatar/index.cjs

@@ -2,19 +2,23 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const avatar = require('./avatar.cjs');
+const avatar$1 = require('./avatar.cjs');
 const avatarContext = require('./avatar-context.cjs');
 const avatarFallback = require('./avatar-fallback.cjs');
 const avatarImage = require('./avatar-image.cjs');
-const avatar$1 = require('@zag-js/avatar');
-
+const avatar = require('@zag-js/avatar');
 
+const Avatar = Object.assign(avatar$1.Avatar, {
+  Root: avatar$1.Avatar,
+  Fallback: avatarFallback.AvatarFallback,
+  Image: avatarImage.AvatarImage
+});
 
-exports.Avatar = avatar.Avatar;
 exports.useAvatarContext = avatarContext.useAvatarContext;
 exports.AvatarFallback = avatarFallback.AvatarFallback;
 exports.AvatarImage = avatarImage.AvatarImage;
 Object.defineProperty(exports, 'avatarAnatomy', {
-	enumerable: true,
-	get: () => avatar$1.anatomy
+  enumerable: true,
+  get: () => avatar.anatomy
 });
+exports.Avatar = Avatar;

package/avatar/index.d.ts

@@ -1,5 +1,31 @@
-export { Avatar, type AvatarProps } from './avatar';
-export { useAvatarContext } from './avatar-context';
-export { AvatarFallback, type AvatarFallbackProps } from './avatar-fallback';
-export { AvatarImage, type AvatarImageProps } from './avatar-image';
-export { avatarAnatomy } from './avatar.anatomy';
+import { Context } from '@zag-js/avatar';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, ImgHTMLAttributes } from 'react';
+/// <reference types="react" />
+import { type AvatarProps } from './avatar';
+import { useAvatarContext } from './avatar-context';
+import { AvatarFallback, type AvatarFallbackProps } from './avatar-fallback';
+import { AvatarImage, type AvatarImageProps } from './avatar-image';
+import { avatarAnatomy } from './avatar.anatomy';
+declare const Avatar: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, "getRootNode" | "id" | "onLoad" | "onError"> & 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">, "getRootNode" | "id" | "onLoad" | "onError"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & RefAttributes<HTMLDivElement>>;
+    Fallback: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+        ref?: RefObject<HTMLSpanElement> | ((instance: HTMLSpanElement | null) => void) | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLSpanElement>>;
+    Image: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+        ref?: ((instance: HTMLImageElement | null) => void) | RefObject<HTMLImageElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLImageElement>>;
+};
+export { Avatar, AvatarFallback, AvatarImage, avatarAnatomy, useAvatarContext };
+export type { AvatarFallbackProps, AvatarImageProps, AvatarProps };

package/avatar/index.mjs

@@ -1,5 +1,13 @@
-export { Avatar } from './avatar.mjs';
+import { Avatar as Avatar$1 } from './avatar.mjs';
 export { useAvatarContext } from './avatar-context.mjs';
-export { AvatarFallback } from './avatar-fallback.mjs';
-export { AvatarImage } from './avatar-image.mjs';
+import { AvatarFallback } from './avatar-fallback.mjs';
+import { AvatarImage } from './avatar-image.mjs';
 export { anatomy as avatarAnatomy } from '@zag-js/avatar';
+
+const Avatar = Object.assign(Avatar$1, {
+  Root: Avatar$1,
+  Fallback: AvatarFallback,
+  Image: AvatarImage
+});
+
+export { Avatar, AvatarFallback, AvatarImage };

package/avatar/use-avatar.cjs

@@ -6,6 +6,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const avatar = require('@zag-js/avatar');
 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/avatar/use-avatar.d.ts

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

package/avatar/use-avatar.mjs

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

package/carousel/carousel-context.d.ts

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

package/carousel/carousel-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 CarouselControlProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const CarouselControl: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/carousel/carousel-indicator-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 CarouselIndicatorGroupProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const CarouselIndicatorGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/carousel/carousel-indicator.d.ts

@@ -1,5 +1,5 @@
 import type { SlideIndicatorProps } from '@zag-js/carousel';
-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 CarouselIndicatorProps = Assign<ComponentPropsWithoutRef<typeof ark.button>, SlideIndicatorProps>;

package/carousel/carousel-next-slide-trigger.cjs

@@ -10,8 +10,8 @@ const factory = require('../factory.cjs');
 const carouselContext = require('./carousel-context.cjs');
 
 const CarouselNextSlideTrigger = react.forwardRef((props, ref) => {
-  const { nextTriggerProps } = carouselContext.useCarouselContext();
-  const mergedProps = react$1.mergeProps(nextTriggerProps, props);
+  const { nextSlideTriggerProps } = carouselContext.useCarouselContext();
+  const mergedProps = react$1.mergeProps(nextSlideTriggerProps, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
 });
 CarouselNextSlideTrigger.displayName = "CarouselNextSlideTrigger";

package/carousel/carousel-next-slide-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 CarouselNextSlideTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const CarouselNextSlideTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/carousel/carousel-next-slide-trigger.mjs

@@ -6,8 +6,8 @@ import { ark } from '../factory.mjs';
 import { useCarouselContext } from './carousel-context.mjs';
 
 const CarouselNextSlideTrigger = forwardRef((props, ref) => {
-  const { nextTriggerProps } = useCarouselContext();
-  const mergedProps = mergeProps(nextTriggerProps, props);
+  const { nextSlideTriggerProps } = useCarouselContext();
+  const mergedProps = mergeProps(nextSlideTriggerProps, props);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
 });
 CarouselNextSlideTrigger.displayName = "CarouselNextSlideTrigger";

package/carousel/carousel-prev-slide-trigger.cjs

@@ -10,8 +10,8 @@ const factory = require('../factory.cjs');
 const carouselContext = require('./carousel-context.cjs');
 
 const CarouselPrevSlideTrigger = react.forwardRef((props, ref) => {
-  const { prevTriggerProps } = carouselContext.useCarouselContext();
-  const mergedProps = react$1.mergeProps(prevTriggerProps, props);
+  const { prevSlideTriggerProps } = carouselContext.useCarouselContext();
+  const mergedProps = react$1.mergeProps(prevSlideTriggerProps, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
 });
 CarouselPrevSlideTrigger.displayName = "CarouselPrevSlideTrigger";

package/carousel/carousel-prev-slide-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 CarouselPrevSlideTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const CarouselPrevSlideTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/carousel/carousel-prev-slide-trigger.mjs

@@ -6,8 +6,8 @@ import { ark } from '../factory.mjs';
 import { useCarouselContext } from './carousel-context.mjs';
 
 const CarouselPrevSlideTrigger = forwardRef((props, ref) => {
-  const { prevTriggerProps } = useCarouselContext();
-  const mergedProps = mergeProps(prevTriggerProps, props);
+  const { prevSlideTriggerProps } = useCarouselContext();
+  const mergedProps = mergeProps(prevSlideTriggerProps, props);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
 });
 CarouselPrevSlideTrigger.displayName = "CarouselPrevSlideTrigger";