@ark-ui/react 1.0.1 → 1.1.0

package/color-picker/index.mjs

@@ -13,10 +13,13 @@ import { ColorPickerContent } from './color-picker-content.mjs';
 export { useColorPickerContext } from './color-picker-context.mjs';
 import { ColorPickerControl } from './color-picker-control.mjs';
 import { ColorPickerEyeDropperTrigger } from './color-picker-eye-dropper-trigger.mjs';
+import { ColorPickerFormatSelect } from './color-picker-format-select.mjs';
+import { ColorPickerFormatTrigger } from './color-picker-format-trigger.mjs';
 import { ColorPickerLabel } from './color-picker-label.mjs';
 import { ColorPickerPositioner } from './color-picker-positioner.mjs';
 import { ColorPickerSwatch } from './color-picker-swatch.mjs';
 import { ColorPickerSwatchGroup } from './color-picker-swatch-group.mjs';
+import { ColorPickerSwatchIndicator } from './color-picker-swatch-indicator.mjs';
 import { ColorPickerSwatchTrigger } from './color-picker-swatch-trigger.mjs';
 import { ColorPickerTransparencyGrid } from './color-picker-transparency-grid.mjs';
 import { ColorPickerTrigger } from './color-picker-trigger.mjs';
@@ -35,10 +38,13 @@ const ColorPicker = Object.assign(ColorPicker$1, {
   Content: ColorPickerContent,
   Control: ColorPickerControl,
   EyeDropperTrigger: ColorPickerEyeDropperTrigger,
+  FormatTrigger: ColorPickerFormatTrigger,
+  FormatSelect: ColorPickerFormatSelect,
   Label: ColorPickerLabel,
   Positioner: ColorPickerPositioner,
   Swatch: ColorPickerSwatch,
   SwatchGroup: ColorPickerSwatchGroup,
+  SwatchIndicator: ColorPickerSwatchIndicator,
   SwatchTrigger: ColorPickerSwatchTrigger,
   TransparencyGrid: ColorPickerTransparencyGrid,
   Trigger: ColorPickerTrigger,
@@ -46,4 +52,4 @@ const ColorPicker = Object.assign(ColorPicker$1, {
   View: ColorPickerView
 });
 
-export { ColorPicker, ColorPickerArea, ColorPickerAreaBackground, ColorPickerAreaThumb, ColorPickerChannelInput, ColorPickerChannelSlider, ColorPickerChannelSliderThumb, ColorPickerChannelSliderTrack, ColorPickerContent, ColorPickerControl, ColorPickerEyeDropperTrigger, ColorPickerLabel, ColorPickerPositioner, ColorPickerSwatch, ColorPickerSwatchGroup, ColorPickerSwatchTrigger, ColorPickerTransparencyGrid, ColorPickerTrigger, ColorPickerValueText };
+export { ColorPicker, ColorPickerArea, ColorPickerAreaBackground, ColorPickerAreaThumb, ColorPickerChannelInput, ColorPickerChannelSlider, ColorPickerChannelSliderThumb, ColorPickerChannelSliderTrack, ColorPickerContent, ColorPickerControl, ColorPickerEyeDropperTrigger, ColorPickerFormatSelect, ColorPickerFormatTrigger, ColorPickerLabel, ColorPickerPositioner, ColorPickerSwatch, ColorPickerSwatchGroup, ColorPickerSwatchIndicator, ColorPickerSwatchTrigger, ColorPickerTransparencyGrid, ColorPickerTrigger, ColorPickerValueText, ColorPickerView };

package/color-picker/use-color-picker.cjs

@@ -29,7 +29,7 @@ function _interopNamespaceDefault(e) {
 
 const colorPicker__namespace = /*#__PURE__*/_interopNamespaceDefault(colorPicker);
 
-const useColorPicker = (props = {}) => {
+const useColorPicker = (props) => {
   const initialContext = {
     id: react.useId(),
     getRootNode: environmentContext.useEnvironmentContext(),

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

@@ -6,8 +6,11 @@ export interface UseColorPickerProps extends Optional<Omit<colorPicker.Context,
      * The initial value of the color picker.
      */
     defaultValue?: string;
+    /**
+     * The current value of the color picker.
+     */
     value?: string;
 }
 export interface UseColorPickerReturn extends colorPicker.Api<PropTypes> {
 }
-export declare const useColorPicker: (props?: UseColorPickerProps) => UseColorPickerReturn;
+export declare const useColorPicker: (props: UseColorPickerProps) => UseColorPickerReturn;

package/color-picker/use-color-picker.mjs

@@ -6,7 +6,7 @@ import '../environment/index.mjs';
 import { useEvent } from '../use-event.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
-const useColorPicker = (props = {}) => {
+const useColorPicker = (props) => {
   const initialContext = {
     id: useId(),
     getRootNode: useEnvironmentContext(),

package/file-upload/file-upload-context.cjs

@@ -0,0 +1,15 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const createContext = require('../create-context.cjs');
+
+const [FileUploadProvider, useFileUploadContext] = createContext.createContext({
+  name: "FileUploadContext",
+  hookName: "useFileUploadContext",
+  providerName: "<FileUploadProvider />"
+});
+
+exports.FileUploadProvider = FileUploadProvider;
+exports.useFileUploadContext = useFileUploadContext;

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

@@ -0,0 +1,6 @@
+import { Provider } from 'react';
+/// <reference types="react" />
+import { type UseFileUploadReturn } from './use-file-upload';
+export interface FileUploadContext extends UseFileUploadReturn {
+}
+export declare const FileUploadProvider: Provider<FileUploadContext>, useFileUploadContext: () => FileUploadContext;

package/file-upload/file-upload-context.mjs

@@ -0,0 +1,10 @@
+'use client';
+import { createContext } from '../create-context.mjs';
+
+const [FileUploadProvider, useFileUploadContext] = createContext({
+  name: "FileUploadContext",
+  hookName: "useFileUploadContext",
+  providerName: "<FileUploadProvider />"
+});
+
+export { FileUploadProvider, useFileUploadContext };

package/file-upload/file-upload-dropzone.cjs

@@ -0,0 +1,24 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+
+const FileUploadDropzone = react.forwardRef(
+  (props, ref) => {
+    const api = fileUploadContext.useFileUploadContext();
+    const mergedProps = react$1.mergeProps(api.dropzoneProps, props);
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }),
+      /* @__PURE__ */ jsxRuntime.jsx("input", { ...api.hiddenInputProps })
+    ] });
+  }
+);
+FileUploadDropzone.displayName = "FileUploadDropzone";
+
+exports.FileUploadDropzone = FileUploadDropzone;

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

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadDropzoneProps extends HTMLArkProps<'div'> {
+}
+export declare const FileUploadDropzone: ForwardRefExoticComponent<FileUploadDropzoneProps & RefAttributes<HTMLDivElement>>;

package/file-upload/file-upload-dropzone.mjs

@@ -0,0 +1,20 @@
+'use client';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+
+const FileUploadDropzone = forwardRef(
+  (props, ref) => {
+    const api = useFileUploadContext();
+    const mergedProps = mergeProps(api.dropzoneProps, props);
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }),
+      /* @__PURE__ */ jsx("input", { ...api.hiddenInputProps })
+    ] });
+  }
+);
+FileUploadDropzone.displayName = "FileUploadDropzone";
+
+export { FileUploadDropzone };

