@orange-halo/components 2.0.0 → 2.2.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 (100) hide show
  1. package/custom-elements.json +3551 -73
  2. package/dist/base.d.ts.map +1 -1
  3. package/dist/base.js +1 -2
  4. package/dist/base.js.map +1 -1
  5. package/dist/index.d.ts +9 -1
  6. package/dist/index.d.ts.map +1 -1
  7. package/dist/index.js +6 -0
  8. package/dist/index.js.map +1 -1
  9. package/dist/oh-accordion.d.ts.map +1 -1
  10. package/dist/oh-accordion.js +38 -30
  11. package/dist/oh-accordion.js.map +1 -1
  12. package/dist/oh-alert.d.ts.map +1 -1
  13. package/dist/oh-alert.js +74 -32
  14. package/dist/oh-alert.js.map +1 -1
  15. package/dist/oh-badge.d.ts.map +1 -1
  16. package/dist/oh-badge.js +3 -3
  17. package/dist/oh-badge.js.map +1 -1
  18. package/dist/oh-breadcrumb.d.ts.map +1 -1
  19. package/dist/oh-breadcrumb.js +39 -20
  20. package/dist/oh-breadcrumb.js.map +1 -1
  21. package/dist/oh-button.d.ts +1 -1
  22. package/dist/oh-button.d.ts.map +1 -1
  23. package/dist/oh-button.figma.js +1 -3
  24. package/dist/oh-button.figma.js.map +1 -1
  25. package/dist/oh-button.js +83 -51
  26. package/dist/oh-button.js.map +1 -1
  27. package/dist/oh-card.d.ts.map +1 -1
  28. package/dist/oh-card.js +48 -57
  29. package/dist/oh-card.js.map +1 -1
  30. package/dist/oh-checkbox-group.d.ts.map +1 -1
  31. package/dist/oh-checkbox-group.figma.js +1 -1
  32. package/dist/oh-checkbox-group.figma.js.map +1 -1
  33. package/dist/oh-checkbox-group.js +46 -23
  34. package/dist/oh-checkbox-group.js.map +1 -1
  35. package/dist/oh-checkbox.d.ts +2 -2
  36. package/dist/oh-checkbox.d.ts.map +1 -1
  37. package/dist/oh-checkbox.js +56 -29
  38. package/dist/oh-checkbox.js.map +1 -1
  39. package/dist/oh-drawer.d.ts.map +1 -1
  40. package/dist/oh-drawer.js +21 -10
  41. package/dist/oh-drawer.js.map +1 -1
  42. package/dist/oh-footer.d.ts +5 -0
  43. package/dist/oh-footer.d.ts.map +1 -1
  44. package/dist/oh-footer.js +5 -0
  45. package/dist/oh-footer.js.map +1 -1
  46. package/dist/oh-grid.d.ts.map +1 -1
  47. package/dist/oh-grid.js +1 -2
  48. package/dist/oh-grid.js.map +1 -1
  49. package/dist/oh-hero.d.ts +5 -0
  50. package/dist/oh-hero.d.ts.map +1 -1
  51. package/dist/oh-hero.js +8 -1
  52. package/dist/oh-hero.js.map +1 -1
  53. package/dist/oh-icon.d.ts.map +1 -1
  54. package/dist/oh-icon.js +7 -5
  55. package/dist/oh-icon.js.map +1 -1
  56. package/dist/oh-input.d.ts +11 -6
  57. package/dist/oh-input.d.ts.map +1 -1
  58. package/dist/oh-input.figma.js +2 -2
  59. package/dist/oh-input.figma.js.map +1 -1
  60. package/dist/oh-input.js +38 -21
  61. package/dist/oh-input.js.map +1 -1
  62. package/dist/oh-link.d.ts.map +1 -1
  63. package/dist/oh-link.js +59 -32
  64. package/dist/oh-link.js.map +1 -1
  65. package/dist/oh-modal.d.ts +8 -2
  66. package/dist/oh-modal.d.ts.map +1 -1
  67. package/dist/oh-modal.js +60 -30
  68. package/dist/oh-modal.js.map +1 -1
  69. package/dist/oh-navbar.d.ts.map +1 -1
  70. package/dist/oh-navbar.js +2 -1
  71. package/dist/oh-navbar.js.map +1 -1
  72. package/dist/oh-progress.d.ts.map +1 -1
  73. package/dist/oh-progress.js +5 -3
  74. package/dist/oh-progress.js.map +1 -1
  75. package/dist/oh-radio-group.d.ts.map +1 -1
  76. package/dist/oh-radio-group.js +58 -27
  77. package/dist/oh-radio-group.js.map +1 -1
  78. package/dist/oh-radio.d.ts +1 -1
  79. package/dist/oh-radio.d.ts.map +1 -1
  80. package/dist/oh-radio.js +57 -29
  81. package/dist/oh-radio.js.map +1 -1
  82. package/dist/oh-select.d.ts +3 -2
  83. package/dist/oh-select.d.ts.map +1 -1
  84. package/dist/oh-select.js +88 -48
  85. package/dist/oh-select.js.map +1 -1
  86. package/dist/oh-skip-link.d.ts.map +1 -1
  87. package/dist/oh-skip-link.js +8 -10
  88. package/dist/oh-skip-link.js.map +1 -1
  89. package/dist/oh-tabs.d.ts.map +1 -1
  90. package/dist/oh-tabs.js +34 -25
  91. package/dist/oh-tabs.js.map +1 -1
  92. package/dist/oh-textarea.d.ts +98 -0
  93. package/dist/oh-textarea.d.ts.map +1 -0
  94. package/dist/oh-textarea.js +370 -0
  95. package/dist/oh-textarea.js.map +1 -0
  96. package/dist/oh-toggle.d.ts.map +1 -1
  97. package/dist/oh-toggle.js +29 -14
  98. package/dist/oh-toggle.js.map +1 -1
  99. package/dist/styles/typography.js +5 -5
  100. package/package.json +15 -4
