@crowdstrike/glide-core 0.27.0 → 0.28.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 (26) hide show
  1. package/dist/dropdown.d.ts +11 -10
  2. package/dist/dropdown.js +94 -97
  3. package/dist/dropdown.option.d.ts +7 -6
  4. package/dist/dropdown.option.js +1 -1
  5. package/dist/dropdown.styles.js +59 -58
  6. package/dist/form-controls-layout.d.ts +1 -1
  7. package/dist/form-controls-layout.js +1 -1
  8. package/dist/icons/checked.js +1 -1
  9. package/dist/input.styles.js +9 -7
  10. package/dist/library/form-control.d.ts +1 -1
  11. package/dist/library/localize.d.ts +5 -0
  12. package/dist/menu.button.styles.js +3 -3
  13. package/dist/menu.link.styles.js +3 -3
  14. package/dist/menu.options.styles.js +0 -4
  15. package/dist/slider.d.ts +116 -0
  16. package/dist/slider.js +168 -0
  17. package/dist/slider.styles.d.ts +2 -0
  18. package/dist/slider.styles.js +168 -0
  19. package/dist/styles/variables.css +1 -1
  20. package/dist/textarea.styles.js +15 -1
  21. package/dist/translations/en.js +1 -1
  22. package/dist/translations/fr.d.ts +1 -1
  23. package/dist/translations/fr.js +1 -1
  24. package/dist/translations/ja.d.ts +1 -1
  25. package/dist/translations/ja.js +1 -1
  26. package/package.json +17 -16
