igniteui-webcomponents 4.4.0 → 4.5.0-beta.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.
Files changed (163) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/components/avatar/avatar.js +2 -5
  3. package/components/avatar/avatar.js.map +1 -1
  4. package/components/avatar/themes/avatar.base.css.js +0 -12
  5. package/components/avatar/themes/avatar.base.css.js.map +1 -1
  6. package/components/button/button.d.ts +0 -3
  7. package/components/button/button.js +1 -4
  8. package/components/button/button.js.map +1 -1
  9. package/components/button/themes/button/light/button.base.css.js +0 -12
  10. package/components/button/themes/button/light/button.base.css.js.map +1 -1
  11. package/components/button/themes/icon-button/light/icon-button.base.css.js +0 -12
  12. package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
  13. package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js +3 -10
  14. package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js.map +1 -1
  15. package/components/calendar/themes/calendar.base.css.js +13 -12
  16. package/components/calendar/themes/calendar.base.css.js.map +1 -1
  17. package/components/calendar/themes/fluent/calendar.fluent.css.js +16 -22
  18. package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
  19. package/components/calendar/themes/fluent/days-view.fluent.css.js +7 -23
  20. package/components/calendar/themes/fluent/days-view.fluent.css.js.map +1 -1
  21. package/components/calendar/themes/indigo/calendar.indigo.css.js +3 -10
  22. package/components/calendar/themes/indigo/calendar.indigo.css.js.map +1 -1
  23. package/components/checkbox/themes/light/checkbox.bootstrap.css.js +1 -1
  24. package/components/checkbox/themes/light/checkbox.bootstrap.css.js.map +1 -1
  25. package/components/checkbox/themes/light/checkbox.indigo.css.js +16 -8
  26. package/components/checkbox/themes/light/checkbox.indigo.css.js.map +1 -1
  27. package/components/chip/themes/chip.base.css.js +12 -38
  28. package/components/chip/themes/chip.base.css.js.map +1 -1
  29. package/components/chip/themes/chip.bootstrap.css.js +12 -38
  30. package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
  31. package/components/chip/themes/chip.fluent.css.js +12 -38
  32. package/components/chip/themes/chip.fluent.css.js.map +1 -1
  33. package/components/chip/themes/chip.indigo.css.js +12 -38
  34. package/components/chip/themes/chip.indigo.css.js.map +1 -1
  35. package/components/chip/themes/chip.material.css.js +12 -38
  36. package/components/chip/themes/chip.material.css.js.map +1 -1
  37. package/components/combo/themes/light/combo.base.css.js +5 -0
  38. package/components/combo/themes/light/combo.base.css.js.map +1 -1
  39. package/components/common/mixins/sizable.d.ts +3 -0
  40. package/components/common/mixins/sizable.js +7 -0
  41. package/components/common/mixins/sizable.js.map +1 -1
  42. package/components/dropdown/dropdown-group.js +0 -2
  43. package/components/dropdown/dropdown-group.js.map +1 -1
  44. package/components/dropdown/dropdown.d.ts +0 -1
  45. package/components/dropdown/dropdown.js +0 -6
  46. package/components/dropdown/dropdown.js.map +1 -1
  47. package/components/dropdown/themes/light/dropdown.base.css.js +0 -12
  48. package/components/dropdown/themes/light/dropdown.base.css.js.map +1 -1
  49. package/components/expansion-panel/themes/light/expansion-panel.base.css.js +1 -2
  50. package/components/expansion-panel/themes/light/expansion-panel.base.css.js.map +1 -1
  51. package/components/icon/icon.base.css.js +6 -0
  52. package/components/icon/icon.base.css.js.map +1 -1
  53. package/components/icon/light/icon.bootstrap.css.js +2 -3
  54. package/components/icon/light/icon.bootstrap.css.js.map +1 -1
  55. package/components/icon/light/icon.fluent.css.js +2 -3
  56. package/components/icon/light/icon.fluent.css.js.map +1 -1
  57. package/components/icon/light/icon.indigo.css.js +2 -3
  58. package/components/icon/light/icon.indigo.css.js.map +1 -1
  59. package/components/icon/light/icon.material.css.js +2 -3
  60. package/components/icon/light/icon.material.css.js.map +1 -1
  61. package/components/input/input-base.js +4 -2
  62. package/components/input/input-base.js.map +1 -1
  63. package/components/input/themes/light/input.base.css.js +0 -12
  64. package/components/input/themes/light/input.base.css.js.map +1 -1
  65. package/components/list/themes/light/list-item.base.css.js +3 -0
  66. package/components/list/themes/light/list-item.base.css.js.map +1 -1
  67. package/components/list/themes/light/list.base.css.js +0 -12
  68. package/components/list/themes/light/list.base.css.js.map +1 -1
  69. package/components/nav-drawer/nav-drawer-header-item.js +6 -4
  70. package/components/nav-drawer/nav-drawer-header-item.js.map +1 -1
  71. package/components/nav-drawer/nav-drawer-item.js +6 -4
  72. package/components/nav-drawer/nav-drawer-item.js.map +1 -1
  73. package/components/nav-drawer/nav-drawer.js +5 -2
  74. package/components/nav-drawer/nav-drawer.js.map +1 -1
  75. package/components/nav-drawer/themes/dark/{nav-drawer-item.base.css.js → nav-drawer.bootstrap.css.js} +1 -1
  76. package/components/nav-drawer/themes/dark/{nav-drawer-item.base.css.js.map → nav-drawer.bootstrap.css.js.map} +1 -1
  77. package/components/nav-drawer/themes/dark/{nav-drawer-item.fluent.css.js → nav-drawer.fluent.css.js} +1 -1
  78. package/components/nav-drawer/themes/dark/nav-drawer.fluent.css.js.map +1 -0
  79. package/components/nav-drawer/themes/dark/{nav-drawer-item.indigo.css.js → nav-drawer.material.css.js} +1 -1
  80. package/components/nav-drawer/themes/dark/nav-drawer.material.css.js.map +1 -0
  81. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.base.css.js +7 -0
  82. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.base.css.js.map +1 -0
  83. package/components/nav-drawer/themes/light/{fluent/nav-drawer-header-item.fluent.css.js → header-item/nav-drawer-header-item.bootstrap.css.js} +2 -1
  84. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.bootstrap.css.js.map +1 -0
  85. package/components/nav-drawer/themes/light/{nav-drawer-header-item.base.css.js → header-item/nav-drawer-header-item.fluent.css.js} +2 -5
  86. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.fluent.css.js.map +1 -0
  87. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.indigo.css.js +14 -0
  88. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.indigo.css.js.map +1 -0
  89. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.material.css.js +14 -0
  90. package/components/nav-drawer/themes/light/header-item/nav-drawer-header-item.material.css.js.map +1 -0
  91. package/components/nav-drawer/themes/light/item/nav-drawer-item.base.css.js +65 -0
  92. package/components/nav-drawer/themes/light/item/nav-drawer-item.base.css.js.map +1 -0
  93. package/components/nav-drawer/themes/light/{nav-drawer-item.base.css.js → item/nav-drawer-item.bootstrap.css.js} +16 -66
  94. package/components/nav-drawer/themes/light/item/nav-drawer-item.bootstrap.css.js.map +1 -0
  95. package/components/nav-drawer/themes/light/item/nav-drawer-item.fluent.css.js +54 -0
  96. package/components/nav-drawer/themes/light/item/nav-drawer-item.fluent.css.js.map +1 -0
  97. package/components/nav-drawer/themes/light/item/nav-drawer-item.indigo.css.d.ts +1 -0
  98. package/components/nav-drawer/themes/light/{indigo → item}/nav-drawer-item.indigo.css.js +30 -9
  99. package/components/nav-drawer/themes/light/item/nav-drawer-item.indigo.css.js.map +1 -0
  100. package/components/nav-drawer/themes/light/item/nav-drawer-item.material.css.d.ts +1 -0
  101. package/components/nav-drawer/themes/light/item/nav-drawer-item.material.css.js +54 -0
  102. package/components/nav-drawer/themes/light/item/nav-drawer-item.material.css.js.map +1 -0
  103. package/components/nav-drawer/themes/light/nav-drawer.base.css.js +10 -18
  104. package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map +1 -1
  105. package/components/nav-drawer/themes/light/nav-drawer.bootstrap.css.d.ts +1 -0
  106. package/components/nav-drawer/themes/light/nav-drawer.bootstrap.css.js +60 -0
  107. package/components/nav-drawer/themes/light/nav-drawer.bootstrap.css.js.map +1 -0
  108. package/components/nav-drawer/themes/light/nav-drawer.fluent.css.d.ts +1 -0
  109. package/components/nav-drawer/themes/light/nav-drawer.fluent.css.js +60 -0
  110. package/components/nav-drawer/themes/light/nav-drawer.fluent.css.js.map +1 -0
  111. package/components/nav-drawer/themes/light/nav-drawer.indigo.css.d.ts +1 -0
  112. package/components/nav-drawer/themes/light/{indigo/nav-drawer.indigo.css.js → nav-drawer.indigo.css.js} +33 -2
  113. package/components/nav-drawer/themes/light/nav-drawer.indigo.css.js.map +1 -0
  114. package/components/nav-drawer/themes/light/nav-drawer.material.css.d.ts +1 -0
  115. package/components/nav-drawer/themes/light/nav-drawer.material.css.js +60 -0
  116. package/components/nav-drawer/themes/light/nav-drawer.material.css.js.map +1 -0
  117. package/components/navbar/themes/navbar.base.css.js +4 -10
  118. package/components/navbar/themes/navbar.base.css.js.map +1 -1
  119. package/components/rating/rating.base.css.js +0 -12
  120. package/components/rating/rating.base.css.js.map +1 -1
  121. package/components/select/themes/light/select.base.css.js +0 -12
  122. package/components/select/themes/light/select.base.css.js.map +1 -1
  123. package/components/tabs/themes/light/tab.base.css.js +3 -4
  124. package/components/tabs/themes/light/tab.base.css.js.map +1 -1
  125. package/components/tabs/themes/light/tabs.base.css.js +1 -0
  126. package/components/tabs/themes/light/tabs.base.css.js.map +1 -1
  127. package/components/tree/themes/light/tree-item.base.css.js +5 -16
  128. package/components/tree/themes/light/tree-item.base.css.js.map +1 -1
  129. package/components/tree/themes/light/tree.base.css.js +0 -12
  130. package/components/tree/themes/light/tree.base.css.js.map +1 -1
  131. package/components/tree/tree-item.js +4 -13
  132. package/components/tree/tree-item.js.map +1 -1
  133. package/custom-elements.json +56 -28
  134. package/package.json +3 -3
  135. package/themes/dark/bootstrap.css +20 -22
  136. package/themes/dark/fluent.css +19 -24
  137. package/themes/dark/indigo.css +21 -43
  138. package/themes/dark/material.css +19 -21
  139. package/vscode-html-custom-data.json +2 -2
  140. package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js +0 -3
  141. package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js.map +0 -1
  142. package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js.map +0 -1
  143. package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js.map +0 -1
  144. package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js.map +0 -1
  145. package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js +0 -17
  146. package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js.map +0 -1
  147. package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js +0 -5
  148. package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js.map +0 -1
  149. package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js.map +0 -1
  150. package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js.map +0 -1
  151. package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map +0 -1
  152. package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map +0 -1
  153. /package/components/nav-drawer/themes/dark/{nav-drawer-item.base.css.d.ts → nav-drawer.bootstrap.css.d.ts} +0 -0
  154. /package/components/nav-drawer/themes/dark/{nav-drawer-item.bootstrap.css.d.ts → nav-drawer.fluent.css.d.ts} +0 -0
  155. /package/components/nav-drawer/themes/dark/{nav-drawer-item.fluent.css.d.ts → nav-drawer.material.css.d.ts} +0 -0
  156. /package/components/nav-drawer/themes/light/{nav-drawer-header-item.base.css.d.ts → header-item/nav-drawer-header-item.base.css.d.ts} +0 -0
  157. /package/components/nav-drawer/themes/{dark/nav-drawer-item.indigo.css.d.ts → light/header-item/nav-drawer-header-item.bootstrap.css.d.ts} +0 -0
  158. /package/components/nav-drawer/themes/light/{fluent → header-item}/nav-drawer-header-item.fluent.css.d.ts +0 -0
  159. /package/components/nav-drawer/themes/light/{indigo → header-item}/nav-drawer-header-item.indigo.css.d.ts +0 -0
  160. /package/components/nav-drawer/themes/light/{fluent/nav-drawer-item.fluent.css.d.ts → header-item/nav-drawer-header-item.material.css.d.ts} +0 -0
  161. /package/components/nav-drawer/themes/light/{nav-drawer-item.base.css.d.ts → item/nav-drawer-item.base.css.d.ts} +0 -0
  162. /package/components/nav-drawer/themes/light/{indigo/nav-drawer-item.indigo.css.d.ts → item/nav-drawer-item.bootstrap.css.d.ts} +0 -0
  163. /package/components/nav-drawer/themes/light/{indigo/nav-drawer.indigo.css.d.ts → item/nav-drawer-item.fluent.css.d.ts} +0 -0
