@zag-js/file-upload - npm Package Compare versions

Comparing version 0.16.0 to 0.17.0

dist/index.d.ts

 import * as _zag_js_anatomy from '@zag-js/anatomy';
-import { RequiredBy, CommonProperties, PropTypes, NormalizeProps } from '@zag-js/types';
+import { RequiredBy, PropTypes, CommonProperties, NormalizeProps } from '@zag-js/types';
 import * as _zag_js_core from '@zag-js/core';
@@ -79,3 +79,3 @@ import { StateMachine } from '@zag-js/core';
 type Send = StateMachine.Send<StateMachine.AnyEventObject>;
-type PublicApi<T extends PropTypes> = {
+type MachineApi<T extends PropTypes> = {
     /**
@@ -119,6 +119,6 @@ * Whether the user is dragging something over the root element
 
-declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T>;
+declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T>;
 
 declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
 
-export { UserDefinedContext as Context, anatomy, connect, machine };
+export { MachineApi as Api, UserDefinedContext as Context, anatomy, connect, machine };

dist/index.js

@@ -319,6 +319,6 @@ "use strict";
         "FILES.SET": {
-          actions: ["setFilesFromEvent", "invokeOnChange"]
+          actions: ["setFilesFromEvent"]
         },
         "FILE.DELETE": {
-          actions: ["removeFile", "invokeOnChange"]
+          actions: ["removeFile"]
         }
@@ -354,3 +354,3 @@ },
               target: "idle",
-              actions: ["clearInvalid", "setFilesFromEvent", "invokeOnChange"]
+              actions: ["clearInvalid", "setFilesFromEvent"]
             },
@@ -401,9 +401,10 @@ "DROPZONE.DRAG_LEAVE": {
           const { acceptedFiles, rejectedFiles } = result;
-          ctx2.rejectedFiles = (0, import_core.ref)(rejectedFiles);
           if (ctx2.multiple) {
-            ctx2.files = (0, import_core.ref)([...ctx2.files, ...acceptedFiles]);
+            const files = (0, import_core.ref)([...ctx2.files, ...acceptedFiles]);
+            set.files(ctx2, files, rejectedFiles);
             return;
           }
           if (acceptedFiles.length) {
-            ctx2.files = (0, import_core.ref)([acceptedFiles[0]]);
+            const files = (0, import_core.ref)([acceptedFiles[0]]);
+            set.files(ctx2, files, rejectedFiles);
           }
@@ -413,3 +414,3 @@ },
           const nextFiles = ctx2.files.filter((file) => file !== evt.file);
-          ctx2.files = (0, import_core.ref)(nextFiles);
+          set.files(ctx2, nextFiles);
         },
@@ -429,2 +430,15 @@ invokeOnChange(ctx2) {
 }
+var invoke = {
+  change: (ctx) => {
+    ctx.onChange?.({ acceptedFiles: ctx.files, rejectedFiles: ctx.rejectedFiles });
+  }
+};
+var set = {
+  files: (ctx, acceptedFiles, rejectedFiles) => {
+    ctx.files = (0, import_core.ref)(acceptedFiles);
+    if (rejectedFiles)
+      ctx.rejectedFiles = (0, import_core.ref)(rejectedFiles);
+    invoke.change(ctx);
+  }
+};
 // Annotate the CommonJS export names for ESM import in node:
@@ -431,0 +445,0 @@ 0 && (module.exports = {

package.json

 {
   "name": "@zag-js/file-upload",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "description": "Core logic for the file-upload widget implemented as a state machine",
@@ -31,8 +31,8 @@ "keywords": [
   "dependencies": {
-    "@zag-js/anatomy": "0.16.0",
-    "@zag-js/core": "0.16.0",
-    "@zag-js/dom-query": "0.16.0",
-    "@zag-js/visually-hidden": "0.16.0",
-    "@zag-js/utils": "0.16.0",
-    "@zag-js/types": "0.16.0"
+    "@zag-js/anatomy": "0.17.0",
+    "@zag-js/core": "0.17.0",
+    "@zag-js/dom-query": "0.17.0",
+    "@zag-js/visually-hidden": "0.17.0",
+    "@zag-js/utils": "0.17.0",
+    "@zag-js/types": "0.17.0"
   },
@@ -39,0 +39,0 @@ "devDependencies": {

src/file-upload.connect.ts

@@ -6,6 +6,6 @@ import { contains, dataAttr, isSelfEvent } from "@zag-js/dom-query"
 import { dom } from "./file-upload.dom"
-import { type PublicApi, type Send, type State } from "./file-upload.types"
+import { type MachineApi, type Send, type State } from "./file-upload.types"
 import { isEventWithFiles } from "./file-upload.utils"
 
-export function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {
+export function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {
   const disabled = state.context.disabled
@@ -12,0 +12,0 @@ const isDragging = state.matches("dragging")

src/file-upload.machine.ts

@@ -5,3 +5,3 @@ import { createMachine, guards, ref } from "@zag-js/core"
 import { dom } from "./file-upload.dom"
-import type { MachineContext, MachineState, UserDefinedContext } from "./file-upload.types"
+import type { MachineContext, MachineState, RejectedFile, UserDefinedContext } from "./file-upload.types"
 import { getAcceptAttrString, getFilesFromEvent, isFilesWithinRange } from "./file-upload.utils"
@@ -33,6 +33,6 @@
         "FILES.SET": {
-          actions: ["setFilesFromEvent", "invokeOnChange"],
+          actions: ["setFilesFromEvent"],
         },
         "FILE.DELETE": {
-          actions: ["removeFile", "invokeOnChange"],
+          actions: ["removeFile"],
         },
@@ -68,3 +68,3 @@ },
               target: "idle",
-              actions: ["clearInvalid", "setFilesFromEvent", "invokeOnChange"],
+              actions: ["clearInvalid", "setFilesFromEvent"],
             },
@@ -116,6 +116,5 @@ "DROPZONE.DRAG_LEAVE": {
 
-          ctx.rejectedFiles = ref(rejectedFiles)
-
           if (ctx.multiple) {
-            ctx.files = ref([...ctx.files, ...acceptedFiles])
+            const files = ref([...ctx.files, ...acceptedFiles])
+            set.files(ctx, files, rejectedFiles)
             return
@@ -125,3 +124,4 @@ }
           if (acceptedFiles.length) {
-            ctx.files = ref([acceptedFiles[0]])
+            const files = ref([acceptedFiles[0]])
+            set.files(ctx, files, rejectedFiles)
           }
@@ -131,3 +131,3 @@ },
           const nextFiles = ctx.files.filter((file) => file !== evt.file)
-          ctx.files = ref(nextFiles)
+          set.files(ctx, nextFiles)
         },
@@ -147,1 +147,15 @@ invokeOnChange(ctx) {
 }
+
+const invoke = {
+  change: (ctx: MachineContext) => {
+    ctx.onChange?.({ acceptedFiles: ctx.files, rejectedFiles: ctx.rejectedFiles })
+  },
+}
+
+const set = {
+  files: (ctx: MachineContext, acceptedFiles: File[], rejectedFiles?: RejectedFile[]) => {
+    ctx.files = ref(acceptedFiles)
+    if (rejectedFiles) ctx.rejectedFiles = ref(rejectedFiles)
+    invoke.change(ctx)
+  },
+}

src/file-upload.types.ts

@@ -85,3 +85,3 @@ import type { StateMachine as S } from "@zag-js/core"
 
-export type PublicApi<T extends PropTypes> = {
+export type MachineApi<T extends PropTypes> = {
   /**
@@ -88,0 +88,0 @@ * Whether the user is dragging something over the root element

src/index.ts

 export { anatomy } from "./file-upload.anatomy"
 export { connect } from "./file-upload.connect"
 export { machine } from "./file-upload.machine"
-export type { UserDefinedContext as Context } from "./file-upload.types"
+export type { MachineApi as Api, UserDefinedContext as Context } from "./file-upload.types"

No alert changes

Improved metrics

Total package byte prevSize

98980

2.53%

Lines of code

1469

2.87%

Dependency changes

• + Added

  @zag-js/anatomy@0.17.0
  (transitive)

• + Added

  @zag-js/core@0.17.0
  (transitive)

• + Added

  @zag-js/dom-query@0.17.0
  (transitive)

• + Added

  @zag-js/store@0.17.0
  (transitive)

• + Added

  @zag-js/types@0.17.0
  (transitive)

• + Added

  @zag-js/utils@0.17.0
  (transitive)

• + Added

  @zag-js/visually-hidden@0.17.0
  (transitive)

• - Removed

  @zag-js/anatomy@0.16.0
  (transitive)

• - Removed

  @zag-js/core@0.16.0
  (transitive)

• - Removed

  @zag-js/dom-query@0.16.0
  (transitive)

• - Removed

  @zag-js/store@0.16.0
  (transitive)

• - Removed

  @zag-js/types@0.16.0
  (transitive)

• - Removed

  @zag-js/utils@0.16.0
  (transitive)

• - Removed

  @zag-js/visually-hidden@0.16.0
  (transitive)

• Updated

  @zag-js/anatomy@0.17.0

• Updated

  @zag-js/core@0.17.0

• Updated

  @zag-js/dom-query@0.17.0

• Updated

  @zag-js/types@0.17.0

• Updated

  @zag-js/utils@0.17.0

• Updated

  @zag-js/visually-hidden@0.17.0