package/dist/slider.styles.js ADDED
@@ -0,0 +1,168 @@
1
+ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export default[css`
2
+ ${focusOutline(".handle:focus-visible")}
3
+ `,css`
4
+ /* The designs call for a bit more spacing than the default when vertical. */
5
+ glide-core-private-label[orientation='vertical']::part(private-tooltips) {
6
+ margin-block-end: var(--glide-core-spacing-base-xxs);
7
+ }
8
+
9
+ .slider-container {
10
+ --private-track-size: 0.375rem;
11
+
12
+ align-items: center;
13
+ display: flex;
14
+ gap: var(--glide-core-spacing-base-md);
15
+ inline-size: 100%;
16
+ justify-content: space-between;
17
+ }
18
+
19
+ .input {
20
+ /* stylelint-disable-next-line property-no-vendor-prefix */
21
+ -moz-appearance: textfield;
22
+ background-color: var(--glide-core-color-interactive-surface-container);
23
+ block-size: 2.125rem;
24
+ border: 1px solid var(--glide-core-color-interactive-stroke-primary);
25
+ border-radius: var(--glide-core-rounding-base-radius-sm);
26
+ box-sizing: border-box;
27
+ inline-size: 2.125rem;
28
+ text-align: center;
29
+
30
+ &::-webkit-outer-spin-button,
31
+ &::-webkit-inner-spin-button {
32
+ appearance: none;
33
+ }
34
+
35
+ &:focus,
36
+ &:hover {
37
+ border-color: var(--glide-core-color-interactive-stroke-primary--hover);
38
+ outline: none;
39
+ transition: border-color 200ms ease-in-out;
40
+ }
41
+
42
+ &.disabled {
43
+ background-color: var(
44
+ --glide-core-color-interactive-surface-container--disabled
45
+ );
46
+ border-color: var(
47
+ --glide-core-color-interactive-stroke-primary--disabled
48
+ );
49
+ color: var(--glide-core-color-interactive-text-default--disabled);
50
+ }
51
+
52
+ &.error {
53
+ border-color: var(--glide-core-color-advisory-stroke-error-primary);
54
+ }
55
+
56
+ /*
57
+ We had to resort to a class selector because there may be a
58
+ bug in Chrome and Safari with ":read-only":
59
+ https://bugs.chromium.org/p/chromium/issues/detail?id=1519649
60
+ */
61
+ &.readonly {
62
+ background-color: transparent;
63
+ border: 1px solid transparent;
64
+ padding-inline-start: 0;
65
+ }
66
+ }
67
+
68
+ .track-container {
69
+ flex-grow: 1;
70
+ min-inline-size: 0;
71
+
72
+ &.single {
73
+ /*
74
+ Without this suggestion from design, when the handle is
75
+ at the min, it would overflow the container and not
76
+ align with label. This isn't needed in multiple mode
77
+ because we have an input to help prevent this from
78
+ happening.
79
+ */
80
+ padding-inline-start: var(--glide-core-spacing-base-sm);
81
+ }
82
+ }
83
+
84
+ .filled-track {
85
+ background-color: var(
86
+ --glide-core-color-interactive-surface-container-active
87
+ );
88
+ block-size: var(--private-track-size);
89
+ border-radius: var(--glide-core-rounding-base-radius-round);
90
+
91
+ /*
92
+ Absolute positioning is required here, as JavaScript is
93
+ used to fill it as the user interacts with the component.
94
+ */
95
+ position: absolute;
96
+
97
+ &.disabled {
98
+ background-color: var(
99
+ --glide-core-color-interactive-surface-container-inactive
100
+ );
101
+ }
102
+ }
103
+
104
+ .unfilled-track {
105
+ background-color: var(--glide-core-color-static-stroke-primary);
106
+ block-size: var(--private-track-size);
107
+ border-radius: var(--glide-core-rounding-base-radius-round);
108
+ inline-size: 100%;
109
+ position: relative;
110
+
111
+ &.disabled {
112
+ background-color: var(--glide-core-color-static-stroke-secondary);
113
+ }
114
+ }
115
+
116
+ .handle {
117
+ background-color: var(
118
+ --glide-core-private-color-slider-and-scrollbar-surface-handle
119
+ );
120
+ block-size: 1.5rem;
121
+ border: 2px solid var(--glide-core-color-interactive-stroke-active);
122
+ border-radius: var(--glide-core-rounding-base-radius-round);
123
+ box-sizing: border-box;
124
+ cursor: pointer;
125
+ inline-size: 1.5rem;
126
+ inset-block-start: 50%;
127
+ position: absolute;
128
+ transform: translate(-50%, -50%);
129
+ transition:
130
+ border 150ms ease-in-out,
131
+ box-shadow 150ms ease-in-out;
132
+
133
+ &:not(.disabled, .readonly):is(:active, :hover) {
134
+ border: 4px solid var(--glide-core-color-interactive-stroke-active);
135
+ box-shadow: var(--glide-core-effect-hovered);
136
+ }
137
+
138
+ &.disabled {
139
+ border-color: var(--glide-core-color-interactive-stroke-primary);
140
+ cursor: not-allowed;
141
+ transition: none;
142
+ }
143
+
144
+ &.readonly {
145
+ transition: none;
146
+ }
147
+ }
148
+
149
+ .meta {
150
+ column-gap: var(--glide-core-spacing-base-xs);
151
+ display: flex;
152
+ font-size: var(--glide-core-typography-size-body-small);
153
+ grid-column: 2;
154
+ justify-content: space-between;
155
+ }
156
+
157
+ .description {
158
+ display: block;
159
+
160
+ &.hidden {
161
+ display: none;
162
+ }
163
+ }
164
+
165
+ .validity-message {
166
+ display: block;
167
+ }
168
+ `];
package/dist/styles/variables.css CHANGED
@@ -1 +1 @@
1
- :root,:host,.theme-light{color-scheme:light;--glide-core-color-static-surface-container: #ffffff;--glide-core-color-static-surface-container-secondary: #f0f0f0;--glide-core-color-static-surface-solid: #212121;--glide-core-color-static-surface-card: #ffffffcc;--glide-core-color-static-surface-overlay: #0000008c;--glide-core-color-static-surface-header: #0000000d;--glide-core-color-static-surface-active: #0051a1;--glide-core-color-static-stroke-primary: #c9c9c9;--glide-core-color-static-stroke-secondary: #e3e3e3;--glide-core-color-static-stroke-frame: #ffffff;--glide-core-color-static-text-default: #212121;--glide-core-color-static-text-secondary: #424242;--glide-core-color-static-text-heading: #424242;--glide-core-color-static-text-onsolid: #ffffff;--glide-core-color-static-text-onsolid-secondary: #8a8a8a;--glide-core-color-static-icon-default: #212121;--glide-core-color-static-icon-secondary: #424242;--glide-core-color-static-icon-heading: #424242;--glide-core-color-static-icon-onsolid: #ffffff;--glide-core-color-interactive-surface-container: #ffffff;--glide-core-color-interactive-surface-container--hover: #cce3fa;--glide-core-color-interactive-surface-container--disabled: #f0f0f0;--glide-core-color-interactive-surface-container-active: #0073e6;--glide-core-color-interactive-surface-container-active--hover: #0051a1;--glide-core-color-interactive-surface-container-active--disabled: #e5f1fc;--glide-core-color-interactive-surface-container-inactive: #8a8a8a;--glide-core-color-interactive-surface-container-clickable: #00000008;--glide-core-color-interactive-stroke-focus: #0073e6;--glide-core-color-interactive-stroke-primary: #c9c9c9;--glide-core-color-interactive-stroke-primary--hover: #0073e6;--glide-core-color-interactive-stroke-primary--disabled: #e5f1fc;--glide-core-color-interactive-stroke-active: #0073e6;--glide-core-color-interactive-stroke-active--hover: #0051a1;--glide-core-color-interactive-stroke-active--disabled: #e5f1fc;--glide-core-color-interactive-stroke-contrast: #6d6d6d;--glide-core-color-interactive-text-link: #0051a1;--glide-core-color-interactive-text-link--disabled: #8a8a8a;--glide-core-color-interactive-text-default: #212121;--glide-core-color-interactive-text-default--active: #ffffff;--glide-core-color-interactive-text-default--disabled: #8a8a8a;--glide-core-color-interactive-text-placeholder: #6d6d6d;--glide-core-color-interactive-text-placeholder--disabled: #8a8a8a;--glide-core-color-interactive-text-onsolid: #ffffff;--glide-core-color-interactive-text-link--hover: #0073e6;--glide-core-color-interactive-icon-link: #0051a1;--glide-core-color-interactive-icon-link--disabled: #8a8a8a;--glide-core-color-interactive-icon-default: #212121;--glide-core-color-interactive-icon-default--active: #ffffff;--glide-core-color-interactive-icon-default--disabled: #8a8a8a;--glide-core-color-interactive-icon-active: #0073e6;--glide-core-color-interactive-icon-active--hover: #0051a1;--glide-core-color-interactive-icon-active--disabled: #e5f1fc;--glide-core-color-interactive-icon-onsolid: #ffffff;--glide-core-color-advisory-surface-info-container: #e5f1fc;--glide-core-color-advisory-surface-info-container-light: #f2f8fe;--glide-core-color-advisory-surface-info-solid: #0073e6;--glide-core-color-advisory-surface-info-solid--hover: #0051a1;--glide-core-color-advisory-surface-attention-container: #fffbeb;--glide-core-color-advisory-surface-attention-container-light: #fffcf2;--glide-core-color-advisory-surface-attention-solid: #ffcc00;--glide-core-color-advisory-surface-attention-solid--hover: #b28f00;--glide-core-color-advisory-surface-warning-container: #fff6e9;--glide-core-color-advisory-surface-warning-container-light: #fffaf2;--glide-core-color-advisory-surface-warning-solid: #ff9500;--glide-core-color-advisory-surface-warning-solid--hover: #b26800;--glide-core-color-advisory-surface-vital-container: #fff0ef;--glide-core-color-advisory-surface-vital-light: #fdf4f4;--glide-core-color-advisory-surface-vital-solid: #db2d24;--glide-core-color-advisory-surface-vital-solid--hover: #992019;--glide-core-color-advisory-surface-success-container: #f1fdf4;--glide-core-color-advisory-surface-success-container-light: #f5fcf7;--glide-core-color-advisory-surface-success-solid: #34c759;--glide-core-color-advisory-surface-success-solid--hover: #248b3e;--glide-core-color-advisory-surface-error-container: #fff0ef;--glide-core-color-advisory-surface-error-container-light: #fdf4f4;--glide-core-color-advisory-surface-error-solid: #db2d24;--glide-core-color-advisory-surface-error-solid--hover: #992019;--glide-core-color-advisory-stroke-info-primary: #0073e6;--glide-core-color-advisory-stroke-info-secondary: #99c7f5;--glide-core-color-advisory-stroke-attention-primary: #ffcc00;--glide-core-color-advisory-stroke-attention-secondary: #ffcc00;--glide-core-color-advisory-stroke-warning-primary: #ff9500;--glide-core-color-advisory-stroke-warning-secondary: #ffbf66;--glide-core-color-advisory-stroke-vital-primary: #db2d24;--glide-core-color-advisory-stroke-vital-secondary: #f1aba7;--glide-core-color-advisory-stroke-success-primary: #34c759;--glide-core-color-advisory-stroke-success-secondary: #d6f4de;--glide-core-color-advisory-stroke-error-primary: #db2d24;--glide-core-color-advisory-stroke-error-secondary: #f8d5d3;--glide-core-color-advisory-text-info: #0073e6;--glide-core-color-advisory-text-info-container: #212121;--glide-core-color-advisory-text-attention: #ffcc00;--glide-core-color-advisory-text-attention-container: #212121;--glide-core-color-advisory-text-warning: #ff9500;--glide-core-color-advisory-text-warning-container: #212121;--glide-core-color-advisory-text-vital: #db2d24;--glide-core-color-advisory-text-vital-container: #212121;--glide-core-color-advisory-text-success: #34c759;--glide-core-color-advisory-text-success-container: #212121;--glide-core-color-advisory-text-error: #db2d24;--glide-core-color-advisory-text-error-container: #212121;--glide-core-color-advisory-icon-info: #0073e6;--glide-core-color-advisory-icon-warning: #ff9500;--glide-core-color-advisory-icon-attention: #ffcc00;--glide-core-color-advisory-icon-vital: #db2d24;--glide-core-color-advisory-icon-success: #34c759;--glide-core-color-advisory-icon-error: #db2d24;--glide-core-color-severity-surface-critical: #fff0ef;--glide-core-color-severity-surface-high: #fffaf2;--glide-core-color-severity-surface-medium: #fffcf2;--glide-core-color-severity-surface-low: #f9f9f9;--glide-core-color-severity-stroke-critical: #f4c0bd;--glide-core-color-severity-stroke-high: #ffbf66;--glide-core-color-severity-stroke-medium: #ffcc00;--glide-core-color-severity-stroke-low: #c9c9c9;--glide-core-color-severity-text-citical: #2c0907;--glide-core-color-severity-text-high: #331e00;--glide-core-color-severity-text-medium: #332900;--glide-core-color-severity-text-low: #212121;--glide-core-color-severity-icon-critical: #db2d24;--glide-core-color-severity-icon-high: #ff9500;--glide-core-color-severity-icon-medium: #ffcc00;--glide-core-color-severity-icon-low: #595959;--glide-core-color-effect-blur-elevation-floating-blur: .25rem;--glide-core-color-effect-color-elevation-hovered: #338febe5;--glide-core-color-effect-color-elevation-lifted: #adadad40;--glide-core-color-effect-color-elevation-raised-1: #0000000d;--glide-core-color-effect-color-elevation-raised-2: #00000026;--glide-core-color-effect-color-elevation-floating: #00000040;--glide-core-color-effect-color-elevation-detail-panel: #adadad;--glide-core-color-effect-position-elevation-floating-y: .25rem;--glide-core-private-color-button-surface-active: #0051a1;--glide-core-private-color-button-stroke-default: #0051a1;--glide-core-private-color-button-text-primary: #ffffff;--glide-core-private-color-button-icon-primary: #ffffff;--glide-core-private-color-checkbox-surface-background-selected--default: #ffffff;--glide-core-private-color-checkbox-surface-background-idle: #ffffff;--glide-core-private-color-checkbox-icon-default--disabled: #d9d9d9;--glide-core-private-color-radio-icon-default--disabled: #d9d9d9;--glide-core-private-color-dialog-and-modal-surface-container: #ffffff;--glide-core-private-color-skeleton-loader-surface-linear-gradient-sides: #0000000d;--glide-core-private-color-skeleton-loader-surface-linear-gradient-middle: #0000001a;--glide-core-private-color-tabs-stroke-underline: #e3e3e3;--glide-core-private-color-template-surface-container-detail: #ffffffe5;--glide-core-private-color-tooltip-surface-container: #212121;--glide-core-private-color-tooltip-text-shortcut: #adadad}:host,.theme-dark{color-scheme:dark;--glide-core-color-static-surface-container: #141414;--glide-core-color-static-surface-container-secondary: #2c2c2c;--glide-core-color-static-surface-solid: #dcdcdc;--glide-core-color-static-surface-card: #ffffff0d;--glide-core-color-static-surface-overlay: #141414bf;--glide-core-color-static-surface-header: #ffffff0d;--glide-core-color-static-surface-active: #6ca4db;--glide-core-color-static-stroke-primary: #ffffff26;--glide-core-color-static-stroke-secondary: #ffffff0d;--glide-core-color-static-stroke-frame: #ffffff40;--glide-core-color-static-text-default: #dcdcdc;--glide-core-color-static-text-secondary: #c4c4c4;--glide-core-color-static-text-heading: #c4c4c4;--glide-core-color-static-text-onsolid: #141414;--glide-core-color-static-text-onsolid-secondary: #7e7e7e;--glide-core-color-static-icon-default: #dcdcdc;--glide-core-color-static-icon-secondary: #c4c4c4;--glide-core-color-static-icon-heading: #c4c4c4;--glide-core-color-static-icon-onsolid: #141414;--glide-core-color-interactive-surface-container: #ffffff0d;--glide-core-color-interactive-surface-container--hover: #1e3e5e;--glide-core-color-interactive-surface-container--disabled: #434343;--glide-core-color-interactive-surface-container-active: #2d7dcc;--glide-core-color-interactive-surface-container-active--hover: #265e95;--glide-core-color-interactive-surface-container-active--disabled: #1c344b;--glide-core-color-interactive-surface-container-inactive: #7e7e7e;--glide-core-color-interactive-surface-container-clickable: #ffffff0d;--glide-core-color-interactive-stroke-focus: #2d7dcc;--glide-core-color-interactive-stroke-primary: #ffffff26;--glide-core-color-interactive-stroke-primary--hover: #2d7dcc;--glide-core-color-interactive-stroke-primary--disabled: #171f26;--glide-core-color-interactive-stroke-active: #2d7dcc;--glide-core-color-interactive-stroke-active--hover: #6ca4db;--glide-core-color-interactive-stroke-active--disabled: #171f26;--glide-core-color-interactive-stroke-contrast: #a1a1a1;--glide-core-color-interactive-text-link: #6ca4db;--glide-core-color-interactive-text-link--disabled: #7e7e7e;--glide-core-color-interactive-text-default: #dcdcdc;--glide-core-color-interactive-text-default--active: #dcdcdc;--glide-core-color-interactive-text-default--disabled: #7e7e7e;--glide-core-color-interactive-text-placeholder: #a1a1a1;--glide-core-color-interactive-text-placeholder--disabled: #7e7e7e;--glide-core-color-interactive-text-onsolid: #141414;--glide-core-color-interactive-text-link--hover: #2d7dcc;--glide-core-color-interactive-icon-link: #6ca4db;--glide-core-color-interactive-icon-link--disabled: #7e7e7e;--glide-core-color-interactive-icon-default: #dcdcdc;--glide-core-color-interactive-icon-default--active: #dcdcdc;--glide-core-color-interactive-icon-default--disabled: #7e7e7e;--glide-core-color-interactive-icon-active: #2d7dcc;--glide-core-color-interactive-icon-active--hover: #6ca4db;--glide-core-color-interactive-icon-active--disabled: #434343;--glide-core-color-interactive-icon-onsolid: #141414;--glide-core-color-advisory-surface-info-container: #171f26;--glide-core-color-advisory-surface-info-container-light: #192939;--glide-core-color-advisory-surface-info-solid: #2d7dcc;--glide-core-color-advisory-surface-info-solid--hover: #6ca4db;--glide-core-color-advisory-surface-attention-container: #2a271a;--glide-core-color-advisory-surface-attention-container-light: #1f1d17;--glide-core-color-advisory-surface-attention-solid: #f0cf4f;--glide-core-color-advisory-surface-attention-solid--hover: #f5dd84;--glide-core-color-advisory-surface-warning-container: #2c241a;--glide-core-color-advisory-surface-warning-container-light: #201c17;--glide-core-color-advisory-surface-warning-solid: #ffb64f;--glide-core-color-advisory-surface-warning-solid--hover: #ffcc84;--glide-core-color-advisory-surface-vital-container: #291d1c;--glide-core-color-advisory-surface-vital-light: #1e1818;--glide-core-color-advisory-surface-vital-solid: #e36963;--glide-core-color-advisory-surface-vital-solid--hover: #eb9692;--glide-core-color-advisory-surface-success-container: #1c261e;--glide-core-color-advisory-surface-success-container-light: #181d19;--glide-core-color-advisory-surface-success-solid: #61c479;--glide-core-color-advisory-surface-success-solid--hover: #90d6a1;--glide-core-color-advisory-surface-error-container: #291d1c;--glide-core-color-advisory-surface-error-container-light: #1e1818;--glide-core-color-advisory-surface-error-solid: #e36963;--glide-core-color-advisory-surface-error-solid--hover: #eb9692;--glide-core-color-advisory-stroke-info-primary: #2d7dcc;--glide-core-color-advisory-stroke-info-secondary: #2d7dcc;--glide-core-color-advisory-stroke-attention-primary: #f0cf4f;--glide-core-color-advisory-stroke-attention-secondary: #f0cf4f;--glide-core-color-advisory-stroke-warning-primary: #ffb64f;--glide-core-color-advisory-stroke-warning-secondary: #a17537;--glide-core-color-advisory-stroke-vital-primary: #e36963;--glide-core-color-advisory-stroke-vital-secondary: #e36963;--glide-core-color-advisory-stroke-success-primary: #61c479;--glide-core-color-advisory-stroke-success-secondary: #233728;--glide-core-color-advisory-stroke-error-primary: #e36963;--glide-core-color-advisory-stroke-error-secondary: #3d2524;--glide-core-color-advisory-text-info: #2d7dcc;--glide-core-color-advisory-text-info-container: #dcdcdc;--glide-core-color-advisory-text-attention: #f0cf4f;--glide-core-color-advisory-text-attention-container: #dcdcdc;--glide-core-color-advisory-text-warning: #ffb64f;--glide-core-color-advisory-text-warning-container: #dcdcdc;--glide-core-color-advisory-text-vital: #e36963;--glide-core-color-advisory-text-vital-container: #dcdcdc;--glide-core-color-advisory-text-success: #61c479;--glide-core-color-advisory-text-success-container: #dcdcdc;--glide-core-color-advisory-text-error: #e36963;--glide-core-color-advisory-text-error-container: #dcdcdc;--glide-core-color-advisory-icon-info: #2d7dcc;--glide-core-color-advisory-icon-warning: #ffb64f;--glide-core-color-advisory-icon-attention: #f0cf4f;--glide-core-color-advisory-icon-vital: #e36963;--glide-core-color-advisory-icon-success: #61c479;--glide-core-color-advisory-icon-error: #e36963;--glide-core-color-severity-surface-critical: #291d1c;--glide-core-color-severity-surface-high: #2c241a;--glide-core-color-severity-surface-medium: #2a271a;--glide-core-color-severity-surface-low: #2c2c2c;--glide-core-color-severity-stroke-critical: #e67873;--glide-core-color-severity-stroke-high: #e7a649;--glide-core-color-severity-stroke-medium: #f0cf4f;--glide-core-color-severity-stroke-low: #727272;--glide-core-color-severity-text-citical: #e67873;--glide-core-color-severity-text-high: #ffb64f;--glide-core-color-severity-text-medium: #f0cf4f;--glide-core-color-severity-text-low: #dcdcdc;--glide-core-color-severity-icon-critical: #e67873;--glide-core-color-severity-icon-high: #ffb64f;--glide-core-color-severity-icon-medium: #f0cf4f;--glide-core-color-severity-icon-low: #727272;--glide-core-color-effect-blur-elevation-floating-blur: 1.5rem;--glide-core-color-effect-color-elevation-hovered: #4a72b1e5;--glide-core-color-effect-color-elevation-lifted: #ffffff00;--glide-core-color-effect-color-elevation-raised-1: #ffffff00;--glide-core-color-effect-color-elevation-raised-2: #ffffff00;--glide-core-color-effect-color-elevation-floating: #14141459;--glide-core-color-effect-color-elevation-detail-panel: #14141480;--glide-core-color-effect-position-elevation-floating-y: .75rem;--glide-core-private-color-button-surface-active: #265e95;--glide-core-private-color-button-stroke-default: #6ca4db;--glide-core-private-color-button-text-primary: #dcdcdc;--glide-core-private-color-button-icon-primary: #dcdcdc;--glide-core-private-color-checkbox-surface-background-selected--default: #ffffff;--glide-core-private-color-checkbox-surface-background-idle: #1414144d;--glide-core-private-color-checkbox-icon-default--disabled: #434343;--glide-core-private-color-radio-icon-default--disabled: #434343;--glide-core-private-color-dialog-and-modal-surface-container: #2c2c2c;--glide-core-private-color-skeleton-loader-surface-linear-gradient-sides: #ffffff0d;--glide-core-private-color-skeleton-loader-surface-linear-gradient-middle: #ffffff1a;--glide-core-private-color-tabs-stroke-underline: #ffffff26;--glide-core-private-color-template-surface-container-detail: #2c2c2c;--glide-core-private-color-tooltip-surface-container: #dcdcdc;--glide-core-private-color-tooltip-text-shortcut: #5b5b5b}:root{--glide-core-effect-hovered: 0px 0px 2px 0px var(--glide-core-color-effect-color-elevation-hovered);--glide-core-effect-lifted: 0px 2px 8px 0px var(--glide-core-color-effect-color-elevation-lifted);--glide-core-effect-raised: 0px 3px 1px 0px var(--glide-core-color-effect-color-elevation-raised-1), 0px 3px 8px 0 var(--glide-core-color-effect-color-elevation-raised-2);--glide-core-effect-floating: 0px var(--glide-core-color-effect-position-elevation-floating-y) var(--glide-core-color-effect-blur-elevation-floating-blur) var(--glide-core-color-effect-color-elevation-floating)}:root{--glide-core-rounding-base-radius-xs: .25rem;--glide-core-rounding-base-radius-sm: .5rem;--glide-core-rounding-base-radius-md: .75rem;--glide-core-rounding-base-radius-round: 12.5rem}:root{--glide-core-spacing-base-xxxs: .125rem;--glide-core-spacing-base-xxs: .25rem;--glide-core-spacing-base-xs: .5rem;--glide-core-spacing-base-sm: .75rem;--glide-core-spacing-base-md: 1rem;--glide-core-spacing-base-lg: 1.5rem;--glide-core-spacing-base-xl: 2rem;--glide-core-spacing-base-xxl: 3rem;--glide-core-spacing-base-xxxl: 4rem;--glide-core-spacing-indent-level-1: 1rem;--glide-core-spacing-indent-level-2: 2.5rem;--glide-core-spacing-indent-level-3: 4rem;--glide-core-spacing-indent-level-4: 5.5rem}:root{--glide-core-stroke-default: .0625rem;--glide-core-stroke-focus: .125rem;--glide-core-stroke-fat: .25rem}:root{--glide-core-typography-size-heading-h1: 1.75rem;--glide-core-typography-size-heading-h2: 1.5rem;--glide-core-typography-size-heading-h3: 1.25rem;--glide-core-typography-size-heading-h4: 1rem;--glide-core-typography-size-heading-h5: .75rem;--glide-core-typography-size-body-large: 1rem;--glide-core-typography-size-body-default: .875rem;--glide-core-typography-size-body-small: .75rem;--glide-core-typography-size-component-chartlabel-md: .625rem;--glide-core-typography-family-primary: "Nunito";--glide-core-typography-family-monospace: "Oxygen Mono";--glide-core-typography-weight-light: 300;--glide-core-typography-weight-regular: 400;--glide-core-typography-weight-semibold: 600;--glide-core-typography-weight-bold: 700;--glide-core-typography-weight-extrabold: 800;--glide-core-typography-weight-italic: italic;--glide-core-typography-height-heading-h1: 2.25rem;--glide-core-typography-height-heading-h2: 2rem;--glide-core-typography-height-heading-h3: 1.625rem;--glide-core-typography-height-heading-h4: 1.375rem;--glide-core-typography-height-heading-h5: 1.125rem;--glide-core-typography-paragraph-body-lg: 0rem;--glide-core-typography-paragraph-body-md: 0rem}
1
+ :root,:host,.theme-light{color-scheme:light;--glide-core-color-static-surface-container: #ffffff;--glide-core-color-static-surface-container-secondary: #f0f0f0;--glide-core-color-static-surface-solid: #212121;--glide-core-color-static-surface-card: #ffffffcc;--glide-core-color-static-surface-overlay: #0000008c;--glide-core-color-static-surface-header: #0000000d;--glide-core-color-static-surface-active: #0051a1;--glide-core-color-static-stroke-primary: #c9c9c9;--glide-core-color-static-stroke-secondary: #e3e3e3;--glide-core-color-static-stroke-frame: #ffffff;--glide-core-color-static-text-default: #212121;--glide-core-color-static-text-secondary: #424242;--glide-core-color-static-text-heading: #424242;--glide-core-color-static-text-onsolid: #ffffff;--glide-core-color-static-text-onsolid-secondary: #8a8a8a;--glide-core-color-static-icon-default: #212121;--glide-core-color-static-icon-secondary: #424242;--glide-core-color-static-icon-heading: #424242;--glide-core-color-static-icon-onsolid: #ffffff;--glide-core-color-interactive-surface-container: #ffffff;--glide-core-color-interactive-surface-container--hover: #cce3fa;--glide-core-color-interactive-surface-container--disabled: #f0f0f0;--glide-core-color-interactive-surface-container-active: #0073e6;--glide-core-color-interactive-surface-container-active--hover: #0051a1;--glide-core-color-interactive-surface-container-active--disabled: #e5f1fc;--glide-core-color-interactive-surface-container-inactive: #8a8a8a;--glide-core-color-interactive-surface-container-clickable: #00000008;--glide-core-color-interactive-stroke-focus: #0073e6;--glide-core-color-interactive-stroke-primary: #c9c9c9;--glide-core-color-interactive-stroke-primary--hover: #0073e6;--glide-core-color-interactive-stroke-primary--disabled: #e5f1fc;--glide-core-color-interactive-stroke-active: #0073e6;--glide-core-color-interactive-stroke-active--hover: #0051a1;--glide-core-color-interactive-stroke-active--disabled: #e5f1fc;--glide-core-color-interactive-stroke-contrast: #6d6d6d;--glide-core-color-interactive-text-link: #0051a1;--glide-core-color-interactive-text-link--disabled: #8a8a8a;--glide-core-color-interactive-text-default: #212121;--glide-core-color-interactive-text-default--active: #ffffff;--glide-core-color-interactive-text-default--disabled: #8a8a8a;--glide-core-color-interactive-text-placeholder: #6d6d6d;--glide-core-color-interactive-text-placeholder--disabled: #8a8a8a;--glide-core-color-interactive-text-onsolid: #ffffff;--glide-core-color-interactive-text-link--hover: #0073e6;--glide-core-color-interactive-icon-link: #0051a1;--glide-core-color-interactive-icon-link--disabled: #8a8a8a;--glide-core-color-interactive-icon-default: #212121;--glide-core-color-interactive-icon-default--active: #ffffff;--glide-core-color-interactive-icon-default--disabled: #8a8a8a;--glide-core-color-interactive-icon-active: #0073e6;--glide-core-color-interactive-icon-active--hover: #0051a1;--glide-core-color-interactive-icon-active--disabled: #e5f1fc;--glide-core-color-interactive-icon-onsolid: #ffffff;--glide-core-color-advisory-surface-info-container: #e5f1fc;--glide-core-color-advisory-surface-info-container-light: #f2f8fe;--glide-core-color-advisory-surface-info-solid: #0073e6;--glide-core-color-advisory-surface-info-solid--hover: #0051a1;--glide-core-color-advisory-surface-attention-container: #fffbeb;--glide-core-color-advisory-surface-attention-container-light: #fffcf2;--glide-core-color-advisory-surface-attention-solid: #ffcc00;--glide-core-color-advisory-surface-attention-solid--hover: #b28f00;--glide-core-color-advisory-surface-warning-container: #fff6e9;--glide-core-color-advisory-surface-warning-container-light: #fffaf2;--glide-core-color-advisory-surface-warning-solid: #ff9500;--glide-core-color-advisory-surface-warning-solid--hover: #b26800;--glide-core-color-advisory-surface-vital-container: #fff0ef;--glide-core-color-advisory-surface-vital-light: #fdf4f4;--glide-core-color-advisory-surface-vital-solid: #db2d24;--glide-core-color-advisory-surface-vital-solid--hover: #992019;--glide-core-color-advisory-surface-success-container: #f1fdf4;--glide-core-color-advisory-surface-success-container-light: #f5fcf7;--glide-core-color-advisory-surface-success-solid: #34c759;--glide-core-color-advisory-surface-success-solid--hover: #248b3e;--glide-core-color-advisory-surface-error-container: #fff0ef;--glide-core-color-advisory-surface-error-container-light: #fdf4f4;--glide-core-color-advisory-surface-error-solid: #db2d24;--glide-core-color-advisory-surface-error-solid--hover: #992019;--glide-core-color-advisory-stroke-info-primary: #0073e6;--glide-core-color-advisory-stroke-info-secondary: #99c7f5;--glide-core-color-advisory-stroke-attention-primary: #ffcc00;--glide-core-color-advisory-stroke-attention-secondary: #ffcc00;--glide-core-color-advisory-stroke-warning-primary: #ff9500;--glide-core-color-advisory-stroke-warning-secondary: #ffbf66;--glide-core-color-advisory-stroke-vital-primary: #db2d24;--glide-core-color-advisory-stroke-vital-secondary: #f1aba7;--glide-core-color-advisory-stroke-success-primary: #34c759;--glide-core-color-advisory-stroke-success-secondary: #d6f4de;--glide-core-color-advisory-stroke-error-primary: #db2d24;--glide-core-color-advisory-stroke-error-secondary: #f8d5d3;--glide-core-color-advisory-text-info: #0073e6;--glide-core-color-advisory-text-info-container: #212121;--glide-core-color-advisory-text-attention: #ffcc00;--glide-core-color-advisory-text-attention-container: #212121;--glide-core-color-advisory-text-warning: #ff9500;--glide-core-color-advisory-text-warning-container: #212121;--glide-core-color-advisory-text-vital: #db2d24;--glide-core-color-advisory-text-vital-container: #212121;--glide-core-color-advisory-text-success: #34c759;--glide-core-color-advisory-text-success-container: #212121;--glide-core-color-advisory-text-error: #db2d24;--glide-core-color-advisory-text-error-container: #212121;--glide-core-color-advisory-icon-info: #0073e6;--glide-core-color-advisory-icon-warning: #ff9500;--glide-core-color-advisory-icon-attention: #ffcc00;--glide-core-color-advisory-icon-vital: #db2d24;--glide-core-color-advisory-icon-success: #34c759;--glide-core-color-advisory-icon-error: #db2d24;--glide-core-color-severity-surface-critical: #fff0ef;--glide-core-color-severity-surface-high: #fffaf2;--glide-core-color-severity-surface-medium: #fffcf2;--glide-core-color-severity-surface-low: #f9f9f9;--glide-core-color-severity-surface-unknown: #6d6d6d;--glide-core-color-severity-stroke-critical: #f4c0bd;--glide-core-color-severity-stroke-high: #ffbf66;--glide-core-color-severity-stroke-medium: #ffcc00;--glide-core-color-severity-stroke-low: #c9c9c9;--glide-core-color-severity-text-citical: #2c0907;--glide-core-color-severity-text-high: #331e00;--glide-core-color-severity-text-medium: #332900;--glide-core-color-severity-text-low: #212121;--glide-core-color-severity-icon-critical: #db2d24;--glide-core-color-severity-icon-high: #ff9500;--glide-core-color-severity-icon-medium: #ffcc00;--glide-core-color-severity-icon-low: #595959;--glide-core-color-effect-blur-elevation-floating-blur: .25rem;--glide-core-color-effect-color-elevation-hovered: #338febe5;--glide-core-color-effect-color-elevation-lifted: #adadad40;--glide-core-color-effect-color-elevation-raised-1: #0000000d;--glide-core-color-effect-color-elevation-raised-2: #00000026;--glide-core-color-effect-color-elevation-floating: #00000040;--glide-core-color-effect-color-elevation-detail-panel: #adadad;--glide-core-color-effect-position-elevation-floating-y: .25rem;--glide-core-private-color-button-surface-active: #0051a1;--glide-core-private-color-button-stroke-default: #0051a1;--glide-core-private-color-button-text-primary: #ffffff;--glide-core-private-color-button-icon-primary: #ffffff;--glide-core-private-color-checkbox-surface-background-selected--default: #ffffff;--glide-core-private-color-checkbox-surface-background-idle: #ffffff;--glide-core-private-color-checkbox-icon-default--disabled: #d9d9d9;--glide-core-private-color-radio-icon-default--disabled: #d9d9d9;--glide-core-private-color-dialog-and-modal-surface-container: #ffffff;--glide-core-private-color-skeleton-loader-surface-linear-gradient-sides: #0000000d;--glide-core-private-color-skeleton-loader-surface-linear-gradient-middle: #0000001a;--glide-core-private-color-slider-and-scrollbar-surface-handle: #f0f0f0;--glide-core-private-color-tabs-stroke-underline: #e3e3e3;--glide-core-private-color-template-surface-container-detail: #ffffffe5;--glide-core-private-color-tooltip-surface-container: #212121;--glide-core-private-color-tooltip-text-shortcut: #adadad}:host,.theme-dark{color-scheme:dark;--glide-core-color-static-surface-container: #141414;--glide-core-color-static-surface-container-secondary: #2c2c2c;--glide-core-color-static-surface-solid: #dcdcdc;--glide-core-color-static-surface-card: #ffffff0d;--glide-core-color-static-surface-overlay: #141414bf;--glide-core-color-static-surface-header: #ffffff0d;--glide-core-color-static-surface-active: #6ca4db;--glide-core-color-static-stroke-primary: #ffffff26;--glide-core-color-static-stroke-secondary: #ffffff0d;--glide-core-color-static-stroke-frame: #ffffff40;--glide-core-color-static-text-default: #dcdcdc;--glide-core-color-static-text-secondary: #c4c4c4;--glide-core-color-static-text-heading: #c4c4c4;--glide-core-color-static-text-onsolid: #141414;--glide-core-color-static-text-onsolid-secondary: #7e7e7e;--glide-core-color-static-icon-default: #dcdcdc;--glide-core-color-static-icon-secondary: #c4c4c4;--glide-core-color-static-icon-heading: #c4c4c4;--glide-core-color-static-icon-onsolid: #141414;--glide-core-color-interactive-surface-container: #ffffff0d;--glide-core-color-interactive-surface-container--hover: #1e3e5e;--glide-core-color-interactive-surface-container--disabled: #434343;--glide-core-color-interactive-surface-container-active: #2d7dcc;--glide-core-color-interactive-surface-container-active--hover: #265e95;--glide-core-color-interactive-surface-container-active--disabled: #1c344b;--glide-core-color-interactive-surface-container-inactive: #7e7e7e;--glide-core-color-interactive-surface-container-clickable: #ffffff0d;--glide-core-color-interactive-stroke-focus: #2d7dcc;--glide-core-color-interactive-stroke-primary: #ffffff26;--glide-core-color-interactive-stroke-primary--hover: #2d7dcc;--glide-core-color-interactive-stroke-primary--disabled: #171f26;--glide-core-color-interactive-stroke-active: #2d7dcc;--glide-core-color-interactive-stroke-active--hover: #6ca4db;--glide-core-color-interactive-stroke-active--disabled: #171f26;--glide-core-color-interactive-stroke-contrast: #a1a1a1;--glide-core-color-interactive-text-link: #6ca4db;--glide-core-color-interactive-text-link--disabled: #7e7e7e;--glide-core-color-interactive-text-default: #dcdcdc;--glide-core-color-interactive-text-default--active: #dcdcdc;--glide-core-color-interactive-text-default--disabled: #7e7e7e;--glide-core-color-interactive-text-placeholder: #a1a1a1;--glide-core-color-interactive-text-placeholder--disabled: #7e7e7e;--glide-core-color-interactive-text-onsolid: #141414;--glide-core-color-interactive-text-link--hover: #2d7dcc;--glide-core-color-interactive-icon-link: #6ca4db;--glide-core-color-interactive-icon-link--disabled: #7e7e7e;--glide-core-color-interactive-icon-default: #dcdcdc;--glide-core-color-interactive-icon-default--active: #dcdcdc;--glide-core-color-interactive-icon-default--disabled: #7e7e7e;--glide-core-color-interactive-icon-active: #2d7dcc;--glide-core-color-interactive-icon-active--hover: #6ca4db;--glide-core-color-interactive-icon-active--disabled: #434343;--glide-core-color-interactive-icon-onsolid: #141414;--glide-core-color-advisory-surface-info-container: #171f26;--glide-core-color-advisory-surface-info-container-light: #192939;--glide-core-color-advisory-surface-info-solid: #2d7dcc;--glide-core-color-advisory-surface-info-solid--hover: #6ca4db;--glide-core-color-advisory-surface-attention-container: #2a271a;--glide-core-color-advisory-surface-attention-container-light: #1f1d17;--glide-core-color-advisory-surface-attention-solid: #f0cf4f;--glide-core-color-advisory-surface-attention-solid--hover: #f5dd84;--glide-core-color-advisory-surface-warning-container: #2c241a;--glide-core-color-advisory-surface-warning-container-light: #201c17;--glide-core-color-advisory-surface-warning-solid: #ffb64f;--glide-core-color-advisory-surface-warning-solid--hover: #ffcc84;--glide-core-color-advisory-surface-vital-container: #291d1c;--glide-core-color-advisory-surface-vital-light: #1e1818;--glide-core-color-advisory-surface-vital-solid: #e36963;--glide-core-color-advisory-surface-vital-solid--hover: #eb9692;--glide-core-color-advisory-surface-success-container: #1c261e;--glide-core-color-advisory-surface-success-container-light: #181d19;--glide-core-color-advisory-surface-success-solid: #61c479;--glide-core-color-advisory-surface-success-solid--hover: #90d6a1;--glide-core-color-advisory-surface-error-container: #291d1c;--glide-core-color-advisory-surface-error-container-light: #1e1818;--glide-core-color-advisory-surface-error-solid: #e36963;--glide-core-color-advisory-surface-error-solid--hover: #eb9692;--glide-core-color-advisory-stroke-info-primary: #2d7dcc;--glide-core-color-advisory-stroke-info-secondary: #2d7dcc;--glide-core-color-advisory-stroke-attention-primary: #f0cf4f;--glide-core-color-advisory-stroke-attention-secondary: #f0cf4f;--glide-core-color-advisory-stroke-warning-primary: #ffb64f;--glide-core-color-advisory-stroke-warning-secondary: #a17537;--glide-core-color-advisory-stroke-vital-primary: #e36963;--glide-core-color-advisory-stroke-vital-secondary: #e36963;--glide-core-color-advisory-stroke-success-primary: #61c479;--glide-core-color-advisory-stroke-success-secondary: #233728;--glide-core-color-advisory-stroke-error-primary: #e36963;--glide-core-color-advisory-stroke-error-secondary: #3d2524;--glide-core-color-advisory-text-info: #2d7dcc;--glide-core-color-advisory-text-info-container: #dcdcdc;--glide-core-color-advisory-text-attention: #f0cf4f;--glide-core-color-advisory-text-attention-container: #dcdcdc;--glide-core-color-advisory-text-warning: #ffb64f;--glide-core-color-advisory-text-warning-container: #dcdcdc;--glide-core-color-advisory-text-vital: #e36963;--glide-core-color-advisory-text-vital-container: #dcdcdc;--glide-core-color-advisory-text-success: #61c479;--glide-core-color-advisory-text-success-container: #dcdcdc;--glide-core-color-advisory-text-error: #e36963;--glide-core-color-advisory-text-error-container: #dcdcdc;--glide-core-color-advisory-icon-info: #2d7dcc;--glide-core-color-advisory-icon-warning: #ffb64f;--glide-core-color-advisory-icon-attention: #f0cf4f;--glide-core-color-advisory-icon-vital: #e36963;--glide-core-color-advisory-icon-success: #61c479;--glide-core-color-advisory-icon-error: #e36963;--glide-core-color-severity-surface-critical: #291d1c;--glide-core-color-severity-surface-high: #2c241a;--glide-core-color-severity-surface-medium: #2a271a;--glide-core-color-severity-surface-low: #2c2c2c;--glide-core-color-severity-surface-unknown: #a1a1a1;--glide-core-color-severity-stroke-critical: #e67873;--glide-core-color-severity-stroke-high: #e7a649;--glide-core-color-severity-stroke-medium: #f0cf4f;--glide-core-color-severity-stroke-low: #727272;--glide-core-color-severity-text-citical: #e67873;--glide-core-color-severity-text-high: #ffb64f;--glide-core-color-severity-text-medium: #f0cf4f;--glide-core-color-severity-text-low: #dcdcdc;--glide-core-color-severity-icon-critical: #e67873;--glide-core-color-severity-icon-high: #ffb64f;--glide-core-color-severity-icon-medium: #f0cf4f;--glide-core-color-severity-icon-low: #727272;--glide-core-color-effect-blur-elevation-floating-blur: 1.5rem;--glide-core-color-effect-color-elevation-hovered: #4a72b1e5;--glide-core-color-effect-color-elevation-lifted: #ffffff00;--glide-core-color-effect-color-elevation-raised-1: #ffffff00;--glide-core-color-effect-color-elevation-raised-2: #ffffff00;--glide-core-color-effect-color-elevation-floating: #14141459;--glide-core-color-effect-color-elevation-detail-panel: #14141480;--glide-core-color-effect-position-elevation-floating-y: .75rem;--glide-core-private-color-button-surface-active: #265e95;--glide-core-private-color-button-stroke-default: #6ca4db;--glide-core-private-color-button-text-primary: #dcdcdc;--glide-core-private-color-button-icon-primary: #dcdcdc;--glide-core-private-color-checkbox-surface-background-selected--default: #ffffff;--glide-core-private-color-checkbox-surface-background-idle: #1414144d;--glide-core-private-color-checkbox-icon-default--disabled: #434343;--glide-core-private-color-radio-icon-default--disabled: #434343;--glide-core-private-color-dialog-and-modal-surface-container: #2c2c2c;--glide-core-private-color-skeleton-loader-surface-linear-gradient-sides: #ffffff0d;--glide-core-private-color-skeleton-loader-surface-linear-gradient-middle: #ffffff1a;--glide-core-private-color-slider-and-scrollbar-surface-handle: #202020;--glide-core-private-color-tabs-stroke-underline: #ffffff26;--glide-core-private-color-template-surface-container-detail: #2c2c2c;--glide-core-private-color-tooltip-surface-container: #dcdcdc;--glide-core-private-color-tooltip-text-shortcut: #5b5b5b}:root{--glide-core-effect-hovered: 0px 0px 2px 0px var(--glide-core-color-effect-color-elevation-hovered);--glide-core-effect-lifted: 0px 2px 8px 0px var(--glide-core-color-effect-color-elevation-lifted);--glide-core-effect-raised: 0px 3px 1px 0px var(--glide-core-color-effect-color-elevation-raised-1), 0px 3px 8px 0 var(--glide-core-color-effect-color-elevation-raised-2);--glide-core-effect-floating: 0px var(--glide-core-color-effect-position-elevation-floating-y) var(--glide-core-color-effect-blur-elevation-floating-blur) var(--glide-core-color-effect-color-elevation-floating)}:root{--glide-core-rounding-base-radius-xs: .25rem;--glide-core-rounding-base-radius-sm: .5rem;--glide-core-rounding-base-radius-md: .75rem;--glide-core-rounding-base-radius-round: 12.5rem}:root{--glide-core-spacing-base-xxxs: .125rem;--glide-core-spacing-base-xxs: .25rem;--glide-core-spacing-base-xs: .5rem;--glide-core-spacing-base-sm: .75rem;--glide-core-spacing-base-md: 1rem;--glide-core-spacing-base-lg: 1.5rem;--glide-core-spacing-base-xl: 2rem;--glide-core-spacing-base-xxl: 3rem;--glide-core-spacing-base-xxxl: 4rem;--glide-core-spacing-indent-level-1: 1rem;--glide-core-spacing-indent-level-2: 2.5rem;--glide-core-spacing-indent-level-3: 4rem;--glide-core-spacing-indent-level-4: 5.5rem}:root{--glide-core-stroke-default: .0625rem;--glide-core-stroke-focus: .125rem;--glide-core-stroke-fat: .25rem}:root{--glide-core-typography-size-heading-h1: 1.75rem;--glide-core-typography-size-heading-h2: 1.5rem;--glide-core-typography-size-heading-h3: 1.25rem;--glide-core-typography-size-heading-h4: 1rem;--glide-core-typography-size-heading-h5: .75rem;--glide-core-typography-size-body-large: 1rem;--glide-core-typography-size-body-default: .875rem;--glide-core-typography-size-body-small: .75rem;--glide-core-typography-size-component-chartlabel-md: .625rem;--glide-core-typography-family-primary: "Nunito";--glide-core-typography-family-monospace: "Oxygen Mono";--glide-core-typography-weight-light: 300;--glide-core-typography-weight-regular: 400;--glide-core-typography-weight-semibold: 600;--glide-core-typography-weight-bold: 700;--glide-core-typography-weight-extrabold: 800;--glide-core-typography-weight-italic: italic;--glide-core-typography-height-heading-h1: 2.25rem;--glide-core-typography-height-heading-h2: 2rem;--glide-core-typography-height-heading-h3: 1.625rem;--glide-core-typography-height-heading-h4: 1.375rem;--glide-core-typography-height-heading-h5: 1.125rem;--glide-core-typography-paragraph-body-lg: 0rem;--glide-core-typography-paragraph-body-md: 0rem}
package/dist/textarea.styles.js CHANGED
@@ -42,6 +42,21 @@ import{css,unsafeCSS}from"lit";import visuallyHidden from"./styles/visually-hidd
42
42
  resize: vertical;
43
43
  transition: border-color 200ms ease-in-out;
44
44
 
45
+ /*
46
+ Because 'field-sizing: content' is used, it allows the
47
+ element to grow to fill the content. This is problematic in
48
+ our case because it means our textarea could force its
49
+ container to scroll when a user enters long, unbroken text.
50
+ This issue was discussed at https://issues.chromium.org/issues/340291325,
51
+ but for the select element. Using 'max-width: 100%' won't
52
+ solve the issue, and we can't use a fixed max-width, as we
53
+ won't know the layouts our consumers will use our components
54
+ in. So setting this CSS property allows for the textarea to
55
+ naturally break the value up by words and prevent horizontal
56
+ scrolling.
57
+ */
58
+ word-break: break-word;
59
+
45
60
  ${fieldSizingContent};
46
61
 
47
62
  &:focus {
@@ -49,7 +64,6 @@ import{css,unsafeCSS}from"lit";import visuallyHidden from"./styles/visually-hidd
49
64
  }
50
65
 
51
66
  &:focus-visible,
52
- &:focus-visible[readonly],
53
67
  &:hover {
54
68
  border-color: var(--glide-core-color-interactive-stroke-primary--hover);
55
69
  }
package/dist/translations/en.js CHANGED
@@ -1 +1 @@
1
- const translation={$code:"en",$name:"English",$dir:"ltr",close:"Close",dismiss:"Dismiss",selectAll:"Select all",notifications:"Notifications",nextTab:"Next tab",previousTab:"Previous tab",noAvailableOptions:"No options available",noMatchingOptions:"No matching options",tooltip:"Tooltip:",severityInformational:"Severity: Informational",severityCritical:"Severity: Critical",severityMedium:"Severity: Medium",success:"Success:",error:"Error:",informational:"Informational:",loading:"Loading",announcedCharacterCount:(t,i)=>`Character count ${t} of ${i}`,displayedCharacterCount:(t,i)=>`${t}/${i}`,clearEntry:t=>`Clear ${t} entry`,editOption:t=>`Edit option: ${t}`,editTag:t=>`Edit tag: ${t}`,removeTag:t=>`Remove tag: ${t}`,itemCount:t=>`${t} items`};export default translation;
1
+ const translation={$code:"en",$name:"English",$dir:"ltr",close:"Close",dismiss:"Dismiss",selectAll:"Select all",notifications:"Notifications",nextTab:"Next tab",previousTab:"Previous tab",noAvailableOptions:"No options available",noMatchingOptions:"No matching options",tooltip:"Tooltip:",severityInformational:"Severity: Informational",severityCritical:"Severity: Critical",severityMedium:"Severity: Medium",success:"Success:",error:"Error:",informational:"Informational:",loading:"Loading",add:"Add",announcedCharacterCount:(i,t)=>`Character count ${i} of ${t}`,displayedCharacterCount:(i,t)=>`${i}/${t}`,clearEntry:i=>`Clear ${i} entry`,editOption:i=>`Edit option: ${i}`,editTag:i=>`Edit tag: ${i}`,removeTag:i=>`Remove tag: ${i}`,itemCount:i=>`${i} items`,maximum:i=>`Maximum ${i}`,setMaximum:i=>`Set maximum ${i}`,minimum:i=>`Minimum ${i}`,setMinimum:i=>`Set minimum ${i}`};export default translation;
package/dist/translations/fr.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { Translation } from '../library/localize.js';
2
- export declare const PENDING_STRINGS: readonly ["severityInformational", "severityCritical", "severityMedium", "success", "error", "informational", "loading", "noAvailableOptions", "noMatchingOptions"];
2
+ export declare const PENDING_STRINGS: readonly ["severityInformational", "severityCritical", "severityMedium", "success", "error", "informational", "loading", "noAvailableOptions", "noMatchingOptions", "maximum", "setMaximum", "minimum", "setMinimum", "add"];
3
3
  type PendingTranslation = (typeof PENDING_STRINGS)[number];
4
4
  declare const translation: Omit<Translation, PendingTranslation>;
5
5
  export default translation;
package/dist/translations/fr.js CHANGED
@@ -1 +1 @@
1
- export const PENDING_STRINGS=["severityInformational","severityCritical","severityMedium","success","error","informational","loading","noAvailableOptions","noMatchingOptions"];const translation={$code:"fr",$name:"French",$dir:"ltr",close:"FERMER",dismiss:"Ignorer",selectAll:"Tout sélectionner",notifications:"Notifications",nextTab:"Onglet suivant",previousTab:"Onglet précédent",tooltip:"Info-bulle :",announcedCharacterCount:(e,t)=>`Nombre de caractères ${e} sur ${t}`,displayedCharacterCount:(e,t)=>`${e}/${t}`,clearEntry:e=>`Effacer l'entrée ${e}`,editOption:e=>`Modifier l'option : ${e}`,editTag:e=>`Modifier la balise : ${e}`,removeTag:e=>`Enlever la balise : ${e}`,itemCount:e=>`${e} éléments`};export default translation;
1
+ export const PENDING_STRINGS=["severityInformational","severityCritical","severityMedium","success","error","informational","loading","noAvailableOptions","noMatchingOptions","maximum","setMaximum","minimum","setMinimum","add"];const translation={$code:"fr",$name:"French",$dir:"ltr",close:"FERMER",dismiss:"Ignorer",selectAll:"Tout sélectionner",notifications:"Notifications",nextTab:"Onglet suivant",previousTab:"Onglet précédent",tooltip:"Info-bulle :",announcedCharacterCount:(e,t)=>`Nombre de caractères ${e} sur ${t}`,displayedCharacterCount:(e,t)=>`${e}/${t}`,clearEntry:e=>`Effacer l'entrée ${e}`,editOption:e=>`Modifier l'option : ${e}`,editTag:e=>`Modifier la balise : ${e}`,removeTag:e=>`Enlever la balise : ${e}`,itemCount:e=>`${e} éléments`};export default translation;
package/dist/translations/ja.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { Translation } from '../library/localize.js';
2
- export declare const PENDING_STRINGS: readonly ["severityInformational", "severityCritical", "severityMedium", "success", "error", "informational", "loading", "noAvailableOptions", "noMatchingOptions"];
2
+ export declare const PENDING_STRINGS: readonly ["severityInformational", "severityCritical", "severityMedium", "success", "error", "informational", "loading", "noAvailableOptions", "noMatchingOptions", "maximum", "setMaximum", "minimum", "setMinimum", "add"];
3
3
  type PendingTranslation = (typeof PENDING_STRINGS)[number];
4
4
  declare const translation: Omit<Translation, PendingTranslation>;
5
5
  export default translation;
package/dist/translations/ja.js CHANGED
@@ -1 +1 @@
1
- export const PENDING_STRINGS=["severityInformational","severityCritical","severityMedium","success","error","informational","loading","noAvailableOptions","noMatchingOptions"];const translation={$code:"ja",$name:"Japanese",$dir:"ltr",close:"閉じる",dismiss:"閉じる",selectAll:"すべて選択",notifications:"通知",nextTab:"Onglet suivant",previousTab:"Onglet précédent",tooltip:"ツールチップ：",announcedCharacterCount:(t,e)=>`文字数 ${t}/${e}`,displayedCharacterCount:(t,e)=>`${t}/${e}`,clearEntry:t=>`${t}入力をクリア`,editOption:t=>`編集オプション：${t}`,editTag:t=>`タグの編集：${t}`,removeTag:t=>`タグの削除：${t}`,itemCount:t=>`${t}件`};export default translation;
1
+ export const PENDING_STRINGS=["severityInformational","severityCritical","severityMedium","success","error","informational","loading","noAvailableOptions","noMatchingOptions","maximum","setMaximum","minimum","setMinimum","add"];const translation={$code:"ja",$name:"Japanese",$dir:"ltr",close:"閉じる",dismiss:"閉じる",selectAll:"すべて選択",notifications:"通知",nextTab:"Onglet suivant",previousTab:"Onglet précédent",tooltip:"ツールチップ：",announcedCharacterCount:(t,e)=>`文字数 ${t}/${e}`,displayedCharacterCount:(t,e)=>`${t}/${e}`,clearEntry:t=>`${t}入力をクリア`,editOption:t=>`編集オプション：${t}`,editTag:t=>`タグの編集：${t}`,removeTag:t=>`タグの削除：${t}`,itemCount:t=>`${t}件`};export default translation;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@crowdstrike/glide-core",
3
- "version": "0.27.0",
3
+ "version": "0.28.0",
4
4
  "description": "A Web Component design system",
5
5
  "author": "CrowdStrike UX Team",
6
6
  "license": "Apache-2.0",
@@ -61,10 +61,10 @@
61
61
  "@changesets/changelog-github": "^0.5.0",
62
62
  "@changesets/cli": "^2.27.10",
63
63
  "@custom-elements-manifest/analyzer": "^0.10.4",
64
- "@eslint/eslintrc": "^3.3.0",
65
- "@eslint/js": "^9.22.0",
64
+ "@eslint/eslintrc": "^3.3.1",
65
+ "@eslint/js": "^9.28.0",
66
66
  "@figma/rest-api-spec": "^0.27.0",
67
- "@html-eslint/eslint-plugin": "^0.40.3",
67
+ "@html-eslint/eslint-plugin": "^0.41.0",
68
68
  "@open-wc/testing": "^4.0.0",
69
69
  "@playwright/test": "^1.52.0",
70
70
  "@rollup/plugin-commonjs": "^28.0.2",
@@ -82,12 +82,12 @@
82
82
  "@types/eslint": "^8.56.12",
83
83
  "@types/mocha": "^10.0.10",
84
84
  "@types/sinon": "^17.0.3",
85
- "@typescript-eslint/rule-tester": "^8.29.0",
86
- "@typescript-eslint/types": "^8.29.0",
87
- "@typescript-eslint/utils": "^8.29.0",
85
+ "@typescript-eslint/rule-tester": "^8.33.0",
86
+ "@typescript-eslint/types": "^8.33.0",
87
+ "@typescript-eslint/utils": "^8.33.0",
88
88
  "@web/dev-server-esbuild": "^1.0.4",
89
89
  "@web/dev-server-rollup": "^0.6.4",
90
- "@web/test-runner": "^0.19.0",
90
+ "@web/test-runner": "^0.20.2",
91
91
  "@web/test-runner-commands": "^0.9.0",
92
92
  "@web/test-runner-playwright": "^0.11.0",
93
93
  "chalk": "^5.3.0",
@@ -95,8 +95,8 @@
95
95
  "comment-parser": "^1.4.1",
96
96
  "custom-elements-manifest": "^2.1.0",
97
97
  "esbuild": "^0.25.0",
98
- "eslint": "^9.22.0",
99
- "eslint-config-prettier": "^10.1.1",
98
+ "eslint": "^9.28.0",
99
+ "eslint-config-prettier": "^10.1.5",
100
100
  "eslint-plugin-import": "^2.31.0",
101
101
  "eslint-plugin-lit": "^1.15.0",
102
102
  "eslint-plugin-lit-a11y": "^4.1.4",
@@ -118,8 +118,8 @@
118
118
  "postcss": "^8.4.49",
119
119
  "postcss-lit": "^1.1.1",
120
120
  "prettier": "^3.5.3",
121
- "react": "^19.0.0",
122
- "react-dom": "^19.0.0",
121
+ "react": "^19.1.0",
122
+ "react-dom": "^19.1.0",
123
123
  "rimraf": "^6.0.1",
124
124
  "sinon": "^19.0.2",
125
125
  "storybook": "^8.6.3",
@@ -133,8 +133,8 @@
133
133
  "ts-lit-plugin": "^2.0.2",
134
134
  "ts-morph": "^25.0.1",
135
135
  "tsx": "^4.19.2",
136
- "typescript": "^5.8.2",
137
- "typescript-eslint": "^8.29.0",
136
+ "typescript": "^5.8.3",
137
+ "typescript-eslint": "^8.33.0",
138
138
  "vite": "^6.3.2",
139
139
  "vitest": "^3.0.8",
140
140
  "yocto-spinner": "^0.2.0"
@@ -154,7 +154,8 @@
154
154
  "start:production": "rimraf ./dist && npm-run-all --aggregate-output --print-label --parallel start:production:typescript start:production:storybook start:production:esbuild",
155
155
  "start:production:esbuild": "node ./esbuild.js",
156
156
  "start:production:cem-analyze": "tsc --noCheck --outDir ./dist && NODE_OPTIONS=--no-warnings=ExperimentalWarning cem analyze --config ./custom-elements.config.js --quiet && git diff --quiet -- || { echo ERROR: Uncommitted elements manifest changes. Run this command locally and commit the changes.; exit 1; }",
157
- "start:production:figma": "tsx ./src/figma/run.ts",
157
+ "start:production:figma:dev-resources": "tsx ./src/figma/dev-resources/run.ts",
158
+ "start:production:figma:variables": "tsx ./src/figma/variables/run.ts",
158
159
  "start:production:storybook": "storybook build --config-dir .storybook --disable-telemetry --output-dir ./dist/storybook",
159
160
  "start:production:ts-morph": "tsx ./src/ts-morph/run.ts && git diff --quiet -- || { echo ERROR: Uncommitted code modifications. Run this command locally and commit the changes.; exit 1; }",
160
161
  "start:production:typescript": "tsc --noCheck --outDir ./dist && node ./terser.js",
@@ -172,7 +173,7 @@
172
173
  "lint:production:stylelint": "tsc --noCheck --outDir ./dist && stylelint '**/*.styles.ts' --custom-syntax postcss-lit --no-color",
173
174
  "test": "per-env",
174
175
  "test:development": "npm-run-all --parallel test:development:web-test-runner test:development:web-test-runner:serve-coverage",
175
- "test:development:playwright": "playwright test --quiet --ui-port 6007 --update-snapshots",
176
+ "test:development:playwright": "playwright test --quiet --ui-port 6007 --update-snapshots --update-source-method=overwrite",
176
177
  "test:development:playwright:update": "rimraf ./src/aria-snapshots && playwright test --quiet --project aria --update-snapshots --update-source-method=overwrite --workers 100%",
177
178
  "test:development:vitest": "vitest --config ./vitest.config.js & chokidar './src/eslint/**' './src/stylelint/**' --ignore './src/eslint/rules/*.test.ts' './src/stylelint/*.test.ts' --initial --silent --command 'tsc --noCheck --outDir ./dist'",
178
179
  "test:development:vitest:comment": "Excluded from `test:development` because Vitest muddies the console when running alongside Web Test Runner.",