@@ -32,7 +32,7 @@ export const styles = css `:host {
32
32
  display: none !important;
33
33
  }
34
34
  :host {
35
- --igc-tree-indentation-size: 24px;
35
+ --igc-tree-indentation-size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1rem, -1 * 1rem), var(--is-small, 1) * max(0.75rem, -1 * 0.75rem));
36
36
  display: -webkit-box;
37
37
  display: -ms-flexbox;
38
38
  display: flex;
@@ -42,6 +42,9 @@ export const styles = css `:host {
42
42
  flex-direction: column;
43
43
  font-family: inherit;
44
44
  }
45
+ :host igc-circular-progress {
46
+ --diameter: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.25rem, -1 * 1.25rem), var(--is-small, 1) * max(1.125rem, -1 * 1.125rem));
47
+ }
45
48
 
46
49
  :host(:focus-within) {
47
50
  outline: none;
@@ -133,9 +136,7 @@ export const styles = css `:host {
133
136
  min-width: 1.5rem;
134
137
  }
135
138
  [part~=indicator] igc-icon {
136
- width: 1.5rem;
137
- height: 1.5rem;
138
- font-size: 1.5rem;
139
+ --ig-size: 3;
139
140
  }
140
141
 
141
142
  [part~=label] {
@@ -176,17 +177,5 @@ export const styles = css `:host {
176
177
  }
177
178
  [part~=select] igc-checkbox::part(label) {
178
179
  display: none;
179
- }
180
-
181
- [part~=large] igc-circular-progress {
182
- --diameter: 1.5rem;
183
- }
184
-
185
- [part~=medium] igc-circular-progress {
186
- --diameter: 1.25rem;
187
- }
188
-
189
- [part~=small] igc-circular-progress {
190
- --diameter: 1.125rem;
191
180
  }`;
192
181
  //# sourceMappingURL=tree-item.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tree-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/tree/themes/light/tree-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6LvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n display: none !important;\n}\n:host {\n --igc-tree-indentation-size: 24px;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n font-family: inherit;\n}\n\n:host(:focus-within) {\n outline: none;\n}\n\n:host([disabled]) {\n color: hsla(var(--ig-gray-500), var(--ig-gray-a));\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n}\n\n[role~=group] {\n overflow: hidden;\n}\n\n:host(:not([expanded])) [role~=group] {\n height: 0;\n}\n\n:host([expanded]) [role~=group] {\n height: auto;\n}\n\n[part~=wrapper] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n position: relative;\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n color: var(--ig-surface-500-contrast);\n padding: 0 max(var(--is-large, 1) * max(24px, -1 * 24px) * var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)), var(--is-small, 1) * max(12px, -1 * 12px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n}\n[part~=wrapper]::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n background: transparent;\n}\n[part~=wrapper]:hover::after {\n background: var(--hover-color, hsla(var(--ig-gray-900), 0.1));\n}\n\n[part~=active] {\n background: hsla(var(--ig-gray-200), var(--ig-gray-a));\n color: var(--ig-gray-200-contrast);\n}\n\n[part~=selected] {\n background: hsla(var(--ig-secondary-200), var(--ig-secondary-a));\n color: var(--ig-secondary-200-contrast);\n}\n\n[part~=selected][part~=focused][part~=active],\n[part~=selected][part~=focused],\n[part~=selected][part~=active] {\n background: hsla(var(--ig-secondary-300), var(--ig-secondary-a));\n color: var(--ig-secondary-300-contrast);\n}\n\n[part~=focused] {\n -webkit-box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n}\n\n[part~=indicator] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n z-index: 1;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -webkit-margin-end: 0.25rem;\n margin-inline-end: 0.25rem;\n min-width: 1.5rem;\n}\n[part~=indicator] igc-icon {\n width: 1.5rem;\n height: 1.5rem;\n font-size: 1.5rem;\n}\n\n[part~=label] {\n font-family: var(--ig-body-2-font-family, var(--ig-font-family));\n font-size: var(--ig-body-2-font-size);\n font-weight: var(--ig-body-2-font-weight);\n font-style: var(--ig-body-2-font-style);\n line-height: var(--ig-body-2-line-height);\n letter-spacing: var(--ig-body-2-letter-spacing);\n text-transform: var(--ig-body-2-text-transform);\n margin-top: var(--ig-body-2-margin-top);\n margin-bottom: var(--ig-body-2-margin-bottom);\n display: block;\n margin: 0;\n}\n[part~=label] ::slotted(*) {\n margin-block: auto;\n}\n\n[part~=label],\n[part~=text] {\n z-index: 1;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n[part~=select] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n z-index: 1;\n -webkit-margin-end: 0.25rem;\n margin-inline-end: 0.25rem;\n}\n[part~=select] igc-checkbox::part(label) {\n display: none;\n}\n\n[part~=large] igc-circular-progress {\n --diameter: 1.5rem;\n}\n\n[part~=medium] igc-circular-progress {\n --diameter: 1.25rem;\n}\n\n[part~=small] igc-circular-progress {\n --diameter: 1.125rem;\n}`;\n"]}
1
+ {"version":3,"file":"tree-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/tree/themes/light/tree-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkLvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n display: none !important;\n}\n:host {\n --igc-tree-indentation-size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1rem, -1 * 1rem), var(--is-small, 1) * max(0.75rem, -1 * 0.75rem));\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n font-family: inherit;\n}\n:host igc-circular-progress {\n --diameter: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.25rem, -1 * 1.25rem), var(--is-small, 1) * max(1.125rem, -1 * 1.125rem));\n}\n\n:host(:focus-within) {\n outline: none;\n}\n\n:host([disabled]) {\n color: hsla(var(--ig-gray-500), var(--ig-gray-a));\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n}\n\n[role~=group] {\n overflow: hidden;\n}\n\n:host(:not([expanded])) [role~=group] {\n height: 0;\n}\n\n:host([expanded]) [role~=group] {\n height: auto;\n}\n\n[part~=wrapper] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n position: relative;\n background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n color: var(--ig-surface-500-contrast);\n padding: 0 max(var(--is-large, 1) * max(24px, -1 * 24px) * var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)), var(--is-medium, 1) * max(16px, -1 * 16px) * var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)), var(--is-small, 1) * max(12px, -1 * 12px) * var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)));\n}\n[part~=wrapper]::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n background: transparent;\n}\n[part~=wrapper]:hover::after {\n background: var(--hover-color, hsla(var(--ig-gray-900), 0.1));\n}\n\n[part~=active] {\n background: hsla(var(--ig-gray-200), var(--ig-gray-a));\n color: var(--ig-gray-200-contrast);\n}\n\n[part~=selected] {\n background: hsla(var(--ig-secondary-200), var(--ig-secondary-a));\n color: var(--ig-secondary-200-contrast);\n}\n\n[part~=selected][part~=focused][part~=active],\n[part~=selected][part~=focused],\n[part~=selected][part~=active] {\n background: hsla(var(--ig-secondary-300), var(--ig-secondary-a));\n color: var(--ig-secondary-300-contrast);\n}\n\n[part~=focused] {\n -webkit-box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n}\n\n[part~=indicator] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n z-index: 1;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -webkit-margin-end: 0.25rem;\n margin-inline-end: 0.25rem;\n min-width: 1.5rem;\n}\n[part~=indicator] igc-icon {\n --ig-size: 3;\n}\n\n[part~=label] {\n font-family: var(--ig-body-2-font-family, var(--ig-font-family));\n font-size: var(--ig-body-2-font-size);\n font-weight: var(--ig-body-2-font-weight);\n font-style: var(--ig-body-2-font-style);\n line-height: var(--ig-body-2-line-height);\n letter-spacing: var(--ig-body-2-letter-spacing);\n text-transform: var(--ig-body-2-text-transform);\n margin-top: var(--ig-body-2-margin-top);\n margin-bottom: var(--ig-body-2-margin-bottom);\n display: block;\n margin: 0;\n}\n[part~=label] ::slotted(*) {\n margin-block: auto;\n}\n\n[part~=label],\n[part~=text] {\n z-index: 1;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n[part~=select] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n z-index: 1;\n -webkit-margin-end: 0.25rem;\n margin-inline-end: 0.25rem;\n}\n[part~=select] igc-checkbox::part(label) {\n display: none;\n}`;\n"]}
@@ -35,17 +35,5 @@ export const styles = css `:host {
35
35
  display: block;
36
36
  overflow: auto;
37
37
  font-family: var(--ig-font-family);
38
- }
39
-
40
- :host([size=small]) {
41
- --component-size: var(--ig-size, var(--ig-size-small));
42
- }
43
-
44
- :host([size=medium]) {
45
- --component-size: var(--ig-size, var(--ig-size-medium));
46
- }
47
-
48
- :host([size=large]) {
49
- --component-size: var(--ig-size, var(--ig-size-large));
50
38
  }`;
