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

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

package/editable/editable-context.d.ts

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

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

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

package/editable/editable-input.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, InputHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, InputHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type EditableInputProps = ComponentPropsWithoutRef<typeof ark.input>;
 export declare const EditableInput: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {

package/editable/editable-label.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, LabelHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, LabelHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type EditableLabelProps = ComponentPropsWithoutRef<typeof ark.label>;
 export declare const EditableLabel: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {

package/editable/editable-preview.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 EditablePreviewProps = ComponentPropsWithoutRef<typeof ark.span>;
 export declare const EditablePreview: 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/editable/editable-submit-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 EditableSubmitTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const EditableSubmitTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/editable/editable.cjs

@@ -32,7 +32,9 @@ const Editable = react.forwardRef((props, ref) => {
       "onCancel",
       "onChange",
       "onEdit",
+      "onFocusOutside",
       "onInteractOutside",
+      "onPointerDownOutside",
       "onSubmit",
       "placeholder",
       "readOnly",

package/editable/editable.d.ts

@@ -1,5 +1,5 @@
-import type { Context } from '@zag-js/editable';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef,  type ReactNode } from 'react';
+import { Context } from '@zag-js/editable';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef, type ReactNode } from 'react';
 import { ark } from '../factory';
 import { type Assign } from '../types';
 import { type EditableContext } from './editable-context';
@@ -13,6 +13,6 @@ export declare const Editable: ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Det
     asChild?: boolean | undefined;
 }, "ref">, "children"> & {
     children: ReactNode | ((pages: EditableContext) => ReactNode);
-}, "name" | "value" | "form" | "id" | "onChange" | "onSubmit" | "defaultValue" | "dir" | "placeholder" | "disabled" | "onCancel" | "maxLength" | "readOnly" | "getRootNode" | "ids" | "invalid" | "onInteractOutside" | "translations" | "finalFocusEl" | "autoResize" | "activationMode" | "submitMode" | "startWithEditView" | "selectOnFocus" | "onEdit"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
+}, "name" | "value" | "getRootNode" | "form" | "id" | "ids" | "disabled" | "onChange" | "onSubmit" | "defaultValue" | "dir" | "placeholder" | "onCancel" | "maxLength" | "readOnly" | "invalid" | "translations" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "finalFocusEl" | "autoResize" | "activationMode" | "submitMode" | "startWithEditView" | "selectOnFocus" | "onEdit"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
     defaultValue?: string | undefined;
 } & RefAttributes<HTMLDivElement>>;

package/editable/editable.mjs

