@zag-js/tabs 0.2.2 → 0.2.4

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.d.ts CHANGED
@@ -2,18 +2,866 @@ import { RequiredBy, DirectionProperty, CommonProperties, Context, PropTypes, No
2
2
  import * as _zag_js_core from '@zag-js/core';
3
3
  import { StateMachine } from '@zag-js/core';
4
4
 
5
- declare type IntlTranslations = {
5
+ declare const anatomy: Omit<{
6
+ parts: <U extends string>(...parts: U[]) => Omit<{
7
+ parts: any;
8
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
9
+ parts: any;
10
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
11
+ parts: any;
12
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
13
+ parts: any;
14
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
15
+ parts: any;
16
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
17
+ parts: any;
18
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
19
+ parts: any;
20
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
21
+ parts: any;
22
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
23
+ parts: any;
24
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
25
+ parts: any;
26
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
27
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
28
+ selector: string;
29
+ attrs: Record<"data-scope" | "data-part", string>;
30
+ }>;
31
+ }, "parts">;
32
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
33
+ selector: string;
34
+ attrs: Record<"data-scope" | "data-part", string>;
35
+ }>;
36
+ }, "parts">;
37
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
38
+ selector: string;
39
+ attrs: Record<"data-scope" | "data-part", string>;
40
+ }>;
41
+ }, "parts">;
42
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
43
+ selector: string;
44
+ attrs: Record<"data-scope" | "data-part", string>;
45
+ }>;
46
+ }, "parts">;
47
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
48
+ selector: string;
49
+ attrs: Record<"data-scope" | "data-part", string>;
50
+ }>;
51
+ }, "parts">;
52
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
53
+ selector: string;
54
+ attrs: Record<"data-scope" | "data-part", string>;
55
+ }>;
56
+ }, "parts">;
57
+ build: () => Record<U | V | V_1 | V_2, {
58
+ selector: string;
59
+ attrs: Record<"data-scope" | "data-part", string>;
60
+ }>;
61
+ }, "parts">;
62
+ build: () => Record<U | V | V_1, {
63
+ selector: string;
64
+ attrs: Record<"data-scope" | "data-part", string>;
65
+ }>;
66
+ }, "parts">;
67
+ build: () => Record<U | V, {
68
+ selector: string;
69
+ attrs: Record<"data-scope" | "data-part", string>;
70
+ }>;
71
+ }, "parts">;
72
+ build: () => Record<U, {
73
+ selector: string;
74
+ attrs: Record<"data-scope" | "data-part", string>;
75
+ }>;
76
+ }, "parts">;
77
+ extendWith: <V_10 extends string>(...parts: V_10[]) => Omit<{
78
+ parts: <U extends string>(...parts: U[]) => Omit<{
79
+ parts: any;
80
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
81
+ parts: any;
82
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
83
+ parts: any;
84
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
85
+ parts: any;
86
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
87
+ parts: any;
88
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
89
+ parts: any;
90
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
91
+ parts: any;
92
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
93
+ parts: any;
94
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
95
+ parts: any;
96
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
97
+ parts: any;
98
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
99
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
100
+ selector: string;
101
+ attrs: Record<"data-scope" | "data-part", string>;
102
+ }>;
103
+ }, "parts">;
104
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
105
+ selector: string;
106
+ attrs: Record<"data-scope" | "data-part", string>;
107
+ }>;
108
+ }, "parts">;
109
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
110
+ selector: string;
111
+ attrs: Record<"data-scope" | "data-part", string>;
112
+ }>;
113
+ }, "parts">;
114
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
115
+ selector: string;
116
+ attrs: Record<"data-scope" | "data-part", string>;
117
+ }>;
118
+ }, "parts">;
119
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
120
+ selector: string;
121
+ attrs: Record<"data-scope" | "data-part", string>;
122
+ }>;
123
+ }, "parts">;
124
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
125
+ selector: string;
126
+ attrs: Record<"data-scope" | "data-part", string>;
127
+ }>;
128
+ }, "parts">;
129
+ build: () => Record<U | V | V_1 | V_2, {
130
+ selector: string;
131
+ attrs: Record<"data-scope" | "data-part", string>;
132
+ }>;
133
+ }, "parts">;
134
+ build: () => Record<U | V | V_1, {
135
+ selector: string;
136
+ attrs: Record<"data-scope" | "data-part", string>;
137
+ }>;
138
+ }, "parts">;
139
+ build: () => Record<U | V, {
140
+ selector: string;
141
+ attrs: Record<"data-scope" | "data-part", string>;
142
+ }>;
143
+ }, "parts">;
144
+ build: () => Record<U, {
145
+ selector: string;
146
+ attrs: Record<"data-scope" | "data-part", string>;
147
+ }>;
148
+ }, "parts">;
149
+ extendWith: <V_11 extends string>(...parts: V_11[]) => Omit<{
150
+ parts: <U extends string>(...parts: U[]) => Omit<{
151
+ parts: any;
152
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
153
+ parts: any;
154
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
155
+ parts: any;
156
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
157
+ parts: any;
158
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
159
+ parts: any;
160
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
161
+ parts: any;
162
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
163
+ parts: any;
164
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
165
+ parts: any;
166
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
167
+ parts: any;
168
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
169
+ parts: any;
170
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
171
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
172
+ selector: string;
173
+ attrs: Record<"data-scope" | "data-part", string>;
174
+ }>;
175
+ }, "parts">;
176
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
177
+ selector: string;
178
+ attrs: Record<"data-scope" | "data-part", string>;
179
+ }>;
180
+ }, "parts">;
181
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
182
+ selector: string;
183
+ attrs: Record<"data-scope" | "data-part", string>;
184
+ }>;
185
+ }, "parts">;
186
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
187
+ selector: string;
188
+ attrs: Record<"data-scope" | "data-part", string>;
189
+ }>;
190
+ }, "parts">;
191
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
192
+ selector: string;
193
+ attrs: Record<"data-scope" | "data-part", string>;
194
+ }>;
195
+ }, "parts">;
196
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
197
+ selector: string;
198
+ attrs: Record<"data-scope" | "data-part", string>;
199
+ }>;
200
+ }, "parts">;
201
+ build: () => Record<U | V | V_1 | V_2, {
202
+ selector: string;
203
+ attrs: Record<"data-scope" | "data-part", string>;
204
+ }>;
205
+ }, "parts">;
206
+ build: () => Record<U | V | V_1, {
207
+ selector: string;
208
+ attrs: Record<"data-scope" | "data-part", string>;
209
+ }>;
210
+ }, "parts">;
211
+ build: () => Record<U | V, {
212
+ selector: string;
213
+ attrs: Record<"data-scope" | "data-part", string>;
214
+ }>;
215
+ }, "parts">;
216
+ build: () => Record<U, {
217
+ selector: string;
218
+ attrs: Record<"data-scope" | "data-part", string>;
219
+ }>;
220
+ }, "parts">;
221
+ extendWith: <V_12 extends string>(...parts: V_12[]) => Omit<{
222
+ parts: <U extends string>(...parts: U[]) => Omit<{
223
+ parts: any;
224
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
225
+ parts: any;
226
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
227
+ parts: any;
228
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
229
+ parts: any;
230
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
231
+ parts: any;
232
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
233
+ parts: any;
234
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
235
+ parts: any;
236
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
237
+ parts: any;
238
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
239
+ parts: any;
240
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
241
+ parts: any;
242
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
243
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
244
+ selector: string;
245
+ attrs: Record<"data-scope" | "data-part", string>;
246
+ }>;
247
+ }, "parts">;
248
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
249
+ selector: string;
250
+ attrs: Record<"data-scope" | "data-part", string>;
251
+ }>;
252
+ }, "parts">;
253
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
254
+ selector: string;
255
+ attrs: Record<"data-scope" | "data-part", string>;
256
+ }>;
257
+ }, "parts">;
258
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
259
+ selector: string;
260
+ attrs: Record<"data-scope" | "data-part", string>;
261
+ }>;
262
+ }, "parts">;
263
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
264
+ selector: string;
265
+ attrs: Record<"data-scope" | "data-part", string>;
266
+ }>;
267
+ }, "parts">;
268
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
269
+ selector: string;
270
+ attrs: Record<"data-scope" | "data-part", string>;
271
+ }>;
272
+ }, "parts">;
273
+ build: () => Record<U | V | V_1 | V_2, {
274
+ selector: string;
275
+ attrs: Record<"data-scope" | "data-part", string>;
276
+ }>;
277
+ }, "parts">;
278
+ build: () => Record<U | V | V_1, {
279
+ selector: string;
280
+ attrs: Record<"data-scope" | "data-part", string>;
281
+ }>;
282
+ }, "parts">;
283
+ build: () => Record<U | V, {
284
+ selector: string;
285
+ attrs: Record<"data-scope" | "data-part", string>;
286
+ }>;
287
+ }, "parts">;
288
+ build: () => Record<U, {
289
+ selector: string;
290
+ attrs: Record<"data-scope" | "data-part", string>;
291
+ }>;
292
+ }, "parts">;
293
+ extendWith: <V_13 extends string>(...parts: V_13[]) => Omit<{
294
+ parts: <U extends string>(...parts: U[]) => Omit<{
295
+ parts: any;
296
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
297
+ parts: any;
298
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
299
+ parts: any;
300
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
301
+ parts: any;
302
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
303
+ parts: any;
304
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
305
+ parts: any;
306
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
307
+ parts: any;
308
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
309
+ parts: any;
310
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
311
+ parts: any;
312
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
313
+ parts: any;
314
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
315
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
316
+ selector: string;
317
+ attrs: Record<"data-scope" | "data-part", string>;
318
+ }>;
319
+ }, "parts">;
320
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
321
+ selector: string;
322
+ attrs: Record<"data-scope" | "data-part", string>;
323
+ }>;
324
+ }, "parts">;
325
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
326
+ selector: string;
327
+ attrs: Record<"data-scope" | "data-part", string>;
328
+ }>;
329
+ }, "parts">;
330
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
331
+ selector: string;
332
+ attrs: Record<"data-scope" | "data-part", string>;
333
+ }>;
334
+ }, "parts">;
335
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
336
+ selector: string;
337
+ attrs: Record<"data-scope" | "data-part", string>;
338
+ }>;
339
+ }, "parts">;
340
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
341
+ selector: string;
342
+ attrs: Record<"data-scope" | "data-part", string>;
343
+ }>;
344
+ }, "parts">;
345
+ build: () => Record<U | V | V_1 | V_2, {
346
+ selector: string;
347
+ attrs: Record<"data-scope" | "data-part", string>;
348
+ }>;
349
+ }, "parts">;
350
+ build: () => Record<U | V | V_1, {
351
+ selector: string;
352
+ attrs: Record<"data-scope" | "data-part", string>;
353
+ }>;
354
+ }, "parts">;
355
+ build: () => Record<U | V, {
356
+ selector: string;
357
+ attrs: Record<"data-scope" | "data-part", string>;
358
+ }>;
359
+ }, "parts">;
360
+ build: () => Record<U, {
361
+ selector: string;
362
+ attrs: Record<"data-scope" | "data-part", string>;
363
+ }>;
364
+ }, "parts">;
365
+ extendWith: <V_14 extends string>(...parts: V_14[]) => Omit<{
366
+ parts: <U extends string>(...parts: U[]) => Omit<{
367
+ parts: any;
368
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
369
+ parts: any;
370
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
371
+ parts: any;
372
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
373
+ parts: any;
374
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
375
+ parts: any;
376
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
377
+ parts: any;
378
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
379
+ parts: any;
380
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
381
+ parts: any;
382
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
383
+ parts: any;
384
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
385
+ parts: any;
386
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
387
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
388
+ selector: string;
389
+ attrs: Record<"data-scope" | "data-part", string>;
390
+ }>;
391
+ }, "parts">;
392
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
393
+ selector: string;
394
+ attrs: Record<"data-scope" | "data-part", string>;
395
+ }>;
396
+ }, "parts">;
397
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
398
+ selector: string;
399
+ attrs: Record<"data-scope" | "data-part", string>;
400
+ }>;
401
+ }, "parts">;
402
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
403
+ selector: string;
404
+ attrs: Record<"data-scope" | "data-part", string>;
405
+ }>;
406
+ }, "parts">;
407
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
408
+ selector: string;
409
+ attrs: Record<"data-scope" | "data-part", string>;
410
+ }>;
411
+ }, "parts">;
412
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
413
+ selector: string;
414
+ attrs: Record<"data-scope" | "data-part", string>;
415
+ }>;
416
+ }, "parts">;
417
+ build: () => Record<U | V | V_1 | V_2, {
418
+ selector: string;
419
+ attrs: Record<"data-scope" | "data-part", string>;
420
+ }>;
421
+ }, "parts">;
422
+ build: () => Record<U | V | V_1, {
423
+ selector: string;
424
+ attrs: Record<"data-scope" | "data-part", string>;
425
+ }>;
426
+ }, "parts">;
427
+ build: () => Record<U | V, {
428
+ selector: string;
429
+ attrs: Record<"data-scope" | "data-part", string>;
430
+ }>;
431
+ }, "parts">;
432
+ build: () => Record<U, {
433
+ selector: string;
434
+ attrs: Record<"data-scope" | "data-part", string>;
435
+ }>;
436
+ }, "parts">;
437
+ extendWith: <V_15 extends string>(...parts: V_15[]) => Omit<{
438
+ parts: <U extends string>(...parts: U[]) => Omit<{
439
+ parts: any;
440
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
441
+ parts: any;
442
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
443
+ parts: any;
444
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
445
+ parts: any;
446
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
447
+ parts: any;
448
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
449
+ parts: any;
450
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
451
+ parts: any;
452
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
453
+ parts: any;
454
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
455
+ parts: any;
456
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
457
+ parts: any;
458
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
459
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
460
+ selector: string;
461
+ attrs: Record<"data-scope" | "data-part", string>;
462
+ }>;
463
+ }, "parts">;
464
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
465
+ selector: string;
466
+ attrs: Record<"data-scope" | "data-part", string>;
467
+ }>;
468
+ }, "parts">;
469
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
470
+ selector: string;
471
+ attrs: Record<"data-scope" | "data-part", string>;
472
+ }>;
473
+ }, "parts">;
474
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
475
+ selector: string;
476
+ attrs: Record<"data-scope" | "data-part", string>;
477
+ }>;
478
+ }, "parts">;
479
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
480
+ selector: string;
481
+ attrs: Record<"data-scope" | "data-part", string>;
482
+ }>;
483
+ }, "parts">;
484
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
485
+ selector: string;
486
+ attrs: Record<"data-scope" | "data-part", string>;
487
+ }>;
488
+ }, "parts">;
489
+ build: () => Record<U | V | V_1 | V_2, {
490
+ selector: string;
491
+ attrs: Record<"data-scope" | "data-part", string>;
492
+ }>;
493
+ }, "parts">;
494
+ build: () => Record<U | V | V_1, {
495
+ selector: string;
496
+ attrs: Record<"data-scope" | "data-part", string>;
497
+ }>;
498
+ }, "parts">;
499
+ build: () => Record<U | V, {
500
+ selector: string;
501
+ attrs: Record<"data-scope" | "data-part", string>;
502
+ }>;
503
+ }, "parts">;
504
+ build: () => Record<U, {
505
+ selector: string;
506
+ attrs: Record<"data-scope" | "data-part", string>;
507
+ }>;
508
+ }, "parts">;
509
+ extendWith: <V_16 extends string>(...parts: V_16[]) => Omit<{
510
+ parts: <U extends string>(...parts: U[]) => Omit<{
511
+ parts: any;
512
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
513
+ parts: any;
514
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
515
+ parts: any;
516
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
517
+ parts: any;
518
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
519
+ parts: any;
520
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
521
+ parts: any;
522
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
523
+ parts: any;
524
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
525
+ parts: any;
526
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
527
+ parts: any;
528
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
529
+ parts: any;
530
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
531
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
532
+ selector: string;
533
+ attrs: Record<"data-scope" | "data-part", string>;
534
+ }>;
535
+ }, "parts">;
536
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
537
+ selector: string;
538
+ attrs: Record<"data-scope" | "data-part", string>;
539
+ }>;
540
+ }, "parts">;
541
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
542
+ selector: string;
543
+ attrs: Record<"data-scope" | "data-part", string>;
544
+ }>;
545
+ }, "parts">;
546
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
547
+ selector: string;
548
+ attrs: Record<"data-scope" | "data-part", string>;
549
+ }>;
550
+ }, "parts">;
551
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
552
+ selector: string;
553
+ attrs: Record<"data-scope" | "data-part", string>;
554
+ }>;
555
+ }, "parts">;
556
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
557
+ selector: string;
558
+ attrs: Record<"data-scope" | "data-part", string>;
559
+ }>;
560
+ }, "parts">;
561
+ build: () => Record<U | V | V_1 | V_2, {
562
+ selector: string;
563
+ attrs: Record<"data-scope" | "data-part", string>;
564
+ }>;
565
+ }, "parts">;
566
+ build: () => Record<U | V | V_1, {
567
+ selector: string;
568
+ attrs: Record<"data-scope" | "data-part", string>;
569
+ }>;
570
+ }, "parts">;
571
+ build: () => Record<U | V, {
572
+ selector: string;
573
+ attrs: Record<"data-scope" | "data-part", string>;
574
+ }>;
575
+ }, "parts">;
576
+ build: () => Record<U, {
577
+ selector: string;
578
+ attrs: Record<"data-scope" | "data-part", string>;
579
+ }>;
580
+ }, "parts">;
581
+ extendWith: <V_17 extends string>(...parts: V_17[]) => Omit<{
582
+ parts: <U extends string>(...parts: U[]) => Omit<{
583
+ parts: any;
584
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
585
+ parts: any;
586
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
587
+ parts: any;
588
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
589
+ parts: any;
590
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
591
+ parts: any;
592
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
593
+ parts: any;
594
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
595
+ parts: any;
596
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
597
+ parts: any;
598
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
599
+ parts: any;
600
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
601
+ parts: any;
602
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
603
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
604
+ selector: string;
605
+ attrs: Record<"data-scope" | "data-part", string>;
606
+ }>;
607
+ }, "parts">;
608
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
609
+ selector: string;
610
+ attrs: Record<"data-scope" | "data-part", string>;
611
+ }>;
612
+ }, "parts">;
613
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
614
+ selector: string;
615
+ attrs: Record<"data-scope" | "data-part", string>;
616
+ }>;
617
+ }, "parts">;
618
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
619
+ selector: string;
620
+ attrs: Record<"data-scope" | "data-part", string>;
621
+ }>;
622
+ }, "parts">;
623
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
624
+ selector: string;
625
+ attrs: Record<"data-scope" | "data-part", string>;
626
+ }>;
627
+ }, "parts">;
628
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
629
+ selector: string;
630
+ attrs: Record<"data-scope" | "data-part", string>;
631
+ }>;
632
+ }, "parts">;
633
+ build: () => Record<U | V | V_1 | V_2, {
634
+ selector: string;
635
+ attrs: Record<"data-scope" | "data-part", string>;
636
+ }>;
637
+ }, "parts">;
638
+ build: () => Record<U | V | V_1, {
639
+ selector: string;
640
+ attrs: Record<"data-scope" | "data-part", string>;
641
+ }>;
642
+ }, "parts">;
643
+ build: () => Record<U | V, {
644
+ selector: string;
645
+ attrs: Record<"data-scope" | "data-part", string>;
646
+ }>;
647
+ }, "parts">;
648
+ build: () => Record<U, {
649
+ selector: string;
650
+ attrs: Record<"data-scope" | "data-part", string>;
651
+ }>;
652
+ }, "parts">;
653
+ extendWith: <V_18 extends string>(...parts: V_18[]) => Omit<{
654
+ parts: <U extends string>(...parts: U[]) => Omit<{
655
+ parts: any;
656
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
657
+ parts: any;
658
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
659
+ parts: any;
660
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
661
+ parts: any;
662
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
663
+ parts: any;
664
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
665
+ parts: any;
666
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
667
+ parts: any;
668
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
669
+ parts: any;
670
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
671
+ parts: any;
672
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
673
+ parts: any;
674
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
675
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
676
+ selector: string;
677
+ attrs: Record<"data-scope" | "data-part", string>;
678
+ }>;
679
+ }, "parts">;
680
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
681
+ selector: string;
682
+ attrs: Record<"data-scope" | "data-part", string>;
683
+ }>;
684
+ }, "parts">;
685
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
686
+ selector: string;
687
+ attrs: Record<"data-scope" | "data-part", string>;
688
+ }>;
689
+ }, "parts">;
690
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
691
+ selector: string;
692
+ attrs: Record<"data-scope" | "data-part", string>;
693
+ }>;
694
+ }, "parts">;
695
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
696
+ selector: string;
697
+ attrs: Record<"data-scope" | "data-part", string>;
698
+ }>;
699
+ }, "parts">;
700
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
701
+ selector: string;
702
+ attrs: Record<"data-scope" | "data-part", string>;
703
+ }>;
704
+ }, "parts">;
705
+ build: () => Record<U | V | V_1 | V_2, {
706
+ selector: string;
707
+ attrs: Record<"data-scope" | "data-part", string>;
708
+ }>;
709
+ }, "parts">;
710
+ build: () => Record<U | V | V_1, {
711
+ selector: string;
712
+ attrs: Record<"data-scope" | "data-part", string>;
713
+ }>;
714
+ }, "parts">;
715
+ build: () => Record<U | V, {
716
+ selector: string;
717
+ attrs: Record<"data-scope" | "data-part", string>;
718
+ }>;
719
+ }, "parts">;
720
+ build: () => Record<U, {
721
+ selector: string;
722
+ attrs: Record<"data-scope" | "data-part", string>;
723
+ }>;
724
+ }, "parts">;
725
+ extendWith: <V_19 extends string>(...parts: V_19[]) => Omit<{
726
+ parts: <U extends string>(...parts: U[]) => Omit<{
727
+ parts: any;
728
+ extendWith: <V extends string>(...parts: V[]) => Omit<{
729
+ parts: any;
730
+ extendWith: <V_1 extends string>(...parts: V_1[]) => Omit<{
731
+ parts: any;
732
+ extendWith: <V_2 extends string>(...parts: V_2[]) => Omit<{
733
+ parts: any;
734
+ extendWith: <V_3 extends string>(...parts: V_3[]) => Omit<{
735
+ parts: any;
736
+ extendWith: <V_4 extends string>(...parts: V_4[]) => Omit<{
737
+ parts: any;
738
+ extendWith: <V_5 extends string>(...parts: V_5[]) => Omit<{
739
+ parts: any;
740
+ extendWith: <V_6 extends string>(...parts: V_6[]) => Omit<{
741
+ parts: any;
742
+ extendWith: <V_7 extends string>(...parts: V_7[]) => Omit<{
743
+ parts: any;
744
+ extendWith: <V_8 extends string>(...parts: V_8[]) => Omit<{
745
+ parts: any;
746
+ extendWith: <V_9 extends string>(...parts: V_9[]) => Omit<any, "parts">;
747
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7 | V_8, {
748
+ selector: string;
749
+ attrs: Record<"data-scope" | "data-part", string>;
750
+ }>;
751
+ }, "parts">;
752
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6 | V_7, {
753
+ selector: string;
754
+ attrs: Record<"data-scope" | "data-part", string>;
755
+ }>;
756
+ }, "parts">;
757
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5 | V_6, {
758
+ selector: string;
759
+ attrs: Record<"data-scope" | "data-part", string>;
760
+ }>;
761
+ }, "parts">;
762
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4 | V_5, {
763
+ selector: string;
764
+ attrs: Record<"data-scope" | "data-part", string>;
765
+ }>;
766
+ }, "parts">;
767
+ build: () => Record<U | V | V_1 | V_2 | V_3 | V_4, {
768
+ selector: string;
769
+ attrs: Record<"data-scope" | "data-part", string>;
770
+ }>;
771
+ }, "parts">;
772
+ build: () => Record<U | V | V_1 | V_2 | V_3, {
773
+ selector: string;
774
+ attrs: Record<"data-scope" | "data-part", string>;
775
+ }>;
776
+ }, "parts">;
777
+ build: () => Record<U | V | V_1 | V_2, {
778
+ selector: string;
779
+ attrs: Record<"data-scope" | "data-part", string>;
780
+ }>;
781
+ }, "parts">;
782
+ build: () => Record<U | V | V_1, {
783
+ selector: string;
784
+ attrs: Record<"data-scope" | "data-part", string>;
785
+ }>;
786
+ }, "parts">;
787
+ build: () => Record<U | V, {
788
+ selector: string;
789
+ attrs: Record<"data-scope" | "data-part", string>;
790
+ }>;
791
+ }, "parts">;
792
+ build: () => Record<U, {
793
+ selector: string;
794
+ attrs: Record<"data-scope" | "data-part", string>;
795
+ }>;
796
+ }, "parts">;
797
+ extendWith: <V_20 extends string>(...parts: V_20[]) => Omit<any, "parts">;
798
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13 | V_14 | V_15 | V_16 | V_17 | V_18 | V_19, {
799
+ selector: string;
800
+ attrs: Record<"data-scope" | "data-part", string>;
801
+ }>;
802
+ }, "parts">;
803
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13 | V_14 | V_15 | V_16 | V_17 | V_18, {
804
+ selector: string;
805
+ attrs: Record<"data-scope" | "data-part", string>;
806
+ }>;
807
+ }, "parts">;
808
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13 | V_14 | V_15 | V_16 | V_17, {
809
+ selector: string;
810
+ attrs: Record<"data-scope" | "data-part", string>;
811
+ }>;
812
+ }, "parts">;
813
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13 | V_14 | V_15 | V_16, {
814
+ selector: string;
815
+ attrs: Record<"data-scope" | "data-part", string>;
816
+ }>;
817
+ }, "parts">;
818
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13 | V_14 | V_15, {
819
+ selector: string;
820
+ attrs: Record<"data-scope" | "data-part", string>;
821
+ }>;
822
+ }, "parts">;
823
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13 | V_14, {
824
+ selector: string;
825
+ attrs: Record<"data-scope" | "data-part", string>;
826
+ }>;
827
+ }, "parts">;
828
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12 | V_13, {
829
+ selector: string;
830
+ attrs: Record<"data-scope" | "data-part", string>;
831
+ }>;
832
+ }, "parts">;
833
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11 | V_12, {
834
+ selector: string;
835
+ attrs: Record<"data-scope" | "data-part", string>;
836
+ }>;
837
+ }, "parts">;
838
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10 | V_11, {
839
+ selector: string;
840
+ attrs: Record<"data-scope" | "data-part", string>;
841
+ }>;
842
+ }, "parts">;
843
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator" | V_10, {
844
+ selector: string;
845
+ attrs: Record<"data-scope" | "data-part", string>;
846
+ }>;
847
+ }, "parts">;
848
+ build: () => Record<"root" | "tablist" | "trigger" | "contentGroup" | "content" | "indicator", {
849
+ selector: string;
850
+ attrs: Record<"data-scope" | "data-part", string>;
851
+ }>;
852
+ }, "parts">;
853
+
854
+ type IntlTranslations = {
6
855
  tablistLabel?: string;
7
- deleteLabel?(value: string): string;
8
856
  };
