@ark-ui/react 1.3.0 → 2.0.1

package/editable/editable.cjs

@@ -1,55 +1,25 @@
-'use client';
 'use strict';
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const jsxRuntime = require('react/jsx-runtime');
-const react$1 = require('@zag-js/react');
-const react = require('react');
-const createSplitProps = require('../create-split-props.cjs');
-const factory = require('../factory.cjs');
-const runIfFn = require('../run-if-fn.cjs');
-const editableContext = require('./editable-context.cjs');
-const useEditable = require('./use-editable.cjs');
+const editableArea = require('./editable-area.cjs');
+const editableCancelTrigger = require('./editable-cancel-trigger.cjs');
+const editableControl = require('./editable-control.cjs');
+const editableEditTrigger = require('./editable-edit-trigger.cjs');
+const editableInput = require('./editable-input.cjs');
+const editableLabel = require('./editable-label.cjs');
+const editablePreview = require('./editable-preview.cjs');
+const editableRoot = require('./editable-root.cjs');
+const editableSubmitTrigger = require('./editable-submit-trigger.cjs');
 
-const Editable = react.forwardRef((props, ref) => {
-  const [useEditableProps, { children, ...localProps }] = createSplitProps.createSplitProps()(
-    props,
-    [
-      "activationMode",
-      "autoResize",
-      "defaultValue",
-      "dir",
-      "disabled",
-      "finalFocusEl",
-      "form",
-      "getRootNode",
-      "id",
-      "ids",
-      "invalid",
-      "maxLength",
-      "name",
-      "onEdit",
-      "onFocusOutside",
-      "onInteractOutside",
-      "onPointerDownOutside",
-      "onValueChange",
-      "onValueCommit",
-      "onValueRevert",
-      "placeholder",
-      "readOnly",
-      "selectOnFocus",
-      "startWithEditView",
-      "submitMode",
-      "translations",
-      "value"
-    ]
-  );
-  const api = useEditable.useEditable(useEditableProps);
-  const mergedProps = react$1.mergeProps(api.rootProps, localProps);
-  const view = runIfFn.runIfFn(children, api);
-  return /* @__PURE__ */ jsxRuntime.jsx(editableContext.EditableProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: view }) });
-});
-Editable.displayName = "Editable";
 
-exports.Editable = Editable;
+
+exports.Area = editableArea.EditableArea;
+exports.CancelTrigger = editableCancelTrigger.EditableCancelTrigger;
+exports.Control = editableControl.EditableControl;
+exports.EditTrigger = editableEditTrigger.EditableEditTrigger;
+exports.Input = editableInput.EditableInput;
+exports.Label = editableLabel.EditableLabel;
+exports.Preview = editablePreview.EditablePreview;
+exports.Root = editableRoot.EditableRoot;
+exports.SubmitTrigger = editableSubmitTrigger.EditableSubmitTrigger;

package/editable/editable.d.ts

@@ -1,9 +1,10 @@
-import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
-import { type HTMLArkProps } from '../factory';
-import { type Assign } from '../types';
-import { type UseEditableProps, type UseEditableReturn } from './use-editable';
-export interface EditableProps extends Assign<Assign<HTMLArkProps<'div'>, {
-    children?: ReactNode | ((api: UseEditableReturn) => ReactNode);
-}>, UseEditableProps> {
-}
-export declare const Editable: ForwardRefExoticComponent<EditableProps & RefAttributes<HTMLDivElement>>;
+import { EditableArea as Area } from './editable-area';
+import { EditableCancelTrigger as CancelTrigger } from './editable-cancel-trigger';
+import { EditableControl as Control } from './editable-control';
+import { EditableEditTrigger as EditTrigger } from './editable-edit-trigger';
+import { EditableInput as Input } from './editable-input';
+import { EditableLabel as Label } from './editable-label';
+import { EditablePreview as Preview } from './editable-preview';
+import { EditableRoot as Root } from './editable-root';
+import { EditableSubmitTrigger as SubmitTrigger } from './editable-submit-trigger';
+export { Area, CancelTrigger, Control, EditTrigger, Input, Label, Preview, Root, SubmitTrigger };

package/editable/editable.mjs

