@tylertech/forge 2.16.6 → 2.18.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 (119) hide show
  1. package/custom-elements.json +152 -0
  2. package/dist/esm/app-bar/help-button/index.js +1 -1
  3. package/dist/esm/app-bar/index.js +1 -1
  4. package/dist/esm/app-bar/profile-button/index.js +1 -1
  5. package/dist/esm/autocomplete/index.js +1 -1
  6. package/dist/esm/calendar/calendar-dropdown/index.js +1 -1
  7. package/dist/esm/calendar/index.js +1 -1
  8. package/dist/esm/chip-field/index.js +1 -1
  9. package/dist/esm/chunks/chunk.3C44DXZ2.js +7 -0
  10. package/dist/esm/chunks/chunk.3C44DXZ2.js.map +7 -0
  11. package/dist/esm/chunks/{chunk.CN4XKIQI.js → chunk.44WDRTRR.js} +2 -2
  12. package/dist/esm/chunks/chunk.6BTPAMJ7.js +7 -0
  13. package/dist/esm/chunks/chunk.6BTPAMJ7.js.map +7 -0
  14. package/dist/esm/chunks/chunk.BINM3NUA.js +7 -0
  15. package/dist/esm/chunks/chunk.BINM3NUA.js.map +7 -0
  16. package/dist/esm/chunks/{chunk.KRUEPHLG.js → chunk.BKNYDA4V.js} +2 -2
  17. package/dist/esm/chunks/{chunk.BTMBIAL2.js → chunk.CR2XZYFM.js} +2 -2
  18. package/dist/esm/chunks/{chunk.BTMBIAL2.js.map → chunk.CR2XZYFM.js.map} +2 -2
  19. package/dist/esm/chunks/{chunk.VUOTKGLB.js → chunk.FBHCNPUL.js} +2 -2
  20. package/dist/esm/chunks/{chunk.VUOTKGLB.js.map → chunk.FBHCNPUL.js.map} +2 -2
  21. package/dist/esm/chunks/chunk.H5XOBZLW.js +7 -0
  22. package/dist/esm/chunks/chunk.H5XOBZLW.js.map +7 -0
  23. package/dist/esm/chunks/{chunk.MWHVRJW5.js → chunk.HHDEJSOK.js} +2 -2
  24. package/dist/esm/chunks/{chunk.D5OLAPHE.js → chunk.JPVIN4NH.js} +2 -2
  25. package/dist/esm/chunks/{chunk.PW7IGEHF.js → chunk.KIBLZSFZ.js} +2 -2
  26. package/dist/esm/chunks/chunk.KQK2XX5H.js +7 -0
  27. package/dist/esm/chunks/chunk.KQK2XX5H.js.map +7 -0
  28. package/dist/esm/chunks/{chunk.PFYLJBUV.js → chunk.L4CNH27W.js} +2 -2
  29. package/dist/esm/chunks/{chunk.PFYLJBUV.js.map → chunk.L4CNH27W.js.map} +2 -2
  30. package/dist/esm/chunks/{chunk.JRUIOKFS.js → chunk.MCIDFQOG.js} +2 -2
  31. package/dist/esm/chunks/{chunk.NEFQWOLN.js → chunk.OYIW3AI6.js} +2 -2
  32. package/dist/esm/chunks/{chunk.QAWXAPHR.js → chunk.QJ7LOIUK.js} +2 -2
  33. package/dist/esm/chunks/chunk.RW6UJSE4.js +7 -0
  34. package/dist/esm/chunks/{chunk.G4DG233F.js.map → chunk.RW6UJSE4.js.map} +2 -2
  35. package/dist/esm/chunks/{chunk.UVW3YDEX.js → chunk.WO32MVS4.js} +2 -2
  36. package/dist/esm/chunks/{chunk.UVW3YDEX.js.map → chunk.WO32MVS4.js.map} +1 -1
  37. package/dist/esm/chunks/{chunk.VNLVFGQ2.js → chunk.WRV4KYM5.js} +2 -2
  38. package/dist/esm/chunks/{chunk.VNLVFGQ2.js.map → chunk.WRV4KYM5.js.map} +2 -2
  39. package/dist/esm/chunks/{chunk.EAGRODVX.js → chunk.WVRUVLT4.js} +2 -2
  40. package/dist/esm/chunks/{chunk.HRNLQ7GB.js → chunk.XNCXVZJA.js} +2 -2
  41. package/dist/esm/chunks/{chunk.6CO3CIUY.js → chunk.Y7N4KA4U.js} +2 -2
  42. package/dist/esm/chunks/{chunk.P4Z7NC6O.js → chunk.Z7KJ4SA5.js} +2 -2
  43. package/dist/esm/chunks/chunk.ZPWB74RA.js +7 -0
  44. package/dist/esm/chunks/chunk.ZPWB74RA.js.map +7 -0
  45. package/dist/esm/date-picker/index.js +1 -1
  46. package/dist/esm/date-range-picker/index.js +1 -1
  47. package/dist/esm/index.js +1 -1
  48. package/dist/esm/keyboard-shortcut/index.js +1 -1
  49. package/dist/esm/list-dropdown/index.js +1 -1
  50. package/dist/esm/menu/index.js +1 -1
  51. package/dist/esm/paginator/index.js +1 -1
  52. package/dist/esm/popup/index.js +1 -1
  53. package/dist/esm/select/core/index.js +1 -1
  54. package/dist/esm/select/index.js +1 -1
  55. package/dist/esm/select/option/index.js +1 -1
  56. package/dist/esm/select/select/index.js +1 -1
  57. package/dist/esm/select/select-dropdown/index.js +1 -1
  58. package/dist/esm/split-view/index.js +1 -1
  59. package/dist/esm/split-view/split-view/index.js +1 -1
  60. package/dist/esm/split-view/split-view-panel/index.js +1 -1
  61. package/dist/esm/time-picker/index.js +1 -1
  62. package/esm/autocomplete/autocomplete-constants.d.ts +3 -0
  63. package/esm/autocomplete/autocomplete-foundation.d.ts +3 -1
  64. package/esm/autocomplete/autocomplete-foundation.js +14 -0
  65. package/esm/autocomplete/autocomplete.d.ts +7 -1
  66. package/esm/autocomplete/autocomplete.js +7 -0
  67. package/esm/calendar/calendar-foundation.js +6 -0
  68. package/esm/chip-field/chip-field-adapter.js +1 -1
  69. package/esm/chip-field/chip-field.js +2 -2
  70. package/esm/date-picker/base/base-date-picker-foundation.js +1 -1
  71. package/esm/date-range-picker/date-range-picker-foundation.js +2 -2
  72. package/esm/keyboard-shortcut/keyboard-shortcut-constants.d.ts +1 -0
  73. package/esm/keyboard-shortcut/keyboard-shortcut-foundation.d.ts +6 -0
  74. package/esm/keyboard-shortcut/keyboard-shortcut-foundation.js +9 -0
  75. package/esm/keyboard-shortcut/keyboard-shortcut.d.ts +4 -0
  76. package/esm/keyboard-shortcut/keyboard-shortcut.js +3 -0
  77. package/esm/list-dropdown/list-dropdown-constants.d.ts +4 -0
  78. package/esm/list-dropdown/list-dropdown-utils.js +14 -3
  79. package/esm/popup/popup-adapter.d.ts +3 -1
  80. package/esm/popup/popup-adapter.js +3 -0
  81. package/esm/popup/popup-foundation.js +5 -3
  82. package/esm/popup/popup.d.ts +4 -1
  83. package/esm/select/core/base-select-adapter.js +3 -0
  84. package/esm/select/option/option-constants.d.ts +1 -0
  85. package/esm/select/option/option-constants.js +1 -0
  86. package/esm/select/option/option-foundation.d.ts +13 -0
  87. package/esm/select/option/option-foundation.js +28 -0
  88. package/esm/select/option/option.d.ts +7 -0
  89. package/esm/select/option/option.js +13 -0
  90. package/esm/split-view/split-view-panel/split-view-panel.js +1 -1
  91. package/esm/time-picker/time-picker-foundation.js +3 -3
  92. package/package.json +1 -1
  93. package/styles/chip-field/_base.scss +1 -0
  94. package/styles/chip-field/_selector.scss +2 -2
  95. package/dist/esm/chunks/chunk.7GCT4NUC.js +0 -7
  96. package/dist/esm/chunks/chunk.7GCT4NUC.js.map +0 -7
  97. package/dist/esm/chunks/chunk.A4UN74PV.js +0 -7
  98. package/dist/esm/chunks/chunk.A4UN74PV.js.map +0 -7
  99. package/dist/esm/chunks/chunk.FFVZ6JMP.js +0 -7
  100. package/dist/esm/chunks/chunk.FFVZ6JMP.js.map +0 -7
  101. package/dist/esm/chunks/chunk.G4DG233F.js +0 -7
  102. package/dist/esm/chunks/chunk.IMEODSRH.js +0 -7
  103. package/dist/esm/chunks/chunk.IMEODSRH.js.map +0 -7
  104. package/dist/esm/chunks/chunk.ROQGMLH3.js +0 -7
  105. package/dist/esm/chunks/chunk.ROQGMLH3.js.map +0 -7
  106. package/dist/esm/chunks/chunk.XMAKEISF.js +0 -7
  107. package/dist/esm/chunks/chunk.XMAKEISF.js.map +0 -7
  108. /package/dist/esm/chunks/{chunk.CN4XKIQI.js.map → chunk.44WDRTRR.js.map} +0 -0
  109. /package/dist/esm/chunks/{chunk.KRUEPHLG.js.map → chunk.BKNYDA4V.js.map} +0 -0
  110. /package/dist/esm/chunks/{chunk.MWHVRJW5.js.map → chunk.HHDEJSOK.js.map} +0 -0
  111. /package/dist/esm/chunks/{chunk.D5OLAPHE.js.map → chunk.JPVIN4NH.js.map} +0 -0
  112. /package/dist/esm/chunks/{chunk.PW7IGEHF.js.map → chunk.KIBLZSFZ.js.map} +0 -0
  113. /package/dist/esm/chunks/{chunk.JRUIOKFS.js.map → chunk.MCIDFQOG.js.map} +0 -0
  114. /package/dist/esm/chunks/{chunk.NEFQWOLN.js.map → chunk.OYIW3AI6.js.map} +0 -0
  115. /package/dist/esm/chunks/{chunk.QAWXAPHR.js.map → chunk.QJ7LOIUK.js.map} +0 -0
  116. /package/dist/esm/chunks/{chunk.EAGRODVX.js.map → chunk.WVRUVLT4.js.map} +0 -0
  117. /package/dist/esm/chunks/{chunk.HRNLQ7GB.js.map → chunk.XNCXVZJA.js.map} +0 -0
  118. /package/dist/esm/chunks/{chunk.6CO3CIUY.js.map → chunk.Y7N4KA4U.js.map} +0 -0
  119. /package/dist/esm/chunks/{chunk.P4Z7NC6O.js.map → chunk.Z7KJ4SA5.js.map} +0 -0
