@zag-js/toast 1.41.0 → 2.0.0-next.0

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.
Files changed (11) hide show
  1. package/dist/toast-group.connect.js +2 -2
  2. package/dist/toast-group.connect.mjs +2 -2
  3. package/dist/toast.anatomy.d.mts +2 -2
  4. package/dist/toast.anatomy.d.ts +2 -2
  5. package/dist/toast.connect.js +5 -7
  6. package/dist/toast.connect.mjs +5 -7
  7. package/dist/toast.dom.d.mts +2 -2
  8. package/dist/toast.dom.d.ts +2 -2
  9. package/dist/toast.dom.js +8 -7
  10. package/dist/toast.dom.mjs +8 -7
  11. package/package.json +7 -7
package/dist/toast-group.connect.js CHANGED
@@ -38,7 +38,7 @@ var import_toast = require("./toast.anatomy.js");
38
38
  var dom = __toESM(require("./toast.dom.js"));
39
39
  var import_toast2 = require("./toast.utils.js");
40
40
  function groupConnect(service, normalize) {
41
- const { context, prop, send, refs, computed } = service;
41
+ const { context, prop, send, refs, computed, scope } = service;
42
42
  return {
43
43
  getCount() {
44
44
  return context.get("toasts").length;
@@ -53,7 +53,7 @@ function groupConnect(service, normalize) {
53
53
  const placement = computed("placement");
54
54
  const [side, align = "center"] = placement.split("-");
55
55
  return normalize.element({
56
- ...import_toast.parts.group.attrs,
56
+ ...import_toast.parts.group.attrs(scope.id),
57
57
  dir: prop("dir"),
58
58
  tabIndex: -1,
59
59
  role: "region",
package/dist/toast-group.connect.mjs CHANGED
@@ -4,7 +4,7 @@ import { parts } from "./toast.anatomy.mjs";
4
4
  import * as dom from "./toast.dom.mjs";
5
5
  import { getGroupPlacementStyle } from "./toast.utils.mjs";
6
6
  function groupConnect(service, normalize) {
7
- const { context, prop, send, refs, computed } = service;
7
+ const { context, prop, send, refs, computed, scope } = service;
8
8
  return {
9
9
  getCount() {
10
10
  return context.get("toasts").length;
@@ -19,7 +19,7 @@ function groupConnect(service, normalize) {
19
19
  const placement = computed("placement");
20
20
  const [side, align = "center"] = placement.split("-");
21
21
  return normalize.element({
22
- ...parts.group.attrs,
22
+ ...parts.group.attrs(scope.id),
23
23
  dir: prop("dir"),
24
24
  tabIndex: -1,
25
25
  role: "region",
package/dist/toast.anatomy.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as _zag_js_anatomy from '@zag-js/anatomy';
2
2
 
3
- declare const anatomy: _zag_js_anatomy.AnatomyInstance<"title" | "description" | "group" | "root" | "actionTrigger" | "closeTrigger">;
4
- declare const parts: Record<"title" | "description" | "group" | "root" | "actionTrigger" | "closeTrigger", _zag_js_anatomy.AnatomyPart>;
3
+ declare const anatomy: _zag_js_anatomy.AnatomyInstance<"group" | "title" | "root" | "description" | "actionTrigger" | "closeTrigger">;
4
+ declare const parts: Record<"group" | "title" | "root" | "description" | "actionTrigger" | "closeTrigger", _zag_js_anatomy.AnatomyPart>;
5
5
 
6
6
  export { anatomy, parts };
package/dist/toast.anatomy.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as _zag_js_anatomy from '@zag-js/anatomy';
2
2
 
3
- declare const anatomy: _zag_js_anatomy.AnatomyInstance<"title" | "description" | "group" | "root" | "actionTrigger" | "closeTrigger">;
4
- declare const parts: Record<"title" | "description" | "group" | "root" | "actionTrigger" | "closeTrigger", _zag_js_anatomy.AnatomyPart>;
3
+ declare const anatomy: _zag_js_anatomy.AnatomyInstance<"group" | "title" | "root" | "description" | "actionTrigger" | "closeTrigger">;
4
+ declare const parts: Record<"group" | "title" | "root" | "description" | "actionTrigger" | "closeTrigger", _zag_js_anatomy.AnatomyPart>;
5
5
 
6
6
  export { anatomy, parts };
package/dist/toast.connect.js CHANGED
@@ -70,9 +70,8 @@ function connect(service, normalize) {
70
70
  },
71
71
  getRootProps() {
72
72
  return normalize.element({
73
- ...import_toast.parts.root.attrs,
73
+ ...import_toast.parts.root.attrs(scope.id),
74
74
  dir: prop("dir"),
75
- id: dom.getRootId(scope),
76
75
  "data-state": visible ? "open" : "closed",
77
76
  "data-type": type,
78
77
  "data-placement": placement,
@@ -115,19 +114,19 @@ function connect(service, normalize) {
115
114
  },
116
115
  getTitleProps() {
117
116
  return normalize.element({
118
- ...import_toast.parts.title.attrs,
117
+ ...import_toast.parts.title.attrs(scope.id),
119
118
  id: dom.getTitleId(scope)
120
119
  });
121
120
  },
122
121
  getDescriptionProps() {
123
122
  return normalize.element({
124
- ...import_toast.parts.description.attrs,
123
+ ...import_toast.parts.description.attrs(scope.id),
125
124
  id: dom.getDescriptionId(scope)
126
125
  });
127
126
  },
128
127
  getActionTriggerProps() {
129
128
  return normalize.button({
130
- ...import_toast.parts.actionTrigger.attrs,
129
+ ...import_toast.parts.actionTrigger.attrs(scope.id),
131
130
  type: "button",
132
131
  onClick(event) {
133
132
  if (event.defaultPrevented) return;
@@ -138,8 +137,7 @@ function connect(service, normalize) {
138
137
  },
139
138
  getCloseTriggerProps() {
140
139
  return normalize.button({
141
- id: dom.getCloseTriggerId(scope),
142
- ...import_toast.parts.closeTrigger.attrs,
140
+ ...import_toast.parts.closeTrigger.attrs(scope.id),
143
141
  type: "button",
144
142
  "aria-label": translations?.closeTriggerLabel,
145
143
  onClick(event) {
package/dist/toast.connect.mjs CHANGED
@@ -36,9 +36,8 @@ function connect(service, normalize) {
36
36
  },
37
37
  getRootProps() {
38
38
  return normalize.element({
39
- ...parts.root.attrs,
39
+ ...parts.root.attrs(scope.id),
40
40
  dir: prop("dir"),
41
- id: dom.getRootId(scope),
42
41
  "data-state": visible ? "open" : "closed",
43
42
  "data-type": type,
44
43
  "data-placement": placement,
@@ -81,19 +80,19 @@ function connect(service, normalize) {
81
80
  },
82
81
  getTitleProps() {
83
82
  return normalize.element({
84
- ...parts.title.attrs,
83
+ ...parts.title.attrs(scope.id),
85
84
  id: dom.getTitleId(scope)
86
85
  });
87
86
  },
88
87
  getDescriptionProps() {
89
88
  return normalize.element({
90
- ...parts.description.attrs,
89
+ ...parts.description.attrs(scope.id),
91
90
  id: dom.getDescriptionId(scope)
92
91
  });
93
92
  },
94
93
  getActionTriggerProps() {
95
94
  return normalize.button({
96
- ...parts.actionTrigger.attrs,
95
+ ...parts.actionTrigger.attrs(scope.id),
97
96
  type: "button",
98
97
  onClick(event) {
99
98
  if (event.defaultPrevented) return;
@@ -104,8 +103,7 @@ function connect(service, normalize) {
104
103
  },
105
104
  getCloseTriggerProps() {
106
105
  return normalize.button({
107
- id: dom.getCloseTriggerId(scope),
108
- ...parts.closeTrigger.attrs,
106
+ ...parts.closeTrigger.attrs(scope.id),
109
107
  type: "button",
110
108
  "aria-label": translations?.closeTriggerLabel,
111
109
  onClick(event) {
package/dist/toast.dom.d.mts CHANGED
@@ -4,11 +4,11 @@ import '@zag-js/types';
4
4
  import '@zag-js/dom-query';
5
5
 
6
6
  declare const getRegionId: (placement: Placement) => string;
7
- declare const getRegionEl: (ctx: Scope, placement: Placement) => HTMLElement | null;
8
7
  declare const getRootId: (ctx: Scope) => string;
9
- declare const getRootEl: (ctx: Scope) => HTMLElement | null;
10
8
  declare const getTitleId: (ctx: Scope) => string;
11
9
  declare const getDescriptionId: (ctx: Scope) => string;
12
10
  declare const getCloseTriggerId: (ctx: Scope) => string;
11
+ declare const getRegionEl: (ctx: Scope, placement: Placement) => HTMLElement | null;
12
+ declare const getRootEl: (ctx: Scope) => HTMLElement | null;
13
13
 
14
14
  export { getCloseTriggerId, getDescriptionId, getRegionEl, getRegionId, getRootEl, getRootId, getTitleId };
package/dist/toast.dom.d.ts CHANGED
@@ -4,11 +4,11 @@ import '@zag-js/types';
4
4
  import '@zag-js/dom-query';
5
5
 
6
6
  declare const getRegionId: (placement: Placement) => string;
7
- declare const getRegionEl: (ctx: Scope, placement: Placement) => HTMLElement | null;
8
7
  declare const getRootId: (ctx: Scope) => string;
9
- declare const getRootEl: (ctx: Scope) => HTMLElement | null;
10
8
  declare const getTitleId: (ctx: Scope) => string;
11
9
  declare const getDescriptionId: (ctx: Scope) => string;
12
10
  declare const getCloseTriggerId: (ctx: Scope) => string;
11
+ declare const getRegionEl: (ctx: Scope, placement: Placement) => HTMLElement | null;
12
+ declare const getRootEl: (ctx: Scope) => HTMLElement | null;
13
13
 
14
14
  export { getCloseTriggerId, getDescriptionId, getRegionEl, getRegionId, getRootEl, getRootId, getTitleId };
package/dist/toast.dom.js CHANGED
@@ -29,13 +29,14 @@ __export(toast_dom_exports, {
29
29
  getTitleId: () => getTitleId
30
30
  });
31
31
  module.exports = __toCommonJS(toast_dom_exports);
32
- var getRegionId = (placement) => `toast-group:${placement}`;
33
- var getRegionEl = (ctx, placement) => ctx.getById(`toast-group:${placement}`);
34
- var getRootId = (ctx) => `toast:${ctx.id}`;
35
- var getRootEl = (ctx) => ctx.getById(getRootId(ctx));
36
- var getTitleId = (ctx) => `toast:${ctx.id}:title`;
37
- var getDescriptionId = (ctx) => `toast:${ctx.id}:description`;
38
- var getCloseTriggerId = (ctx) => `toast${ctx.id}:close`;
32
+ var import_toast = require("./toast.anatomy.js");
33
+ var getRegionId = (placement) => `toast-group-${placement}`;
34
+ var getRootId = (ctx) => `${ctx.id}`;
35
+ var getTitleId = (ctx) => `${ctx.id}:title`;
36
+ var getDescriptionId = (ctx) => `${ctx.id}:description`;
37
+ var getCloseTriggerId = (ctx) => `${ctx.id}:close`;
38
+ var getRegionEl = (ctx, placement) => ctx.getById(`toast-group-${placement}`);
39
+ var getRootEl = (ctx) => ctx.query(ctx.selector(import_toast.parts.root));
39
40
  // Annotate the CommonJS export names for ESM import in node:
40
41
  0 && (module.exports = {
41
42
  getCloseTriggerId,
package/dist/toast.dom.mjs CHANGED
@@ -1,11 +1,12 @@
1
1
  // src/toast.dom.ts
2
- var getRegionId = (placement) => `toast-group:${placement}`;
3
- var getRegionEl = (ctx, placement) => ctx.getById(`toast-group:${placement}`);
4
- var getRootId = (ctx) => `toast:${ctx.id}`;
5
- var getRootEl = (ctx) => ctx.getById(getRootId(ctx));
6
- var getTitleId = (ctx) => `toast:${ctx.id}:title`;
7
- var getDescriptionId = (ctx) => `toast:${ctx.id}:description`;
8
- var getCloseTriggerId = (ctx) => `toast${ctx.id}:close`;
2
+ import { parts } from "./toast.anatomy.mjs";
3
+ var getRegionId = (placement) => `toast-group-${placement}`;
4
+ var getRootId = (ctx) => `${ctx.id}`;
5
+ var getTitleId = (ctx) => `${ctx.id}:title`;
6
+ var getDescriptionId = (ctx) => `${ctx.id}:description`;
7
+ var getCloseTriggerId = (ctx) => `${ctx.id}:close`;
8
+ var getRegionEl = (ctx, placement) => ctx.getById(`toast-group-${placement}`);
9
+ var getRootEl = (ctx) => ctx.query(ctx.selector(parts.root));
9
10
  export {
10
11
  getCloseTriggerId,
11
12
  getDescriptionId,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/toast",
3
- "version": "1.41.0",
3
+ "version": "2.0.0-next.0",
4
4
  "description": "Core logic for the toast widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -26,12 +26,12 @@
26
26
  "url": "https://github.com/chakra-ui/zag/issues"
27
27
  },
28
28
  "dependencies": {
29
- "@zag-js/anatomy": "1.41.0",
30
- "@zag-js/dom-query": "1.41.0",
31
- "@zag-js/dismissable": "1.41.0",
32
- "@zag-js/utils": "1.41.0",
33
- "@zag-js/core": "1.41.0",
34
- "@zag-js/types": "1.41.0"
29
+ "@zag-js/anatomy": "2.0.0-next.0",
30
+ "@zag-js/core": "2.0.0-next.0",
31
+ "@zag-js/dom-query": "2.0.0-next.0",
32
+ "@zag-js/dismissable": "2.0.0-next.0",
33
+ "@zag-js/utils": "2.0.0-next.0",
34
+ "@zag-js/types": "2.0.0-next.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "clean-package": "2.2.0"