@@ -1,51 +1,9 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { mergeProps } from '@zag-js/react';
-import { forwardRef } from 'react';
-import { createSplitProps } from '../create-split-props.mjs';
-import { ark } from '../factory.mjs';
-import { runIfFn } from '../run-if-fn.mjs';
-import { EditableProvider } from './editable-context.mjs';
-import { useEditable } from './use-editable.mjs';
-
-const Editable = forwardRef((props, ref) => {
-  const [useEditableProps, { children, ...localProps }] = createSplitProps()(
-    props,
-    [
-      "activationMode",
-      "autoResize",
-      "defaultValue",
-      "dir",
-      "disabled",
-      "finalFocusEl",
-      "form",
-      "getRootNode",
-      "id",
-      "ids",
-      "invalid",
-      "maxLength",
-      "name",
-      "onEdit",
-      "onFocusOutside",
-      "onInteractOutside",
-      "onPointerDownOutside",
-      "onValueChange",
-      "onValueCommit",
-      "onValueRevert",
-      "placeholder",
-      "readOnly",
-      "selectOnFocus",
-      "startWithEditView",
-      "submitMode",
-      "translations",
-      "value"
-    ]
-  );
-  const api = useEditable(useEditableProps);
-  const mergedProps = mergeProps(api.rootProps, localProps);
-  const view = runIfFn(children, api);
-  return /* @__PURE__ */ jsx(EditableProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: view }) });
-});
-Editable.displayName = "Editable";
-
-export { Editable };
+export { EditableArea as Area } from './editable-area.mjs';
+export { EditableCancelTrigger as CancelTrigger } from './editable-cancel-trigger.mjs';
+export { EditableControl as Control } from './editable-control.mjs';
+export { EditableEditTrigger as EditTrigger } from './editable-edit-trigger.mjs';
+export { EditableInput as Input } from './editable-input.mjs';
+export { EditableLabel as Label } from './editable-label.mjs';
+export { EditablePreview as Preview } from './editable-preview.mjs';
+export { EditableRoot as Root } from './editable-root.mjs';
+export { EditableSubmitTrigger as SubmitTrigger } from './editable-submit-trigger.mjs';

package/editable/index.cjs

@@ -1,9 +1,7 @@
-'use client';
 'use strict';
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const editable = require('./editable.cjs');
 const editableArea = require('./editable-area.cjs');
 const editableCancelTrigger = require('./editable-cancel-trigger.cjs');
 const editableContext = require('./editable-context.cjs');
@@ -12,19 +10,11 @@ const editableEditTrigger = require('./editable-edit-trigger.cjs');
 const editableInput = require('./editable-input.cjs');
 const editableLabel = require('./editable-label.cjs');
 const editablePreview = require('./editable-preview.cjs');
+const editableRoot = require('./editable-root.cjs');
 const editableSubmitTrigger = require('./editable-submit-trigger.cjs');
+const editable = require('./editable.cjs');
+
 
