@zag-js/steps 1.34.1 → 1.35.1
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.mts +8 -212
- package/dist/index.d.ts +8 -212
- package/dist/index.js +36 -347
- package/dist/index.mjs +9 -343
- package/dist/steps.anatomy.d.mts +6 -0
- package/dist/steps.anatomy.d.ts +6 -0
- package/dist/steps.anatomy.js +45 -0
- package/dist/steps.anatomy.mjs +19 -0
- package/dist/steps.connect.d.mts +7 -0
- package/dist/steps.connect.d.ts +7 -0
- package/dist/steps.connect.js +224 -0
- package/dist/steps.connect.mjs +189 -0
- package/dist/steps.dom.d.mts +8 -0
- package/dist/steps.dom.d.ts +8 -0
- package/dist/steps.dom.js +39 -0
- package/dist/steps.dom.mjs +11 -0
- package/dist/steps.machine.d.mts +7 -0
- package/dist/steps.machine.d.ts +7 -0
- package/dist/steps.machine.js +147 -0
- package/dist/steps.machine.mjs +122 -0
- package/dist/steps.props.d.mts +8 -0
- package/dist/steps.props.d.ts +8 -0
- package/dist/steps.props.js +50 -0
- package/dist/steps.props.mjs +24 -0
- package/dist/steps.types.d.mts +201 -0
- package/dist/steps.types.d.ts +201 -0
- package/dist/steps.types.js +18 -0
- package/dist/steps.types.mjs +0 -0
- package/package.json +17 -7
package/dist/index.d.mts
CHANGED
|
@@ -1,212 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
step: number;
|
|
10
|
-
}
|
|
11
|
-
interface StepInvalidDetails {
|
|
12
|
-
step: number;
|
|
13
|
-
action: "next" | "set";
|
|
14
|
-
targetStep?: number;
|
|
15
|
-
}
|
|
16
|
-
interface ElementIds {
|
|
17
|
-
root?: string | undefined;
|
|
18
|
-
list?: string | undefined;
|
|
19
|
-
triggerId?: ((index: number) => string) | undefined;
|
|
20
|
-
contentId?: ((index: number) => string) | undefined;
|
|
21
|
-
}
|
|
22
|
-
interface StepsProps extends DirectionProperty, CommonProperties {
|
|
23
|
-
/**
|
|
24
|
-
* The custom ids for the stepper elements
|
|
25
|
-
*/
|
|
26
|
-
ids?: ElementIds | undefined;
|
|
27
|
-
/**
|
|
28
|
-
* The controlled value of the stepper
|
|
29
|
-
*/
|
|
30
|
-
step?: number | undefined;
|
|
31
|
-
/**
|
|
32
|
-
* The initial value of the stepper when rendered.
|
|
33
|
-
* Use when you don't need to control the value of the stepper.
|
|
34
|
-
*/
|
|
35
|
-
defaultStep?: number | undefined;
|
|
36
|
-
/**
|
|
37
|
-
* Callback to be called when the value changes
|
|
38
|
-
*/
|
|
39
|
-
onStepChange?: ((details: StepChangeDetails) => void) | undefined;
|
|
40
|
-
/**
|
|
41
|
-
* Callback to be called when a step is completed
|
|
42
|
-
*/
|
|
43
|
-
onStepComplete?: VoidFunction | undefined;
|
|
44
|
-
/**
|
|
45
|
-
* If `true`, the stepper requires the user to complete the steps in order
|
|
46
|
-
*/
|
|
47
|
-
linear?: boolean | undefined;
|
|
48
|
-
/**
|
|
49
|
-
* The orientation of the stepper
|
|
50
|
-
* @default "horizontal"
|
|
51
|
-
*/
|
|
52
|
-
orientation?: "horizontal" | "vertical" | undefined;
|
|
53
|
-
/**
|
|
54
|
-
* The total number of steps
|
|
55
|
-
*/
|
|
56
|
-
count?: number | undefined;
|
|
57
|
-
/**
|
|
58
|
-
* Whether a step is valid. Invalid steps block forward navigation in linear mode.
|
|
59
|
-
* @default () => true
|
|
60
|
-
*/
|
|
61
|
-
isStepValid?: ((index: number) => boolean) | undefined;
|
|
62
|
-
/**
|
|
63
|
-
* Whether a step can be skipped during navigation.
|
|
64
|
-
* Skippable steps are bypassed when using next/prev.
|
|
65
|
-
* @default () => false
|
|
66
|
-
*/
|
|
67
|
-
isStepSkippable?: ((index: number) => boolean) | undefined;
|
|
68
|
-
/**
|
|
69
|
-
* Called when navigation is blocked due to an invalid step.
|
|
70
|
-
*/
|
|
71
|
-
onStepInvalid?: ((details: StepInvalidDetails) => void) | undefined;
|
|
72
|
-
}
|
|
73
|
-
type PropsWithDefault = "orientation" | "linear" | "count";
|
|
74
|
-
interface PrivateContext {
|
|
75
|
-
step: number;
|
|
76
|
-
}
|
|
77
|
-
type ComputedContext = Readonly<{
|
|
78
|
-
percent: number;
|
|
79
|
-
hasNextStep: boolean;
|
|
80
|
-
hasPrevStep: boolean;
|
|
81
|
-
completed: boolean;
|
|
82
|
-
}>;
|
|
83
|
-
interface StepsSchema {
|
|
84
|
-
props: RequiredBy<StepsProps, PropsWithDefault>;
|
|
85
|
-
context: PrivateContext;
|
|
86
|
-
computed: ComputedContext;
|
|
87
|
-
state: "idle";
|
|
88
|
-
event: EventObject;
|
|
89
|
-
action: string;
|
|
90
|
-
effect: string;
|
|
91
|
-
guard: string;
|
|
92
|
-
}
|
|
93
|
-
type StepsService = Service<StepsSchema>;
|
|
94
|
-
type StepsMachine = Machine<StepsSchema>;
|
|
95
|
-
interface ItemProps {
|
|
96
|
-
index: number;
|
|
97
|
-
}
|
|
98
|
-
interface ItemState {
|
|
99
|
-
/**
|
|
100
|
-
* The index of the step
|
|
101
|
-
*/
|
|
102
|
-
index: number;
|
|
103
|
-
/**
|
|
104
|
-
* The id of the trigger element
|
|
105
|
-
*/
|
|
106
|
-
triggerId: string;
|
|
107
|
-
/**
|
|
108
|
-
* The id of the content element
|
|
109
|
-
*/
|
|
110
|
-
contentId: string;
|
|
111
|
-
/**
|
|
112
|
-
* Whether the step is the current step
|
|
113
|
-
*/
|
|
114
|
-
current: boolean;
|
|
115
|
-
/**
|
|
116
|
-
* Whether the step is completed (index < current step)
|
|
117
|
-
*/
|
|
118
|
-
completed: boolean;
|
|
119
|
-
/**
|
|
120
|
-
* Whether the step is incomplete (index > current step)
|
|
121
|
-
*/
|
|
122
|
-
incomplete: boolean;
|
|
123
|
-
/**
|
|
124
|
-
* Whether the step is the last step
|
|
125
|
-
*/
|
|
126
|
-
last: boolean;
|
|
127
|
-
/**
|
|
128
|
-
* Whether the step is the first step
|
|
129
|
-
*/
|
|
130
|
-
first: boolean;
|
|
131
|
-
/**
|
|
132
|
-
* Whether the step can be skipped (based on `isStepSkippable` callback)
|
|
133
|
-
*/
|
|
134
|
-
skippable: boolean;
|
|
135
|
-
/**
|
|
136
|
-
* Lazy validation check - only evaluated when called
|
|
137
|
-
*/
|
|
138
|
-
isValid: () => boolean;
|
|
139
|
-
}
|
|
140
|
-
interface StepsApi<T extends PropTypes = PropTypes> {
|
|
141
|
-
/**
|
|
142
|
-
* The value of the stepper.
|
|
143
|
-
*/
|
|
144
|
-
value: number;
|
|
145
|
-
/**
|
|
146
|
-
* The percentage of the stepper.
|
|
147
|
-
*/
|
|
148
|
-
percent: number;
|
|
149
|
-
/**
|
|
150
|
-
* The total number of steps.
|
|
151
|
-
*/
|
|
152
|
-
count: number;
|
|
153
|
-
/**
|
|
154
|
-
* Whether the stepper has a next step.
|
|
155
|
-
*/
|
|
156
|
-
hasNextStep: boolean;
|
|
157
|
-
/**
|
|
158
|
-
* Whether the stepper has a previous step.
|
|
159
|
-
*/
|
|
160
|
-
hasPrevStep: boolean;
|
|
161
|
-
/**
|
|
162
|
-
* Whether the stepper is completed.
|
|
163
|
-
*/
|
|
164
|
-
isCompleted: boolean;
|
|
165
|
-
/**
|
|
166
|
-
* Check if a specific step is valid (lazy evaluation)
|
|
167
|
-
*/
|
|
168
|
-
isStepValid: (index: number) => boolean;
|
|
169
|
-
/**
|
|
170
|
-
* Check if a specific step can be skipped
|
|
171
|
-
*/
|
|
172
|
-
isStepSkippable: (index: number) => boolean;
|
|
173
|
-
/**
|
|
174
|
-
* Function to set the value of the stepper.
|
|
175
|
-
*/
|
|
176
|
-
setStep: (step: number) => void;
|
|
177
|
-
/**
|
|
178
|
-
* Function to go to the next step.
|
|
179
|
-
*/
|
|
180
|
-
goToNextStep: VoidFunction;
|
|
181
|
-
/**
|
|
182
|
-
* Function to go to the previous step.
|
|
183
|
-
*/
|
|
184
|
-
goToPrevStep: VoidFunction;
|
|
185
|
-
/**
|
|
186
|
-
* Function to go to reset the stepper.
|
|
187
|
-
*/
|
|
188
|
-
resetStep: VoidFunction;
|
|
189
|
-
/**
|
|
190
|
-
* Returns the state of the item at the given index.
|
|
191
|
-
*/
|
|
192
|
-
getItemState: (props: ItemProps) => ItemState;
|
|
193
|
-
getRootProps: () => T["element"];
|
|
194
|
-
getListProps: () => T["element"];
|
|
195
|
-
getItemProps: (props: ItemProps) => T["element"];
|
|
196
|
-
getTriggerProps: (props: ItemProps) => T["element"];
|
|
197
|
-
getContentProps: (props: ItemProps) => T["element"];
|
|
198
|
-
getNextTriggerProps: () => T["button"];
|
|
199
|
-
getPrevTriggerProps: () => T["button"];
|
|
200
|
-
getProgressProps: () => T["element"];
|
|
201
|
-
getIndicatorProps: (props: ItemProps) => T["element"];
|
|
202
|
-
getSeparatorProps: (props: ItemProps) => T["element"];
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
declare function connect<T extends PropTypes>(service: StepsService, normalize: NormalizeProps<T>): StepsApi<T>;
|
|
206
|
-
|
|
207
|
-
declare const machine: _zag_js_core.Machine<StepsSchema>;
|
|
208
|
-
|
|
209
|
-
declare const props: (keyof StepsProps)[];
|
|
210
|
-
declare const splitProps: <Props extends Partial<StepsProps>>(props: Props) => [Partial<StepsProps>, Omit<Props, keyof StepsProps>];
|
|
211
|
-
|
|
212
|
-
export { type StepsApi as Api, type ElementIds, type ItemProps, type ItemState, type StepsMachine as Machine, type StepsProps as Props, type StepsService as Service, type StepChangeDetails, type StepInvalidDetails, anatomy, connect, machine, props, splitProps };
|
|
1
|
+
export { anatomy } from './steps.anatomy.mjs';
|
|
2
|
+
export { connect } from './steps.connect.mjs';
|
|
3
|
+
export { machine } from './steps.machine.mjs';
|
|
4
|
+
export { props, splitProps } from './steps.props.mjs';
|
|
5
|
+
export { StepsApi as Api, ElementIds, ItemProps, ItemState, StepsMachine as Machine, StepsProps as Props, StepsService as Service, StepChangeDetails, StepInvalidDetails } from './steps.types.mjs';
|
|
6
|
+
import '@zag-js/anatomy';
|
|
7
|
+
import '@zag-js/types';
|
|
8
|
+
import '@zag-js/core';
|
package/dist/index.d.ts
CHANGED
|
@@ -1,212 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
step: number;
|
|
10
|
-
}
|
|
11
|
-
interface StepInvalidDetails {
|
|
12
|
-
step: number;
|
|
13
|
-
action: "next" | "set";
|
|
14
|
-
targetStep?: number;
|
|
15
|
-
}
|
|
16
|
-
interface ElementIds {
|
|
17
|
-
root?: string | undefined;
|
|
18
|
-
list?: string | undefined;
|
|
19
|
-
triggerId?: ((index: number) => string) | undefined;
|
|
20
|
-
contentId?: ((index: number) => string) | undefined;
|
|
21
|
-
}
|
|
22
|
-
interface StepsProps extends DirectionProperty, CommonProperties {
|
|
23
|
-
/**
|
|
24
|
-
* The custom ids for the stepper elements
|
|
25
|
-
*/
|
|
26
|
-
ids?: ElementIds | undefined;
|
|
27
|
-
/**
|
|
28
|
-
* The controlled value of the stepper
|
|
29
|
-
*/
|
|
30
|
-
step?: number | undefined;
|
|
31
|
-
/**
|
|
32
|
-
* The initial value of the stepper when rendered.
|
|
33
|
-
* Use when you don't need to control the value of the stepper.
|
|
34
|
-
*/
|
|
35
|
-
defaultStep?: number | undefined;
|
|
36
|
-
/**
|
|
37
|
-
* Callback to be called when the value changes
|
|
38
|
-
*/
|
|
39
|
-
onStepChange?: ((details: StepChangeDetails) => void) | undefined;
|
|
40
|
-
/**
|
|
41
|
-
* Callback to be called when a step is completed
|
|
42
|
-
*/
|
|
43
|
-
onStepComplete?: VoidFunction | undefined;
|
|
44
|
-
/**
|
|
45
|
-
* If `true`, the stepper requires the user to complete the steps in order
|
|
46
|
-
*/
|
|
47
|
-
linear?: boolean | undefined;
|
|
48
|
-
/**
|
|
49
|
-
* The orientation of the stepper
|
|
50
|
-
* @default "horizontal"
|
|
51
|
-
*/
|
|
52
|
-
orientation?: "horizontal" | "vertical" | undefined;
|
|
53
|
-
/**
|
|
54
|
-
* The total number of steps
|
|
55
|
-
*/
|
|
56
|
-
count?: number | undefined;
|
|
57
|
-
/**
|
|
58
|
-
* Whether a step is valid. Invalid steps block forward navigation in linear mode.
|
|
59
|
-
* @default () => true
|
|
60
|
-
*/
|
|
61
|
-
isStepValid?: ((index: number) => boolean) | undefined;
|
|
62
|
-
/**
|
|
63
|
-
* Whether a step can be skipped during navigation.
|
|
64
|
-
* Skippable steps are bypassed when using next/prev.
|
|
65
|
-
* @default () => false
|
|
66
|
-
*/
|
|
67
|
-
isStepSkippable?: ((index: number) => boolean) | undefined;
|
|
68
|
-
/**
|
|
69
|
-
* Called when navigation is blocked due to an invalid step.
|
|
70
|
-
*/
|
|
71
|
-
onStepInvalid?: ((details: StepInvalidDetails) => void) | undefined;
|
|
72
|
-
}
|
|
73
|
-
type PropsWithDefault = "orientation" | "linear" | "count";
|
|
74
|
-
interface PrivateContext {
|
|
75
|
-
step: number;
|
|
76
|
-
}
|
|
77
|
-
type ComputedContext = Readonly<{
|
|
78
|
-
percent: number;
|
|
79
|
-
hasNextStep: boolean;
|
|
80
|
-
hasPrevStep: boolean;
|
|
81
|
-
completed: boolean;
|
|
82
|
-
}>;
|
|
83
|
-
interface StepsSchema {
|
|
84
|
-
props: RequiredBy<StepsProps, PropsWithDefault>;
|
|
85
|
-
context: PrivateContext;
|
|
86
|
-
computed: ComputedContext;
|
|
87
|
-
state: "idle";
|
|
88
|
-
event: EventObject;
|
|
89
|
-
action: string;
|
|
90
|
-
effect: string;
|
|
91
|
-
guard: string;
|
|
92
|
-
}
|
|
93
|
-
type StepsService = Service<StepsSchema>;
|
|
94
|
-
type StepsMachine = Machine<StepsSchema>;
|
|
95
|
-
interface ItemProps {
|
|
96
|
-
index: number;
|
|
97
|
-
}
|
|
98
|
-
interface ItemState {
|
|
99
|
-
/**
|
|
100
|
-
* The index of the step
|
|
101
|
-
*/
|
|
102
|
-
index: number;
|
|
103
|
-
/**
|
|
104
|
-
* The id of the trigger element
|
|
105
|
-
*/
|
|
106
|
-
triggerId: string;
|
|
107
|
-
/**
|
|
108
|
-
* The id of the content element
|
|
109
|
-
*/
|
|
110
|
-
contentId: string;
|
|
111
|
-
/**
|
|
112
|
-
* Whether the step is the current step
|
|
113
|
-
*/
|
|
114
|
-
current: boolean;
|
|
115
|
-
/**
|
|
116
|
-
* Whether the step is completed (index < current step)
|
|
117
|
-
*/
|
|
118
|
-
completed: boolean;
|
|
119
|
-
/**
|
|
120
|
-
* Whether the step is incomplete (index > current step)
|
|
121
|
-
*/
|
|
122
|
-
incomplete: boolean;
|
|
123
|
-
/**
|
|
124
|
-
* Whether the step is the last step
|
|
125
|
-
*/
|
|
126
|
-
last: boolean;
|
|
127
|
-
/**
|
|
128
|
-
* Whether the step is the first step
|
|
129
|
-
*/
|
|
130
|
-
first: boolean;
|
|
131
|
-
/**
|
|
132
|
-
* Whether the step can be skipped (based on `isStepSkippable` callback)
|
|
133
|
-
*/
|
|
134
|
-
skippable: boolean;
|
|
135
|
-
/**
|
|
136
|
-
* Lazy validation check - only evaluated when called
|
|
137
|
-
*/
|
|
138
|
-
isValid: () => boolean;
|
|
139
|
-
}
|
|
140
|
-
interface StepsApi<T extends PropTypes = PropTypes> {
|
|
141
|
-
/**
|
|
142
|
-
* The value of the stepper.
|
|
143
|
-
*/
|
|
144
|
-
value: number;
|
|
145
|
-
/**
|
|
146
|
-
* The percentage of the stepper.
|
|
147
|
-
*/
|
|
148
|
-
percent: number;
|
|
149
|
-
/**
|
|
150
|
-
* The total number of steps.
|
|
151
|
-
*/
|
|
152
|
-
count: number;
|
|
153
|
-
/**
|
|
154
|
-
* Whether the stepper has a next step.
|
|
155
|
-
*/
|
|
156
|
-
hasNextStep: boolean;
|
|
157
|
-
/**
|
|
158
|
-
* Whether the stepper has a previous step.
|
|
159
|
-
*/
|
|
160
|
-
hasPrevStep: boolean;
|
|
161
|
-
/**
|
|
162
|
-
* Whether the stepper is completed.
|
|
163
|
-
*/
|
|
164
|
-
isCompleted: boolean;
|
|
165
|
-
/**
|
|
166
|
-
* Check if a specific step is valid (lazy evaluation)
|
|
167
|
-
*/
|
|
168
|
-
isStepValid: (index: number) => boolean;
|
|
169
|
-
/**
|
|
170
|
-
* Check if a specific step can be skipped
|
|
171
|
-
*/
|
|
172
|
-
isStepSkippable: (index: number) => boolean;
|
|
173
|
-
/**
|
|
174
|
-
* Function to set the value of the stepper.
|
|
175
|
-
*/
|
|
176
|
-
setStep: (step: number) => void;
|
|
177
|
-
/**
|
|
178
|
-
* Function to go to the next step.
|
|
179
|
-
*/
|
|
180
|
-
goToNextStep: VoidFunction;
|
|
181
|
-
/**
|
|
182
|
-
* Function to go to the previous step.
|
|
183
|
-
*/
|
|
184
|
-
goToPrevStep: VoidFunction;
|
|
185
|
-
/**
|
|
186
|
-
* Function to go to reset the stepper.
|
|
187
|
-
*/
|
|
188
|
-
resetStep: VoidFunction;
|
|
189
|
-
/**
|
|
190
|
-
* Returns the state of the item at the given index.
|
|
191
|
-
*/
|
|
192
|
-
getItemState: (props: ItemProps) => ItemState;
|
|
193
|
-
getRootProps: () => T["element"];
|
|
194
|
-
getListProps: () => T["element"];
|
|
195
|
-
getItemProps: (props: ItemProps) => T["element"];
|
|
196
|
-
getTriggerProps: (props: ItemProps) => T["element"];
|
|
197
|
-
getContentProps: (props: ItemProps) => T["element"];
|
|
198
|
-
getNextTriggerProps: () => T["button"];
|
|
199
|
-
getPrevTriggerProps: () => T["button"];
|
|
200
|
-
getProgressProps: () => T["element"];
|
|
201
|
-
getIndicatorProps: (props: ItemProps) => T["element"];
|
|
202
|
-
getSeparatorProps: (props: ItemProps) => T["element"];
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
declare function connect<T extends PropTypes>(service: StepsService, normalize: NormalizeProps<T>): StepsApi<T>;
|
|
206
|
-
|
|
207
|
-
declare const machine: _zag_js_core.Machine<StepsSchema>;
|
|
208
|
-
|
|
209
|
-
declare const props: (keyof StepsProps)[];
|
|
210
|
-
declare const splitProps: <Props extends Partial<StepsProps>>(props: Props) => [Partial<StepsProps>, Omit<Props, keyof StepsProps>];
|
|
211
|
-
|
|
212
|
-
export { type StepsApi as Api, type ElementIds, type ItemProps, type ItemState, type StepsMachine as Machine, type StepsProps as Props, type StepsService as Service, type StepChangeDetails, type StepInvalidDetails, anatomy, connect, machine, props, splitProps };
|
|
1
|
+
export { anatomy } from './steps.anatomy.js';
|
|
2
|
+
export { connect } from './steps.connect.js';
|
|
3
|
+
export { machine } from './steps.machine.js';
|
|
4
|
+
export { props, splitProps } from './steps.props.js';
|
|
5
|
+
export { StepsApi as Api, ElementIds, ItemProps, ItemState, StepsMachine as Machine, StepsProps as Props, StepsService as Service, StepChangeDetails, StepInvalidDetails } from './steps.types.js';
|
|
6
|
+
import '@zag-js/anatomy';
|
|
7
|
+
import '@zag-js/types';
|
|
8
|
+
import '@zag-js/core';
|