51
39
  //# sourceMappingURL=tree.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tree.base.css.js","sourceRoot":"","sources":["../../../../../src/components/tree/themes/light/tree.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n display: none !important;\n}\n:host {\n display: block;\n overflow: auto;\n font-family: var(--ig-font-family);\n}\n\n:host([size=small]) {\n --component-size: var(--ig-size, var(--ig-size-small));\n}\n\n:host([size=medium]) {\n --component-size: var(--ig-size, var(--ig-size-medium));\n}\n\n:host([size=large]) {\n --component-size: var(--ig-size, var(--ig-size-large));\n}`;\n"]}
1
+ {"version":3,"file":"tree.base.css.js","sourceRoot":"","sources":["../../../../../src/components/tree/themes/light/tree.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n display: none !important;\n}\n:host {\n display: block;\n overflow: auto;\n font-family: var(--ig-font-family);\n}`;\n"]}
@@ -21,11 +21,6 @@ import IgcIconComponent from '../icon/icon.js';
21
21
  import IgcCheckboxComponent from '../checkbox/checkbox.js';
22
22
  import IgcCircularProgressComponent from '../progress/circular-progress.js';
23
23
  defineComponents(IgcIconComponent, IgcCheckboxComponent, IgcCircularProgressComponent);
24
- const sizeMultiplier = {
25
- small: 1 / 2,
26
- medium: 2 / 3,
27
- large: 1,
28
- };
29
24
  let IgcTreeItemComponent = class IgcTreeItemComponent extends LitElement {
30
25
  constructor() {
31
26
  super(...arguments);
@@ -336,16 +331,12 @@ let IgcTreeItemComponent = class IgcTreeItemComponent extends LitElement {
336
331
  this.expanded = false;
337
332
  }
338
333
  render() {
339
- var _a, _b;
340
- const size = this.level * (this.tree ? sizeMultiplier[this.tree.size] : 1);
334
+ var _a;
341
335
  const ltr = this.tree ? isLTR(this.tree) : true;
342
336
  return html `
343
- <div
344
- id="wrapper"
345
- part="wrapper ${(_a = this.tree) === null || _a === void 0 ? void 0 : _a.size} ${partNameMap(this.parts)}"
346
- >
337
+ <div id="wrapper" part="wrapper ${partNameMap(this.parts)}">
347
338
  <div
348
- style="width: calc(${size} * var(--igc-tree-indentation-size))"
339
+ style="width: calc(${this.level} * var(--igc-tree-indentation-size))"
349
340
  part="indentation"
350
341
  aria-hidden="true"
351
342
  >
@@ -376,7 +367,7 @@ let IgcTreeItemComponent = class IgcTreeItemComponent extends LitElement {
376
367
  </slot>
377
368
  `}
378
369
  </div>
379
- ${((_b = this.tree) === null || _b === void 0 ? void 0 : _b.selection) !== 'none'
370
+ ${((_a = this.tree) === null || _a === void 0 ? void 0 : _a.selection) !== 'none'
380
371
  ? html `
381
372
  <div part="select" aria-hidden="true">
382
373
  <igc-checkbox
@@ -1 +1 @@
1
- {"version":3,"file":"tree-item.js","sourceRoot":"","sources":["../../../src/components/tree/tree-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,QAAQ,EACR,KAAK,EACL,qBAAqB,EACrB,KAAK,GACN,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AAE9E,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAGtD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EACL,eAAe,EACf,SAAS,EACT,UAAU,GACX,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAC7E,OAAO,gBAAgB,MAAM,iBAAiB,CAAC;AAC/C,OAAO,oBAAoB,MAAM,yBAAyB,CAAC;AAC3D,OAAO,4BAA4B,MAAM,kCAAkC,CAAC;AAE5E,gBAAgB,CACd,gBAAgB,EAChB,oBAAoB,EACpB,4BAA4B,CAC7B,CAAC;AAEF,MAAM,cAAc,GAAiD;IACnE,KAAK,EAAE,CAAC,GAAG,CAAC;IACZ,MAAM,EAAE,CAAC,GAAG,CAAC;IACb,KAAK,EAAE,CAAC;CACT,CAAC;AAuBF,IAAqB,oBAAoB,GAAzC,MAAqB,oBAAqB,SAAQ,UAAU;IAA5D;;QAOU,4BAAuB,GAAG,KAAK,CAAC;QAOjC,WAAM,GAAgC,IAAI,CAAC;QAI3C,SAAI,GAAG,KAAK,CAAC;QAeZ,cAAS,GAAG,KAAK,CAAC;QAKnB,gBAAW,GAAG,KAAK,CAAC;QAIpB,UAAK,GAAG,CAAC,CAAC;QAKV,kBAAa,GAAG,KAAK,CAAC;QAOtB,UAAK,GAAG,EAAE,CAAC;QAOX,aAAQ,GAAG,KAAK,CAAC;QAOjB,WAAM,GAAG,KAAK,CAAC;QAOf,aAAQ,GAAG,KAAK,CAAC;QAOjB,aAAQ,GAAG,KAAK,CAAC;QAOjB,YAAO,GAAG,KAAK,CAAC;QAQhB,UAAK,GAAQ,SAAS,CAAC;IAyahC,CAAC;IAvaiB,YAAY;QAC1B,IAAI,CAAC,eAAe,GAAG,IAAI,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACzD,CAAC;IAEO,KAAK,CAAC,eAAe,CAAC,GAAqB;QACjD,MAAM,SAAS,GAAG,GAAG,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC;QAE1D,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC;YACnC,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE;YAC9B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;SACvC,CAAC,CAAC;QAEH,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,CAAC;IACjC,CAAC;IAIS,UAAU;QAClB,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;SAC9D;aAAM;YACL,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;SACvC;IACH,CAAC;IAGS,cAAc,CAAC,QAAiB;;QAExC,MAAA,IAAI,CAAC,UAAU,0CAAE,oBAAoB,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC3D,IAAI,CAAC,QAAQ,EAAE;YACb,OAAO;SACR;QAED,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;;YAC1B,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,MAAK,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;gBAC5D,MAAA,MAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,0CAAE,OAAO,0CAAE,cAAc,CAAC;oBACpD,QAAQ,EAAE,QAAQ;oBAClB,KAAK,EAAE,SAAS;oBAChB,MAAM,EAAE,SAAS;iBAClB,CAAC,CAAC;aACJ;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAGS,YAAY;;QACpB,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,UAAU,MAAK,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YACzE,OAAO;SACR;QACD,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SAC5C;QAED,MAAA,IAAI,CAAC,IAAI,0CAAE,YAAY,CAAC,IAAI,CAAC,CAAC;QAE9B,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;;YAC1B,MAAA,IAAI,CAAC,OAAO,0CAAE,cAAc,CAAC;gBAC3B,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,SAAS;gBAChB,MAAM,EAAE,SAAS;aAClB,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAGS,cAAc;;QACtB,MAAA,IAAI,CAAC,UAAU,0CAAE,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAC/C,CAAC;IAGS,cAAc;;QACtB,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,gBAAgB,0CAAE,cAAc,CAAC,IAAI,CAAC,CAAA,EAAE;YACjE,MAAA,IAAI,CAAC,gBAAgB,0CAAE,sBAAsB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;SACvD;QACD,IAAI,CAAC,IAAI,CAAC,QAAQ,KAAI,MAAA,IAAI,CAAC,gBAAgB,0CAAE,cAAc,CAAC,IAAI,CAAC,CAAA,EAAE;YACjE,MAAA,IAAI,CAAC,gBAAgB,0CAAE,wBAAwB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;SACzD;IACH,CAAC;IAEe,iBAAiB;;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAqB,CAAC;QACzD,IAAI,CAAC,MAAM,GAAG,MAAA,IAAI,CAAC,aAAa,0CAAE,OAAO,CACvC,eAAe,CACe,CAAC;QACjC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrD,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QACtC,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAC3C,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAC7C,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QACvD,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpB,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB;aAAM;YAGL,MAAA,IAAI,CAAC,gBAAgB,0CAAE,kBAAkB,CAAC,IAAI,CAAC,CAAC;SACjD;QACD,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAEe,oBAAoB;;QAClC,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,MAAA,IAAI,CAAC,gBAAgB,0CAAE,uBAAuB,CAAC,IAAI,CAAC,CAAC;QACrD,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IACrC,CAAC;IAED,IAAY,gBAAgB;;QAC1B,OAAO,MAAA,IAAI,CAAC,IAAI,0CAAE,gBAAgB,CAAC;IACrC,CAAC;IAED,IAAY,UAAU;;QACpB,OAAO,MAAA,IAAI,CAAC,IAAI,0CAAE,UAAU,CAAC;IAC/B,CAAC;IAED,IAAY,KAAK;QACf,OAAO;YACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,OAAO,EAAE,IAAI,CAAC,SAAS;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;QACxB,OAAO,IAAI,CAAC,WAAW,CAAC,MAAM,CAC5B,CAAC,CAAC,EAAE,EAAE;;YACJ,OAAA,MAAA,CAAC,MAAA,CAAC,CAAC,MAAM,mCAAI,MAAA,CAAC,CAAC,aAAa,0CAAE,OAAO,CAAC,eAAe,CAAC,CAAC,0CAAE,UAAU,CACjE,IAAI,CACL,CAAA;SAAA,CACsB,CAAC;IAC9B,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC,CAAC;IAC5D,CAAC;IAGD,IAAW,IAAI;;QACb,OAAO,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,EAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAClE,CAAC;IAEO,WAAW,CAAC,KAAiB;;QACnC,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QACD,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;QAClB,MAAA,IAAI,CAAC,UAAU,0CAAE,uBAAuB,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;IAC9D,CAAC;IAEO,oBAAoB;QAC1B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QACD,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,eAAe,EAAE,CAAC;SACxB;IACH,CAAC;IAEO,aAAa,CAAC,KAAiB;;QACrC,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,KAAK,CAAC,QAAQ,EAAE;YAClB,MAAA,IAAI,CAAC,gBAAgB,0CAAE,mBAAmB,CAAC,IAAI,CAAC,CAAC;YACjD,OAAO;SACR;QACD,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,MAAA,IAAI,CAAC,gBAAgB,0CAAE,YAAY,CAAC,IAAI,CAAC,CAAC;SAC3C;aAAM;YACL,MAAA,IAAI,CAAC,gBAAgB,0CAAE,UAAU,CAAC,IAAI,CAAC,CAAC;SACzC;IACH,CAAC;IAEO,OAAO;;QACb,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QACD,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,MAAK,IAAI,EAAE;YACzC,MAAA,IAAI,CAAC,UAAU,0CAAE,SAAS,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;YACxC,MAAA,IAAI,CAAC,OAAO,0CAAE,cAAc,CAAC;gBAC3B,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,SAAS;gBAChB,MAAM,EAAE,SAAS;aAClB,CAAC,CAAC;SACJ;QACD,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE;YAG7C,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,OAAoB,EAAE,EAAE;gBAC/C,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC;YACvB,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC;YACpC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC;YAC3B,OAAO;SACR;QACD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;IACxB,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IACzB,CAAC;IAEO,SAAS,CAAC,EAAS;;QACzB,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,eAAe,EAAE,CAAC;QACtB,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAElB,IAAI,CAAC,IAAI,CAAC,uBAAuB,EAAE;gBACjC,MAAA,IAAI,CAAC,UAAU,0CAAE,OAAO,CAAC,CAAC,OAAoB,EAAE,EAAE;oBAChD,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC;gBACvB,CAAC,CAAC,CAAC;aACJ;YACD,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;YACjC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,uBAAuB,GAAG,KAAK,CAAC;SACtC;IACH,CAAC;IAEO,UAAU,CAAC,EAAS;;QAC1B,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,eAAe,EAAE,CAAC;QACtB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,MAAA,IAAI,CAAC,UAAU,0CAAE,OAAO,CAAC,CAAC,OAAoB,EAAE,EAAE;YAChD,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;QACxB,CAAC,CAAC,CAAC;QAEH,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,MAAK,IAAI,EAAE;YAEzC,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;SACpC;IACH,CAAC;IAEO,WAAW;QACjB,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;QACzC,MAAM,gBAAgB,GACpB,oFAAoF,CAAC;QAEvF,IAAI,CAAC,UAAU,GAAG;YAChB,GAAG,YAAY,CAAC,gBAAgB,CAAc,gBAAgB,CAAC;SAChE,CAAC;QACF,IAAI,YAAY,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE;YAC1C,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,YAAY,CAAC,CAAC;SAC5C;QAED,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE;YAC7C,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;YAClC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;YAEpD,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,OAAoB,EAAE,EAAE;gBAC/C,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;YACxB,CAAC,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;SACvC;IACH,CAAC;IAEO,YAAY;;QAClB,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC;QAEhD,MAAA,IAAI,CAAC,UAAU,0CAAE,oBAAoB,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IACpE,CAAC;IAQM,WAAW,CAChB,UAAgC,EAAE,OAAO,EAAE,KAAK,EAAE;QAElD,IAAI,OAAO,CAAC,OAAO,EAAE;YACnB,OAAO,IAAI,CAAC,WAAW,CAAC;SACzB;aAAM;YACL,OAAO,IAAI,CAAC,cAAc,CAAC;SAC5B;IACH,CAAC;IAMM,KAAK,CAAC,eAAe;;QAC1B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QACD,MAAM,IAAI,GAAG;YACX,MAAM,EAAE,IAAI;YACZ,UAAU,EAAE,IAAI;SACjB,CAAC;QAEF,MAAM,OAAO,GAAG,MAAA,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAC;QAE/D,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO;SACR;QAED,IAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,kBAAkB,EAAE;YACjC,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;YACnE,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAA0B,EAAE,EAAE;gBACrD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;iBAC1B;YACH,CAAC,CAAC,CAAC;SACJ;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,MAAM,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,EAAE;YACtC,MAAA,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;SAC3D;IACH,CAAC;IAMM,KAAK,CAAC,iBAAiB;;QAC5B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO;SACR;QACD,MAAM,IAAI,GAAG;YACX,MAAM,EAAE,IAAI;YACZ,UAAU,EAAE,IAAI;SACjB,CAAC;QAEF,MAAM,OAAO,GAAG,MAAA,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,mBAAmB,EAAE,IAAI,CAAC,CAAC;QAEhE,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO;SACR;QAED,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACtB,IAAI,MAAM,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE;YACvC,MAAA,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;SAC5D;IACH,CAAC;IAGM,MAAM;QACX,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;IACjC,CAAC;IAGM,MAAM;QACX,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAGM,QAAQ;QACb,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;IACxB,CAAC;IAEkB,MAAM;;QACvB,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,IAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC5E,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAEhD,OAAO,IAAI,CAAA;;;wBAGS,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC;;;+BAGnC,IAAI;;;;;;;YAOvB,IAAI,CAAC,OAAO;YACZ,CAAC,CAAC,IAAI,CAAA;;;;eAIH;YACH,CAAC,CAAC,IAAI,CAAA;gDAC8B,IAAI,CAAC,oBAAoB;oBACrD,IAAI,CAAC,WAAW;gBAChB,CAAC,CAAC,IAAI,CAAA;;iCAEO,IAAI,CAAC,QAAQ;oBAClB,CAAC,CAAC,qBAAqB;oBACvB,CAAC,CAAC,CAAC,GAAG;wBACN,CAAC,CAAC,iBAAiB;wBACnB,CAAC,CAAC,sBAAsB;;;;uBAI7B;gBACH,CAAC,CAAC,EAAE;;eAET;;UAEL,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,SAAS,MAAK,MAAM;YAC/B,CAAC,CAAC,IAAI,CAAA;;;2BAGW,IAAI,CAAC,aAAa;6BAChB,IAAI,CAAC,QAAQ;mCACP,IAAI,CAAC,aAAa;8BACvB,IAAI,CAAC,QAAQ;;;;;aAK9B;YACH,CAAC,CAAC,EAAE;;;;0BAIY,IAAI,CAAC,WAAW;uBACnB,IAAI,CAAC,SAAS;wBACb,IAAI,CAAC,UAAU;;gCAEP,IAAI,CAAC,KAAK;;;;sCAIJ,CAAC,IAAI,CAAC,QAAQ;4BACxB,IAAI,CAAC,YAAY;;KAExC,CAAC;IACJ,CAAC;;AAvgBsB,4BAAO,GAAG,eAAe,AAAlB,CAAmB;AAE1B,2BAAM,GAAG,MAAM,AAAT,CAAU;AAQhC;IADN,cAAc,EAAE;kDACc;AAMxB;IADN,cAAc,EAAE;kDACG;AAGZ;IADP,qBAAqB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yDACf;AAKlC;IAFN,KAAK,CAAC,UAAU,CAAC;IACjB,cAAc,EAAE;qDACY;AAIrB;IADP,KAAK,CAAC,gBAAgB,EAAE,IAAI,CAAC;mDACF;AAGpB;IADP,KAAK,EAAE;uDACkB;AAKnB;IAFN,KAAK,EAAE;IACP,cAAc,EAAE;yDACU;AAIpB;IADN,KAAK,EAAE;mDACS;AAKV;IAFN,KAAK,EAAE;IACP,cAAc,EAAE;2DACY;AAOtB;IADN,QAAQ,EAAE;mDACO;AAOX;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sDACnB;AAOjB;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oDACrB;AAOf;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sDACnB;AAOjB;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sDACnB;AAOjB;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qDACpB;AAQhB;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;mDACA;AAmBpB;IAFT,KAAK,CAAC,UAAU,EAAE,EAAE,oBAAoB,EAAE,IAAI,EAAE,CAAC;IACjD,KAAK,CAAC,aAAa,EAAE,EAAE,oBAAoB,EAAE,IAAI,EAAE,CAAC;sDAOpD;AAGS;IADT,KAAK,CAAC,UAAU,CAAC;0DAiBjB;AAGS;IADT,KAAK,CAAC,QAAQ,EAAE,EAAE,oBAAoB,EAAE,IAAI,EAAE,CAAC;wDAkB/C;AAGS;IADT,KAAK,CAAC,UAAU,CAAC;0DAGjB;AAGS;IADT,KAAK,CAAC,UAAU,EAAE,EAAE,oBAAoB,EAAE,IAAI,EAAE,CAAC;0DAQjD;AA+LM;IADN,cAAc,EAAE;uDAShB;AAvXkB,oBAAoB;IADxC,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC;GAC3B,oBAAoB,CA0gBxC;eA1gBoB,oBAAoB","sourcesContent":["import {\n property,\n query,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { html, LitElement } from 'lit';\nimport { isLTR, partNameMap } from '../common/util.js';\nimport { styles } from './themes/light/tree-item.base.css.js';\nimport { styles as bootstrap } from './themes/light/tree-item.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/tree-item.fluent.css.js';\nimport { styles as indigo } from './themes/light/tree-item.indigo.css.js';\nimport { styles as material } from './themes/light/tree-item.material.css.js';\nimport type IgcTreeComponent from './tree.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { IgcTreeSelectionService } from './tree.selection.js';\nimport { IgcTreeNavigationService } from './tree.navigation.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { blazorSuppress } from '../common/decorators/blazorSuppress.js';\nimport {\n AnimationPlayer,\n growVerIn,\n growVerOut,\n} from '../../animations/index.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcCheckboxComponent from '../checkbox/checkbox.js';\nimport IgcCircularProgressComponent from '../progress/circular-progress.js';\n\ndefineComponents(\n IgcIconComponent,\n IgcCheckboxComponent,\n IgcCircularProgressComponent\n);\n\nconst sizeMultiplier: Record<'small' | 'medium' | 'large', number> = {\n small: 1 / 2,\n medium: 2 / 3,\n large: 1,\n};\n\n/**\n * The tree-item component represents a child item of the tree component or another tree item.\n *\n * @element igc-tree-item\n *\n * @slot - Renders nested tree-item component.\n * @slot label - Renders the tree item container.\n * @slot indicator - Renders the expand indicator container.\n * @slot loading - Renders the tree item loading indicator container.\n * @slot indentation - Renders the container (by default the space) before the tree item.\n *\n * @csspart wrapper - The wrapper for the tree item.\n * @csspart selected - Indicates selected state. Applies to `wrapper`.\n * @csspart focused - Indicates focused state. Applies to `wrapper`.\n * @csspart active - Indicates an active state. Applies to `wrapper`.\n * @csspart indicator - The expand indicator of the tree item.\n * @csspart label - The tree item content.\n * @csspart text - The tree item displayed text.\n * @csspart select - The checkbox of the tree item when selection is enabled.\n */\n@themes({ bootstrap, fluent, indigo, material })\nexport default class IgcTreeItemComponent extends LitElement {\n /** @private */\n public static readonly tagName = 'igc-tree-item';\n /** @private */\n public static override styles = styles;\n\n private tabbableEl?: HTMLElement[];\n private focusedProgrammatically = false;\n private animationPlayer!: AnimationPlayer;\n\n /** A reference to the tree the item is a part of. */\n @blazorSuppress()\n public tree?: IgcTreeComponent;\n /** The parent item of the current tree item (if any) */\n public parent: IgcTreeItemComponent | null = null;\n\n /** @private */\n @blazorSuppress()\n public init = false;\n\n @queryAssignedElements({ slot: 'label', flatten: true })\n private contentList!: Array<HTMLElement>;\n\n /** @private */\n @query('#wrapper')\n @blazorSuppress()\n public wrapper!: HTMLElement;\n\n /** @private */\n @query('[role=\"group\"]', true)\n private group!: HTMLElement;\n\n @state()\n private isFocused = false;\n\n /** @private */\n @state()\n @blazorSuppress()\n public hasChildren = false;\n\n /** The depth of the item, relative to the root. */\n @state()\n public level = 0;\n\n /** @private */\n @state()\n @blazorSuppress()\n public indeterminate = false;\n\n /**\n * The tree item label.\n * @attr\n */\n @property()\n public label = '';\n\n /**\n * The tree item expansion state.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public expanded = false;\n\n /**\n * Marks the item as the tree's active item.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public active = false;\n\n /**\n * Get/Set whether the tree item is disabled. Disabled items are ignored for user interactions.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public disabled = false;\n\n /**\n * The tree item selection state.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public selected = false;\n\n /**\n * To be used for load-on-demand scenarios in order to specify whether the item is loading data.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public loading = false;\n\n /**\n * The value entry that the tree item is visualizing. Required for searching through items.\n * @type any\n * @attr\n */\n @property({ attribute: true })\n public value: any = undefined;\n\n public override firstUpdated() {\n this.animationPlayer = new AnimationPlayer(this.group);\n }\n\n private async toggleAnimation(dir: 'open' | 'close') {\n const animation = dir === 'open' ? growVerIn : growVerOut;\n\n const [_, event] = await Promise.all([\n this.animationPlayer.stopAll(),\n this.animationPlayer.play(animation()),\n ]);\n\n return event.type === 'finish';\n }\n\n @watch('expanded', { waitUntilFirstUpdate: true })\n @watch('hasChildren', { waitUntilFirstUpdate: true })\n protected bothChange(): void {\n if (this.hasChildren) {\n this.setAttribute('aria-expanded', this.expanded.toString());\n } else {\n this.removeAttribute('aria-expanded');\n }\n }\n\n @watch('expanded')\n protected expandedChange(oldValue: boolean): void {\n // always update the visible cache\n this.navService?.update_visible_cache(this, this.expanded);\n if (!oldValue) {\n return;\n }\n // await for load on demand children\n Promise.resolve().then(() => {\n if (this.navService?.focusedItem !== this && !this.isFocused) {\n this.navService?.focusedItem?.wrapper?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n }\n });\n }\n\n @watch('active', { waitUntilFirstUpdate: true })\n protected activeChange(): void {\n if ((this.active && this.navService?.activeItem === this) || !this.active) {\n return;\n }\n if (this.navService) {\n this.navService.setActiveItem(this, false);\n }\n // Expand and scroll to the newly active item\n this.tree?.expandToItem(this);\n // Await for expanding\n Promise.resolve().then(() => {\n this.wrapper?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n });\n }\n\n @watch('disabled')\n protected disabledChange(): void {\n this.navService?.update_disabled_cache(this);\n }\n\n @watch('selected', { waitUntilFirstUpdate: true })\n protected selectedChange(): void {\n if (this.selected && !this.selectionService?.isItemSelected(this)) {\n this.selectionService?.selectItemsWithNoEvent([this]);\n }\n if (!this.selected && this.selectionService?.isItemSelected(this)) {\n this.selectionService?.deselectItemsWithNoEvent([this]);\n }\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.tree = this.closest('igc-tree') as IgcTreeComponent;\n this.parent = this.parentElement?.closest(\n 'igc-tree-item'\n ) as IgcTreeItemComponent | null;\n this.level = this.parent ? this.parent.level + 1 : 0;\n this.setAttribute('role', 'treeitem');\n this.addEventListener('blur', this.onBlur);\n this.addEventListener('focus', this.onFocus);\n this.addEventListener('pointerdown', this.pointerDown);\n this.activeChange();\n // if the item is not added/moved runtime\n if (this.init) {\n this.selectedChange();\n } else {\n // retriger the item selection state in order to update the collections within the selectionService\n // and to handle correctly the itemParents recursively to the top-most ancestor\n this.selectionService?.retriggerItemState(this);\n }\n this.init = false;\n }\n\n public override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.selectionService?.ensureStateOnItemDelete(this);\n this.navService?.delete_item(this);\n }\n\n private get selectionService(): IgcTreeSelectionService | undefined {\n return this.tree?.selectionService;\n }\n\n private get navService(): IgcTreeNavigationService | undefined {\n return this.tree?.navService;\n }\n\n private get parts() {\n return {\n selected: this.selected,\n focused: this.isFocused,\n active: this.active,\n };\n }\n\n private get directChildren(): Array<IgcTreeItemComponent> {\n return this.allChildren.filter(\n (x) =>\n (x.parent ?? x.parentElement?.closest('igc-tree-item'))?.isSameNode(\n this\n )\n ) as IgcTreeItemComponent[];\n }\n\n private get allChildren(): Array<IgcTreeItemComponent> {\n return Array.from(this.querySelectorAll(`igc-tree-item`));\n }\n\n /** The full path to the tree item, starting from the top-most ancestor. */\n public get path(): IgcTreeItemComponent[] {\n return this.parent?.path ? [...this.parent.path, this] : [this];\n }\n\n private pointerDown(event: MouseEvent): void {\n event.stopPropagation();\n if (this.disabled) {\n return;\n }\n this.tabIndex = 0;\n this.navService?.setFocusedAndActiveItem(this, true, false);\n }\n\n private expandIndicatorClick(): void {\n if (this.disabled) {\n return;\n }\n if (this.expanded) {\n this.collapseWithEvent();\n } else {\n this.expandWithEvent();\n }\n }\n\n private selectorClick(event: MouseEvent): void {\n event.preventDefault();\n if (event.shiftKey) {\n this.selectionService?.selectMultipleItems(this);\n return;\n }\n if (this.selected) {\n this.selectionService?.deselectItem(this);\n } else {\n this.selectionService?.selectItem(this);\n }\n }\n\n private onFocus(): void {\n if (this.disabled) {\n return;\n }\n if (this.navService?.focusedItem !== this) {\n this.navService?.focusItem(this, false);\n this.wrapper?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n }\n if (this.tabbableEl && this.tabbableEl.length) {\n // set tabIndex = 0 to all tabbable elements\n // focus the first one\n this.tabbableEl.forEach((element: HTMLElement) => {\n element.tabIndex = 0;\n });\n this.focusedProgrammatically = true;\n this.tabbableEl[0].focus();\n return;\n }\n this.isFocused = true;\n }\n\n private onBlur(): void {\n this.isFocused = false;\n }\n\n private onFocusIn(ev: Event): void {\n ev?.stopPropagation();\n if (!this.disabled) {\n // clicking directly over tabbable element when the item is not focused\n if (!this.focusedProgrammatically) {\n this.tabbableEl?.forEach((element: HTMLElement) => {\n element.tabIndex = 0;\n });\n }\n this.removeAttribute('tabIndex');\n this.isFocused = true;\n this.focusedProgrammatically = false;\n }\n }\n\n private onFocusOut(ev: Event): void {\n ev?.stopPropagation();\n this.isFocused = false;\n this.tabbableEl?.forEach((element: HTMLElement) => {\n element.tabIndex = -1;\n });\n\n if (this.navService?.focusedItem === this) {\n // called twice when clicking on already focused item with link (pointerDown handler)\n this.setAttribute('tabindex', '0');\n }\n }\n\n private labelChange(): void {\n const firstElement = this.contentList[0];\n const tabbableSelector =\n 'a[href], button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])';\n\n this.tabbableEl = [\n ...firstElement.querySelectorAll<HTMLElement>(tabbableSelector),\n ];\n if (firstElement.matches(tabbableSelector)) {\n this.tabbableEl.splice(0, 0, firstElement);\n }\n\n if (this.tabbableEl && this.tabbableEl.length) {\n this.setAttribute('role', 'none');\n this.tabbableEl[0].setAttribute('role', 'treeitem');\n\n this.tabbableEl.forEach((element: HTMLElement) => {\n element.tabIndex = -1;\n });\n } else {\n this.setAttribute('role', 'treeitem');\n }\n }\n\n private handleChange(): void {\n this.hasChildren = !!this.directChildren.length;\n // there is no need to update nested children beacuse they're state is already up to date\n this.navService?.update_visible_cache(this, this.expanded, false);\n }\n\n /**\n * Returns a collection of child items.\n * If the parameter value is true returns all tree item's direct children,\n * otherwise - only the direct children.\n */\n @blazorSuppress()\n public getChildren(\n options: { flatten: boolean } = { flatten: false }\n ): IgcTreeItemComponent[] {\n if (options.flatten) {\n return this.allChildren;\n } else {\n return this.directChildren;\n }\n }\n\n /**\n * @private\n * Expands the tree item.\n */\n public async expandWithEvent() {\n if (this.expanded) {\n return;\n }\n const args = {\n detail: this,\n cancelable: true,\n };\n\n const allowed = this.tree?.emitEvent('igcItemExpanding', args);\n\n if (!allowed) {\n return;\n }\n\n if (this.tree?.singleBranchExpand) {\n const pathSet = new Set(this.path.splice(0, this.path.length - 1));\n this.tree.items.forEach((item: IgcTreeItemComponent) => {\n if (!pathSet.has(item)) {\n item.collapseWithEvent();\n }\n });\n }\n\n this.expanded = true;\n if (await this.toggleAnimation('open')) {\n this.tree?.emitEvent('igcItemExpanded', { detail: this });\n }\n }\n\n /**\n * @private\n * Collapses the tree item.\n */\n public async collapseWithEvent() {\n if (!this.expanded) {\n return;\n }\n const args = {\n detail: this,\n cancelable: true,\n };\n\n const allowed = this.tree?.emitEvent('igcItemCollapsing', args);\n\n if (!allowed) {\n return;\n }\n\n this.expanded = false;\n if (await this.toggleAnimation('close')) {\n this.tree?.emitEvent('igcItemCollapsed', { detail: this });\n }\n }\n\n /** Toggles tree item expansion state. */\n public toggle(): void {\n this.expanded = !this.expanded;\n }\n\n /** Expands the tree item. */\n public expand(): void {\n this.expanded = true;\n }\n\n /** Collapses the tree item. */\n public collapse(): void {\n this.expanded = false;\n }\n\n protected override render() {\n const size = this.level * (this.tree ? sizeMultiplier[this.tree!.size] : 1);\n const ltr = this.tree ? isLTR(this.tree) : true;\n\n return html`\n <div\n id=\"wrapper\"\n part=\"wrapper ${this.tree?.size} ${partNameMap(this.parts)}\"\n >\n <div\n style=\"width: calc(${size} * var(--igc-tree-indentation-size))\"\n part=\"indentation\"\n aria-hidden=\"true\"\n >\n <slot name=\"indentation\"></slot>\n </div>\n <div part=\"indicator\" aria-hidden=\"true\">\n ${this.loading\n ? html`\n <slot name=\"loading\">\n <igc-circular-progress indeterminate></igc-circular-progress>\n </slot>\n `\n : html`\n <slot name=\"indicator\" @click=${this.expandIndicatorClick}>\n ${this.hasChildren\n ? html`\n <igc-icon\n name=${this.expanded\n ? 'keyboard_arrow_down'\n : !ltr\n ? 'navigate_before'\n : 'keyboard_arrow_right'}\n collection=\"internal\"\n >\n </igc-icon>\n `\n : ''}\n </slot>\n `}\n </div>\n ${this.tree?.selection !== 'none'\n ? html`\n <div part=\"select\" aria-hidden=\"true\">\n <igc-checkbox\n @click=${this.selectorClick}\n .checked=${this.selected}\n .indeterminate=${this.indeterminate}\n .disabled=${this.disabled}\n tabindex=\"-1\"\n >\n </igc-checkbox>\n </div>\n `\n : ''}\n <div part=\"label\">\n <slot\n name=\"label\"\n @slotchange=${this.labelChange}\n @focusin=${this.onFocusIn}\n @focusout=${this.onFocusOut}\n >\n <span part=\"text\">${this.label}</span>\n </slot>\n </div>\n </div>\n <div role=\"group\" aria-hidden=${!this.expanded}>\n <slot @slotchange=${this.handleChange}></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-tree-item': IgcTreeItemComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"tree-item.js","sourceRoot":"","sources":["../../../src/components/tree/tree-item.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n property,\n query,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { html, LitElement } from 'lit';\nimport { isLTR, partNameMap } from '../common/util.js';\nimport { styles } from './themes/light/tree-item.base.css.js';\nimport { styles as bootstrap } from './themes/light/tree-item.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/tree-item.fluent.css.js';\nimport { styles as indigo } from './themes/light/tree-item.indigo.css.js';\nimport { styles as material } from './themes/light/tree-item.material.css.js';\nimport type IgcTreeComponent from './tree.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { IgcTreeSelectionService } from './tree.selection.js';\nimport { IgcTreeNavigationService } from './tree.navigation.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { blazorSuppress } from '../common/decorators/blazorSuppress.js';\nimport {\n AnimationPlayer,\n growVerIn,\n growVerOut,\n} from '../../animations/index.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcCheckboxComponent from '../checkbox/checkbox.js';\nimport IgcCircularProgressComponent from '../progress/circular-progress.js';\n\ndefineComponents(\n IgcIconComponent,\n IgcCheckboxComponent,\n IgcCircularProgressComponent\n);\n\n/**\n * The tree-item component represents a child item of the tree component or another tree item.\n *\n * @element igc-tree-item\n *\n * @slot - Renders nested tree-item component.\n * @slot label - Renders the tree item container.\n * @slot indicator - Renders the expand indicator container.\n * @slot loading - Renders the tree item loading indicator container.\n * @slot indentation - Renders the container (by default the space) before the tree item.\n *\n * @csspart wrapper - The wrapper for the tree item.\n * @csspart selected - Indicates selected state. Applies to `wrapper`.\n * @csspart focused - Indicates focused state. Applies to `wrapper`.\n * @csspart active - Indicates an active state. Applies to `wrapper`.\n * @csspart indicator - The expand indicator of the tree item.\n * @csspart label - The tree item content.\n * @csspart text - The tree item displayed text.\n * @csspart select - The checkbox of the tree item when selection is enabled.\n */\n@themes({ bootstrap, fluent, indigo, material })\nexport default class IgcTreeItemComponent extends LitElement {\n /** @private */\n public static readonly tagName = 'igc-tree-item';\n /** @private */\n public static override styles = styles;\n\n private tabbableEl?: HTMLElement[];\n private focusedProgrammatically = false;\n private animationPlayer!: AnimationPlayer;\n\n /** A reference to the tree the item is a part of. */\n @blazorSuppress()\n public tree?: IgcTreeComponent;\n /** The parent item of the current tree item (if any) */\n public parent: IgcTreeItemComponent | null = null;\n\n /** @private */\n @blazorSuppress()\n public init = false;\n\n @queryAssignedElements({ slot: 'label', flatten: true })\n private contentList!: Array<HTMLElement>;\n\n /** @private */\n @query('#wrapper')\n @blazorSuppress()\n public wrapper!: HTMLElement;\n\n /** @private */\n @query('[role=\"group\"]', true)\n private group!: HTMLElement;\n\n @state()\n private isFocused = false;\n\n /** @private */\n @state()\n @blazorSuppress()\n public hasChildren = false;\n\n /** The depth of the item, relative to the root. */\n @state()\n public level = 0;\n\n /** @private */\n @state()\n @blazorSuppress()\n public indeterminate = false;\n\n /**\n * The tree item label.\n * @attr\n */\n @property()\n public label = '';\n\n /**\n * The tree item expansion state.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public expanded = false;\n\n /**\n * Marks the item as the tree's active item.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public active = false;\n\n /**\n * Get/Set whether the tree item is disabled. Disabled items are ignored for user interactions.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public disabled = false;\n\n /**\n * The tree item selection state.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public selected = false;\n\n /**\n * To be used for load-on-demand scenarios in order to specify whether the item is loading data.\n * @attr\n */\n @property({ reflect: true, type: Boolean })\n public loading = false;\n\n /**\n * The value entry that the tree item is visualizing. Required for searching through items.\n * @type any\n * @attr\n */\n @property({ attribute: true })\n public value: any = undefined;\n\n public override firstUpdated() {\n this.animationPlayer = new AnimationPlayer(this.group);\n }\n\n private async toggleAnimation(dir: 'open' | 'close') {\n const animation = dir === 'open' ? growVerIn : growVerOut;\n\n const [_, event] = await Promise.all([\n this.animationPlayer.stopAll(),\n this.animationPlayer.play(animation()),\n ]);\n\n return event.type === 'finish';\n }\n\n @watch('expanded', { waitUntilFirstUpdate: true })\n @watch('hasChildren', { waitUntilFirstUpdate: true })\n protected bothChange(): void {\n if (this.hasChildren) {\n this.setAttribute('aria-expanded', this.expanded.toString());\n } else {\n this.removeAttribute('aria-expanded');\n }\n }\n\n @watch('expanded')\n protected expandedChange(oldValue: boolean): void {\n // always update the visible cache\n this.navService?.update_visible_cache(this, this.expanded);\n if (!oldValue) {\n return;\n }\n // await for load on demand children\n Promise.resolve().then(() => {\n if (this.navService?.focusedItem !== this && !this.isFocused) {\n this.navService?.focusedItem?.wrapper?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n }\n });\n }\n\n @watch('active', { waitUntilFirstUpdate: true })\n protected activeChange(): void {\n if ((this.active && this.navService?.activeItem === this) || !this.active) {\n return;\n }\n if (this.navService) {\n this.navService.setActiveItem(this, false);\n }\n // Expand and scroll to the newly active item\n this.tree?.expandToItem(this);\n // Await for expanding\n Promise.resolve().then(() => {\n this.wrapper?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n });\n }\n\n @watch('disabled')\n protected disabledChange(): void {\n this.navService?.update_disabled_cache(this);\n }\n\n @watch('selected', { waitUntilFirstUpdate: true })\n protected selectedChange(): void {\n if (this.selected && !this.selectionService?.isItemSelected(this)) {\n this.selectionService?.selectItemsWithNoEvent([this]);\n }\n if (!this.selected && this.selectionService?.isItemSelected(this)) {\n this.selectionService?.deselectItemsWithNoEvent([this]);\n }\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.tree = this.closest('igc-tree') as IgcTreeComponent;\n this.parent = this.parentElement?.closest(\n 'igc-tree-item'\n ) as IgcTreeItemComponent | null;\n this.level = this.parent ? this.parent.level + 1 : 0;\n this.setAttribute('role', 'treeitem');\n this.addEventListener('blur', this.onBlur);\n this.addEventListener('focus', this.onFocus);\n this.addEventListener('pointerdown', this.pointerDown);\n this.activeChange();\n // if the item is not added/moved runtime\n if (this.init) {\n this.selectedChange();\n } else {\n // retriger the item selection state in order to update the collections within the selectionService\n // and to handle correctly the itemParents recursively to the top-most ancestor\n this.selectionService?.retriggerItemState(this);\n }\n this.init = false;\n }\n\n public override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.selectionService?.ensureStateOnItemDelete(this);\n this.navService?.delete_item(this);\n }\n\n private get selectionService(): IgcTreeSelectionService | undefined {\n return this.tree?.selectionService;\n }\n\n private get navService(): IgcTreeNavigationService | undefined {\n return this.tree?.navService;\n }\n\n private get parts() {\n return {\n selected: this.selected,\n focused: this.isFocused,\n active: this.active,\n };\n }\n\n private get directChildren(): Array<IgcTreeItemComponent> {\n return this.allChildren.filter(\n (x) =>\n (x.parent ?? x.parentElement?.closest('igc-tree-item'))?.isSameNode(\n this\n )\n ) as IgcTreeItemComponent[];\n }\n\n private get allChildren(): Array<IgcTreeItemComponent> {\n return Array.from(this.querySelectorAll(`igc-tree-item`));\n }\n\n /** The full path to the tree item, starting from the top-most ancestor. */\n public get path(): IgcTreeItemComponent[] {\n return this.parent?.path ? [...this.parent.path, this] : [this];\n }\n\n private pointerDown(event: MouseEvent): void {\n event.stopPropagation();\n if (this.disabled) {\n return;\n }\n this.tabIndex = 0;\n this.navService?.setFocusedAndActiveItem(this, true, false);\n }\n\n private expandIndicatorClick(): void {\n if (this.disabled) {\n return;\n }\n if (this.expanded) {\n this.collapseWithEvent();\n } else {\n this.expandWithEvent();\n }\n }\n\n private selectorClick(event: MouseEvent): void {\n event.preventDefault();\n if (event.shiftKey) {\n this.selectionService?.selectMultipleItems(this);\n return;\n }\n if (this.selected) {\n this.selectionService?.deselectItem(this);\n } else {\n this.selectionService?.selectItem(this);\n }\n }\n\n private onFocus(): void {\n if (this.disabled) {\n return;\n }\n if (this.navService?.focusedItem !== this) {\n this.navService?.focusItem(this, false);\n this.wrapper?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n }\n if (this.tabbableEl && this.tabbableEl.length) {\n // set tabIndex = 0 to all tabbable elements\n // focus the first one\n this.tabbableEl.forEach((element: HTMLElement) => {\n element.tabIndex = 0;\n });\n this.focusedProgrammatically = true;\n this.tabbableEl[0].focus();\n return;\n }\n this.isFocused = true;\n }\n\n private onBlur(): void {\n this.isFocused = false;\n }\n\n private onFocusIn(ev: Event): void {\n ev?.stopPropagation();\n if (!this.disabled) {\n // clicking directly over tabbable element when the item is not focused\n if (!this.focusedProgrammatically) {\n this.tabbableEl?.forEach((element: HTMLElement) => {\n element.tabIndex = 0;\n });\n }\n this.removeAttribute('tabIndex');\n this.isFocused = true;\n this.focusedProgrammatically = false;\n }\n }\n\n private onFocusOut(ev: Event): void {\n ev?.stopPropagation();\n this.isFocused = false;\n this.tabbableEl?.forEach((element: HTMLElement) => {\n element.tabIndex = -1;\n });\n\n if (this.navService?.focusedItem === this) {\n // called twice when clicking on already focused item with link (pointerDown handler)\n this.setAttribute('tabindex', '0');\n }\n }\n\n private labelChange(): void {\n const firstElement = this.contentList[0];\n const tabbableSelector =\n 'a[href], button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])';\n\n this.tabbableEl = [\n ...firstElement.querySelectorAll<HTMLElement>(tabbableSelector),\n ];\n if (firstElement.matches(tabbableSelector)) {\n this.tabbableEl.splice(0, 0, firstElement);\n }\n\n if (this.tabbableEl && this.tabbableEl.length) {\n this.setAttribute('role', 'none');\n this.tabbableEl[0].setAttribute('role', 'treeitem');\n\n this.tabbableEl.forEach((element: HTMLElement) => {\n element.tabIndex = -1;\n });\n } else {\n this.setAttribute('role', 'treeitem');\n }\n }\n\n private handleChange(): void {\n this.hasChildren = !!this.directChildren.length;\n // there is no need to update nested children beacuse they're state is already up to date\n this.navService?.update_visible_cache(this, this.expanded, false);\n }\n\n /**\n * Returns a collection of child items.\n * If the parameter value is true returns all tree item's direct children,\n * otherwise - only the direct children.\n */\n @blazorSuppress()\n public getChildren(\n options: { flatten: boolean } = { flatten: false }\n ): IgcTreeItemComponent[] {\n if (options.flatten) {\n return this.allChildren;\n } else {\n return this.directChildren;\n }\n }\n\n /**\n * @private\n * Expands the tree item.\n */\n public async expandWithEvent() {\n if (this.expanded) {\n return;\n }\n const args = {\n detail: this,\n cancelable: true,\n };\n\n const allowed = this.tree?.emitEvent('igcItemExpanding', args);\n\n if (!allowed) {\n return;\n }\n\n if (this.tree?.singleBranchExpand) {\n const pathSet = new Set(this.path.splice(0, this.path.length - 1));\n this.tree.items.forEach((item: IgcTreeItemComponent) => {\n if (!pathSet.has(item)) {\n item.collapseWithEvent();\n }\n });\n }\n\n this.expanded = true;\n if (await this.toggleAnimation('open')) {\n this.tree?.emitEvent('igcItemExpanded', { detail: this });\n }\n }\n\n /**\n * @private\n * Collapses the tree item.\n */\n public async collapseWithEvent() {\n if (!this.expanded) {\n return;\n }\n const args = {\n detail: this,\n cancelable: true,\n };\n\n const allowed = this.tree?.emitEvent('igcItemCollapsing', args);\n\n if (!allowed) {\n return;\n }\n\n this.expanded = false;\n if (await this.toggleAnimation('close')) {\n this.tree?.emitEvent('igcItemCollapsed', { detail: this });\n }\n }\n\n /** Toggles tree item expansion state. */\n public toggle(): void {\n this.expanded = !this.expanded;\n }\n\n /** Expands the tree item. */\n public expand(): void {\n this.expanded = true;\n }\n\n /** Collapses the tree item. */\n public collapse(): void {\n this.expanded = false;\n }\n\n protected override render() {\n const ltr = this.tree ? isLTR(this.tree) : true;\n\n return html`\n <div id=\"wrapper\" part=\"wrapper ${partNameMap(this.parts)}\">\n <div\n style=\"width: calc(${this.level} * var(--igc-tree-indentation-size))\"\n part=\"indentation\"\n aria-hidden=\"true\"\n >\n <slot name=\"indentation\"></slot>\n </div>\n <div part=\"indicator\" aria-hidden=\"true\">\n ${this.loading\n ? html`\n <slot name=\"loading\">\n <igc-circular-progress indeterminate></igc-circular-progress>\n </slot>\n `\n : html`\n <slot name=\"indicator\" @click=${this.expandIndicatorClick}>\n ${this.hasChildren\n ? html`\n <igc-icon\n name=${this.expanded\n ? 'keyboard_arrow_down'\n : !ltr\n ? 'navigate_before'\n : 'keyboard_arrow_right'}\n collection=\"internal\"\n >\n </igc-icon>\n `\n : ''}\n </slot>\n `}\n </div>\n ${this.tree?.selection !== 'none'\n ? html`\n <div part=\"select\" aria-hidden=\"true\">\n <igc-checkbox\n @click=${this.selectorClick}\n .checked=${this.selected}\n .indeterminate=${this.indeterminate}\n .disabled=${this.disabled}\n tabindex=\"-1\"\n >\n </igc-checkbox>\n </div>\n `\n : ''}\n <div part=\"label\">\n <slot\n name=\"label\"\n @slotchange=${this.labelChange}\n @focusin=${this.onFocusIn}\n @focusout=${this.onFocusOut}\n >\n <span part=\"text\">${this.label}</span>\n </slot>\n </div>\n </div>\n <div role=\"group\" aria-hidden=${!this.expanded}>\n <slot @slotchange=${this.handleChange}></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-tree-item': IgcTreeItemComponent;\n }\n}\n"]}
@@ -74,7 +74,8 @@
74
74
  "name": "size",
75
75
  "description": "Determines the size of the component.",
76
76
  "type": "\"small\" | \"medium\" | \"large\"",
77
- "default": "\"small\""
77
+ "default": "\"small\"",
78
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
78
79
  }
79
80
  ],
80
81
  "properties": [
@@ -118,7 +119,8 @@
118
119
  "attribute": "size",
119
120
  "description": "Determines the size of the component.",
120
121
  "type": "\"small\" | \"medium\" | \"large\"",
121
- "default": "\"small\""
122
+ "default": "\"small\"",
123
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
122
124
  }
123
125
  ],
124
126
  "slots": [
@@ -262,7 +264,8 @@
262
264
  "name": "size",
263
265
  "description": "Determines the size of the component.",
264
266
  "type": "\"small\" | \"medium\" | \"large\"",
265
- "default": "\"medium\""
267
+ "default": "\"medium\"",
268
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
266
269
  }
267
270
  ],