-const Editable = Object.assign(editable.Editable, {
-  Root: editable.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.EditableArea = editableArea.EditableArea;
 exports.EditableCancelTrigger = editableCancelTrigger.EditableCancelTrigger;
@@ -34,5 +24,6 @@ exports.EditableEditTrigger = editableEditTrigger.EditableEditTrigger;
 exports.EditableInput = editableInput.EditableInput;
 exports.EditableLabel = editableLabel.EditableLabel;
 exports.EditablePreview = editablePreview.EditablePreview;
+exports.EditableRoot = editableRoot.EditableRoot;
 exports.EditableSubmitTrigger = editableSubmitTrigger.EditableSubmitTrigger;
-exports.Editable = Editable;
+exports.Editable = editable;

package/editable/index.d.ts

@@ -1,7 +1,4 @@
-import { ForwardRefExoticComponent, RefAttributes } from 'react';
-/// <reference types="react" />
 import type { ValueChangeDetails as EditableValueChangeDetails } from '@zag-js/editable';
-import { type EditableProps } from './editable';
 import { EditableArea, type EditableAreaProps } from './editable-area';
 import { EditableCancelTrigger, type EditableCancelTriggerProps } from './editable-cancel-trigger';
 import { useEditableContext, type EditableContext } from './editable-context';
@@ -10,17 +7,8 @@ import { EditableEditTrigger, type EditableEditTriggerProps } from './editable-e
 import { EditableInput, type EditableInputProps } from './editable-input';
 import { EditableLabel, type EditableLabelProps } from './editable-label';
 import { EditablePreview, type EditablePreviewProps } from './editable-preview';
+import { EditableRoot, type EditableRootProps } from './editable-root';
 import { EditableSubmitTrigger, type EditableSubmitTriggerProps } from './editable-submit-trigger';
-declare const Editable: ForwardRefExoticComponent<EditableProps & RefAttributes<HTMLDivElement>> & {
-    Root: ForwardRefExoticComponent<EditableProps & RefAttributes<HTMLDivElement>>;
-    Area: ForwardRefExoticComponent<EditableAreaProps & RefAttributes<HTMLDivElement>>;
-    CancelTrigger: ForwardRefExoticComponent<EditableCancelTriggerProps & RefAttributes<HTMLButtonElement>>;
-    Control: ForwardRefExoticComponent<EditableControlProps & RefAttributes<HTMLDivElement>>;
-    EditTrigger: ForwardRefExoticComponent<EditableEditTriggerProps & RefAttributes<HTMLButtonElement>>;
-    Input: ForwardRefExoticComponent<EditableInputProps & RefAttributes<HTMLInputElement>>;
-    Label: ForwardRefExoticComponent<EditableLabelProps & RefAttributes<HTMLLabelElement>>;
-    Preview: ForwardRefExoticComponent<EditablePreviewProps & RefAttributes<HTMLSpanElement>>;
-    SubmitTrigger: ForwardRefExoticComponent<EditableSubmitTriggerProps & RefAttributes<HTMLButtonElement>>;
-};
-export { Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableSubmitTrigger, useEditableContext, };
-export type { EditableAreaProps, EditableCancelTriggerProps, EditableContext, EditableControlProps, EditableEditTriggerProps, EditableInputProps, EditableLabelProps, EditablePreviewProps, EditableProps, EditableSubmitTriggerProps, EditableValueChangeDetails, };
+export * as Editable from './editable';
+export { EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableRoot, EditableSubmitTrigger, useEditableContext, };
+export type { EditableAreaProps, EditableCancelTriggerProps, EditableContext, EditableControlProps, EditableEditTriggerProps, EditableInputProps, EditableLabelProps, EditablePreviewProps, EditableRootProps, EditableSubmitTriggerProps, EditableValueChangeDetails, };

package/editable/index.mjs

@@ -1,25 +1,12 @@
-'use client';
-import { Editable as Editable$1 } from './editable.mjs';
-import { EditableArea } from './editable-area.mjs';
-import { EditableCancelTrigger } from './editable-cancel-trigger.mjs';
+export { EditableArea } from './editable-area.mjs';
+export { EditableCancelTrigger } from './editable-cancel-trigger.mjs';
 export { useEditableContext } from './editable-context.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';
-
-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 };
+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 { EditableRoot } from './editable-root.mjs';
+export { EditableSubmitTrigger } from './editable-submit-trigger.mjs';
+import * as editable from './editable.mjs';
+export { editable as Editable };

package/editable/use-editable.cjs

@@ -6,9 +6,8 @@ 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 useEvent = require('../use-event.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
+const useEvent = require('../use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });

package/editable/use-editable.mjs

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

package/environment/index.cjs

@@ -1,4 +1,3 @@
-'use client';
 'use strict';
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
@@ -6,9 +5,7 @@ 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,8 +1,4 @@
-import { JSX } from 'react/jsx-runtime';
-import { type EnvironmentProps } from './environment';
+import { Environment, type EnvironmentProps } from './environment';
 import { useEnvironmentContext, type EnvironmentContext } from './environment-context';
-declare const Environment: ((props: EnvironmentProps) => JSX.Element) & {
-    Root: (props: EnvironmentProps) => JSX.Element;
-};
 export { Environment, useEnvironmentContext };
 export type { EnvironmentContext, EnvironmentProps };

package/environment/index.mjs

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

package/file-upload/file-upload-root.cjs

@@ -0,0 +1,46 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const runIfFn = require('../run-if-fn.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+const useFileUpload = require('./use-file-upload.cjs');
+
+const FileUploadRoot = react.forwardRef((props, ref) => {
+  const [useFileUploadProps, { children, ...divProps }] = createSplitProps.createSplitProps()(
+    props,
+    [
+      "accept",
+      "allowDrop",
+      "dir",
+      "disabled",
+      "files",
+      "getRootNode",
+      "id",
+      "ids",
+      "locale",
+      "maxFiles",
+      "maxFileSize",
+      "minFileSize",
+      "name",
+      "onFileAccept",
+      "onFileReject",
+      "onFilesChange",
+      "translations",
+      "validate"
+    ]
+  );
+  const api = useFileUpload.useFileUpload(useFileUploadProps);
+  const mergedProps = react$1.mergeProps(api.rootProps, divProps);
+  const view = runIfFn.runIfFn(children, api);
+  return /* @__PURE__ */ jsxRuntime.jsx(fileUploadContext.FileUploadProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: view }) });
+});
+FileUploadRoot.displayName = "FileUploadRoot";
+
+exports.FileUploadRoot = FileUploadRoot;

package/file-upload/file-upload-root.d.ts

@@ -0,0 +1,9 @@
+import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type UseFileUploadProps, type UseFileUploadReturn } from './use-file-upload';
+export interface FileUploadRootProps extends Assign<HTMLArkProps<'div'>, UseFileUploadProps & {
+    children?: ((api: UseFileUploadReturn) => ReactNode) | ReactNode;
+}> {
+}
+export declare const FileUploadRoot: ForwardRefExoticComponent<FileUploadRootProps & RefAttributes<HTMLDivElement>>;

