@ons/design-system 65.1.0 → 65.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (97) hide show
  1. package/README.md +1 -0
  2. package/components/access-code/access-code.scss +3 -3
  3. package/components/access-code/example-access-code-error.njk +1 -1
  4. package/components/access-code/example-access-code.njk +1 -1
  5. package/components/accordion/example-accordion-open.njk +10 -10
  6. package/components/accordion/example-accordion.njk +1 -1
  7. package/components/address-input/example-address-input-editable.njk +2 -2
  8. package/components/address-input/example-address-input-manual.njk +3 -3
  9. package/components/address-input/example-address-input.njk +2 -2
  10. package/components/autosuggest/_autosuggest.scss +3 -8
  11. package/components/autosuggest/_macro.njk +2 -3
  12. package/components/autosuggest/autosuggest.js +2 -1
  13. package/components/autosuggest/autosuggest.spec.js +89 -55
  14. package/components/autosuggest/autosuggest.ui.js +8 -12
  15. package/components/autosuggest/example-autosuggest-country-multiple.njk +4 -3
  16. package/components/autosuggest/example-autosuggest-country.njk +1 -1
  17. package/components/back-link/example-back-link.njk +1 -1
  18. package/components/button/_button.scss +11 -14
  19. package/components/card/example-card-set-with-images.njk +3 -3
  20. package/components/card/example-card-set-with-lists.njk +3 -3
  21. package/components/card/example-card-set.njk +3 -3
  22. package/components/card/example-card.njk +1 -1
  23. package/components/checkboxes/_checkbox.scss +1 -4
  24. package/components/checkboxes/example-checkboxes-disabled.njk +3 -3
  25. package/components/checkboxes/example-checkboxes-error.njk +7 -7
  26. package/components/checkboxes/example-checkboxes-with-descriptions.njk +7 -7
  27. package/components/checkboxes/example-checkboxes-with-hidden-label.njk +9 -9
  28. package/components/checkboxes/example-checkboxes-with-revealed-checkboxes-expanded.njk +8 -8
  29. package/components/checkboxes/example-checkboxes-with-revealed-checkboxes.njk +8 -8
  30. package/components/checkboxes/example-checkboxes-with-revealed-radios-expanded.njk +8 -8
  31. package/components/checkboxes/example-checkboxes-with-revealed-radios.njk +8 -8
  32. package/components/checkboxes/example-checkboxes-with-revealed-select-expanded.njk +4 -4
  33. package/components/checkboxes/example-checkboxes-with-revealed-select.njk +4 -4
  34. package/components/checkboxes/example-checkboxes-with-revealed-text-input-expanded.njk +6 -6
  35. package/components/checkboxes/example-checkboxes-with-revealed-text-input.njk +6 -6
  36. package/components/checkboxes/example-checkboxes-with-select-all-button.njk +4 -4
  37. package/components/checkboxes/example-checkboxes-with-visible-text-input.njk +6 -6
  38. package/components/checkboxes/example-checkboxes-without-border.njk +3 -3
  39. package/components/checkboxes/example-checkboxes.njk +4 -4
  40. package/components/date-input/example-date-input-error.njk +2 -2
  41. package/components/date-input/example-date-input.njk +1 -1
  42. package/components/details/example-details-with-warning.njk +1 -1
  43. package/components/details/example-details.njk +1 -1
  44. package/components/download-resources/_download-resources.scss +3 -5
  45. package/components/duration/example-duration-error.njk +6 -6
  46. package/components/duration/example-duration.njk +5 -5
  47. package/components/external-link/example-external-link.njk +1 -1
  48. package/components/header/example-header-external-with-service-links.njk +1 -1
  49. package/components/header/example-header-internal.njk +1 -1
  50. package/components/helpers/_grid.scss +6 -0
  51. package/components/helpers/grid.njk +19 -0
  52. package/components/input/_input-type.scss +2 -8
  53. package/components/input/_input.scss +4 -3
  54. package/components/input/example-input-email.njk +1 -1
  55. package/components/input/example-input-number.njk +1 -1
  56. package/components/input/example-input-numeric-values.njk +7 -7
  57. package/components/input/example-input-text-with-character-limit-checker.njk +1 -1
  58. package/components/input/example-input-text-with-description.njk +1 -1
  59. package/components/input/example-input-text.njk +1 -1
  60. package/components/modal/_modal.scss +3 -6
  61. package/components/mutually-exclusive/example-mutually-exclusive-checkboxes.njk +6 -6
  62. package/components/mutually-exclusive/example-mutually-exclusive-date-with-error.njk +2 -2
  63. package/components/mutually-exclusive/example-mutually-exclusive-email.njk +2 -2
  64. package/components/mutually-exclusive/example-mutually-exclusive-multiple-options.njk +5 -5
  65. package/components/navigation/navigation.js +6 -2
  66. package/components/phase-banner/example-phase-banner-alpha.njk +13 -2
  67. package/components/phase-banner/example-phase-banner-beta.njk +13 -2
  68. package/components/radios/example-radios-with-clear-button-expanded.njk +9 -9
  69. package/components/radios/example-radios-with-clear-button.njk +9 -9
  70. package/components/radios/example-radios-with-descriptions.njk +5 -5
  71. package/components/radios/example-radios-with-error.njk +4 -4
  72. package/components/radios/example-radios-with-revealed-checkboxes-expanded.njk +8 -8
  73. package/components/radios/example-radios-with-revealed-checkboxes.njk +8 -8
  74. package/components/radios/example-radios-with-revealed-radios-expanded.njk +9 -9
  75. package/components/radios/example-radios-with-revealed-radios.njk +8 -8
  76. package/components/radios/example-radios-with-revealed-select-expanded.njk +5 -5
  77. package/components/radios/example-radios-with-revealed-select.njk +4 -4
  78. package/components/radios/example-radios-with-revealed-text-input-expanded.njk +9 -9
  79. package/components/radios/example-radios-with-revealed-text-input.njk +9 -9
  80. package/components/radios/example-radios-with-visible-text-input.njk +3 -3
  81. package/components/relationships/example-relationships-error.njk +13 -13
  82. package/components/relationships/example-relationships-you.njk +13 -13
  83. package/components/relationships/example-relationships.njk +13 -13
  84. package/components/select/example-select-with-error.njk +1 -1
  85. package/components/select/example-select-with-inline-label.njk +1 -1
  86. package/components/select/example-select.njk +1 -1
  87. package/components/table/_table.scss +7 -3
  88. package/components/textarea/example-textarea-error.njk +1 -1
  89. package/components/upload/example-upload-error.njk +1 -1
  90. package/components/upload/example-upload.njk +1 -1
  91. package/css/main.css +3 -3
  92. package/package.json +8 -10
  93. package/scripts/main.es5.js +1 -1
  94. package/scripts/main.js +1 -1
  95. package/scss/base/_global.scss +3 -2
  96. package/scss/main.scss +1 -0
  97. package/scss/overrides/hcm.scss +10 -10