@@ -4,7 +4,7 @@
4
4
  * License: Apache-2.0
5
5
  */
6
6
  import { IListDropdownAware, ListDropdownAware } from '../list-dropdown/list-dropdown-aware';
7
- import { AutocompleteFilterCallback, AutocompleteMode, AutocompleteOptionBuilder, AutocompleteSelectedTextBuilder, IAutocompleteOption, IAutocompleteOptionGroup, IAutocompleteSelectEventData } from './autocomplete-constants';
7
+ import { AutocompleteFilterCallback, AutocompleteMode, AutocompleteOptionBuilder, AutocompleteSelectedTextBuilder, IAutocompleteForceFilterOptions, IAutocompleteOption, IAutocompleteOptionGroup, IAutocompleteSelectEventData } from './autocomplete-constants';
8
8
  export interface IAutocompleteComponent extends IListDropdownAware {
9
9
  mode: `${AutocompleteMode}`;
10
10
  multiple: boolean;
@@ -26,6 +26,7 @@ export interface IAutocompleteComponent extends IListDropdownAware {
26
26
  appendOptions(options: IAutocompleteOption[] | IAutocompleteOptionGroup[]): void;
27
27
  openDropdown(): void;
28
28
  closeDropdown(): void;
29
+ forceFilter(opts?: IAutocompleteForceFilterOptions): void;
29
30
  }
30
31
  declare global {
31
32
  interface HTMLElementTagNameMap {
@@ -93,4 +94,9 @@ export declare class AutocompleteComponent extends ListDropdownAware implements
93
94
  openDropdown(): void;
94
95
  /** Closes the dropdown. */
95
96
  closeDropdown(): void;
97
+ /**
98
+ * Forces the filter callback to be executed to update the current selection state with new options.
99
+ * @param opts
100
+ */
101
+ forceFilter(opts?: IAutocompleteForceFilterOptions): void;
96
102
  }
@@ -108,6 +108,13 @@ let AutocompleteComponent = class AutocompleteComponent extends ListDropdownAwar
108
108
  closeDropdown() {
109
109
  this.open = false;
110
110
  }
111
+ /**
112
+ * Forces the filter callback to be executed to update the current selection state with new options.
113
+ * @param opts
114
+ */
115
+ forceFilter(opts = { preserveValue: false }) {
116
+ this._foundation.forceFilter(opts);
117
+ }
111
118
  };
112
119
  __decorate([
113
120
  FoundationProperty()
@@ -1471,6 +1471,9 @@ export class CalendarFoundation {
1471
1471
  }
1472
1472
  _applyMin() {
1473
1473
  this._adapter.toggleHostAttribute(CALENDAR_CONSTANTS.attributes.MIN, !!this._minAttribute, this._minAttribute);
1474
+ if (this._min && this._min.getMonth() > this._month) {
1475
+ this._month = this._min.getMonth();
1476
+ }
1474
1477
  if (this._isInitialized) {
1475
1478
  this._applyDisabledDates();
1476
1479
  if (this._min && this._min > this._focusedDate) {
@@ -1483,6 +1486,9 @@ export class CalendarFoundation {
1483
1486
  }
1484
1487
  _applyMax() {
1485
1488
  this._adapter.toggleHostAttribute(CALENDAR_CONSTANTS.attributes.MAX, !!this._maxAttribute, this._maxAttribute);
1489
+ if (this._max && this._max.getMonth() < this._month) {
1490
+ this._month = this._max.getMonth();
1491
+ }
1486
1492
  if (this._isInitialized) {
1487
1493
  this._applyDisabledDates();
1488
1494
  if (this._max && this._max < this._focusedDate) {
@@ -46,7 +46,7 @@ export class ChipFieldAdapter extends FieldAdapter {
46
46
  tryPropagateClick(target) {
47
47
  var _a;
48
48
  // We only propagate the click to the input if it originated from our internal input container
49
- if (target instanceof HTMLElement && target.matches(CHIP_FIELD_CONSTANTS.selectors.INPUT_CONTAINER)) {
49
+ if (!this._inputElement.disabled && target instanceof HTMLElement && target.matches(CHIP_FIELD_CONSTANTS.selectors.INPUT_CONTAINER)) {
50
50
  (_a = this._inputElement) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new MouseEvent('click'));
51
51
  }
52
52
  }
@@ -10,8 +10,8 @@ import { ChipFieldFoundation } from './chip-field-foundation';
10
10
  import { CHIP_FIELD_CONSTANTS } from './chip-field-constants';
11
11
  import { ChipComponent } from '../chips';
12
12
  import { FieldComponent } from '../field/field';
13
- const template = '<template><div class=\"forge-chip-field__wrapper\" part=\"root\"><div class=\"forge-chip-field forge-field\" part=\"container\"><slot name=\"leading\"></slot><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><slot name=\"label\"></slot><div class=\"forge-field__input-container\" part=\"input-container\"><slot name=\"member\"></slot><slot></slot></div></div><slot name=\"trailing\"></slot><div class=\"forge-field__addon-end-container\" part=\"addon-end-container\"><slot name=\"addon-end\"></slot></div></div><slot name=\"helper-text\"></slot></div></template>';
14
- const styles = '.forge-field::before{content:\"\";display:-webkit-box;display:flex;position:absolute;top:0;right:0;left:0;z-index:-1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:100%;height:100%;pointer-events:none;border-style:solid;border-style:var(--forge-chip-field-border-style,solid);border-width:1px;-webkit-transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);background-color:transparent;background-color:var(--forge-chip-field-theme-background,transparent);text-align:left}.forge-field[dir=rtl]::before,[dir=rtl] .forge-field::before{text-align:right}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused)::before{border-color:rgba(0,0,0,.38);border-color:var(--mdc-theme-text-icon-on-background,rgba(0,0,0,.38))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused):hover::before{border-color:rgba(0,0,0,.87);border-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled)::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5)}.forge-field--invalid:not(.forge-field--disabled)::before{border-color:#b00020;border-color:var(--mdc-theme-error,#b00020)}.forge-field--invalid:not(.forge-field--disabled):not(.forge-field--focused):hover::before{border-color:#db8a98;border-color:var(--forge-theme-error-hover,#db8a98)}.forge-field--disabled::before{border-color:rgba(0,0,0,.12);border-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--shape-rounded){border-radius:4px}.forge-field:not(.forge-field--shape-rounded)::before{border-radius:4px}.forge-field--shape-rounded{border-radius:28px}.forge-field--shape-rounded::before{border-radius:28px}.forge-field--disabled::before{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5)}.forge-field--focused::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5);border-width:2px}.forge-field__label-input-container{position:relative;-webkit-box-flex:1;flex:1 1 0.0001px;height:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;min-width:0}.forge-field ::slotted(label){color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65));pointer-events:none;right:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);font-size:var(--mdc-typography-subtitle1-font-size, 1rem);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.1rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;-webkit-transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field ::slotted(label[dir=rtl]),[dir=rtl] .forge-field ::slotted(label){right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) ::slotted(label){display:none}.forge-field--required ::slotted(label)::after{content:none}.forge-field--required ::slotted(label)::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){font-size:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){font-size:1rem}.forge-field--disabled ::slotted(label){color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}.forge-field--invalid:not(.forge-field--disabled) ::slotted(label){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) ::slotted(label){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){top:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) ::slotted(label){left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) ::slotted(label){left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) ::slotted(label){padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded ::slotted(label){padding-right:32px}.forge-field ::slotted(label.forge-floating-label--float-above){color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65))}.forge-field--disabled ::slotted(label.forge-floating-label--float-above){color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6))}.forge-field--invalid:not(.forge-field--disabled) ::slotted(label.forge-floating-label--float-above){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) ::slotted(label.forge-floating-label--float-above){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label.forge-floating-label--float-above){-webkit-transform:translateY(-.54rem) scale(.8125);transform:translateY(-.54rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) ::slotted(label.forge-floating-label--float-above){-webkit-transform:translateY(-.72rem) scale(.8125);transform:translateY(-.72rem) scale(.8125);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe){-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.62rem) scale(1);transform:translateY(-.62rem) scale(1);cursor:auto}.forge-field--roomy:not(.forge-field--dense) ::slotted(label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe){-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.8rem) scale(1);transform:translateY(-.8rem) scale(1);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label.forge-floating-label--unfloat-above-start-keyframe){-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.62rem) scale(.8125);transform:translateY(-.62rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) ::slotted(label.forge-floating-label--unfloat-above-start-keyframe){-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.8rem) scale(.8125);transform:translateY(-.8rem) scale(.8125);cursor:auto}.forge-field~::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);display:block;min-height:1.5rem;line-height:normal;padding-top:4px;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-field:not(.forge-field--dense):not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field--roomy:not(.forge-field--dense)~::slotted([slot=helper-text]){font-size:.875rem}.forge-field--dense:not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field~::slotted([slot=helper-text]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled)~::slotted([slot=helper-text]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field:not(.forge-field--shape-rounded)~::slotted([slot=helper-text]){margin-left:12px}.forge-field--shape-rounded~::slotted([slot=helper-text]){margin-left:32px}.forge-field ::slotted([slot=leading]){display:-webkit-box;display:flex;align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=leading]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=leading]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=leading]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=leading]){margin:0 4px}.forge-field ::slotted([slot=leading]:not(forge-icon-button)){padding:6px}.forge-field ::slotted([slot=trailing]){align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=trailing]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=trailing]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=trailing]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=trailing]){margin:0 4px}.forge-field ::slotted([slot=trailing]:not(forge-icon-button)){padding:6px}.forge-field__addon-end-container{display:none}.forge-field--addon-end .forge-field__addon-end-container{height:100%;width:auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:0 4px;border-left-width:1px;border-left-style:solid;-webkit-transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.54);border-left-color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container:hover{border-left-color:rgba(0,0,0,.87);border-left-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#3f51b5;border-left-color:var(--mdc-theme-primary,#3f51b5)}.forge-field.forge-field--invalid:not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#b00020;border-left-color:var(--mdc-theme-error,#b00020)}.forge-field.forge-field--invalid:not(.forge-field--focused):not(.forge-field--disabled) .forge-field__addon-end-container:hover{border-left-color:#db8a98;border-left-color:var(--forge-theme-error-hover,#db8a98)}.forge-field.forge-field--disabled .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.12);border-left-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=addon-end]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=addon-end]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=addon-end]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-chip-field{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:relative;z-index:1;z-index:var(--forge-z-index-surface,1);margin-top:0;margin-top:var(--forge-chip-field-margin-top,0);display:grid;grid-template-columns:[leading] -webkit-min-content [input] 1fr [trailing] -webkit-min-content [addon-end] -webkit-min-content [end];grid-template-columns:[leading] min-content [input] 1fr [trailing] min-content [addon-end] min-content [end]}.forge-chip-field.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-chip-field:not(.forge-field--dense):not(.forge-field--roomy){height:auto;min-height:46px;min-height:var(--forge-chip-field-height,46px)}.forge-chip-field.forge-field--roomy:not(.forge-field--dense){height:auto;min-height:3.5rem;min-height:var(--forge-chip-field-height,3.5rem)}.forge-chip-field.forge-field--dense:not(.forge-field--roomy){height:auto;min-height:1.5rem;min-height:var(--forge-chip-field-height,1.5rem)}.forge-field__label-input-container{grid-column-start:input;grid-column-end:trailing}.forge-field__input-container{-webkit-box-flex:1;flex:1 1 0.0001px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;flex-wrap:wrap;-webkit-box-align:start;align-items:flex-start;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-field__input-container{padding:2px 12px}.forge-field--label .forge-field__input-container{padding-top:22px}.forge-field--roomy.forge-field--label .forge-field__input-container{padding-top:22px}.forge-field--shape-rounded:not(.forge-field--leading) .forge-field__input-container{padding-left:32px}.forge-field--leading:not(.forge-field--shape-rounded) .forge-field__input-container{padding-left:0}.forge-field--shape-rounded.forge-field--leading .forge-field__input-container{padding-left:0}.forge-field--label .forge-field__input-container{padding-bottom:2px}.forge-field--roomy.forge-field--label .forge-field__input-container{padding-bottom:2px}.forge-field--shape-rounded:not(.forge-field--trailing):not(.forge-field--addon-end) .forge-field__input-container{padding-right:32px}.forge-field--addon-end:not(.forge-field--shape-rounded) .forge-field__input-container,.forge-field--trailing:not(.forge-field--shape-rounded) .forge-field__input-container{padding-right:0}.forge-field--shape-rounded.forge-field--addon-end .forge-field__input-container,.forge-field--shape-rounded.forge-field--trailing .forge-field__input-container{padding-right:0}.forge-field ::slotted([slot=member]){display:block}.forge-field--disabled ::slotted([slot=member]){--mdc-theme-primary:rgba(0, 0, 0, 0.38);--mdc-theme-primary:var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));cursor:not-allowed;pointer-events:none}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=member]){margin:2px 8px 2px 0}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=member]){margin:6px 12px 6px 0}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=member]){margin:2px 6px 2px 0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=member]){--forge-chip-min-height:20px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=member]){--forge-chip-min-height:16px}.forge-field ::slotted(input){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;-webkit-transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);border:none;background:0 0;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0}.forge-field ::slotted(input)::-webkit-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input)::-moz-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input):-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input)::-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input)::placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input):invalid{-webkit-box-shadow:none;box-shadow:none}.forge-field ::slotted(input):-webkit-autofill{z-index:auto!important}.forge-field:not(.forge-field--disabled) ::slotted(input){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled ::slotted(input){color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(input){font-size:1rem;font-size:var(--forge-chip-field-font-size, 1rem)}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){font-size:1rem;font-size:var(--forge-chip-field-font-size, 1rem)}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){font-size:.875rem;font-size:var(--forge-chip-field-font-size, .875rem)}.forge-field ::slotted(input){-webkit-box-flex:1;flex:1 1 0.0001px;min-width:40px;display:block;align-self:flex-start;padding:0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(input){margin:4px 0}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){margin:6px 0}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){margin:2px 0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(input){height:1rem;line-height:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){height:1.25rem;line-height:1.25rem}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){height:1rem;line-height:1rem}.forge-field ::slotted([slot=leading]){grid-column-start:leading;grid-column-end:input;align-self:flex-start}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=leading]){margin-top:5px;margin-bottom:5px}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=leading]){margin-top:10px;margin-bottom:10px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=leading]){margin-top:0;margin-bottom:0}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=leading]){padding-top:0;padding-bottom:0}.forge-field ::slotted([slot=trailing]){grid-column-start:trailing;grid-column-end:addon-end;display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start;align-self:flex-start}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=trailing]){margin-top:5px;margin-bottom:5px}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=trailing]){margin-top:10px;margin-bottom:10px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=trailing]){margin-top:0;margin-bottom:0}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=trailing]){padding-top:0;padding-bottom:0}.forge-field--addon-end .forge-field__addon-end-container{grid-column-start:addon-end;grid-column-end:end;display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start;align-self:flex-start}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=addon-end]){margin-top:5px;margin-bottom:5px}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=addon-end]){margin-top:10px;margin-bottom:10px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=addon-end]){margin-top:0;margin-bottom:0}.forge-field ::slotted(forge-icon-button){display:-webkit-inline-box!important;display:inline-flex!important}:host{display:block;contain:layout}:host([hidden]){display:none}';
13
+ const template = '<template><div class=\"forge-chip-field__wrapper\" part=\"root\"><div class=\"forge-chip-field forge-field\" part=\"container\"><div class=\"forge-field__leading-container\" part=\"leading-container\"><slot name=\"leading\"></slot></div><div class=\"forge-field__label-input-container\" part=\"label-input-container\"><slot name=\"label\"></slot><div class=\"forge-field__input-container\" part=\"input-container\"><slot name=\"member\"></slot><slot></slot></div></div><div class=\"forge-field__trailing-container\" part=\"trailing-container\"><slot name=\"trailing\"></slot></div><div class=\"forge-field__addon-end-container\" part=\"addon-end-container\"><slot name=\"addon-end\"></slot></div></div><slot name=\"helper-text\"></slot></div></template>';
14
+ const styles = '.forge-field::before{content:\"\";display:-webkit-box;display:flex;position:absolute;top:0;right:0;left:0;z-index:-1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:100%;height:100%;pointer-events:none;border-style:solid;border-style:var(--forge-chip-field-border-style,solid);border-width:1px;-webkit-transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-color .2s 0s cubic-bezier(0, 0, .2, 1);background-color:transparent;background-color:var(--forge-chip-field-theme-background,transparent);text-align:left}.forge-field[dir=rtl]::before,[dir=rtl] .forge-field::before{text-align:right}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused)::before{border-color:rgba(0,0,0,.38);border-color:var(--mdc-theme-text-icon-on-background,rgba(0,0,0,.38))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid):not(.forge-field--focused):hover::before{border-color:rgba(0,0,0,.87);border-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled)::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5)}.forge-field--invalid:not(.forge-field--disabled)::before{border-color:#b00020;border-color:var(--mdc-theme-error,#b00020)}.forge-field--invalid:not(.forge-field--disabled):not(.forge-field--focused):hover::before{border-color:#db8a98;border-color:var(--forge-theme-error-hover,#db8a98)}.forge-field--disabled::before{border-color:rgba(0,0,0,.12);border-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--shape-rounded){border-radius:4px}.forge-field:not(.forge-field--shape-rounded)::before{border-radius:4px}.forge-field--shape-rounded{border-radius:28px}.forge-field--shape-rounded::before{border-radius:28px}.forge-field--disabled::before{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5)}.forge-field--focused::before{border-color:#3f51b5;border-color:var(--mdc-theme-primary,#3f51b5);border-width:2px}.forge-field__label-input-container{position:relative;-webkit-box-flex:1;flex:1 1 0.0001px;height:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center;min-width:0}.forge-field ::slotted(label){color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65));pointer-events:none;right:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight,400);letter-spacing:.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, .009375em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform,inherit);font-size:var(--mdc-typography-subtitle1-font-size, 1rem);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.1rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;-webkit-transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1);transition:transform 150ms cubic-bezier(.4, 0, .2, 1),color 150ms cubic-bezier(.4, 0, .2, 1),-webkit-transform 150ms cubic-bezier(.4, 0, .2, 1)}.forge-field ::slotted(label[dir=rtl]),[dir=rtl] .forge-field ::slotted(label){right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right}.forge-field--dense:not(.forge-field--roomy) ::slotted(label){display:none}.forge-field--required ::slotted(label)::after{content:none}.forge-field--required ::slotted(label)::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){font-size:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){font-size:1rem}.forge-field--disabled ::slotted(label){color:rgba(0,0,0,.38);color:var(--forge-theme-label-disabled-on-background,rgba(0,0,0,.38))}.forge-field--invalid:not(.forge-field--disabled) ::slotted(label){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) ::slotted(label){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label){top:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(label){top:1.285rem}.forge-field:not(.forge-field--shape-rounded):not(.forge-field--leading) ::slotted(label){left:12px!important}.forge-field--shape-rounded:not(.forge-field--leading) ::slotted(label){left:32px!important}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end):not(.forge-field--shape-rounded) ::slotted(label){padding-right:12px}.forge-field:not(.forge-field--trailing):not(.forge-field--addon-end).forge-field--shape-rounded ::slotted(label){padding-right:32px}.forge-field ::slotted(label.forge-floating-label--float-above){color:rgba(0,0,0,.65);color:var(--forge-theme-form-field-label-on-background,rgba(0,0,0,.65))}.forge-field--disabled ::slotted(label.forge-floating-label--float-above){color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6))}.forge-field--invalid:not(.forge-field--disabled) ::slotted(label.forge-floating-label--float-above){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) ::slotted(label.forge-floating-label--float-above){color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label.forge-floating-label--float-above){-webkit-transform:translateY(-.54rem) scale(.8125);transform:translateY(-.54rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) ::slotted(label.forge-floating-label--float-above){-webkit-transform:translateY(-.72rem) scale(.8125);transform:translateY(-.72rem) scale(.8125);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe){-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.62rem) scale(1);transform:translateY(-.62rem) scale(1);cursor:auto}.forge-field--roomy:not(.forge-field--dense) ::slotted(label.forge-floating-label--float-above.forge-floating-label--float-above-end-keyframe){-webkit-transition:none;transition:none;font-size:.8125rem;-webkit-transform:translateY(-.8rem) scale(1);transform:translateY(-.8rem) scale(1);cursor:auto}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(label.forge-floating-label--unfloat-above-start-keyframe){-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.62rem) scale(.8125);transform:translateY(-.62rem) scale(.8125);cursor:auto}.forge-field--roomy:not(.forge-field--dense) ::slotted(label.forge-floating-label--unfloat-above-start-keyframe){-webkit-transition:none;transition:none;font-size:1rem;-webkit-transform:translateY(-.8rem) scale(.8125);transform:translateY(-.8rem) scale(.8125);cursor:auto}.forge-field~::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);display:block;min-height:1.5rem;line-height:normal;padding-top:4px;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-field:not(.forge-field--dense):not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field--roomy:not(.forge-field--dense)~::slotted([slot=helper-text]){font-size:.875rem}.forge-field--dense:not(.forge-field--roomy)~::slotted([slot=helper-text]){font-size:.75rem}.forge-field~::slotted([slot=helper-text]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled)~::slotted([slot=helper-text]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field:not(.forge-field--shape-rounded)~::slotted([slot=helper-text]){margin-left:12px}.forge-field--shape-rounded~::slotted([slot=helper-text]){margin-left:32px}.forge-field ::slotted([slot=leading]){display:-webkit-box;display:flex;align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=leading]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=leading]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=leading]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=leading]){margin:0 4px}.forge-field ::slotted([slot=leading]:not(forge-icon-button)){padding:6px}.forge-field ::slotted([slot=trailing]){align-self:center}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=trailing]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=trailing]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=trailing]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-field ::slotted([slot=trailing]){margin:0 4px}.forge-field ::slotted([slot=trailing]:not(forge-icon-button)){padding:6px}.forge-field__addon-end-container{display:none}.forge-field--addon-end .forge-field__addon-end-container{height:100%;width:auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:0 4px;border-left-width:1px;border-left-style:solid;-webkit-transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1);transition:border-left-color .2s 0s cubic-bezier(0, 0, .2, 1)}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.54);border-left-color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field:not(.forge-field--disabled):not(.forge-field--focused):not(.forge-field--invalid) .forge-field__addon-end-container:hover{border-left-color:rgba(0,0,0,.87);border-left-color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field.forge-field--focused:not(.forge-field--invalid):not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#3f51b5;border-left-color:var(--mdc-theme-primary,#3f51b5)}.forge-field.forge-field--invalid:not(.forge-field--disabled) .forge-field__addon-end-container{border-left-color:#b00020;border-left-color:var(--mdc-theme-error,#b00020)}.forge-field.forge-field--invalid:not(.forge-field--focused):not(.forge-field--disabled) .forge-field__addon-end-container:hover{border-left-color:#db8a98;border-left-color:var(--forge-theme-error-hover,#db8a98)}.forge-field.forge-field--disabled .forge-field__addon-end-container{border-left-color:rgba(0,0,0,.12);border-left-color:var(--mdc-theme-text-disabled-on-background,rgba(0,0,0,.12))}.forge-field:not(.forge-field--disabled):not(.forge-field--invalid) ::slotted([slot=addon-end]){color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-field--invalid:not(.forge-field--disabled) ::slotted([slot=addon-end]){color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-field--disabled ::slotted([slot=addon-end]){color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38));cursor:not-allowed;pointer-events:none}.forge-chip-field{-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:relative;z-index:1;z-index:var(--forge-z-index-surface,1);margin-top:0;margin-top:var(--forge-chip-field-margin-top,0);display:grid;grid-template-columns:[leading] -webkit-min-content [input] 1fr [trailing] -webkit-min-content [addon-end] -webkit-min-content [end];grid-template-columns:[leading] min-content [input] 1fr [trailing] min-content [addon-end] min-content [end]}.forge-chip-field.forge-field--disabled{background-color:#f5f5f5;background-color:var(--forge-theme-form-field-disabled-on-background,#f5f5f5);cursor:not-allowed}.forge-chip-field:not(.forge-field--dense):not(.forge-field--roomy){height:auto;min-height:46px;min-height:var(--forge-chip-field-height,46px)}.forge-chip-field.forge-field--roomy:not(.forge-field--dense){height:auto;min-height:3.5rem;min-height:var(--forge-chip-field-height,3.5rem)}.forge-chip-field.forge-field--dense:not(.forge-field--roomy){height:auto;min-height:1.5rem;min-height:var(--forge-chip-field-height,1.5rem)}.forge-field__label-input-container{grid-column-start:input;grid-column-end:trailing}.forge-field__input-container{-webkit-box-flex:1;flex:1 1 0.0001px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;flex-wrap:wrap;-webkit-box-align:start;align-items:flex-start;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-field__input-container{padding:2px 12px}.forge-field--label .forge-field__input-container{padding-top:22px}.forge-field--roomy.forge-field--label .forge-field__input-container{padding-top:22px}.forge-field--shape-rounded:not(.forge-field--leading) .forge-field__input-container{padding-left:32px}.forge-field--leading:not(.forge-field--shape-rounded) .forge-field__input-container{padding-left:0}.forge-field--shape-rounded.forge-field--leading .forge-field__input-container{padding-left:0}.forge-field--label .forge-field__input-container{padding-bottom:2px}.forge-field--roomy.forge-field--label .forge-field__input-container{padding-bottom:2px}.forge-field--shape-rounded:not(.forge-field--trailing):not(.forge-field--addon-end) .forge-field__input-container{padding-right:32px}.forge-field--addon-end:not(.forge-field--shape-rounded) .forge-field__input-container,.forge-field--trailing:not(.forge-field--shape-rounded) .forge-field__input-container{padding-right:0}.forge-field--shape-rounded.forge-field--addon-end .forge-field__input-container,.forge-field--shape-rounded.forge-field--trailing .forge-field__input-container{padding-right:0}.forge-field ::slotted([slot=member]){display:block}.forge-field--disabled ::slotted([slot=member]){--mdc-theme-primary:rgba(0, 0, 0, 0.38);--mdc-theme-primary:var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));cursor:not-allowed;pointer-events:none}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=member]){margin:2px 8px 2px 0}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=member]){margin:6px 12px 6px 0}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=member]){margin:2px 6px 2px 0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=member]){--forge-chip-min-height:20px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=member]){--forge-chip-min-height:16px}.forge-field ::slotted(input){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-weight:400;font-weight:var(--mdc-typography-body1-font-weight,400);letter-spacing:.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, .03125em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-decoration:var(--mdc-typography-body1-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform,inherit);align-self:flex-end;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;-webkit-transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);transition:opacity 150ms 0s cubic-bezier(.4, 0, .2, 1);border:none;background:0 0;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;line-height:normal;min-width:0}.forge-field ::slotted(input)::-webkit-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input)::-moz-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input):-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input)::-ms-input-placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input)::placeholder{color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54));font-size:.875rem}.forge-field ::slotted(input):invalid{-webkit-box-shadow:none;box-shadow:none}.forge-field ::slotted(input):-webkit-autofill{z-index:auto!important}.forge-field:not(.forge-field--disabled) ::slotted(input){color:rgba(0,0,0,.87);color:var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87))}.forge-field--disabled ::slotted(input){color:rgba(0,0,0,.6);color:var(--forge-theme-form-field-text-disabled-on-background,rgba(0,0,0,.6));cursor:not-allowed}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(input){font-size:1rem;font-size:var(--forge-chip-field-font-size, 1rem)}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){font-size:1rem;font-size:var(--forge-chip-field-font-size, 1rem)}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){font-size:.875rem;font-size:var(--forge-chip-field-font-size, .875rem)}.forge-field ::slotted(input){-webkit-box-flex:1;flex:1 1 0.0001px;min-width:40px;display:block;align-self:flex-start;padding:0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(input){margin:4px 0}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){margin:6px 0}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){margin:2px 0}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted(input){height:1rem;line-height:1rem}.forge-field--roomy:not(.forge-field--dense) ::slotted(input){height:1.25rem;line-height:1.25rem}.forge-field--dense:not(.forge-field--roomy) ::slotted(input){height:1rem;line-height:1rem}.forge-field--leading .forge-field__leading-container{grid-column-start:leading;grid-column-end:input;align-self:flex-start;display:-webkit-box;display:flex}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=leading]){margin-top:5px;margin-bottom:5px}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=leading]){margin-top:10px;margin-bottom:10px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=leading]){margin-top:0;margin-bottom:0}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=leading]){padding-top:0;padding-bottom:0}.forge-field--trailing .forge-field__trailing-container{grid-column-start:trailing;grid-column-end:addon-end;display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start;align-self:flex-start}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=trailing]){margin-top:5px;margin-bottom:5px}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=trailing]){margin-top:10px;margin-bottom:10px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=trailing]){margin-top:0;margin-bottom:0}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=trailing]){padding-top:0;padding-bottom:0}.forge-field--addon-end .forge-field__addon-end-container{grid-column-start:addon-end;grid-column-end:end;display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start;align-self:flex-start}.forge-field:not(.forge-field--dense):not(.forge-field--roomy) ::slotted([slot=addon-end]){margin-top:5px;margin-bottom:5px}.forge-field--roomy:not(.forge-field--dense) ::slotted([slot=addon-end]){margin-top:10px;margin-bottom:10px}.forge-field--dense:not(.forge-field--roomy) ::slotted([slot=addon-end]){margin-top:0;margin-bottom:0}.forge-field ::slotted(forge-icon-button){display:-webkit-inline-box!important;display:inline-flex!important}:host{display:block;contain:layout}:host([hidden]){display:none}';
15
15
  /**
16
16
  * The web component class behind the `<forge-chip-field>` custom element.
17
17
  *
@@ -92,10 +92,10 @@ export class BaseDatePickerFoundation {
92
92
  this._handleInput(this._adapter.getInputValue());
93
93
  }
94
94
  _onInputFocus(evt) {
95
- this._adapter.selectInputText();
96
95
  if (this.masked && this.showMaskFormat) {
97
96
  this._applyMask();
98
97
  }
98
+ this._adapter.selectInputText();
99
99
  }
100
100
  _onInputBlur(evt) {
101
101
  if (this.masked && this.showMaskFormat) {
@@ -271,11 +271,11 @@ export class DateRangePickerFoundation extends BaseDatePickerFoundation {
271
271
  }
272
272
  }
273
273
  _onToInputFocus() {
274
- this._adapter.selectToInputText();
275
274
  if (this.masked && this._showMaskFormat) {
276
275
  this._initializeMask();
277
276
  this._initializeToMask();
278
277
  }
278
+ this._adapter.selectToInputText();
279
279
  }
280
280
  _onToInputBlur(evt) {
281
281
  if (this._masked && !this._adapter.isInputFocused(evt.relatedTarget)) {
@@ -288,11 +288,11 @@ export class DateRangePickerFoundation extends BaseDatePickerFoundation {
288
288
  }
289
289
  }
290
290
  _onInputFocus(evt) {
291
- this._adapter.selectInputText();
292
291
  if (this.masked && this._showMaskFormat) {
293
292
  this._initializeMask();
294
293
  this._initializeToMask();
295
294
  }
295
+ this._adapter.selectInputText();
296
296
  }
297
297
  _onInputBlur(evt) {
298
298
  if (this.masked && !this._adapter.isInputFocused(evt.relatedTarget)) {
@@ -23,6 +23,7 @@ export declare const KEYBOARD_SHORTCUT_CONSTANTS: {
23
23
  };
24
24
  };
25
25
  export declare const textInputTypes: string[];
26
+ export declare type KeyboardShortcutActivateCallback = (event: KeyboardEvent) => void;
26
27
  export interface IKeyCombination {
27
28
  key: string;
28
29
  modifier?: string;
@@ -5,6 +5,7 @@
5
5
  */
6
6
  import { ICustomElementFoundation } from '@tylertech/forge-core';
7
7
  import { IKeyboardShortcutAdapter } from './keyboard-shortcut-adapter';
8
+ import { KeyboardShortcutActivateCallback } from './keyboard-shortcut-constants';
8
9
  export interface IKeyboardShortcutFoundation extends ICustomElementFoundation {
9
10
  key: string | null | undefined;
10
11
  target: string;
@@ -14,6 +15,7 @@ export interface IKeyboardShortcutFoundation extends ICustomElementFoundation {
14
15
  capture: boolean;
15
16
  useCode: boolean;
16
17
  disabled: boolean;
18
+ activateCallback: KeyboardShortcutActivateCallback | null | undefined;
17
19
  }
18
20
  export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoundation {
19
21
  private _adapter;
@@ -25,6 +27,7 @@ export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoun
25
27
  private _capture;
26
28
  private _useCode;
27
29
  private _disabled;
30
+ private _activateCallback;
28
31
  private _keyCombinations;
29
32
  private _keyDownListener;
30
33
  constructor(_adapter: IKeyboardShortcutAdapter);
@@ -60,4 +63,7 @@ export declare class KeyboardShortcutFoundation implements IKeyboardShortcutFoun
60
63
  /** Gets/sets whether the event will be emitted. */
61
64
  get disabled(): boolean;
62
65
  set disabled(value: boolean);
66
+ /** Gets/sets the activation callback. */
67
+ get activateCallback(): KeyboardShortcutActivateCallback | null | undefined;
68
+ set activateCallback(value: KeyboardShortcutActivateCallback | null | undefined);
63
69
  }
@@ -48,6 +48,7 @@ export class KeyboardShortcutFoundation {
48
48
  }
49
49
  _onKeyDown(evt) {
50
50
  // Here we may check if the target element is disabled, but disabled elements typically can't receive focus anyway
51
+ var _a;
51
52
  // Ignore the event if it originates from a text field
52
53
  // TODO: bypass this and allow it if a modifier key is used?
53
54
  if (!this._allowWhileTyping && elementAcceptsTextInput(evt.target)) {
@@ -58,6 +59,7 @@ export class KeyboardShortcutFoundation {
58
59
  evt.preventDefault();
59
60
  }
60
61
  this._adapter.emitHostEvent(KEYBOARD_SHORTCUT_CONSTANTS.events.ACTIVATE, evt);
62
+ (_a = this._activateCallback) === null || _a === void 0 ? void 0 : _a.call(null, evt);
61
63
  }
62
64
  }
63
65
  /** Sets the key combinations. */
@@ -161,4 +163,11 @@ export class KeyboardShortcutFoundation {
161
163
  }
162
164
  }
163
165
  }
166
+ /** Gets/sets the activation callback. */
167
+ get activateCallback() {
168
+ return this._activateCallback;
169
+ }
170
+ set activateCallback(value) {
171
+ this._activateCallback = value;
172
+ }
164
173
  }
@@ -3,6 +3,7 @@
3
3
  * Copyright 2023 Tyler Technologies, Inc.
4
4
  * License: Apache-2.0
5
5
  */
6
+ import { KeyboardShortcutActivateCallback } from './keyboard-shortcut-constants';
6
7
  import { BaseComponent, IBaseComponent } from '../core/base/base-component';
7
8
  export interface IKeyboardShortcutComponent extends IBaseComponent {
8
9
  key: string | null | undefined;
@@ -14,6 +15,7 @@ export interface IKeyboardShortcutComponent extends IBaseComponent {
14
15
  capture: boolean;
15
16
  useCode: boolean;
16
17
  disabled: boolean;
18
+ activateCallback: KeyboardShortcutActivateCallback | null | undefined;
17
19
  }
18
20
  declare global {
19
21
  interface HTMLElementTagNameMap {
@@ -54,4 +56,6 @@ export declare class KeyboardShortcutComponent extends BaseComponent implements
54
56
  useCode: boolean;
55
57
  /** Gets/sets whether the callback will be called. */
56
58
  disabled: boolean;
59
+ /** Gets/sets whether the activation callback. */
60
+ activateCallback: KeyboardShortcutActivateCallback | null | undefined;
57
61
  }
@@ -97,6 +97,9 @@ __decorate([
97
97
  __decorate([
98
98
  FoundationProperty()
99
99
  ], KeyboardShortcutComponent.prototype, "disabled", void 0);
100
+ __decorate([
101
+ FoundationProperty()
102
+ ], KeyboardShortcutComponent.prototype, "activateCallback", void 0);
100
103
  KeyboardShortcutComponent = __decorate([
101
104
  CustomElement({
102
105
  name: KEYBOARD_SHORTCUT_CONSTANTS.elementName
@@ -3,6 +3,7 @@
3
3
  * Copyright 2023 Tyler Technologies, Inc.
4
4
  * License: Apache-2.0
5
5
  */
6
+ import { IIconComponent } from '../icon';
6
7
  import { IPopupPosition, PopupPlacement } from '../popup';
7
8
  export declare const LIST_DROPDOWN_CONSTANTS: {
8
9
  attributes: {
@@ -29,15 +30,18 @@ export declare type ListDropdownIconType = 'font' | 'component';
29
30
  export interface IBaseListDropdownOption<T = any> {
30
31
  value: T;
31
32
  label: string;
33
+ secondaryLabel?: string;
32
34
  disabled?: boolean;
33
35
  divider?: boolean;
34
36
  optionClass?: string | string[];
35
37
  leadingIcon?: string;
36
38
  leadingIconClass?: string;
37
39
  leadingIconType?: ListDropdownIconType;
40
+ leadingIconComponentProps?: Partial<IIconComponent>;
38
41
  trailingIcon?: string;
39
42
  trailingIconClass?: string;
40
43
  trailingIconType?: ListDropdownIconType;
44
+ trailingIconComponentProps?: Partial<IIconComponent>;
41
45
  leadingBuilder?: () => HTMLElement;
42
46
  trailingBuilder?: () => HTMLElement;
43
47
  }
@@ -204,6 +204,14 @@ export function createListItems(config, listElement, options, startIndex = 0, re
204
204
  }
205
205
  }
206
206
  }
207
+ // Check for secondary (subtitle) text
208
+ if (option.secondaryLabel) {
209
+ const secondaryLabelElement = document.createElement('span');
210
+ secondaryLabelElement.slot = 'subtitle';
211
+ secondaryLabelElement.textContent = option.secondaryLabel;
212
+ listItemElement.twoLine = true;
213
+ listItemElement.appendChild(secondaryLabelElement);
214
+ }
207
215
  // If multiple selections are enabled then we need to create and append a leading checkbox element
208
216
  if (config.multiple) {
209
217
  const checkboxElement = createCheckboxElement(isSelected);
@@ -225,7 +233,7 @@ export function createListItems(config, listElement, options, startIndex = 0, re
225
233
  }
226
234
  }
227
235
  else if (option.leadingIcon) {
228
- const leadingIconElement = createIconElement(option.leadingIconType, option.leadingIcon, option.leadingIconClass || config.iconClass);
236
+ const leadingIconElement = createIconElement(option.leadingIconType, option.leadingIcon, option.leadingIconClass || config.iconClass, option.leadingIconComponentProps);
229
237
  leadingIconElement.slot = 'leading';
230
238
  listItemElement.appendChild(leadingIconElement);
231
239
  }
@@ -238,7 +246,7 @@ export function createListItems(config, listElement, options, startIndex = 0, re
238
246
  }
239
247
  }
240
248
  else if (option.trailingIcon) {
241
- const trailingIconElement = createIconElement(option.trailingIconType, option.trailingIcon, option.trailingIconClass || config.iconClass);
249
+ const trailingIconElement = createIconElement(option.trailingIconType, option.trailingIcon, option.trailingIconClass || config.iconClass, option.trailingIconComponentProps);
242
250
  trailingIconElement.slot = 'trailing';
243
251
  listItemElement.appendChild(trailingIconElement);
244
252
  }
@@ -292,7 +300,7 @@ function createDivider() {
292
300
  divider.setAttribute('aria-hidden', 'true');
293
301
  return divider;
294
302
  }
295
- function createIconElement(type = 'font', iconName, iconClass) {
303
+ function createIconElement(type = 'font', iconName, iconClass, componentProps) {
296
304
  if (type === 'component') {
297
305
  const icon = document.createElement('forge-icon');
298
306
  if (iconClass) {
@@ -300,6 +308,9 @@ function createIconElement(type = 'font', iconName, iconClass) {
300
308
  }
301
309
  icon.setAttribute('aria-hidden', 'true');
302
310
  icon.name = iconName;
311
+ if (componentProps) {
312
+ Object.assign(icon, componentProps);
313
+ }
303
314
  return icon;
304
315
  }
305
316
  const iconElement = document.createElement('i');
@@ -4,7 +4,7 @@
4
4
  * License: Apache-2.0
5
5
  */
6
6
  import { BaseAdapter, IBaseAdapter } from '../core/base/base-adapter';
7
- import { IPopupComponent } from './popup';
7
+ import { IPopupComponent, IPopupCloseEventData } from './popup';
8
8
  export interface IPopupAdapter extends IBaseAdapter {
9
9
  setAttribute(attribute: string, value: string, element?: HTMLElement): void;
10
10
  removeAttribute(attribute: string, element?: HTMLElement): void;
@@ -19,6 +19,7 @@ export interface IPopupAdapter extends IBaseAdapter {
19
19
  removeEventListener(type: string, listener: (evt: Event) => void): void;
20
20
  setBlurListener(listener: () => void): () => void;
21
21
  trySetInitialFocus(): void;
22
+ getCloseEventData(): IPopupCloseEventData;
22
23
  }
23
24
  export declare class PopupAdapter extends BaseAdapter<IPopupComponent> implements IPopupAdapter {
24
25
  private _windowEventCallback?;
@@ -33,6 +34,7 @@ export declare class PopupAdapter extends BaseAdapter<IPopupComponent> implement
33
34
  removePopup(manageFocus: boolean): void;
34
35
  manageWindowEvents(add?: boolean): void;
35
36
  dispatchEvent(type: string, data?: any, bubbles?: boolean, cancelable?: boolean): boolean;
37
+ getCloseEventData(): IPopupCloseEventData;
36
38
  addClass(classes: string | string[]): void;
37
39
  removeClass(classes: string | string[]): void;
38
40
  setAnimationEndListener(listener: (evt: TransitionEvent) => void, classes?: string | string[]): void;
@@ -100,6 +100,9 @@ export class PopupAdapter extends BaseAdapter {
100
100
  }
101
101
  return false;
102
102
  }
103
+ getCloseEventData() {
104
+ return { popup: this._component };
105
+ }
103
106
  addClass(classes) {
104
107
  addClass(classes, this._rootElement);
105
108
  }
@@ -4,7 +4,7 @@
4
4
  * License: Apache-2.0
5
5
  */
6
6
  import { isElement } from '@tylertech/forge-core';
7
- import { PopupAnimationType, POPUP_CONSTANTS as constants, POPUP_CONSTANTS } from './popup-constants';
7
+ import { PopupAnimationType, POPUP_CONSTANTS } from './popup-constants';
8
8
  export class PopupFoundation {
9
9
  constructor(_adapter) {
10
10
  this._adapter = _adapter;
@@ -42,7 +42,7 @@ export class PopupFoundation {
42
42
  this._destroyBlurListener = this._adapter.setBlurListener(this._blurListener);
43
43
  }
44
44
  this._adapter.manageWindowEvents(true);
45
- this._adapter.dispatchEvent(constants.events.OPEN);
45
+ this._adapter.dispatchEvent(POPUP_CONSTANTS.events.OPEN);
46
46
  }
47
47
  _closePopup() {
48
48
  if (this._destroyBlurListener) {
@@ -59,7 +59,9 @@ export class PopupFoundation {
59
59
  _destroyPopup() {
60
60
  this._adapter.manageWindowEvents(false);
61
61
  this._adapter.removePopup(this._manageFocus);
62
- this._adapter.dispatchEvent(constants.events.CLOSE);
62
+ const eventData = this._adapter.getCloseEventData();
63
+ this._adapter.dispatchEvent(POPUP_CONSTANTS.events.CLOSE, eventData);
64
+ this._adapter.emitHostEvent(POPUP_CONSTANTS.events.CLOSE, eventData);
63
65
  this._adapter.removeAttribute(POPUP_CONSTANTS.attributes.OPEN);
64
66
  }
65
67
  _applyOpenAnimation() {
@@ -19,13 +19,16 @@ export interface IPopupComponent extends IBaseComponent {
19
19
  openCallback: PopupStateCallback;
20
20
  closeCallback: PopupStateCallback;
21
21
  }
22
+ export interface IPopupCloseEventData {
23
+ popup: IPopupComponent;
24
+ }
22
25
  declare global {
23
26
  interface HTMLElementTagNameMap {
24
27
  'forge-popup': IPopupComponent;
25
28
  }
26
29
  interface HTMLElementEventMap {
27
30
  'forge-popup-open': CustomEvent<void>;
28
- 'forge-popup-close': CustomEvent<void>;
31
+ 'forge-popup-close': CustomEvent<IPopupCloseEventData>;
29
32
  'forge-popup-position': CustomEvent<IPopupPositionEventData>;
30
33
  'forge-popup-blur': CustomEvent<void>;
31
34
  }
@@ -46,6 +46,7 @@ export class BaseSelectAdapter extends BaseAdapter {
46
46
  return {
47
47
  // eslint-disable-next-line @typescript-eslint/no-extra-parens
48
48
  label: o.hasAttribute(OPTION_CONSTANTS.attributes.LABEL) ? o.getAttribute(OPTION_CONSTANTS.attributes.LABEL) : (isDefined(o.label) ? o.label : o.innerText),
49
+ secondaryLabel: o.hasAttribute(OPTION_CONSTANTS.attributes.SECONDARY_LABEL) ? o.getAttribute(OPTION_CONSTANTS.attributes.SECONDARY_LABEL) : isDefined(o.secondaryLabel) ? o.secondaryLabel : undefined,
49
50
  value: o.hasAttribute(OPTION_CONSTANTS.attributes.VALUE) ? o.getAttribute(OPTION_CONSTANTS.attributes.VALUE) : o.value,
50
51
  disabled: o.hasAttribute(OPTION_CONSTANTS.attributes.DISABLED),
51
52
  divider: o.hasAttribute(OPTION_CONSTANTS.attributes.DIVIDER),
@@ -53,9 +54,11 @@ export class BaseSelectAdapter extends BaseAdapter {
53
54
  leadingIcon: o.hasAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON) ? o.getAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON) : o.leadingIcon,
54
55
  leadingIconClass: o.hasAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON_CLASS) ? o.getAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON_CLASS) : o.leadingIconClass,
55
56
  leadingIconType: o.hasAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON_TYPE) ? o.getAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON_TYPE) : o.leadingIconType,
57
+ leadingIconComponentProps: o.leadingIconComponentProps,
56
58
  trailingIcon: o.hasAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON) ? o.getAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON) : o.trailingIcon,
57
59
  trailingIconClass: o.hasAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON_CLASS) ? o.getAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON_CLASS) : o.trailingIconClass,
58
60
  trailingIconType: o.hasAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON_TYPE) ? o.getAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON_TYPE) : o.trailingIconType,
61
+ trailingIconComponentProps: o.trailingIconComponentProps,
59
62
  leadingBuilder: o.leadingBuilder,
60
63
  trailingBuilder: o.trailingBuilder
61
64
  };
@@ -9,6 +9,7 @@ export declare const OPTION_CONSTANTS: {
9
9
  DISABLED: string;
10
10
  DIVIDER: string;
11
11
  LABEL: string;
12
+ SECONDARY_LABEL: string;
12
13
  LEADING_ICON_CLASS: string;
13
14
  LEADING_ICON_TYPE: string;
14
15
  LEADING_ICON: string;
@@ -9,6 +9,7 @@ const attributes = {
9
9
  DISABLED: 'disabled',
10
10
  DIVIDER: 'divider',
11
11
  LABEL: 'label',
12
+ SECONDARY_LABEL: 'secondary-label',
12
13
  LEADING_ICON_CLASS: 'leading-icon-class',
13
14
  LEADING_ICON_TYPE: 'leading-icon-type',
14
15
  LEADING_ICON: 'leading-icon',
@@ -4,6 +4,7 @@
4
4
  * License: Apache-2.0
5
5
  */
6
6
  import { ICustomElementFoundation } from '@tylertech/forge-core';
7
+ import { IIconComponent } from '../../icon';
7
8
  import { IBaseListDropdownOption, ListDropdownIconType } from '../../list-dropdown/list-dropdown-constants';
8
9
  import { IOptionAdapter } from './option-adapter';
9
10
  export interface IOptionFoundation extends ICustomElementFoundation, Required<IBaseListDropdownOption> {
@@ -13,15 +14,18 @@ export declare class OptionFoundation implements IOptionFoundation {
13
14
  private _adapter;
14
15
  private _value;
15
16
  private _label;
17
+ private _secondaryLabel;
16
18
  private _disabled;
17
19
  private _divider;
18
20
  private _optionClass;
19
21
  private _leadingIcon;
20
22
  private _leadingIconClass;
21
23
  private _leadingIconType;
24
+ private _leadingIconComponentProps;
22
25
  private _trailingIcon;
23
26
  private _trailingIconClass;
24
27
  private _trailingIconType;
28
+ private _trailingIconComponentProps;
25
29
  private _leadingBuilder;
26
30
  private _trailingBuilder;
27
31
  constructor(_adapter: IOptionAdapter);
@@ -31,6 +35,9 @@ export declare class OptionFoundation implements IOptionFoundation {
31
35
  /** Gets/sets the label of this option. */
32
36
  get label(): string;
33
37
  set label(value: string);
38
+ /** Gets/sets the secondary label of this option. */
39
+ get secondaryLabel(): string;
40
+ set secondaryLabel(value: string);
34
41
  /** Gets/sets the disabled status of this option. */
35
42
  get disabled(): boolean;
36
43
  set disabled(value: boolean);
@@ -49,6 +56,9 @@ export declare class OptionFoundation implements IOptionFoundation {
49
56
  /** Gets/sets the leading icon type of this option. */
50
57
  get leadingIconType(): ListDropdownIconType;
51
58
  set leadingIconType(value: ListDropdownIconType);
59
+ /** Gets/sets the props on the leading icon component. */
60
+ get leadingIconComponentProps(): Partial<IIconComponent>;
61
+ set leadingIconComponentProps(value: Partial<IIconComponent>);
52
62
  /** Gets/sets the trailing icon of this option. */
53
63
  get trailingIcon(): string;
54
64
  set trailingIcon(value: string);
@@ -58,6 +68,9 @@ export declare class OptionFoundation implements IOptionFoundation {
58
68
  /** Gets/sets the trailing icon type of this option. */
59
69
  get trailingIconType(): ListDropdownIconType;
60
70
  set trailingIconType(value: ListDropdownIconType);
71
+ /** Gets/sets the props on the trailing icon component. */
72
+ get trailingIconComponentProps(): Partial<IIconComponent>;
73
+ set trailingIconComponentProps(value: Partial<IIconComponent>);
61
74
  /** Gets/sets the leading builder of this option. */
62
75
  get leadingBuilder(): (() => HTMLElement);
63
76
  set leadingBuilder(value: (() => HTMLElement));
@@ -32,6 +32,16 @@ export class OptionFoundation {
32
32
  this._adapter.toggleHostAttribute(OPTION_CONSTANTS.attributes.LABEL, !!this._label, this._label);
33
33
  }
34
34
  }
35
+ /** Gets/sets the secondary label of this option. */
36
+ get secondaryLabel() {
37
+ return this._secondaryLabel;
38
+ }
39
+ set secondaryLabel(value) {
40
+ if (this._secondaryLabel !== value) {
41
+ this._secondaryLabel = value;
42
+ this._adapter.toggleHostAttribute(OPTION_CONSTANTS.attributes.SECONDARY_LABEL, !!this._secondaryLabel, this._secondaryLabel);
43
+ }
44
+ }
35
45
  /** Gets/sets the disabled status of this option. */
36
46
  get disabled() {
37
47
  return this._disabled;
@@ -99,6 +109,15 @@ export class OptionFoundation {
99
109
  this._adapter.toggleHostAttribute(OPTION_CONSTANTS.attributes.LEADING_ICON_TYPE, !!this._leadingIconType, this._leadingIconType);
100
110
  }
101
111
  }
112
+ /** Gets/sets the props on the leading icon component. */
113
+ get leadingIconComponentProps() {
114
+ return this._leadingIconComponentProps;
115
+ }
116
+ set leadingIconComponentProps(value) {
117
+ if (this._leadingIconComponentProps !== value) {
118
+ this._leadingIconComponentProps = value;
119
+ }
120
+ }
102
121
  /** Gets/sets the trailing icon of this option. */
103
122
  get trailingIcon() {
104
123
  return this._trailingIcon;
@@ -129,6 +148,15 @@ export class OptionFoundation {
129
148
  this._adapter.toggleHostAttribute(OPTION_CONSTANTS.attributes.TRAILING_ICON_TYPE, !!this._trailingIconType, this._trailingIconType);
130
149
  }
131
150
  }
151
+ /** Gets/sets the props on the trailing icon component. */
152
+ get trailingIconComponentProps() {
153
+ return this._trailingIconComponentProps;
154
+ }
155
+ set trailingIconComponentProps(value) {
156
+ if (this._trailingIconComponentProps !== value) {
157
+ this._trailingIconComponentProps = value;
158
+ }
159
+ }
132
160
  /** Gets/sets the leading builder of this option. */
133
161
  get leadingBuilder() {
134
162
  return this._leadingBuilder;