@@ -102,11 +102,12 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
102
102
  width: 24px;
103
103
  height: 24px;
104
104
  flex-shrink: 0;
105
- border: var(--oh-input-base-border-width) solid var(--oh-color-border-emphasis);
105
+ border: var(--oh-stroke-control) solid var(--oh-color-border-emphasis);
106
106
  border-radius: var(--oh-shape-pill);
107
107
  background-color: var(--oh-color-surface-base);
108
- box-shadow: 3px 3px 0 0 var(--oh-shadow-secondary);
109
- transition:
108
+ box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md)
109
+ 0 0 var(--oh-shadow-secondary);
110
+ transition:
110
111
  transform var(--oh-motion-snappy) var(--oh-motion-ease-playful),
111
112
  box-shadow var(--oh-motion-snappy) var(--oh-motion-ease-playful),
112
113
  background-color var(--oh-motion-quick) ease,
@@ -114,7 +115,7 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
114
115
  }
115
116
 
116
117
  .radio-circle::after {
117
- content: '';
118
+ content: "";
118
119
  position: absolute;
119
120
  top: 50%;
120
121
  left: 50%;
@@ -123,7 +124,8 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
123
124
  background-color: var(--oh-color-text-on-brand);
124
125
  border-radius: var(--oh-shape-pill);
125
126
  transform: translate(-50%, -50%) scale(0);
126
- transition: transform var(--oh-motion-snappy) var(--oh-motion-ease-playful);
127
+ transition: transform var(--oh-motion-snappy)
128
+ var(--oh-motion-ease-playful);
127
129
  }
128
130
 
129
131
  .option-label {
@@ -141,21 +143,24 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
141
143
  /* Hover: lift up-left, shadow grows */
142
144
  .radio-option:hover .radio-circle {
143
145
  border-color: var(--oh-color-border-hover);
144
- transform: translate(-1px, -1px);
145
- box-shadow: 4px 4px 0 0 var(--oh-shadow-secondary);
146
+ transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
147
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
148
+ 0 0 var(--oh-shadow-secondary);
146
149
  }
147
150
 
148
151
  /* Active: press down-right, shadow shrinks */
149
152
  .radio-option:active .radio-circle {
150
- transform: translate(1px, 1px);
151
- box-shadow: 1px 1px 0 0 var(--oh-shadow-secondary);
153
+ transform: translate(var(--oh-lift-press-sm), var(--oh-lift-press-sm));
154
+ box-shadow: var(--oh-elevation-offset-xs) var(--oh-elevation-offset-xs)
155
+ 0 0 var(--oh-shadow-secondary);
152
156
  }
153
157
 
154
158
  /* Checked: primary color with warm shadow */
155
159
  .native-radio:checked + .radio-circle {
156
160
  background-color: var(--oh-color-brand-primary);
157
161
  border-color: var(--oh-color-brand-primary);
158
- box-shadow: 3px 3px 0 0 var(--oh-shadow-primary);
162
+ box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md)
163
+ 0 0 var(--oh-shadow-primary);
159
164
  }
