@nysds/components 1.18.1 → 1.18.3
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/custom-elements.json +108 -72
- package/dist/.vscode/vscode.html-custom-data.json +13 -19
- package/dist/custom-elements.json +108 -72
- package/dist/nysds.es.js +727 -673
- package/dist/nysds.es.js.map +1 -1
- package/dist/nysds.js +105 -78
- package/dist/nysds.js.map +1 -1
- package/dist/packages/mcp-server/src/lib/token-parser.d.ts +19 -31
- package/dist/packages/mcp-server/src/tools/token-tools.d.ts +2 -3
- package/dist/packages/nys-avatar/src/nys-avatar.d.ts +2 -0
- package/dist/packages/nys-backtotop/src/nys-backtotop.d.ts +3 -3
- package/dist/packages/nys-button/src/nys-button.d.ts +1 -0
- package/dist/packages/nys-checkbox/src/nys-checkbox.d.ts +2 -1
- package/dist/packages/nys-dropdownmenu/src/nys-dropdownmenu.d.ts +1 -1
- package/dist/packages/nys-globalheader/src/nys-globalheader.d.ts +3 -0
- package/dist/packages/nys-modal/src/nys-modal.d.ts +1 -0
- package/dist/packages/nys-stepper/src/nys-step.d.ts +75 -23
- package/dist/packages/nys-stepper/src/nys-stepper.d.ts +81 -9
- package/dist/packages/nys-tab/src/nys-tabgroup.d.ts +1 -0
- package/dist/packages/nys-tooltip/src/nys-tooltip.d.ts +1 -0
- package/package.json +3 -1
- package/packages/react/NysStep.d.ts +10 -12
- package/packages/react/NysStep.js +1 -12
- package/packages/react/NysStepper.d.ts +6 -6
- package/packages/react/nysds-jsx.d.ts +16 -16
- package/dist/packages/mcp-server/src/lib/format.d.ts +0 -21
|
@@ -893,6 +893,26 @@
|
|
|
893
893
|
"name": "_handleSlotChange",
|
|
894
894
|
"privacy": "private"
|
|
895
895
|
},
|
|
896
|
+
{
|
|
897
|
+
"kind": "field",
|
|
898
|
+
"name": "_cleanAriaLabel",
|
|
899
|
+
"type": {
|
|
900
|
+
"text": "string"
|
|
901
|
+
},
|
|
902
|
+
"privacy": "private",
|
|
903
|
+
"description": "Functions\n--------------------------------------------------------------------------",
|
|
904
|
+
"readonly": true
|
|
905
|
+
},
|
|
906
|
+
{
|
|
907
|
+
"kind": "method",
|
|
908
|
+
"name": "_colorStyle",
|
|
909
|
+
"privacy": "private",
|
|
910
|
+
"return": {
|
|
911
|
+
"type": {
|
|
912
|
+
"text": "string"
|
|
913
|
+
}
|
|
914
|
+
}
|
|
915
|
+
},
|
|
896
916
|
{
|
|
897
917
|
"kind": "method",
|
|
898
918
|
"name": "getContrastForeground",
|
|
@@ -1058,7 +1078,7 @@
|
|
|
1058
1078
|
"declarations": [
|
|
1059
1079
|
{
|
|
1060
1080
|
"kind": "class",
|
|
1061
|
-
"description": "A floating \"Back to top\" button that appears after scrolling. Smooth-scrolls to page top when clicked.\n\nAuto-shows after scrolling 1.5 viewports on pages 4+ screens tall. Set `visible` to force display.\nRenders as circle button on mobile. Position with `position` prop (`left` or `right`).\n\n**Placement:** For best accessibility, place as the first focusable element in the page footer.\nIf no footer exists, place at the bottom of the body tag (after main content). Floating\npositioning allows it to overlay content without taking up layout space.\n\n**Focus Management:** When clicked, after scrolling to the top, focus is
|
|
1081
|
+
"description": "A floating \"Back to top\" button that appears after scrolling. Smooth-scrolls to page top when clicked.\n\nAuto-shows after scrolling 1.5 viewports on pages 4+ screens tall. Set `visible` to force display.\nRenders as circle button on mobile. Position with `position` prop (`left` or `right`).\n\n**Placement:** For best accessibility, place as the first focusable element in the page footer.\nIf no footer exists, place at the bottom of the body tag (after main content). Floating\npositioning allows it to overlay content without taking up layout space.\n\n**Focus Management:** When clicked, after scrolling to the top, focus is moved to `<body>`.\nThis places the user before the skip-navigation link so they can re-use it to jump directly\nback to main content — and works regardless of whether the page uses `<main>` or heading landmarks.",
|
|
1062
1082
|
"name": "NysBacktotop",
|
|
1063
1083
|
"members": [
|
|
1064
1084
|
{
|
|
@@ -2246,6 +2266,19 @@
|
|
|
2246
2266
|
}
|
|
2247
2267
|
]
|
|
2248
2268
|
},
|
|
2269
|
+
{
|
|
2270
|
+
"kind": "method",
|
|
2271
|
+
"name": "_handleKeyup",
|
|
2272
|
+
"privacy": "private",
|
|
2273
|
+
"parameters": [
|
|
2274
|
+
{
|
|
2275
|
+
"name": "e",
|
|
2276
|
+
"type": {
|
|
2277
|
+
"text": "KeyboardEvent"
|
|
2278
|
+
}
|
|
2279
|
+
}
|
|
2280
|
+
]
|
|
2281
|
+
},
|
|
2249
2282
|
{
|
|
2250
2283
|
"kind": "method",
|
|
2251
2284
|
"name": "_handleAnyAttributeFunction",
|
|
@@ -2777,6 +2810,11 @@
|
|
|
2777
2810
|
"default": "false",
|
|
2778
2811
|
"attribute": "showOtherError"
|
|
2779
2812
|
},
|
|
2813
|
+
{
|
|
2814
|
+
"kind": "field",
|
|
2815
|
+
"name": "_mobileQuery",
|
|
2816
|
+
"privacy": "private"
|
|
2817
|
+
},
|
|
2780
2818
|
{
|
|
2781
2819
|
"kind": "field",
|
|
2782
2820
|
"name": "isMobile",
|
|
@@ -2889,14 +2927,14 @@
|
|
|
2889
2927
|
},
|
|
2890
2928
|
{
|
|
2891
2929
|
"kind": "field",
|
|
2892
|
-
"name": "
|
|
2893
|
-
"privacy": "private"
|
|
2930
|
+
"name": "_handleMobileQuery",
|
|
2931
|
+
"privacy": "private",
|
|
2932
|
+
"description": "Event Handlers\n--------------------------------------------------------------------------"
|
|
2894
2933
|
},
|
|
2895
2934
|
{
|
|
2896
2935
|
"kind": "method",
|
|
2897
2936
|
"name": "_emitChangeEvent",
|
|
2898
|
-
"privacy": "private"
|
|
2899
|
-
"description": "Event Handlers\n--------------------------------------------------------------------------"
|
|
2937
|
+
"privacy": "private"
|
|
2900
2938
|
},
|
|
2901
2939
|
{
|
|
2902
2940
|
"kind": "method",
|
|
@@ -5461,6 +5499,15 @@
|
|
|
5461
5499
|
"readonly": true,
|
|
5462
5500
|
"default": "4"
|
|
5463
5501
|
},
|
|
5502
|
+
{
|
|
5503
|
+
"kind": "field",
|
|
5504
|
+
"name": "_resizeObserver",
|
|
5505
|
+
"type": {
|
|
5506
|
+
"text": "ResizeObserver | null"
|
|
5507
|
+
},
|
|
5508
|
+
"privacy": "private",
|
|
5509
|
+
"default": "null"
|
|
5510
|
+
},
|
|
5464
5511
|
{
|
|
5465
5512
|
"kind": "method",
|
|
5466
5513
|
"name": "_findTrigger",
|
|
@@ -5689,11 +5736,6 @@
|
|
|
5689
5736
|
"name": "_handleMenuKeydown",
|
|
5690
5737
|
"privacy": "private"
|
|
5691
5738
|
},
|
|
5692
|
-
{
|
|
5693
|
-
"kind": "field",
|
|
5694
|
-
"name": "_handleWindowResize",
|
|
5695
|
-
"privacy": "private"
|
|
5696
|
-
},
|
|
5697
5739
|
{
|
|
5698
5740
|
"kind": "field",
|
|
5699
5741
|
"name": "_handleWindowScroll",
|
|
@@ -7211,6 +7253,16 @@
|
|
|
7211
7253
|
"kind": "method",
|
|
7212
7254
|
"name": "_getNysLogo",
|
|
7213
7255
|
"privacy": "private"
|
|
7256
|
+
},
|
|
7257
|
+
{
|
|
7258
|
+
"kind": "field",
|
|
7259
|
+
"name": "_boundClickOutside",
|
|
7260
|
+
"privacy": "private"
|
|
7261
|
+
},
|
|
7262
|
+
{
|
|
7263
|
+
"kind": "field",
|
|
7264
|
+
"name": "_boundKeyDown",
|
|
7265
|
+
"privacy": "private"
|
|
7214
7266
|
}
|
|
7215
7267
|
],
|
|
7216
7268
|
"attributes": [
|
|
@@ -7811,6 +7863,11 @@
|
|
|
7811
7863
|
"privacy": "private",
|
|
7812
7864
|
"default": "null"
|
|
7813
7865
|
},
|
|
7866
|
+
{
|
|
7867
|
+
"kind": "field",
|
|
7868
|
+
"name": "_mobileMedia",
|
|
7869
|
+
"privacy": "private"
|
|
7870
|
+
},
|
|
7814
7871
|
{
|
|
7815
7872
|
"kind": "field",
|
|
7816
7873
|
"name": "hasBodySlots",
|
|
@@ -7856,7 +7913,7 @@
|
|
|
7856
7913
|
"privacy": "private"
|
|
7857
7914
|
},
|
|
7858
7915
|
{
|
|
7859
|
-
"kind": "
|
|
7916
|
+
"kind": "field",
|
|
7860
7917
|
"name": "_handleBodySlotChange",
|
|
7861
7918
|
"privacy": "private"
|
|
7862
7919
|
},
|
|
@@ -10081,7 +10138,7 @@
|
|
|
10081
10138
|
"declarations": [
|
|
10082
10139
|
{
|
|
10083
10140
|
"kind": "class",
|
|
10084
|
-
"description": "A single step within `nys-stepper`. Represents one stage in a multi-step process.\n\nMark as `current` to indicate active progress point. Previous steps become clickable for navigation.\nSet `href` for page-based navigation or listen to `nys-step-click` for SPA routing.\n\n## Step
|
|
10141
|
+
"description": "A single step within `nys-stepper`. Represents one stage in a multi-step process.\n\nMark as `current` to indicate the active progress point. Previous steps become clickable for navigation.\nSet `href` for page-based navigation, or omit it and listen to `nys-step-click` for SPA/framework routing.\n\n## Step states\n\nThree boolean attributes control step appearance and behavior:\n\n- **`current`** — The furthest step the user has reached (the progress boundary). Only one step should\n have `current` at a time; if multiple are set the parent stepper keeps the first and removes the rest.\n Steps after `current` are not navigable and do not fire `nys-step-click`. Update `current` in your\n application state when the user advances.\n\n- **`selected`** — Which step's content is currently displayed. Defaults to the `current` step if not\n explicitly set. If `selected` is placed on a step after `current`, the stepper silently corrects it\n to match `current`. When managing state from a framework, always set `selected` explicitly — without\n it the stepper's fallback will reset in-sidebar navigation on every state update.\n\n- **`previous`** — Auto-applied by the parent stepper to every step before `current`. Do not set this\n manually. Steps with `previous` are clickable and fire `nys-step-click`.\n\n## `nys-step-click` firing conditions\n\nThe event fires only when ALL of the following are true:\n1. The step has `previous` or `current` (i.e. it is navigable).\n2. The step does NOT already have `selected` (clicking the already-viewed step is a no-op).\n\nSteps that are neither `previous` nor `current` (future steps) never fire the event.\n\n## `href` and navigation\n\nIf `href` is set, the stepper calls `window.location.href = href` after dispatching `nys-step-click`\n— but only if the event was **not canceled**. To handle navigation yourself (SPA routing, fetch, etc.),\nalways call `e.preventDefault()` in your listener. Omitting `href` entirely is simpler for SPAs.\n\n## `onClick` vs `nys-step-click`\n\nThe `onClick` property (a function reference, not a DOM attribute) is called **before** the\n`nys-step-click` event is dispatched. Use it for imperative pre-navigation logic. In React, pass it\nas the `onClick` prop on `NysStep`.\n\n## Accessibility\n- The step label renders with `role=\"button\"` and is keyboard-focusable (`tabindex=\"0\"`) for navigable\n steps (`current`, `previous`). Future steps get `tabindex=\"-1\"` and are not reachable by keyboard.\n- Enter and Space activate the step (same as click).\n- `aria-label` is set to `\"{label} Step\"` for screen reader announcement.\n\n## Common patterns\n\n**Initial state:** Set `current` on the first step. `selected` defaults to it.\n```html\n<nys-step label=\"Step 1\" current></nys-step>\n<nys-step label=\"Step 2\"></nys-step>\n```\n\n**User completed step 1, now on step 2:**\n```html\n<nys-step label=\"Step 1\"></nys-step>\n<nys-step label=\"Step 2\" current></nys-step>\n```\n\n**User went back to review step 1 (progress still at step 2):**\n```html\n<nys-step label=\"Step 1\" selected></nys-step>\n<nys-step label=\"Step 2\" current></nys-step>\n```",
|
|
10085
10142
|
"name": "NysStep",
|
|
10086
10143
|
"members": [
|
|
10087
10144
|
{
|
|
@@ -10091,7 +10148,7 @@
|
|
|
10091
10148
|
"text": "boolean"
|
|
10092
10149
|
},
|
|
10093
10150
|
"default": "false",
|
|
10094
|
-
"description": "
|
|
10151
|
+
"description": "Which step is currently being displayed. If not set, defaults to the `current` step.\nSetting this on a step after `current` is silently corrected to match `current`.\nWhen controlling state from a framework, always set this explicitly.",
|
|
10095
10152
|
"attribute": "selected",
|
|
10096
10153
|
"reflects": true
|
|
10097
10154
|
},
|
|
@@ -10102,7 +10159,7 @@
|
|
|
10102
10159
|
"text": "boolean"
|
|
10103
10160
|
},
|
|
10104
10161
|
"default": "false",
|
|
10105
|
-
"description": "
|
|
10162
|
+
"description": "The furthest step the user has reached (progress boundary). Steps before this are navigable.",
|
|
10106
10163
|
"attribute": "current",
|
|
10107
10164
|
"reflects": true
|
|
10108
10165
|
},
|
|
@@ -10123,36 +10180,16 @@
|
|
|
10123
10180
|
"text": "string"
|
|
10124
10181
|
},
|
|
10125
10182
|
"default": "\"\"",
|
|
10126
|
-
"description": "URL
|
|
10183
|
+
"description": "URL navigated to when the step is activated, via `window.location.href`.\nNavigation is suppressed if the `nys-step-click` listener calls `e.preventDefault()`.\nOmit for SPA/framework routing and handle navigation in the event listener instead.",
|
|
10127
10184
|
"attribute": "href"
|
|
10128
10185
|
},
|
|
10129
|
-
{
|
|
10130
|
-
"kind": "field",
|
|
10131
|
-
"name": "isCompactExpanded",
|
|
10132
|
-
"type": {
|
|
10133
|
-
"text": "boolean"
|
|
10134
|
-
},
|
|
10135
|
-
"default": "false",
|
|
10136
|
-
"description": "Internal: Whether parent stepper's compact view is expanded.",
|
|
10137
|
-
"attribute": "isCompactExpanded"
|
|
10138
|
-
},
|
|
10139
10186
|
{
|
|
10140
10187
|
"kind": "field",
|
|
10141
10188
|
"name": "onClick",
|
|
10142
10189
|
"type": {
|
|
10143
10190
|
"text": "(e: Event) => void | undefined"
|
|
10144
10191
|
},
|
|
10145
|
-
"description": "
|
|
10146
|
-
},
|
|
10147
|
-
{
|
|
10148
|
-
"kind": "field",
|
|
10149
|
-
"name": "stepNumber",
|
|
10150
|
-
"type": {
|
|
10151
|
-
"text": "number"
|
|
10152
|
-
},
|
|
10153
|
-
"default": "0",
|
|
10154
|
-
"description": "Step number (1-indexed). Auto-assigned by parent stepper.",
|
|
10155
|
-
"attribute": "stepNumber"
|
|
10192
|
+
"description": "Optional function called before `nys-step-click` is dispatched. Use for pre-navigation logic."
|
|
10156
10193
|
},
|
|
10157
10194
|
{
|
|
10158
10195
|
"kind": "method",
|
|
@@ -10183,7 +10220,7 @@
|
|
|
10183
10220
|
],
|
|
10184
10221
|
"events": [
|
|
10185
10222
|
{
|
|
10186
|
-
"description": "Fired when a navigable step is clicked. Detail: `{href, label}`. Cancelable.",
|
|
10223
|
+
"description": "Fired when a navigable (`previous` or `current`) non-selected step is clicked or activated by keyboard. Detail: `{ href: string, label: string }`. Cancelable — call `e.preventDefault()` to suppress `window.location.href` navigation.",
|
|
10187
10224
|
"name": "nys-step-click"
|
|
10188
10225
|
}
|
|
10189
10226
|
],
|
|
@@ -10194,7 +10231,7 @@
|
|
|
10194
10231
|
"text": "boolean"
|
|
10195
10232
|
},
|
|
10196
10233
|
"default": "false",
|
|
10197
|
-
"description": "
|
|
10234
|
+
"description": "Which step is currently being displayed. If not set, defaults to the `current` step.\nSetting this on a step after `current` is silently corrected to match `current`.\nWhen controlling state from a framework, always set this explicitly.",
|
|
10198
10235
|
"fieldName": "selected",
|
|
10199
10236
|
"propName": "selected"
|
|
10200
10237
|
},
|
|
@@ -10204,7 +10241,7 @@
|
|
|
10204
10241
|
"text": "boolean"
|
|
10205
10242
|
},
|
|
10206
10243
|
"default": "false",
|
|
10207
|
-
"description": "
|
|
10244
|
+
"description": "The furthest step the user has reached (progress boundary). Steps before this are navigable.",
|
|
10208
10245
|
"fieldName": "current",
|
|
10209
10246
|
"propName": "current"
|
|
10210
10247
|
},
|
|
@@ -10224,29 +10261,9 @@
|
|
|
10224
10261
|
"text": "string"
|
|
10225
10262
|
},
|
|
10226
10263
|
"default": "\"\"",
|
|
10227
|
-
"description": "URL
|
|
10264
|
+
"description": "URL navigated to when the step is activated, via `window.location.href`.\nNavigation is suppressed if the `nys-step-click` listener calls `e.preventDefault()`.\nOmit for SPA/framework routing and handle navigation in the event listener instead.",
|
|
10228
10265
|
"fieldName": "href",
|
|
10229
10266
|
"propName": "href"
|
|
10230
|
-
},
|
|
10231
|
-
{
|
|
10232
|
-
"name": "isCompactExpanded",
|
|
10233
|
-
"type": {
|
|
10234
|
-
"text": "boolean"
|
|
10235
|
-
},
|
|
10236
|
-
"default": "false",
|
|
10237
|
-
"description": "Internal: Whether parent stepper's compact view is expanded.",
|
|
10238
|
-
"fieldName": "isCompactExpanded",
|
|
10239
|
-
"propName": "iscompactexpanded"
|
|
10240
|
-
},
|
|
10241
|
-
{
|
|
10242
|
-
"name": "stepNumber",
|
|
10243
|
-
"type": {
|
|
10244
|
-
"text": "number"
|
|
10245
|
-
},
|
|
10246
|
-
"default": "0",
|
|
10247
|
-
"description": "Step number (1-indexed). Auto-assigned by parent stepper.",
|
|
10248
|
-
"fieldName": "stepNumber",
|
|
10249
|
-
"propName": "stepnumber"
|
|
10250
10267
|
}
|
|
10251
10268
|
],
|
|
10252
10269
|
"superclass": {
|
|
@@ -10258,9 +10275,14 @@
|
|
|
10258
10275
|
"summary": "Individual step for use within nys-stepper with navigation support.",
|
|
10259
10276
|
"examples": [
|
|
10260
10277
|
{
|
|
10261
|
-
"title": "Step with navigation",
|
|
10278
|
+
"title": "Step with page navigation",
|
|
10262
10279
|
"code": "<nys-step label=\"Personal Info\" href=\"/step-1\"></nys-step>",
|
|
10263
10280
|
"lang": "html"
|
|
10281
|
+
},
|
|
10282
|
+
{
|
|
10283
|
+
"title": "Step with SPA navigation (no href)",
|
|
10284
|
+
"code": "step.addEventListener('nys-step-click', (e) => {\ne.preventDefault(); // no href set, but good practice\nshowStepContent(e.detail.label);\n});",
|
|
10285
|
+
"lang": "js"
|
|
10264
10286
|
}
|
|
10265
10287
|
]
|
|
10266
10288
|
}
|
|
@@ -10290,15 +10312,15 @@
|
|
|
10290
10312
|
"declarations": [
|
|
10291
10313
|
{
|
|
10292
10314
|
"kind": "class",
|
|
10293
|
-
"description": "A multi-step progress indicator for forms or wizards. Manages `nys-step` children with selection and navigation.\n\nAdd `nys-step` elements as children. Mark one step as `current` to indicate progress;
|
|
10315
|
+
"description": "A multi-step progress indicator for forms or wizards. Manages `nys-step` children with selection and navigation.\n\nAdd `nys-step` elements as children. Mark one step as `current` to indicate the progress boundary; all steps\nbefore it become navigable. Compact view on mobile expands to show all steps. Use the `actions` slot for\npersistent navigation buttons (e.g., Save & Exit). Do not place the stepper inside a `<form>` element —\nput form fields in the main content area alongside it.\n\n## When to use\n- Linear, ordered forms or wizards with more than 2 sections.\n\n## When not to use\n- Forms with only 1 or 2 sections — use a simpler layout.\n- Non-linear forms where sections can be completed in any order.\n\n## Compact mode (mobile)\nOn small screens the stepper collapses to a compact view: step labels are hidden and progress\nis shown as a bar indicator with a \"Step x of y\" counter. Clicking or pressing Enter/Space on\nthe counter expands the full step list (counter text changes to \"Back to Form\"). Collapsing\nagain returns the user to the form view.\n\n## actions slot constraints\nThe `actions` slot must contain exactly one `<div>` as its direct child. That `<div>` may only\ncontain `<nys-button>` elements — any other element is removed with a console warning.\nThe stepper automatically forces `size=\"sm\"` on every button in the slot. Buttons with the\n`fullWidth` attribute get `flex: 1 1 0` injected so they share available width equally.\n\n## Multiple `current` conflict\nIf more than one `nys-step` has the `current` attribute, only the first one is kept; the rest\nare silently removed. Always mark exactly one step as `current`.\n\n## id auto-generation\nIf no `id` is provided, a unique id is generated automatically in the form\n`nys-stepper-{n}-{timestamp}`.\n\n## Accessibility\n- The compact counter is rendered as a `role=\"button\"` with `aria-expanded` and a descriptive\n `aria-label` that announces the current step (e.g., \"Expand step navigation. You are on Step 2 of 4\").\n- Keyboard: Enter or Space toggles the compact view.\n- Each `nys-step` label is keyboard-focusable and activatable for navigable steps.\n- Visual focus indicators are provided on all interactive elements.",
|
|
10294
10316
|
"name": "NysStepper",
|
|
10295
10317
|
"slots": [
|
|
10296
10318
|
{
|
|
10297
|
-
"description": "Default slot for `nys-step` elements.",
|
|
10319
|
+
"description": "Default slot for `nys-step` elements. Only `nys-step` children are accepted; others are removed.",
|
|
10298
10320
|
"name": ""
|
|
10299
10321
|
},
|
|
10300
10322
|
{
|
|
10301
|
-
"description": "
|
|
10323
|
+
"description": "Persistent navigation buttons. Must contain exactly one `<div>` wrapping only `<nys-button>` elements.",
|
|
10302
10324
|
"name": "actions"
|
|
10303
10325
|
}
|
|
10304
10326
|
],
|
|
@@ -10310,7 +10332,7 @@
|
|
|
10310
10332
|
"text": "string"
|
|
10311
10333
|
},
|
|
10312
10334
|
"default": "\"\"",
|
|
10313
|
-
"description": "Unique identifier.",
|
|
10335
|
+
"description": "Unique identifier. Auto-generated as `nys-stepper-{n}-{timestamp}` if not provided.",
|
|
10314
10336
|
"attribute": "id",
|
|
10315
10337
|
"reflects": true
|
|
10316
10338
|
},
|
|
@@ -10332,7 +10354,7 @@
|
|
|
10332
10354
|
"text": "string"
|
|
10333
10355
|
},
|
|
10334
10356
|
"default": "\"\"",
|
|
10335
|
-
"description": "Title displayed above the step counter.",
|
|
10357
|
+
"description": "Title displayed above the step list and compact counter.",
|
|
10336
10358
|
"attribute": "label"
|
|
10337
10359
|
},
|
|
10338
10360
|
{
|
|
@@ -10342,7 +10364,7 @@
|
|
|
10342
10364
|
"text": "string"
|
|
10343
10365
|
},
|
|
10344
10366
|
"default": "\"initial\"",
|
|
10345
|
-
"description": "Progress text (e.g., \"Step 2 of 5\"). Auto-
|
|
10367
|
+
"description": "Progress text displayed in compact mode (e.g., \"Step 2 of 5\"). Auto-managed — do not set manually.",
|
|
10346
10368
|
"attribute": "counterText"
|
|
10347
10369
|
},
|
|
10348
10370
|
{
|
|
@@ -10352,7 +10374,7 @@
|
|
|
10352
10374
|
"text": "boolean"
|
|
10353
10375
|
},
|
|
10354
10376
|
"default": "false",
|
|
10355
|
-
"description": "Whether compact mobile view is expanded to show all steps.",
|
|
10377
|
+
"description": "Whether compact mobile view is expanded to show all steps. Toggled by clicking the counter.",
|
|
10356
10378
|
"attribute": "isCompactExpanded",
|
|
10357
10379
|
"reflects": true
|
|
10358
10380
|
},
|
|
@@ -10419,7 +10441,7 @@
|
|
|
10419
10441
|
"text": "string"
|
|
10420
10442
|
},
|
|
10421
10443
|
"default": "\"\"",
|
|
10422
|
-
"description": "Unique identifier.",
|
|
10444
|
+
"description": "Unique identifier. Auto-generated as `nys-stepper-{n}-{timestamp}` if not provided.",
|
|
10423
10445
|
"fieldName": "id",
|
|
10424
10446
|
"propName": "id"
|
|
10425
10447
|
},
|
|
@@ -10439,7 +10461,7 @@
|
|
|
10439
10461
|
"text": "string"
|
|
10440
10462
|
},
|
|
10441
10463
|
"default": "\"\"",
|
|
10442
|
-
"description": "Title displayed above the step counter.",
|
|
10464
|
+
"description": "Title displayed above the step list and compact counter.",
|
|
10443
10465
|
"fieldName": "label",
|
|
10444
10466
|
"propName": "label"
|
|
10445
10467
|
},
|
|
@@ -10449,7 +10471,7 @@
|
|
|
10449
10471
|
"text": "string"
|
|
10450
10472
|
},
|
|
10451
10473
|
"default": "\"initial\"",
|
|
10452
|
-
"description": "Progress text (e.g., \"Step 2 of 5\"). Auto-
|
|
10474
|
+
"description": "Progress text displayed in compact mode (e.g., \"Step 2 of 5\"). Auto-managed — do not set manually.",
|
|
10453
10475
|
"fieldName": "counterText",
|
|
10454
10476
|
"propName": "countertext"
|
|
10455
10477
|
},
|
|
@@ -10459,7 +10481,7 @@
|
|
|
10459
10481
|
"text": "boolean"
|
|
10460
10482
|
},
|
|
10461
10483
|
"default": "false",
|
|
10462
|
-
"description": "Whether compact mobile view is expanded to show all steps.",
|
|
10484
|
+
"description": "Whether compact mobile view is expanded to show all steps. Toggled by clicking the counter.",
|
|
10463
10485
|
"fieldName": "isCompactExpanded",
|
|
10464
10486
|
"propName": "iscompactexpanded"
|
|
10465
10487
|
}
|
|
@@ -10486,6 +10508,11 @@
|
|
|
10486
10508
|
"title": "Navigation buttons in actions slot",
|
|
10487
10509
|
"code": "<nys-stepper label=\"Application\">\n<nys-step label=\"Step 1\"></nys-step>\n<nys-step label=\"Step 2\" current></nys-step>\n<nys-step label=\"Step 3\"></nys-step>\n<div slot=\"actions\">\n<nys-button label=\"Save and Exit\" variant=\"outline\" size=\"sm\" fullWidth></nys-button>\n</div>\n</nys-stepper>",
|
|
10488
10510
|
"lang": "html"
|
|
10511
|
+
},
|
|
10512
|
+
{
|
|
10513
|
+
"title": "SPA / programmatic navigation",
|
|
10514
|
+
"code": "let currentStep = 0; // furthest reached\nlet viewingStep = 0; // currently displayed\n\nfunction updateStepper(steps) {\nsteps.forEach((step, i) => {\nstep.toggleAttribute('current', i === currentStep);\nstep.toggleAttribute('selected', i === viewingStep);\n});\n}\n\ndocument.querySelector('nys-stepper').addEventListener('nys-step-click', (e) => {\ne.preventDefault();\nconst steps = Array.from(document.querySelectorAll('nys-step'));\nconst clicked = e.composedPath().find(el => el.tagName?.toLowerCase() === 'nys-step');\nconst index = steps.indexOf(clicked);\nif (index !== -1) { viewingStep = index; updateStepper(steps); }\n});\n\n// Advance to next step (call on form submit / \"Continue\" click)\nfunction advance(steps) {\nif (currentStep < steps.length - 1) {\ncurrentStep++;\nviewingStep = currentStep;\nupdateStepper(steps);\n}\n}",
|
|
10515
|
+
"lang": "js"
|
|
10489
10516
|
}
|
|
10490
10517
|
]
|
|
10491
10518
|
}
|
|
@@ -13424,6 +13451,15 @@
|
|
|
13424
13451
|
"privacy": "private",
|
|
13425
13452
|
"default": "null"
|
|
13426
13453
|
},
|
|
13454
|
+
{
|
|
13455
|
+
"kind": "field",
|
|
13456
|
+
"name": "_resizeObserver",
|
|
13457
|
+
"type": {
|
|
13458
|
+
"text": "ResizeObserver | null"
|
|
13459
|
+
},
|
|
13460
|
+
"privacy": "private",
|
|
13461
|
+
"default": "null"
|
|
13462
|
+
},
|
|
13427
13463
|
{
|
|
13428
13464
|
"kind": "field",
|
|
13429
13465
|
"name": "position",
|