@aurodesignsystem-dev/auro-formkit 0.0.0-pr1424.2 → 0.0.0-pr1424.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/CHANGELOG.md +2 -2
  2. package/README.md +133 -183
  3. package/components/checkbox/demo/api.min.js +3 -3
  4. package/components/checkbox/demo/index.min.js +3 -3
  5. package/components/checkbox/dist/index.js +3 -3
  6. package/components/checkbox/dist/registered.js +3 -3
  7. package/components/combobox/demo/api.html +1 -0
  8. package/components/combobox/demo/api.js +3 -1
  9. package/components/combobox/demo/api.md +75 -0
  10. package/components/combobox/demo/api.min.js +314 -172
  11. package/components/combobox/demo/index.min.js +301 -171
  12. package/components/combobox/dist/comboboxKeyboardStrategy.d.ts +1 -1
  13. package/components/combobox/dist/index.js +291 -171
  14. package/components/combobox/dist/registered.js +291 -171
  15. package/components/counter/demo/api.html +3 -0
  16. package/components/counter/demo/api.js +4 -0
  17. package/components/counter/demo/api.md +130 -0
  18. package/components/counter/demo/api.min.js +320 -167
  19. package/components/counter/demo/index.min.js +300 -167
  20. package/components/counter/dist/counterGroupKeyboardStrategy.d.ts +3 -0
  21. package/components/counter/dist/index.js +300 -167
  22. package/components/counter/dist/registered.js +300 -167
  23. package/components/datepicker/demo/api.html +1 -0
  24. package/components/datepicker/demo/api.js +2 -0
  25. package/components/datepicker/demo/api.md +57 -0
  26. package/components/datepicker/demo/api.min.js +376 -171
  27. package/components/datepicker/demo/index.min.js +364 -171
  28. package/components/datepicker/dist/datepickerKeyboardStrategy.d.ts +3 -1
  29. package/components/datepicker/dist/index.js +364 -171
  30. package/components/datepicker/dist/registered.js +364 -171
  31. package/components/dropdown/demo/api.html +1 -0
  32. package/components/dropdown/demo/api.js +2 -0
  33. package/components/dropdown/demo/api.md +95 -0
  34. package/components/dropdown/demo/api.min.js +296 -165
  35. package/components/dropdown/demo/index.min.js +276 -165
  36. package/components/dropdown/dist/index.js +276 -165
  37. package/components/dropdown/dist/registered.js +276 -165
  38. package/components/form/demo/api.min.js +1254 -684
  39. package/components/form/demo/index.min.js +1254 -684
  40. package/components/input/demo/api.min.js +1 -1
  41. package/components/input/demo/index.min.js +1 -1
  42. package/components/input/dist/index.js +1 -1
  43. package/components/input/dist/registered.js +1 -1
  44. package/components/menu/demo/api.md +1 -0
  45. package/components/menu/demo/api.min.js +10 -0
  46. package/components/menu/demo/index.min.js +10 -0
  47. package/components/menu/dist/auro-menuoption.d.ts +9 -0
  48. package/components/menu/dist/index.js +10 -0
  49. package/components/menu/dist/registered.js +10 -0
  50. package/components/radio/demo/api.min.js +2 -2
  51. package/components/radio/demo/index.min.js +2 -2
  52. package/components/radio/dist/index.js +2 -2
  53. package/components/radio/dist/registered.js +2 -2
  54. package/components/select/demo/api.html +1 -0
  55. package/components/select/demo/api.js +2 -0
  56. package/components/select/demo/api.md +76 -0
  57. package/components/select/demo/api.min.js +306 -169
  58. package/components/select/demo/index.min.js +293 -169
  59. package/components/select/dist/index.js +283 -169
  60. package/components/select/dist/registered.js +283 -169
  61. package/custom-elements.json +48 -3
  62. package/package.json +5 -3
