@zag-js/tabs - npm Package Compare versions

Comparing version 0.69.0 to 0.70.0

dist/index.d.ts

@@ -70,2 +70,6 @@ import * as _zag_js_anatomy from '@zag-js/anatomy';
     composite: boolean;
+    /**
+     * Whether the active tab can be deselected when clicking on it.
+     */
+    deselectable?: boolean;
 }
@@ -167,4 +171,4 @@ type UserDefinedContext = RequiredBy<PublicContext, "id">;
 
-declare const props: ("value" | "dir" | "id" | "getRootNode" | "orientation" | "ids" | "translations" | "loopFocus" | "activationMode" | "onValueChange" | "onFocusChange" | "composite")[];
-declare const splitProps: <Props extends Partial<UserDefinedContext>>(props: Props) => [Partial<UserDefinedContext>, Omit<Props, "value" | "dir" | "id" | "getRootNode" | "orientation" | "ids" | "translations" | "loopFocus" | "activationMode" | "onValueChange" | "onFocusChange" | "composite">];
+declare const props: ("value" | "dir" | "id" | "getRootNode" | "orientation" | "ids" | "translations" | "loopFocus" | "activationMode" | "onValueChange" | "onFocusChange" | "composite" | "deselectable")[];
+declare const splitProps: <Props extends Partial<UserDefinedContext>>(props: Props) => [Partial<UserDefinedContext>, Omit<Props, "value" | "dir" | "id" | "getRootNode" | "orientation" | "ids" | "translations" | "loopFocus" | "activationMode" | "onValueChange" | "onFocusChange" | "composite" | "deselectable">];
 declare const triggerProps: (keyof TriggerProps)[];
@@ -171,0 +175,0 @@ declare const splitTriggerProps: <Props extends TriggerProps>(props: Props) => [TriggerProps, Omit<Props, keyof TriggerProps>];

dist/index.js

@@ -408,3 +408,5 @@ "use strict";
           (0, import_dom_query3.raf)(() => {
-            set.value(ctx2, ctx2.focusedValue);
+            const nullable = ctx2.deselectable && ctx2.value === ctx2.focusedValue;
+            const value = nullable ? null : ctx2.focusedValue;
+            set.value(ctx2, value);
           });
@@ -420,3 +422,5 @@ },
         setValue(ctx2, evt) {
-          set.value(ctx2, evt.value);
+          const nullable = ctx2.deselectable && ctx2.value === ctx2.focusedValue;
+          const value = nullable ? null : evt.value;
+          set.value(ctx2, value);
         },
@@ -555,2 +559,3 @@ clearValue(ctx2) {
   "translations",
+  "deselectable",
   "value"
@@ -557,0 +562,0 @@ ]);

package.json

 {
   "name": "@zag-js/tabs",
-  "version": "0.69.0",
+  "version": "0.70.0",
   "description": "Core logic for the tabs widget implemented as a state machine",
@@ -30,9 +30,9 @@ "keywords": [
   "dependencies": {
-    "@zag-js/anatomy": "0.69.0",
-    "@zag-js/dom-query": "0.69.0",
-    "@zag-js/dom-event": "0.69.0",
-    "@zag-js/element-rect": "0.69.0",
-    "@zag-js/utils": "0.69.0",
-    "@zag-js/core": "0.69.0",
-    "@zag-js/types": "0.69.0"
+    "@zag-js/anatomy": "0.70.0",
+    "@zag-js/dom-query": "0.70.0",
+    "@zag-js/dom-event": "0.70.0",
+    "@zag-js/element-rect": "0.70.0",
+    "@zag-js/utils": "0.70.0",
+    "@zag-js/core": "0.70.0",
+    "@zag-js/types": "0.70.0"
   },
@@ -39,0 +39,0 @@ "devDependencies": {

src/tabs.machine.ts

@@ -144,3 +144,5 @@ import { createMachine, guards } from "@zag-js/core"
           raf(() => {
-            set.value(ctx, ctx.focusedValue)
+            const nullable = ctx.deselectable && ctx.value === ctx.focusedValue
+            const value = nullable ? null : ctx.focusedValue
+            set.value(ctx, value)
           })
@@ -156,3 +158,5 @@ },
         setValue(ctx, evt) {
-          set.value(ctx, evt.value)
+          const nullable = ctx.deselectable && ctx.value === ctx.focusedValue
+          const value = nullable ? null : evt.value
+          set.value(ctx, value)
         },
@@ -159,0 +163,0 @@ clearValue(ctx) {

src/tabs.props.ts

@@ -17,2 +17,3 @@ import { createProps } from "@zag-js/types"
   "translations",
+  "deselectable",
   "value",
@@ -19,0 +20,0 @@ ])

src/tabs.types.ts

@@ -78,2 +78,6 @@ import type { Machine, StateMachine as S } from "@zag-js/core"
   composite: boolean
+  /**
+   * Whether the active tab can be deselected when clicking on it.
+   */
+  deselectable?: boolean
 }
@@ -80,0 +84,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

137832

increased by1.56%

Lines of code

2012

increased by1.16%

Dependency changes

• + Added@zag-js/anatomy@0.70.0(transitive)

• + Added@zag-js/core@0.70.0(transitive)

• + Added@zag-js/dom-event@0.70.0(transitive)

• + Added@zag-js/dom-query@0.70.0(transitive)

• + Added@zag-js/element-rect@0.70.0(transitive)

• + Added@zag-js/store@0.70.0(transitive)

• + Added@zag-js/text-selection@0.70.0(transitive)

• + Added@zag-js/types@0.70.0(transitive)

• + Added@zag-js/utils@0.70.0(transitive)

• - Removed@zag-js/anatomy@0.69.0(transitive)

• - Removed@zag-js/core@0.69.0(transitive)

• - Removed@zag-js/dom-event@0.69.0(transitive)

• - Removed@zag-js/dom-query@0.69.0(transitive)

• - Removed@zag-js/element-rect@0.69.0(transitive)

• - Removed@zag-js/store@0.69.0(transitive)

• - Removed@zag-js/text-selection@0.69.0(transitive)

• - Removed@zag-js/types@0.69.0(transitive)

• - Removed@zag-js/utils@0.69.0(transitive)

• Updated@zag-js/anatomy@0.70.0

• Updated@zag-js/core@0.70.0

• Updated@zag-js/dom-event@0.70.0

• Updated@zag-js/dom-query@0.70.0

• Updated@zag-js/element-rect@0.70.0

• Updated@zag-js/types@0.70.0

• Updated@zag-js/utils@0.70.0