package/file-upload/file-upload-item-context.cjs

@@ -0,0 +1,15 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const createContext = require('../create-context.cjs');
+
+const [FileUploadItemProvider, useFileUploadItemContext] = createContext.createContext({
+  name: "FileUploadItemContext",
+  hookName: "useFileUploadItemContext",
+  providerName: "<FileUploadItemProvider />"
+});
+
+exports.FileUploadItemProvider = FileUploadItemProvider;
+exports.useFileUploadItemContext = useFileUploadItemContext;

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

@@ -0,0 +1,6 @@
+import { Provider } from 'react';
+/// <reference types="react" />
+import type { ItemProps } from '@zag-js/file-upload';
+export interface FileUploadItemContext extends ItemProps {
+}
+export declare const FileUploadItemProvider: Provider<FileUploadItemContext>, useFileUploadItemContext: () => FileUploadItemContext;

package/file-upload/file-upload-item-context.mjs

@@ -0,0 +1,10 @@
+'use client';
+import { createContext } from '../create-context.mjs';
+
+const [FileUploadItemProvider, useFileUploadItemContext] = createContext({
+  name: "FileUploadItemContext",
+  hookName: "useFileUploadItemContext",
+  providerName: "<FileUploadItemProvider />"
+});
+
+export { FileUploadItemProvider, useFileUploadItemContext };