@@ -2440,7 +2440,7 @@
2440
2440
  "type": {
2441
2441
  "text": "object"
2442
2442
  },
2443
- "default": "{ ArrowDown(component, evt, ctx) { // If the clear button has focus, let the browser handle ArrowDown normally. if (isClearBtnFocused(ctx)) { return; } // option display and navigation are prevented if there are no available options if (component.availableOptions.length > 0) { evt.preventDefault(); // navigate if bib is open otherwise open it if (component.dropdown.isPopoverVisible) { if (evt.altKey || evt.metaKey) { component.activateLastEnabledAvailableOption(); } else { navigateArrow(component, 'down'); } } else { component.showBib(); } } }, ArrowUp(component, evt, ctx) { // If the clear button has focus, let the browser handle ArrowUp normally. if (isClearBtnFocused(ctx)) { return; } // option display and navigation are prevented if there are no available options if (component.availableOptions.length > 0) { evt.preventDefault(); // navigate if bib is open otherwise open it if (component.dropdown.isPopoverVisible) { if (evt.altKey || evt.metaKey) { component.activateFirstEnabledAvailableOption(); } else { navigateArrow(component, 'up'); } } else { component.showBib(); } } }, End(component, evt, ctx) { if (ctx.isExpanded) { evt.preventDefault(); evt.stopPropagation(); component.activateLastEnabledAvailableOption(); } }, Enter(component, evt, ctx) { if (isClearBtnFocused(ctx)) { // If the clear button has focus, let the browser activate it normally. // stopPropagation prevents parent containers (e.g., forms) from treating // Enter as a submit, but we must NOT call preventDefault — that would // block the browser's built-in \"Enter activates focused button\" behavior. evt.stopPropagation(); } else if (ctx.isExpanded && component.menu.optionActive) { component.menu.makeSelection(); if (ctx.isModal) { component.setTriggerInputFocus(); } evt.preventDefault(); evt.stopPropagation(); } else { // Prevent the keypress from bubbling to parent containers (e.g., forms) // which could interpret Enter as a submit or trigger other unintended behavior. // This is safe because showBib() opens the dialog programmatically, // not via event propagation. evt.preventDefault(); evt.stopPropagation(); component.showBib(); } }, Escape(component, _evt, ctx) { if (ctx.isExpanded && ctx.isModal) { component.setTriggerInputFocus(); } }, Home(component, evt, ctx) { if (ctx.isExpanded) { evt.preventDefault(); evt.stopPropagation(); component.activateFirstEnabledAvailableOption(); } }, Tab(component, evt, ctx) { if (ctx.isExpanded && !isClearBtnFocused(ctx)) { // When the clear button is focused, Tab events do not bubble out of // its shadow DOM, so this handler only fires when the clear button // is NOT focused. In that case, select the active option and close. component.menu.makeSelection(); component.hideBib(); // In fullscreen modal mode, closing the dialog does not // automatically restores focus to the input. In the tab case, // Explicitly move focus to the trigger's clear button so the // user can continues tabbing through the page normally. if (ctx.isModal && !evt.shiftKey) { component.setClearBtnFocus(); } } }, }"
2443
+ "default": "{ ArrowDown(component, evt, ctx) { // If the clear button has focus, let the browser handle ArrowDown normally. if (isClearBtnFocused(ctx)) { return; } // option display and navigation are prevented if there are no available options if (component.availableOptions.length > 0) { evt.preventDefault(); // navigate if bib is open otherwise open it if (component.dropdown.isPopoverVisible) { if (evt.altKey || evt.metaKey) { component.activateLastEnabledAvailableOption(); } else { navigateArrow(component, 'down'); } } else { component.showBib(); } } }, ArrowUp(component, evt, ctx) { // If the clear button has focus, let the browser handle ArrowUp normally. if (isClearBtnFocused(ctx)) { return; } // option display and navigation are prevented if there are no available options if (component.availableOptions.length > 0) { evt.preventDefault(); // navigate if bib is open otherwise open it if (component.dropdown.isPopoverVisible) { if (evt.altKey || evt.metaKey) { component.activateFirstEnabledAvailableOption(); } else { navigateArrow(component, 'up'); } } else { component.showBib(); } } }, End(component, evt, ctx) { if (ctx.isExpanded) { evt.preventDefault(); evt.stopPropagation(); component.activateLastEnabledAvailableOption(); } }, Enter(component, evt, ctx) { if (isClearBtnFocused(ctx)) { // If the clear button has focus, let the browser activate it normally. // stopPropagation prevents parent containers (e.g., forms) from treating // Enter as a submit, but we must NOT call preventDefault — that would // block the browser's built-in \"Enter activates focused button\" behavior. evt.stopPropagation(); } else if (ctx.isExpanded && component.menu.optionActive) { component.menu.makeSelection(); if (ctx.isModal) { component.setTriggerInputFocus(); } evt.preventDefault(); evt.stopPropagation(); } else { // Prevent the keypress from bubbling to parent containers (e.g., forms) // which could interpret Enter as a submit or trigger other unintended behavior. // This is safe because showBib() opens the dialog programmatically, // not via event propagation. evt.preventDefault(); evt.stopPropagation(); component.showBib(); } }, Escape(component, evt, ctx) { if (!ctx.isExpanded) { return; } // Prevent the Escape key from bubbling up and closing any parent dialogs / drawers / popups evt.stopPropagation(); if (ctx.isModal) { component.setTriggerInputFocus(); } component.hideBib(); }, Home(component, evt, ctx) { if (ctx.isExpanded) { evt.preventDefault(); evt.stopPropagation(); component.activateFirstEnabledAvailableOption(); } }, Tab(component, evt, ctx) { if (ctx.isExpanded && !isClearBtnFocused(ctx)) { // When the clear button is focused, Tab events do not bubble out of // its shadow DOM, so this handler only fires when the clear button // is NOT focused. In that case, select the active option and close. component.menu.makeSelection(); component.hideBib(); // In fullscreen modal mode, closing the dialog does not // automatically restores focus to the input. In the tab case, // Explicitly move focus to the trigger's clear button so the // user can continues tabbing through the page normally. if (ctx.isModal && !evt.shiftKey) { component.setClearBtnFocus(); } } }, }"
2444
2444
  }