package/file-upload/file-upload-root.mjs

@@ -0,0 +1,42 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { runIfFn } from '../run-if-fn.mjs';
+import { FileUploadProvider } from './file-upload-context.mjs';
+import { useFileUpload } from './use-file-upload.mjs';
+
+const FileUploadRoot = forwardRef((props, ref) => {
+  const [useFileUploadProps, { children, ...divProps }] = createSplitProps()(
+    props,
+    [
+      "accept",
+      "allowDrop",
+      "dir",
+      "disabled",
+      "files",
+      "getRootNode",
+      "id",
+      "ids",
+      "locale",
+      "maxFiles",
+      "maxFileSize",
+      "minFileSize",
+      "name",
+      "onFileAccept",
+      "onFileReject",
+      "onFilesChange",
+      "translations",
+      "validate"
+    ]
+  );
+  const api = useFileUpload(useFileUploadProps);
+  const mergedProps = mergeProps(api.rootProps, divProps);
+  const view = runIfFn(children, api);
+  return /* @__PURE__ */ jsx(FileUploadProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: view }) });
+});
+FileUploadRoot.displayName = "FileUploadRoot";
+
+export { FileUploadRoot };

package/file-upload/file-upload.cjs

@@ -1,46 +1,29 @@
-'use client';
 'use strict';
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const jsxRuntime = require('react/jsx-runtime');
-const react$1 = require('@zag-js/react');
-const react = require('react');
-const createSplitProps = require('../create-split-props.cjs');
-const factory = require('../factory.cjs');
-const runIfFn = require('../run-if-fn.cjs');
-const fileUploadContext = require('./file-upload-context.cjs');
-const useFileUpload = require('./use-file-upload.cjs');
+const fileUploadDropzone = require('./file-upload-dropzone.cjs');
+const fileUploadItem = require('./file-upload-item.cjs');
+const fileUploadItemDeleteTrigger = require('./file-upload-item-delete-trigger.cjs');
+const fileUploadItemGroup = require('./file-upload-item-group.cjs');
+const fileUploadItemName = require('./file-upload-item-name.cjs');
+const fileUploadItemPreview = require('./file-upload-item-preview.cjs');
+const fileUploadItemPreviewImage = require('./file-upload-item-preview-image.cjs');
+const fileUploadItemSizeText = require('./file-upload-item-size-text.cjs');
+const fileUploadLabel = require('./file-upload-label.cjs');
+const fileUploadRoot = require('./file-upload-root.cjs');
+const fileUploadTrigger = require('./file-upload-trigger.cjs');
 