package/file-upload/file-upload-item-delete-trigger.cjs

@@ -0,0 +1,21 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+const fileUploadItemContext = require('./file-upload-item-context.cjs');
+
+const FileUploadItemDeleteTrigger = react.forwardRef((props, ref) => {
+  const api = fileUploadContext.useFileUploadContext();
+  const item = fileUploadItemContext.useFileUploadItemContext();
+  const mergedProps = react$1.mergeProps(api.getItemDeleteTriggerProps(item), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+});
+FileUploadItemDeleteTrigger.displayName = "FileUploadItemDeleteTrigger";
+
+exports.FileUploadItemDeleteTrigger = FileUploadItemDeleteTrigger;

package/file-upload/file-upload-item-delete-trigger.d.ts

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadItemDeleteTriggerProps extends HTMLArkProps<'button'> {
+}
+export declare const FileUploadItemDeleteTrigger: ForwardRefExoticComponent<FileUploadItemDeleteTriggerProps & RefAttributes<HTMLButtonElement>>;

package/file-upload/file-upload-item-delete-trigger.mjs

@@ -0,0 +1,17 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+import { useFileUploadItemContext } from './file-upload-item-context.mjs';
+
+const FileUploadItemDeleteTrigger = forwardRef((props, ref) => {
+  const api = useFileUploadContext();
+  const item = useFileUploadItemContext();
+  const mergedProps = mergeProps(api.getItemDeleteTriggerProps(item), props);
+  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+});
+FileUploadItemDeleteTrigger.displayName = "FileUploadItemDeleteTrigger";
+
+export { FileUploadItemDeleteTrigger };

package/file-upload/file-upload-item-group.cjs

@@ -0,0 +1,24 @@
+'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 factory = require('../factory.cjs');
+const runIfFn = require('../run-if-fn.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+
+const FileUploadItemGroup = react.forwardRef(
+  (props, ref) => {
+    const { children, ...rest } = props;
+    const api = fileUploadContext.useFileUploadContext();
+    const mergedProps = react$1.mergeProps(api.itemGroupProps, rest);
+    const view = runIfFn.runIfFn(children, api.files);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.ul, { ...mergedProps, ref, children: view });
+  }
+);
+FileUploadItemGroup.displayName = "FileUploadItemGroup";
+
+exports.FileUploadItemGroup = FileUploadItemGroup;

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

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export interface FileUploadItemGroupProps extends Assign<HTMLArkProps<'ul'>, {
+    children?: ReactNode | ((state: File[]) => ReactNode);
+}> {
+}
+export declare const FileUploadItemGroup: ForwardRefExoticComponent<FileUploadItemGroupProps & RefAttributes<HTMLUListElement>>;

package/file-upload/file-upload-item-group.mjs

@@ -0,0 +1,20 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { runIfFn } from '../run-if-fn.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+
+const FileUploadItemGroup = forwardRef(
+  (props, ref) => {
+    const { children, ...rest } = props;
+    const api = useFileUploadContext();
+    const mergedProps = mergeProps(api.itemGroupProps, rest);
+    const view = runIfFn(children, api.files);
+    return /* @__PURE__ */ jsx(ark.ul, { ...mergedProps, ref, children: view });
+  }
+);
+FileUploadItemGroup.displayName = "FileUploadItemGroup";
+
+export { FileUploadItemGroup };

package/file-upload/file-upload-item-name.cjs

@@ -0,0 +1,24 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+const fileUploadItemContext = require('./file-upload-item-context.cjs');
+
+const FileUploadItemName = react.forwardRef(
+  (props, ref) => {
+    const { children, ...rest } = props;
+    const api = fileUploadContext.useFileUploadContext();
+    const item = fileUploadItemContext.useFileUploadItemContext();
+    const mergedProps = react$1.mergeProps(api.getItemNameProps(item), rest);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: children || item.file.name });
+  }
+);
+FileUploadItemName.displayName = "FileUploadItemName";
+
+exports.FileUploadItemName = FileUploadItemName;

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

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadItemNameProps extends HTMLArkProps<'div'> {
+}
+export declare const FileUploadItemName: ForwardRefExoticComponent<FileUploadItemNameProps & RefAttributes<HTMLDivElement>>;