160
165
 
161
166
  .native-radio:checked + .radio-circle::after {
@@ -166,15 +171,17 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
166
171
  .radio-option:hover .native-radio:checked + .radio-circle {
167
172
  background-color: var(--oh-color-brand-primary-hover);
168
173
  border-color: var(--oh-color-brand-primary-hover);
169
- transform: translate(-1px, -1px);
170
- box-shadow: 4px 4px 0 0 var(--oh-shadow-primary);
174
+ transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
175
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
176
+ 0 0 var(--oh-shadow-primary);
171
177
  }
172
178
 
173
179
  /* Checked + Active */
174
180
  .radio-option:active .native-radio:checked + .radio-circle {
175
181
  background-color: var(--oh-color-brand-primary-active);
176
- transform: translate(1px, 1px);
177
- box-shadow: 1px 1px 0 0 var(--oh-shadow-primary);
182
+ transform: translate(var(--oh-lift-press-sm), var(--oh-lift-press-sm));
183
+ box-shadow: var(--oh-elevation-offset-xs) var(--oh-elevation-offset-xs)
184
+ 0 0 var(--oh-shadow-primary);
178
185
  }
179
186
 
180
187
  /* Focus: underline the label (accessible indicator) */
@@ -195,12 +202,14 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
195
202
 
196
203
  :host([error]) .radio-circle {
197
204
  border-color: var(--oh-color-feedback-error);
198
- box-shadow: 3px 3px 0 0 var(--oh-shadow-error);
205
+ box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md)
206
+ 0 0 var(--oh-shadow-error);
199
207
  }
200
208
 
201
209
  :host([error]) .radio-option:hover .radio-circle {
202
210
  border-color: var(--oh-color-feedback-error-hover);
203
- box-shadow: 4px 4px 0 0 var(--oh-shadow-error);
211
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
212
+ 0 0 var(--oh-shadow-error);
204
213
  }
205
214
 
206
215
  .error-message {
@@ -243,7 +252,8 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
243
252
  this._focusedValue = null;
244
253
  }