-const FileUpload = react.forwardRef((props, ref) => {
-  const [useFileUploadProps, { children, ...divProps }] = createSplitProps.createSplitProps()(
-    props,
-    [
-      "accept",
-      "allowDrop",
-      "dir",
-      "disabled",
-      "files",
-      "getRootNode",
-      "id",
-      "ids",
-      "locale",
-      "maxFiles",
-      "maxFileSize",
-      "minFileSize",
-      "name",
-      "onFileAccept",
-      "onFileReject",
-      "onFilesChange",
-      "translations",
-      "validate"
-    ]
-  );
-  const api = useFileUpload.useFileUpload(useFileUploadProps);
-  const mergedProps = react$1.mergeProps(api.rootProps, divProps);
-  const view = runIfFn.runIfFn(children, api);
-  return /* @__PURE__ */ jsxRuntime.jsx(fileUploadContext.FileUploadProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: view }) });
-});
-FileUpload.displayName = "FileUpload";
 
-exports.FileUpload = FileUpload;
+
+exports.Dropzone = fileUploadDropzone.FileUploadDropzone;
+exports.Item = fileUploadItem.FileUploadItem;
+exports.ItemDeleteTrigger = fileUploadItemDeleteTrigger.FileUploadItemDeleteTrigger;
+exports.ItemGroup = fileUploadItemGroup.FileUploadItemGroup;
+exports.ItemName = fileUploadItemName.FileUploadItemName;
+exports.ItemPreview = fileUploadItemPreview.FileUploadItemPreview;
+exports.ItemPreviewImage = fileUploadItemPreviewImage.FileUploadItemPreviewImage;
+exports.ItemSizeText = fileUploadItemSizeText.FileUploadItemSizeText;
+exports.Label = fileUploadLabel.FileUploadLabel;
+exports.Root = fileUploadRoot.FileUploadRoot;
+exports.Trigger = fileUploadTrigger.FileUploadTrigger;

package/file-upload/file-upload.d.ts

@@ -1,9 +1,12 @@
-import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
-import { type HTMLArkProps } from '../factory';
-import type { Assign } from '../types';
-import { type UseFileUploadProps, type UseFileUploadReturn } from './use-file-upload';
-export interface FileUploadProps extends Assign<HTMLArkProps<'div'>, UseFileUploadProps & {
-    children?: ((api: UseFileUploadReturn) => ReactNode) | ReactNode;
-}> {
-}
-export declare const FileUpload: ForwardRefExoticComponent<FileUploadProps & RefAttributes<HTMLDivElement>>;
+import { FileUploadDropzone as Dropzone } from './file-upload-dropzone';
+import { FileUploadItem as Item } from './file-upload-item';
+import { FileUploadItemDeleteTrigger as ItemDeleteTrigger } from './file-upload-item-delete-trigger';
+import { FileUploadItemGroup as ItemGroup } from './file-upload-item-group';
+import { FileUploadItemName as ItemName } from './file-upload-item-name';
+import { FileUploadItemPreview as ItemPreview } from './file-upload-item-preview';
+import { FileUploadItemPreviewImage as ItemPreviewImage } from './file-upload-item-preview-image';
+import { FileUploadItemSizeText as ItemSizeText } from './file-upload-item-size-text';
+import { FileUploadLabel as Label } from './file-upload-label';
+import { FileUploadRoot as Root } from './file-upload-root';
+import { FileUploadTrigger as Trigger } from './file-upload-trigger';
+export { Dropzone, Item, ItemDeleteTrigger, ItemGroup, ItemName, ItemPreview, ItemPreviewImage, ItemSizeText, Label, Root, Trigger, };

package/file-upload/file-upload.mjs