268
271
  "properties": [
@@ -329,7 +332,8 @@
329
332
  "attribute": "size",
330
333
  "description": "Determines the size of the component.",
331
334
  "type": "\"small\" | \"medium\" | \"large\"",
332
- "default": "\"medium\""
335
+ "default": "\"medium\"",
336
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
333
337
  }
334
338
  ],
335
339
  "events": [
@@ -432,7 +436,8 @@
432
436
  "name": "size",
433
437
  "description": "Determines the size of the component.",
434
438
  "type": "\"small\" | \"medium\" | \"large\"",
435
- "default": "\"large\""
439
+ "default": "\"large\"",
440
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
436
441
  }
437
442
  ],
438
443
  "properties": [
@@ -518,7 +523,8 @@
518
523
  "attribute": "size",
519
524
  "description": "Determines the size of the component.",
520
525
  "type": "\"small\" | \"medium\" | \"large\"",
521
- "default": "\"large\""
526
+ "default": "\"large\"",
527
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
522
528
  }
523
529
  ],
524
530
  "cssParts": [
@@ -577,7 +583,8 @@
577
583
  "name": "size",
578
584
  "description": "Determines the size of the component.",
579
585
  "type": "\"small\" | \"medium\" | \"large\"",
580
- "default": "\"large\""
586
+ "default": "\"large\"",
587
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
581
588
  },