@@ -28,7 +28,9 @@ const Editable = forwardRef((props, ref) => {
       "onCancel",
       "onChange",
       "onEdit",
+      "onFocusOutside",
       "onInteractOutside",
+      "onPointerDownOutside",
       "onSubmit",
       "placeholder",
       "readOnly",

package/editable/editable.stories.d.ts

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

package/editable/editable.test.d.ts

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

package/editable/index.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const editable = require('./editable.cjs');
+const editable$1 = require('./editable.cjs');
 const editableArea = require('./editable-area.cjs');
 const editableCancelTrigger = require('./editable-cancel-trigger.cjs');
 const editableContext = require('./editable-context.cjs');
@@ -12,11 +12,20 @@ const editableInput = require('./editable-input.cjs');
 const editableLabel = require('./editable-label.cjs');
 const editablePreview = require('./editable-preview.cjs');
 const editableSubmitTrigger = require('./editable-submit-trigger.cjs');
-const editable$1 = require('@zag-js/editable');
-
+const editable = require('@zag-js/editable');
 
+const Editable = Object.assign(editable$1.Editable, {
+  Root: editable$1.Editable,
+  Area: editableArea.EditableArea,
+  CancelTrigger: editableCancelTrigger.EditableCancelTrigger,
+  Control: editableControl.EditableControl,
+  EditTrigger: editableEditTrigger.EditableEditTrigger,
+  Input: editableInput.EditableInput,
+  Label: editableLabel.EditableLabel,
+  Preview: editablePreview.EditablePreview,
+  SubmitTrigger: editableSubmitTrigger.EditableSubmitTrigger
+});
 
-exports.Editable = editable.Editable;
 exports.EditableArea = editableArea.EditableArea;
 exports.EditableCancelTrigger = editableCancelTrigger.EditableCancelTrigger;
 exports.useEditableContext = editableContext.useEditableContext;
@@ -27,6 +36,7 @@ exports.EditableLabel = editableLabel.EditableLabel;
 exports.EditablePreview = editablePreview.EditablePreview;
 exports.EditableSubmitTrigger = editableSubmitTrigger.EditableSubmitTrigger;
 Object.defineProperty(exports, 'editableAnatomy', {
-	enumerable: true,
-	get: () => editable$1.anatomy
+  enumerable: true,
+  get: () => editable.anatomy
 });
+exports.Editable = Editable;

package/editable/index.d.ts

@@ -1,11 +1,81 @@
-export { Editable, type EditableProps } from './editable';
-export { EditableArea, type EditableAreaProps } from './editable-area';
-export { EditableCancelTrigger, type EditableCancelTriggerProps } from './editable-cancel-trigger';
-export { useEditableContext } from './editable-context';
-export { EditableControl, type EditableControlProps } from './editable-control';
-export { EditableEditTrigger, type EditableEditTriggerProps } from './editable-edit-trigger';
-export { EditableInput, type EditableInputProps } from './editable-input';
-export { EditableLabel, type EditableLabelProps } from './editable-label';
-export { EditablePreview, type EditablePreviewProps } from './editable-preview';
-export { EditableSubmitTrigger, type EditableSubmitTriggerProps } from './editable-submit-trigger';
-export { editableAnatomy } from './editable.anatomy';
+import { PublicApi, Context } from '@zag-js/editable';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, ReactNode, CSSProperties, RefAttributes, ButtonHTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes } from 'react';
+/// <reference types="react" />
+import { type EditableProps } from './editable';
+import { EditableArea, type EditableAreaProps } from './editable-area';
+import { EditableCancelTrigger, type EditableCancelTriggerProps } from './editable-cancel-trigger';
+import { useEditableContext } from './editable-context';
+import { EditableControl, type EditableControlProps } from './editable-control';
+import { EditableEditTrigger, type EditableEditTriggerProps } from './editable-edit-trigger';
+import { EditableInput, type EditableInputProps } from './editable-input';
+import { EditableLabel, type EditableLabelProps } from './editable-label';
+import { EditablePreview, type EditablePreviewProps } from './editable-preview';
+import { EditableSubmitTrigger, type EditableSubmitTriggerProps } from './editable-submit-trigger';
+import { editableAnatomy } from './editable.anatomy';
+declare const Editable: ForwardRefExoticComponent<Omit<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, "children"> & {
+    children: ReactNode | ((pages: PublicApi<JSX.IntrinsicElements & {
+        element: HTMLAttributes<HTMLElement>;
+        style: CSSProperties;
+    }>) => ReactNode);
+}, "name" | "value" | "getRootNode" | "form" | "id" | "ids" | "disabled" | "onChange" | "onSubmit" | "defaultValue" | "dir" | "placeholder" | "onCancel" | "maxLength" | "readOnly" | "invalid" | "translations" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "finalFocusEl" | "autoResize" | "activationMode" | "submitMode" | "startWithEditView" | "selectOnFocus" | "onEdit"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
+    defaultValue?: string | undefined;
+} & RefAttributes<HTMLDivElement>> & {
+    Root: ForwardRefExoticComponent<Omit<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, "children"> & {
+        children: ReactNode | ((pages: PublicApi<JSX.IntrinsicElements & {
+            element: HTMLAttributes<HTMLElement>;
+            style: CSSProperties;
+        }>) => ReactNode);
+    }, "name" | "value" | "getRootNode" | "form" | "id" | "ids" | "disabled" | "onChange" | "onSubmit" | "defaultValue" | "dir" | "placeholder" | "onCancel" | "maxLength" | "readOnly" | "invalid" | "translations" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "finalFocusEl" | "autoResize" | "activationMode" | "submitMode" | "startWithEditView" | "selectOnFocus" | "onEdit"> & Pick<Partial<Context>, "id"> & Omit<Context, "id"> & {
+        defaultValue?: string | undefined;
+    } & RefAttributes<HTMLDivElement>>;
+    Area: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    CancelTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    Control: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    EditTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    Input: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+        ref?: ((instance: HTMLInputElement | null) => void) | RefObject<HTMLInputElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLInputElement>>;
+    Label: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+        ref?: ((instance: HTMLLabelElement | null) => void) | RefObject<HTMLLabelElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLLabelElement>>;
+    Preview: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+        ref?: RefObject<HTMLSpanElement> | ((instance: HTMLSpanElement | null) => void) | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLSpanElement>>;
+    SubmitTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+};
+export { Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableSubmitTrigger, editableAnatomy, useEditableContext, };
+export type { EditableAreaProps, EditableCancelTriggerProps, EditableControlProps, EditableEditTriggerProps, EditableInputProps, EditableLabelProps, EditablePreviewProps, EditableProps, EditableSubmitTriggerProps, };

