@aurodesignsystem-dev/auro-formkit 0.0.0-pr784.0 → 0.0.0-pr785.0

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 (71) hide show
  1. package/components/checkbox/demo/api.html +10 -16
  2. package/components/checkbox/demo/api.min.js +7 -18
  3. package/components/checkbox/demo/index.html +10 -16
  4. package/components/checkbox/demo/index.min.js +7 -18
  5. package/components/checkbox/demo/readme.html +9 -16
  6. package/components/checkbox/dist/index.js +7 -18
  7. package/components/checkbox/dist/registered.js +7 -18
  8. package/components/combobox/demo/api.html +10 -16
  9. package/components/combobox/demo/api.md +0 -1
  10. package/components/combobox/demo/api.min.js +20 -58
  11. package/components/combobox/demo/index.html +10 -16
  12. package/components/combobox/demo/index.min.js +20 -58
  13. package/components/combobox/demo/readme.html +9 -16
  14. package/components/combobox/dist/auro-combobox.d.ts +0 -5
  15. package/components/combobox/dist/index.js +20 -58
  16. package/components/combobox/dist/registered.js +20 -58
  17. package/components/counter/demo/api.html +10 -16
  18. package/components/counter/demo/api.min.js +8 -19
  19. package/components/counter/demo/index.html +10 -16
  20. package/components/counter/demo/index.min.js +8 -19
  21. package/components/counter/demo/readme.html +9 -16
  22. package/components/counter/dist/index.js +8 -19
  23. package/components/counter/dist/registered.js +8 -19
  24. package/components/datepicker/demo/api.html +10 -16
  25. package/components/datepicker/demo/api.md +1 -2
  26. package/components/datepicker/demo/api.min.js +68 -58
  27. package/components/datepicker/demo/index.html +10 -16
  28. package/components/datepicker/demo/index.min.js +68 -58
  29. package/components/datepicker/demo/readme.html +9 -16
  30. package/components/datepicker/dist/auro-datepicker.d.ts +18 -6
  31. package/components/datepicker/dist/index.js +68 -58
  32. package/components/datepicker/dist/registered.js +68 -58
  33. package/components/dropdown/demo/api.html +10 -16
  34. package/components/dropdown/demo/api.min.js +3 -3
  35. package/components/dropdown/demo/index.html +10 -16
  36. package/components/dropdown/demo/index.min.js +3 -3
  37. package/components/dropdown/demo/readme.html +9 -16
  38. package/components/dropdown/dist/index.js +3 -3
  39. package/components/dropdown/dist/registered.js +3 -3
  40. package/components/form/demo/api.html +9 -16
  41. package/components/form/demo/autocomplete.html +3 -19
  42. package/components/form/demo/index.html +9 -16
  43. package/components/form/demo/readme.html +9 -16
  44. package/components/form/demo/working.html +13 -19
  45. package/components/input/demo/api.html +10 -16
  46. package/components/input/demo/api.md +1 -2
  47. package/components/input/demo/api.min.js +9 -27
  48. package/components/input/demo/index.html +10 -16
  49. package/components/input/demo/index.min.js +9 -27
  50. package/components/input/demo/readme.html +9 -16
  51. package/components/input/dist/base-input.d.ts +1 -5
  52. package/components/input/dist/index.js +9 -27
  53. package/components/input/dist/registered.js +9 -27
  54. package/components/menu/demo/api.html +32 -16
  55. package/components/menu/demo/index.html +10 -16
  56. package/components/menu/demo/readme.html +9 -16
  57. package/components/radio/demo/api.html +10 -16
  58. package/components/radio/demo/api.min.js +5 -16
  59. package/components/radio/demo/index.html +10 -16
  60. package/components/radio/demo/index.min.js +5 -16
  61. package/components/radio/demo/readme.html +9 -16
  62. package/components/radio/dist/index.js +5 -16
  63. package/components/radio/dist/registered.js +5 -16
  64. package/components/select/demo/api.html +10 -16
  65. package/components/select/demo/api.min.js +8 -19
  66. package/components/select/demo/index.html +11 -16
  67. package/components/select/demo/index.min.js +8 -19
  68. package/components/select/demo/readme.html +9 -16
  69. package/components/select/dist/index.js +8 -19
  70. package/components/select/dist/registered.js +8 -19
  71. package/package.json +3 -4