package/components/select/example-select-with-inline-label.njk CHANGED
@@ -1,7 +1,7 @@
1
1
  {% from "components/select/_macro.njk" import onsSelect %}
2
2
  {{
3
3
  onsSelect({
4
- "id": "select",
4
+ "id": "select-example-with-inline-label",
5
5
  "name": "select",
6
6
  "classes": "ons-u-wa--@xxs",
7
7
  "label": {
package/components/select/example-select.njk CHANGED
@@ -1,7 +1,7 @@
1
1
  {% from "components/select/_macro.njk" import onsSelect %}
2
2
  {{
3
3
  onsSelect({
4
- "id": "select",
4
+ "id": "select-example",
5
5
  "name": "select",
6
6
  "label": {
7
7
  "text": "Question topic"
package/components/table/_table.scss CHANGED
@@ -115,7 +115,9 @@
115
115
  overflow-x: auto;
116
116
  width: 100%;
117
117
  &:focus {
118
- box-shadow: 0 0 0 3px var(--ons-color-page-light), 0 0 0 5px var(--ons-color-text-link-focus), 0 0 0 8px var(--ons-color-focus);
118
+ box-shadow: 0 0 0 3px var(--ons-color-page-light),
119
+ 0 0 0 5px var(--ons-color-text-link-focus),
120
+ 0 0 0 8px var(--ons-color-focus);
119
121
  outline: 3px solid transparent; // Add transparent outline because Windows High Contrast Mode doesn't show box-shadows
120
122
  outline-offset: 1px;
121
123
  }
@@ -141,13 +143,15 @@
141
143
  .ons-table__right-shadow {
142
144
  right: 0;
143
145
  &.ons-visible {
144
- box-shadow: inset -1px 0 0 0 #bfc1c3, inset -5px 0 0 0 rgba(191, 193, 195, 0.4);
146
+ box-shadow: inset -1px 0 0 0 #bfc1c3,
147
+ inset -5px 0 0 0 rgb(191 193 195 / 40%);
145
148
  }
146
149
  }
147
150
  .ons-table__left-shadow {
148
151
  left: 0;
149
152
  &.ons-visible {
150
- box-shadow: inset 1px 0 0 0 #bfc1c3, inset -5px 0 0 0 rgba(191, 193, 195, 0.4);
153
+ box-shadow: inset 1px 0 0 0 #bfc1c3,
154
+ inset -5px 0 0 0 rgb(191 193 195 / 40%);
151
155
  }
152
156
  }
153
157
  }
package/components/textarea/example-textarea-error.njk CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  {{
4
4
  onsTextarea({
5
- "id": "textarea",
5
+ "id": "textarea-error",
6
6
  "name": "feedback",
7
7
  "label": {
8
8
  "text": "Please provide some feedback",
package/components/upload/example-upload-error.njk CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  {{
4
4
  onsUpload({
5
- "id": "file",
5
+ "id": "file-example-upload-error",
6
6
  "accept": ".xls,.xlsx,.pdf",
7
7
  "label": {
8
8
  "description": "File types accepted are XLS and XLSX or PDF",
package/components/upload/example-upload.njk CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  {{
4
4
  onsUpload({
5
- "id": "file",
5
+ "id": "file-example-upload",
6
6
  "accept": ".xls,.xlsx,.pdf",
7
7
  "label": {
8
8
  "description": "File types accepted are XLS and XLSX or PDF",