@ark-ui/react 4.8.0 → 4.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,16 +6,21 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
6
6
  const jsxRuntime = require('react/jsx-runtime');
7
7
  const react$1 = require('@zag-js/react');
8
8
  const react = require('react');
9
+ const createSplitProps = require('../../utils/create-split-props.cjs');
9
10
  const factory = require('../factory.cjs');
10
11
  const useFileUploadContext = require('./use-file-upload-context.cjs');
11
12
 
12
- const FileUploadDropzone = react.forwardRef(
13
- (props, ref) => {
14
- const fileUpload = useFileUploadContext.useFileUploadContext();
15
- const mergedProps = react$1.mergeProps(fileUpload.getDropzoneProps(), props);
16
- return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
17
- }
18
- );
13
+ const FileUploadDropzone = react.forwardRef((props, ref) => {
14
+ const [dropzoneProps, localProps] = createSplitProps.createSplitProps()(props, [
15
+ "disableClick"
16
+ ]);
17
+ const fileUpload = useFileUploadContext.useFileUploadContext();
18
+ const mergedProps = react$1.mergeProps(
19
+ fileUpload.getDropzoneProps(dropzoneProps),
20
+ localProps
21
+ );
22
+ return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
23
+ });
19
24
  FileUploadDropzone.displayName = "FileUploadDropzone";
20
25
 
21
26
  exports.FileUploadDropzone = FileUploadDropzone;
@@ -1,7 +1,8 @@
1
+ import { DropzoneProps } from '@zag-js/file-upload';
1
2
  import { HTMLProps, PolymorphicProps } from '../factory';