package/editable/index.mjs

@@ -1,11 +1,25 @@
-export { Editable } from './editable.mjs';
-export { EditableArea } from './editable-area.mjs';
-export { EditableCancelTrigger } from './editable-cancel-trigger.mjs';
+import { Editable as Editable$1 } from './editable.mjs';
+import { EditableArea } from './editable-area.mjs';
+import { EditableCancelTrigger } from './editable-cancel-trigger.mjs';
 export { useEditableContext } from './editable-context.mjs';
-export { EditableControl } from './editable-control.mjs';
-export { EditableEditTrigger } from './editable-edit-trigger.mjs';
-export { EditableInput } from './editable-input.mjs';
-export { EditableLabel } from './editable-label.mjs';
-export { EditablePreview } from './editable-preview.mjs';
-export { EditableSubmitTrigger } from './editable-submit-trigger.mjs';
+import { EditableControl } from './editable-control.mjs';
+import { EditableEditTrigger } from './editable-edit-trigger.mjs';
+import { EditableInput } from './editable-input.mjs';
+import { EditableLabel } from './editable-label.mjs';
+import { EditablePreview } from './editable-preview.mjs';
+import { EditableSubmitTrigger } from './editable-submit-trigger.mjs';
 export { anatomy as editableAnatomy } from '@zag-js/editable';
+
+const Editable = Object.assign(Editable$1, {
+  Root: Editable$1,
+  Area: EditableArea,
+  CancelTrigger: EditableCancelTrigger,
+  Control: EditableControl,
+  EditTrigger: EditableEditTrigger,
+  Input: EditableInput,
+  Label: EditableLabel,
+  Preview: EditablePreview,
+  SubmitTrigger: EditableSubmitTrigger
+});
+
+export { Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableSubmitTrigger };

package/editable/use-editable.cjs

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

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

package/editable/use-editable.mjs

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

package/environment/environment-context.d.ts

@@ -1,4 +1,5 @@
-import type { Provider } from 'react';
+import { Provider } from 'react';
+/// <reference types="react" />
 import { type CommonProperties } from '@zag-js/types';
 export type EnvironmentContext = CommonProperties['getRootNode'];
-export declare const EnvironmentProvider: Provider<(() => Node | ShadowRoot | Document) | undefined>, useEnvironmentContext: () => (() => Node | ShadowRoot | Document) | undefined;
+export declare const EnvironmentProvider: Provider<(() => ShadowRoot | Node | Document) | undefined>, useEnvironmentContext: () => (() => ShadowRoot | Node | Document) | undefined;

