@helixui/library 3.2.0-next.78 → 3.2.0-next.83
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 +27 -12
- package/dist/components/hx-button/index.js +1 -1
- package/dist/components/hx-side-nav/hx-nav-item.d.ts +7 -5
- package/dist/components/hx-side-nav/hx-nav-item.d.ts.map +1 -1
- package/dist/components/hx-side-nav/hx-nav-item.styles.d.ts.map +1 -1
- package/dist/components/hx-side-nav/hx-side-nav.d.ts +5 -4
- package/dist/components/hx-side-nav/hx-side-nav.d.ts.map +1 -1
- package/dist/components/hx-side-nav/hx-side-nav.styles.d.ts.map +1 -1
- package/dist/components/hx-side-nav/index.js +1 -1
- package/dist/components/hx-toast/hx-toast.d.ts +2 -2
- package/dist/components/hx-toast/index.js +1 -1
- package/dist/css/helix-all.css +16 -8
- package/dist/css/helix-core.css +5 -5
- package/dist/css/helix-feedback.css +3 -3
- package/dist/css/helix-navigation.css +8 -0
- package/dist/css/hx-button.css +5 -5
- package/dist/css/hx-side-nav.css +8 -0
- package/dist/css/hx-toast.css +3 -3
- package/dist/css/index.css +1 -1
- package/dist/css/manifest.json +3 -1
- package/dist/index.js +3 -3
- package/dist/shared/{hx-button-YeUzCe6e.js → hx-button-kWxjKqo-.js} +6 -6
- package/dist/shared/hx-button-kWxjKqo-.js.map +1 -0
- package/dist/shared/{hx-nav-item-BqML5BAh.js → hx-nav-item-CMyMv5Gv.js} +98 -60
- package/dist/shared/hx-nav-item-CMyMv5Gv.js.map +1 -0
- package/dist/shared/{toast-factory-CIiZDZGZ.js → toast-factory-Mz1GaaFF.js} +4 -4
- package/dist/shared/toast-factory-Mz1GaaFF.js.map +1 -0
- package/figma-inventory.json +71 -35
- package/package.json +2 -2
- package/dist/shared/hx-button-YeUzCe6e.js.map +0 -1
- package/dist/shared/hx-nav-item-BqML5BAh.js.map +0 -1
- package/dist/shared/toast-factory-CIiZDZGZ.js.map +0 -1
package/custom-elements.json
CHANGED
|
@@ -22810,7 +22810,7 @@
|
|
|
22810
22810
|
{
|
|
22811
22811
|
"description": "Item text color.",
|
|
22812
22812
|
"name": "--hx-nav-item-color",
|
|
22813
|
-
"default": "var(--hx-color-
|
|
22813
|
+
"default": "var(--hx-color-text-inverse)"
|
|
22814
22814
|
},
|
|
22815
22815
|
{
|
|
22816
22816
|
"description": "Item hover background.",
|
|
@@ -22819,17 +22819,17 @@
|
|
|
22819
22819
|
{
|
|
22820
22820
|
"description": "Item hover text color.",
|
|
22821
22821
|
"name": "--hx-nav-item-hover-color",
|
|
22822
|
-
"default": "var(--hx-color-
|
|
22822
|
+
"default": "var(--hx-color-text-inverse)"
|
|
22823
22823
|
},
|
|
22824
22824
|
{
|
|
22825
22825
|
"description": "Active item background.",
|
|
22826
22826
|
"name": "--hx-nav-item-active-bg",
|
|
22827
|
-
"default": "var(--hx-color-primary-
|
|
22827
|
+
"default": "var(--hx-color-action-primary-bg-hover)"
|
|
22828
22828
|
},
|
|
22829
22829
|
{
|
|
22830
22830
|
"description": "Active item text color.",
|
|
22831
22831
|
"name": "--hx-nav-item-active-color",
|
|
22832
|
-
"default": "var(--hx-color-
|
|
22832
|
+
"default": "var(--hx-color-text-on-primary-strong)"
|
|
22833
22833
|
},
|
|
22834
22834
|
{
|
|
22835
22835
|
"description": "Item padding.",
|
|
@@ -22838,7 +22838,17 @@
|
|
|
22838
22838
|
{
|
|
22839
22839
|
"description": "Component host background color.",
|
|
22840
22840
|
"name": "--hx-nav-item-host-bg",
|
|
22841
|
-
"default": "var(--hx-color-
|
|
22841
|
+
"default": "var(--hx-color-surface-inverse)"
|
|
22842
|
+
},
|
|
22843
|
+
{
|
|
22844
|
+
"description": "Tooltip background color (collapsed-rail tooltip).",
|
|
22845
|
+
"name": "--hx-nav-item-tooltip-bg",
|
|
22846
|
+
"default": "var(--hx-color-surface-inverse)"
|
|
22847
|
+
},
|
|
22848
|
+
{
|
|
22849
|
+
"description": "Tooltip text color (collapsed-rail tooltip).",
|
|
22850
|
+
"name": "--hx-nav-item-tooltip-color",
|
|
22851
|
+
"default": "var(--hx-color-text-inverse)"
|
|
22842
22852
|
}
|
|
22843
22853
|
],
|
|
22844
22854
|
"cssParts": [
|
|
@@ -23048,17 +23058,17 @@
|
|
|
23048
23058
|
{
|
|
23049
23059
|
"description": "Background color.",
|
|
23050
23060
|
"name": "--hx-side-nav-bg",
|
|
23051
|
-
"default": "var(--hx-color-
|
|
23061
|
+
"default": "var(--hx-color-surface-inverse)"
|
|
23052
23062
|
},
|
|
23053
23063
|
{
|
|
23054
23064
|
"description": "Text color.",
|
|
23055
23065
|
"name": "--hx-side-nav-color",
|
|
23056
|
-
"default": "var(--hx-color-
|
|
23066
|
+
"default": "var(--hx-color-text-inverse)"
|
|
23057
23067
|
},
|
|
23058
23068
|
{
|
|
23059
23069
|
"description": "Border color.",
|
|
23060
23070
|
"name": "--hx-side-nav-border-color",
|
|
23061
|
-
"default": "var(--hx-color-
|
|
23071
|
+
"default": "var(--hx-color-border-strong)"
|
|
23062
23072
|
},
|
|
23063
23073
|
{
|
|
23064
23074
|
"description": "Header padding.",
|
|
@@ -23071,9 +23081,14 @@
|
|
|
23071
23081
|
"default": "var(--hx-space-4)"
|
|
23072
23082
|
},
|
|
23073
23083
|
{
|
|
23074
|
-
"description": "Toggle button icon color.",
|
|
23084
|
+
"description": "Toggle button icon color (resting).",
|
|
23075
23085
|
"name": "--hx-side-nav-toggle-color",
|
|
23076
|
-
"default": "var(--hx-color-
|
|
23086
|
+
"default": "var(--hx-color-text-inverse)"
|
|
23087
|
+
},
|
|
23088
|
+
{
|
|
23089
|
+
"description": "Toggle button icon color on hover.",
|
|
23090
|
+
"name": "--hx-side-nav-toggle-hover-color",
|
|
23091
|
+
"default": "var(--hx-color-text-inverse)"
|
|
23077
23092
|
},
|
|
23078
23093
|
{
|
|
23079
23094
|
"description": "Color.",
|
|
@@ -32060,12 +32075,12 @@
|
|
|
32060
32075
|
{
|
|
32061
32076
|
"description": "Toast background color.",
|
|
32062
32077
|
"name": "--hx-toast-bg",
|
|
32063
|
-
"default": "var(--hx-color-
|
|
32078
|
+
"default": "var(--hx-color-surface-inverse)"
|
|
32064
32079
|
},
|
|
32065
32080
|
{
|
|
32066
32081
|
"description": "Toast text color.",
|
|
32067
32082
|
"name": "--hx-toast-color",
|
|
32068
|
-
"default": "var(--hx-color-
|
|
32083
|
+
"default": "var(--hx-color-text-inverse)"
|
|
32069
32084
|
},
|
|
32070
32085
|
{
|
|
32071
32086
|
"description": "Toast border radius.",
|
|
@@ -18,13 +18,15 @@ import { HelixElement } from '../../base/index.js';
|
|
|
18
18
|
* @csspart badge - The badge container.
|
|
19
19
|
* @csspart children - The children container.
|
|
20
20
|
*
|
|
21
|
-
* @cssprop [--hx-nav-item-color=var(--hx-color-
|
|
21
|
+
* @cssprop [--hx-nav-item-color=var(--hx-color-text-inverse)] - Item text color.
|
|
22
22
|
* @cssprop [--hx-nav-item-hover-bg] - Item hover background.
|
|
23
|
-
* @cssprop [--hx-nav-item-hover-color=var(--hx-color-
|
|
24
|
-
* @cssprop [--hx-nav-item-active-bg=var(--hx-color-primary-
|
|
25
|
-
* @cssprop [--hx-nav-item-active-color=var(--hx-color-
|
|
23
|
+
* @cssprop [--hx-nav-item-hover-color=var(--hx-color-text-inverse)] - Item hover text color.
|
|
24
|
+
* @cssprop [--hx-nav-item-active-bg=var(--hx-color-action-primary-bg-hover)] - Active item background.
|
|
25
|
+
* @cssprop [--hx-nav-item-active-color=var(--hx-color-text-on-primary-strong)] - Active item text color.
|
|
26
26
|
* @cssprop [--hx-nav-item-padding] - Item padding.
|
|
27
|
-
* @cssprop [--hx-nav-item-host-bg=var(--hx-color-
|
|
27
|
+
* @cssprop [--hx-nav-item-host-bg=var(--hx-color-surface-inverse)] - Component host background color.
|
|
28
|
+
* @cssprop [--hx-nav-item-tooltip-bg=var(--hx-color-surface-inverse)] - Tooltip background color (collapsed-rail tooltip).
|
|
29
|
+
* @cssprop [--hx-nav-item-tooltip-color=var(--hx-color-text-inverse)] - Tooltip text color (collapsed-rail tooltip).
|
|
28
30
|
*/
|
|
29
31
|
export declare class HelixNavItem extends HelixElement {
|
|
30
32
|
static styles: import('lit').CSSResult[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hx-nav-item.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-nav-item.ts"],"names":[],"mappings":"AACA,OAAO,4CAA4C,CAAC;AAEpD,OAAO,EAAE,YAAY,EAAmB,MAAM,qBAAqB,CAAC;AAKpE
|
|
1
|
+
{"version":3,"file":"hx-nav-item.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-nav-item.ts"],"names":[],"mappings":"AACA,OAAO,4CAA4C,CAAC;AAEpD,OAAO,EAAE,YAAY,EAAmB,MAAM,qBAAqB,CAAC;AAKpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,qBACa,YAAa,SAAQ,YAAY;IAK5C,OAAgB,MAAM,4BAAwB;IAE9C,0CAA0C;IAC1C,OAAO,CAAC,UAAU,CAAiC;IAInD;;;OAGG;IAEH,IAAI,SAAM;IAEV;;;OAGG;IAEH,MAAM,UAAS;IAEf;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,QAAQ,UAAS;IAIjB,4EAA4E;IAC5E,gBAAgB;IACP,OAAO,CAAC,YAAY,CAAS;IAEtC,0GAA0G;IAC1G,gBAAgB;IACP,OAAO,CAAC,YAAY,CAAS;IAItC,WAAoB,kBAAkB,IAAI,MAAM,EAAE,CAEjD;IAEQ,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAS/F;;;;;OAKG;IACM,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAW5C,gBAAgB;IAChB,OAAO,CAAC,qBAAqB;IAO7B,gBAAgB;IAChB,OAAO,CAAC,cAAc;IAQtB,gBAAgB;IAChB,OAAO,CAAC,aAAa;IAMrB,gBAAgB;IAChB,OAAO,CAAC,kBAAkB;IAYjB,MAAM;CAwDhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,YAAY,CAAC;KAC7B;CACF;AAED,YAAY,EAAE,YAAY,IAAI,SAAS,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hx-nav-item.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-nav-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"hx-nav-item.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-nav-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,yBA6S9B,CAAC"}
|
|
@@ -23,12 +23,13 @@ import { HelixElement } from '../../base/index.js';
|
|
|
23
23
|
*
|
|
24
24
|
* @cssprop [--hx-side-nav-width=16rem] - Full expanded width.
|
|
25
25
|
* @cssprop [--hx-side-nav-collapsed-width=3.5rem] - Collapsed icon-only width.
|
|
26
|
-
* @cssprop [--hx-side-nav-bg=var(--hx-color-
|
|
27
|
-
* @cssprop [--hx-side-nav-color=var(--hx-color-
|
|
28
|
-
* @cssprop [--hx-side-nav-border-color=var(--hx-color-
|
|
26
|
+
* @cssprop [--hx-side-nav-bg=var(--hx-color-surface-inverse)] - Background color.
|
|
27
|
+
* @cssprop [--hx-side-nav-color=var(--hx-color-text-inverse)] - Text color.
|
|
28
|
+
* @cssprop [--hx-side-nav-border-color=var(--hx-color-border-strong)] - Border color.
|
|
29
29
|
* @cssprop [--hx-side-nav-header-padding=var(--hx-space-4)] - Header padding.
|
|
30
30
|
* @cssprop [--hx-side-nav-footer-padding=var(--hx-space-4)] - Footer padding.
|
|
31
|
-
* @cssprop [--hx-side-nav-toggle-color=var(--hx-color-
|
|
31
|
+
* @cssprop [--hx-side-nav-toggle-color=var(--hx-color-text-inverse)] - Toggle button icon color (resting).
|
|
32
|
+
* @cssprop [--hx-side-nav-toggle-hover-color=var(--hx-color-text-inverse)] - Toggle button icon color on hover.
|
|
32
33
|
* @cssprop [--hx-color-neutral-900] - Color.
|
|
33
34
|
* @cssprop [--hx-color-neutral-100] - Color.
|
|
34
35
|
* @cssprop [--hx-transition-normal] - Transition timing.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hx-side-nav.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-side-nav.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,4CAA4C,CAAC;AAEpD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGnD
|
|
1
|
+
{"version":3,"file":"hx-side-nav.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-side-nav.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,4CAA4C,CAAC;AAEpD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,qBACa,YAAa,SAAQ,YAAY;IAI5C,OAAgB,MAAM,4BAAwB;IAI9C;;;OAGG;IAEH,SAAS,UAAS;IAElB;;;OAGG;IAEH,KAAK,SAAqB;IAIjB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAS/D;;;;OAIG;IACH,gBAAgB;IAChB,OAAO,CAAC,6BAA6B;IAkBrC;;;OAGG;IACH,gBAAgB;IAChB,OAAO,CAAC,oBAAoB;IAM5B;;;;;OAKG;IACH,gBAAgB;IAChB,OAAO,CAAC,cAAc;IAgItB,gBAAgB;IAChB,OAAO,CAAC,aAAa;IAgCrB,gBAAgB;IAChB,OAAO,CAAC,iBAAiB;IAQhB,MAAM;CA0BhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,YAAY,CAAC;KAC7B;CACF;AAED,YAAY,EAAE,YAAY,IAAI,SAAS,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hx-side-nav.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-side-nav.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"hx-side-nav.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-side-nav/hx-side-nav.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,yBAuL9B,CAAC"}
|
|
@@ -24,8 +24,8 @@ export type ToastVariant = 'default' | 'success' | 'warning' | 'danger' | 'info'
|
|
|
24
24
|
* @csspart close-button - The dismiss button (only when closable).
|
|
25
25
|
* @csspart action - The action slot wrapper.
|
|
26
26
|
*
|
|
27
|
-
* @cssprop [--hx-toast-bg=var(--hx-color-
|
|
28
|
-
* @cssprop [--hx-toast-color=var(--hx-color-
|
|
27
|
+
* @cssprop [--hx-toast-bg=var(--hx-color-surface-inverse)] - Toast background color.
|
|
28
|
+
* @cssprop [--hx-toast-color=var(--hx-color-text-inverse)] - Toast text color.
|
|
29
29
|
* @cssprop [--hx-toast-border-radius=var(--hx-border-radius-md)] - Toast border radius.
|
|
30
30
|
* @cssprop [--hx-toast-shadow] - Toast box shadow.
|
|
31
31
|
* @cssprop [--hx-toast-width=20rem] - Toast width.
|
package/dist/css/helix-all.css
CHANGED
|
@@ -1127,7 +1127,7 @@
|
|
|
1127
1127
|
}
|
|
1128
1128
|
|
|
1129
1129
|
.button--secondary:hover {
|
|
1130
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
1130
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-secondary-bg-hover, #ebf8f8));
|
|
1131
1131
|
}
|
|
1132
1132
|
|
|
1133
1133
|
.button--tertiary {
|
|
@@ -1168,7 +1168,7 @@
|
|
|
1168
1168
|
}
|
|
1169
1169
|
|
|
1170
1170
|
.button--ghost:hover {
|
|
1171
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
1171
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-ghost-bg-hover, #ebf8f8));
|
|
1172
1172
|
}
|
|
1173
1173
|
|
|
1174
1174
|
.button--outline {
|
|
@@ -1267,7 +1267,7 @@
|
|
|
1267
1267
|
}
|
|
1268
1268
|
|
|
1269
1269
|
:host([inverted]) .button--secondary:hover {
|
|
1270
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
1270
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
1271
1271
|
}
|
|
1272
1272
|
|
|
1273
1273
|
/* Tertiary inverted — resting at subtle (10%) lifts to default (30%) on hover
|
|
@@ -1291,7 +1291,7 @@
|
|
|
1291
1291
|
:host([inverted]) .button--ghost:hover {
|
|
1292
1292
|
--hx-button-bg: var(
|
|
1293
1293
|
--hx-button-inverted-ghost-hover-bg,
|
|
1294
|
-
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
1294
|
+
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3))
|
|
1295
1295
|
);
|
|
1296
1296
|
}
|
|
1297
1297
|
|
|
@@ -1301,7 +1301,7 @@
|
|
|
1301
1301
|
}
|
|
1302
1302
|
|
|
1303
1303
|
:host([inverted]) .button--outline:hover {
|
|
1304
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
1304
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
1305
1305
|
}
|
|
1306
1306
|
|
|
1307
1307
|
/* ─── Prefix / Suffix / Label ─── */
|
|
@@ -8813,10 +8813,18 @@ export const helixGridItemStyles = css`
|
|
|
8813
8813
|
}
|
|
8814
8814
|
|
|
8815
8815
|
.side-nav__toggle {
|
|
8816
|
+
forced-color-adjust: none;
|
|
8817
|
+
background-color: ButtonFace;
|
|
8816
8818
|
color: ButtonText;
|
|
8817
8819
|
border: 1px solid ButtonText;
|
|
8818
8820
|
}
|
|
8819
8821
|
|
|
8822
|
+
.side-nav__toggle:hover {
|
|
8823
|
+
background-color: Highlight;
|
|
8824
|
+
color: HighlightText;
|
|
8825
|
+
border-color: Highlight;
|
|
8826
|
+
}
|
|
8827
|
+
|
|
8820
8828
|
.side-nav__toggle:focus-visible {
|
|
8821
8829
|
outline: 3px solid Highlight;
|
|
8822
8830
|
outline-offset: 2px;
|
|
@@ -12210,10 +12218,10 @@ export const helixTableSectionBaseStyles = css`
|
|
|
12210
12218
|
* are tuned for the lighter -500 surfaces and would fail here (e.g.
|
|
12211
12219
|
* neutral-900 on primary-600 = 3.07:1), so the on-{role}-strong tokens
|
|
12212
12220
|
* (neutral-0, no dark-mode flip) keep fg legible on the darker fills.
|
|
12213
|
-
* - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.
|
|
12221
|
+
* - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.82:1
|
|
12214
12222
|
* - text.on-success-strong on success.bg-strong (success-700, #146831) = 6.88:1
|
|
12215
|
-
* (success-600 #0E8A4A on white = 4.
|
|
12216
|
-
* - text.on-error-strong on danger.bg-strong (error-600, #C92A2A) = 5.
|
|
12223
|
+
* (success-600 #0E8A4A on white = 4.42:1 — drifts under AA at 14px)
|
|
12224
|
+
* - text.on-error-strong on danger.bg-strong (error-600, #C92A2A) = 5.46:1
|
|
12217
12225
|
* - text.on-warning on warning.bg-strong (warning-500, #C2711C) = 4.83:1
|
|
12218
12226
|
* (warning stays on the lighter -500 surface so on-warning works)
|
|
12219
12227
|
*
|
package/dist/css/helix-core.css
CHANGED
|
@@ -450,7 +450,7 @@
|
|
|
450
450
|
}
|
|
451
451
|
|
|
452
452
|
.button--secondary:hover {
|
|
453
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
453
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-secondary-bg-hover, #ebf8f8));
|
|
454
454
|
}
|
|
455
455
|
|
|
456
456
|
.button--tertiary {
|
|
@@ -491,7 +491,7 @@
|
|
|
491
491
|
}
|
|
492
492
|
|
|
493
493
|
.button--ghost:hover {
|
|
494
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
494
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-ghost-bg-hover, #ebf8f8));
|
|
495
495
|
}
|
|
496
496
|
|
|
497
497
|
.button--outline {
|
|
@@ -590,7 +590,7 @@
|
|
|
590
590
|
}
|
|
591
591
|
|
|
592
592
|
:host([inverted]) .button--secondary:hover {
|
|
593
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
593
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
594
594
|
}
|
|
595
595
|
|
|
596
596
|
/* Tertiary inverted — resting at subtle (10%) lifts to default (30%) on hover
|
|
@@ -614,7 +614,7 @@
|
|
|
614
614
|
:host([inverted]) .button--ghost:hover {
|
|
615
615
|
--hx-button-bg: var(
|
|
616
616
|
--hx-button-inverted-ghost-hover-bg,
|
|
617
|
-
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
617
|
+
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3))
|
|
618
618
|
);
|
|
619
619
|
}
|
|
620
620
|
|
|
@@ -624,7 +624,7 @@
|
|
|
624
624
|
}
|
|
625
625
|
|
|
626
626
|
:host([inverted]) .button--outline:hover {
|
|
627
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
627
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
628
628
|
}
|
|
629
629
|
|
|
630
630
|
/* ─── Prefix / Suffix / Label ─── */
|
|
@@ -1235,10 +1235,10 @@
|
|
|
1235
1235
|
* are tuned for the lighter -500 surfaces and would fail here (e.g.
|
|
1236
1236
|
* neutral-900 on primary-600 = 3.07:1), so the on-{role}-strong tokens
|
|
1237
1237
|
* (neutral-0, no dark-mode flip) keep fg legible on the darker fills.
|
|
1238
|
-
* - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.
|
|
1238
|
+
* - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.82:1
|
|
1239
1239
|
* - text.on-success-strong on success.bg-strong (success-700, #146831) = 6.88:1
|
|
1240
|
-
* (success-600 #0E8A4A on white = 4.
|
|
1241
|
-
* - text.on-error-strong on danger.bg-strong (error-600, #C92A2A) = 5.
|
|
1240
|
+
* (success-600 #0E8A4A on white = 4.42:1 — drifts under AA at 14px)
|
|
1241
|
+
* - text.on-error-strong on danger.bg-strong (error-600, #C92A2A) = 5.46:1
|
|
1242
1242
|
* - text.on-warning on warning.bg-strong (warning-500, #C2711C) = 4.83:1
|
|
1243
1243
|
* (warning stays on the lighter -500 surface so on-warning works)
|
|
1244
1244
|
*
|
|
@@ -895,10 +895,18 @@
|
|
|
895
895
|
}
|
|
896
896
|
|
|
897
897
|
.side-nav__toggle {
|
|
898
|
+
forced-color-adjust: none;
|
|
899
|
+
background-color: ButtonFace;
|
|
898
900
|
color: ButtonText;
|
|
899
901
|
border: 1px solid ButtonText;
|
|
900
902
|
}
|
|
901
903
|
|
|
904
|
+
.side-nav__toggle:hover {
|
|
905
|
+
background-color: Highlight;
|
|
906
|
+
color: HighlightText;
|
|
907
|
+
border-color: Highlight;
|
|
908
|
+
}
|
|
909
|
+
|
|
902
910
|
.side-nav__toggle:focus-visible {
|
|
903
911
|
outline: 3px solid Highlight;
|
|
904
912
|
outline-offset: 2px;
|
package/dist/css/hx-button.css
CHANGED
|
@@ -101,7 +101,7 @@
|
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
.button--secondary:hover {
|
|
104
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
104
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-secondary-bg-hover, #ebf8f8));
|
|
105
105
|
}
|
|
106
106
|
|
|
107
107
|
.button--tertiary {
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
}
|
|
143
143
|
|
|
144
144
|
.button--ghost:hover {
|
|
145
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
145
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-ghost-bg-hover, #ebf8f8));
|
|
146
146
|
}
|
|
147
147
|
|
|
148
148
|
.button--outline {
|
|
@@ -241,7 +241,7 @@
|
|
|
241
241
|
}
|
|
242
242
|
|
|
243
243
|
:host([inverted]) .button--secondary:hover {
|
|
244
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
244
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
245
245
|
}
|
|
246
246
|
|
|
247
247
|
/* Tertiary inverted — resting at subtle (10%) lifts to default (30%) on hover
|
|
@@ -265,7 +265,7 @@
|
|
|
265
265
|
:host([inverted]) .button--ghost:hover {
|
|
266
266
|
--hx-button-bg: var(
|
|
267
267
|
--hx-button-inverted-ghost-hover-bg,
|
|
268
|
-
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
268
|
+
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3))
|
|
269
269
|
);
|
|
270
270
|
}
|
|
271
271
|
|
|
@@ -275,7 +275,7 @@
|
|
|
275
275
|
}
|
|
276
276
|
|
|
277
277
|
:host([inverted]) .button--outline:hover {
|
|
278
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
278
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
279
279
|
}
|
|
280
280
|
|
|
281
281
|
/* ─── Prefix / Suffix / Label ─── */
|
package/dist/css/hx-side-nav.css
CHANGED
|
@@ -164,10 +164,18 @@
|
|
|
164
164
|
}
|
|
165
165
|
|
|
166
166
|
.side-nav__toggle {
|
|
167
|
+
forced-color-adjust: none;
|
|
168
|
+
background-color: ButtonFace;
|
|
167
169
|
color: ButtonText;
|
|
168
170
|
border: 1px solid ButtonText;
|
|
169
171
|
}
|
|
170
172
|
|
|
173
|
+
.side-nav__toggle:hover {
|
|
174
|
+
background-color: Highlight;
|
|
175
|
+
color: HighlightText;
|
|
176
|
+
border-color: Highlight;
|
|
177
|
+
}
|
|
178
|
+
|
|
171
179
|
.side-nav__toggle:focus-visible {
|
|
172
180
|
outline: 3px solid Highlight;
|
|
173
181
|
outline-offset: 2px;
|
package/dist/css/hx-toast.css
CHANGED
|
@@ -51,10 +51,10 @@
|
|
|
51
51
|
* are tuned for the lighter -500 surfaces and would fail here (e.g.
|
|
52
52
|
* neutral-900 on primary-600 = 3.07:1), so the on-{role}-strong tokens
|
|
53
53
|
* (neutral-0, no dark-mode flip) keep fg legible on the darker fills.
|
|
54
|
-
* - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.
|
|
54
|
+
* - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.82:1
|
|
55
55
|
* - text.on-success-strong on success.bg-strong (success-700, #146831) = 6.88:1
|
|
56
|
-
* (success-600 #0E8A4A on white = 4.
|
|
57
|
-
* - text.on-error-strong on danger.bg-strong (error-600, #C92A2A) = 5.
|
|
56
|
+
* (success-600 #0E8A4A on white = 4.42:1 — drifts under AA at 14px)
|
|
57
|
+
* - text.on-error-strong on danger.bg-strong (error-600, #C92A2A) = 5.46:1
|
|
58
58
|
* - text.on-warning on warning.bg-strong (warning-500, #C2711C) = 4.83:1
|
|
59
59
|
* (warning stays on the lighter -500 surface so on-warning works)
|
|
60
60
|
*
|
package/dist/css/index.css
CHANGED
package/dist/css/manifest.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"generated": "2026-04-
|
|
2
|
+
"generated": "2026-04-25T21:20:27.890Z",
|
|
3
3
|
"components": [
|
|
4
4
|
{
|
|
5
5
|
"name": "hx-accordion",
|
|
@@ -262,10 +262,12 @@
|
|
|
262
262
|
"--hx-button-inverted-color",
|
|
263
263
|
"--hx-color-action-danger-bg",
|
|
264
264
|
"--hx-color-action-danger-bg-hover",
|
|
265
|
+
"--hx-color-action-ghost-bg-hover",
|
|
265
266
|
"--hx-color-action-ghost-fg",
|
|
266
267
|
"--hx-color-action-primary-bg",
|
|
267
268
|
"--hx-color-action-primary-bg-hover",
|
|
268
269
|
"--hx-color-action-primary-bg-inverted-hover",
|
|
270
|
+
"--hx-color-action-secondary-bg-hover",
|
|
269
271
|
"--hx-color-action-secondary-border",
|
|
270
272
|
"--hx-color-action-secondary-fg",
|
|
271
273
|
"--hx-color-border-on-dark-default",
|
package/dist/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import { H as v } from "./shared/hx-avatar-C9hOmlAb.js";
|
|
|
6
6
|
import { H as E } from "./shared/hx-badge-CQXgOXJM.js";
|
|
7
7
|
import { H as k } from "./shared/hx-banner-DT7Zn9Bo.js";
|
|
8
8
|
import { H as B, a as P } from "./shared/hx-breadcrumb-item-COeYcB2x.js";
|
|
9
|
-
import { H as M } from "./shared/hx-button-
|
|
9
|
+
import { H as M } from "./shared/hx-button-kWxjKqo-.js";
|
|
10
10
|
import { H as N } from "./shared/hx-button-group-BI-QBqmO.js";
|
|
11
11
|
import { H as A } from "./shared/hx-card-CU1QnjNb.js";
|
|
12
12
|
import { H as G, a as U } from "./shared/hx-carousel-item-BaE4hpLl.js";
|
|
@@ -53,7 +53,7 @@ import { H as So } from "./shared/hx-prose-BThYcASV.js";
|
|
|
53
53
|
import { H as To, a as bo } from "./shared/hx-radio-N8xgDd_5.js";
|
|
54
54
|
import { H as go } from "./shared/hx-rating-i2FL1WUN.js";
|
|
55
55
|
import { H as vo } from "./shared/hx-select-vgaBo1Ai.js";
|
|
56
|
-
import { H as Eo, a as Do } from "./shared/hx-nav-item-
|
|
56
|
+
import { H as Eo, a as Do } from "./shared/hx-nav-item-CMyMv5Gv.js";
|
|
57
57
|
import { H as wo } from "./shared/hx-skeleton-Cnieh5Uc.js";
|
|
58
58
|
import { H as Po } from "./shared/hx-slider-ydBamYhd.js";
|
|
59
59
|
import { H as Mo } from "./shared/hx-spinner-DL5AYr16.js";
|
|
@@ -74,7 +74,7 @@ import { F as St, H as yt } from "./shared/hx-text-input-ClrrmoE1.js";
|
|
|
74
74
|
import { H as bt } from "./shared/hx-textarea-D9O4U8cb.js";
|
|
75
75
|
import { H as gt } from "./shared/hx-theme-BiyQ7UUK.js";
|
|
76
76
|
import { H as vt } from "./shared/hx-time-picker-m0z4nFB-.js";
|
|
77
|
-
import { H as Et, a as Dt, t as kt } from "./shared/toast-factory-
|
|
77
|
+
import { H as Et, a as Dt, t as kt } from "./shared/toast-factory-Mz1GaaFF.js";
|
|
78
78
|
import { H as Bt } from "./shared/hx-toggle-button-Dd8clXB4.js";
|
|
79
79
|
import { H as Ft } from "./shared/hx-tooltip-nYOv9OLu.js";
|
|
80
80
|
import { H as Lt } from "./shared/hx-top-nav-CchPYaiV.js";
|
|
@@ -108,7 +108,7 @@ const m = f`
|
|
|
108
108
|
}
|
|
109
109
|
|
|
110
110
|
.button--secondary:hover {
|
|
111
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
111
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-secondary-bg-hover, #ebf8f8));
|
|
112
112
|
}
|
|
113
113
|
|
|
114
114
|
.button--tertiary {
|
|
@@ -149,7 +149,7 @@ const m = f`
|
|
|
149
149
|
}
|
|
150
150
|
|
|
151
151
|
.button--ghost:hover {
|
|
152
|
-
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-
|
|
152
|
+
--hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-ghost-bg-hover, #ebf8f8));
|
|
153
153
|
}
|
|
154
154
|
|
|
155
155
|
.button--outline {
|
|
@@ -248,7 +248,7 @@ const m = f`
|
|
|
248
248
|
}
|
|
249
249
|
|
|
250
250
|
:host([inverted]) .button--secondary:hover {
|
|
251
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
251
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
252
252
|
}
|
|
253
253
|
|
|
254
254
|
/* Tertiary inverted — resting at subtle (10%) lifts to default (30%) on hover
|
|
@@ -272,7 +272,7 @@ const m = f`
|
|
|
272
272
|
:host([inverted]) .button--ghost:hover {
|
|
273
273
|
--hx-button-bg: var(
|
|
274
274
|
--hx-button-inverted-ghost-hover-bg,
|
|
275
|
-
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
275
|
+
var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3))
|
|
276
276
|
);
|
|
277
277
|
}
|
|
278
278
|
|
|
@@ -282,7 +282,7 @@ const m = f`
|
|
|
282
282
|
}
|
|
283
283
|
|
|
284
284
|
:host([inverted]) .button--outline:hover {
|
|
285
|
-
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.
|
|
285
|
+
--hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));
|
|
286
286
|
}
|
|
287
287
|
|
|
288
288
|
/* ─── Prefix / Suffix / Label ─── */
|
|
@@ -552,4 +552,4 @@ e = n([
|
|
|
552
552
|
export {
|
|
553
553
|
e as H
|
|
554
554
|
};
|
|
555
|
-
//# sourceMappingURL=hx-button-
|
|
555
|
+
//# sourceMappingURL=hx-button-kWxjKqo-.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-button-kWxjKqo-.js","sources":["../../src/components/hx-button/hx-button.styles.ts","../../src/components/hx-button/hx-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixButtonStyles = css`\n :host {\n display: inline-block;\n }\n\n :host([disabled]) {\n pointer-events: none;\n opacity: var(--hx-opacity-disabled, 0.5);\n }\n\n :host([full]) {\n display: block;\n width: 100%;\n }\n\n :host([full]) .button {\n width: 100%;\n justify-content: center;\n }\n\n /* ─── Base Button ─── */\n\n .button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2, 0.5rem);\n border: var(--hx-border-width-thin, 1px) solid var(--hx-button-border-color, transparent);\n border-radius: var(--hx-button-border-radius, var(--hx-border-radius-md, 0.375rem));\n background-color: var(--hx-button-bg, var(--hx-color-primary-500, #429797));\n color: var(--hx-button-color, var(--hx-color-neutral-0, #ffffff));\n font-family: var(--hx-button-font-family, var(--hx-font-family-sans, sans-serif));\n font-weight: var(--hx-button-font-weight, var(--hx-font-weight-semibold, 600));\n line-height: var(--hx-line-height-tight, 1.25);\n cursor: pointer;\n transition:\n background-color var(--hx-transition-fast, 150ms ease),\n color var(--hx-transition-fast, 150ms ease),\n border-color var(--hx-transition-fast, 150ms ease),\n box-shadow var(--hx-transition-fast, 150ms ease);\n text-decoration: none;\n white-space: nowrap;\n user-select: none;\n -webkit-user-select: none;\n }\n\n .button:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-button-focus-ring-color, var(--hx-focus-ring-color, #6ab1b1));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .button:hover {\n filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n }\n\n .button:active {\n filter: brightness(var(--hx-filter-brightness-active, 0.8));\n }\n\n /* ─── Size Variants ─── */\n\n /* WCAG 2.5.5 (healthcare mandate): minimum 44px touch target for sm variant.\n min-height uses --hx-touch-target-min to guarantee the interactive area\n meets the threshold even though the visual size token is smaller. */\n .button--sm {\n padding: var(--hx-space-1, 0.25rem) var(--hx-space-3, 0.75rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n min-height: var(--hx-touch-target-min, 2.75rem);\n }\n\n .button--md {\n padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);\n font-size: var(--hx-font-size-md, 1rem);\n min-height: var(--hx-size-10, 2.5rem);\n }\n\n .button--lg {\n padding: var(--hx-space-3, 0.75rem) var(--hx-space-6, 1.5rem);\n font-size: var(--hx-font-size-lg, 1.125rem);\n min-height: var(--hx-size-12, 3rem);\n }\n\n /* ─── Style Variants ─── */\n\n .button--primary {\n --hx-button-bg: var(--hx-color-action-primary-bg, #429797);\n /* Inline #0d1825 matches text.on-primary's resolved primitive (neutral-900);\n cold-start without the semantic still paints AA-tuned dark-on-primary\n rather than white-on-primary (3.43:1 fail). */\n --hx-button-color: var(--hx-color-text-on-primary, #0d1825);\n --hx-button-border-color: transparent;\n }\n\n .button--secondary {\n --hx-button-bg: transparent;\n /* primary-500 (#429797) text on white surface = 3.43:1 — fails AA.\n primary-600 (#0F7078) on white = 6.06:1 — AA pass. */\n --hx-button-color: var(--hx-color-action-secondary-fg, #0f7078);\n --hx-button-border-color: var(--hx-color-action-secondary-border, #0f7078);\n }\n\n .button--secondary:hover {\n --hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-secondary-bg-hover, #ebf8f8));\n }\n\n .button--tertiary {\n --hx-button-bg: var(--hx-color-surface-sunken, #ebeee9);\n --hx-button-color: var(--hx-color-text-primary, #0d1825);\n --hx-button-border-color: transparent;\n }\n\n .button--tertiary:hover {\n --hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n .button--danger {\n --hx-button-bg: var(--hx-color-action-danger-bg, #e5493e);\n /* Inline #0d1825 matches text.on-error's resolved primitive (neutral-900);\n cold-start without the semantic still paints AA-tuned dark-on-error\n rather than white-on-error (3.92:1 fail). */\n --hx-button-color: var(--hx-color-text-on-error, #0d1825);\n --hx-button-border-color: transparent;\n }\n\n /* on-error tokens are tuned for error-500 (neutral-900 on #E5493E ≈ 4.59:1).\n error-600 (#C92A2A) drops that to 2.25:1 — AA fail. text.on-error-strong\n resolves to neutral-0 across modes (no dark flip) so the darker hover fill\n stays legible. Mirrors hx-toast precedent (commit 300e21ab0); routed\n through the semantic tier in 3.2.1 token-cascade remediation. */\n .button--danger:hover {\n --hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-danger-bg-hover, #c92a2a));\n --hx-button-color: var(--hx-color-text-on-error-strong, #ffffff);\n }\n\n .button--ghost {\n --hx-button-bg: transparent;\n /* primary-500 (#429797) text on white surface = 3.43:1 — fails AA.\n primary-600 (#0F7078) on white = 6.06:1 — AA pass. */\n --hx-button-color: var(--hx-color-action-ghost-fg, #0f7078);\n --hx-button-border-color: transparent;\n }\n\n .button--ghost:hover {\n --hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-ghost-bg-hover, #ebf8f8));\n }\n\n .button--outline {\n --hx-button-bg: transparent;\n --hx-button-color: var(--hx-color-text-primary, #0d1825);\n --hx-button-border-color: var(--hx-color-border-strong, #8e9c98);\n }\n\n .button--outline:hover {\n --hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n /* on-primary token resolves to neutral-900 (#0D1825) — tuned for primary-500.\n primary-600 (#0F7078) drops the pair to 3.07:1 — AA fail. text.on-primary-strong\n resolves to neutral-0 across modes (no dark flip) for the darker hover fill.\n Mirrors hx-toast precedent (commit 300e21ab0); routed through the semantic\n tier in 3.2.1 token-cascade remediation. */\n .button--primary:hover {\n --hx-button-bg: var(--hx-button-hover-bg, var(--hx-color-action-primary-bg-hover, #0f7078));\n --hx-button-color: var(--hx-color-text-on-primary-strong, #ffffff);\n }\n\n /* ─── Disabled ─── */\n\n /* Note: opacity is applied on :host([disabled]) above — do NOT add opacity here.\n Stacking opacity on both :host and .button[disabled] would multiply to 0.25. */\n .button[disabled] {\n cursor: not-allowed;\n }\n\n /* ─── Loading State ─── */\n\n .button--loading {\n position: relative;\n cursor: wait;\n }\n\n .button__spinner {\n width: 1em;\n height: 1em;\n flex-shrink: 0;\n animation: hx-spin var(--hx-duration-spinner, 750ms) linear infinite;\n }\n\n @keyframes hx-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .button {\n transition: none;\n }\n\n .button__spinner {\n animation: none;\n opacity: var(--hx-opacity-muted, 0.6);\n }\n }\n\n /* ─── Inverted Mode ─── */\n\n /* Override text color and filter-based hover/active for all variants */\n :host([inverted]) .button {\n color: var(--hx-button-inverted-color, var(--hx-color-text-inverse, #ffffff));\n filter: none;\n }\n\n :host([inverted]) .button:hover {\n filter: none;\n }\n\n :host([inverted]) .button:active {\n filter: none;\n }\n\n :host([inverted]) .button:focus-visible {\n /* WCAG 1.4.11: focus indicator needs ≥3:1 against adjacent colors.\n border-on-dark-default (overlay-white-30) ≈ 2.7:1 on neutral-900 — fails.\n border-on-dark-strong (overlay-white-70) ≈ 5:1 — passes. */\n outline-color: var(\n --hx-button-inverted-focus-ring-color,\n var(--hx-color-border-on-dark-strong, rgba(255, 255, 255, 0.7))\n );\n }\n\n /* Primary inverted — slight transparent white overlay on hover */\n :host([inverted]) .button--primary:hover {\n --hx-button-bg: var(--hx-color-action-primary-bg-inverted-hover, #6ab1b1);\n }\n\n /* Secondary inverted — white border and translucent hover fill */\n :host([inverted]) .button--secondary {\n --hx-button-border-color: var(--hx-color-border-on-dark-strong, rgba(255, 255, 255, 0.7));\n }\n\n :host([inverted]) .button--secondary:hover {\n --hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));\n }\n\n /* Tertiary inverted — resting at subtle (10%) lifts to default (30%) on hover\n so the runtime hover delta is visually distinct, not collapsed onto a\n single token. */\n :host([inverted]) .button--tertiary {\n --hx-button-bg: var(--hx-color-border-on-dark-subtle, rgba(255, 255, 255, 0.1));\n --hx-button-border-color: transparent;\n }\n\n :host([inverted]) .button--tertiary:hover {\n --hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));\n }\n\n /* Ghost inverted — transparent base, translucent hover bg */\n :host([inverted]) .button--ghost {\n --hx-button-bg: transparent;\n --hx-button-border-color: transparent;\n }\n\n :host([inverted]) .button--ghost:hover {\n --hx-button-bg: var(\n --hx-button-inverted-ghost-hover-bg,\n var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3))\n );\n }\n\n /* Outline inverted — white border */\n :host([inverted]) .button--outline {\n --hx-button-border-color: var(--hx-color-border-on-dark-strong, rgba(255, 255, 255, 0.7));\n }\n\n :host([inverted]) .button--outline:hover {\n --hx-button-bg: var(--hx-color-border-on-dark-default, rgba(255, 255, 255, 0.3));\n }\n\n /* ─── Prefix / Suffix / Label ─── */\n\n .button__prefix,\n .button__suffix {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n .button__label {\n flex: 1 1 auto;\n }\n\n /* ─── High Contrast Mode (forced-colors) ─── */\n\n @media (forced-colors: active) {\n .button {\n /* Ensure button outline is visible in Windows High Contrast mode.\n ButtonText/ButtonFace are system colors recognized by the browser. */\n forced-color-adjust: none;\n background-color: ButtonFace;\n color: ButtonText;\n border: 2px solid ButtonText;\n }\n\n .button:hover {\n /* Hover affordance must survive in HC. Highlight/HighlightText is the\n OS-level \"selected\" pair, mirroring the forcedColorsInteractive mixin's\n hover contract — kept inline since this component owns its bespoke HC\n block (XOR rule). */\n background-color: Highlight;\n color: HighlightText;\n border-color: Highlight;\n }\n\n .button:focus-visible {\n outline: 3px solid Highlight;\n outline-offset: 2px;\n }\n\n .button[disabled] {\n background-color: ButtonFace;\n color: GrayText;\n border-color: GrayText;\n opacity: 1;\n }\n\n :host([disabled]) {\n opacity: 1;\n }\n\n .button--loading .button__spinner {\n /* Ensure spinner is visible in HCM */\n forced-color-adjust: auto;\n }\n }\n`;\n","import { html, nothing, type TemplateResult, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { HelixElement } from '../../base/index.js';\nimport { mixinDelegatesAria } from '../../mixins/index.js';\nimport { helixButtonStyles } from './hx-button.styles.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/** Detail for the hx-click event dispatched by hx-button. */\nexport interface HxButtonClickDetail {\n originalEvent: MouseEvent;\n}\n\n/**\n * A production-grade button component for user interaction. Supports multiple\n * visual variants, sizes, loading state, prefix/suffix slots, anchor rendering,\n * and full ElementInternals form association.\n *\n * @summary Primary interactive element for triggering actions and form submission.\n *\n * @tag hx-button\n *\n * @slot - Default slot for button label text or content.\n * @slot prefix - Icon or content rendered before the label.\n * @slot suffix - Icon or content rendered after the label.\n *\n * @fires {CustomEvent<{originalEvent: MouseEvent}>} hx-click - Dispatched when\n * the button is clicked and is neither disabled nor loading.\n *\n * @csspart button - The native button or anchor element.\n * @csspart label - The label text wrapper span.\n * @csspart prefix - The prefix slot container span.\n * @csspart suffix - The suffix slot container span.\n * @csspart spinner - The loading spinner SVG element.\n *\n * @cssprop [--hx-button-bg=var(--hx-color-primary-500)] - Button background color.\n * @cssprop [--hx-button-hover-bg] - Hover background color override. When set, overrides the variant default hover background from outside the shadow DOM.\n * @cssprop [--hx-button-color=var(--hx-color-neutral-0)] - Button text color.\n * @cssprop [--hx-button-border-color=transparent] - Button border color.\n * @cssprop [--hx-button-border-radius=var(--hx-border-radius-md)] - Button border radius.\n * @cssprop [--hx-button-font-family=var(--hx-font-family-sans)] - Button font family.\n * @cssprop [--hx-button-font-weight=var(--hx-font-weight-semibold)] - Button font weight.\n * @cssprop [--hx-button-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n *\n * @cssprop [--hx-button-inverted-color=#ffffff] - Text color when inverted.\n * @cssprop [--hx-button-inverted-ghost-hover-bg=rgba(255,255,255,0.15)] - Ghost hover bg when inverted.\n * @cssprop [--hx-button-inverted-focus-ring-color=rgba(255,255,255,0.5)] - Focus ring color when inverted.\n * @cssprop [--hx-opacity-disabled] - Opacity.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-border-radius-md] - CSS custom property.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-color-neutral-0] - Color.\n * @cssprop [--hx-font-family-sans] - Font family.\n * @cssprop [--hx-font-weight-semibold] - Font weight.\n * @cssprop [--hx-line-height-tight] - Line height.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-filter-brightness-hover] - CSS filter.\n * @cssprop [--hx-filter-brightness-active] - CSS filter.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-touch-target-min] - Minimum touch target size.\n * @cssprop [--hx-space-4] - Spacing token.\n * @cssprop [--hx-font-size-md] - Font size.\n * @cssprop [--hx-size-10] - Size token.\n * @cssprop [--hx-space-6] - Spacing token.\n * @cssprop [--hx-font-size-lg] - Font size.\n * @cssprop [--hx-size-12] - Size token.\n * @cssprop [--hx-color-primary-50] - Color.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-color-error-500] - Color.\n * @cssprop [--hx-color-error-600] - Color.\n * @cssprop [--hx-color-neutral-300] - Color.\n * @cssprop [--hx-color-neutral-50] - Color.\n * @cssprop [--hx-color-primary-600] - Color.\n * @cssprop [--hx-duration-spinner] - Animation duration.\n * @cssprop [--hx-opacity-muted] - Opacity.\n * @cssprop [--hx-overlay-white-50] - Overlay color.\n * @cssprop [--hx-color-primary-400] - Color.\n * @cssprop [--hx-overlay-white-70] - Overlay color.\n * @cssprop [--hx-overlay-white-15] - Overlay color.\n * @cssprop [--hx-overlay-white-25] - Overlay color.\n * @cssprop [--hx-overlay-white-20] - Overlay color.\n */\n@customElement('hx-button')\nexport class HelixButton extends mixinDelegatesAria(HelixElement) {\n // 3.2.1: forced-colors deference is owned by the bespoke @media block in\n // hx-button.styles.ts (covers loading/disabled/focus, not just the base).\n // Do NOT also compose forcedColorsInteractive here — the mixin's docstring\n // forbids dual composition (XOR rule) and the dual approach was flagged in\n // the token-cascade campaign findings.\n static override styles = [helixButtonStyles];\n\n // ─── Form Association ───\n\n /** @internal */\n static override formAssociated = true;\n\n // ─── Public Properties ───\n\n /**\n * Visual style variant of the button.\n * @attr variant\n */\n @property({ type: String, reflect: true })\n variant: 'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline' = 'primary';\n\n /**\n * Size of the button.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Whether the button is disabled. Prevents all interaction and form actions.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Whether the button is in a loading state. Shows spinner, prevents interaction,\n * and sets aria-busy. Does not set the disabled attribute.\n * @attr loading\n */\n @property({ type: Boolean, reflect: true })\n loading = false;\n\n /**\n * The type attribute for the underlying button element. Ignored when href is set.\n * @attr type\n */\n @property({ type: String })\n type: 'button' | 'submit' | 'reset' = 'button';\n\n /**\n * When set, renders an anchor element instead of a button.\n * @attr href\n */\n @property({ type: String })\n href: string | undefined = undefined;\n\n /**\n * Anchor target attribute. Only used when href is set.\n * @attr target\n */\n @property({ type: String })\n target: string | undefined = undefined;\n\n /**\n * Form field name submitted via ElementInternals.setFormValue on submit.\n * @attr name\n */\n @property({ type: String })\n name: string | undefined = undefined;\n\n /**\n * Form field value submitted via ElementInternals.setFormValue on submit.\n * @attr value\n */\n @property({ type: String })\n value: string | undefined = undefined;\n\n /**\n * When true, the button stretches to fill its container width.\n * Sets the host to `display: block` and the inner element to `width: 100%`.\n * @attr full\n */\n @property({ type: Boolean, reflect: true })\n full = false;\n\n /**\n * When true, flips button colors for placement on dark or gradient backgrounds.\n * Forces text to white and adjusts hover/focus ring colors across all variants.\n * @attr inverted\n */\n @property({ type: Boolean, reflect: true })\n inverted = false;\n\n /**\n * Accessible label for icon-only or text-less buttons.\n * Required when the button has no visible text content.\n *\n * Accepts both `accessible-label` and the standard `aria-label` HTML attribute.\n * `accessible-label` takes precedence when both are set.\n *\n * @attr accessible-label\n */\n @property({ type: String, attribute: 'accessible-label' })\n accessibleLabel: string = '';\n\n /**\n * Returns the effective label for the button, checking accessible-label first,\n * then the aria-label attribute, falling back to empty string.\n * @internal\n */\n private get _effectiveLabel(): string {\n return this.accessibleLabel?.trim() || this.ariaLabel?.trim() || '';\n }\n\n // ─── Form API ───\n\n protected override _onFormDisabled(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n // ─── Lifecycle ───\n\n /** @internal */\n private static readonly _VALID_VARIANTS = [\n 'primary',\n 'secondary',\n 'tertiary',\n 'danger',\n 'ghost',\n 'outline',\n ] as const;\n\n // Prevents double-warn on browsers that fire slotchange for empty initial slots.\n private _emptySlotWarnEmitted = false;\n\n override firstUpdated(changedProperties: PropertyValues<this>): void {\n super.firstUpdated(changedProperties);\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n const hasContent = (slot?.assignedNodes({ flatten: true }) ?? []).some(\n (n) => n.nodeType !== Node.TEXT_NODE || (n.textContent?.trim().length ?? 0) > 0,\n );\n if (!hasContent && !this._effectiveLabel) {\n this._emptySlotWarnEmitted = true;\n devWarn(\n 'hx-button',\n 'hx-button has no slot content and no accessible-label — button will have no accessible name.',\n );\n }\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties);\n if (changedProperties.has('variant')) {\n const validVariants: string[] = [...HelixButton._VALID_VARIANTS];\n if (!validVariants.includes(this.variant)) {\n devWarn(\n 'hx-button',\n `Invalid variant \"${this.variant}\". Expected one of: ${validVariants.join(', ')}. Clamping to \"primary\".`,\n );\n this.variant = 'primary';\n }\n }\n }\n\n // ─── Slot Handlers ───\n\n /** @internal */\n private _handleDefaultSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const hasContent = slot\n .assignedNodes({ flatten: true })\n .some((n) => n.nodeType !== Node.TEXT_NODE || (n.textContent?.trim().length ?? 0) > 0);\n if (!hasContent && !this._effectiveLabel && !this._emptySlotWarnEmitted) {\n devWarn(\n 'hx-button',\n 'hx-button has no slot content and no accessible-label — button will have no accessible name.',\n );\n }\n // Only reset once content arrives so the guard stays armed for browsers\n // that fire a second slotchange for the same empty initial slot.\n if (hasContent) {\n this._emptySlotWarnEmitted = false;\n }\n }\n\n // ─── Event Handling ───\n\n /**\n * @private\n * @internal\n */\n private _handleClick(e: MouseEvent): void {\n if (this.disabled || this.loading) {\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n /**\n * Dispatched when the button is clicked.\n * @event hx-click\n */\n this.dispatchEvent(\n new CustomEvent<{ originalEvent: MouseEvent }>('hx-click', {\n bubbles: true,\n composed: true,\n detail: { originalEvent: e },\n }),\n );\n\n // Handle form submission/reset if form-associated and not in anchor mode\n if (this.href === undefined && this.type === 'submit' && this._internals.form) {\n if (this.name !== undefined && this.value !== undefined) {\n this._internals.setFormValue(this.value);\n }\n this._internals.form.requestSubmit();\n } else if (this.href === undefined && this.type === 'reset' && this._internals.form) {\n this._internals.form.reset();\n }\n }\n\n // ─── Render Helpers ───\n\n /**\n * @private\n * @internal\n */\n private _renderSpinner(): TemplateResult {\n return html`\n <svg\n class=\"button__spinner\"\n part=\"spinner\"\n aria-hidden=\"true\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <circle\n class=\"button__spinner-track\"\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n opacity=\"0.3\"\n />\n <path\n class=\"button__spinner-arc\"\n d=\"M12 2a10 10 0 0 1 10 10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n />\n </svg>\n `;\n }\n\n /**\n * @private\n * @internal\n */\n private _renderInner(): TemplateResult {\n return html`\n ${this.loading ? this._renderSpinner() : nothing}\n <span part=\"prefix\" class=\"button__prefix\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\" class=\"button__label\">\n <slot @slotchange=${this._handleDefaultSlotChange}></slot>\n </span>\n <span part=\"suffix\" class=\"button__suffix\">\n <slot name=\"suffix\"></slot>\n </span>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const classes = {\n button: true,\n [`button--${this.variant}`]: true,\n [`button--${this.size}`]: true,\n 'button--loading': this.loading,\n };\n\n if (this.href !== undefined) {\n return html`\n <a\n part=\"button\"\n class=${classMap(classes)}\n href=${this.disabled || this.loading ? nothing : ifDefined(this.href)}\n target=${ifDefined(this.target)}\n rel=${this.target === '_blank' ? 'noopener noreferrer' : nothing}\n aria-label=${this._effectiveLabel || nothing}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-busy=${this.loading ? 'true' : nothing}\n tabindex=${this.disabled ? '-1' : nothing}\n @click=${this._handleClick}\n >\n ${this._renderInner()}\n </a>\n `;\n }\n\n return html`\n <button\n part=\"button\"\n class=${classMap(classes)}\n ?disabled=${this.disabled}\n type=${this.type}\n aria-label=${this._effectiveLabel || nothing}\n aria-busy=${this.loading ? 'true' : nothing}\n @click=${this._handleClick}\n >\n ${this._renderInner()}\n </button>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-button': HelixButton;\n }\n interface HTMLElementEventMap {\n 'hx-click': CustomEvent<{ originalEvent: MouseEvent }>;\n }\n}\n"],"names":["helixButtonStyles","css","HelixButton","mixinDelegatesAria","HelixElement","_a","_b","disabled","changedProperties","slot","n","validVariants","devWarn","e","hasContent","html","nothing","classes","classMap","ifDefined","__decorateClass","property","customElement"],"mappings":";;;;;;;AAEO,MAAMA,IAAoBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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"}
|