@zag-js/dismissable 0.1.4 → 0.1.5

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.
package/dist/index.js CHANGED
@@ -1,30 +1,4 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/index.ts
21
- var src_exports = {};
22
- __export(src_exports, {
23
- trackDismissableElement: () => trackDismissableElement
24
- });
25
- module.exports = __toCommonJS(src_exports);
26
-
27
- // ../dom/dist/index.mjs
1
+ // ../dom/dist/index.js
28
2
  var runIfFn = (v, ...a) => {
29
3
  const res = typeof v === "function" ? v(...a) : v;
30
4
  return res ?? void 0;
@@ -65,9 +39,11 @@ function addDomEvent(target, eventName, handler, options) {
65
39
  }
66
40
 
67
41
  // src/dismissable-layer.ts
68
- var import_interact_outside = require("@zag-js/interact-outside");
42
+ import {
43
+ trackInteractOutside
44
+ } from "@zag-js/interact-outside";
69
45
 
70
- // ../core/dist/index.mjs
46
+ // ../core/dist/index.js
71
47
  function warn(...a) {
72
48
  const m = a.length === 1 ? a[0] : a[1];
73
49
  const c = a.length === 2 ? a[0] : true;
@@ -239,7 +215,7 @@ function trackDismissableElement(node, options) {
239
215
  const cleanups = [
240
216
  pointerBlocking ? disablePointerEventsOutside(node) : void 0,
241
217
  trackEscapeKeydown(onEscapeKeyDown),
242
- (0, import_interact_outside.trackInteractOutside)(node, { exclude, onFocusOutside, onPointerDownOutside })
218
+ trackInteractOutside(node, { exclude, onFocusOutside, onPointerDownOutside })
243
219
  ];
244
220
  return () => {
245
221
  layerStack.remove(node);
@@ -248,7 +224,6 @@ function trackDismissableElement(node, options) {
248
224
  cleanups.forEach((fn) => fn == null ? void 0 : fn());
249
225
  };
250
226
  }
251
- // Annotate the CommonJS export names for ESM import in node:
252
- 0 && (module.exports = {
227
+ export {
253
228
  trackDismissableElement
254
- });
229
+ };
package/package.json CHANGED
@@ -1,6 +1,7 @@
1
1
  {
2
+ "type": "module",
2
3
  "name": "@zag-js/dismissable",
3
- "version": "0.1.4",
4
+ "version": "0.1.5",
4
5
  "description": "Dismissable layer utilities for the DOM",
5
6
  "keywords": [
6
7
  "js",
@@ -15,7 +16,6 @@
15
16
  "homepage": "https://github.com/chakra-ui/zag#readme",
16
17
  "license": "MIT",
17
18
  "main": "dist/index.js",
18
- "module": "dist/index.mjs",
19
19
  "types": "dist/index.d.ts",
20
20
  "repository": "https://github.com/chakra-ui/zag/tree/main/packages/utilities/interact-outside",
21
21
  "sideEffects": false,
@@ -26,19 +26,19 @@
26
26
  "access": "public"
27
27
  },
28
28
  "dependencies": {
29
- "@zag-js/interact-outside": "0.1.4"
29
+ "@zag-js/interact-outside": "0.1.5"
30
30
  },
31
31
  "devDependencies": {
32
- "@zag-js/dom-utils": "0.1.11",
33
- "@zag-js/utils": "0.1.4"
32
+ "@zag-js/dom-utils": "0.1.12",
33
+ "@zag-js/utils": "0.1.5"
34
34
  },
35
35
  "bugs": {
36
36
  "url": "https://github.com/chakra-ui/zag/issues"
37
37
  },
38
38
  "scripts": {
39
- "build-fast": "tsup src/index.ts --format=esm,cjs",
39
+ "build-fast": "tsup src/index.ts --format=esm",
40
40
  "start": "pnpm build --watch",
41
- "build": "tsup src/index.ts --format=esm,cjs --dts",
41
+ "build": "tsup src/index.ts --format=esm --dts",
42
42
  "test": "jest --config ../../../jest.config.js --rootDir tests",
43
43
  "lint": "eslint src --ext .ts,.tsx",
44
44
  "test-ci": "pnpm test --ci --runInBand -u",
package/dist/index.mjs DELETED
@@ -1,229 +0,0 @@
1
- // ../dom/dist/index.mjs
2
- var runIfFn = (v, ...a) => {
3
- const res = typeof v === "function" ? v(...a) : v;
4
- return res ?? void 0;
5
- };
6
- var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
7
- function isDocument(el) {
8
- return el.nodeType === Node.DOCUMENT_NODE;
9
- }
10
- function isWindow(value) {
11
- return (value == null ? void 0 : value.toString()) === "[object Window]";
12
- }
13
- function getDocument(el) {
14
- if (isWindow(el))
15
- return el.document;
16
- if (isDocument(el))
17
- return el;
18
- return (el == null ? void 0 : el.ownerDocument) ?? document;
19
- }
20
- function getEventTarget(event) {
21
- var _a;
22
- return ((_a = event.composedPath) == null ? void 0 : _a.call(event)[0]) ?? event.target;
23
- }
24
- function contains(parent, child) {
25
- if (!parent)
26
- return false;
27
- return parent === child || isHTMLElement(parent) && isHTMLElement(child) && parent.contains(child);
28
- }
29
- function isHTMLElement(v) {
30
- return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
31
- }
32
- var isRef = (v) => hasProp(v, "current");
33
- function addDomEvent(target, eventName, handler, options) {
34
- const node = isRef(target) ? target.current : runIfFn(target);
35
- node == null ? void 0 : node.addEventListener(eventName, handler, options);
36
- return () => {
37
- node == null ? void 0 : node.removeEventListener(eventName, handler, options);
38
- };
39
- }
40
-
41
- // src/dismissable-layer.ts
42
- import {
43
- trackInteractOutside
44
- } from "@zag-js/interact-outside";
45
-
46
- // ../core/dist/index.mjs
47
- function warn(...a) {
48
- const m = a.length === 1 ? a[0] : a[1];
49
- const c = a.length === 2 ? a[0] : true;
50
- if (c && process.env.NODE_ENV !== "production") {
51
- console.warn(m);
52
- }
53
- }
54
-
55
- // src/escape-keydown.ts
56
- function trackEscapeKeydown(fn) {
57
- const handleKeyDown = (event) => {
58
- if (event.key === "Escape")
59
- fn == null ? void 0 : fn(event);
60
- };
61
- return addDomEvent(document, "keydown", handleKeyDown);
62
- }
63
-
64
- // src/layer-stack.ts
65
- var layerStack = {
66
- layers: [],
67
- branches: [],
68
- count() {
69
- return this.layers.length;
70
- },
71
- pointerBlockingLayers() {
72
- return this.layers.filter((layer) => layer.pointerBlocking);
73
- },
74
- topMostPointerBlockingLayer() {
75
- return [...this.pointerBlockingLayers()].slice(-1)[0];
76
- },
77
- hasPointerBlockingLayer() {
78
- return this.pointerBlockingLayers().length > 0;
79
- },
80
- isBelowPointerBlockingLayer(node) {
81
- var _a;
82
- const index = this.indexOf(node);
83
- const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf((_a = this.topMostPointerBlockingLayer()) == null ? void 0 : _a.node) : -1;
84
- return index < highestBlockingIndex;
85
- },
86
- isTopMost(node) {
87
- const layer = this.layers[this.count() - 1];
88
- return (layer == null ? void 0 : layer.node) === node;
89
- },
90
- getNestedLayers(node) {
91
- return Array.from(this.layers).slice(this.indexOf(node) + 1);
92
- },
93
- isInNestedLayer(node, target) {
94
- return this.getNestedLayers(node).some((layer) => contains(layer.node, target));
95
- },
96
- isInBranch(target) {
97
- return Array.from(this.branches).some((branch) => contains(branch, target));
98
- },
99
- add(layer) {
100
- this.layers.push(layer);
101
- },
102
- addBranch(node) {
103
- this.branches.push(node);
104
- },
105
- remove(node) {
106
- const index = this.indexOf(node);
107
- if (index < 0)
108
- return;
109
- if (index < this.count() - 1) {
110
- const _layers = this.getNestedLayers(node);
111
- _layers.forEach((layer) => layer.dismiss());
112
- }
113
- this.layers.splice(index, 1);
114
- },
115
- removeBranch(node) {
116
- const index = this.branches.indexOf(node);
117
- if (index >= 0)
118
- this.branches.splice(index, 1);
119
- },
120
- indexOf(node) {
121
- return this.layers.findIndex((layer) => layer.node === node);
122
- },
123
- dismiss(node) {
124
- var _a;
125
- (_a = this.layers[this.indexOf(node)]) == null ? void 0 : _a.dismiss();
126
- },
127
- clear() {
128
- this.remove(this.layers[0].node);
129
- }
130
- };
131
-
132
- // src/pointer-event-outside.ts
133
- var originalBodyPointerEvents;
134
- function assignPointerEventToLayers() {
135
- layerStack.layers.forEach(({ node }) => {
136
- node.style.pointerEvents = layerStack.isBelowPointerBlockingLayer(node) ? "none" : "auto";
137
- });
138
- }
139
- function clearPointerEvent(node) {
140
- node.style.pointerEvents = "";
141
- }
142
- var DATA_ATTR = "data-inert";
143
- function disablePointerEventsOutside(node) {
144
- const doc = getDocument(node);
145
- if (layerStack.hasPointerBlockingLayer() && !doc.body.hasAttribute(DATA_ATTR)) {
146
- originalBodyPointerEvents = document.body.style.pointerEvents;
147
- doc.body.style.pointerEvents = "none";
148
- doc.body.setAttribute(DATA_ATTR, "");
149
- }
150
- return () => {
151
- if (layerStack.hasPointerBlockingLayer())
152
- return;
153
- doc.body.style.pointerEvents = originalBodyPointerEvents;
154
- doc.body.removeAttribute(DATA_ATTR);
155
- if (doc.body.style.length === 0)
156
- doc.body.removeAttribute("style");
157
- };
158
- }
159
-
160
- // src/dismissable-layer.ts
161
- function trackDismissableElement(node, options) {
162
- if (!node) {
163
- warn("[@zag-js/dismissable] node is `null` or `undefined`");
164
- return;
165
- }
166
- const { onDismiss, pointerBlocking, exclude: excludeContainers, debug } = options;
167
- const layer = { dismiss: onDismiss, node, pointerBlocking };
168
- layerStack.add(layer);
169
- assignPointerEventToLayers();
170
- function onPointerDownOutside(event) {
171
- var _a, _b;
172
- const target = getEventTarget(event.detail.originalEvent);
173
- if (layerStack.isBelowPointerBlockingLayer(node) || layerStack.isInBranch(target))
174
- return;
175
- (_a = options.onPointerDownOutside) == null ? void 0 : _a.call(options, event);
176
- (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
177
- if (event.defaultPrevented)
178
- return;
179
- if (debug) {
180
- console.log("onPointerDownOutside:", event.detail.originalEvent);
181
- }
182
- onDismiss == null ? void 0 : onDismiss();
183
- }
184
- function onFocusOutside(event) {
185
- var _a, _b;
186
- const target = getEventTarget(event.detail.originalEvent);
187
- if (layerStack.isInBranch(target))
188
- return;
189
- (_a = options.onFocusOutside) == null ? void 0 : _a.call(options, event);
190
- (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
191
- if (event.defaultPrevented)
192
- return;
193
- if (debug) {
194
- console.log("onFocusOutside:", event.detail.originalEvent);
195
- }
196
- onDismiss == null ? void 0 : onDismiss();
197
- }
198
- function onEscapeKeyDown(event) {
199
- var _a;
200
- if (!layerStack.isTopMost(node))
201
- return;
202
- (_a = options.onEscapeKeyDown) == null ? void 0 : _a.call(options, event);
203
- if (!event.defaultPrevented && onDismiss) {
204
- event.preventDefault();
205
- onDismiss();
206
- }
207
- }
208
- function exclude(target) {
209
- if (!node)
210
- return false;
211
- const containers = typeof excludeContainers === "function" ? excludeContainers() : excludeContainers;
212
- const _containers = Array.isArray(containers) ? containers : [containers];
213
- return _containers.some((node2) => contains(node2, target)) || layerStack.isInNestedLayer(node, target);
214
- }
215
- const cleanups = [
216
- pointerBlocking ? disablePointerEventsOutside(node) : void 0,
217
- trackEscapeKeydown(onEscapeKeyDown),
218
- trackInteractOutside(node, { exclude, onFocusOutside, onPointerDownOutside })
219
- ];
220
- return () => {
221
- layerStack.remove(node);
222
- assignPointerEventToLayers();
223
- clearPointerEvent(node);
224
- cleanups.forEach((fn) => fn == null ? void 0 : fn());
225
- };
226
- }
227
- export {
228
- trackDismissableElement
229
- };