package/environment/environment.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'react/jsx-runtime';
+import { JSX } from 'react/jsx-runtime';
 import { type ReactNode } from 'react';
 export type EnvironmentProps = {
     children?: ReactNode;

package/environment/environment.stories.d.ts

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

package/environment/environment.test.d.ts

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

package/environment/index.cjs

@@ -5,7 +5,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const environment = require('./environment.cjs');
 const environmentContext = require('./environment-context.cjs');
 
+const Environment = Object.assign(environment.Environment, {
+  Root: environment.Environment
+});
 
-
-exports.Environment = environment.Environment;
 exports.useEnvironmentContext = environmentContext.useEnvironmentContext;
+exports.Environment = Environment;

package/environment/index.d.ts

@@ -1,2 +1,8 @@
-export { Environment, type EnvironmentProps } from './environment';
-export { useEnvironmentContext } from './environment-context';
+import { JSX } from 'react/jsx-runtime';
+import { type EnvironmentProps } from './environment';
+import { useEnvironmentContext } from './environment-context';
+declare const Environment: ((props: EnvironmentProps) => JSX.Element) & {
+    Root: (props: EnvironmentProps) => JSX.Element;
+};
+export { Environment, useEnvironmentContext };
+export type { EnvironmentProps };

package/environment/index.mjs

@@ -1,2 +1,8 @@
-export { Environment } from './environment.mjs';
+import { Environment as Environment$1 } from './environment.mjs';
 export { useEnvironmentContext } from './environment-context.mjs';
+
+const Environment = Object.assign(Environment$1, {
+  Root: Environment$1
+});
+
+export { Environment };

package/hover-card/hover-card-arrow-tip.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 HoverCardArrowTipProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const HoverCardArrowTip: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/hover-card/hover-card-arrow.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 HoverCardArrowProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const HoverCardArrow: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/hover-card/hover-card-content.cjs

@@ -7,9 +7,10 @@ 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 hoverCardContext = require('./hover-card-context.cjs');
 const hoverCardPresence = require('./hover-card-presence.cjs');
+const splitPresenceProps = require('../presence/split-presence-props.cjs');
 
 const HoverCardContent = react.forwardRef((props, ref) => {
   const [presenceProps, hoverCardContentProps] = splitPresenceProps.splitPresenceProps(props);

package/hover-card/hover-card-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 HoverCardPresenceProps } from './hover-card-presence';
 export type HoverCardContentProps = ComponentPropsWithoutRef<typeof ark.div> & Omit<HoverCardPresenceProps, 'children'>;

package/hover-card/hover-card-content.mjs

@@ -3,9 +3,10 @@ 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 { useHoverCardContext } from './hover-card-context.mjs';
 import { HoverCardPresence } from './hover-card-presence.mjs';
+import { splitPresenceProps } from '../presence/split-presence-props.mjs';
 
 const HoverCardContent = forwardRef((props, ref) => {
   const [presenceProps, hoverCardContentProps] = splitPresenceProps(props);

package/hover-card/hover-card-context.d.ts

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

package/hover-card/hover-card-positioner.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 HoverCardPositionerProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const HoverCardPositioner: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/hover-card/hover-card-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 hoverCardContext = require('./hover-card-context.cjs');
 
 const HoverCardPresence = (props) => {
   const { present, ...rest } = props;
   const { isOpen } = hoverCardContext.useHoverCardContext();
-  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.HoverCardPresence = HoverCardPresence;

package/hover-card/hover-card-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 HoverCardPresenceProps = PresenceProps;
 export declare const HoverCardPresence: (props: HoverCardPresenceProps) => JSX.Element;

package/hover-card/hover-card-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 { useHoverCardContext } from './hover-card-context.mjs';
 
 const HoverCardPresence = (props) => {

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

package/hover-card/hover-card.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'react/jsx-runtime';
+import { JSX } from 'react/jsx-runtime';
 import { type ReactNode } from 'react';
 import type { Assign } from '../types';
 import { type HoverCardContext } from './hover-card-context';

package/hover-card/hover-card.stories.d.ts

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

package/hover-card/hover-card.test.d.ts

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

package/hover-card/index.cjs

@@ -2,18 +2,24 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const hoverCard = require('./hover-card.cjs');
+const hoverCard$1 = require('./hover-card.cjs');
 const hoverCardArrow = require('./hover-card-arrow.cjs');
 const hoverCardArrowTip = require('./hover-card-arrow-tip.cjs');
 const hoverCardContent = require('./hover-card-content.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 const hoverCardPositioner = require('./hover-card-positioner.cjs');
 const hoverCardTrigger = require('./hover-card-trigger.cjs');
-const hoverCard$1 = require('@zag-js/hover-card');
-
+const hoverCard = require('@zag-js/hover-card');
 
+const HoverCard = Object.assign(hoverCard$1.HoverCard, {
+  Root: hoverCard$1.HoverCard,
+  Arrow: hoverCardArrow.HoverCardArrow,
+  ArrowTip: hoverCardArrowTip.HoverCardArrowTip,
+  Content: hoverCardContent.HoverCardContent,
+  Positioner: hoverCardPositioner.HoverCardPositioner,
+  Trigger: hoverCardTrigger.HoverCardTrigger
+});
 
-exports.HoverCard = hoverCard.HoverCard;
 exports.HoverCardArrow = hoverCardArrow.HoverCardArrow;
 exports.HoverCardArrowTip = hoverCardArrowTip.HoverCardArrowTip;
 exports.HoverCardContent = hoverCardContent.HoverCardContent;
@@ -21,6 +27,7 @@ exports.useHoverCardContext = hoverCardContext.useHoverCardContext;
 exports.HoverCardPositioner = hoverCardPositioner.HoverCardPositioner;
 exports.HoverCardTrigger = hoverCardTrigger.HoverCardTrigger;
 Object.defineProperty(exports, 'hoverCardAnatomy', {
-	enumerable: true,
-	get: () => hoverCard$1.anatomy
+  enumerable: true,
+  get: () => hoverCard.anatomy
 });
+exports.HoverCard = HoverCard;