2445
2445
  ],
2446
2446
  "exports": [
@@ -4056,6 +4056,30 @@
4056
4056
  }
4057
4057
  ]
4058
4058
  },
4059
+ {
4060
+ "kind": "javascript-module",
4061
+ "path": "components/counter/src/counterGroupKeyboardStrategy.js",
4062
+ "declarations": [
4063
+ {
4064
+ "kind": "variable",
4065
+ "name": "counterGroupKeyboardStrategy",
4066
+ "type": {
4067
+ "text": "object"
4068
+ },
4069
+ "default": "{ Escape(component, evt) { if (!component.dropdown || !component.dropdown.isPopoverVisible) { return; } // Prevent the Escape key from bubbling up and closing any parent dialogs / drawers / popups. // Because stopPropagation prevents the document-level floatingUI keydown handler from // seeing this event, we must also close the dropdown explicitly. evt.stopPropagation(); component.dropdown.hide(); }, }"
4070
+ }
4071
+ ],
4072
+ "exports": [
4073
+ {
4074
+ "kind": "js",
4075
+ "name": "counterGroupKeyboardStrategy",
4076
+ "declaration": {
4077
+ "name": "counterGroupKeyboardStrategy",
4078
+ "module": "components/counter/src/counterGroupKeyboardStrategy.js"
4079
+ }
4080
+ }
4081
+ ]
4082
+ },
4059
4083
  {
4060
4084
  "kind": "javascript-module",
4061
4085
  "path": "components/counter/src/iconVersion.js",
@@ -7123,7 +7147,7 @@
7123
7147
  "type": {
7124
7148
  "text": "object"
7125
7149
  },
7126
- "default": "{}"
7150
+ "default": "{ Escape(component, evt) { if (!component.dropdown || !component.dropdown.isPopoverVisible) { return; } // Prevent the Escape key from bubbling up and closing any parent dialogs / drawers / popups. // Because stopPropagation prevents the document-level floatingUI keydown handler from // seeing this event, we must also close the dropdown explicitly. evt.stopPropagation(); component.dropdown.hide(); }, }"
7127
7151
  }