2
3
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
- export interface FileUploadDropzoneBaseProps extends PolymorphicProps {
4
+ export interface FileUploadDropzoneBaseProps extends PolymorphicProps, DropzoneProps {
4
5
  }
5
- export interface FileUploadDropzoneProps extends HTMLProps<'div'>, FileUploadDropzoneBaseProps {
6
+ export interface FileUploadDropzoneProps extends HTMLProps<"div">, FileUploadDropzoneBaseProps {
6
7
  }
7
8
  export declare const FileUploadDropzone: ForwardRefExoticComponent<FileUploadDropzoneProps & RefAttributes<HTMLDivElement>>;
@@ -1,7 +1,8 @@
1
+ import { DropzoneProps } from '@zag-js/file-upload';
1
2
  import { HTMLProps, PolymorphicProps } from '../factory';
2
3
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
- export interface FileUploadDropzoneBaseProps extends PolymorphicProps {
4
+ export interface FileUploadDropzoneBaseProps extends PolymorphicProps, DropzoneProps {
4
5
  }
5
- export interface FileUploadDropzoneProps extends HTMLProps<'div'>, FileUploadDropzoneBaseProps {
6
+ export interface FileUploadDropzoneProps extends HTMLProps<"div">, FileUploadDropzoneBaseProps {
6
7
  }
7
8
  export declare const FileUploadDropzone: ForwardRefExoticComponent<FileUploadDropzoneProps & RefAttributes<HTMLDivElement>>;
@@ -2,16 +2,21 @@
2
2
  import { jsx } from 'react/jsx-runtime';
3
3
  import { mergeProps } from '@zag-js/react';
4
4
  import { forwardRef } from 'react';
5
+ import { createSplitProps } from '../../utils/create-split-props.js';
5
6
  import { ark } from '../factory.js';
6
7
  import { useFileUploadContext } from './use-file-upload-context.js';
7
8
 
8
- const FileUploadDropzone = forwardRef(
9
- (props, ref) => {
10
- const fileUpload = useFileUploadContext();
11
- const mergedProps = mergeProps(fileUpload.getDropzoneProps(), props);
12
- return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
13
- }
14
- );
9
+ const FileUploadDropzone = forwardRef((props, ref) => {
10
+ const [dropzoneProps, localProps] = createSplitProps()(props, [
11
+ "disableClick"
12
+ ]);
13
+ const fileUpload = useFileUploadContext();
14
+ const mergedProps = mergeProps(
15
+ fileUpload.getDropzoneProps(dropzoneProps),
16
+ localProps
17
+ );
18
+ return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
19
+ });
15
20
  FileUploadDropzone.displayName = "FileUploadDropzone";
16
21
 
17
22
  export { FileUploadDropzone };
@@ -14,10 +14,14 @@ const FileUploadItemPreviewImage = react.forwardRef((props, ref) => {
14
14
  const [url, setUrl] = react.useState("");
15
15
  const fileUpload = useFileUploadContext.useFileUploadContext();
16
16
  const itemProps = useFileUploadItemPropsContext.useFileUploadItemPropsContext();
17
- const mergedProps = react$1.mergeProps(fileUpload.getItemPreviewImageProps({ ...itemProps, url }), props);
17
+ const mergedProps = react$1.mergeProps(
18
+ fileUpload.getItemPreviewImageProps({ ...itemProps, url }),
19
+ props
20
+ );
18
21
  react.useEffect(() => {
19
22
  return fileUpload.createFileUrl(itemProps.file, (url2) => setUrl(url2));
20
23
  }, [itemProps, fileUpload]);
24
+ if (!url) return null;
21
25
  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.img, { ...mergedProps, ref });
22
26
  });
23
27
  FileUploadItemPreviewImage.displayName = "FileUploadItemPreviewImage";
@@ -2,6 +2,6 @@ import { HTMLProps, PolymorphicProps } from '../factory';
2
2
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
3
  export interface FileUploadItemPreviewImageBaseProps extends PolymorphicProps {
4
4
  }
5
- export interface FileUploadItemPreviewImageProps extends HTMLProps<'img'>, FileUploadItemPreviewImageBaseProps {
5
+ export interface FileUploadItemPreviewImageProps extends HTMLProps<"img">, FileUploadItemPreviewImageBaseProps {
6
6
  }
7
7
  export declare const FileUploadItemPreviewImage: ForwardRefExoticComponent<FileUploadItemPreviewImageProps & RefAttributes<HTMLImageElement>>;
@@ -2,6 +2,6 @@ import { HTMLProps, PolymorphicProps } from '../factory';
2
2
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
3
  export interface FileUploadItemPreviewImageBaseProps extends PolymorphicProps {
4
4
  }
5
- export interface FileUploadItemPreviewImageProps extends HTMLProps<'img'>, FileUploadItemPreviewImageBaseProps {
5
+ export interface FileUploadItemPreviewImageProps extends HTMLProps<"img">, FileUploadItemPreviewImageBaseProps {
6
6
  }
7
7
  export declare const FileUploadItemPreviewImage: ForwardRefExoticComponent<FileUploadItemPreviewImageProps & RefAttributes<HTMLImageElement>>;
@@ -10,10 +10,14 @@ const FileUploadItemPreviewImage = forwardRef((props, ref) => {
10
10
  const [url, setUrl] = useState("");
11
11
  const fileUpload = useFileUploadContext();
12
12
  const itemProps = useFileUploadItemPropsContext();
13
- const mergedProps = mergeProps(fileUpload.getItemPreviewImageProps({ ...itemProps, url }), props);
13
+ const mergedProps = mergeProps(
14
+ fileUpload.getItemPreviewImageProps({ ...itemProps, url }),
15
+ props
16
+ );
14
17
  useEffect(() => {
15
18
  return fileUpload.createFileUrl(itemProps.file, (url2) => setUrl(url2));
16
19
  }, [itemProps, fileUpload]);
20
+ if (!url) return null;
17
21
  return /* @__PURE__ */ jsx(ark.img, { ...mergedProps, ref });
18
22
  });
19
23
  FileUploadItemPreviewImage.displayName = "FileUploadItemPreviewImage";
@@ -12,7 +12,7 @@ const useTourContext = require('./use-tour-context.cjs');
12
12
  const TourProgressText = react.forwardRef((props, ref) => {
13
13
  const tour = useTourContext.useTourContext();
14
14
  const mergedProps = react$1.mergeProps(tour.getProgressTextProps(), props);
15
- return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
15
+ return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: mergedProps.children || tour.getProgressText() });
16
16
  });
17
17
  TourProgressText.displayName = "TourProgressText";
18
18
 
@@ -2,6 +2,6 @@ import { HTMLProps, PolymorphicProps } from '../factory';
2
2
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
3
  export interface TourProgressTextBaseProps extends PolymorphicProps {
4
4
  }
5
- export interface TourProgressTextProps extends HTMLProps<'div'>, TourProgressTextBaseProps {
5
+ export interface TourProgressTextProps extends HTMLProps<"div">, TourProgressTextBaseProps {
6
6
  }
7
7
  export declare const TourProgressText: ForwardRefExoticComponent<TourProgressTextProps & RefAttributes<HTMLDivElement>>;
@@ -2,6 +2,6 @@ import { HTMLProps, PolymorphicProps } from '../factory';
2
2
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
3
  export interface TourProgressTextBaseProps extends PolymorphicProps {
4
4
  }
5
- export interface TourProgressTextProps extends HTMLProps<'div'>, TourProgressTextBaseProps {
5
+ export interface TourProgressTextProps extends HTMLProps<"div">, TourProgressTextBaseProps {
6
6
  }
7
7
  export declare const TourProgressText: ForwardRefExoticComponent<TourProgressTextProps & RefAttributes<HTMLDivElement>>;
@@ -8,7 +8,7 @@ import { useTourContext } from './use-tour-context.js';
8
8
  const TourProgressText = forwardRef((props, ref) => {
9
9
  const tour = useTourContext();
10
10
  const mergedProps = mergeProps(tour.getProgressTextProps(), props);
11
- return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
11
+ return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: mergedProps.children || tour.getProgressText() });
12
12
  });
13
13
  TourProgressText.displayName = "TourProgressText";
14
14
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ark-ui/react",
3
- "version": "4.8.0",
3
+ "version": "4.8.1",
4
4
  "description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
5
5
  "keywords": [
6
6
  "accordion",
@@ -161,57 +161,57 @@
161
161
  "sideEffects": false,
162
162
  "dependencies": {
163
163
  "@internationalized/date": "3.6.0",
164
- "@zag-js/accordion": "0.81.1",
165
- "@zag-js/anatomy": "0.81.1",
166
- "@zag-js/auto-resize": "0.81.1",
167
- "@zag-js/avatar": "0.81.1",
168
- "@zag-js/carousel": "0.81.1",
169
- "@zag-js/checkbox": "0.81.1",
170
- "@zag-js/clipboard": "0.81.1",
171
- "@zag-js/collapsible": "0.81.1",
172
- "@zag-js/collection": "0.81.1",
173
- "@zag-js/color-picker": "0.81.1",
174
- "@zag-js/color-utils": "0.81.1",
175
- "@zag-js/combobox": "0.81.1",
176
- "@zag-js/core": "0.81.1",
177
- "@zag-js/date-picker": "0.81.1",
178
- "@zag-js/date-utils": "0.81.1",
179
- "@zag-js/dialog": "0.81.1",
180
- "@zag-js/dom-query": "0.81.1",
181
- "@zag-js/editable": "0.81.1",
182
- "@zag-js/file-upload": "0.81.1",
183
- "@zag-js/file-utils": "0.81.1",
184
- "@zag-js/focus-trap": "0.81.1",
185
- "@zag-js/highlight-word": "0.81.1",
186
- "@zag-js/hover-card": "0.81.1",
187
- "@zag-js/i18n-utils": "0.81.1",
188
- "@zag-js/menu": "0.81.1",
189
- "@zag-js/number-input": "0.81.1",
190
- "@zag-js/pagination": "0.81.1",
191
- "@zag-js/pin-input": "0.81.1",
192
- "@zag-js/popover": "0.81.1",
193
- "@zag-js/presence": "0.81.1",
194
- "@zag-js/progress": "0.81.1",
195
- "@zag-js/qr-code": "0.81.1",
196
- "@zag-js/radio-group": "0.81.1",
197
- "@zag-js/rating-group": "0.81.1",
198
- "@zag-js/react": "0.81.1",
199
- "@zag-js/select": "0.81.1",
200
- "@zag-js/signature-pad": "0.81.1",
201
- "@zag-js/slider": "0.81.1",
202
- "@zag-js/splitter": "0.81.1",
203
- "@zag-js/steps": "0.81.1",
204
- "@zag-js/switch": "0.81.1",
205
- "@zag-js/tabs": "0.81.1",
206
- "@zag-js/tags-input": "0.81.1",
207
- "@zag-js/time-picker": "0.81.1",
208
- "@zag-js/timer": "0.81.1",
209
- "@zag-js/toast": "0.81.1",
210
- "@zag-js/toggle-group": "0.81.1",
211
- "@zag-js/tooltip": "0.81.1",
212
- "@zag-js/tour": "0.81.1",
213
- "@zag-js/tree-view": "0.81.1",
214
- "@zag-js/types": "0.81.1"
164
+ "@zag-js/accordion": "0.81.2",
165
+ "@zag-js/anatomy": "0.81.2",
166
+ "@zag-js/auto-resize": "0.81.2",
167
+ "@zag-js/avatar": "0.81.2",
168
+ "@zag-js/carousel": "0.81.2",
169
+ "@zag-js/checkbox": "0.81.2",
170
+ "@zag-js/clipboard": "0.81.2",
171
+ "@zag-js/collapsible": "0.81.2",
172
+ "@zag-js/collection": "0.81.2",
173
+ "@zag-js/color-picker": "0.81.2",
174
+ "@zag-js/color-utils": "0.81.2",
175
+ "@zag-js/combobox": "0.81.2",
176
+ "@zag-js/core": "0.81.2",
177
+ "@zag-js/date-picker": "0.81.2",
178
+ "@zag-js/date-utils": "0.81.2",
179
+ "@zag-js/dialog": "0.81.2",
180
+ "@zag-js/dom-query": "0.81.2",
181
+ "@zag-js/editable": "0.81.2",
182
+ "@zag-js/file-upload": "0.81.2",
183
+ "@zag-js/file-utils": "0.81.2",
184
+ "@zag-js/focus-trap": "0.81.2",
185
+ "@zag-js/highlight-word": "0.81.2",
186
+ "@zag-js/hover-card": "0.81.2",
187
+ "@zag-js/i18n-utils": "0.81.2",
188
+ "@zag-js/menu": "0.81.2",
189
+ "@zag-js/number-input": "0.81.2",
190
+ "@zag-js/pagination": "0.81.2",
191
+ "@zag-js/pin-input": "0.81.2",
192
+ "@zag-js/popover": "0.81.2",
193
+ "@zag-js/presence": "0.81.2",
194
+ "@zag-js/progress": "0.81.2",
195
+ "@zag-js/qr-code": "0.81.2",
196
+ "@zag-js/radio-group": "0.81.2",
197
+ "@zag-js/rating-group": "0.81.2",
198
+ "@zag-js/react": "0.81.2",
199
+ "@zag-js/select": "0.81.2",
200
+ "@zag-js/signature-pad": "0.81.2",
201
+ "@zag-js/slider": "0.81.2",
202
+ "@zag-js/splitter": "0.81.2",
203
+ "@zag-js/steps": "0.81.2",
204
+ "@zag-js/switch": "0.81.2",
205
+ "@zag-js/tabs": "0.81.2",
206
+ "@zag-js/tags-input": "0.81.2",
207
+ "@zag-js/time-picker": "0.81.2",
208
+ "@zag-js/timer": "0.81.2",
209
+ "@zag-js/toast": "0.81.2",
210
+ "@zag-js/toggle-group": "0.81.2",
211
+ "@zag-js/tooltip": "0.81.2",
212
+ "@zag-js/tour": "0.81.2",
213
+ "@zag-js/tree-view": "0.81.2",
214
+ "@zag-js/types": "0.81.2"
215
215
  },
216
216
  "devDependencies": {
217
217
  "@biomejs/biome": "1.9.4",
@@ -225,14 +225,14 @@
225
225
  "@testing-library/react": "16.1.0",
226
226
  "@testing-library/user-event": "14.5.2",
227
227
  "@types/jsdom": "21.1.7",
228
- "@types/react": "19.0.2",
229
- "@types/react-dom": "19.0.2",
228
+ "@types/react": "19.0.6",
229
+ "@types/react-dom": "19.0.3",
230
230
  "@vitejs/plugin-react": "4.3.4",
231
- "@zag-js/stringify-state": "0.81.1",
231
+ "@zag-js/stringify-state": "0.81.2",
232
232
  "clean-package": "2.2.0",
233
233
  "globby": "14.0.2",
234
234
  "jsdom": "25.0.1",
235
- "lucide-react": "0.469.0",
235
+ "lucide-react": "0.471.1",
236
236
  "react": "19.0.0",
237
237
  "react-dom": "19.0.0",
238
238
  "react-frame-component": "5.2.7",
@@ -240,9 +240,9 @@
240
240
  "release-it": "17.11.0",
241
241
  "resize-observer-polyfill": "1.5.1",
242
242
  "storybook": "8.4.7",
243
- "typescript": "5.7.2",
243
+ "typescript": "5.7.3",
244
244
  "vite": "5.4.11",
245
- "vite-plugin-dts": "4.4.0",
245
+ "vite-plugin-dts": "4.5.0",
246
246
  "vitest": "2.1.8",
247
247
  "vitest-axe": "1.0.0-pre.3"
248
248
  },