@react-spectrum/steplist 3.0.0-nightly.4290 → 3.0.0-nightly.4305
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/import.mjs +54 -37
- package/dist/main.css +1 -1
- package/dist/main.js +53 -36
- package/dist/main.js.map +1 -1
- package/dist/module.js +54 -37
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +14 -14
- package/src/StepList.tsx +3 -4
- package/src/StepListItem.tsx +30 -23
package/dist/import.mjs
CHANGED
@@ -7,7 +7,7 @@ import {useProviderProps as $gZOFb$useProviderProps} from "@react-spectrum/provi
|
|
7
7
|
import {useStepListState as $gZOFb$useStepListState} from "@react-stately/steplist";
|
8
8
|
import $gZOFb$spectrumiconsuiChevronRightMedium from "@spectrum-icons/ui/ChevronRightMedium";
|
9
9
|
import {FocusRing as $gZOFb$FocusRing} from "@react-aria/focus";
|
10
|
-
import {mergeProps as $gZOFb$mergeProps} from "@react-aria/utils";
|
10
|
+
import {useId as $gZOFb$useId, mergeProps as $gZOFb$mergeProps} from "@react-aria/utils";
|
11
11
|
import {useHover as $gZOFb$useHover} from "@react-aria/interactions";
|
12
12
|
import {useLocale as $gZOFb$useLocale, useLocalizedStringFormatter as $gZOFb$useLocalizedStringFormatter, useNumberFormatter as $gZOFb$useNumberFormatter} from "@react-aria/i18n";
|
13
13
|
import {VisuallyHidden as $gZOFb$VisuallyHidden} from "@react-aria/visually-hidden";
|
@@ -90,24 +90,22 @@ var $62132693388ec24a$export$2e2bcd8739ae039 = {
|
|
90
90
|
|
91
91
|
var $b2477f17b7c66618$exports = {};
|
92
92
|
|
93
|
-
$parcel$export($b2477f17b7c66618$exports, "chevron", () => $b2477f17b7c66618$export$980c1089c0604ea3, (v) => $b2477f17b7c66618$export$980c1089c0604ea3 = v);
|
94
93
|
$parcel$export($b2477f17b7c66618$exports, "focus-ring", () => $b2477f17b7c66618$export$f39a09f249340e2a, (v) => $b2477f17b7c66618$export$f39a09f249340e2a = v);
|
95
94
|
$parcel$export($b2477f17b7c66618$exports, "i18nFontFamily", () => $b2477f17b7c66618$export$8c4ee2c50c22c514, (v) => $b2477f17b7c66618$export$8c4ee2c50c22c514 = v);
|
96
95
|
$parcel$export($b2477f17b7c66618$exports, "is-completed", () => $b2477f17b7c66618$export$7e62df9ca2e410e4, (v) => $b2477f17b7c66618$export$7e62df9ca2e410e4 = v);
|
97
96
|
$parcel$export($b2477f17b7c66618$exports, "is-disabled", () => $b2477f17b7c66618$export$d35bc1e505d1ebbf, (v) => $b2477f17b7c66618$export$d35bc1e505d1ebbf = v);
|
98
|
-
$parcel$export($b2477f17b7c66618$exports, "is-emphasized", () => $b2477f17b7c66618$export$ad416fbde92db390, (v) => $b2477f17b7c66618$export$ad416fbde92db390 = v);
|
99
97
|
$parcel$export($b2477f17b7c66618$exports, "is-hovered", () => $b2477f17b7c66618$export$b8813cd5d7824ce7, (v) => $b2477f17b7c66618$export$b8813cd5d7824ce7 = v);
|
100
98
|
$parcel$export($b2477f17b7c66618$exports, "is-reversed", () => $b2477f17b7c66618$export$a4561bd665abb5db, (v) => $b2477f17b7c66618$export$a4561bd665abb5db = v);
|
101
99
|
$parcel$export($b2477f17b7c66618$exports, "is-selected", () => $b2477f17b7c66618$export$1e0fb04f31d3c22a, (v) => $b2477f17b7c66618$export$1e0fb04f31d3c22a = v);
|
102
100
|
$parcel$export($b2477f17b7c66618$exports, "label", () => $b2477f17b7c66618$export$1237798dc640739a, (v) => $b2477f17b7c66618$export$1237798dc640739a = v);
|
103
101
|
$parcel$export($b2477f17b7c66618$exports, "line", () => $b2477f17b7c66618$export$53f1d5ea8de3d7c, (v) => $b2477f17b7c66618$export$53f1d5ea8de3d7c = v);
|
104
|
-
$parcel$export($b2477f17b7c66618$exports, "
|
105
|
-
$parcel$export($b2477f17b7c66618$exports, "number", () => $b2477f17b7c66618$export$98e628dec113755e, (v) => $b2477f17b7c66618$export$98e628dec113755e = v);
|
102
|
+
$parcel$export($b2477f17b7c66618$exports, "marker", () => $b2477f17b7c66618$export$ffc4d0086f1a4c9, (v) => $b2477f17b7c66618$export$ffc4d0086f1a4c9 = v);
|
106
103
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-FocusRing-ring", () => $b2477f17b7c66618$export$4109102f950813a6, (v) => $b2477f17b7c66618$export$4109102f950813a6 = v);
|
107
104
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-FocusRing", () => $b2477f17b7c66618$export$24c7f46a6e3605dd, (v) => $b2477f17b7c66618$export$24c7f46a6e3605dd = v);
|
108
105
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-FocusRing--quiet", () => $b2477f17b7c66618$export$2927016961429360, (v) => $b2477f17b7c66618$export$2927016961429360 = v);
|
109
106
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist", () => $b2477f17b7c66618$export$35315228197e36b8, (v) => $b2477f17b7c66618$export$35315228197e36b8 = v);
|
110
|
-
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--
|
107
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--emphasized", () => $b2477f17b7c66618$export$d2cf12460a777241, (v) => $b2477f17b7c66618$export$d2cf12460a777241 = v);
|
108
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--horizontal", () => $b2477f17b7c66618$export$6f0c4d0e9f29399d, (v) => $b2477f17b7c66618$export$6f0c4d0e9f29399d = v);
|
111
109
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--large", () => $b2477f17b7c66618$export$b0d9d5077004711a, (v) => $b2477f17b7c66618$export$b0d9d5077004711a = v);
|
112
110
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--medium", () => $b2477f17b7c66618$export$9666cb7894b7712a, (v) => $b2477f17b7c66618$export$9666cb7894b7712a = v);
|
113
111
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--small", () => $b2477f17b7c66618$export$43119eed81e90e13, (v) => $b2477f17b7c66618$export$43119eed81e90e13 = v);
|
@@ -118,25 +116,25 @@ $parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-item", () => $b2477
|
|
118
116
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-label", () => $b2477f17b7c66618$export$2393468f68ff8031, (v) => $b2477f17b7c66618$export$2393468f68ff8031 = v);
|
119
117
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-link", () => $b2477f17b7c66618$export$f622f4b07b665af3, (v) => $b2477f17b7c66618$export$f622f4b07b665af3 = v);
|
120
118
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-marker", () => $b2477f17b7c66618$export$9d44d123fa093f85, (v) => $b2477f17b7c66618$export$9d44d123fa093f85 = v);
|
119
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-markerWrapper", () => $b2477f17b7c66618$export$a7d0643524891b06, (v) => $b2477f17b7c66618$export$a7d0643524891b06 = v);
|
121
120
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-segment", () => $b2477f17b7c66618$export$1f36a6b1ab318f2f, (v) => $b2477f17b7c66618$export$1f36a6b1ab318f2f = v);
|
122
|
-
|
121
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-segmentLine", () => $b2477f17b7c66618$export$f92a1d2b4a328a95, (v) => $b2477f17b7c66618$export$f92a1d2b4a328a95 = v);
|
123
122
|
var $b2477f17b7c66618$export$f39a09f249340e2a;
|
124
123
|
var $b2477f17b7c66618$export$8c4ee2c50c22c514;
|
125
124
|
var $b2477f17b7c66618$export$7e62df9ca2e410e4;
|
126
125
|
var $b2477f17b7c66618$export$d35bc1e505d1ebbf;
|
127
|
-
var $b2477f17b7c66618$export$ad416fbde92db390;
|
128
126
|
var $b2477f17b7c66618$export$b8813cd5d7824ce7;
|
129
127
|
var $b2477f17b7c66618$export$a4561bd665abb5db;
|
130
128
|
var $b2477f17b7c66618$export$1e0fb04f31d3c22a;
|
131
129
|
var $b2477f17b7c66618$export$1237798dc640739a;
|
132
130
|
var $b2477f17b7c66618$export$53f1d5ea8de3d7c;
|
133
|
-
var $b2477f17b7c66618$export$
|
134
|
-
var $b2477f17b7c66618$export$98e628dec113755e;
|
131
|
+
var $b2477f17b7c66618$export$ffc4d0086f1a4c9;
|
135
132
|
var $b2477f17b7c66618$export$4109102f950813a6;
|
136
133
|
var $b2477f17b7c66618$export$24c7f46a6e3605dd;
|
137
134
|
var $b2477f17b7c66618$export$2927016961429360;
|
138
135
|
var $b2477f17b7c66618$export$35315228197e36b8;
|
139
|
-
var $b2477f17b7c66618$export$
|
136
|
+
var $b2477f17b7c66618$export$d2cf12460a777241;
|
137
|
+
var $b2477f17b7c66618$export$6f0c4d0e9f29399d;
|
140
138
|
var $b2477f17b7c66618$export$b0d9d5077004711a;
|
141
139
|
var $b2477f17b7c66618$export$9666cb7894b7712a;
|
142
140
|
var $b2477f17b7c66618$export$43119eed81e90e13;
|
@@ -147,25 +145,25 @@ var $b2477f17b7c66618$export$df6f1d30f09c136e;
|
|
147
145
|
var $b2477f17b7c66618$export$2393468f68ff8031;
|
148
146
|
var $b2477f17b7c66618$export$f622f4b07b665af3;
|
149
147
|
var $b2477f17b7c66618$export$9d44d123fa093f85;
|
148
|
+
var $b2477f17b7c66618$export$a7d0643524891b06;
|
150
149
|
var $b2477f17b7c66618$export$1f36a6b1ab318f2f;
|
151
|
-
$b2477f17b7c66618$export$
|
150
|
+
var $b2477f17b7c66618$export$f92a1d2b4a328a95;
|
152
151
|
$b2477f17b7c66618$export$f39a09f249340e2a = `Y9ExmG_focus-ring`;
|
153
152
|
$b2477f17b7c66618$export$8c4ee2c50c22c514 = `Y9ExmG_i18nFontFamily`;
|
154
153
|
$b2477f17b7c66618$export$7e62df9ca2e410e4 = `Y9ExmG_is-completed`;
|
155
154
|
$b2477f17b7c66618$export$d35bc1e505d1ebbf = `Y9ExmG_is-disabled`;
|
156
|
-
$b2477f17b7c66618$export$ad416fbde92db390 = `Y9ExmG_is-emphasized`;
|
157
155
|
$b2477f17b7c66618$export$b8813cd5d7824ce7 = `Y9ExmG_is-hovered`;
|
158
156
|
$b2477f17b7c66618$export$a4561bd665abb5db = `Y9ExmG_is-reversed`;
|
159
157
|
$b2477f17b7c66618$export$1e0fb04f31d3c22a = `Y9ExmG_is-selected`;
|
160
158
|
$b2477f17b7c66618$export$1237798dc640739a = `Y9ExmG_label`;
|
161
159
|
$b2477f17b7c66618$export$53f1d5ea8de3d7c = `Y9ExmG_line`;
|
162
|
-
$b2477f17b7c66618$export$
|
163
|
-
$b2477f17b7c66618$export$98e628dec113755e = `Y9ExmG_number`;
|
160
|
+
$b2477f17b7c66618$export$ffc4d0086f1a4c9 = `Y9ExmG_marker`;
|
164
161
|
$b2477f17b7c66618$export$4109102f950813a6 = `Y9ExmG_spectrum-FocusRing-ring`;
|
165
162
|
$b2477f17b7c66618$export$24c7f46a6e3605dd = `Y9ExmG_spectrum-FocusRing ${$b2477f17b7c66618$export$4109102f950813a6}`;
|
166
163
|
$b2477f17b7c66618$export$2927016961429360 = `Y9ExmG_spectrum-FocusRing--quiet`;
|
167
164
|
$b2477f17b7c66618$export$35315228197e36b8 = `Y9ExmG_spectrum-Steplist`;
|
168
|
-
$b2477f17b7c66618$export$
|
165
|
+
$b2477f17b7c66618$export$d2cf12460a777241 = `Y9ExmG_spectrum-Steplist--emphasized`;
|
166
|
+
$b2477f17b7c66618$export$6f0c4d0e9f29399d = `Y9ExmG_spectrum-Steplist--horizontal`;
|
169
167
|
$b2477f17b7c66618$export$b0d9d5077004711a = `Y9ExmG_spectrum-Steplist--large`;
|
170
168
|
$b2477f17b7c66618$export$9666cb7894b7712a = `Y9ExmG_spectrum-Steplist--medium`;
|
171
169
|
$b2477f17b7c66618$export$43119eed81e90e13 = `Y9ExmG_spectrum-Steplist--small`;
|
@@ -176,7 +174,9 @@ $b2477f17b7c66618$export$df6f1d30f09c136e = `Y9ExmG_spectrum-Steplist-item`;
|
|
176
174
|
$b2477f17b7c66618$export$2393468f68ff8031 = `Y9ExmG_spectrum-Steplist-label`;
|
177
175
|
$b2477f17b7c66618$export$f622f4b07b665af3 = `Y9ExmG_spectrum-Steplist-link`;
|
178
176
|
$b2477f17b7c66618$export$9d44d123fa093f85 = `Y9ExmG_spectrum-Steplist-marker`;
|
177
|
+
$b2477f17b7c66618$export$a7d0643524891b06 = `Y9ExmG_spectrum-Steplist-markerWrapper`;
|
179
178
|
$b2477f17b7c66618$export$1f36a6b1ab318f2f = `Y9ExmG_spectrum-Steplist-segment`;
|
179
|
+
$b2477f17b7c66618$export$f92a1d2b4a328a95 = `Y9ExmG_spectrum-Steplist-segmentLine`;
|
180
180
|
|
181
181
|
|
182
182
|
|
@@ -184,59 +184,77 @@ $b2477f17b7c66618$export$1f36a6b1ab318f2f = `Y9ExmG_spectrum-Steplist-segment`;
|
|
184
184
|
|
185
185
|
|
186
186
|
function $24c3cb1adfb0acc5$export$87c2a8a94eda1754(props) {
|
187
|
-
let { isDisabled: isDisabled,
|
187
|
+
let { isDisabled: isDisabled, item: item } = props;
|
188
188
|
let { key: key } = item;
|
189
189
|
let ref = (0, $gZOFb$useRef)();
|
190
190
|
let { direction: direction } = (0, $gZOFb$useLocale)();
|
191
191
|
let state = (0, $gZOFb$useContext)((0, $739a883ac33f90d8$export$66136572efa4af6e));
|
192
|
+
const isSelected = state.selectedKey === key;
|
192
193
|
const isCompleted = state.isCompleted(key);
|
193
194
|
const isItemDisabled = isDisabled || state.disabledKeys.has(key);
|
194
195
|
let { stepProps: stepProps, stepStateProps: stepStateProps } = (0, $gZOFb$useStepListItem)({
|
195
196
|
...props,
|
196
197
|
key: key
|
197
198
|
}, state, ref);
|
198
|
-
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $gZOFb$useHover)(
|
199
|
-
|
199
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $gZOFb$useHover)({
|
200
|
+
...props,
|
201
|
+
isDisabled: isItemDisabled || isSelected || props.isReadOnly
|
202
|
+
});
|
200
203
|
let stepStateText = "";
|
201
204
|
const stringFormatter = (0, $gZOFb$useLocalizedStringFormatter)((0, $62132693388ec24a$export$2e2bcd8739ae039));
|
202
205
|
const numberFormatter = (0, $gZOFb$useNumberFormatter)();
|
203
206
|
if (isSelected) stepStateText = stringFormatter.format("current");
|
204
207
|
else if (isCompleted) stepStateText = stringFormatter.format("completed");
|
205
208
|
else stepStateText = stringFormatter.format("notCompleted");
|
209
|
+
let markerId = (0, $gZOFb$useId)();
|
210
|
+
let labelId = (0, $gZOFb$useId)();
|
206
211
|
return /*#__PURE__*/ (0, $gZOFb$react).createElement("li", {
|
207
|
-
key: key,
|
208
212
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-item")
|
209
213
|
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$FocusRing), {
|
210
214
|
within: true,
|
211
215
|
focusRingClass: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "focus-ring")
|
212
216
|
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("a", {
|
213
|
-
"aria-labelledby": `step-marker-${key} step-label-${key}`,
|
214
|
-
ref: ref,
|
215
217
|
...(0, $gZOFb$mergeProps)(hoverProps, stepProps),
|
218
|
+
"aria-labelledby": `${markerId} ${labelId}`,
|
219
|
+
ref: ref,
|
216
220
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-link", {
|
217
221
|
"is-selected": isSelected && !isItemDisabled,
|
218
222
|
"is-disabled": isItemDisabled,
|
219
223
|
"is-hovered": isHovered,
|
220
|
-
"is-
|
221
|
-
"is-
|
224
|
+
"is-completed": isCompleted,
|
225
|
+
"is-selectable": state.isSelectable(key) && !isSelected
|
222
226
|
})
|
223
|
-
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$VisuallyHidden), stepStateProps, stepStateText), /*#__PURE__*/ (0, $gZOFb$react).createElement("
|
224
|
-
id:
|
225
|
-
"aria-hidden": "true",
|
226
|
-
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-marker")
|
227
|
-
}, numberFormatter.format((item.index || 0) + 1)), /*#__PURE__*/ (0, $gZOFb$react).createElement("span", {
|
228
|
-
id: `step-label-${key}`,
|
227
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$VisuallyHidden), stepStateProps, stepStateText), /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
228
|
+
id: labelId,
|
229
229
|
"aria-hidden": "true",
|
230
230
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-label")
|
231
|
-
}, item.rendered)
|
231
|
+
}, item.rendered), /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
232
232
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-segment", {
|
233
233
|
"is-completed": isCompleted
|
234
234
|
})
|
235
|
-
}, /*#__PURE__*/ (0, $gZOFb$react).createElement(
|
235
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("svg", {
|
236
|
+
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-segmentLine"),
|
237
|
+
xmlns: "http://www.w3.org/2000/svg",
|
238
|
+
height: "100%",
|
239
|
+
viewBox: "0 0 2 8",
|
240
|
+
preserveAspectRatio: "none"
|
241
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("line", {
|
242
|
+
x1: "1",
|
243
|
+
y1: "0",
|
244
|
+
x2: "1",
|
245
|
+
y2: "8",
|
246
|
+
vectorEffect: "non-scaling-stroke"
|
247
|
+
})), /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$spectrumiconsuiChevronRightMedium), {
|
236
248
|
UNSAFE_className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-chevron", {
|
237
249
|
"is-reversed": direction === "rtl"
|
238
250
|
})
|
239
|
-
})))
|
251
|
+
})), /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
252
|
+
id: markerId,
|
253
|
+
"aria-hidden": "true",
|
254
|
+
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-markerWrapper")
|
255
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
256
|
+
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-marker")
|
257
|
+
}, numberFormatter.format((item.index || 0) + 1))))));
|
240
258
|
}
|
241
259
|
|
242
260
|
|
@@ -246,21 +264,22 @@ function $24c3cb1adfb0acc5$export$87c2a8a94eda1754(props) {
|
|
246
264
|
function $6bd0589d5d2f8b66$var$StepList(props, ref) {
|
247
265
|
const { size: size = "M", orientation: orientation = "horizontal" } = props;
|
248
266
|
props = (0, $gZOFb$useProviderProps)(props);
|
267
|
+
const { isDisabled: isDisabled, isEmphasized: isEmphasized } = props;
|
249
268
|
let { styleProps: styleProps } = (0, $gZOFb$useStyleProps)(props);
|
250
269
|
let domRef = (0, $gZOFb$useDOMRef)(ref);
|
251
270
|
let state = (0, $gZOFb$useStepListState)(props);
|
252
271
|
let { listProps: listProps } = (0, $gZOFb$useStepList)(props, state, domRef);
|
253
|
-
const { isDisabled: isDisabled, isEmphasized: isEmphasized, isReadOnly: isReadOnly } = props;
|
254
272
|
return /*#__PURE__*/ (0, $gZOFb$react).createElement("ol", {
|
255
273
|
...listProps,
|
256
274
|
...styleProps,
|
257
275
|
ref: domRef,
|
258
276
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist", styleProps.className, {
|
259
|
-
"spectrum-Steplist--interactive": !isReadOnly && !isDisabled,
|
260
277
|
"spectrum-Steplist--small": size === "S",
|
261
278
|
"spectrum-Steplist--medium": size === "M",
|
262
279
|
"spectrum-Steplist--large": size === "L",
|
263
280
|
"spectrum-Steplist--xlarge": size === "XL",
|
281
|
+
"spectrum-Steplist--emphasized": isEmphasized,
|
282
|
+
"spectrum-Steplist--horizontal": orientation === "horizontal",
|
264
283
|
"spectrum-Steplist--vertical": orientation === "vertical"
|
265
284
|
})
|
266
285
|
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $739a883ac33f90d8$export$66136572efa4af6e).Provider, {
|
@@ -270,8 +289,6 @@ function $6bd0589d5d2f8b66$var$StepList(props, ref) {
|
|
270
289
|
].map((item)=>/*#__PURE__*/ (0, $gZOFb$react).createElement((0, $24c3cb1adfb0acc5$export$87c2a8a94eda1754), {
|
271
290
|
key: item.key,
|
272
291
|
isDisabled: isDisabled,
|
273
|
-
isEmphasized: isEmphasized,
|
274
|
-
isReadOnly: isReadOnly,
|
275
292
|
item: item
|
276
293
|
}))));
|
277
294
|
}
|
package/dist/main.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
.Y9ExmG_i18nFontFamily{font-synthesis:weight;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.Y9ExmG_i18nFontFamily:lang(ar){font-family:myriad-arabic,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.Y9ExmG_i18nFontFamily:lang(he){font-family:myriad-hebrew,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Heiti TC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh-Hans){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh-Hant){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Microsoft JhengHei UI,Microsoft JhengHei,Heiti TC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh-SG),.Y9ExmG_i18nFontFamily:lang(zh-CN){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(ko){font-family:adobe-clean-han-korean,source-han-korean,Malgun Gothic,Apple Gothic,sans-serif}.Y9ExmG_i18nFontFamily:lang(ja){font-family:adobe-clean-han-japanese,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Osaka,YuGothic,Yu Gothic,メイリオ,Meiryo,MS Pゴシック,MS PGothic,sans-serif}.Y9ExmG_spectrum-FocusRing-ring{--spectrum-focus-ring-border-radius:var(--spectrum-textfield-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);--spectrum-focus-ring-border-size:0px;--spectrum-focus-ring-color:var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)))}.Y9ExmG_spectrum-FocusRing-ring:after{border-radius:calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));content:"";margin:calc(-1*var(--spectrum-focus-ring-border-size));pointer-events:none;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out,margin var(--spectrum-global-animation-duration-100,.13s)ease-out;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.Y9ExmG_spectrum-FocusRing.Y9ExmG_focus-ring:after{margin:calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size));box-shadow:0 0 0 var(--spectrum-focus-ring-size)var(--spectrum-focus-ring-color)}.Y9ExmG_spectrum-FocusRing--quiet:after{border-radius:0}.Y9ExmG_spectrum-FocusRing--quiet.Y9ExmG_focus-ring:after{margin:0 0 calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size))0;box-shadow:0 var(--spectrum-focus-ring-size)0 var(--spectrum-focus-ring-color)}.Y9ExmG_spectrum-Steplist{flex-wrap:nowrap;margin:0;padding:0;display:flex}.Y9ExmG_spectrum-Steplist-item{grid-template-rows:auto;grid-template-areas:"Y9ExmG_link Y9ExmG_chevron";place-items:start center;min-width:0;display:grid}.Y9ExmG_spectrum-Steplist-item.Y9ExmG_focus-ring{outline-offset:2px;outline:2px}.Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-segment{align-items:center;height:100%;display:inline-flex}.Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-chevron.Y9ExmG_is-reversed{transform:scale(-1)}.Y9ExmG_spectrum-Steplist-link{cursor:default;outline:none;grid-area:Y9ExmG_link;grid-template-areas:"Y9ExmG_number Y9ExmG_label";place-items:center;text-decoration:none;display:grid}.Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{box-sizing:border-box;color:#0000;border-style:solid;border-width:2px;border-radius:50%;flex-direction:column;grid-area:Y9ExmG_number;justify-content:center;align-items:center;padding-bottom:1px;font-weight:700;display:flex}.Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-label{grid-area:Y9ExmG_label}.Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker,.Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-marker,.Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-hovered.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker{border:none}.Y9ExmG_spectrum-Steplist--small{font-size:var(--spectrum-global-dimension-font-size-75);gap:10px}.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-item{grid-template-columns:auto;gap:10px}.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-link{gap:10px}.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{width:8px;height:8px;font-size:0}.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-chevron{transform:scale(.75)}.Y9ExmG_spectrum-Steplist--medium{font-size:var(--spectrum-global-dimension-font-size-100);gap:16px}.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item{grid-template-columns:auto;gap:16px}.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker:not(.Y9ExmG_is-completed),.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-marker:not(.Y9ExmG_is-completed){color:#0000}.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-link{gap:12px}.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{font-size:var(--spectrum-global-dimension-font-size-75);width:16px;height:16px}.Y9ExmG_spectrum-Steplist--large{font-size:var(--spectrum-global-dimension-font-size-200);gap:20px}.Y9ExmG_spectrum-Steplist--large .Y9ExmG_spectrum-Steplist-item{grid-template-columns:auto;gap:20px}.Y9ExmG_spectrum-Steplist--large .Y9ExmG_spectrum-Steplist-link{gap:14px}.Y9ExmG_spectrum-Steplist--large .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{font-size:var(--spectrum-global-dimension-font-size-100);width:24px;height:24px}.Y9ExmG_spectrum-Steplist--large .Y9ExmG_spectrum-Steplist-chevron{transform:scale(1.25)}.Y9ExmG_spectrum-Steplist--xlarge{font-size:var(--spectrum-global-dimension-font-size-300);gap:24px}.Y9ExmG_spectrum-Steplist--xlarge .Y9ExmG_spectrum-Steplist-item{grid-template-columns:auto;gap:24px}.Y9ExmG_spectrum-Steplist--xlarge .Y9ExmG_spectrum-Steplist-link{gap:16px}.Y9ExmG_spectrum-Steplist--xlarge .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{font-size:var(--spectrum-global-dimension-font-size-200);width:32px;height:32px}.Y9ExmG_spectrum-Steplist--xlarge .Y9ExmG_spectrum-Steplist-chevron{transform:scale(1.5)}.Y9ExmG_spectrum-Steplist-item:last-child{grid-template-columns:auto;grid-template-areas:"Y9ExmG_link"}.Y9ExmG_spectrum-Steplist-item:last-child .Y9ExmG_spectrum-Steplist-segment{display:none}.Y9ExmG_spectrum-Steplist--vertical{flex-direction:column;gap:2px}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-item{grid-template-areas:"Y9ExmG_link Y9ExmG_link""Y9ExmG_line.";justify-items:start;gap:2px}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-segment.Y9ExmG_is-completed{border-color:var(--spectrum-global-color-gray-400);border-left-style:solid}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-item{grid-template-columns:8px auto}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link{line-height:8px}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item{grid-template-columns:16px auto}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link{line-height:16px}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--large .Y9ExmG_spectrum-Steplist-item{grid-template-columns:24px auto}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--xlarge .Y9ExmG_spectrum-Steplist-item{grid-template-columns:32px auto}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-chevron{display:none}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-segment{box-sizing:content-box;border-color:var(--spectrum-global-color-gray-400);border-width:0 0 0 2px;border-left-style:dashed;grid-area:Y9ExmG_line;justify-self:center;width:0;height:32px;display:block}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-global-color-gray-600)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-marker{border-color:var(--spectrum-global-color-gray-400);color:var(--spectrum-global-color-gray-600)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-chevron{color:var(--spectrum-global-color-gray-400)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-global-color-gray-600)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-global-color-gray-800)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-global-color-gray-800)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker,.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-marker{color:var(--spectrum-global-color-gray-50)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-emphasized .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-global-color-blue-400)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-emphasized .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-global-color-blue-400)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_focus-ring{outline:none}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_focus-ring .Y9ExmG_spectrum-Steplist-marker{outline:solid 2px var(--spectrum-global-color-blue-400);outline-offset:2px;z-index:999}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-alias-text-color-disabled,var(--spectrum-global-color-gray-500))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-marker{border-color:var(--spectrum-global-color-gray-400);color:var(--spectrum-alias-text-color-disabled,var(--spectrum-global-color-gray-500))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-global-color-gray-300);color:var(--spectrum-global-color-gray-50)}.Y9ExmG_spectrum-Steplist.Y9ExmG_spectrum-Steplist--interactive .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-hovered.Y9ExmG_is-completed:not(.Y9ExmG_is-disabled) .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-global-color-gray-800)}.Y9ExmG_spectrum-Steplist.Y9ExmG_spectrum-Steplist--interactive .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-hovered.Y9ExmG_is-completed:not(.Y9ExmG_is-disabled) .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-global-color-gray-800);color:var(--spectrum-global-color-gray-50)}.Y9ExmG_spectrum-Steplist.Y9ExmG_spectrum-Steplist--interactive .Y9ExmG_spectrum-Steplist-link:not(.Y9ExmG_is-selected):not([aria-disabled]){cursor:pointer}.Y9ExmG_spectrum-Steplist.Y9ExmG_spectrum-Steplist--interactive .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-emphasized.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-global-color-blue-400)}.Y9ExmG_spectrum-Steplist.Y9ExmG_spectrum-Steplist--interactive .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-emphasized.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-global-color-blue-400)}
|
1
|
+
.Y9ExmG_i18nFontFamily{font-synthesis:weight;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.Y9ExmG_i18nFontFamily:lang(ar){font-family:myriad-arabic,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.Y9ExmG_i18nFontFamily:lang(he){font-family:myriad-hebrew,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Heiti TC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh-Hans){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh-Hant){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Microsoft JhengHei UI,Microsoft JhengHei,Heiti TC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(zh-SG),.Y9ExmG_i18nFontFamily:lang(zh-CN){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.Y9ExmG_i18nFontFamily:lang(ko){font-family:adobe-clean-han-korean,source-han-korean,Malgun Gothic,Apple Gothic,sans-serif}.Y9ExmG_i18nFontFamily:lang(ja){font-family:adobe-clean-han-japanese,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Osaka,YuGothic,Yu Gothic,メイリオ,Meiryo,MS Pゴシック,MS PGothic,sans-serif}.Y9ExmG_spectrum-FocusRing-ring{--spectrum-focus-ring-border-radius:var(--spectrum-textfield-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);--spectrum-focus-ring-border-size:0px;--spectrum-focus-ring-color:var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)))}.Y9ExmG_spectrum-FocusRing-ring:after{border-radius:calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));content:"";margin:calc(-1*var(--spectrum-focus-ring-border-size));pointer-events:none;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out,margin var(--spectrum-global-animation-duration-100,.13s)ease-out;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.Y9ExmG_spectrum-FocusRing.Y9ExmG_focus-ring:after{margin:calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size));box-shadow:0 0 0 var(--spectrum-focus-ring-size)var(--spectrum-focus-ring-color)}.Y9ExmG_spectrum-FocusRing--quiet:after{border-radius:0}.Y9ExmG_spectrum-FocusRing--quiet.Y9ExmG_focus-ring:after{margin:0 0 calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size))0;box-shadow:0 var(--spectrum-focus-ring-size)0 var(--spectrum-focus-ring-color)}.Y9ExmG_spectrum-Steplist{flex-wrap:nowrap;margin:0;padding:0;display:flex}.Y9ExmG_spectrum-Steplist-item{min-width:0;display:grid}.Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-segment{align-items:center;display:inline-flex}.Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-segment.Y9ExmG_is-completed svg line{stroke-dasharray:none}.Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-chevron.Y9ExmG_is-reversed{transform:scaleX(-1)}.Y9ExmG_spectrum-Steplist-link{cursor:default;outline:none;text-decoration:none;display:grid}.Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-markerWrapper{grid-area:Y9ExmG_marker}.Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{box-sizing:border-box;border-style:solid;border-width:2px;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;font-weight:700;display:flex}.Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-label{grid-area:Y9ExmG_label}.Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker,.Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-marker,.Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-hovered.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker{border-style:none;border-width:0}.Y9ExmG_spectrum-Steplist{font-size:var(--spectrum-steplist-font-size);gap:var(--spectrum-steplist-chevron-gap)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-link{gap:var(--spectrum-steplist-marker-label-gap)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{width:var(--spectrum-steplist-marker-diameter);height:var(--spectrum-steplist-marker-diameter);font-size:var(--spectrum-steplist-counter-font-size);padding-block-end:1px}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-chevron{transform:scale(var(--spectrum-steplist-chevron-scale))}.Y9ExmG_spectrum-Steplist--small{--spectrum-steplist-font-size:var(--spectrum-global-dimension-font-size-75);--spectrum-steplist-chevron-gap:10px;--spectrum-steplist-marker-label-gap:10px;--spectrum-steplist-marker-diameter:8px;--spectrum-steplist-counter-font-size:0;--spectrum-steplist-chevron-scale:.75;--spectrum-steplist-segment-height-adjust:-4px}.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-marker{padding-top:1px}.Y9ExmG_spectrum-Steplist--small.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-marker{margin-top:1px}.Y9ExmG_spectrum-Steplist--small.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-chevron{padding-top:2px}.Y9ExmG_spectrum-Steplist--medium{--spectrum-steplist-font-size:var(--spectrum-global-dimension-font-size-100);--spectrum-steplist-chevron-gap:16px;--spectrum-steplist-marker-label-gap:12px;--spectrum-steplist-marker-diameter:16px;--spectrum-steplist-counter-font-size:var(--spectrum-global-dimension-font-size-75);--spectrum-steplist-chevron-scale:1;--spectrum-steplist-segment-height-adjust:0px}.Y9ExmG_spectrum-Steplist--large{--spectrum-steplist-font-size:var(--spectrum-global-dimension-font-size-200);--spectrum-steplist-chevron-gap:20px;--spectrum-steplist-marker-label-gap:14px;--spectrum-steplist-marker-diameter:24px;--spectrum-steplist-counter-font-size:var(--spectrum-global-dimension-font-size-100);--spectrum-steplist-chevron-scale:1.25;--spectrum-steplist-segment-height-adjust:6px}.Y9ExmG_spectrum-Steplist--xlarge{--spectrum-steplist-font-size:var(--spectrum-global-dimension-font-size-300);--spectrum-steplist-chevron-gap:24px;--spectrum-steplist-marker-label-gap:16px;--spectrum-steplist-marker-diameter:32px;--spectrum-steplist-counter-font-size:var(--spectrum-global-dimension-font-size-200);--spectrum-steplist-chevron-scale:1.5;--spectrum-steplist-segment-height-adjust:6px}.Y9ExmG_spectrum-Steplist-item:last-child .Y9ExmG_spectrum-Steplist-segment{display:none}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-link{align-items:baseline;display:flex}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-segment{order:2;align-items:center;padding-inline-start:calc(var(--spectrum-steplist-chevron-gap) - var(--spectrum-steplist-marker-label-gap));display:flex}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-segment:before{content:"x";visibility:hidden;width:0}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-chevron{padding-top:1px}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-label{order:1}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-markerWrapper{flex:none;order:0;align-items:center;display:flex}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-markerWrapper:before{content:"x";visibility:hidden;width:0}.Y9ExmG_spectrum-Steplist--horizontal .Y9ExmG_spectrum-Steplist-segmentLine{display:none}.Y9ExmG_spectrum-Steplist--vertical{flex-direction:column;gap:0 2px}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-item{display:unset;list-style:none}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-link{grid-template:"Y9ExmG_marker Y9ExmG_label"minmax(16px,min-content)"Y9ExmG_line Y9ExmG_label"1fr/minmax(0,min-content) 1fr;justify-items:start;gap:0 6px;display:grid}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-chevron{display:none}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-markerWrapper{align-self:baseline;align-items:center;min-width:0;min-height:0;display:flex}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-markerWrapper:before{content:"x";visibility:hidden;width:0}.Y9ExmG_spectrum-Steplist--vertical.Y9ExmG_spectrum-Steplist--small .Y9ExmG_spectrum-Steplist-marker{align-self:center}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-label{align-self:baseline;min-width:0;min-height:0;line-height:16px}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-segment{box-sizing:content-box;pointer-events:none;grid-area:Y9ExmG_line;justify-self:center;width:2px;min-width:0;min-height:32px}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-segmentLine{height:calc(100% - var(--spectrum-steplist-segment-height-adjust));width:2px;overflow:visible}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-segmentLine line{stroke-width:2px;stroke-dasharray:6 4;stroke-linecap:round}.Y9ExmG_spectrum-Steplist--vertical .Y9ExmG_spectrum-Steplist-item:last-child .Y9ExmG_spectrum-Steplist-link{grid-template-rows:minmax(16px,min-content);grid-template-areas:"Y9ExmG_marker Y9ExmG_label"}.Y9ExmG_spectrum-Steplist{--spectrum-steplist-complete-segment-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-complete-label-text-color:var(--spectrum-global-color-gray-700);--spectrum-steplist-complete-marker-text-color:var(--spectrum-global-color-gray-50);--spectrum-steplist-complete-marker-color:var(--spectrum-global-color-gray-600);--spectrum-steplist-complete-marker-color-hover:var(--spectrum-global-color-gray-700);--spectrum-steplist-current-label-text-color:var(--spectrum-global-color-gray-800);--spectrum-steplist-current-marker-text-color:var(--spectrum-global-color-gray-50);--spectrum-steplist-current-marker-color:var(--spectrum-global-color-gray-800);--spectrum-steplist-incomplete-segment-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-incomplete-label-text-color:var(--spectrum-global-color-gray-600);--spectrum-steplist-incomplete-marker-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-incomplete-marker-text-color:var(--spectrum-global-color-gray-500);--spectrum-steplist-emphasized-current-label-text-color:var(--spectrum-accent-color-900);--spectrum-steplist-emphasized-current-marker-color:var(--spectrum-accent-color-900);--spectrum-steplist-disabled-complete-marker-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-disabled-complete-marker-text-color:var(--spectrum-global-color-gray-50);--spectrum-steplist-disabled-complete-segment-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-disabled-complete-label-text-color:var(--spectrum-global-color-gray-500);--spectrum-steplist-disabled-incomplete-marker-color:var(--spectrum-global-color-gray-300);--spectrum-steplist-disabled-incomplete-marker-text-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-disabled-incomplete-segment-color:var(--spectrum-global-color-gray-400);--spectrum-steplist-disabled-incomplete-label-text-color:var(--spectrum-global-color-gray-400)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-steplist-incomplete-label-text-color,var(--spectrum-global-color-gray-600))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-marker{border-color:var(--spectrum-steplist-incomplete-marker-color,var(--spectrum-global-color-gray-300));color:var(--spectrum-steplist-incomplete-marker-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-chevron{color:var(--spectrum-steplist-incomplete-segment-color,var(--spectrum-global-color-gray-300))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-segment svg line{stroke:var(--spectrum-steplist-incomplete-segment-color,var(--spectrum-global-color-gray-300))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-steplist-disabled-incomplete-label-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-marker{border-color:var(--spectrum-steplist-disabled-incomplete-marker-color);color:var(--spectrum-steplist-disabled-incomplete-marker-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-chevron{color:var(--spectrum-steplist-disabled-incomplete-segment-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-segment svg line{stroke:var(--spectrum-steplist-disabled-incomplete-segment-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-steplist-complete-label-text-color,var(--spectrum-global-color-gray-700))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-steplist-complete-marker-color,var(--spectrum-global-color-gray-600));border-color:var(--spectrum-steplist-complete-marker-color,var(--spectrum-global-color-gray-600));color:var(--spectrum-steplist-complete-marker-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-chevron{color:var(--spectrum-steplist-complete-segment-color,var(--spectrum-global-color-gray-500))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed .Y9ExmG_spectrum-Steplist-segment svg line{stroke:var(--spectrum-steplist-complete-segment-color,var(--spectrum-global-color-gray-500))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed.Y9ExmG_is-hovered .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-steplist-complete-marker-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-steplist-complete-marker-color-hover,var(--spectrum-global-color-gray-700))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-steplist-disabled-complete-label-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-steplist-disabled-complete-marker-color);border-color:var(--spectrum-steplist-disabled-complete-marker-color);color:var(--spectrum-steplist-disabled-complete-marker-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-chevron{color:var(--spectrum-steplist-disabled-complete-segment-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-completed.Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-segment svg line{stroke:var(--spectrum-steplist-disabled-complete-segment-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-label{color:var(--spectrum-steplist-current-label-text-color,var(--spectrum-global-color-gray-800))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-marker{background-color:var(--spectrum-steplist-current-marker-color,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-steplist-current-marker-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-steplist-current-marker-text-color)}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-segment .Y9ExmG_spectrum-Steplist-chevron{color:var(--spectrum-steplist-complete-segment-color,var(--spectrum-global-color-gray-500))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_is-selected .Y9ExmG_spectrum-Steplist-segment svg line{stroke:var(--spectrum-steplist-complete-segment-color,var(--spectrum-global-color-gray-500))}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link.Y9ExmG_focus-ring .Y9ExmG_spectrum-Steplist-marker{outline:solid 2px var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)));outline-offset:2px}.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link:not(.Y9ExmG_is-completed):not(.Y9ExmG_is-selected) .Y9ExmG_spectrum-Steplist-marker,.Y9ExmG_spectrum-Steplist--medium .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link:not(.Y9ExmG_is-completed):not(.Y9ExmG_is-selected).Y9ExmG_is-disabled .Y9ExmG_spectrum-Steplist-marker{color:#0000}.Y9ExmG_spectrum-Steplist--emphasized{--spectrum-steplist-current-label-text-color:var(--spectrum-steplist-emphasized-current-label-text-color);--spectrum-steplist-current-marker-color:var(--spectrum-steplist-emphasized-current-marker-color)}@media (forced-colors:active){.Y9ExmG_spectrum-Steplist{forced-color-adjust:none;--spectrum-steplist-complete-segment-color:CanvasText;--spectrum-steplist-complete-label-text-color:LinkText;--spectrum-steplist-complete-marker-text-color:Canvas;--spectrum-steplist-complete-marker-color:LinkText;--spectrum-steplist-complete-marker-color-hover:LinkText;--spectrum-steplist-current-label-text-color:Highlight;--spectrum-steplist-current-marker-text-color:Canvas;--spectrum-steplist-current-marker-color:Highlight;--spectrum-steplist-incomplete-segment-color:CanvasText;--spectrum-steplist-incomplete-label-text-color:ButtonText;--spectrum-steplist-incomplete-marker-color:ButtonText;--spectrum-steplist-incomplete-marker-text-color:ButtonText;--spectrum-steplist-emphasized-current-label-text-color:CanvasText;--spectrum-steplist-emphasized-current-marker-color:ButtonText;--spectrum-steplist-disabled-complete-marker-color:GrayText;--spectrum-steplist-disabled-complete-marker-text-color:Canvas;--spectrum-steplist-disabled-complete-segment-color:CanvasText;--spectrum-steplist-disabled-complete-label-text-color:GrayText;--spectrum-steplist-disabled-incomplete-marker-color:GrayText;--spectrum-steplist-disabled-incomplete-marker-text-color:ButtonText;--spectrum-steplist-disabled-incomplete-segment-color:CanvasText;--spectrum-steplist-disabled-incomplete-label-text-color:GrayText;--spectrum-high-contrast-focus-ring-color:ButtonText}.Y9ExmG_spectrum-Steplist .Y9ExmG_spectrum-Steplist-item .Y9ExmG_spectrum-Steplist-link .Y9ExmG_spectrum-Steplist-marker{border-style:solid;border-width:2px}}
|
package/dist/main.js
CHANGED
@@ -93,24 +93,22 @@ var $fed92386245d94a4$export$2e2bcd8739ae039 = {
|
|
93
93
|
|
94
94
|
var $390add5aac6e4d73$exports = {};
|
95
95
|
|
96
|
-
$parcel$export($390add5aac6e4d73$exports, "chevron", () => $390add5aac6e4d73$export$980c1089c0604ea3, (v) => $390add5aac6e4d73$export$980c1089c0604ea3 = v);
|
97
96
|
$parcel$export($390add5aac6e4d73$exports, "focus-ring", () => $390add5aac6e4d73$export$f39a09f249340e2a, (v) => $390add5aac6e4d73$export$f39a09f249340e2a = v);
|
98
97
|
$parcel$export($390add5aac6e4d73$exports, "i18nFontFamily", () => $390add5aac6e4d73$export$8c4ee2c50c22c514, (v) => $390add5aac6e4d73$export$8c4ee2c50c22c514 = v);
|
99
98
|
$parcel$export($390add5aac6e4d73$exports, "is-completed", () => $390add5aac6e4d73$export$7e62df9ca2e410e4, (v) => $390add5aac6e4d73$export$7e62df9ca2e410e4 = v);
|
100
99
|
$parcel$export($390add5aac6e4d73$exports, "is-disabled", () => $390add5aac6e4d73$export$d35bc1e505d1ebbf, (v) => $390add5aac6e4d73$export$d35bc1e505d1ebbf = v);
|
101
|
-
$parcel$export($390add5aac6e4d73$exports, "is-emphasized", () => $390add5aac6e4d73$export$ad416fbde92db390, (v) => $390add5aac6e4d73$export$ad416fbde92db390 = v);
|
102
100
|
$parcel$export($390add5aac6e4d73$exports, "is-hovered", () => $390add5aac6e4d73$export$b8813cd5d7824ce7, (v) => $390add5aac6e4d73$export$b8813cd5d7824ce7 = v);
|
103
101
|
$parcel$export($390add5aac6e4d73$exports, "is-reversed", () => $390add5aac6e4d73$export$a4561bd665abb5db, (v) => $390add5aac6e4d73$export$a4561bd665abb5db = v);
|
104
102
|
$parcel$export($390add5aac6e4d73$exports, "is-selected", () => $390add5aac6e4d73$export$1e0fb04f31d3c22a, (v) => $390add5aac6e4d73$export$1e0fb04f31d3c22a = v);
|
105
103
|
$parcel$export($390add5aac6e4d73$exports, "label", () => $390add5aac6e4d73$export$1237798dc640739a, (v) => $390add5aac6e4d73$export$1237798dc640739a = v);
|
106
104
|
$parcel$export($390add5aac6e4d73$exports, "line", () => $390add5aac6e4d73$export$53f1d5ea8de3d7c, (v) => $390add5aac6e4d73$export$53f1d5ea8de3d7c = v);
|
107
|
-
$parcel$export($390add5aac6e4d73$exports, "
|
108
|
-
$parcel$export($390add5aac6e4d73$exports, "number", () => $390add5aac6e4d73$export$98e628dec113755e, (v) => $390add5aac6e4d73$export$98e628dec113755e = v);
|
105
|
+
$parcel$export($390add5aac6e4d73$exports, "marker", () => $390add5aac6e4d73$export$ffc4d0086f1a4c9, (v) => $390add5aac6e4d73$export$ffc4d0086f1a4c9 = v);
|
109
106
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-FocusRing-ring", () => $390add5aac6e4d73$export$4109102f950813a6, (v) => $390add5aac6e4d73$export$4109102f950813a6 = v);
|
110
107
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-FocusRing", () => $390add5aac6e4d73$export$24c7f46a6e3605dd, (v) => $390add5aac6e4d73$export$24c7f46a6e3605dd = v);
|
111
108
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-FocusRing--quiet", () => $390add5aac6e4d73$export$2927016961429360, (v) => $390add5aac6e4d73$export$2927016961429360 = v);
|
112
109
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist", () => $390add5aac6e4d73$export$35315228197e36b8, (v) => $390add5aac6e4d73$export$35315228197e36b8 = v);
|
113
|
-
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist--
|
110
|
+
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist--emphasized", () => $390add5aac6e4d73$export$d2cf12460a777241, (v) => $390add5aac6e4d73$export$d2cf12460a777241 = v);
|
111
|
+
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist--horizontal", () => $390add5aac6e4d73$export$6f0c4d0e9f29399d, (v) => $390add5aac6e4d73$export$6f0c4d0e9f29399d = v);
|
114
112
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist--large", () => $390add5aac6e4d73$export$b0d9d5077004711a, (v) => $390add5aac6e4d73$export$b0d9d5077004711a = v);
|
115
113
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist--medium", () => $390add5aac6e4d73$export$9666cb7894b7712a, (v) => $390add5aac6e4d73$export$9666cb7894b7712a = v);
|
116
114
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist--small", () => $390add5aac6e4d73$export$43119eed81e90e13, (v) => $390add5aac6e4d73$export$43119eed81e90e13 = v);
|
@@ -121,25 +119,25 @@ $parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-item", () => $390ad
|
|
121
119
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-label", () => $390add5aac6e4d73$export$2393468f68ff8031, (v) => $390add5aac6e4d73$export$2393468f68ff8031 = v);
|
122
120
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-link", () => $390add5aac6e4d73$export$f622f4b07b665af3, (v) => $390add5aac6e4d73$export$f622f4b07b665af3 = v);
|
123
121
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-marker", () => $390add5aac6e4d73$export$9d44d123fa093f85, (v) => $390add5aac6e4d73$export$9d44d123fa093f85 = v);
|
122
|
+
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-markerWrapper", () => $390add5aac6e4d73$export$a7d0643524891b06, (v) => $390add5aac6e4d73$export$a7d0643524891b06 = v);
|
124
123
|
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-segment", () => $390add5aac6e4d73$export$1f36a6b1ab318f2f, (v) => $390add5aac6e4d73$export$1f36a6b1ab318f2f = v);
|
125
|
-
|
124
|
+
$parcel$export($390add5aac6e4d73$exports, "spectrum-Steplist-segmentLine", () => $390add5aac6e4d73$export$f92a1d2b4a328a95, (v) => $390add5aac6e4d73$export$f92a1d2b4a328a95 = v);
|
126
125
|
var $390add5aac6e4d73$export$f39a09f249340e2a;
|
127
126
|
var $390add5aac6e4d73$export$8c4ee2c50c22c514;
|
128
127
|
var $390add5aac6e4d73$export$7e62df9ca2e410e4;
|
129
128
|
var $390add5aac6e4d73$export$d35bc1e505d1ebbf;
|
130
|
-
var $390add5aac6e4d73$export$ad416fbde92db390;
|
131
129
|
var $390add5aac6e4d73$export$b8813cd5d7824ce7;
|
132
130
|
var $390add5aac6e4d73$export$a4561bd665abb5db;
|
133
131
|
var $390add5aac6e4d73$export$1e0fb04f31d3c22a;
|
134
132
|
var $390add5aac6e4d73$export$1237798dc640739a;
|
135
133
|
var $390add5aac6e4d73$export$53f1d5ea8de3d7c;
|
136
|
-
var $390add5aac6e4d73$export$
|
137
|
-
var $390add5aac6e4d73$export$98e628dec113755e;
|
134
|
+
var $390add5aac6e4d73$export$ffc4d0086f1a4c9;
|
138
135
|
var $390add5aac6e4d73$export$4109102f950813a6;
|
139
136
|
var $390add5aac6e4d73$export$24c7f46a6e3605dd;
|
140
137
|
var $390add5aac6e4d73$export$2927016961429360;
|
141
138
|
var $390add5aac6e4d73$export$35315228197e36b8;
|
142
|
-
var $390add5aac6e4d73$export$
|
139
|
+
var $390add5aac6e4d73$export$d2cf12460a777241;
|
140
|
+
var $390add5aac6e4d73$export$6f0c4d0e9f29399d;
|
143
141
|
var $390add5aac6e4d73$export$b0d9d5077004711a;
|
144
142
|
var $390add5aac6e4d73$export$9666cb7894b7712a;
|
145
143
|
var $390add5aac6e4d73$export$43119eed81e90e13;
|
@@ -150,25 +148,25 @@ var $390add5aac6e4d73$export$df6f1d30f09c136e;
|
|
150
148
|
var $390add5aac6e4d73$export$2393468f68ff8031;
|
151
149
|
var $390add5aac6e4d73$export$f622f4b07b665af3;
|
152
150
|
var $390add5aac6e4d73$export$9d44d123fa093f85;
|
151
|
+
var $390add5aac6e4d73$export$a7d0643524891b06;
|
153
152
|
var $390add5aac6e4d73$export$1f36a6b1ab318f2f;
|
154
|
-
$390add5aac6e4d73$export$
|
153
|
+
var $390add5aac6e4d73$export$f92a1d2b4a328a95;
|
155
154
|
$390add5aac6e4d73$export$f39a09f249340e2a = `Y9ExmG_focus-ring`;
|
156
155
|
$390add5aac6e4d73$export$8c4ee2c50c22c514 = `Y9ExmG_i18nFontFamily`;
|
157
156
|
$390add5aac6e4d73$export$7e62df9ca2e410e4 = `Y9ExmG_is-completed`;
|
158
157
|
$390add5aac6e4d73$export$d35bc1e505d1ebbf = `Y9ExmG_is-disabled`;
|
159
|
-
$390add5aac6e4d73$export$ad416fbde92db390 = `Y9ExmG_is-emphasized`;
|
160
158
|
$390add5aac6e4d73$export$b8813cd5d7824ce7 = `Y9ExmG_is-hovered`;
|
161
159
|
$390add5aac6e4d73$export$a4561bd665abb5db = `Y9ExmG_is-reversed`;
|
162
160
|
$390add5aac6e4d73$export$1e0fb04f31d3c22a = `Y9ExmG_is-selected`;
|
163
161
|
$390add5aac6e4d73$export$1237798dc640739a = `Y9ExmG_label`;
|
164
162
|
$390add5aac6e4d73$export$53f1d5ea8de3d7c = `Y9ExmG_line`;
|
165
|
-
$390add5aac6e4d73$export$
|
166
|
-
$390add5aac6e4d73$export$98e628dec113755e = `Y9ExmG_number`;
|
163
|
+
$390add5aac6e4d73$export$ffc4d0086f1a4c9 = `Y9ExmG_marker`;
|
167
164
|
$390add5aac6e4d73$export$4109102f950813a6 = `Y9ExmG_spectrum-FocusRing-ring`;
|
168
165
|
$390add5aac6e4d73$export$24c7f46a6e3605dd = `Y9ExmG_spectrum-FocusRing ${$390add5aac6e4d73$export$4109102f950813a6}`;
|
169
166
|
$390add5aac6e4d73$export$2927016961429360 = `Y9ExmG_spectrum-FocusRing--quiet`;
|
170
167
|
$390add5aac6e4d73$export$35315228197e36b8 = `Y9ExmG_spectrum-Steplist`;
|
171
|
-
$390add5aac6e4d73$export$
|
168
|
+
$390add5aac6e4d73$export$d2cf12460a777241 = `Y9ExmG_spectrum-Steplist--emphasized`;
|
169
|
+
$390add5aac6e4d73$export$6f0c4d0e9f29399d = `Y9ExmG_spectrum-Steplist--horizontal`;
|
172
170
|
$390add5aac6e4d73$export$b0d9d5077004711a = `Y9ExmG_spectrum-Steplist--large`;
|
173
171
|
$390add5aac6e4d73$export$9666cb7894b7712a = `Y9ExmG_spectrum-Steplist--medium`;
|
174
172
|
$390add5aac6e4d73$export$43119eed81e90e13 = `Y9ExmG_spectrum-Steplist--small`;
|
@@ -179,7 +177,9 @@ $390add5aac6e4d73$export$df6f1d30f09c136e = `Y9ExmG_spectrum-Steplist-item`;
|
|
179
177
|
$390add5aac6e4d73$export$2393468f68ff8031 = `Y9ExmG_spectrum-Steplist-label`;
|
180
178
|
$390add5aac6e4d73$export$f622f4b07b665af3 = `Y9ExmG_spectrum-Steplist-link`;
|
181
179
|
$390add5aac6e4d73$export$9d44d123fa093f85 = `Y9ExmG_spectrum-Steplist-marker`;
|
180
|
+
$390add5aac6e4d73$export$a7d0643524891b06 = `Y9ExmG_spectrum-Steplist-markerWrapper`;
|
182
181
|
$390add5aac6e4d73$export$1f36a6b1ab318f2f = `Y9ExmG_spectrum-Steplist-segment`;
|
182
|
+
$390add5aac6e4d73$export$f92a1d2b4a328a95 = `Y9ExmG_spectrum-Steplist-segmentLine`;
|
183
183
|
|
184
184
|
|
185
185
|
|
@@ -187,59 +187,77 @@ $390add5aac6e4d73$export$1f36a6b1ab318f2f = `Y9ExmG_spectrum-Steplist-segment`;
|
|
187
187
|
|
188
188
|
|
189
189
|
function $d2e2cd0667356b5d$export$87c2a8a94eda1754(props) {
|
190
|
-
let { isDisabled: isDisabled,
|
190
|
+
let { isDisabled: isDisabled, item: item } = props;
|
191
191
|
let { key: key } = item;
|
192
192
|
let ref = (0, $5XIpf$react.useRef)();
|
193
193
|
let { direction: direction } = (0, $5XIpf$reactariai18n.useLocale)();
|
194
194
|
let state = (0, $5XIpf$react.useContext)((0, $b9b57d2de2195519$export$66136572efa4af6e));
|
195
|
+
const isSelected = state.selectedKey === key;
|
195
196
|
const isCompleted = state.isCompleted(key);
|
196
197
|
const isItemDisabled = isDisabled || state.disabledKeys.has(key);
|
197
198
|
let { stepProps: stepProps, stepStateProps: stepStateProps } = (0, $5XIpf$reactariasteplist.useStepListItem)({
|
198
199
|
...props,
|
199
200
|
key: key
|
200
201
|
}, state, ref);
|
201
|
-
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $5XIpf$reactariainteractions.useHover)(
|
202
|
-
|
202
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $5XIpf$reactariainteractions.useHover)({
|
203
|
+
...props,
|
204
|
+
isDisabled: isItemDisabled || isSelected || props.isReadOnly
|
205
|
+
});
|
203
206
|
let stepStateText = "";
|
204
207
|
const stringFormatter = (0, $5XIpf$reactariai18n.useLocalizedStringFormatter)((0, $fed92386245d94a4$export$2e2bcd8739ae039));
|
205
208
|
const numberFormatter = (0, $5XIpf$reactariai18n.useNumberFormatter)();
|
206
209
|
if (isSelected) stepStateText = stringFormatter.format("current");
|
207
210
|
else if (isCompleted) stepStateText = stringFormatter.format("completed");
|
208
211
|
else stepStateText = stringFormatter.format("notCompleted");
|
212
|
+
let markerId = (0, $5XIpf$reactariautils.useId)();
|
213
|
+
let labelId = (0, $5XIpf$reactariautils.useId)();
|
209
214
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("li", {
|
210
|
-
key: key,
|
211
215
|
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-item")
|
212
216
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement((0, $5XIpf$reactariafocus.FocusRing), {
|
213
217
|
within: true,
|
214
218
|
focusRingClass: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "focus-ring")
|
215
219
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("a", {
|
216
|
-
"aria-labelledby": `step-marker-${key} step-label-${key}`,
|
217
|
-
ref: ref,
|
218
220
|
...(0, $5XIpf$reactariautils.mergeProps)(hoverProps, stepProps),
|
221
|
+
"aria-labelledby": `${markerId} ${labelId}`,
|
222
|
+
ref: ref,
|
219
223
|
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-link", {
|
220
224
|
"is-selected": isSelected && !isItemDisabled,
|
221
225
|
"is-disabled": isItemDisabled,
|
222
226
|
"is-hovered": isHovered,
|
223
|
-
"is-
|
224
|
-
"is-
|
227
|
+
"is-completed": isCompleted,
|
228
|
+
"is-selectable": state.isSelectable(key) && !isSelected
|
225
229
|
})
|
226
|
-
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement((0, $5XIpf$reactariavisuallyhidden.VisuallyHidden), stepStateProps, stepStateText), /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("
|
227
|
-
id:
|
228
|
-
"aria-hidden": "true",
|
229
|
-
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-marker")
|
230
|
-
}, numberFormatter.format((item.index || 0) + 1)), /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("span", {
|
231
|
-
id: `step-label-${key}`,
|
230
|
+
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement((0, $5XIpf$reactariavisuallyhidden.VisuallyHidden), stepStateProps, stepStateText), /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("div", {
|
231
|
+
id: labelId,
|
232
232
|
"aria-hidden": "true",
|
233
233
|
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-label")
|
234
|
-
}, item.rendered)
|
234
|
+
}, item.rendered), /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("div", {
|
235
235
|
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-segment", {
|
236
236
|
"is-completed": isCompleted
|
237
237
|
})
|
238
|
-
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement(
|
238
|
+
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("svg", {
|
239
|
+
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-segmentLine"),
|
240
|
+
xmlns: "http://www.w3.org/2000/svg",
|
241
|
+
height: "100%",
|
242
|
+
viewBox: "0 0 2 8",
|
243
|
+
preserveAspectRatio: "none"
|
244
|
+
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("line", {
|
245
|
+
x1: "1",
|
246
|
+
y1: "0",
|
247
|
+
x2: "1",
|
248
|
+
y2: "8",
|
249
|
+
vectorEffect: "non-scaling-stroke"
|
250
|
+
})), /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement((0, ($parcel$interopDefault($5XIpf$spectrumiconsuiChevronRightMedium))), {
|
239
251
|
UNSAFE_className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-chevron", {
|
240
252
|
"is-reversed": direction === "rtl"
|
241
253
|
})
|
242
|
-
})))
|
254
|
+
})), /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("div", {
|
255
|
+
id: markerId,
|
256
|
+
"aria-hidden": "true",
|
257
|
+
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-markerWrapper")
|
258
|
+
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("div", {
|
259
|
+
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist-marker")
|
260
|
+
}, numberFormatter.format((item.index || 0) + 1))))));
|
243
261
|
}
|
244
262
|
|
245
263
|
|
@@ -249,21 +267,22 @@ function $d2e2cd0667356b5d$export$87c2a8a94eda1754(props) {
|
|
249
267
|
function $a64198f1506264d6$var$StepList(props, ref) {
|
250
268
|
const { size: size = "M", orientation: orientation = "horizontal" } = props;
|
251
269
|
props = (0, $5XIpf$reactspectrumprovider.useProviderProps)(props);
|
270
|
+
const { isDisabled: isDisabled, isEmphasized: isEmphasized } = props;
|
252
271
|
let { styleProps: styleProps } = (0, $5XIpf$reactspectrumutils.useStyleProps)(props);
|
253
272
|
let domRef = (0, $5XIpf$reactspectrumutils.useDOMRef)(ref);
|
254
273
|
let state = (0, $5XIpf$reactstatelysteplist.useStepListState)(props);
|
255
274
|
let { listProps: listProps } = (0, $5XIpf$reactariasteplist.useStepList)(props, state, domRef);
|
256
|
-
const { isDisabled: isDisabled, isEmphasized: isEmphasized, isReadOnly: isReadOnly } = props;
|
257
275
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement("ol", {
|
258
276
|
...listProps,
|
259
277
|
...styleProps,
|
260
278
|
ref: domRef,
|
261
279
|
className: (0, $5XIpf$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($390add5aac6e4d73$exports))), "spectrum-Steplist", styleProps.className, {
|
262
|
-
"spectrum-Steplist--interactive": !isReadOnly && !isDisabled,
|
263
280
|
"spectrum-Steplist--small": size === "S",
|
264
281
|
"spectrum-Steplist--medium": size === "M",
|
265
282
|
"spectrum-Steplist--large": size === "L",
|
266
283
|
"spectrum-Steplist--xlarge": size === "XL",
|
284
|
+
"spectrum-Steplist--emphasized": isEmphasized,
|
285
|
+
"spectrum-Steplist--horizontal": orientation === "horizontal",
|
267
286
|
"spectrum-Steplist--vertical": orientation === "vertical"
|
268
287
|
})
|
269
288
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement((0, $b9b57d2de2195519$export$66136572efa4af6e).Provider, {
|
@@ -273,8 +292,6 @@ function $a64198f1506264d6$var$StepList(props, ref) {
|
|
273
292
|
].map((item)=>/*#__PURE__*/ (0, ($parcel$interopDefault($5XIpf$react))).createElement((0, $d2e2cd0667356b5d$export$87c2a8a94eda1754), {
|
274
293
|
key: item.key,
|
275
294
|
isDisabled: isDisabled,
|
276
|
-
isEmphasized: isEmphasized,
|
277
|
-
isReadOnly: isReadOnly,
|
278
295
|
item: item
|
279
296
|
}))));
|
280
297
|
}
|
package/dist/main.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC,GAED,0CAA0C;ACZ1C;;;;;;;;;;CAUC;;;ACVD;;;;;;;;;;CAUC;AAKM,MAAM,4CAAkB,CAAA,GAAA,sCAAI,EAAE,aAAa,CAAyB;;;ACf3E;;;;;;;;;;CAUC;;;;AEVD,4BAAiB;IAAG,aAAa,CAAC,WAAW,CAAC;IAC5C,gBAAgB,CAAC,eAAe,CAAC;IACjC,WAAW,CAAC,SAAS,CAAC;IACtB,YAAY,CAAC,SAAS,CAAC;AACzB;;;IDFA,2CAAe;IACb,SAAS,CAAA,GAAA,gEAAG;AACd;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AEJA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AA5BA,4CAA4B,CAAC,cAAc,CAAC;AAC5C,4CAA+B,CAAC,iBAAiB,CAAC;AAClD,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAAiC,CAAC,mBAAmB,CAAC;AACtD,4CAAgC,CAAC,kBAAkB,CAAC;AACpD,4CAAkC,CAAC,oBAAoB,CAAC;AACxD,4CAA+B,CAAC,iBAAiB,CAAC;AAClD,4CAAgC,CAAC,kBAAkB,CAAC;AACpD,4CAAgC,CAAC,kBAAkB,CAAC;AACpD,4CAA0B,CAAC,YAAY,CAAC;AACxC,2CAAyB,CAAC,WAAW,CAAC;AACtC,4CAAyB,CAAC,WAAW,CAAC;AACtC,4CAA2B,CAAC,aAAa,CAAC;AAC1C,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAAuC,CAAC,0BAA0B,EAAE,0CAA0C,CAAC;AAC/G,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAAsC,CAAC,wBAAwB,CAAC;AAChE,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAA2C,CAAC,6BAA6B,CAAC;AAC1E,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAA2C,CAAC,6BAA6B,CAAC;AAC1E,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAA8C,CAAC,gCAAgC,CAAC;;;;;;;AHIzE,SAAS,0CAAgB,KAAmC;IACjE,IAAI,cACF,UAAU,gBACV,YAAY,QACZ,IAAI,EACL,GAAG;IACJ,IAAI,OAAC,GAAG,EAAC,GAAG;IAEZ,IAAI,MAAM,CAAA,GAAA,mBAAK;IACf,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,8BAAQ;IAC1B,IAAI,QAAQ,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IACrC,MAAM,cAAc,MAAM,WAAW,CAAC;IACtC,MAAM,iBAAiB,cAAc,MAAM,YAAY,CAAC,GAAG,CAAC;IAC5D,IAAI,aAAC,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,wCAAc,EAAE;QAAC,GAAG,KAAK;aAAE;IAAG,GAAG,OAAO;IAE1E,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,qCAAO,EAAE;IACvC,MAAM,aAAa,MAAM,WAAW,KAAK;IAEzC,IAAI,gBAAgB;IACpB,MAAM,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,wCAAW;IAC/D,MAAM,kBAAkB,CAAA,GAAA,uCAAiB;IAEzC,IAAI,YACF,gBAAgB,gBAAgB,MAAM,CAAC;SAClC,IAAI,aACT,gBAAgB,gBAAgB,MAAM,CAAC;SAEvC,gBAAgB,gBAAgB,MAAM,CAAC;IAGzC,qBACE,0DAAC;QACC,KAAK;QACL,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,gEAAK,GACL;qBAGJ,0DAAC,CAAA,GAAA,+BAAQ;QAAE,QAAA;QAAO,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,gEAAK,GAAG;qBACnD,0DAAC;QACC,mBAAiB,CAAC,YAAY,EAAE,IAAI,YAAY,EAAE,IAAI,CAAC;QACvD,KAAK;QACJ,GAAG,CAAA,GAAA,gCAAS,EAAE,YAAY,UAAU;QACrC,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,gEAAK,GACL,0BACA;YACE,eAAe,cAAc,CAAC;YAC9B,eAAe;YACf,cAAc;YACd,iBAAiB,gBAAgB;YACjC,gBAAgB;QAClB;qBAEF,0DAAC,CAAA,GAAA,6CAAa,GAAM,gBAAiB,8BACrC,0DAAC;QAAK,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC;QAAE,eAAY;QAAO,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,gEAAK,GAAG;OAA8B,gBAAgB,MAAM,CAAC,AAAC,CAAA,KAAK,KAAK,IAAI,CAAA,IAAK,mBAC1J,0DAAC;QAAK,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC;QAAE,eAAY;QAAO,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,gEAAK,GAAG;OAC7E,KAAK,QAAQ,mBAIpB,0DAAC;QACC,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,gEAAK,GACL,6BAA6B;YAC3B,gBAAgB;QAClB;qBACF,0DAAC,CAAA,GAAA,kEAAiB;QAChB,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,gEAAK,GAAG,6BAA6B;YAChE,eAAe,cAAc;QAC/B;;AAIV;;;;;;AFnEA,SAAS,+BAA2B,KAA+B,EAAE,GAA6B;IAChG,MAAM,QAAC,OAAO,kBAAK,cAAc,cAAa,GAAG;IACjD,QAAQ,CAAA,GAAA,6CAAe,EAAE;IACzB,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,IAAI,QAAQ,CAAA,GAAA,4CAAe,EAAE;IAC7B,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,oCAAU,EAAE,OAAO,OAAO;IAE5C,MAAM,cAAC,UAAU,gBAAE,YAAY,cAAE,UAAU,EAAC,GAAG;IAE/C,qBACE,0DAAC;QACE,GAAG,SAAS;QACZ,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,gEAAK,GAAG,qBAAqB,WAAW,SAAS,EAAE;YACvE,kCAAkC,CAAC,cAAc,CAAC;YAClD,4BAA4B,SAAS;YACrC,6BAA6B,SAAS;YACtC,4BAA4B,SAAS;YACrC,6BAA6B,SAAS;YACtC,+BAA+B,gBAAgB;QACjD;qBACA,0DAAC,CAAA,GAAA,yCAAc,EAAE,QAAQ;QAAC,OAAO;OAC9B;WAAI,MAAM,UAAU;KAAC,CAAC,GAAG,CAAC,CAAC,qBAC1B,0DAAC,CAAA,GAAA,yCAAW;YACV,KAAK,KAAK,GAAG;YACb,YAAY;YACZ,cAAc;YACd,YAAY;YACZ,MAAM;;AAMlB;AAEA,MAAM,0DAAY,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC;","sources":["packages/@react-spectrum/steplist/src/index.ts","packages/@react-spectrum/steplist/src/StepList.tsx","packages/@react-spectrum/steplist/src/StepListContext.ts","packages/@react-spectrum/steplist/src/StepListItem.tsx","packages/@react-spectrum/steplist/intl/index.js","packages/@react-spectrum/steplist/intl/en-US.json","packages/@adobe/spectrum-css-temp/components/steplist/vars.css"],"sourcesContent":["/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {StepList} from './StepList';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumStepListProps} from './StepList';\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaStepListProps, useStepList} from '@react-aria/steplist';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport React, {ReactElement} from 'react';\nimport {StepListContext} from './StepListContext';\nimport {StepListItem} from './StepListItem';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useStepListState} from '@react-stately/steplist';\n\nexport interface SpectrumStepListProps<T> extends AriaStepListProps<T>, StyleProps {\n /**\n * Whether the step list should be displayed with a emphasized style.\n * @default false\n */\n isEmphasized?: boolean,\n /**\n * The orientation of the step list.\n * @default 'horizontal'\n */\n orientation?: Orientation,\n /**\n * The size of the step list.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nfunction StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef<HTMLOListElement>) {\n const {size = 'M', orientation = 'horizontal'} = props;\n props = useProviderProps(props);\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n\n let state = useStepListState(props);\n let {listProps} = useStepList(props, state, domRef);\n\n const {isDisabled, isEmphasized, isReadOnly} = props;\n\n return (\n <ol\n {...listProps}\n {...styleProps}\n ref={domRef}\n className={classNames(styles, 'spectrum-Steplist', styleProps.className, {\n 'spectrum-Steplist--interactive': !isReadOnly && !isDisabled,\n 'spectrum-Steplist--small': size === 'S',\n 'spectrum-Steplist--medium': size === 'M',\n 'spectrum-Steplist--large': size === 'L',\n 'spectrum-Steplist--xlarge': size === 'XL',\n 'spectrum-Steplist--vertical': orientation === 'vertical'\n })}>\n <StepListContext.Provider value={state}>\n {[...state.collection].map((item) => (\n <StepListItem\n key={item.key}\n isDisabled={isDisabled}\n isEmphasized={isEmphasized}\n isReadOnly={isReadOnly}\n item={item} />\n )\n )}\n </StepListContext.Provider>\n </ol>\n );\n}\n\nconst _StepList = React.forwardRef(StepList) as <T>(props: SpectrumStepListProps<T> & {ref?: DOMRef<HTMLOListElement>}) => ReactElement;\nexport {_StepList as StepList};\n","/*\n * Copyright 202 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport React from 'react';\nimport {StepListState} from '@react-stately/steplist';\n\nexport const StepListContext = React.createContext<StepListState<unknown>>(null);\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport intlMessages from '../intl';\nimport {mergeProps} from '@react-aria/utils';\nimport {Node} from '@react-types/shared';\nimport React, {useContext, useRef} from 'react';\nimport {StepListContext} from './StepListContext';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter, useNumberFormatter} from '@react-aria/i18n';\nimport {useStepListItem} from '@react-aria/steplist';\nimport {VisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface SpectrumStepListItemProps<T> {\n item: Node<T>,\n isDisabled?: boolean,\n isEmphasized?: boolean,\n isReadOnly?: boolean\n}\n\nexport function StepListItem<T>(props: SpectrumStepListItemProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n item\n } = props;\n let {key} = item;\n\n let ref = useRef();\n let {direction} = useLocale();\n let state = useContext(StepListContext);\n const isCompleted = state.isCompleted(key);\n const isItemDisabled = isDisabled || state.disabledKeys.has(key);\n let {stepProps, stepStateProps} = useStepListItem({...props, key}, state, ref);\n\n let {hoverProps, isHovered} = useHover(props);\n const isSelected = state.selectedKey === key;\n\n let stepStateText = '';\n const stringFormatter = useLocalizedStringFormatter(intlMessages);\n const numberFormatter = useNumberFormatter();\n\n if (isSelected) {\n stepStateText = stringFormatter.format('current');\n } else if (isCompleted) {\n stepStateText = stringFormatter.format('completed');\n } else {\n stepStateText = stringFormatter.format('notCompleted');\n }\n\n return (\n <li\n key={key}\n className={\n classNames(\n styles,\n 'spectrum-Steplist-item'\n )\n }>\n <FocusRing within focusRingClass={classNames(styles, 'focus-ring')}>\n <a\n aria-labelledby={`step-marker-${key} step-label-${key}`}\n ref={ref}\n {...mergeProps(hoverProps, stepProps)}\n className={classNames(\n styles,\n 'spectrum-Steplist-link',\n {\n 'is-selected': isSelected && !isItemDisabled,\n 'is-disabled': isItemDisabled,\n 'is-hovered': isHovered,\n 'is-emphasized': isEmphasized && isSelected,\n 'is-completed': isCompleted\n }\n )}>\n <VisuallyHidden {...stepStateProps}>{stepStateText}</VisuallyHidden>\n <span id={`step-marker-${key}`} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-marker')}>{numberFormatter.format((item.index || 0) + 1)}</span>\n <span id={`step-label-${key}`} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-label')}>\n {item.rendered}\n </span>\n </a>\n </FocusRing>\n <span\n className={classNames(\n styles,\n 'spectrum-Steplist-segment', {\n 'is-completed': isCompleted\n })} >\n <ChevronRightMedium\n UNSAFE_className={classNames(styles, 'spectrum-Steplist-chevron', {\n 'is-reversed': direction === 'rtl'\n })} />\n </span>\n </li>\n );\n}\n","import enUS from './en-US.json';\n\nexport default {\n 'en-US': enUS\n};\n","{\n \"completed\": \"Completed: \",\n \"notCompleted\": \"Not completed: \",\n \"current\": \"Current: \",\n \"steplist\": \"Step List\"\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/steplist/src/index.ts","packages/@react-spectrum/steplist/src/StepList.tsx","packages/@react-spectrum/steplist/src/StepListContext.ts","packages/@react-spectrum/steplist/src/StepListItem.tsx","packages/@react-spectrum/steplist/intl/index.js","packages/@react-spectrum/steplist/intl/en-US.json","packages/@adobe/spectrum-css-temp/components/steplist/vars.css"],"sourcesContent":["/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {StepList} from './StepList';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumStepListProps} from './StepList';\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaStepListProps, useStepList} from '@react-aria/steplist';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport React, {ReactElement} from 'react';\nimport {StepListContext} from './StepListContext';\nimport {StepListItem} from './StepListItem';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useStepListState} from '@react-stately/steplist';\n\nexport interface SpectrumStepListProps<T> extends AriaStepListProps<T>, StyleProps {\n /**\n * Whether the step list should be displayed with a emphasized style.\n * @default false\n */\n isEmphasized?: boolean,\n /**\n * The orientation of the step list.\n * @default 'horizontal'\n */\n orientation?: Orientation,\n /**\n * The size of the step list.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nfunction StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef<HTMLOListElement>) {\n const {size = 'M', orientation = 'horizontal'} = props;\n props = useProviderProps(props);\n const {isDisabled, isEmphasized} = props;\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n\n let state = useStepListState(props);\n let {listProps} = useStepList(props, state, domRef);\n\n\n return (\n <ol\n {...listProps}\n {...styleProps}\n ref={domRef}\n className={classNames(styles, 'spectrum-Steplist', styleProps.className, {\n 'spectrum-Steplist--small': size === 'S',\n 'spectrum-Steplist--medium': size === 'M',\n 'spectrum-Steplist--large': size === 'L',\n 'spectrum-Steplist--xlarge': size === 'XL',\n 'spectrum-Steplist--emphasized': isEmphasized,\n 'spectrum-Steplist--horizontal': orientation === 'horizontal',\n 'spectrum-Steplist--vertical': orientation === 'vertical'\n })}>\n <StepListContext.Provider value={state}>\n {[...state.collection].map((item) => (\n <StepListItem\n key={item.key}\n isDisabled={isDisabled}\n item={item} />\n )\n )}\n </StepListContext.Provider>\n </ol>\n );\n}\n\nconst _StepList = React.forwardRef(StepList) as <T>(props: SpectrumStepListProps<T> & {ref?: DOMRef<HTMLOListElement>}) => ReactElement;\nexport {_StepList as StepList};\n","/*\n * Copyright 202 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport React from 'react';\nimport {StepListState} from '@react-stately/steplist';\n\nexport const StepListContext = React.createContext<StepListState<unknown>>(null);\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport intlMessages from '../intl';\nimport {mergeProps, useId} from '@react-aria/utils';\nimport {Node} from '@react-types/shared';\nimport React, {useContext, useRef} from 'react';\nimport {StepListContext} from './StepListContext';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter, useNumberFormatter} from '@react-aria/i18n';\nimport {useStepListItem} from '@react-aria/steplist';\nimport {VisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface SpectrumStepListItemProps<T> {\n item: Node<T>,\n isDisabled?: boolean,\n isEmphasized?: boolean,\n isReadOnly?: boolean\n}\n\nexport function StepListItem<T>(props: SpectrumStepListItemProps<T>) {\n let {\n isDisabled,\n item\n } = props;\n let {key} = item;\n\n let ref = useRef();\n let {direction} = useLocale();\n let state = useContext(StepListContext);\n const isSelected = state.selectedKey === key;\n const isCompleted = state.isCompleted(key);\n const isItemDisabled = isDisabled || state.disabledKeys.has(key);\n let {stepProps, stepStateProps} = useStepListItem({...props, key}, state, ref);\n\n let {hoverProps, isHovered} = useHover({...props, isDisabled: isItemDisabled || isSelected || props.isReadOnly});\n\n\n let stepStateText = '';\n const stringFormatter = useLocalizedStringFormatter(intlMessages);\n const numberFormatter = useNumberFormatter();\n\n if (isSelected) {\n stepStateText = stringFormatter.format('current');\n } else if (isCompleted) {\n stepStateText = stringFormatter.format('completed');\n } else {\n stepStateText = stringFormatter.format('notCompleted');\n }\n\n let markerId = useId();\n let labelId = useId();\n\n return (\n <li\n className={\n classNames(\n styles,\n 'spectrum-Steplist-item'\n )\n }>\n <FocusRing within focusRingClass={classNames(styles, 'focus-ring')}>\n <a\n {...mergeProps(hoverProps, stepProps)}\n aria-labelledby={`${markerId} ${labelId}`}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Steplist-link',\n {\n 'is-selected': isSelected && !isItemDisabled,\n 'is-disabled': isItemDisabled,\n 'is-hovered': isHovered,\n 'is-completed': isCompleted,\n 'is-selectable': state.isSelectable(key) && !isSelected\n }\n )}>\n <VisuallyHidden {...stepStateProps}>{stepStateText}</VisuallyHidden>\n <div id={labelId} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-label')}>\n {item.rendered}\n </div>\n <div\n className={classNames(\n styles,\n 'spectrum-Steplist-segment', {\n 'is-completed': isCompleted\n })} >\n <svg className={classNames(styles, 'spectrum-Steplist-segmentLine')} xmlns=\"http://www.w3.org/2000/svg\" height=\"100%\" viewBox=\"0 0 2 8\" preserveAspectRatio=\"none\">\n <line x1=\"1\" y1=\"0\" x2=\"1\" y2=\"8\" vectorEffect=\"non-scaling-stroke\" />\n </svg>\n <ChevronRightMedium\n UNSAFE_className={classNames(styles, 'spectrum-Steplist-chevron', {\n 'is-reversed': direction === 'rtl'\n })} />\n </div>\n <div id={markerId} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-markerWrapper')}>\n <div className={classNames(styles, 'spectrum-Steplist-marker')}>{numberFormatter.format((item.index || 0) + 1)}</div>\n </div>\n </a>\n </FocusRing>\n </li>\n );\n}\n","import enUS from './en-US.json';\n\nexport default {\n 'en-US': enUS\n};\n","{\n \"completed\": \"Completed: \",\n \"notCompleted\": \"Not completed: \",\n \"current\": \"Current: \",\n \"steplist\": \"Step List\"\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}
|
package/dist/module.js
CHANGED
@@ -7,7 +7,7 @@ import {useProviderProps as $gZOFb$useProviderProps} from "@react-spectrum/provi
|
|
7
7
|
import {useStepListState as $gZOFb$useStepListState} from "@react-stately/steplist";
|
8
8
|
import $gZOFb$spectrumiconsuiChevronRightMedium from "@spectrum-icons/ui/ChevronRightMedium";
|
9
9
|
import {FocusRing as $gZOFb$FocusRing} from "@react-aria/focus";
|
10
|
-
import {mergeProps as $gZOFb$mergeProps} from "@react-aria/utils";
|
10
|
+
import {useId as $gZOFb$useId, mergeProps as $gZOFb$mergeProps} from "@react-aria/utils";
|
11
11
|
import {useHover as $gZOFb$useHover} from "@react-aria/interactions";
|
12
12
|
import {useLocale as $gZOFb$useLocale, useLocalizedStringFormatter as $gZOFb$useLocalizedStringFormatter, useNumberFormatter as $gZOFb$useNumberFormatter} from "@react-aria/i18n";
|
13
13
|
import {VisuallyHidden as $gZOFb$VisuallyHidden} from "@react-aria/visually-hidden";
|
@@ -90,24 +90,22 @@ var $62132693388ec24a$export$2e2bcd8739ae039 = {
|
|
90
90
|
|
91
91
|
var $b2477f17b7c66618$exports = {};
|
92
92
|
|
93
|
-
$parcel$export($b2477f17b7c66618$exports, "chevron", () => $b2477f17b7c66618$export$980c1089c0604ea3, (v) => $b2477f17b7c66618$export$980c1089c0604ea3 = v);
|
94
93
|
$parcel$export($b2477f17b7c66618$exports, "focus-ring", () => $b2477f17b7c66618$export$f39a09f249340e2a, (v) => $b2477f17b7c66618$export$f39a09f249340e2a = v);
|
95
94
|
$parcel$export($b2477f17b7c66618$exports, "i18nFontFamily", () => $b2477f17b7c66618$export$8c4ee2c50c22c514, (v) => $b2477f17b7c66618$export$8c4ee2c50c22c514 = v);
|
96
95
|
$parcel$export($b2477f17b7c66618$exports, "is-completed", () => $b2477f17b7c66618$export$7e62df9ca2e410e4, (v) => $b2477f17b7c66618$export$7e62df9ca2e410e4 = v);
|
97
96
|
$parcel$export($b2477f17b7c66618$exports, "is-disabled", () => $b2477f17b7c66618$export$d35bc1e505d1ebbf, (v) => $b2477f17b7c66618$export$d35bc1e505d1ebbf = v);
|
98
|
-
$parcel$export($b2477f17b7c66618$exports, "is-emphasized", () => $b2477f17b7c66618$export$ad416fbde92db390, (v) => $b2477f17b7c66618$export$ad416fbde92db390 = v);
|
99
97
|
$parcel$export($b2477f17b7c66618$exports, "is-hovered", () => $b2477f17b7c66618$export$b8813cd5d7824ce7, (v) => $b2477f17b7c66618$export$b8813cd5d7824ce7 = v);
|
100
98
|
$parcel$export($b2477f17b7c66618$exports, "is-reversed", () => $b2477f17b7c66618$export$a4561bd665abb5db, (v) => $b2477f17b7c66618$export$a4561bd665abb5db = v);
|
101
99
|
$parcel$export($b2477f17b7c66618$exports, "is-selected", () => $b2477f17b7c66618$export$1e0fb04f31d3c22a, (v) => $b2477f17b7c66618$export$1e0fb04f31d3c22a = v);
|
102
100
|
$parcel$export($b2477f17b7c66618$exports, "label", () => $b2477f17b7c66618$export$1237798dc640739a, (v) => $b2477f17b7c66618$export$1237798dc640739a = v);
|
103
101
|
$parcel$export($b2477f17b7c66618$exports, "line", () => $b2477f17b7c66618$export$53f1d5ea8de3d7c, (v) => $b2477f17b7c66618$export$53f1d5ea8de3d7c = v);
|
104
|
-
$parcel$export($b2477f17b7c66618$exports, "
|
105
|
-
$parcel$export($b2477f17b7c66618$exports, "number", () => $b2477f17b7c66618$export$98e628dec113755e, (v) => $b2477f17b7c66618$export$98e628dec113755e = v);
|
102
|
+
$parcel$export($b2477f17b7c66618$exports, "marker", () => $b2477f17b7c66618$export$ffc4d0086f1a4c9, (v) => $b2477f17b7c66618$export$ffc4d0086f1a4c9 = v);
|
106
103
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-FocusRing-ring", () => $b2477f17b7c66618$export$4109102f950813a6, (v) => $b2477f17b7c66618$export$4109102f950813a6 = v);
|
107
104
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-FocusRing", () => $b2477f17b7c66618$export$24c7f46a6e3605dd, (v) => $b2477f17b7c66618$export$24c7f46a6e3605dd = v);
|
108
105
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-FocusRing--quiet", () => $b2477f17b7c66618$export$2927016961429360, (v) => $b2477f17b7c66618$export$2927016961429360 = v);
|
109
106
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist", () => $b2477f17b7c66618$export$35315228197e36b8, (v) => $b2477f17b7c66618$export$35315228197e36b8 = v);
|
110
|
-
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--
|
107
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--emphasized", () => $b2477f17b7c66618$export$d2cf12460a777241, (v) => $b2477f17b7c66618$export$d2cf12460a777241 = v);
|
108
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--horizontal", () => $b2477f17b7c66618$export$6f0c4d0e9f29399d, (v) => $b2477f17b7c66618$export$6f0c4d0e9f29399d = v);
|
111
109
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--large", () => $b2477f17b7c66618$export$b0d9d5077004711a, (v) => $b2477f17b7c66618$export$b0d9d5077004711a = v);
|
112
110
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--medium", () => $b2477f17b7c66618$export$9666cb7894b7712a, (v) => $b2477f17b7c66618$export$9666cb7894b7712a = v);
|
113
111
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist--small", () => $b2477f17b7c66618$export$43119eed81e90e13, (v) => $b2477f17b7c66618$export$43119eed81e90e13 = v);
|
@@ -118,25 +116,25 @@ $parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-item", () => $b2477
|
|
118
116
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-label", () => $b2477f17b7c66618$export$2393468f68ff8031, (v) => $b2477f17b7c66618$export$2393468f68ff8031 = v);
|
119
117
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-link", () => $b2477f17b7c66618$export$f622f4b07b665af3, (v) => $b2477f17b7c66618$export$f622f4b07b665af3 = v);
|
120
118
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-marker", () => $b2477f17b7c66618$export$9d44d123fa093f85, (v) => $b2477f17b7c66618$export$9d44d123fa093f85 = v);
|
119
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-markerWrapper", () => $b2477f17b7c66618$export$a7d0643524891b06, (v) => $b2477f17b7c66618$export$a7d0643524891b06 = v);
|
121
120
|
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-segment", () => $b2477f17b7c66618$export$1f36a6b1ab318f2f, (v) => $b2477f17b7c66618$export$1f36a6b1ab318f2f = v);
|
122
|
-
|
121
|
+
$parcel$export($b2477f17b7c66618$exports, "spectrum-Steplist-segmentLine", () => $b2477f17b7c66618$export$f92a1d2b4a328a95, (v) => $b2477f17b7c66618$export$f92a1d2b4a328a95 = v);
|
123
122
|
var $b2477f17b7c66618$export$f39a09f249340e2a;
|
124
123
|
var $b2477f17b7c66618$export$8c4ee2c50c22c514;
|
125
124
|
var $b2477f17b7c66618$export$7e62df9ca2e410e4;
|
126
125
|
var $b2477f17b7c66618$export$d35bc1e505d1ebbf;
|
127
|
-
var $b2477f17b7c66618$export$ad416fbde92db390;
|
128
126
|
var $b2477f17b7c66618$export$b8813cd5d7824ce7;
|
129
127
|
var $b2477f17b7c66618$export$a4561bd665abb5db;
|
130
128
|
var $b2477f17b7c66618$export$1e0fb04f31d3c22a;
|
131
129
|
var $b2477f17b7c66618$export$1237798dc640739a;
|
132
130
|
var $b2477f17b7c66618$export$53f1d5ea8de3d7c;
|
133
|
-
var $b2477f17b7c66618$export$
|
134
|
-
var $b2477f17b7c66618$export$98e628dec113755e;
|
131
|
+
var $b2477f17b7c66618$export$ffc4d0086f1a4c9;
|
135
132
|
var $b2477f17b7c66618$export$4109102f950813a6;
|
136
133
|
var $b2477f17b7c66618$export$24c7f46a6e3605dd;
|
137
134
|
var $b2477f17b7c66618$export$2927016961429360;
|
138
135
|
var $b2477f17b7c66618$export$35315228197e36b8;
|
139
|
-
var $b2477f17b7c66618$export$
|
136
|
+
var $b2477f17b7c66618$export$d2cf12460a777241;
|
137
|
+
var $b2477f17b7c66618$export$6f0c4d0e9f29399d;
|
140
138
|
var $b2477f17b7c66618$export$b0d9d5077004711a;
|
141
139
|
var $b2477f17b7c66618$export$9666cb7894b7712a;
|
142
140
|
var $b2477f17b7c66618$export$43119eed81e90e13;
|
@@ -147,25 +145,25 @@ var $b2477f17b7c66618$export$df6f1d30f09c136e;
|
|
147
145
|
var $b2477f17b7c66618$export$2393468f68ff8031;
|
148
146
|
var $b2477f17b7c66618$export$f622f4b07b665af3;
|
149
147
|
var $b2477f17b7c66618$export$9d44d123fa093f85;
|
148
|
+
var $b2477f17b7c66618$export$a7d0643524891b06;
|
150
149
|
var $b2477f17b7c66618$export$1f36a6b1ab318f2f;
|
151
|
-
$b2477f17b7c66618$export$
|
150
|
+
var $b2477f17b7c66618$export$f92a1d2b4a328a95;
|
152
151
|
$b2477f17b7c66618$export$f39a09f249340e2a = `Y9ExmG_focus-ring`;
|
153
152
|
$b2477f17b7c66618$export$8c4ee2c50c22c514 = `Y9ExmG_i18nFontFamily`;
|
154
153
|
$b2477f17b7c66618$export$7e62df9ca2e410e4 = `Y9ExmG_is-completed`;
|
155
154
|
$b2477f17b7c66618$export$d35bc1e505d1ebbf = `Y9ExmG_is-disabled`;
|
156
|
-
$b2477f17b7c66618$export$ad416fbde92db390 = `Y9ExmG_is-emphasized`;
|
157
155
|
$b2477f17b7c66618$export$b8813cd5d7824ce7 = `Y9ExmG_is-hovered`;
|
158
156
|
$b2477f17b7c66618$export$a4561bd665abb5db = `Y9ExmG_is-reversed`;
|
159
157
|
$b2477f17b7c66618$export$1e0fb04f31d3c22a = `Y9ExmG_is-selected`;
|
160
158
|
$b2477f17b7c66618$export$1237798dc640739a = `Y9ExmG_label`;
|
161
159
|
$b2477f17b7c66618$export$53f1d5ea8de3d7c = `Y9ExmG_line`;
|
162
|
-
$b2477f17b7c66618$export$
|
163
|
-
$b2477f17b7c66618$export$98e628dec113755e = `Y9ExmG_number`;
|
160
|
+
$b2477f17b7c66618$export$ffc4d0086f1a4c9 = `Y9ExmG_marker`;
|
164
161
|
$b2477f17b7c66618$export$4109102f950813a6 = `Y9ExmG_spectrum-FocusRing-ring`;
|
165
162
|
$b2477f17b7c66618$export$24c7f46a6e3605dd = `Y9ExmG_spectrum-FocusRing ${$b2477f17b7c66618$export$4109102f950813a6}`;
|
166
163
|
$b2477f17b7c66618$export$2927016961429360 = `Y9ExmG_spectrum-FocusRing--quiet`;
|
167
164
|
$b2477f17b7c66618$export$35315228197e36b8 = `Y9ExmG_spectrum-Steplist`;
|
168
|
-
$b2477f17b7c66618$export$
|
165
|
+
$b2477f17b7c66618$export$d2cf12460a777241 = `Y9ExmG_spectrum-Steplist--emphasized`;
|
166
|
+
$b2477f17b7c66618$export$6f0c4d0e9f29399d = `Y9ExmG_spectrum-Steplist--horizontal`;
|
169
167
|
$b2477f17b7c66618$export$b0d9d5077004711a = `Y9ExmG_spectrum-Steplist--large`;
|
170
168
|
$b2477f17b7c66618$export$9666cb7894b7712a = `Y9ExmG_spectrum-Steplist--medium`;
|
171
169
|
$b2477f17b7c66618$export$43119eed81e90e13 = `Y9ExmG_spectrum-Steplist--small`;
|
@@ -176,7 +174,9 @@ $b2477f17b7c66618$export$df6f1d30f09c136e = `Y9ExmG_spectrum-Steplist-item`;
|
|
176
174
|
$b2477f17b7c66618$export$2393468f68ff8031 = `Y9ExmG_spectrum-Steplist-label`;
|
177
175
|
$b2477f17b7c66618$export$f622f4b07b665af3 = `Y9ExmG_spectrum-Steplist-link`;
|
178
176
|
$b2477f17b7c66618$export$9d44d123fa093f85 = `Y9ExmG_spectrum-Steplist-marker`;
|
177
|
+
$b2477f17b7c66618$export$a7d0643524891b06 = `Y9ExmG_spectrum-Steplist-markerWrapper`;
|
179
178
|
$b2477f17b7c66618$export$1f36a6b1ab318f2f = `Y9ExmG_spectrum-Steplist-segment`;
|
179
|
+
$b2477f17b7c66618$export$f92a1d2b4a328a95 = `Y9ExmG_spectrum-Steplist-segmentLine`;
|
180
180
|
|
181
181
|
|
182
182
|
|
@@ -184,59 +184,77 @@ $b2477f17b7c66618$export$1f36a6b1ab318f2f = `Y9ExmG_spectrum-Steplist-segment`;
|
|
184
184
|
|
185
185
|
|
186
186
|
function $24c3cb1adfb0acc5$export$87c2a8a94eda1754(props) {
|
187
|
-
let { isDisabled: isDisabled,
|
187
|
+
let { isDisabled: isDisabled, item: item } = props;
|
188
188
|
let { key: key } = item;
|
189
189
|
let ref = (0, $gZOFb$useRef)();
|
190
190
|
let { direction: direction } = (0, $gZOFb$useLocale)();
|
191
191
|
let state = (0, $gZOFb$useContext)((0, $739a883ac33f90d8$export$66136572efa4af6e));
|
192
|
+
const isSelected = state.selectedKey === key;
|
192
193
|
const isCompleted = state.isCompleted(key);
|
193
194
|
const isItemDisabled = isDisabled || state.disabledKeys.has(key);
|
194
195
|
let { stepProps: stepProps, stepStateProps: stepStateProps } = (0, $gZOFb$useStepListItem)({
|
195
196
|
...props,
|
196
197
|
key: key
|
197
198
|
}, state, ref);
|
198
|
-
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $gZOFb$useHover)(
|
199
|
-
|
199
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $gZOFb$useHover)({
|
200
|
+
...props,
|
201
|
+
isDisabled: isItemDisabled || isSelected || props.isReadOnly
|
202
|
+
});
|
200
203
|
let stepStateText = "";
|
201
204
|
const stringFormatter = (0, $gZOFb$useLocalizedStringFormatter)((0, $62132693388ec24a$export$2e2bcd8739ae039));
|
202
205
|
const numberFormatter = (0, $gZOFb$useNumberFormatter)();
|
203
206
|
if (isSelected) stepStateText = stringFormatter.format("current");
|
204
207
|
else if (isCompleted) stepStateText = stringFormatter.format("completed");
|
205
208
|
else stepStateText = stringFormatter.format("notCompleted");
|
209
|
+
let markerId = (0, $gZOFb$useId)();
|
210
|
+
let labelId = (0, $gZOFb$useId)();
|
206
211
|
return /*#__PURE__*/ (0, $gZOFb$react).createElement("li", {
|
207
|
-
key: key,
|
208
212
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-item")
|
209
213
|
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$FocusRing), {
|
210
214
|
within: true,
|
211
215
|
focusRingClass: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "focus-ring")
|
212
216
|
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("a", {
|
213
|
-
"aria-labelledby": `step-marker-${key} step-label-${key}`,
|
214
|
-
ref: ref,
|
215
217
|
...(0, $gZOFb$mergeProps)(hoverProps, stepProps),
|
218
|
+
"aria-labelledby": `${markerId} ${labelId}`,
|
219
|
+
ref: ref,
|
216
220
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-link", {
|
217
221
|
"is-selected": isSelected && !isItemDisabled,
|
218
222
|
"is-disabled": isItemDisabled,
|
219
223
|
"is-hovered": isHovered,
|
220
|
-
"is-
|
221
|
-
"is-
|
224
|
+
"is-completed": isCompleted,
|
225
|
+
"is-selectable": state.isSelectable(key) && !isSelected
|
222
226
|
})
|
223
|
-
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$VisuallyHidden), stepStateProps, stepStateText), /*#__PURE__*/ (0, $gZOFb$react).createElement("
|
224
|
-
id:
|
225
|
-
"aria-hidden": "true",
|
226
|
-
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-marker")
|
227
|
-
}, numberFormatter.format((item.index || 0) + 1)), /*#__PURE__*/ (0, $gZOFb$react).createElement("span", {
|
228
|
-
id: `step-label-${key}`,
|
227
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$VisuallyHidden), stepStateProps, stepStateText), /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
228
|
+
id: labelId,
|
229
229
|
"aria-hidden": "true",
|
230
230
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-label")
|
231
|
-
}, item.rendered)
|
231
|
+
}, item.rendered), /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
232
232
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-segment", {
|
233
233
|
"is-completed": isCompleted
|
234
234
|
})
|
235
|
-
}, /*#__PURE__*/ (0, $gZOFb$react).createElement(
|
235
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("svg", {
|
236
|
+
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-segmentLine"),
|
237
|
+
xmlns: "http://www.w3.org/2000/svg",
|
238
|
+
height: "100%",
|
239
|
+
viewBox: "0 0 2 8",
|
240
|
+
preserveAspectRatio: "none"
|
241
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("line", {
|
242
|
+
x1: "1",
|
243
|
+
y1: "0",
|
244
|
+
x2: "1",
|
245
|
+
y2: "8",
|
246
|
+
vectorEffect: "non-scaling-stroke"
|
247
|
+
})), /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $gZOFb$spectrumiconsuiChevronRightMedium), {
|
236
248
|
UNSAFE_className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-chevron", {
|
237
249
|
"is-reversed": direction === "rtl"
|
238
250
|
})
|
239
|
-
})))
|
251
|
+
})), /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
252
|
+
id: markerId,
|
253
|
+
"aria-hidden": "true",
|
254
|
+
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-markerWrapper")
|
255
|
+
}, /*#__PURE__*/ (0, $gZOFb$react).createElement("div", {
|
256
|
+
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist-marker")
|
257
|
+
}, numberFormatter.format((item.index || 0) + 1))))));
|
240
258
|
}
|
241
259
|
|
242
260
|
|
@@ -246,21 +264,22 @@ function $24c3cb1adfb0acc5$export$87c2a8a94eda1754(props) {
|
|
246
264
|
function $6bd0589d5d2f8b66$var$StepList(props, ref) {
|
247
265
|
const { size: size = "M", orientation: orientation = "horizontal" } = props;
|
248
266
|
props = (0, $gZOFb$useProviderProps)(props);
|
267
|
+
const { isDisabled: isDisabled, isEmphasized: isEmphasized } = props;
|
249
268
|
let { styleProps: styleProps } = (0, $gZOFb$useStyleProps)(props);
|
250
269
|
let domRef = (0, $gZOFb$useDOMRef)(ref);
|
251
270
|
let state = (0, $gZOFb$useStepListState)(props);
|
252
271
|
let { listProps: listProps } = (0, $gZOFb$useStepList)(props, state, domRef);
|
253
|
-
const { isDisabled: isDisabled, isEmphasized: isEmphasized, isReadOnly: isReadOnly } = props;
|
254
272
|
return /*#__PURE__*/ (0, $gZOFb$react).createElement("ol", {
|
255
273
|
...listProps,
|
256
274
|
...styleProps,
|
257
275
|
ref: domRef,
|
258
276
|
className: (0, $gZOFb$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($b2477f17b7c66618$exports))), "spectrum-Steplist", styleProps.className, {
|
259
|
-
"spectrum-Steplist--interactive": !isReadOnly && !isDisabled,
|
260
277
|
"spectrum-Steplist--small": size === "S",
|
261
278
|
"spectrum-Steplist--medium": size === "M",
|
262
279
|
"spectrum-Steplist--large": size === "L",
|
263
280
|
"spectrum-Steplist--xlarge": size === "XL",
|
281
|
+
"spectrum-Steplist--emphasized": isEmphasized,
|
282
|
+
"spectrum-Steplist--horizontal": orientation === "horizontal",
|
264
283
|
"spectrum-Steplist--vertical": orientation === "vertical"
|
265
284
|
})
|
266
285
|
}, /*#__PURE__*/ (0, $gZOFb$react).createElement((0, $739a883ac33f90d8$export$66136572efa4af6e).Provider, {
|
@@ -270,8 +289,6 @@ function $6bd0589d5d2f8b66$var$StepList(props, ref) {
|
|
270
289
|
].map((item)=>/*#__PURE__*/ (0, $gZOFb$react).createElement((0, $24c3cb1adfb0acc5$export$87c2a8a94eda1754), {
|
271
290
|
key: item.key,
|
272
291
|
isDisabled: isDisabled,
|
273
|
-
isEmphasized: isEmphasized,
|
274
|
-
isReadOnly: isReadOnly,
|
275
292
|
item: item
|
276
293
|
}))));
|
277
294
|
}
|
package/dist/module.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/steplist/src/index.ts","packages/@react-spectrum/steplist/src/StepList.tsx","packages/@react-spectrum/steplist/src/StepListContext.ts","packages/@react-spectrum/steplist/src/StepListItem.tsx","packages/@react-spectrum/steplist/intl/index.js","packages/@react-spectrum/steplist/intl/en-US.json","packages/@adobe/spectrum-css-temp/components/steplist/vars.css"],"sourcesContent":["/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {StepList} from './StepList';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumStepListProps} from './StepList';\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaStepListProps, useStepList} from '@react-aria/steplist';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport React, {ReactElement} from 'react';\nimport {StepListContext} from './StepListContext';\nimport {StepListItem} from './StepListItem';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useStepListState} from '@react-stately/steplist';\n\nexport interface SpectrumStepListProps<T> extends AriaStepListProps<T>, StyleProps {\n /**\n * Whether the step list should be displayed with a emphasized style.\n * @default false\n */\n isEmphasized?: boolean,\n /**\n * The orientation of the step list.\n * @default 'horizontal'\n */\n orientation?: Orientation,\n /**\n * The size of the step list.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nfunction StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef<HTMLOListElement>) {\n const {size = 'M', orientation = 'horizontal'} = props;\n props = useProviderProps(props);\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n\n let state = useStepListState(props);\n let {listProps} = useStepList(props, state, domRef);\n\n const {isDisabled, isEmphasized, isReadOnly} = props;\n\n return (\n <ol\n {...listProps}\n {...styleProps}\n ref={domRef}\n className={classNames(styles, 'spectrum-Steplist', styleProps.className, {\n 'spectrum-Steplist--interactive': !isReadOnly && !isDisabled,\n 'spectrum-Steplist--small': size === 'S',\n 'spectrum-Steplist--medium': size === 'M',\n 'spectrum-Steplist--large': size === 'L',\n 'spectrum-Steplist--xlarge': size === 'XL',\n 'spectrum-Steplist--vertical': orientation === 'vertical'\n })}>\n <StepListContext.Provider value={state}>\n {[...state.collection].map((item) => (\n <StepListItem\n key={item.key}\n isDisabled={isDisabled}\n isEmphasized={isEmphasized}\n isReadOnly={isReadOnly}\n item={item} />\n )\n )}\n </StepListContext.Provider>\n </ol>\n );\n}\n\nconst _StepList = React.forwardRef(StepList) as <T>(props: SpectrumStepListProps<T> & {ref?: DOMRef<HTMLOListElement>}) => ReactElement;\nexport {_StepList as StepList};\n","/*\n * Copyright 202 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport React from 'react';\nimport {StepListState} from '@react-stately/steplist';\n\nexport const StepListContext = React.createContext<StepListState<unknown>>(null);\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport intlMessages from '../intl';\nimport {mergeProps} from '@react-aria/utils';\nimport {Node} from '@react-types/shared';\nimport React, {useContext, useRef} from 'react';\nimport {StepListContext} from './StepListContext';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter, useNumberFormatter} from '@react-aria/i18n';\nimport {useStepListItem} from '@react-aria/steplist';\nimport {VisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface SpectrumStepListItemProps<T> {\n item: Node<T>,\n isDisabled?: boolean,\n isEmphasized?: boolean,\n isReadOnly?: boolean\n}\n\nexport function StepListItem<T>(props: SpectrumStepListItemProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n item\n } = props;\n let {key} = item;\n\n let ref = useRef();\n let {direction} = useLocale();\n let state = useContext(StepListContext);\n const isCompleted = state.isCompleted(key);\n const isItemDisabled = isDisabled || state.disabledKeys.has(key);\n let {stepProps, stepStateProps} = useStepListItem({...props, key}, state, ref);\n\n let {hoverProps, isHovered} = useHover(props);\n const isSelected = state.selectedKey === key;\n\n let stepStateText = '';\n const stringFormatter = useLocalizedStringFormatter(intlMessages);\n const numberFormatter = useNumberFormatter();\n\n if (isSelected) {\n stepStateText = stringFormatter.format('current');\n } else if (isCompleted) {\n stepStateText = stringFormatter.format('completed');\n } else {\n stepStateText = stringFormatter.format('notCompleted');\n }\n\n return (\n <li\n key={key}\n className={\n classNames(\n styles,\n 'spectrum-Steplist-item'\n )\n }>\n <FocusRing within focusRingClass={classNames(styles, 'focus-ring')}>\n <a\n aria-labelledby={`step-marker-${key} step-label-${key}`}\n ref={ref}\n {...mergeProps(hoverProps, stepProps)}\n className={classNames(\n styles,\n 'spectrum-Steplist-link',\n {\n 'is-selected': isSelected && !isItemDisabled,\n 'is-disabled': isItemDisabled,\n 'is-hovered': isHovered,\n 'is-emphasized': isEmphasized && isSelected,\n 'is-completed': isCompleted\n }\n )}>\n <VisuallyHidden {...stepStateProps}>{stepStateText}</VisuallyHidden>\n <span id={`step-marker-${key}`} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-marker')}>{numberFormatter.format((item.index || 0) + 1)}</span>\n <span id={`step-label-${key}`} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-label')}>\n {item.rendered}\n </span>\n </a>\n </FocusRing>\n <span\n className={classNames(\n styles,\n 'spectrum-Steplist-segment', {\n 'is-completed': isCompleted\n })} >\n <ChevronRightMedium\n UNSAFE_className={classNames(styles, 'spectrum-Steplist-chevron', {\n 'is-reversed': direction === 'rtl'\n })} />\n </span>\n </li>\n );\n}\n","import enUS from './en-US.json';\n\nexport default {\n 'en-US': enUS\n};\n","{\n \"completed\": \"Completed: \",\n \"notCompleted\": \"Not completed: \",\n \"current\": \"Current: \",\n \"steplist\": \"Step List\"\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/steplist/src/index.ts","packages/@react-spectrum/steplist/src/StepList.tsx","packages/@react-spectrum/steplist/src/StepListContext.ts","packages/@react-spectrum/steplist/src/StepListItem.tsx","packages/@react-spectrum/steplist/intl/index.js","packages/@react-spectrum/steplist/intl/en-US.json","packages/@adobe/spectrum-css-temp/components/steplist/vars.css"],"sourcesContent":["/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {StepList} from './StepList';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumStepListProps} from './StepList';\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaStepListProps, useStepList} from '@react-aria/steplist';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport React, {ReactElement} from 'react';\nimport {StepListContext} from './StepListContext';\nimport {StepListItem} from './StepListItem';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useStepListState} from '@react-stately/steplist';\n\nexport interface SpectrumStepListProps<T> extends AriaStepListProps<T>, StyleProps {\n /**\n * Whether the step list should be displayed with a emphasized style.\n * @default false\n */\n isEmphasized?: boolean,\n /**\n * The orientation of the step list.\n * @default 'horizontal'\n */\n orientation?: Orientation,\n /**\n * The size of the step list.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nfunction StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef<HTMLOListElement>) {\n const {size = 'M', orientation = 'horizontal'} = props;\n props = useProviderProps(props);\n const {isDisabled, isEmphasized} = props;\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n\n let state = useStepListState(props);\n let {listProps} = useStepList(props, state, domRef);\n\n\n return (\n <ol\n {...listProps}\n {...styleProps}\n ref={domRef}\n className={classNames(styles, 'spectrum-Steplist', styleProps.className, {\n 'spectrum-Steplist--small': size === 'S',\n 'spectrum-Steplist--medium': size === 'M',\n 'spectrum-Steplist--large': size === 'L',\n 'spectrum-Steplist--xlarge': size === 'XL',\n 'spectrum-Steplist--emphasized': isEmphasized,\n 'spectrum-Steplist--horizontal': orientation === 'horizontal',\n 'spectrum-Steplist--vertical': orientation === 'vertical'\n })}>\n <StepListContext.Provider value={state}>\n {[...state.collection].map((item) => (\n <StepListItem\n key={item.key}\n isDisabled={isDisabled}\n item={item} />\n )\n )}\n </StepListContext.Provider>\n </ol>\n );\n}\n\nconst _StepList = React.forwardRef(StepList) as <T>(props: SpectrumStepListProps<T> & {ref?: DOMRef<HTMLOListElement>}) => ReactElement;\nexport {_StepList as StepList};\n","/*\n * Copyright 202 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport React from 'react';\nimport {StepListState} from '@react-stately/steplist';\n\nexport const StepListContext = React.createContext<StepListState<unknown>>(null);\n","/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport intlMessages from '../intl';\nimport {mergeProps, useId} from '@react-aria/utils';\nimport {Node} from '@react-types/shared';\nimport React, {useContext, useRef} from 'react';\nimport {StepListContext} from './StepListContext';\nimport styles from '@adobe/spectrum-css-temp/components/steplist/vars.css';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter, useNumberFormatter} from '@react-aria/i18n';\nimport {useStepListItem} from '@react-aria/steplist';\nimport {VisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface SpectrumStepListItemProps<T> {\n item: Node<T>,\n isDisabled?: boolean,\n isEmphasized?: boolean,\n isReadOnly?: boolean\n}\n\nexport function StepListItem<T>(props: SpectrumStepListItemProps<T>) {\n let {\n isDisabled,\n item\n } = props;\n let {key} = item;\n\n let ref = useRef();\n let {direction} = useLocale();\n let state = useContext(StepListContext);\n const isSelected = state.selectedKey === key;\n const isCompleted = state.isCompleted(key);\n const isItemDisabled = isDisabled || state.disabledKeys.has(key);\n let {stepProps, stepStateProps} = useStepListItem({...props, key}, state, ref);\n\n let {hoverProps, isHovered} = useHover({...props, isDisabled: isItemDisabled || isSelected || props.isReadOnly});\n\n\n let stepStateText = '';\n const stringFormatter = useLocalizedStringFormatter(intlMessages);\n const numberFormatter = useNumberFormatter();\n\n if (isSelected) {\n stepStateText = stringFormatter.format('current');\n } else if (isCompleted) {\n stepStateText = stringFormatter.format('completed');\n } else {\n stepStateText = stringFormatter.format('notCompleted');\n }\n\n let markerId = useId();\n let labelId = useId();\n\n return (\n <li\n className={\n classNames(\n styles,\n 'spectrum-Steplist-item'\n )\n }>\n <FocusRing within focusRingClass={classNames(styles, 'focus-ring')}>\n <a\n {...mergeProps(hoverProps, stepProps)}\n aria-labelledby={`${markerId} ${labelId}`}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Steplist-link',\n {\n 'is-selected': isSelected && !isItemDisabled,\n 'is-disabled': isItemDisabled,\n 'is-hovered': isHovered,\n 'is-completed': isCompleted,\n 'is-selectable': state.isSelectable(key) && !isSelected\n }\n )}>\n <VisuallyHidden {...stepStateProps}>{stepStateText}</VisuallyHidden>\n <div id={labelId} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-label')}>\n {item.rendered}\n </div>\n <div\n className={classNames(\n styles,\n 'spectrum-Steplist-segment', {\n 'is-completed': isCompleted\n })} >\n <svg className={classNames(styles, 'spectrum-Steplist-segmentLine')} xmlns=\"http://www.w3.org/2000/svg\" height=\"100%\" viewBox=\"0 0 2 8\" preserveAspectRatio=\"none\">\n <line x1=\"1\" y1=\"0\" x2=\"1\" y2=\"8\" vectorEffect=\"non-scaling-stroke\" />\n </svg>\n <ChevronRightMedium\n UNSAFE_className={classNames(styles, 'spectrum-Steplist-chevron', {\n 'is-reversed': direction === 'rtl'\n })} />\n </div>\n <div id={markerId} aria-hidden=\"true\" className={classNames(styles, 'spectrum-Steplist-markerWrapper')}>\n <div className={classNames(styles, 'spectrum-Steplist-marker')}>{numberFormatter.format((item.index || 0) + 1)}</div>\n </div>\n </a>\n </FocusRing>\n </li>\n );\n}\n","import enUS from './en-US.json';\n\nexport default {\n 'en-US': enUS\n};\n","{\n \"completed\": \"Completed: \",\n \"notCompleted\": \"Not completed: \",\n \"current\": \"Current: \",\n \"steplist\": \"Step List\"\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}
|
package/dist/types.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"mappings":";;;AGsBA,uCAAuC,CAAC,CAAE,SAAQ,kBAAkB,CAAC,CAAC,EAAE,UAAU;IAChF;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAA;CAC9B;
|
1
|
+
{"mappings":";;;AGsBA,uCAAuC,CAAC,CAAE,SAAQ,kBAAkB,CAAC,CAAC,EAAE,UAAU;IAChF;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAA;CAC9B;AAwCD,OAAA,MAAM;UAAuF,OAAO,gBAAgB,CAAC;MAAM,YAAY,CAAC;AC/DxI,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC","sources":["packages/@react-spectrum/steplist/src/packages/@react-spectrum/steplist/src/StepListContext.ts","packages/@react-spectrum/steplist/src/packages/@react-spectrum/steplist/intl/index.js","packages/@react-spectrum/steplist/src/packages/@react-spectrum/steplist/src/StepListItem.tsx","packages/@react-spectrum/steplist/src/packages/@react-spectrum/steplist/src/StepList.tsx","packages/@react-spectrum/steplist/src/packages/@react-spectrum/steplist/src/index.ts","packages/@react-spectrum/steplist/src/index.ts"],"sourcesContent":[null,null,null,null,null,"/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {StepList} from './StepList';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumStepListProps} from './StepList';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@react-spectrum/steplist",
|
3
|
-
"version": "3.0.0-nightly.
|
3
|
+
"version": "3.0.0-nightly.4305+efaf9eddc",
|
4
4
|
"description": "Spectrum UI components in React",
|
5
5
|
"license": "Apache-2.0",
|
6
6
|
"main": "dist/main.js",
|
@@ -36,21 +36,21 @@
|
|
36
36
|
"url": "https://github.com/adobe/react-spectrum"
|
37
37
|
},
|
38
38
|
"dependencies": {
|
39
|
-
"@react-aria/focus": "3.0.0-nightly.
|
40
|
-
"@react-aria/i18n": "3.0.0-nightly.
|
41
|
-
"@react-aria/interactions": "3.0.0-nightly.
|
42
|
-
"@react-aria/steplist": "3.0.0-nightly.
|
43
|
-
"@react-aria/utils": "3.0.0-nightly.
|
44
|
-
"@react-aria/visually-hidden": "3.0.0-nightly.
|
45
|
-
"@react-spectrum/utils": "3.0.0-nightly.
|
46
|
-
"@react-stately/collections": "3.0.0-nightly.
|
47
|
-
"@react-stately/steplist": "3.0.0-nightly.
|
48
|
-
"@react-types/shared": "3.0.0-nightly.
|
49
|
-
"@spectrum-icons/ui": "3.0.0-nightly.
|
39
|
+
"@react-aria/focus": "3.0.0-nightly.2594+efaf9eddc",
|
40
|
+
"@react-aria/i18n": "3.0.0-nightly.2594+efaf9eddc",
|
41
|
+
"@react-aria/interactions": "3.0.0-nightly.2594+efaf9eddc",
|
42
|
+
"@react-aria/steplist": "3.0.0-nightly.4305+efaf9eddc",
|
43
|
+
"@react-aria/utils": "3.0.0-nightly.2594+efaf9eddc",
|
44
|
+
"@react-aria/visually-hidden": "3.0.0-nightly.2594+efaf9eddc",
|
45
|
+
"@react-spectrum/utils": "3.0.0-nightly.2594+efaf9eddc",
|
46
|
+
"@react-stately/collections": "3.0.0-nightly.2594+efaf9eddc",
|
47
|
+
"@react-stately/steplist": "3.0.0-nightly.4305+efaf9eddc",
|
48
|
+
"@react-types/shared": "3.0.0-nightly.2594+efaf9eddc",
|
49
|
+
"@spectrum-icons/ui": "3.0.0-nightly.2594+efaf9eddc",
|
50
50
|
"@swc/helpers": "^0.5.0"
|
51
51
|
},
|
52
52
|
"devDependencies": {
|
53
|
-
"@adobe/spectrum-css-temp": "3.0.0-nightly.
|
53
|
+
"@adobe/spectrum-css-temp": "3.0.0-nightly.2594+efaf9eddc"
|
54
54
|
},
|
55
55
|
"peerDependencies": {
|
56
56
|
"@react-spectrum/provider": "^3.0.0",
|
@@ -60,5 +60,5 @@
|
|
60
60
|
"publishConfig": {
|
61
61
|
"access": "public"
|
62
62
|
},
|
63
|
-
"gitHead": "
|
63
|
+
"gitHead": "efaf9eddc5c83bfb73ec2de2bf31b355187acfb4"
|
64
64
|
}
|
package/src/StepList.tsx
CHANGED
@@ -41,13 +41,13 @@ export interface SpectrumStepListProps<T> extends AriaStepListProps<T>, StylePro
|
|
41
41
|
function StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef<HTMLOListElement>) {
|
42
42
|
const {size = 'M', orientation = 'horizontal'} = props;
|
43
43
|
props = useProviderProps(props);
|
44
|
+
const {isDisabled, isEmphasized} = props;
|
44
45
|
let {styleProps} = useStyleProps(props);
|
45
46
|
let domRef = useDOMRef(ref);
|
46
47
|
|
47
48
|
let state = useStepListState(props);
|
48
49
|
let {listProps} = useStepList(props, state, domRef);
|
49
50
|
|
50
|
-
const {isDisabled, isEmphasized, isReadOnly} = props;
|
51
51
|
|
52
52
|
return (
|
53
53
|
<ol
|
@@ -55,11 +55,12 @@ function StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef
|
|
55
55
|
{...styleProps}
|
56
56
|
ref={domRef}
|
57
57
|
className={classNames(styles, 'spectrum-Steplist', styleProps.className, {
|
58
|
-
'spectrum-Steplist--interactive': !isReadOnly && !isDisabled,
|
59
58
|
'spectrum-Steplist--small': size === 'S',
|
60
59
|
'spectrum-Steplist--medium': size === 'M',
|
61
60
|
'spectrum-Steplist--large': size === 'L',
|
62
61
|
'spectrum-Steplist--xlarge': size === 'XL',
|
62
|
+
'spectrum-Steplist--emphasized': isEmphasized,
|
63
|
+
'spectrum-Steplist--horizontal': orientation === 'horizontal',
|
63
64
|
'spectrum-Steplist--vertical': orientation === 'vertical'
|
64
65
|
})}>
|
65
66
|
<StepListContext.Provider value={state}>
|
@@ -67,8 +68,6 @@ function StepList<T extends object>(props: SpectrumStepListProps<T>, ref: DOMRef
|
|
67
68
|
<StepListItem
|
68
69
|
key={item.key}
|
69
70
|
isDisabled={isDisabled}
|
70
|
-
isEmphasized={isEmphasized}
|
71
|
-
isReadOnly={isReadOnly}
|
72
71
|
item={item} />
|
73
72
|
)
|
74
73
|
)}
|
package/src/StepListItem.tsx
CHANGED
@@ -13,7 +13,7 @@ import ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';
|
|
13
13
|
import {classNames} from '@react-spectrum/utils';
|
14
14
|
import {FocusRing} from '@react-aria/focus';
|
15
15
|
import intlMessages from '../intl';
|
16
|
-
import {mergeProps} from '@react-aria/utils';
|
16
|
+
import {mergeProps, useId} from '@react-aria/utils';
|
17
17
|
import {Node} from '@react-types/shared';
|
18
18
|
import React, {useContext, useRef} from 'react';
|
19
19
|
import {StepListContext} from './StepListContext';
|
@@ -33,7 +33,6 @@ interface SpectrumStepListItemProps<T> {
|
|
33
33
|
export function StepListItem<T>(props: SpectrumStepListItemProps<T>) {
|
34
34
|
let {
|
35
35
|
isDisabled,
|
36
|
-
isEmphasized,
|
37
36
|
item
|
38
37
|
} = props;
|
39
38
|
let {key} = item;
|
@@ -41,12 +40,13 @@ export function StepListItem<T>(props: SpectrumStepListItemProps<T>) {
|
|
41
40
|
let ref = useRef();
|
42
41
|
let {direction} = useLocale();
|
43
42
|
let state = useContext(StepListContext);
|
43
|
+
const isSelected = state.selectedKey === key;
|
44
44
|
const isCompleted = state.isCompleted(key);
|
45
45
|
const isItemDisabled = isDisabled || state.disabledKeys.has(key);
|
46
46
|
let {stepProps, stepStateProps} = useStepListItem({...props, key}, state, ref);
|
47
47
|
|
48
|
-
let {hoverProps, isHovered} = useHover(props);
|
49
|
-
|
48
|
+
let {hoverProps, isHovered} = useHover({...props, isDisabled: isItemDisabled || isSelected || props.isReadOnly});
|
49
|
+
|
50
50
|
|
51
51
|
let stepStateText = '';
|
52
52
|
const stringFormatter = useLocalizedStringFormatter(intlMessages);
|
@@ -60,9 +60,11 @@ export function StepListItem<T>(props: SpectrumStepListItemProps<T>) {
|
|
60
60
|
stepStateText = stringFormatter.format('notCompleted');
|
61
61
|
}
|
62
62
|
|
63
|
+
let markerId = useId();
|
64
|
+
let labelId = useId();
|
65
|
+
|
63
66
|
return (
|
64
67
|
<li
|
65
|
-
key={key}
|
66
68
|
className={
|
67
69
|
classNames(
|
68
70
|
styles,
|
@@ -71,9 +73,9 @@ export function StepListItem<T>(props: SpectrumStepListItemProps<T>) {
|
|
71
73
|
}>
|
72
74
|
<FocusRing within focusRingClass={classNames(styles, 'focus-ring')}>
|
73
75
|
<a
|
74
|
-
aria-labelledby={`step-marker-${key} step-label-${key}`}
|
75
|
-
ref={ref}
|
76
76
|
{...mergeProps(hoverProps, stepProps)}
|
77
|
+
aria-labelledby={`${markerId} ${labelId}`}
|
78
|
+
ref={ref}
|
77
79
|
className={classNames(
|
78
80
|
styles,
|
79
81
|
'spectrum-Steplist-link',
|
@@ -81,28 +83,33 @@ export function StepListItem<T>(props: SpectrumStepListItemProps<T>) {
|
|
81
83
|
'is-selected': isSelected && !isItemDisabled,
|
82
84
|
'is-disabled': isItemDisabled,
|
83
85
|
'is-hovered': isHovered,
|
84
|
-
'is-
|
85
|
-
'is-
|
86
|
+
'is-completed': isCompleted,
|
87
|
+
'is-selectable': state.isSelectable(key) && !isSelected
|
86
88
|
}
|
87
89
|
)}>
|
88
90
|
<VisuallyHidden {...stepStateProps}>{stepStateText}</VisuallyHidden>
|
89
|
-
<
|
90
|
-
<span id={`step-label-${key}`} aria-hidden="true" className={classNames(styles, 'spectrum-Steplist-label')}>
|
91
|
+
<div id={labelId} aria-hidden="true" className={classNames(styles, 'spectrum-Steplist-label')}>
|
91
92
|
{item.rendered}
|
92
|
-
</
|
93
|
+
</div>
|
94
|
+
<div
|
95
|
+
className={classNames(
|
96
|
+
styles,
|
97
|
+
'spectrum-Steplist-segment', {
|
98
|
+
'is-completed': isCompleted
|
99
|
+
})} >
|
100
|
+
<svg className={classNames(styles, 'spectrum-Steplist-segmentLine')} xmlns="http://www.w3.org/2000/svg" height="100%" viewBox="0 0 2 8" preserveAspectRatio="none">
|
101
|
+
<line x1="1" y1="0" x2="1" y2="8" vectorEffect="non-scaling-stroke" />
|
102
|
+
</svg>
|
103
|
+
<ChevronRightMedium
|
104
|
+
UNSAFE_className={classNames(styles, 'spectrum-Steplist-chevron', {
|
105
|
+
'is-reversed': direction === 'rtl'
|
106
|
+
})} />
|
107
|
+
</div>
|
108
|
+
<div id={markerId} aria-hidden="true" className={classNames(styles, 'spectrum-Steplist-markerWrapper')}>
|
109
|
+
<div className={classNames(styles, 'spectrum-Steplist-marker')}>{numberFormatter.format((item.index || 0) + 1)}</div>
|
110
|
+
</div>
|
93
111
|
</a>
|
94
112
|
</FocusRing>
|
95
|
-
<span
|
96
|
-
className={classNames(
|
97
|
-
styles,
|
98
|
-
'spectrum-Steplist-segment', {
|
99
|
-
'is-completed': isCompleted
|
100
|
-
})} >
|
101
|
-
<ChevronRightMedium
|
102
|
-
UNSAFE_className={classNames(styles, 'spectrum-Steplist-chevron', {
|
103
|
-
'is-reversed': direction === 'rtl'
|
104
|
-
})} />
|
105
|
-
</span>
|
106
113
|
</li>
|
107
114
|
);
|
108
115
|
}
|