7128
7152
  ],
7129
7153
  "exports": [
@@ -16017,6 +16041,18 @@
16017
16041
  "attribute": "disabled",
16018
16042
  "reflects": true
16019
16043
  },
16044
+ {
16045
+ "kind": "field",
16046
+ "name": "noMatch",
16047
+ "privacy": "public",
16048
+ "type": {
16049
+ "text": "boolean"
16050
+ },
16051
+ "description": "When true, marks this option as the \"no matching results\" placeholder shown by combobox when the user's input does not match any available options. Enables distinct styling and prevents the option from being treated as a selectable match.",
16052
+ "default": "false",
16053
+ "attribute": "nomatch",
16054
+ "reflects": true
16055
+ },
16020
16056
  {
16021
16057
  "kind": "field",
16022
16058
  "name": "runtimeUtils",
@@ -16240,6 +16276,15 @@
16240
16276
  "default": "false",
16241
16277
  "fieldName": "noCheckmark"
16242
16278
  },
16279
+ {
16280
+ "name": "nomatch",
16281
+ "type": {
16282
+ "text": "boolean"
16283
+ },
16284
+ "description": "When true, marks this option as the \"no matching results\" placeholder shown by combobox when the user's input does not match any available options. Enables distinct styling and prevents the option from being treated as a selectable match.",
16285
+ "default": "false",
16286
+ "fieldName": "noMatch"
16287
+ },
16243
16288
  {
16244
16289
  "name": "selected",
16245
16290
  "type": {
@@ -18769,7 +18814,7 @@
18769
18814
  "type": {
18770
18815
  "text": "object"
18771
18816
  },
18772
- "default": "{ ArrowDown(component, evt, ctx) { evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to last enabled option selectKeyboardStrategy.End(component, evt, ctx); return; } navigateArrow(component, 'down', { ctx, showFn: () => component.dropdown.show(), }); }, ArrowUp(component, evt, ctx) { evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to first enabled option selectKeyboardStrategy.Home(component, evt, ctx); return; } navigateArrow(component, 'up', { ctx, showFn: () => component.dropdown.show(), }); }, Escape(component, evt, ctx) { if (!ctx.isExpanded) { return; } component.dropdown.hide(); }, End(component, evt, ctx) { if (!ctx.isExpanded) { return; } evt.preventDefault(); evt.stopPropagation(); const lastOption = [...component.menu.menuService.menuOptions].reverse().find((option) => !option.disabled); if (lastOption) { component.menu.updateActiveOption(lastOption); } }, Enter(component, evt, ctx) { evt.preventDefault(); evt.stopPropagation(); if (!ctx.isExpanded) { component.dropdown.show(); return; } component.menu.makeSelection(); }, Home(component, evt, ctx) { if (!ctx.isExpanded) { return; } evt.preventDefault(); evt.stopPropagation(); const firstOption = component.menu.menuService.menuOptions.find((option) => !option.disabled); if (firstOption) { component.menu.updateActiveOption(firstOption); } }, Tab(component, evt, ctx) { if (!ctx.isExpanded) { return; } // Tab selects the focused option and closes the popup per the // WAI-ARIA APG select-only combobox / listbox pattern. if (component.optionActive) { component.menu.makeSelection(); } component.dropdown.hide(); }, default(component, evt, ctx) { component.updateActiveOptionBasedOnKey(evt.key); if (evt.key === ' ') { evt.preventDefault(); evt.stopPropagation(); if (ctx.isExpanded) { component.dropdown.hide(); return; } component.dropdown.show(); } }, }"
18817
+ "default": "{ ArrowDown(component, evt, ctx) { evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to last enabled option selectKeyboardStrategy.End(component, evt, ctx); return; } navigateArrow(component, 'down', { ctx, showFn: () => component.dropdown.show(), }); }, ArrowUp(component, evt, ctx) { evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to first enabled option selectKeyboardStrategy.Home(component, evt, ctx); return; } navigateArrow(component, 'up', { ctx, showFn: () => component.dropdown.show(), }); }, Escape(component, evt, ctx) { if (!ctx.isExpanded) { return; } // Prevent the Escape key from bubbling up and closing any parent dialogs / drawers / popups evt.stopPropagation(); component.dropdown.hide(); }, End(component, evt, ctx) { if (!ctx.isExpanded) { return; } evt.preventDefault(); evt.stopPropagation(); const lastOption = [...component.menu.menuService.menuOptions].reverse().find((option) => !option.disabled); if (lastOption) { component.menu.updateActiveOption(lastOption); } }, Enter(component, evt, ctx) { evt.preventDefault(); evt.stopPropagation(); if (!ctx.isExpanded) { component.dropdown.show(); return; } component.menu.makeSelection(); }, Home(component, evt, ctx) { if (!ctx.isExpanded) { return; } evt.preventDefault(); evt.stopPropagation(); const firstOption = component.menu.menuService.menuOptions.find((option) => !option.disabled); if (firstOption) { component.menu.updateActiveOption(firstOption); } }, Tab(component, evt, ctx) { if (!ctx.isExpanded) { return; } // Tab selects the focused option and closes the popup per the // WAI-ARIA APG select-only combobox / listbox pattern. if (component.optionActive) { component.menu.makeSelection(); } component.dropdown.hide(); }, default(component, evt, ctx) { component.updateActiveOptionBasedOnKey(evt.key); if (evt.key === ' ') { evt.preventDefault(); evt.stopPropagation(); if (ctx.isExpanded) { component.dropdown.hide(); return; } component.dropdown.show(); } }, }"
18773
18818
  }
18774
18819
  ],