582
589
  {
583
590
  "name": "value",
@@ -689,7 +696,8 @@
689
696
  "attribute": "size",
690
697
  "description": "Determines the size of the component.",
691
698
  "type": "\"small\" | \"medium\" | \"large\"",
692
- "default": "\"large\""
699
+ "default": "\"large\"",
700
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
693
701
  },
694
702
  {
695
703
  "name": "value",
@@ -1696,7 +1704,8 @@
1696
1704
  "name": "size",
1697
1705
  "description": "Determines the size of the component.",
1698
1706
  "type": "\"small\" | \"medium\" | \"large\"",
1699
- "default": "\"medium\""
1707
+ "default": "\"medium\"",
1708
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
1700
1709
  }
1701
1710
  ],
1702
1711
  "properties": [
@@ -1749,7 +1758,8 @@
1749
1758
  "attribute": "size",
1750
1759
  "description": "Determines the size of the component.",
1751
1760
  "type": "\"small\" | \"medium\" | \"large\"",
1752
- "default": "\"medium\""
1761
+ "default": "\"medium\"",
1762
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
1753
1763
  }
1754
1764
  ],
1755
1765
  "events": [
@@ -2487,7 +2497,8 @@
2487
2497
  "name": "size",
2488
2498
  "description": "Determines the size of the component.",
2489
2499
  "type": "\"small\" | \"medium\" | \"large\"",
2490
- "default": "\"medium\""
2500
+ "default": "\"medium\"",
2501
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
2491
2502
  }