9
- declare type ElementIds = Partial<{
857
+ type ElementIds = Partial<{
10
858
  root: string;
11
859
  trigger: string;
12
- triggerGroup: string;
860
+ tablist: string;
13
861
  contentGroup: string;
14
862
  content: string;
15
863
  }>;
16
- declare type PublicContext = DirectionProperty & CommonProperties & {
864
+ type PublicContext = DirectionProperty & CommonProperties & {
17
865
  /**
18
866
  * The ids of the elements in the tabs. Useful for composition.
19
867
  */
@@ -69,8 +917,8 @@ declare type PublicContext = DirectionProperty & CommonProperties & {
69
917
  value: string;
70
918
  }) => void;
71
919
  };
72
- declare type UserDefinedContext = RequiredBy<PublicContext, "id">;
73
- declare type ComputedContext = Readonly<{
920
+ type UserDefinedContext = RequiredBy<PublicContext, "id">;
921
+ type ComputedContext = Readonly<{
74
922
  /**
75
923
  * @computed
76
924
  * Whether the tab is in the horizontal orientation
@@ -82,14 +930,14 @@ declare type ComputedContext = Readonly<{
82
930
  */
83
931
  isVertical: boolean;
84
932
  }>;
85
- declare type PrivateContext = Context<{}>;
86
- declare type MachineContext = PublicContext & ComputedContext & PrivateContext;
87
- declare type MachineState = {
933
+ type PrivateContext = Context<{}>;
934
+ type MachineContext = PublicContext & ComputedContext & PrivateContext;
935
+ type MachineState = {
88
936
  value: "unknown" | "idle" | "focused";
89
937
  };
90
- declare type State = StateMachine.State<MachineContext, MachineState>;
91
- declare type Send = StateMachine.Send<StateMachine.AnyEventObject>;
92
- declare type TabProps = {
938
+ type State = StateMachine.State<MachineContext, MachineState>;
939
+ type Send = StateMachine.Send<StateMachine.AnyEventObject>;
940
+ type TabProps = {
93
941
  value: string;
94
942
  disabled?: boolean;
95
943
  };
@@ -101,16 +949,15 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
101
949
  setValue(value: string): void;
102
950
  clearValue(): void;
103
951
  rootProps: T["element"];
104
- triggerGroupProps: T["element"];
952
+ tablistProps: T["element"];
105
953
  getTriggerProps(props: TabProps): T["button"];
106
954
  contentGroupProps: T["element"];
107
955
  getContentProps({ value }: {
108
956
  value: string;
109
957
  }): T["element"];
110
- getDeleteButtonProps({ value, disabled }: TabProps): T["button"];
111
958
  indicatorProps: T["element"];
112
959
  };
113
960
 
114
961
  declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
115
962
 
116
- export { UserDefinedContext as Context, connect, machine };
963
+ export { UserDefinedContext as Context, anatomy, connect, machine };
package/dist/index.js CHANGED
@@ -20,11 +20,17 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
20
20
  // src/index.ts
21
21
  var src_exports = {};
22
22
  __export(src_exports, {
23
+ anatomy: () => anatomy,
23
24
  connect: () => connect,
24
25
  machine: () => machine
25
26
  });
26
27
  module.exports = __toCommonJS(src_exports);
27
28
 
29
+ // src/tabs.anatomy.ts
30
+ var import_anatomy = require("@zag-js/anatomy");
31
+ var anatomy = (0, import_anatomy.createAnatomy)("tabs").parts("root", "tablist", "trigger", "contentGroup", "content", "indicator");
32
+ var parts = anatomy.build();
33
+
28
34
  // ../../utilities/dom/dist/index.mjs
29
35
  var dataAttr = (guard) => {
30
36
  return guard ? "" : void 0;
@@ -210,9 +216,9 @@ var dom = defineDomHelpers({
210
216
  var _a, _b;
211
217
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `tabs:${ctx.id}`;
212
218
  },
213
- getTriggerGroupId: (ctx) => {
219
+ getTablistId: (ctx) => {
214
220
  var _a, _b;
215
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.triggerGroup) != null ? _b : `tabs:${ctx.id}:trigger-group`;
221
+ return (_b = (_a = ctx.ids) == null ? void 0 : _a.tablist) != null ? _b : `tabs:${ctx.id}:list`;
216
222
  },
217
223
  getContentId: (ctx, id) => {
218
224
  var _a, _b;
@@ -227,14 +233,14 @@ var dom = defineDomHelpers({
227
233
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `tabs:${ctx.id}:trigger-${id}`;
228
234
  },
229
235
  getIndicatorId: (ctx) => `tabs:${ctx.id}:indicator`,
230
- getTriggerGroupEl: (ctx) => dom.getById(ctx, dom.getTriggerGroupId(ctx)),
236
+ getTablistEl: (ctx) => dom.getById(ctx, dom.getTablistId(ctx)),
231
237
  getContentEl: (ctx, id) => dom.getById(ctx, dom.getContentId(ctx, id)),
232
238
  getTriggerEl: (ctx, id) => dom.getById(ctx, dom.getTriggerId(ctx, id)),
233
239
  getIndicatorEl: (ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),
234
240
  getElements: (ctx) => {
235
- const ownerId = CSS.escape(dom.getTriggerGroupId(ctx));
241
+ const ownerId = CSS.escape(dom.getTablistId(ctx));
236
242
  const selector = `[role=tab][data-ownedby='${ownerId}']:not([disabled])`;
237
- return queryAll(dom.getTriggerGroupEl(ctx), selector);
243
+ return queryAll(dom.getTablistEl(ctx), selector);
238
244
  },
239
245
  getFirstEl: (ctx) => first(dom.getElements(ctx)),
240
246
  getLastEl: (ctx) => last(dom.getElements(ctx)),
@@ -283,15 +289,15 @@ function connect(state, send, normalize) {
283
289
  send({ type: "CLEAR_VALUE" });
284
290
  },
285
291
  rootProps: normalize.element({
286
- "data-part": "root",
292
+ ...parts.root.attrs,
287
293
  id: dom.getRootId(state.context),
288
294
  "data-orientation": state.context.orientation,
289
295
  "data-focus": dataAttr(isFocused),
290
296
  dir: state.context.dir
291
297
  }),
292
- triggerGroupProps: normalize.element({
293
- "data-part": "trigger-group",
294
- id: dom.getTriggerGroupId(state.context),
298
+ tablistProps: normalize.element({
299
+ ...parts.tablist.attrs,
300
+ id: dom.getTablistId(state.context),
295
301
  role: "tablist",
296
302
  "data-focus": dataAttr(isFocused),
297
303
  "aria-orientation": state.context.orientation,
@@ -333,7 +339,7 @@ function connect(state, send, normalize) {
333
339
  const { value, disabled } = props;
334
340
  const selected = state.context.value === value;
335
341
  return normalize.button({
336
- "data-part": "trigger",
342
+ ...parts.trigger.attrs,
337
343
  role: "tab",
338
344
  type: "button",
339
345
  disabled,
@@ -344,7 +350,7 @@ function connect(state, send, normalize) {
344
350
  "aria-selected": selected,
345
351
  "data-selected": dataAttr(selected),
346
352
  "aria-controls": dom.getContentId(state.context, value),
347
- "data-ownedby": dom.getTriggerGroupId(state.context),
353
+ "data-ownedby": dom.getTablistId(state.context),
348
354
  id: dom.getTriggerId(state.context, value),
349
355
  tabIndex: selected ? 0 : -1,
350
356
  onFocus() {
@@ -367,38 +373,25 @@ function connect(state, send, normalize) {
367
373
  });
368
374
  },
369
375
  contentGroupProps: normalize.element({
370
- "data-part": "content-group",
376
+ ...parts.contentGroup.attrs,
371
377
  id: dom.getContentGroupId(state.context),
372
378
  "data-orientation": state.context.orientation
373
379
  }),
374
380
  getContentProps({ value }) {
375
381
  const selected = state.context.value === value;
376
382
  return normalize.element({
377
- "data-part": "content",
383
+ ...parts.content.attrs,
378
384
  id: dom.getContentId(state.context, value),
379
385
  tabIndex: 0,
380
386
  "aria-labelledby": dom.getTriggerId(state.context, value),
381
387
  role: "tabpanel",
382
- "data-ownedby": dom.getTriggerGroupId(state.context),
388
+ "data-ownedby": dom.getTablistId(state.context),
383
389
  hidden: !selected
384
390
  });
385
391
  },
386
- getDeleteButtonProps({ value, disabled }) {
387
- var _a;
388
- return normalize.button({
389
- "data-part": "delete-button",
390
- type: "button",
391
- tabIndex: -1,
392
- "aria-label": (_a = translations.deleteLabel) == null ? void 0 : _a.call(translations, value),
393
- disabled,
394
- onClick() {
395
- send({ type: "DELETE", value });
396
- }
397
- });
398
- },
399
392
  indicatorProps: normalize.element({
400
393
  id: dom.getIndicatorId(state.context),
401
- "data-part": "indicator",
394
+ ...parts.indicator.attrs,
402
395
  "data-orientation": state.context.orientation,
403
396
  style: {
404
397
  "--transition-duration": "200ms",
@@ -629,6 +622,7 @@ function pushUnique(arr, value) {
629
622
  }
630
623
  // Annotate the CommonJS export names for ESM import in node:
631
624
  0 && (module.exports = {
625
+ anatomy,
632
626
  connect,
633
627
  machine
634
628
  });
package/dist/index.mjs CHANGED
@@ -1,3 +1,8 @@
1
+ // src/tabs.anatomy.ts
2
+ import { createAnatomy } from "@zag-js/anatomy";
3
+ var anatomy = createAnatomy("tabs").parts("root", "tablist", "trigger", "contentGroup", "content", "indicator");
4
+ var parts = anatomy.build();
5
+
1
6
  // ../../utilities/dom/dist/index.mjs
2
7
  var dataAttr = (guard) => {
3
8
  return guard ? "" : void 0;
@@ -183,9 +188,9 @@ var dom = defineDomHelpers({
183
188
  var _a, _b;
184
189
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `tabs:${ctx.id}`;
185
190
  },
186
- getTriggerGroupId: (ctx) => {
191
+ getTablistId: (ctx) => {
187
192
  var _a, _b;
188
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.triggerGroup) != null ? _b : `tabs:${ctx.id}:trigger-group`;
193
+ return (_b = (_a = ctx.ids) == null ? void 0 : _a.tablist) != null ? _b : `tabs:${ctx.id}:list`;
189
194
  },
190
195
  getContentId: (ctx, id) => {
191
196
  var _a, _b;
@@ -200,14 +205,14 @@ var dom = defineDomHelpers({
200
205
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `tabs:${ctx.id}:trigger-${id}`;
201
206
  },
202
207
  getIndicatorId: (ctx) => `tabs:${ctx.id}:indicator`,
203
- getTriggerGroupEl: (ctx) => dom.getById(ctx, dom.getTriggerGroupId(ctx)),
208
+ getTablistEl: (ctx) => dom.getById(ctx, dom.getTablistId(ctx)),
204
209
  getContentEl: (ctx, id) => dom.getById(ctx, dom.getContentId(ctx, id)),
205
210
  getTriggerEl: (ctx, id) => dom.getById(ctx, dom.getTriggerId(ctx, id)),
206
211
  getIndicatorEl: (ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),
207
212
  getElements: (ctx) => {
208
- const ownerId = CSS.escape(dom.getTriggerGroupId(ctx));
213
+ const ownerId = CSS.escape(dom.getTablistId(ctx));
209
214
  const selector = `[role=tab][data-ownedby='${ownerId}']:not([disabled])`;
210
- return queryAll(dom.getTriggerGroupEl(ctx), selector);
215
+ return queryAll(dom.getTablistEl(ctx), selector);
211
216
  },
212
217
  getFirstEl: (ctx) => first(dom.getElements(ctx)),
213
218
  getLastEl: (ctx) => last(dom.getElements(ctx)),
@@ -256,15 +261,15 @@ function connect(state, send, normalize) {
256
261
  send({ type: "CLEAR_VALUE" });
257
262
  },
258
263
  rootProps: normalize.element({
259
- "data-part": "root",
264
+ ...parts.root.attrs,
260
265
  id: dom.getRootId(state.context),
261
266
  "data-orientation": state.context.orientation,
262
267
  "data-focus": dataAttr(isFocused),
263
268
  dir: state.context.dir
264
269
  }),
265
- triggerGroupProps: normalize.element({
266
- "data-part": "trigger-group",
267
- id: dom.getTriggerGroupId(state.context),
270
+ tablistProps: normalize.element({
271
+ ...parts.tablist.attrs,
272
+ id: dom.getTablistId(state.context),
268
273
  role: "tablist",
269
274
  "data-focus": dataAttr(isFocused),
270
275
  "aria-orientation": state.context.orientation,
@@ -306,7 +311,7 @@ function connect(state, send, normalize) {
306
311
  const { value, disabled } = props;
307
312
  const selected = state.context.value === value;
308
313
  return normalize.button({
309
- "data-part": "trigger",
314
+ ...parts.trigger.attrs,
310
315
  role: "tab",
311
316
  type: "button",
312
317
  disabled,
@@ -317,7 +322,7 @@ function connect(state, send, normalize) {
317
322
  "aria-selected": selected,
318
323
  "data-selected": dataAttr(selected),
319
324
  "aria-controls": dom.getContentId(state.context, value),
320
- "data-ownedby": dom.getTriggerGroupId(state.context),
325
+ "data-ownedby": dom.getTablistId(state.context),
321
326
  id: dom.getTriggerId(state.context, value),
322
327
  tabIndex: selected ? 0 : -1,
323
328
  onFocus() {
@@ -340,38 +345,25 @@ function connect(state, send, normalize) {
340
345
  });
341
346
  },
342
347
  contentGroupProps: normalize.element({
343
- "data-part": "content-group",
348
+ ...parts.contentGroup.attrs,
344
349
  id: dom.getContentGroupId(state.context),
345
350
  "data-orientation": state.context.orientation
346
351
  }),
347
352
  getContentProps({ value }) {
348
353
  const selected = state.context.value === value;
349
354
  return normalize.element({
350
- "data-part": "content",
355
+ ...parts.content.attrs,
351
356
  id: dom.getContentId(state.context, value),
352
357
  tabIndex: 0,
353
358
  "aria-labelledby": dom.getTriggerId(state.context, value),
354
359
  role: "tabpanel",
355
- "data-ownedby": dom.getTriggerGroupId(state.context),
360
+ "data-ownedby": dom.getTablistId(state.context),
356
361
  hidden: !selected
357
362
  });
358
363
  },
359
- getDeleteButtonProps({ value, disabled }) {
360
- var _a;
361
- return normalize.button({
362
- "data-part": "delete-button",
363
- type: "button",
364
- tabIndex: -1,
365
- "aria-label": (_a = translations.deleteLabel) == null ? void 0 : _a.call(translations, value),
366
- disabled,
367
- onClick() {
368
- send({ type: "DELETE", value });
369
- }
370
- });
371
- },
372
364
  indicatorProps: normalize.element({
373
365
  id: dom.getIndicatorId(state.context),
374
- "data-part": "indicator",
366
+ ...parts.indicator.attrs,
375
367
  "data-orientation": state.context.orientation,
376
368
  style: {
377
369
  "--transition-duration": "200ms",
@@ -601,6 +593,7 @@ function pushUnique(arr, value) {
601
593
  return newArr;
602
594
  }
603
595
  export {
596
+ anatomy,
604
597
  connect,
605
598
  machine
606
599
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/tabs",
3
- "version": "0.2.2",
3
+ "version": "0.2.4",
4
4
  "description": "Core logic for the tabs widget implemented as a state machine",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
@@ -29,7 +29,8 @@
29
29
  "url": "https://github.com/chakra-ui/zag/issues"
30
30
  },
31
31
  "dependencies": {
32
- "@zag-js/core": "0.2.2",
32
+ "@zag-js/anatomy": "0.1.1",
33
+ "@zag-js/core": "0.2.3",
33
34
  "@zag-js/types": "0.3.1"
34
35
  },
35
36
  "devDependencies": {