18775
18820
  "exports": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aurodesignsystem-dev/auro-formkit",
3
- "version": "0.0.0-pr1424.2",
3
+ "version": "0.0.0-pr1424.4",
4
4
  "description": "A collection of web components used to build forms.",
5
5
  "homepage": "https://github.com/AlaskaAirlines/auro-formkit#readme",
6
6
  "bugs": {
@@ -36,7 +36,7 @@
36
36
  "custom-elements.json"
37
37
  ],
38
38
  "scripts": {
39
- "build": "npm run analyze && turbo run build",
39
+ "build": "npm run analyze && npm run build:docs:kit && turbo run build",
40
40
  "build:force": "npm run analyze && turbo run build --force",
41
41
  "sass": "turbo run sass",
42
42
  "build:version": "turbo run build:version",
@@ -82,7 +82,9 @@
82
82
  "devDependencies": {
83
83
  "@aurodesignsystem/auro-accordion": "^6.1.2",
84
84
  "@aurodesignsystem/auro-button": "^12.3.2",
85
- "@aurodesignsystem/auro-library": "^5.12.0",
85
+ "@aurodesignsystem/auro-dialog": "^4.1.1",
86
+ "@aurodesignsystem/auro-drawer": "^5.1.2",
87
+ "@aurodesignsystem/auro-library": "5.12.1",
86
88
  "@aurodesignsystem/auro-loader": "^6.2.0",
87
89
  "@aurodesignsystem/build-tools": "*",
88
90
  "@aurodesignsystem/config": "*",