2492
2503
  ],
2493
2504
  "properties": [
@@ -2656,7 +2667,8 @@
2656
2667
  "attribute": "size",
2657
2668
  "description": "Determines the size of the component.",
2658
2669
  "type": "\"small\" | \"medium\" | \"large\"",
2659
- "default": "\"medium\""
2670
+ "default": "\"medium\"",
2671
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
2660
2672
  }
2661
2673
  ],
2662
2674
  "events": [
@@ -3079,7 +3091,8 @@
3079
3091
  "name": "size",
3080
3092
  "description": "Determines the size of the component.",
3081
3093
  "type": "\"small\" | \"medium\" | \"large\"",
3082
- "default": "\"large\""
3094
+ "default": "\"large\"",
3095
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3083
3096
  }
3084
3097
  ],
3085
3098
  "properties": [
@@ -3156,7 +3169,8 @@
3156
3169
  "attribute": "size",
3157
3170
  "description": "Determines the size of the component.",
3158
3171
  "type": "\"small\" | \"medium\" | \"large\"",
3159
- "default": "\"large\""
3172
+ "default": "\"large\"",
3173
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3160
3174
  }
3161
3175
  ],
3162
3176
  "events": [
@@ -3394,7 +3408,8 @@
3394
3408
  "name": "size",
3395
3409
  "description": "Determines the size of the component.",
3396
3410
  "type": "\"small\" | \"medium\" | \"large\"",
3397
- "default": "\"medium\""
3411
+ "default": "\"medium\"",
3412
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3398
3413
  }