package/file-upload/file-upload-item-name.mjs

@@ -0,0 +1,20 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+import { useFileUploadItemContext } from './file-upload-item-context.mjs';
+
+const FileUploadItemName = forwardRef(
+  (props, ref) => {
+    const { children, ...rest } = props;
+    const api = useFileUploadContext();
+    const item = useFileUploadItemContext();
+    const mergedProps = mergeProps(api.getItemNameProps(item), rest);
+    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: children || item.file.name });
+  }
+);
+FileUploadItemName.displayName = "FileUploadItemName";
+
+export { FileUploadItemName };

package/file-upload/file-upload-item-preview.cjs

@@ -0,0 +1,31 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+const fileUploadItemContext = require('./file-upload-item-context.cjs');
+
+const FileUploadItemPreview = react.forwardRef(
+  (props, ref) => {
+    const [url, setUrl] = react.useState("");
+    const api = fileUploadContext.useFileUploadContext();
+    const item = fileUploadItemContext.useFileUploadItemContext();
+    react.useEffect(() => {
+      api.createFileUrl(item.file, (url2) => setUrl(url2));
+    }, [item, api]);
+    try {
+      const mergedProps = react$1.mergeProps(api.getItemPreviewProps({ ...item, url }), props);
+      return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.img, { ...mergedProps, ref });
+    } catch (e) {
+      return null;
+    }
+  }
+);
+FileUploadItemPreview.displayName = "FileUploadItemPreview";
+
+exports.FileUploadItemPreview = FileUploadItemPreview;

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

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadItemPreviewProps extends HTMLArkProps<'img'> {
+}
+export declare const FileUploadItemPreview: ForwardRefExoticComponent<FileUploadItemPreviewProps & RefAttributes<HTMLImageElement>>;

package/file-upload/file-upload-item-preview.mjs

@@ -0,0 +1,27 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef, useState, useEffect } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+import { useFileUploadItemContext } from './file-upload-item-context.mjs';
+
+const FileUploadItemPreview = forwardRef(
+  (props, ref) => {
+    const [url, setUrl] = useState("");
+    const api = useFileUploadContext();
+    const item = useFileUploadItemContext();
+    useEffect(() => {
+      api.createFileUrl(item.file, (url2) => setUrl(url2));
+    }, [item, api]);
+    try {
+      const mergedProps = mergeProps(api.getItemPreviewProps({ ...item, url }), props);
+      return /* @__PURE__ */ jsx(ark.img, { ...mergedProps, ref });
+    } catch (e) {
+      return null;
+    }
+  }
+);
+FileUploadItemPreview.displayName = "FileUploadItemPreview";
+
+export { FileUploadItemPreview };

package/file-upload/file-upload-item-size-text.cjs

@@ -0,0 +1,24 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+const fileUploadItemContext = require('./file-upload-item-context.cjs');
+
+const FileUploadItemSizeText = react.forwardRef(
+  (props, ref) => {
+    const { children, ...rest } = props;
+    const api = fileUploadContext.useFileUploadContext();
+    const item = fileUploadItemContext.useFileUploadItemContext();
+    const mergedProps = react$1.mergeProps(api.getItemSizeTextProps(item), rest);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: children || api.getFileSize(item.file) });
+  }
+);
+FileUploadItemSizeText.displayName = "FileUploadItemSizeText";
+
+exports.FileUploadItemSizeText = FileUploadItemSizeText;

package/file-upload/file-upload-item-size-text.d.ts

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadItemSizeTextProps extends HTMLArkProps<'div'> {
+}
+export declare const FileUploadItemSizeText: ForwardRefExoticComponent<FileUploadItemSizeTextProps & RefAttributes<HTMLDivElement>>;

package/file-upload/file-upload-item-size-text.mjs

@@ -0,0 +1,20 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+import { useFileUploadItemContext } from './file-upload-item-context.mjs';
+
+const FileUploadItemSizeText = forwardRef(
+  (props, ref) => {
+    const { children, ...rest } = props;
+    const api = useFileUploadContext();
+    const item = useFileUploadItemContext();
+    const mergedProps = mergeProps(api.getItemSizeTextProps(item), rest);
+    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: children || api.getFileSize(item.file) });
+  }
+);
+FileUploadItemSizeText.displayName = "FileUploadItemSizeText";
+
+export { FileUploadItemSizeText };