245
254
  willUpdate(changed) {
246
- if (this.hasUpdated && (changed.has("error") || changed.has("errorMessage"))) {
255
+ if (this.hasUpdated &&
256
+ (changed.has("error") || changed.has("errorMessage"))) {
247
257
  this._announceError = !!(this.error && this.errorMessage);
248
258
  }
249
259
  }
@@ -252,33 +262,49 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
252
262
  <div>
253
263
  ${this.label
254
264
  ? html `
255
- <span
256
- id=${this._labelId}
257
- class="group-label ${this.required ? "group-label--required" : ""}"
265
+ <span
266
+ id=${this._labelId}
267
+ class="group-label ${this.required
268
+ ? "group-label--required"
269
+ : ""}"
258
270
  >
259
271
  ${this.label}
260
272
  </span>
261
273
  `
262
274
  : nothing}
263
-
264
275
  ${this.error && this.errorMessage
265
276
  ? html `
266
- <div id="error-msg" class="error-message" role=${this._announceError ? "alert" : nothing}>
267
- <svg class="error-icon" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
268
- <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
277
+ <div
278
+ id="error-msg"
279
+ class="error-message"
280
+ role=${this._announceError ? "alert" : nothing}
281
+ >
282
+ <svg
283
+ class="error-icon"
284
+ viewBox="0 0 20 20"
285
+ fill="currentColor"
286
+ aria-hidden="true"
287
+ >
288
+ <path
289
+ fill-rule="evenodd"
290
+ d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z"
291
+ clip-rule="evenodd"
292
+ />
269
293
  </svg>
270
294
  ${this.errorMessage}
271
295
  </div>
272
296
  `
273
297
  : nothing}
274
-
298
+
275
299
  <div
276
300
  class="radio-group"
277
301
  role="radiogroup"
278
302
  aria-labelledby=${this.label ? this._labelId : nothing}
279
303
  aria-required=${this.required ? "true" : nothing}
280
304
  aria-invalid=${this.error ? "true" : nothing}
281
- aria-describedby=${this.error && this.errorMessage ? "error-msg" : nothing}
305
+ aria-describedby=${this.error && this.errorMessage
306
+ ? "error-msg"
307
+ : nothing}
282
308
  >
283
309
  ${this.options.map((option) => html `
284
310
  <label class="radio-option">
@@ -293,7 +319,12 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
293
319
  @blur=${this._handleBlur}
294
320
  />
295
321
  <span class="radio-circle"></span>
296
- <span class="option-label ${this._focusedValue === option.value ? 'option-label--focused' : ''}">${option.label}</span>
322
+ <span
323
+ class="option-label ${this._focusedValue === option.value
324
+ ? "option-label--focused"
325
+ : ""}"
326
+ >${option.label}</span
327
+ >
297
328
  </label>
298
329
  `)}
299
330
  </div>
@@ -1 +1 @@
1
- {"version":3,"file":"oh-radio-group.js","sourceRoot":"","sources":["../src/oh-radio-group.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"oh-radio-group.js","sourceRoot":"","sources":["../src/oh-radio-group.ts"],"names":[],"mappings":"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"}
@@ -7,7 +7,7 @@
7
7
  * DESIGN DECISIONS:
8
8
  * ─────────────────
9
9
  * 1. CHUNKY & TACTILE
10
- * - Thick 2.5px border
10
+ * - Thick border (stroke.control)
11
11
  * - Inset shadow when unchecked (pressed into page)
12
12
  * - Fully circular (radio = circle)
13
13
  *
@@ -1 +1 @@
1
- {"version":3,"file":"oh-radio.d.ts","sourceRoot":"","sources":["../src/oh-radio.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAEvD,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,4BAwMpB;IAGF,OAAO,UAAS;IAGhB,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,KAAK,SAAM;IAGX,KAAK,UAAS;IAGd,YAAY,SAAM;IAElB;;;OAGG;IAEH,UAAU,EAAE,UAAU,CAAa;IAEnC,OAAO,CAAC,aAAa;IAMrB;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,OAAO,CAAC,QAAQ,CAA+D;IAE/E,UAAU,CAAC,OAAO,EAAE,cAAc;IAMlC,MAAM;CAiCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
1
+ {"version":3,"file":"oh-radio.d.ts","sourceRoot":"","sources":["../src/oh-radio.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAEvD,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,4BAmNpB;IAGF,OAAO,UAAS;IAGhB,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,KAAK,SAAM;IAGX,KAAK,UAAS;IAGd,YAAY,SAAM;IAElB;;;OAGG;IAEH,UAAU,EAAE,UAAU,CAAa;IAEnC,OAAO,CAAC,aAAa;IAMrB;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,OAAO,CAAC,QAAQ,CAA+D;IAE/E,UAAU,CAAC,OAAO,EAAE,cAAc;IASlC,MAAM;CAiDP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
package/dist/oh-radio.js CHANGED
@@ -7,7 +7,7 @@
7
7
  * DESIGN DECISIONS:
8
8
  * ─────────────────
9
9
  * 1. CHUNKY & TACTILE
10
- * - Thick 2.5px border
10
+ * - Thick border (stroke.control)
11
11
  * - Inset shadow when unchecked (pressed into page)
12
12
  * - Fully circular (radio = circle)
13
13
  *
@@ -96,16 +96,17 @@ let OhRadio = class OhRadio extends OhElement {
96
96
  width: 24px;
97
97
  height: 24px;
98
98
  flex-shrink: 0;
99
-
99
+
100
100
  /* Chunky border, fully circular */
101
- border: var(--oh-input-base-border-width) solid var(--oh-color-border-emphasis);
101
+ border: var(--oh-stroke-control) solid var(--oh-color-border-emphasis);
102
102
  border-radius: var(--oh-shape-pill);
103
-
103
+
104
104
  /* Offset shadow like primary button */
105
105
  background-color: var(--oh-color-surface-base);
106
- box-shadow: 3px 3px 0 0 var(--oh-shadow-secondary);
107
-
108
- transition:
106
+ box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md)
107
+ 0 0 var(--oh-shadow-secondary);
108
+
109
+ transition:
109
110
  transform var(--oh-motion-snappy) var(--oh-motion-ease-playful),
110
111
  box-shadow var(--oh-motion-snappy) var(--oh-motion-ease-playful),
111
112
  background-color var(--oh-motion-quick) ease,
@@ -114,7 +115,7 @@ let OhRadio = class OhRadio extends OhElement {
114
115
 
115
116
  /* Inner dot (hidden by default) */
116
117
  .radio-circle::after {
117
- content: '';
118
+ content: "";
118
119
  position: absolute;
119
120
  top: 50%;
120
121
  left: 50%;
@@ -123,7 +124,8 @@ let OhRadio = class OhRadio extends OhElement {
123
124
  background-color: var(--oh-color-text-on-brand);
124
125
  border-radius: var(--oh-shape-pill);
125
126
  transform: translate(-50%, -50%) scale(0);
126
- transition: transform var(--oh-motion-snappy) var(--oh-motion-ease-playful);
127
+ transition: transform var(--oh-motion-snappy)
128
+ var(--oh-motion-ease-playful);
127
129
  }
128
130
 
129
131
  /* ═══════════════════════════════════════════════════════════════
@@ -133,21 +135,24 @@ let OhRadio = class OhRadio extends OhElement {
133
135
  /* Hover: lift up-left, shadow grows */
134
136
  .radio-wrapper:hover .radio-circle {
135
137
  border-color: var(--oh-color-border-hover);
136
- transform: translate(-1px, -1px);
137
- box-shadow: 4px 4px 0 0 var(--oh-shadow-secondary);
138
+ transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
139
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
140
+ 0 0 var(--oh-shadow-secondary);
138
141
  }
139
142
 
140
143
  /* Active: press down-right, shadow shrinks */
141
144
  .radio-wrapper:active .radio-circle {
142
- transform: translate(1px, 1px);
143
- box-shadow: 1px 1px 0 0 var(--oh-shadow-secondary);
145
+ transform: translate(var(--oh-lift-press-sm), var(--oh-lift-press-sm));
146
+ box-shadow: var(--oh-elevation-offset-xs) var(--oh-elevation-offset-xs)
147
+ 0 0 var(--oh-shadow-secondary);
144
148
  }
145
149
 
146
150
  /* Checked: primary color with warm shadow */
147
151
  .native-radio:checked + .radio-circle {
148
152
  background-color: var(--oh-color-brand-primary);
149
153
  border-color: var(--oh-color-brand-primary);
150
- box-shadow: 3px 3px 0 0 var(--oh-shadow-primary);
154
+ box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md)
155
+ 0 0 var(--oh-shadow-primary);
151
156
  }
152
157
 
153
158
  .native-radio:checked + .radio-circle::after {
@@ -158,15 +163,17 @@ let OhRadio = class OhRadio extends OhElement {
158
163
  .radio-wrapper:hover .native-radio:checked + .radio-circle {
159
164
  background-color: var(--oh-color-brand-primary-hover);
160
165
  border-color: var(--oh-color-brand-primary-hover);
161
- transform: translate(-1px, -1px);
162
- box-shadow: 4px 4px 0 0 var(--oh-shadow-primary);
166
+ transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
167
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
168
+ 0 0 var(--oh-shadow-primary);
163
169
  }
164
170
 
165
171
  /* Checked + Active */
166
172
  .radio-wrapper:active .native-radio:checked + .radio-circle {
167
173
  background-color: var(--oh-color-brand-primary-active);
168
- transform: translate(1px, 1px);
169
- box-shadow: 1px 1px 0 0 var(--oh-shadow-primary);
174
+ transform: translate(var(--oh-lift-press-sm), var(--oh-lift-press-sm));
175
+ box-shadow: var(--oh-elevation-offset-xs) var(--oh-elevation-offset-xs)
176
+ 0 0 var(--oh-shadow-primary);
170
177
  }
171
178
 
172
179
  /* Focus: underline the label (accessible indicator) */
@@ -194,12 +201,14 @@ let OhRadio = class OhRadio extends OhElement {
194
201
 
195
202
  :host([error]) .radio-circle {
196
203
  border-color: var(--oh-color-feedback-error);
197
- box-shadow: 3px 3px 0 0 var(--oh-shadow-error);
204
+ box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md)
205
+ 0 0 var(--oh-shadow-error);
198
206
  }
199
207
 
200
208
  :host([error]) .radio-wrapper:hover .radio-circle {
201
209
  border-color: var(--oh-color-feedback-error-hover);
202
- box-shadow: 4px 4px 0 0 var(--oh-shadow-error);
210
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
211
+ 0 0 var(--oh-shadow-error);
203
212
  }
204
213
 
205
214
  .error-message {
@@ -237,8 +246,9 @@ let OhRadio = class OhRadio extends OhElement {
237
246
  /* Forced Hover - Unchecked */
238
247
  :host([force-state="hover"]) .radio-circle {
239
248
  border-color: var(--oh-color-border-hover);
240
- transform: translate(-1px, -1px);
241
- box-shadow: 4px 4px 0 0 var(--oh-shadow-secondary);
249
+ transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
250
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
251
+ 0 0 var(--oh-shadow-secondary);
242
252
  }
243
253
 
244
254
  /* Forced Focus - Unchecked */
@@ -251,8 +261,9 @@ let OhRadio = class OhRadio extends OhElement {
251
261
  :host([force-state="hover"][checked]) .radio-circle {
252
262
  background-color: var(--oh-color-brand-primary-hover);
253
263
  border-color: var(--oh-color-brand-primary-hover);
254
- transform: translate(-1px, -1px);
255
- box-shadow: 4px 4px 0 0 var(--oh-shadow-primary);
264
+ transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
265
+ box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg)
266
+ 0 0 var(--oh-shadow-primary);
256
267
  }
257
268
  `,
258
269
  ]; }
@@ -262,7 +273,8 @@ let OhRadio = class OhRadio extends OhElement {
262
273
  this.emit("oh-change", { checked: this.checked, value: this.value });
263
274
  }
264
275
  willUpdate(changed) {
265
- if (this.hasUpdated && (changed.has("error") || changed.has("errorMessage"))) {
276
+ if (this.hasUpdated &&
277
+ (changed.has("error") || changed.has("errorMessage"))) {
266
278
  this._announceError = !!(this.error && this.errorMessage);
267
279
  }
268
280
  }
@@ -279,7 +291,9 @@ let OhRadio = class OhRadio extends OhElement {
279
291
  .value=${this.value}
280
292
  .checked=${this.checked}
281
293
  aria-invalid=${this.error ? "true" : "false"}
282
- aria-describedby=${this.error && this.errorMessage ? this._errorId : nothing}
294
+ aria-describedby=${this.error && this.errorMessage
295
+ ? this._errorId
296
+ : nothing}
283
297
  @change=${this._handleChange}
284
298
  />
285
299
  <span class="radio-circle" part="circle"></span>
@@ -287,9 +301,23 @@ let OhRadio = class OhRadio extends OhElement {
287
301
  </label>
288
302
  ${this.error && this.errorMessage
289
303
  ? html `
290
- <div id=${this._errorId} class="error-message" part="error" role=${this._announceError ? "alert" : nothing}>
291
- <svg class="error-icon" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
292
- <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
304
+ <div
305
+ id=${this._errorId}
306
+ class="error-message"
307
+ part="error"
308
+ role=${this._announceError ? "alert" : nothing}
309
+ >
310
+ <svg
311
+ class="error-icon"
312
+ viewBox="0 0 20 20"
313
+ fill="currentColor"
314
+ aria-hidden="true"
315
+ >
316
+ <path
317
+ fill-rule="evenodd"
318
+ d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z"
319
+ clip-rule="evenodd"
320
+ />
293
321
  </svg>
294
322
  ${this.errorMessage}
295
323
  </div>
@@ -1 +1 @@
1
- {"version":3,"file":"oh-radio.js","sourceRoot":"","sources":["../src/oh-radio.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"oh-radio.js","sourceRoot":"","sources":["../src/oh-radio.ts"],"names":[],"mappings":"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"}
@@ -7,9 +7,9 @@
7
7
  * DESIGN DECISIONS:
8
8
  * ─────────────────
9
9
  * 1. CHUNKY & TACTILE
10
- * - Thick 2.5px border
10
+ * - Thick border (stroke.control)
11
11
  * - Offset shadow (sticker effect like button)
12
- * - 10px border radius
12
+ * - shape.control corners
13
13
  * - Solid warm fills
14
14
  *
15
15
  * 2. DROPDOWN PANEL
@@ -51,6 +51,7 @@ export declare class OhSelect extends OhElement {
51
51
  private _labelId;
52
52
  private _listboxId;
53
53
  private _errorId;
54
+ private _helperId;
54
55
  private _typeaheadBuffer;
55
56
  private _typeaheadTimeout;
56
57
  private get _selectedOption();
@@ -1 +1 @@
1
- {"version":3,"file":"oh-select.d.ts","sourceRoot":"","sources":["../src/oh-select.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBACa,QAAS,SAAQ,SAAS;IACrC,OAAgB,MAAM,4BA+PpB;IAGF,KAAK,SAAM;IAGX,WAAW,SAAsB;IAGjC,IAAI,SAAM;IAGV,OAAO,EAAE,YAAY,EAAE,CAAM;IAG7B,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,UAAU,SAAM;IAGhB,SAAS,SAAM;IAGf,OAAO,CAAC,KAAK,CAAS;IAGtB,OAAO,CAAC,iBAAiB,CAAM;IAG/B,OAAO,CAAC,QAAQ,CAAS;IAGzB,OAAO,CAAC,QAAQ,CAAqB;IAGrC,OAAO,CAAC,QAAQ,CAAoB;IAEpC,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,UAAU,CAAkE;IACpF,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,gBAAgB,CAAM;IAC9B,OAAO,CAAC,iBAAiB,CAAuB;IAEhD,OAAO,KAAK,eAAe,GAE1B;IAED,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,eAAe;IAKvB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,qBAAqB;IAqE7B,OAAO,CAAC,gBAAgB;IAwBxB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,kBAAkB;IAQ1B,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,uBAAuB;IAI/B,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,mBAAmB,CAIzB;IAEO,iBAAiB;IAKjB,oBAAoB;IAK7B;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,UAAU,CAAC,OAAO,EAAE,cAAc;IAMlC,MAAM;CAyGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}
1
+ {"version":3,"file":"oh-select.d.ts","sourceRoot":"","sources":["../src/oh-select.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBACa,QAAS,SAAQ,SAAS;IACrC,OAAgB,MAAM,4BA0QpB;IAGF,KAAK,SAAM;IAGX,WAAW,SAAsB;IAGjC,IAAI,SAAM;IAGV,OAAO,EAAE,YAAY,EAAE,CAAM;IAG7B,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,UAAU,SAAM;IAGhB,SAAS,SAAM;IAGf,OAAO,CAAC,KAAK,CAAS;IAGtB,OAAO,CAAC,iBAAiB,CAAM;IAG/B,OAAO,CAAC,QAAQ,CAAS;IAGzB,OAAO,CAAC,QAAQ,CAAqB;IAGrC,OAAO,CAAC,QAAQ,CAAoB;IAEpC,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,UAAU,CAAkE;IACpF,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,SAAS,CAAiE;IAClF,OAAO,CAAC,gBAAgB,CAAM;IAC9B,OAAO,CAAC,iBAAiB,CAAuB;IAEhD,OAAO,KAAK,eAAe,GAE1B;IAED,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,eAAe;IAKvB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,qBAAqB;IAqE7B,OAAO,CAAC,gBAAgB;IAwBxB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,kBAAkB;IAS1B,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,uBAAuB;IAI/B,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,mBAAmB,CAIzB;IAEO,iBAAiB;IAKjB,oBAAoB;IAK7B;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,UAAU,CAAC,OAAO,EAAE,cAAc;IAMlC,MAAM;CAoIP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}