3399
3414
  ],
3400
3415
  "properties": [
@@ -3434,7 +3449,8 @@
3434
3449
  "attribute": "size",
3435
3450
  "description": "Determines the size of the component.",
3436
3451
  "type": "\"small\" | \"medium\" | \"large\"",
3437
- "default": "\"medium\""
3452
+ "default": "\"medium\"",
3453
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3438
3454
  }
3439
3455
  ]
3440
3456
  },
@@ -3571,7 +3587,8 @@
3571
3587
  "name": "size",
3572
3588
  "description": "Determines the size of the component.",
3573
3589
  "type": "\"small\" | \"medium\" | \"large\"",
3574
- "default": "\"medium\""
3590
+ "default": "\"medium\"",
3591
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3575
3592
  }
3576
3593
  ],
3577
3594
  "properties": [
@@ -3759,7 +3776,8 @@
3759
3776
  "attribute": "size",
3760
3777
  "description": "Determines the size of the component.",
3761
3778
  "type": "\"small\" | \"medium\" | \"large\"",
3762
- "default": "\"medium\""
3779
+ "default": "\"medium\"",
3780
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3763
3781
  }
3764
3782
  ],
3765
3783
  "events": [
@@ -3918,7 +3936,8 @@
3918
3936
  "name": "size",
3919
3937
  "description": "Determines the size of the component.",
3920
3938
  "type": "\"small\" | \"medium\" | \"large\"",
3921
- "default": "\"large\""
3939
+ "default": "\"large\"",
3940
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3922
3941
  }