package/file-upload/file-upload-item.cjs

@@ -0,0 +1,24 @@
+'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 fileUploadItemContext = require('./file-upload-item-context.cjs');
+
+const FileUploadItem = react.forwardRef((props, ref) => {
+  const [itemProps, { children, ...localProps }] = createSplitProps.createSplitProps()(props, ["file"]);
+  const api = fileUploadContext.useFileUploadContext();
+  const mergedProps = react$1.mergeProps(api.getItemProps(itemProps), localProps);
+  const view = runIfFn.runIfFn(children, api);
+  return /* @__PURE__ */ jsxRuntime.jsx(fileUploadItemContext.FileUploadItemProvider, { value: itemProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.li, { ...mergedProps, ref, children: view }) });
+});
+FileUploadItem.displayName = "FileUploadItem";
+
+exports.FileUploadItem = FileUploadItem;

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

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import type { ItemProps } from '@zag-js/file-upload';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export interface FileUploadItemProps extends Assign<HTMLArkProps<'ul'>, ItemProps> {
+}
+export declare const FileUploadItem: ForwardRefExoticComponent<FileUploadItemProps & RefAttributes<HTMLLIElement>>;

package/file-upload/file-upload-item.mjs

@@ -0,0 +1,20 @@
+'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 { useFileUploadContext } from './file-upload-context.mjs';
+import { FileUploadItemProvider } from './file-upload-item-context.mjs';
+
+const FileUploadItem = forwardRef((props, ref) => {
+  const [itemProps, { children, ...localProps }] = createSplitProps()(props, ["file"]);
+  const api = useFileUploadContext();
+  const mergedProps = mergeProps(api.getItemProps(itemProps), localProps);
+  const view = runIfFn(children, api);
+  return /* @__PURE__ */ jsx(FileUploadItemProvider, { value: itemProps, children: /* @__PURE__ */ jsx(ark.li, { ...mergedProps, ref, children: view }) });
+});
+FileUploadItem.displayName = "FileUploadItem";
+
+export { FileUploadItem };

package/file-upload/file-upload-label.cjs

@@ -0,0 +1,19 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+
+const FileUploadLabel = react.forwardRef((props, ref) => {
+  const api = fileUploadContext.useFileUploadContext();
+  const mergedProps = react$1.mergeProps(api.labelProps, props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref });
+});
+FileUploadLabel.displayName = "FileUploadLabel";
+
+exports.FileUploadLabel = FileUploadLabel;

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

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadLabelProps extends HTMLArkProps<'label'> {
+}
+export declare const FileUploadLabel: ForwardRefExoticComponent<FileUploadLabelProps & RefAttributes<HTMLLabelElement>>;

package/file-upload/file-upload-label.mjs

@@ -0,0 +1,15 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+
+const FileUploadLabel = forwardRef((props, ref) => {
+  const api = useFileUploadContext();
+  const mergedProps = mergeProps(api.labelProps, props);
+  return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
+});
+FileUploadLabel.displayName = "FileUploadLabel";
+
+export { FileUploadLabel };

package/file-upload/file-upload-trigger.cjs

@@ -0,0 +1,21 @@
+'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 factory = require('../factory.cjs');
+const fileUploadContext = require('./file-upload-context.cjs');
+
+const FileUploadTrigger = react.forwardRef(
+  (props, ref) => {
+    const api = fileUploadContext.useFileUploadContext();
+    const mergedProps = react$1.mergeProps(api.triggerProps, props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
+FileUploadTrigger.displayName = "FileUploadTrigger";
+
+exports.FileUploadTrigger = FileUploadTrigger;

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

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface FileUploadTriggerProps extends HTMLArkProps<'button'> {
+}
+export declare const FileUploadTrigger: ForwardRefExoticComponent<FileUploadTriggerProps & RefAttributes<HTMLButtonElement>>;

package/file-upload/file-upload-trigger.mjs

@@ -0,0 +1,17 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.mjs';
+import { useFileUploadContext } from './file-upload-context.mjs';
+
+const FileUploadTrigger = forwardRef(
+  (props, ref) => {
+    const api = useFileUploadContext();
+    const mergedProps = mergeProps(api.triggerProps, props);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
+FileUploadTrigger.displayName = "FileUploadTrigger";
+
+export { FileUploadTrigger };