@@ -1,42 +1,11 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { mergeProps } from '@zag-js/react';
-import { forwardRef } from 'react';
-import { createSplitProps } from '../create-split-props.mjs';
-import { ark } from '../factory.mjs';
-import { runIfFn } from '../run-if-fn.mjs';
-import { FileUploadProvider } from './file-upload-context.mjs';
-import { useFileUpload } from './use-file-upload.mjs';
-
-const FileUpload = forwardRef((props, ref) => {
-  const [useFileUploadProps, { children, ...divProps }] = createSplitProps()(
-    props,
-    [
-      "accept",
-      "allowDrop",
-      "dir",
-      "disabled",
-      "files",
-      "getRootNode",
-      "id",
-      "ids",
-      "locale",
-      "maxFiles",
-      "maxFileSize",
-      "minFileSize",
-      "name",
-      "onFileAccept",
-      "onFileReject",
-      "onFilesChange",
-      "translations",
-      "validate"
-    ]
-  );
-  const api = useFileUpload(useFileUploadProps);
-  const mergedProps = mergeProps(api.rootProps, divProps);
-  const view = runIfFn(children, api);
-  return /* @__PURE__ */ jsx(FileUploadProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: view }) });
-});
-FileUpload.displayName = "FileUpload";
-
-export { FileUpload };
+export { FileUploadDropzone as Dropzone } from './file-upload-dropzone.mjs';
+export { FileUploadItem as Item } from './file-upload-item.mjs';
+export { FileUploadItemDeleteTrigger as ItemDeleteTrigger } from './file-upload-item-delete-trigger.mjs';
+export { FileUploadItemGroup as ItemGroup } from './file-upload-item-group.mjs';
+export { FileUploadItemName as ItemName } from './file-upload-item-name.mjs';
+export { FileUploadItemPreview as ItemPreview } from './file-upload-item-preview.mjs';
+export { FileUploadItemPreviewImage as ItemPreviewImage } from './file-upload-item-preview-image.mjs';
+export { FileUploadItemSizeText as ItemSizeText } from './file-upload-item-size-text.mjs';
+export { FileUploadLabel as Label } from './file-upload-label.mjs';
+export { FileUploadRoot as Root } from './file-upload-root.mjs';
+export { FileUploadTrigger as Trigger } from './file-upload-trigger.mjs';

package/file-upload/index.cjs

@@ -1,9 +1,7 @@
-'use client';
 'use strict';
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const fileUpload = require('./file-upload.cjs');
 const fileUploadContext = require('./file-upload-context.cjs');
 const fileUploadDropzone = require('./file-upload-dropzone.cjs');
 const fileUploadItem = require('./file-upload-item.cjs');
@@ -14,21 +12,11 @@ const fileUploadItemPreview = require('./file-upload-item-preview.cjs');
 const fileUploadItemPreviewImage = require('./file-upload-item-preview-image.cjs');
 const fileUploadItemSizeText = require('./file-upload-item-size-text.cjs');
 const fileUploadLabel = require('./file-upload-label.cjs');
+const fileUploadRoot = require('./file-upload-root.cjs');
 const fileUploadTrigger = require('./file-upload-trigger.cjs');
+const fileUpload = require('./file-upload.cjs');
+
 
-const FileUpload = Object.assign(fileUpload.FileUpload, {
-  Root: fileUpload.FileUpload,
-  Dropzone: fileUploadDropzone.FileUploadDropzone,
-  Item: fileUploadItem.FileUploadItem,
-  ItemDeleteTrigger: fileUploadItemDeleteTrigger.FileUploadItemDeleteTrigger,
-  ItemGroup: fileUploadItemGroup.FileUploadItemGroup,
-  ItemName: fileUploadItemName.FileUploadItemName,
-  ItemPreview: fileUploadItemPreview.FileUploadItemPreview,
-  ItemPreviewImage: fileUploadItemPreviewImage.FileUploadItemPreviewImage,
-  ItemSizeText: fileUploadItemSizeText.FileUploadItemSizeText,
-  Label: fileUploadLabel.FileUploadLabel,
-  Trigger: fileUploadTrigger.FileUploadTrigger
-});
 
 exports.useFileUploadContext = fileUploadContext.useFileUploadContext;
 exports.FileUploadDropzone = fileUploadDropzone.FileUploadDropzone;
@@ -36,8 +24,10 @@ exports.FileUploadItem = fileUploadItem.FileUploadItem;
 exports.FileUploadItemDeleteTrigger = fileUploadItemDeleteTrigger.FileUploadItemDeleteTrigger;
 exports.FileUploadItemGroup = fileUploadItemGroup.FileUploadItemGroup;
 exports.FileUploadItemName = fileUploadItemName.FileUploadItemName;
+exports.FileUploadItemPreview = fileUploadItemPreview.FileUploadItemPreview;
 exports.FileUploadItemPreviewImage = fileUploadItemPreviewImage.FileUploadItemPreviewImage;
 exports.FileUploadItemSizeText = fileUploadItemSizeText.FileUploadItemSizeText;
 exports.FileUploadLabel = fileUploadLabel.FileUploadLabel;
+exports.FileUploadRoot = fileUploadRoot.FileUploadRoot;
 exports.FileUploadTrigger = fileUploadTrigger.FileUploadTrigger;
-exports.FileUpload = FileUpload;
+exports.FileUpload = fileUpload;