3923
3942
  ],
3924
3943
  "properties": [
@@ -3937,7 +3956,8 @@
3937
3956
  "attribute": "size",
3938
3957
  "description": "Determines the size of the component.",
3939
3958
  "type": "\"small\" | \"medium\" | \"large\"",
3940
- "default": "\"large\""
3959
+ "default": "\"large\"",
3960
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
3941
3961
  }
3942
3962
  ],
3943
3963
  "slots": [
@@ -4028,7 +4048,8 @@
4028
4048
  "name": "size",
4029
4049
  "description": "Determines the size of the component.",
4030
4050
  "type": "\"small\" | \"medium\" | \"large\"",
4031
- "default": "\"medium\""
4051
+ "default": "\"medium\"",
4052
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
4032
4053
  }
4033
4054
  ],
4034
4055
  "properties": [
@@ -4153,7 +4174,8 @@
4153
4174
  "attribute": "size",
4154
4175
  "description": "Determines the size of the component.",
4155
4176
  "type": "\"small\" | \"medium\" | \"large\"",
4156
- "default": "\"medium\""
4177
+ "default": "\"medium\"",
4178
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
4157
4179
  }
4158
4180
  ],
4159
4181
  "events": [
@@ -5117,7 +5139,8 @@
5117
5139
  "name": "size",
5118
5140
  "description": "Determines the size of the component.",
5119
5141
  "type": "\"small\" | \"medium\" | \"large\"",
5120
- "default": "\"large\""
5142
+ "default": "\"large\"",
5143
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
5121
5144
  }
5122
5145
  ],
5123
5146
  "properties": [
@@ -5238,7 +5261,8 @@
5238
5261
  "attribute": "size",
5239
5262
  "description": "Determines the size of the component.",
5240
5263
  "type": "\"small\" | \"medium\" | \"large\"",
5241
- "default": "\"large\""
5264
+ "default": "\"large\"",
5265
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
5242
5266
  }
5243
5267
  ],
5244
5268
  "events": [
@@ -5580,7 +5604,8 @@
5580
5604
  "name": "size",
5581
5605
  "description": "Determines the size of the component.",
5582
5606
  "type": "\"small\" | \"medium\" | \"large\"",
5583
- "default": "\"medium\""
5607
+ "default": "\"medium\"",
5608
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
5584
5609
  }
5585
5610
  ],
5586
5611
  "properties": [
@@ -5720,7 +5745,8 @@
5720
5745
  "attribute": "size",
5721
5746
  "description": "Determines the size of the component.",
5722
5747
  "type": "\"small\" | \"medium\" | \"large\"",
5723
- "default": "\"medium\""
5748
+ "default": "\"medium\"",
5749
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
5724
5750
  }
5725
5751
  ],
5726
5752
  "events": [
@@ -7346,7 +7372,8 @@
7346
7372
  "name": "size",
7347
7373
  "description": "Determines the size of the component.",
7348
7374
  "type": "\"small\" | \"medium\" | \"large\"",
7349
- "default": "\"large\""
7375
+ "default": "\"large\"",
7376
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
7350
7377
  }
7351
7378
  ],
7352
7379
  "properties": [
@@ -7374,7 +7401,8 @@
7374
7401
  "attribute": "size",
7375
7402
  "description": "Determines the size of the component.",
7376
7403
  "type": "\"small\" | \"medium\" | \"large\"",
7377
- "default": "\"large\""
7404
+ "default": "\"large\"",
7405
+ "deprecatedMessage": "since v4.5.0. Use the `--ig-size` CSS custom property instead."
7378
7406
  }
7379
7407
  ],
7380
7408
  "events": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "igniteui-webcomponents",
3
- "version": "4.4.0",
3
+ "version": "4.5.0-beta.1",
4
4
  "description": "Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.",
5
5
  "author": "Infragistics",
6
6
  "license": "SEE LICENSE IN LICENSE",
@@ -59,8 +59,8 @@
59
59
  "tree"
60
60
  ],
61
61
  "dependencies": {
62
- "@floating-ui/dom": "^1.5.1",
63
- "@lit-labs/virtualizer": "^2.0.6",
62
+ "@floating-ui/dom": "^1.5.2",
63
+ "@lit-labs/virtualizer": "^2.0.7",
64
64
  "lit": "^2.8.0"
65
65
  }
66
66
  }