@tylertech/forge 3.5.0 → 3.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -439,6 +439,7 @@
439
439
  border-radius: inherit;
440
440
  opacity: var(--_list-item-selected-opacity);
441
441
  background-color: var(--_list-item-selected-background);
442
+ pointer-events: none;
442
443
  }
443
444
  .forge-list-item--selected .forge-list-item__start {
444
445
  color: var(--_list-item-start-selected-color);
package/esm/index.d.ts CHANGED
@@ -79,4 +79,7 @@ export * from './deprecated/icon-button';
79
79
  * Registers all components in the library with the browser.
80
80
  */
81
81
  export declare function defineComponents(): void;
82
+ /**
83
+ * Deprecated component registration
84
+ */
82
85
  export declare function defineDeprecatedComponents(): void;
package/esm/index.js CHANGED
@@ -9,77 +9,76 @@
9
9
  * Copyright (c) Tyler Technologies, Inc.
10
10
  * License: Apache-2.0
11
11
  */
12
- import { defineCustomElements } from '@tylertech/forge-core';
13
- import { AccordionComponent } from './accordion';
14
- import { AppBarComponent, AppBarHelpButtonComponent, AppBarMenuButtonComponent, AppBarNotificationButtonComponent, AppBarProfileButtonComponent, AppBarSearchComponent, ProfileCardComponent } from './app-bar';
15
- import { AutocompleteComponent } from './autocomplete';
16
- import { AvatarComponent } from './avatar';
17
- import { BackdropComponent } from './backdrop';
18
- import { BadgeComponent } from './badge';
19
- import { BannerComponent } from './banner';
20
- import { BottomSheetComponent } from './bottom-sheet';
21
- import { ButtonComponent } from './button';
22
- import { ButtonAreaComponent } from './button-area';
23
- import { ButtonToggleComponent, ButtonToggleGroupComponent } from './button-toggle';
24
- import { CalendarComponent } from './calendar';
25
- import { CardComponent } from './card';
26
- import { CheckboxComponent } from './checkbox';
27
- import { ChipFieldComponent } from './chip-field';
28
- import { ChipComponent, ChipSetComponent } from './chips';
29
- import { CircularProgressComponent } from './circular-progress';
30
- import { ColorPickerComponent } from './color-picker';
31
- import { DatePickerComponent } from './date-picker';
32
- import { DateRangePickerComponent } from './date-range-picker';
33
- import { DialogComponent } from './dialog';
34
- import { DividerComponent } from './divider';
35
- import { DrawerComponent, MiniDrawerComponent, ModalDrawerComponent } from './drawer';
36
- import { ExpansionPanelComponent } from './expansion-panel';
37
- import { FieldComponent } from './field';
38
- import { FilePickerComponent } from './file-picker';
39
- import { FloatingActionButtonComponent } from './floating-action-button';
40
- import { FocusIndicatorComponent } from './focus-indicator';
41
- import { IconComponent } from './icon';
42
- import { IconButtonComponent } from './icon-button';
43
- import { InlineMessageComponent } from './inline-message';
44
- import { KeyComponent, KeyItemComponent } from './key';
45
- import { KeyboardShortcutComponent } from './keyboard-shortcut';
46
- import { LabelComponent } from './label';
47
- import { LabelValueComponent } from './label-value';
48
- import { LinearProgressComponent } from './linear-progress';
49
- import { ListComponent } from './list';
50
- import { ListItemComponent } from './list/list-item';
51
- import { MenuComponent } from './menu';
52
- import { MeterComponent, MeterGroupComponent } from './meter';
53
- import { OpenIconComponent } from './open-icon';
54
- import { OverlayComponent } from './overlay';
55
- import { PageStateComponent } from './page-state';
56
- import { PaginatorComponent } from './paginator';
57
- import { PopoverComponent } from './popover';
58
- import { RadioComponent, RadioGroupComponent } from './radio';
59
- import { ScaffoldComponent } from './scaffold';
60
- import { OptionComponent, OptionGroupComponent, SelectComponent } from './select';
61
- import { SelectDropdownComponent } from './select/select-dropdown';
62
- import { SkeletonComponent } from './skeleton';
63
- import { SkipLinkComponent } from './skip-link';
64
- import { SliderComponent } from './slider';
65
- import { SplitViewComponent } from './split-view';
66
- import { StackComponent } from './stack';
67
- import { StateLayerComponent } from './state-layer';
68
- import { StepComponent, StepperComponent } from './stepper';
69
- import { SwitchComponent } from './switch';
70
- import { TableComponent } from './table';
71
- import { TabBarComponent, TabComponent } from './tabs';
72
- import { TextFieldComponent } from './text-field';
73
- import { TimePickerComponent } from './time-picker';
74
- import { ToastComponent } from './toast';
75
- import { ToolbarComponent } from './toolbar';
76
- import { TooltipComponent } from './tooltip';
77
- import { ViewComponent, ViewSwitcherComponent } from './view-switcher';
12
+ import { defineAccordionComponent } from './accordion';
13
+ import { defineAppBarComponent, defineAppBarHelpButtonComponent, defineAppBarMenuButtonComponent, defineAppBarNotificationButtonComponent, defineAppBarProfileButtonComponent, defineAppBarSearchComponent, defineProfileCardComponent } from './app-bar';
14
+ import { defineAutocompleteComponent } from './autocomplete';
15
+ import { defineAvatarComponent } from './avatar';
16
+ import { defineBackdropComponent } from './backdrop';
17
+ import { defineBadgeComponent } from './badge';
18
+ import { defineBannerComponent } from './banner';
19
+ import { defineBottomSheetComponent } from './bottom-sheet';
20
+ import { defineButtonComponent } from './button';
21
+ import { defineButtonAreaComponent } from './button-area';
22
+ import { defineButtonToggleComponent, defineButtonToggleGroupComponent } from './button-toggle';
23
+ import { defineCalendarComponent } from './calendar';
24
+ import { defineCardComponent } from './card';
25
+ import { defineCheckboxComponent } from './checkbox';
26
+ import { defineChipFieldComponent } from './chip-field';
27
+ import { defineChipComponent, defineChipSetComponent } from './chips';
28
+ import { defineCircularProgressComponent } from './circular-progress';
29
+ import { defineColorPickerComponent } from './color-picker';
30
+ import { defineDatePickerComponent } from './date-picker';
31
+ import { defineDateRangePickerComponent } from './date-range-picker';
32
+ import { defineDialogComponent } from './dialog';
33
+ import { defineDividerComponent } from './divider';
34
+ import { defineDrawerComponent, defineMiniDrawerComponent, defineModalDrawerComponent } from './drawer';
35
+ import { defineExpansionPanelComponent } from './expansion-panel';
36
+ import { defineFieldComponent } from './field';
37
+ import { defineFilePickerComponent } from './file-picker';
38
+ import { defineFloatingActionButtonComponent } from './floating-action-button';
39
+ import { defineFocusIndicatorComponent } from './focus-indicator';
40
+ import { defineIconComponent } from './icon';
41
+ import { defineIconButtonComponent } from './icon-button';
42
+ import { defineInlineMessageComponent } from './inline-message';
43
+ import { defineKeyComponent, defineKeyItemComponent } from './key';
44
+ import { defineKeyboardShortcutComponent } from './keyboard-shortcut';
45
+ import { defineLabelComponent } from './label';
46
+ import { defineLabelValueComponent } from './label-value';
47
+ import { defineLinearProgressComponent } from './linear-progress';
48
+ import { defineListComponent } from './list';
49
+ import { defineListItemComponent } from './list/list-item';
50
+ import { defineMenuComponent } from './menu';
51
+ import { defineMeterComponent, defineMeterGroupComponent } from './meter';
52
+ import { defineOpenIconComponent } from './open-icon';
53
+ import { defineOverlayComponent } from './overlay';
54
+ import { definePageStateComponent } from './page-state';
55
+ import { definePaginatorComponent } from './paginator';
56
+ import { definePopoverComponent } from './popover';
57
+ import { defineRadioComponent, defineRadioGroupComponent } from './radio';
58
+ import { defineScaffoldComponent } from './scaffold';
59
+ import { defineOptionComponent, defineOptionGroupComponent, defineSelectComponent } from './select';
60
+ import { defineSelectDropdownComponent } from './select/select-dropdown';
61
+ import { defineSkeletonComponent } from './skeleton';
62
+ import { defineSkipLinkComponent } from './skip-link';
63
+ import { defineSliderComponent } from './slider';
64
+ import { defineSplitViewComponent } from './split-view';
65
+ import { defineStackComponent } from './stack';
66
+ import { defineStateLayerComponent } from './state-layer';
67
+ import { defineStepComponent, defineStepperComponent } from './stepper';
68
+ import { defineSwitchComponent } from './switch';
69
+ import { defineTableComponent } from './table';
70
+ import { defineTabBarComponent, defineTabComponent } from './tabs';
71
+ import { defineTextFieldComponent } from './text-field';
72
+ import { defineTimePickerComponent } from './time-picker';
73
+ import { defineToastComponent } from './toast';
74
+ import { defineToolbarComponent } from './toolbar';
75
+ import { defineTooltipComponent } from './tooltip';
76
+ import { defineViewComponent, defineViewSwitcherComponent } from './view-switcher';
78
77
  /**
79
78
  * Deprecated imports
80
79
  */
81
- import { DeprecatedButtonComponent } from './deprecated/button';
82
- import { DeprecatedIconButtonComponent } from './deprecated/icon-button';
80
+ import { defineDeprecatedButtonComponent } from './deprecated/button';
81
+ import { defineDeprecatedIconButtonComponent } from './deprecated/icon-button';
83
82
  export * from './accordion';
84
83
  export * from './app-bar';
85
84
  export * from './autocomplete';
@@ -152,101 +151,98 @@ export * from './view-switcher';
152
151
  */
153
152
  export * from './deprecated/button';
154
153
  export * from './deprecated/icon-button';
155
- const CUSTOM_ELEMENTS = [
156
- AccordionComponent,
157
- AppBarComponent,
158
- AppBarHelpButtonComponent,
159
- AppBarMenuButtonComponent,
160
- AppBarNotificationButtonComponent,
161
- AppBarProfileButtonComponent,
162
- AppBarSearchComponent,
163
- AutocompleteComponent,
164
- AvatarComponent,
165
- BackdropComponent,
166
- BadgeComponent,
167
- BannerComponent,
168
- BottomSheetComponent,
169
- ButtonAreaComponent,
170
- ButtonComponent,
171
- ButtonToggleComponent,
172
- ButtonToggleGroupComponent,
173
- CalendarComponent,
174
- CardComponent,
175
- CheckboxComponent,
176
- ChipComponent,
177
- ChipFieldComponent,
178
- ChipSetComponent,
179
- CircularProgressComponent,
180
- ColorPickerComponent,
181
- DatePickerComponent,
182
- DateRangePickerComponent,
183
- DialogComponent,
184
- DividerComponent,
185
- DrawerComponent,
186
- ExpansionPanelComponent,
187
- FieldComponent,
188
- FilePickerComponent,
189
- FloatingActionButtonComponent,
190
- FocusIndicatorComponent,
191
- IconButtonComponent,
192
- IconComponent,
193
- InlineMessageComponent,
194
- KeyComponent,
195
- KeyboardShortcutComponent,
196
- KeyItemComponent,
197
- LabelComponent,
198
- LabelValueComponent,
199
- LinearProgressComponent,
200
- ListComponent,
201
- ListItemComponent,
202
- MenuComponent,
203
- MeterComponent,
204
- MeterGroupComponent,
205
- MiniDrawerComponent,
206
- ModalDrawerComponent,
207
- OpenIconComponent,
208
- OptionComponent,
209
- OptionGroupComponent,
210
- OverlayComponent,
211
- PageStateComponent,
212
- PaginatorComponent,
213
- PopoverComponent,
214
- ProfileCardComponent,
215
- RadioComponent,
216
- RadioGroupComponent,
217
- ScaffoldComponent,
218
- SelectComponent,
219
- SelectDropdownComponent,
220
- SkeletonComponent,
221
- SkipLinkComponent,
222
- SliderComponent,
223
- SplitViewComponent,
224
- StackComponent,
225
- StateLayerComponent,
226
- StepComponent,
227
- StepperComponent,
228
- SwitchComponent,
229
- TabBarComponent,
230
- TabComponent,
231
- TableComponent,
232
- TextFieldComponent,
233
- TimePickerComponent,
234
- ToastComponent,
235
- ToolbarComponent,
236
- TooltipComponent,
237
- ViewComponent,
238
- ViewSwitcherComponent
239
- ];
240
154
  /**
241
155
  * Registers all components in the library with the browser.
242
156
  */
243
157
  export function defineComponents() {
244
- defineCustomElements(CUSTOM_ELEMENTS);
158
+ defineAccordionComponent();
159
+ defineAppBarComponent();
160
+ defineAppBarHelpButtonComponent();
161
+ defineAppBarMenuButtonComponent();
162
+ defineAppBarNotificationButtonComponent();
163
+ defineAppBarProfileButtonComponent();
164
+ defineAppBarSearchComponent();
165
+ defineAutocompleteComponent();
166
+ defineAvatarComponent();
167
+ defineBackdropComponent();
168
+ defineBadgeComponent();
169
+ defineBannerComponent();
170
+ defineBottomSheetComponent();
171
+ defineButtonAreaComponent();
172
+ defineButtonComponent();
173
+ defineButtonToggleComponent();
174
+ defineButtonToggleGroupComponent();
175
+ defineCalendarComponent();
176
+ defineCardComponent();
177
+ defineCheckboxComponent();
178
+ defineChipComponent();
179
+ defineChipFieldComponent();
180
+ defineChipSetComponent();
181
+ defineCircularProgressComponent();
182
+ defineColorPickerComponent();
183
+ defineDatePickerComponent();
184
+ defineDateRangePickerComponent();
185
+ defineDialogComponent();
186
+ defineDividerComponent();
187
+ defineDrawerComponent();
188
+ defineExpansionPanelComponent();
189
+ defineFieldComponent();
190
+ defineFilePickerComponent();
191
+ defineFloatingActionButtonComponent();
192
+ defineFocusIndicatorComponent();
193
+ defineIconButtonComponent();
194
+ defineIconComponent();
195
+ defineInlineMessageComponent();
196
+ defineKeyComponent();
197
+ defineKeyboardShortcutComponent();
198
+ defineKeyItemComponent();
199
+ defineLabelComponent();
200
+ defineLabelValueComponent();
201
+ defineLinearProgressComponent();
202
+ defineListComponent();
203
+ defineListItemComponent();
204
+ defineMenuComponent();
205
+ defineMeterComponent();
206
+ defineMeterGroupComponent();
207
+ defineMiniDrawerComponent();
208
+ defineModalDrawerComponent();
209
+ defineOpenIconComponent();
210
+ defineOptionComponent();
211
+ defineOptionGroupComponent();
212
+ defineOverlayComponent();
213
+ definePageStateComponent();
214
+ definePaginatorComponent();
215
+ definePopoverComponent();
216
+ defineProfileCardComponent();
217
+ defineRadioComponent();
218
+ defineRadioGroupComponent();
219
+ defineScaffoldComponent();
220
+ defineSelectComponent();
221
+ defineSelectDropdownComponent();
222
+ defineSkeletonComponent();
223
+ defineSkipLinkComponent();
224
+ defineSliderComponent();
225
+ defineSplitViewComponent();
226
+ defineStackComponent();
227
+ defineStateLayerComponent();
228
+ defineStepComponent();
229
+ defineStepperComponent();
230
+ defineSwitchComponent();
231
+ defineTabBarComponent();
232
+ defineTabComponent();
233
+ defineTableComponent();
234
+ defineTextFieldComponent();
235
+ defineTimePickerComponent();
236
+ defineToastComponent();
237
+ defineToolbarComponent();
238
+ defineTooltipComponent();
239
+ defineViewComponent();
240
+ defineViewSwitcherComponent();
245
241
  }
246
242
  /**
247
243
  * Deprecated component registration
248
244
  */
249
- const DEPRECATED_CUSTOM_ELEMENTS = [DeprecatedButtonComponent, DeprecatedIconButtonComponent];
250
245
  export function defineDeprecatedComponents() {
251
- defineCustomElements(DEPRECATED_CUSTOM_ELEMENTS);
246
+ defineDeprecatedButtonComponent();
247
+ defineDeprecatedIconButtonComponent();
252
248
  }
@@ -14,7 +14,7 @@ import { WithElementInternals } from '../../core/mixins/internals/with-element-i
14
14
  import { WithDefaultAria } from '../../core/mixins/internals/with-default-aria';
15
15
  import { BaseComponent } from '../../core/base/base-component';
16
16
  const template = '<template><div class=\"forge-list-item\" part=\"root\"><slot name=\"start\"><slot name=\"leading\"></slot></slot><div class=\"text-container\" part=\"text-container\"><slot></slot><slot name=\"secondary-text\"></slot><slot name=\"tertiary-text\"></slot></div><slot name=\"end\"><slot name=\"trailing\"></slot></slot></div></template>';
17
- const styles = ':host{--_list-item-indent:var(--forge-list-item-indent, var(--forge-spacing-xxlarge, 48px));--_list-item-dense-indent:var(--forge-list-item-dense-indent, var(--forge-spacing-xxlarge, 48px));--_list-item-disabled-cursor:var(--forge-list-item-disabled-cursor, not-allowed)}:host{display:block;outline:0}:host([hidden]){display:none}.forge-list-item{--_list-item-background:var(--forge-list-item-background, transparent);--_list-item-shape:var(--forge-list-item-shape, 0);--_list-item-padding:var(--forge-list-item-padding, 0 var(--forge-spacing-medium, 16px));--_list-item-margin:var(--forge-list-item-margin, 0);--_list-item-height:var(--forge-list-item-height, 48px);--_list-item-dense-height:var(--forge-list-item-dense-height, 32px);--_list-item-cursor:var(--forge-list-item-cursor, pointer);--_list-item-gap:var(--forge-list-item-gap, var(--forge-spacing-large, 24px));--_list-item-text-color:var(--forge-list-item-text-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_list-item-text-font-size:var(--forge-list-item-text-font-size, var(--forge-typography-body2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 1))));--_list-item-text-font-weight:var(--forge-list-item-text-font-weight, var(--forge-typography-body2-font-weight, 400));--_list-item-text-line-height:var(--forge-list-item-text-line-height, 1.5rem);--_list-item-selected-color:var(--forge-list-item-selected-color, var(--forge-theme-primary, #3f51b5));--_list-item-selected-background:var(--forge-list-item-selected-background, var(--_list-item-selected-color));--_list-item-selected-opacity:var(--forge-list-item-selected-opacity, 0.08);--_list-item-selected-start-color:var(--forge-list-item-selected-start-color, var(--_list-item-selected-color));--_list-item-selected-end-color:var(--forge-list-item-selected-end-color, var(--_list-item-selected-color));--_list-item-selected-text-color:var(--forge-list-item-selected-text-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_list-item-disabled-opacity:var(--forge-list-item-disabled-opacity, 0.38);--_list-item-one-line-height:var(--forge-list-item-one-line-height, var(--_list-item-height));--_list-item-two-line-height:var(--forge-list-item-two-line-height, var(--forge-list-item-height, 72px));--_list-item-three-line-height:var(--forge-list-item-three-line-height, var(--forge-list-item-height, 88px));--_list-item-dense-one-line-height:var(--forge-list-item-dense-one-line-height, var(--_list-item-dense-height));--_list-item-dense-two-line-height:var(--forge-list-item-dense-two-line-height, var(--forge-list-item-dense-height, 56px));--_list-item-dense-three-line-height:var(--forge-list-item-dense-three-line-height, var(--forge-list-item-dense-height, 72px));--_list-item-dense-font-size:var(--forge-list-item-dense-font-size, 0.875rem);--_list-item-dense-gap:var(--forge-list-item-dense-gap, var(--forge-spacing-xsmall, 8px));--_list-item-start-selected-color:var(--forge-list-item-start-selected-color, var(--_list-item-selected-color));--_list-item-end-selected-color:var(--forge-list-item-end-selected-color, var(--_list-item-selected-color));--_list-item-wrap-padding:var(--forge-list-item-wrap-padding, var(--forge-spacing-xsmall, 8px) var(--forge-spacing-medium, 16px))}.forge-list-item{position:relative;display:flex;gap:var(--_list-item-gap);align-items:center;box-sizing:border-box;outline:0;text-decoration:none;border-radius:var(--_list-item-shape);-webkit-tap-highlight-color:transparent;background-color:var(--_list-item-background);height:var(--_list-item-height);min-height:var(--_list-item-height);padding:var(--_list-item-padding);margin:var(--_list-item-margin)}.forge-list-item.interactive{cursor:var(--_list-item-cursor)}.forge-list-item.disabled{cursor:var(--_list-item-disabled-cursor);opacity:var(--_list-item-disabled-opacity)}.forge-list-item.disabled ::slotted(button){cursor:var(--_list-item-disabled-cursor)}.anchor{position:absolute;inset:0}:host([two-line]) .forge-list-item{height:var(--_list-item-two-line-height);min-height:var(--_list-item-two-line-height)}:host([three-line]) .forge-list-item{height:var(--_list-item-three-line-height);min-height:var(--_list-item-three-line-height)}:host([dense]) .forge-list-item{--_list-item-gap:var(--_list-item-dense-gap);height:var(--_list-item-dense-one-line-height);min-height:var(--_list-item-dense-one-line-height)}:host([dense]) .text-container{font-size:var(--_list-item-dense-font-size)}:host([dense][indented]){margin-inline-start:var(--_list-item-dense-indent)}:host([dense][two-line]) .forge-list-item{height:var(--_list-item-dense-two-line-height);min-height:var(--_list-item-dense-two-line-height)}:host([dense][three-line]) .forge-list-item{height:var(--_list-item-dense-three-line-height);min-height:var(--_list-item-dense-three-line-height)}:host([selected]) .forge-list-item{color:var(--_list-item-selected-color)}:host([selected]) .forge-list-item::before{content:\"\";position:absolute;inset:0;border-radius:inherit;opacity:var(--_list-item-selected-opacity);background-color:var(--_list-item-selected-background)}:host([selected]) .forge-list-item ::slotted([slot=end]),:host([selected]) .forge-list-item ::slotted([slot=leading]),:host([selected]) .forge-list-item ::slotted([slot=start]),:host([selected]) .forge-list-item ::slotted([slot=trailing]){color:var(--_list-item-selected-color)}:host([selected]) .forge-list-item ::slotted([slot=leading]),:host([selected]) .forge-list-item ::slotted([slot=start]){color:var(--_list-item-start-selected-color)}:host([selected]) .forge-list-item ::slotted([slot=end]),:host([selected]) .forge-list-item ::slotted([slot=trailing]){color:var(--_list-item-end-selected-color)}:host([selected]) .text-container{color:var(--_list-item-selected-color)}:host([selected]) forge-state-layer{--forge-state-layer-color:var(--_list-item-selected-color)}:host([indented]){margin-inline-start:var(--_list-item-indent)}.text-container{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));letter-spacing:var(--forge-typography-body2-letter-spacing, .015625em);text-transform:var(--forge-typography-body2-text-transform,inherit);text-decoration:var(--forge-typography-body2-text-decoration,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;isolation:isolate;font-size:var(--_list-item-text-font-size);font-weight:var(--_list-item-text-font-weight);line-height:var(--_list-item-text-line-height);flex:1;contain:layout}slot[name=secondary-text]::slotted(*),slot[name=tertiary-text]::slotted(*){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, .875)));font-weight:var(--forge-typography-body1-font-weight,400);line-height:var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));letter-spacing:var(--forge-typography-body1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-body1-text-transform,inherit);text-decoration:var(--forge-typography-body1-text-decoration,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--_list-item-text-color);display:block}:host([selected]) slot[name=secondary-text]::slotted(*),:host([selected]) slot[name=tertiary-text]::slotted(*){color:var(--_list-item-selected-text-color)}::slotted(:is(button,[role=button][tabindex],[forge-list-item-button])){appearance:none;cursor:var(--_list-item-cursor);border:none;padding-block:0;padding-inline:0;margin:0;box-sizing:border-box;background:0 0;color:inherit;outline:0;font:inherit;user-select:auto;text-align:inherit;letter-spacing:inherit;word-spacing:inherit;display:inline}::slotted(a){outline:0;color:inherit!important;text-decoration:none!important}::slotted([slot=end]),::slotted([slot=leading]),::slotted([slot=start]),::slotted([slot=trailing]){color:var(--_list-item-text-color);display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;fill:currentColor}:host(:not([noninteractive])) ::slotted(:is(forge-checkbox,forge-radio,forge-switch):is([slot=start],[slot=end],[slot=leading],[slot=trailing]):not([forge-ignore])){--forge-focus-indicator-display:none;--forge-state-layer-display:none}:host([selected]) ::slotted([slot=leading]),:host([selected]) ::slotted([slot=start]){color:var(--_list-item-start-selected-color)}:host([selected]) ::slotted([slot=end]),:host([selected]) ::slotted([slot=trailing]){color:var(--_list-item-end-selected-color)}:host([wrap]) .forge-list-item{--_list-item-padding:var(--_list-item-wrap-padding);height:auto}:host([wrap]) .text-container{white-space:normal;overflow:visible;text-overflow:clip;line-height:normal}:host([wrap]) slot[name=secondary-text]::slotted(*),:host([wrap]) slot[name=tertiary-text]::slotted(*){white-space:normal;overflow:visible;text-overflow:clip;line-height:normal}forge-focus-indicator{z-index:1;--forge-focus-indicator-shape:calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1))}forge-state-layer{border-radius:inherit}';
17
+ const styles = ':host{--_list-item-indent:var(--forge-list-item-indent, var(--forge-spacing-xxlarge, 48px));--_list-item-dense-indent:var(--forge-list-item-dense-indent, var(--forge-spacing-xxlarge, 48px));--_list-item-disabled-cursor:var(--forge-list-item-disabled-cursor, not-allowed)}:host{display:block;outline:0}:host([hidden]){display:none}.forge-list-item{--_list-item-background:var(--forge-list-item-background, transparent);--_list-item-shape:var(--forge-list-item-shape, 0);--_list-item-padding:var(--forge-list-item-padding, 0 var(--forge-spacing-medium, 16px));--_list-item-margin:var(--forge-list-item-margin, 0);--_list-item-height:var(--forge-list-item-height, 48px);--_list-item-dense-height:var(--forge-list-item-dense-height, 32px);--_list-item-cursor:var(--forge-list-item-cursor, pointer);--_list-item-gap:var(--forge-list-item-gap, var(--forge-spacing-large, 24px));--_list-item-text-color:var(--forge-list-item-text-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_list-item-text-font-size:var(--forge-list-item-text-font-size, var(--forge-typography-body2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 1))));--_list-item-text-font-weight:var(--forge-list-item-text-font-weight, var(--forge-typography-body2-font-weight, 400));--_list-item-text-line-height:var(--forge-list-item-text-line-height, 1.5rem);--_list-item-selected-color:var(--forge-list-item-selected-color, var(--forge-theme-primary, #3f51b5));--_list-item-selected-background:var(--forge-list-item-selected-background, var(--_list-item-selected-color));--_list-item-selected-opacity:var(--forge-list-item-selected-opacity, 0.08);--_list-item-selected-start-color:var(--forge-list-item-selected-start-color, var(--_list-item-selected-color));--_list-item-selected-end-color:var(--forge-list-item-selected-end-color, var(--_list-item-selected-color));--_list-item-selected-text-color:var(--forge-list-item-selected-text-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));--_list-item-disabled-opacity:var(--forge-list-item-disabled-opacity, 0.38);--_list-item-one-line-height:var(--forge-list-item-one-line-height, var(--_list-item-height));--_list-item-two-line-height:var(--forge-list-item-two-line-height, var(--forge-list-item-height, 72px));--_list-item-three-line-height:var(--forge-list-item-three-line-height, var(--forge-list-item-height, 88px));--_list-item-dense-one-line-height:var(--forge-list-item-dense-one-line-height, var(--_list-item-dense-height));--_list-item-dense-two-line-height:var(--forge-list-item-dense-two-line-height, var(--forge-list-item-dense-height, 56px));--_list-item-dense-three-line-height:var(--forge-list-item-dense-three-line-height, var(--forge-list-item-dense-height, 72px));--_list-item-dense-font-size:var(--forge-list-item-dense-font-size, 0.875rem);--_list-item-dense-gap:var(--forge-list-item-dense-gap, var(--forge-spacing-xsmall, 8px));--_list-item-start-selected-color:var(--forge-list-item-start-selected-color, var(--_list-item-selected-color));--_list-item-end-selected-color:var(--forge-list-item-end-selected-color, var(--_list-item-selected-color));--_list-item-wrap-padding:var(--forge-list-item-wrap-padding, var(--forge-spacing-xsmall, 8px) var(--forge-spacing-medium, 16px))}.forge-list-item{position:relative;display:flex;gap:var(--_list-item-gap);align-items:center;box-sizing:border-box;outline:0;text-decoration:none;border-radius:var(--_list-item-shape);-webkit-tap-highlight-color:transparent;background-color:var(--_list-item-background);height:var(--_list-item-height);min-height:var(--_list-item-height);padding:var(--_list-item-padding);margin:var(--_list-item-margin)}.forge-list-item.interactive{cursor:var(--_list-item-cursor)}.forge-list-item.disabled{cursor:var(--_list-item-disabled-cursor);opacity:var(--_list-item-disabled-opacity)}.forge-list-item.disabled ::slotted(button){cursor:var(--_list-item-disabled-cursor)}.anchor{position:absolute;inset:0}:host([two-line]) .forge-list-item{height:var(--_list-item-two-line-height);min-height:var(--_list-item-two-line-height)}:host([three-line]) .forge-list-item{height:var(--_list-item-three-line-height);min-height:var(--_list-item-three-line-height)}:host([dense]) .forge-list-item{--_list-item-gap:var(--_list-item-dense-gap);height:var(--_list-item-dense-one-line-height);min-height:var(--_list-item-dense-one-line-height)}:host([dense]) .text-container{font-size:var(--_list-item-dense-font-size)}:host([dense][indented]){margin-inline-start:var(--_list-item-dense-indent)}:host([dense][two-line]) .forge-list-item{height:var(--_list-item-dense-two-line-height);min-height:var(--_list-item-dense-two-line-height)}:host([dense][three-line]) .forge-list-item{height:var(--_list-item-dense-three-line-height);min-height:var(--_list-item-dense-three-line-height)}:host([selected]) .forge-list-item{color:var(--_list-item-selected-color)}:host([selected]) .forge-list-item::before{content:\"\";position:absolute;inset:0;border-radius:inherit;opacity:var(--_list-item-selected-opacity);background-color:var(--_list-item-selected-background);pointer-events:none}:host([selected]) .forge-list-item ::slotted([slot=end]),:host([selected]) .forge-list-item ::slotted([slot=leading]),:host([selected]) .forge-list-item ::slotted([slot=start]),:host([selected]) .forge-list-item ::slotted([slot=trailing]){color:var(--_list-item-selected-color);isolation:isolate}:host([selected]) .forge-list-item ::slotted([slot=leading]),:host([selected]) .forge-list-item ::slotted([slot=start]){color:var(--_list-item-start-selected-color)}:host([selected]) .forge-list-item ::slotted([slot=end]),:host([selected]) .forge-list-item ::slotted([slot=trailing]){color:var(--_list-item-end-selected-color)}:host([selected]) .text-container{color:var(--_list-item-selected-color)}:host([selected]) forge-state-layer{--forge-state-layer-color:var(--_list-item-selected-color)}:host([indented]){margin-inline-start:var(--_list-item-indent)}.text-container{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));letter-spacing:var(--forge-typography-body2-letter-spacing, .015625em);text-transform:var(--forge-typography-body2-text-transform,inherit);text-decoration:var(--forge-typography-body2-text-decoration,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;isolation:isolate;font-size:var(--_list-item-text-font-size);font-weight:var(--_list-item-text-font-weight);line-height:var(--_list-item-text-line-height);flex:1;contain:layout}slot[name=secondary-text]::slotted(*),slot[name=tertiary-text]::slotted(*){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, .875)));font-weight:var(--forge-typography-body1-font-weight,400);line-height:var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));letter-spacing:var(--forge-typography-body1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-body1-text-transform,inherit);text-decoration:var(--forge-typography-body1-text-decoration,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--_list-item-text-color);display:block}:host([selected]) slot[name=secondary-text]::slotted(*),:host([selected]) slot[name=tertiary-text]::slotted(*){color:var(--_list-item-selected-text-color)}::slotted(:is(button,[role=button][tabindex],[forge-list-item-button])){appearance:none;cursor:var(--_list-item-cursor);border:none;padding-block:0;padding-inline:0;margin:0;box-sizing:border-box;background:0 0;color:inherit;outline:0;font:inherit;user-select:auto;text-align:inherit;letter-spacing:inherit;word-spacing:inherit;display:inline}::slotted(a){outline:0;color:inherit!important;text-decoration:none!important}::slotted([slot=end]),::slotted([slot=leading]),::slotted([slot=start]),::slotted([slot=trailing]){color:var(--_list-item-text-color);display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;fill:currentColor}:host(:not([noninteractive])) ::slotted(:is(forge-checkbox,forge-radio,forge-switch):is([slot=start],[slot=end],[slot=leading],[slot=trailing]):not([forge-ignore])){--forge-focus-indicator-display:none;--forge-state-layer-display:none}:host([selected]) ::slotted([slot=leading]),:host([selected]) ::slotted([slot=start]){color:var(--_list-item-start-selected-color)}:host([selected]) ::slotted([slot=end]),:host([selected]) ::slotted([slot=trailing]){color:var(--_list-item-end-selected-color)}:host([wrap]) .forge-list-item{--_list-item-padding:var(--_list-item-wrap-padding);height:auto}:host([wrap]) .text-container{white-space:normal;overflow:visible;text-overflow:clip;line-height:normal}:host([wrap]) slot[name=secondary-text]::slotted(*),:host([wrap]) slot[name=tertiary-text]::slotted(*){white-space:normal;overflow:visible;text-overflow:clip;line-height:normal}forge-focus-indicator{z-index:1;--forge-focus-indicator-shape:calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1))}forge-state-layer{border-radius:inherit}';
18
18
  /**
19
19
  * @tag forge-list-item
20
20
  *
@@ -13,7 +13,7 @@ import { SplitViewPanelCore } from './split-view-panel-core';
13
13
  import { SplitViewPanelAdapter } from './split-view-panel-adapter';
14
14
  import { IconComponent, IconRegistry } from '../../icon';
15
15
  const template = '<template><div class=\"forge-split-view-panel\" id=\"root\" part=\"root\"><div class=\"forge-split-view-panel__handle\" id=\"handle\" part=\"handle\" role=\"separator\" aria-controls=\"content\" aria-grabbed=\"false\" tabindex=\"0\"><forge-icon class=\"forge-split-view-panel__icon\" id=\"icon\" part=\"icon\"></forge-icon><forge-state-layer target=\"handle\" id=\"state-layer\" exportparts=\"surface:state-layer\"></forge-state-layer><forge-focus-indicator inward target=\"handle\" part=\"focus-indicator\"></forge-focus-indicator></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
16
- const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:u5bwqam;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u5bwqam{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:u5bwqbl;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u5bwqbl{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:u5bwqbz;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes u5bwqbz{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:u5bwqcx;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes u5bwqcx{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:u5bwqdh;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u5bwqdh{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:u5bwqdw;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u5bwqdw{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:u5bwqeg;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes u5bwqeg{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:u5bwqer;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes u5bwqer{from{transform:none}to{transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
16
+ const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:ufuft4t;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ufuft4t{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:ufuft5a;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ufuft5a{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:ufuft5g;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ufuft5g{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:ufuft5z;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ufuft5z{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:ufuft67;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ufuft67{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:ufuft6a;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ufuft6a{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:ufuft70;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ufuft70{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:ufuft75;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes ufuft75{from{transform:none}to{transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
17
17
  import { StateLayerComponent } from '../../state-layer';
18
18
  import { FocusIndicatorComponent } from '../../focus-indicator';
19
19
  /**
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tylertech/forge",
3
3
  "description": "Tyler Forge™ Web Components library",
4
- "version": "3.5.0",
4
+ "version": "3.5.1",
5
5
  "author": "Tyler Technologies, Inc.",
6
6
  "license": "Apache-2.0",
7
7
  "repository": {
@@ -94,6 +94,7 @@
94
94
  border-radius: inherit;
95
95
  opacity: #{token(selected-opacity)};
96
96
  background-color: #{token(selected-background)};
97
+ pointer-events: none;
97
98
  }
98
99
  }
99
100
 
@@ -111,6 +112,8 @@
111
112
 
112
113
  @mixin start-end-selected {
113
114
  color: #{token(selected-color)};
115
+
116
+ isolation: isolate;
114
117
  }
115
118
 
116
119
  @mixin text {