@@ -16,24 +16,17 @@
16
16
  <head>
17
17
  <meta charset="UTF-8" />
18
18
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
19
- <title>Auro Web Component Demo | auro-select</title>
20
-
21
- <!-- Prism.js Stylesheet -->
22
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
23
-
24
- <!-- Legacy reference is still needed to support auro-select's use of legacy token values at this time -->
25
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
26
-
27
- <!-- Design Token Alaska Theme -->
28
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/themes/alaska/CSSCustomProperties--alaska.min.css"/>
29
-
30
- <!-- Webcore Stylesheet Alaska Theme -->
31
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
32
-
33
- <!-- Demo Specific Styles -->
19
+ <title>Auro Web Component Generator | auro-select custom element</title>
20
+ <link
21
+ rel="stylesheet"
22
+ type="text/css"
23
+ href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"
24
+ />
25
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css">
26
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/alaska/CSSCustomProperties--alaska.css">
34
27
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
35
28
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
36
- </head>
29
+ </head>
37
30
  <body class="auro-markdown">
38
31
  <main></main>
39
32
 
@@ -808,24 +808,13 @@ class AuroFormValidation {
808
808
  this.getInputElements(elem);
809
809
  this.getAuroInputs(elem);
810
810
 
811
- // Check if validation should run
811
+ // Validate only if noValidate is not true and the input does not have focus
812
812
  let validationShouldRun =
813
-
814
- // If the validation was forced
815
813
  force ||
816
-
817
- // If the validation should run on input
818
- elem.validateOnInput ||
819
-
820
- // State-based checks
821
- (
822
- // Element is not currently focused
823
- !elem.contains(document.activeElement) && // native input is not focused directly
824
- !document.activeElement.shadowRoot?.contains(elem) && // native input is not focused in the shadow DOM of another component
825
-
826
- // And element has been touched or is untouched but has a value
827
- ( elem.touched || (!elem.touched && typeof elem.value !== "undefined") )
828
- );
814
+ (!elem.contains(document.activeElement) &&
815
+ (elem.touched ||
816
+ (!elem.touched && typeof elem.value !== "undefined"))) ||
817
+ elem.validateOnInput;
829
818
 
830
819
  if (elem.hasAttribute('error')) {
831
820
  elem.validity = 'customError';
@@ -2687,7 +2676,7 @@ class AuroFloatingUI {
2687
2676
  */
2688
2677
  mirrorSize() {
2689
2678
  // mirror the boxsize from bibSizer
2690
- if (this.element.bibSizer) {
2679
+ if (this.element.bibSizer && this.element.matchWidth) {
2691
2680
  const sizerStyle = window.getComputedStyle(this.element.bibSizer);
2692
2681
  const bibContent = this.element.bib.shadowRoot.querySelector(".container");
2693
2682
  if (sizerStyle.width !== '0px') {
@@ -2899,7 +2888,7 @@ class AuroFloatingUI {
2899
2888
  if (this.element.contains(activeElement) || this.element.bib?.contains(activeElement)) {
2900
2889
  return;
2901
2890
  }
2902
-
2891
+
2903
2892
  // if fullscreen bib is in fullscreen mode, do not close
2904
2893
  if (this.element.bib.hasAttribute('isfullscreen')) {
2905
2894
  return;
@@ -3087,7 +3076,7 @@ class AuroFloatingUI {
3087
3076
 
3088
3077
  event.preventDefault();
3089
3078
  this.handleClick();
3090
- }
3079
+ }
3091
3080
  break;
3092
3081
  case 'mouseenter':
3093
3082
  if (this.element.hoverToggle) {
@@ -808,24 +808,13 @@ class AuroFormValidation {
808
808
  this.getInputElements(elem);
809
809
  this.getAuroInputs(elem);
810
810
 
811
- // Check if validation should run
811
+ // Validate only if noValidate is not true and the input does not have focus
812
812
  let validationShouldRun =
813
-
814
- // If the validation was forced
815
813
  force ||
816
-
817
- // If the validation should run on input
818
- elem.validateOnInput ||
819
-
820
- // State-based checks
821
- (
822
- // Element is not currently focused
823
- !elem.contains(document.activeElement) && // native input is not focused directly
824
- !document.activeElement.shadowRoot?.contains(elem) && // native input is not focused in the shadow DOM of another component
825
-
826
- // And element has been touched or is untouched but has a value
827
- ( elem.touched || (!elem.touched && typeof elem.value !== "undefined") )
828
- );
814
+ (!elem.contains(document.activeElement) &&
815
+ (elem.touched ||
816
+ (!elem.touched && typeof elem.value !== "undefined"))) ||
817
+ elem.validateOnInput;
829
818
 
830
819
  if (elem.hasAttribute('error')) {
831
820
  elem.validity = 'customError';
@@ -2687,7 +2676,7 @@ class AuroFloatingUI {
2687
2676
  */
2688
2677
  mirrorSize() {
2689
2678
  // mirror the boxsize from bibSizer
2690
- if (this.element.bibSizer) {
2679
+ if (this.element.bibSizer && this.element.matchWidth) {
2691
2680
  const sizerStyle = window.getComputedStyle(this.element.bibSizer);
2692
2681
  const bibContent = this.element.bib.shadowRoot.querySelector(".container");
2693
2682
  if (sizerStyle.width !== '0px') {
@@ -2899,7 +2888,7 @@ class AuroFloatingUI {
2899
2888
  if (this.element.contains(activeElement) || this.element.bib?.contains(activeElement)) {
2900
2889
  return;
2901
2890
  }
2902
-
2891
+
2903
2892
  // if fullscreen bib is in fullscreen mode, do not close
2904
2893
  if (this.element.bib.hasAttribute('isfullscreen')) {
2905
2894
  return;
@@ -3087,7 +3076,7 @@ class AuroFloatingUI {
3087
3076
 
3088
3077
  event.preventDefault();
3089
3078
  this.handleClick();
3090
- }
3079
+ }
3091
3080
  break;
3092
3081
  case 'mouseenter':
3093
3082
  if (this.element.hoverToggle) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aurodesignsystem-dev/auro-formkit",
3
- "version": "0.0.0-pr784.0",
3
+ "version": "0.0.0-pr785.0",
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": {
@@ -49,11 +49,10 @@
49
49
  "sweep": "find ./components ./packages -type d -name 'dist' -exec rm -rf {} + && find ./ -type d -name '.turbo' -exec rm -rf {} + && find ./components ./packages -not -path '*/node_modules/*' -type f \\( -name '*.css' -o -name '*-css.js' \\) -delete",
50
50
  "preCommit": "node ./node_modules/@aurodesignsystem/auro-library/scripts/build/pre-commit.mjs",
51
51
  "prepare": "husky",
52
- "deploy-demo": "npm run build && sh ./deploy-components.sh",
53
- "local-demo": "npm run build && sh ./local-demo.sh --zip"
52
+ "deploy-demo": "npm run build && sh ./deploy-components.sh"
54
53
  },
55
54
  "dependencies": {
56
- "@aurodesignsystem/auro-library": "^5.2.2",
55
+ "@aurodesignsystem/auro-library": "^5.2.3",
57
56
  "@lit/reactive-element": "^2.1.0",
58
57
  "lit": "^3.2.1"
59
58
  },