@zag-js/steps 1.41.1 → 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.
@@ -90,8 +90,7 @@ function connect(service, normalize) {
90
90
  setStep,
91
91
  getRootProps() {
92
92
  return normalize.element({
93
- ...import_steps.parts.root.attrs,
94
- id: dom.getRootId(scope),
93
+ ...import_steps.parts.root.attrs(scope.id),
95
94
  dir: prop("dir"),
96
95
  "data-orientation": prop("orientation"),
97
96
  style: {
@@ -103,9 +102,8 @@ function connect(service, normalize) {
103
102
  const arr = (0, import_utils.fromLength)(count);
104
103
  const triggerIds = arr.map((_, index) => dom.getTriggerId(scope, index));
105
104
  return normalize.element({
106
- ...import_steps.parts.list.attrs,
105
+ ...import_steps.parts.list.attrs(scope.id),
107
106
  dir: prop("dir"),
108
- id: dom.getListId(scope),
109
107
  role: "tablist",
110
108
  "aria-owns": triggerIds.join(" "),
111
109
  "aria-orientation": prop("orientation"),
@@ -115,7 +113,7 @@ function connect(service, normalize) {
115
113
  getItemProps(props) {
116
114
  const itemState = getItemState(props);
117
115
  return normalize.element({
118
- ...import_steps.parts.item.attrs,
116
+ ...import_steps.parts.item.attrs(scope.id),
119
117
  dir: prop("dir"),
120
118
  "aria-current": itemState.current ? "step" : void 0,
121
119
  "data-orientation": prop("orientation"),
@@ -125,7 +123,7 @@ function connect(service, normalize) {
125
123
  getTriggerProps(props) {
126
124
  const itemState = getItemState(props);
127
125
  return normalize.button({
128
- ...import_steps.parts.trigger.attrs,
126
+ ...import_steps.parts.trigger.attrs(scope.id),
129
127
  id: itemState.triggerId,
130
128
  role: "tab",
131
129
  dir: prop("dir"),
@@ -147,7 +145,7 @@ function connect(service, normalize) {
147
145
  getContentProps(props) {
148
146
  const itemState = getItemState(props);
149
147
  return normalize.element({
150
- ...import_steps.parts.content.attrs,
148
+ ...import_steps.parts.content.attrs(scope.id),
151
149
  dir: prop("dir"),
152
150
  id: itemState.contentId,
153
151
  role: "tabpanel",
@@ -161,7 +159,7 @@ function connect(service, normalize) {
161
159
  getIndicatorProps(props) {
162
160
  const itemState = getItemState(props);
163
161
  return normalize.element({
164
- ...import_steps.parts.indicator.attrs,
162
+ ...import_steps.parts.indicator.attrs(scope.id),
165
163
  dir: prop("dir"),
166
164
  "aria-hidden": true,
167
165
  "data-complete": (0, import_dom_query.dataAttr)(itemState.completed),
@@ -172,7 +170,7 @@ function connect(service, normalize) {
172
170
  getSeparatorProps(props) {
173
171
  const itemState = getItemState(props);
174
172
  return normalize.element({
175
- ...import_steps.parts.separator.attrs,
173
+ ...import_steps.parts.separator.attrs(scope.id),
176
174
  dir: prop("dir"),
177
175
  "data-orientation": prop("orientation"),
178
176
  "data-complete": (0, import_dom_query.dataAttr)(itemState.completed),
@@ -182,7 +180,7 @@ function connect(service, normalize) {
182
180
  },
183
181
  getNextTriggerProps() {
184
182
  return normalize.button({
185
- ...import_steps.parts.nextTrigger.attrs,
183
+ ...import_steps.parts.nextTrigger.attrs(scope.id),
186
184
  dir: prop("dir"),
187
185
  type: "button",
188
186
  disabled: !hasNextStep,
@@ -195,7 +193,7 @@ function connect(service, normalize) {
195
193
  getPrevTriggerProps() {
196
194
  return normalize.button({
197
195
  dir: prop("dir"),
198
- ...import_steps.parts.prevTrigger.attrs,
196
+ ...import_steps.parts.prevTrigger.attrs(scope.id),
199
197
  type: "button",
200
198
  disabled: !hasPrevStep,
201
199
  onClick(event) {
@@ -207,7 +205,7 @@ function connect(service, normalize) {
207
205
  getProgressProps() {
208
206
  return normalize.element({
209
207
  dir: prop("dir"),
210
- ...import_steps.parts.progress.attrs,
208
+ ...import_steps.parts.progress.attrs(scope.id),
211
209
  role: "progressbar",
212
210
  "aria-valuenow": percent,
213
211
  "aria-valuemin": 0,
@@ -56,8 +56,7 @@ function connect(service, normalize) {
56
56
  setStep,
57
57
  getRootProps() {
58
58
  return normalize.element({
59
- ...parts.root.attrs,
60
- id: dom.getRootId(scope),
59
+ ...parts.root.attrs(scope.id),
61
60
  dir: prop("dir"),
62
61
  "data-orientation": prop("orientation"),
63
62
  style: {
@@ -69,9 +68,8 @@ function connect(service, normalize) {
69
68
  const arr = fromLength(count);
70
69
  const triggerIds = arr.map((_, index) => dom.getTriggerId(scope, index));
71
70
  return normalize.element({
72
- ...parts.list.attrs,
71
+ ...parts.list.attrs(scope.id),
73
72
  dir: prop("dir"),
74
- id: dom.getListId(scope),
75
73
  role: "tablist",
76
74
  "aria-owns": triggerIds.join(" "),
77
75
  "aria-orientation": prop("orientation"),
@@ -81,7 +79,7 @@ function connect(service, normalize) {
81
79
  getItemProps(props) {
82
80
  const itemState = getItemState(props);
83
81
  return normalize.element({
84
- ...parts.item.attrs,
82
+ ...parts.item.attrs(scope.id),
85
83
  dir: prop("dir"),
86
84
  "aria-current": itemState.current ? "step" : void 0,
87
85
  "data-orientation": prop("orientation"),
@@ -91,7 +89,7 @@ function connect(service, normalize) {
91
89
  getTriggerProps(props) {
92
90
  const itemState = getItemState(props);
93
91
  return normalize.button({
94
- ...parts.trigger.attrs,
92
+ ...parts.trigger.attrs(scope.id),
95
93
  id: itemState.triggerId,
96
94
  role: "tab",
97
95
  dir: prop("dir"),
@@ -113,7 +111,7 @@ function connect(service, normalize) {
113
111
  getContentProps(props) {
114
112
  const itemState = getItemState(props);
115
113
  return normalize.element({
116
- ...parts.content.attrs,
114
+ ...parts.content.attrs(scope.id),
117
115
  dir: prop("dir"),
118
116
  id: itemState.contentId,
119
117
  role: "tabpanel",
@@ -127,7 +125,7 @@ function connect(service, normalize) {
127
125
  getIndicatorProps(props) {
128
126
  const itemState = getItemState(props);
129
127
  return normalize.element({
130
- ...parts.indicator.attrs,
128
+ ...parts.indicator.attrs(scope.id),
131
129
  dir: prop("dir"),
132
130
  "aria-hidden": true,
133
131
  "data-complete": dataAttr(itemState.completed),
@@ -138,7 +136,7 @@ function connect(service, normalize) {
138
136
  getSeparatorProps(props) {
139
137
  const itemState = getItemState(props);
140
138
  return normalize.element({
141
- ...parts.separator.attrs,
139
+ ...parts.separator.attrs(scope.id),
142
140
  dir: prop("dir"),
143
141
  "data-orientation": prop("orientation"),
144
142
  "data-complete": dataAttr(itemState.completed),
@@ -148,7 +146,7 @@ function connect(service, normalize) {
148
146
  },
149
147
  getNextTriggerProps() {
150
148
  return normalize.button({
151
- ...parts.nextTrigger.attrs,
149
+ ...parts.nextTrigger.attrs(scope.id),
152
150
  dir: prop("dir"),
153
151
  type: "button",
154
152
  disabled: !hasNextStep,
@@ -161,7 +159,7 @@ function connect(service, normalize) {
161
159
  getPrevTriggerProps() {
162
160
  return normalize.button({
163
161
  dir: prop("dir"),
164
- ...parts.prevTrigger.attrs,
162
+ ...parts.prevTrigger.attrs(scope.id),
165
163
  type: "button",
166
164
  disabled: !hasPrevStep,
167
165
  onClick(event) {
@@ -173,7 +171,7 @@ function connect(service, normalize) {
173
171
  getProgressProps() {
174
172
  return normalize.element({
175
173
  dir: prop("dir"),
176
- ...parts.progress.attrs,
174
+ ...parts.progress.attrs(scope.id),
177
175
  role: "progressbar",
178
176
  "aria-valuenow": percent,
179
177
  "aria-valuemin": 0,
package/dist/steps.dom.js CHANGED
@@ -26,10 +26,10 @@ __export(steps_dom_exports, {
26
26
  getTriggerId: () => getTriggerId
27
27
  });
28
28
  module.exports = __toCommonJS(steps_dom_exports);
29
- var getRootId = (ctx) => ctx.ids?.root ?? `steps:${ctx.id}`;
30
- var getListId = (ctx) => ctx.ids?.list ?? `steps:${ctx.id}:list`;
31
- var getTriggerId = (ctx, index) => ctx.ids?.triggerId?.(index) ?? `steps:${ctx.id}:trigger:${index}`;
32
- var getContentId = (ctx, index) => ctx.ids?.contentId?.(index) ?? `steps:${ctx.id}:content:${index}`;
29
+ var getRootId = (ctx) => ctx.ids?.root ?? `${ctx.id}`;
30
+ var getListId = (ctx) => ctx.ids?.list ?? `${ctx.id}:list`;
31
+ var getTriggerId = (ctx, index) => ctx.ids?.triggerId?.(index) ?? `${ctx.id}:trigger:${index}`;
32
+ var getContentId = (ctx, index) => ctx.ids?.contentId?.(index) ?? `${ctx.id}:content:${index}`;
33
33
  // Annotate the CommonJS export names for ESM import in node:
34
34
  0 && (module.exports = {
35
35
  getContentId,
@@ -1,8 +1,8 @@
1
1
  // src/steps.dom.ts
2
- var getRootId = (ctx) => ctx.ids?.root ?? `steps:${ctx.id}`;
3
- var getListId = (ctx) => ctx.ids?.list ?? `steps:${ctx.id}:list`;
4
- var getTriggerId = (ctx, index) => ctx.ids?.triggerId?.(index) ?? `steps:${ctx.id}:trigger:${index}`;
5
- var getContentId = (ctx, index) => ctx.ids?.contentId?.(index) ?? `steps:${ctx.id}:content:${index}`;
2
+ var getRootId = (ctx) => ctx.ids?.root ?? `${ctx.id}`;
3
+ var getListId = (ctx) => ctx.ids?.list ?? `${ctx.id}:list`;
4
+ var getTriggerId = (ctx, index) => ctx.ids?.triggerId?.(index) ?? `${ctx.id}:trigger:${index}`;
5
+ var getContentId = (ctx, index) => ctx.ids?.contentId?.(index) ?? `${ctx.id}:content:${index}`;
6
6
  export {
7
7
  getContentId,
8
8
  getListId,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/steps",
3
- "version": "1.41.1",
3
+ "version": "2.0.0-next.0",
4
4
  "description": "Core logic for the steps widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -27,11 +27,11 @@
27
27
  "url": "https://github.com/chakra-ui/zag/issues"
28
28
  },
29
29
  "dependencies": {
30
- "@zag-js/anatomy": "1.41.1",
31
- "@zag-js/core": "1.41.1",
32
- "@zag-js/dom-query": "1.41.1",
33
- "@zag-js/utils": "1.41.1",
34
- "@zag-js/types": "1.41.1"
30
+ "@zag-js/anatomy": "2.0.0-next.0",
31
+ "@zag-js/core": "2.0.0-next.0",
32
+ "@zag-js/dom-query": "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"