igniteui-webcomponents 2.2.0-beta.1 → 3.1.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 (231) hide show
  1. package/CHANGELOG.md +20 -12
  2. package/components/avatar/avatar.js +2 -2
  3. package/components/avatar/avatar.js.map +1 -1
  4. package/components/badge/badge.js +3 -3
  5. package/components/badge/badge.js.map +1 -1
  6. package/components/button/button-base.js +1 -1
  7. package/components/button/button-base.js.map +1 -1
  8. package/components/button/button.js +6 -6
  9. package/components/button/button.js.map +1 -1
  10. package/components/button/icon-button.d.ts +1 -1
  11. package/components/button/icon-button.js +9 -8
  12. package/components/button/icon-button.js.map +1 -1
  13. package/components/button/themes/button/light/button.base.css.js +1 -1
  14. package/components/button/themes/button/light/button.base.css.js.map +1 -1
  15. package/components/button/themes/button/light/button.bootstrap.css.js +1 -1
  16. package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
  17. package/components/button/themes/button/light/button.fluent.css.js +1 -1
  18. package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
  19. package/components/button/themes/button/light/button.indigo.css.js +1 -1
  20. package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
  21. package/components/button/themes/button/light/button.material.css.js +1 -1
  22. package/components/button/themes/button/light/button.material.css.js.map +1 -1
  23. package/components/button/themes/icon-button/light/icon-button.base.css.js +1 -1
  24. package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
  25. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +1 -1
  26. package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
  27. package/components/button/themes/icon-button/light/icon-button.fluent.css.js +1 -1
  28. package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
  29. package/components/button/themes/icon-button/light/icon-button.indigo.css.js +1 -1
  30. package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
  31. package/components/calendar/calendar.d.ts +8 -8
  32. package/components/calendar/calendar.js +16 -16
  33. package/components/calendar/calendar.js.map +1 -1
  34. package/components/calendar/common/calendar-base.d.ts +1 -1
  35. package/components/calendar/common/calendar-base.js +5 -3
  36. package/components/calendar/common/calendar-base.js.map +1 -1
  37. package/components/calendar/common/utils.d.ts +1 -1
  38. package/components/calendar/common/utils.js.map +1 -1
  39. package/components/calendar/days-view/days-view.d.ts +5 -5
  40. package/components/calendar/days-view/days-view.js +13 -11
  41. package/components/calendar/days-view/days-view.js.map +1 -1
  42. package/components/calendar/months-view/months-view.d.ts +3 -3
  43. package/components/calendar/months-view/months-view.js +12 -10
  44. package/components/calendar/months-view/months-view.js.map +1 -1
  45. package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js +1 -1
  46. package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js.map +1 -1
  47. package/components/calendar/themes/calendar.base.css.js +1 -1
  48. package/components/calendar/themes/calendar.base.css.js.map +1 -1
  49. package/components/calendar/themes/days-view.base.css.js +1 -1
  50. package/components/calendar/themes/days-view.base.css.js.map +1 -1
  51. package/components/calendar/themes/fluent/calendar.fluent.css.js +1 -1
  52. package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
  53. package/components/calendar/themes/fluent/days-view.fluent.css.js +1 -1
  54. package/components/calendar/themes/fluent/days-view.fluent.css.js.map +1 -1
  55. package/components/calendar/years-view/years-view.d.ts +3 -3
  56. package/components/calendar/years-view/years-view.js +11 -9
  57. package/components/calendar/years-view/years-view.js.map +1 -1
  58. package/components/card/card.actions.js +3 -3
  59. package/components/card/card.actions.js.map +1 -1
  60. package/components/card/card.content.js +3 -3
  61. package/components/card/card.content.js.map +1 -1
  62. package/components/card/card.header.js +4 -4
  63. package/components/card/card.header.js.map +1 -1
  64. package/components/card/card.js +4 -4
  65. package/components/card/card.js.map +1 -1
  66. package/components/card/card.media.js +1 -1
  67. package/components/card/card.media.js.map +1 -1
  68. package/components/checkbox/checkbox-base.js +2 -1
  69. package/components/checkbox/checkbox-base.js.map +1 -1
  70. package/components/checkbox/checkbox.js +6 -7
  71. package/components/checkbox/checkbox.js.map +1 -1
  72. package/components/checkbox/switch.js +6 -7
  73. package/components/checkbox/switch.js.map +1 -1
  74. package/components/checkbox/themes/light/checkbox.fluent.css.js +1 -1
  75. package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
  76. package/components/checkbox/themes/light/checkbox.material.css.js +1 -1
  77. package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
  78. package/components/checkbox/themes/light/switch.bootstrap.css.js +1 -1
  79. package/components/checkbox/themes/light/switch.bootstrap.css.js.map +1 -1
  80. package/components/checkbox/themes/light/switch.fluent.css.js +1 -1
  81. package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
  82. package/components/checkbox/themes/light/switch.indigo.css.js +1 -1
  83. package/components/checkbox/themes/light/switch.indigo.css.js.map +1 -1
  84. package/components/chip/chip.d.ts +1 -0
  85. package/components/chip/chip.js +20 -9
  86. package/components/chip/chip.js.map +1 -1
  87. package/components/chip/themes/chip.base.css.js +1 -1
  88. package/components/chip/themes/chip.base.css.js.map +1 -1
  89. package/components/chip/themes/chip.bootstrap.css.js +1 -1
  90. package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
  91. package/components/chip/themes/chip.fluent.css.js +1 -1
  92. package/components/chip/themes/chip.fluent.css.js.map +1 -1
  93. package/components/chip/themes/chip.indigo.css.js +1 -1
  94. package/components/chip/themes/chip.indigo.css.js.map +1 -1
  95. package/components/chip/themes/chip.material.css.js +1 -1
  96. package/components/chip/themes/chip.material.css.js.map +1 -1
  97. package/components/common/definitions/defineAllComponents.js +45 -45
  98. package/components/common/definitions/defineAllComponents.js.map +1 -1
  99. package/components/dropdown/dropdown-group.d.ts +4 -4
  100. package/components/dropdown/dropdown-group.js +11 -11
  101. package/components/dropdown/dropdown-group.js.map +1 -1
  102. package/components/dropdown/dropdown-header.d.ts +3 -3
  103. package/components/dropdown/dropdown-header.js +9 -9
  104. package/components/dropdown/dropdown-header.js.map +1 -1
  105. package/components/dropdown/dropdown-item.d.ts +2 -2
  106. package/components/dropdown/dropdown-item.js +18 -18
  107. package/components/dropdown/dropdown-item.js.map +1 -1
  108. package/components/dropdown/dropdown.d.ts +16 -16
  109. package/components/dropdown/dropdown.js +51 -56
  110. package/components/dropdown/dropdown.js.map +1 -1
  111. package/components/form/form.d.ts +2 -2
  112. package/components/form/form.js +3 -2
  113. package/components/form/form.js.map +1 -1
  114. package/components/icon/icon.d.ts +1 -1
  115. package/components/icon/icon.js +3 -2
  116. package/components/icon/icon.js.map +1 -1
  117. package/components/icon/icon.registry.js +2 -0
  118. package/components/icon/icon.registry.js.map +1 -1
  119. package/components/input/input-base.d.ts +2 -1
  120. package/components/input/input-base.js +11 -6
  121. package/components/input/input-base.js.map +1 -1
  122. package/components/input/input.d.ts +1 -1
  123. package/components/input/input.js +6 -5
  124. package/components/input/input.js.map +1 -1
  125. package/components/input/themes/light/input.bootstrap.css.js +1 -1
  126. package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
  127. package/components/input/themes/light/input.fluent.css.js +1 -1
  128. package/components/input/themes/light/input.fluent.css.js.map +1 -1
  129. package/components/input/themes/light/input.indigo.css.js +1 -1
  130. package/components/input/themes/light/input.indigo.css.js.map +1 -1
  131. package/components/input/themes/light/input.material.css.js +1 -1
  132. package/components/input/themes/light/input.material.css.js.map +1 -1
  133. package/components/list/list-header.js +3 -3
  134. package/components/list/list-header.js.map +1 -1
  135. package/components/list/list-item.js +5 -5
  136. package/components/list/list-item.js.map +1 -1
  137. package/components/list/list.d.ts +1 -1
  138. package/components/list/list.js +4 -4
  139. package/components/list/list.js.map +1 -1
  140. package/components/nav-drawer/nav-drawer-header-item.js +3 -3
  141. package/components/nav-drawer/nav-drawer-header-item.js.map +1 -1
  142. package/components/nav-drawer/nav-drawer-item.js +4 -4
  143. package/components/nav-drawer/nav-drawer-item.js.map +1 -1
  144. package/components/nav-drawer/nav-drawer.d.ts +1 -1
  145. package/components/nav-drawer/nav-drawer.js +14 -11
  146. package/components/nav-drawer/nav-drawer.js.map +1 -1
  147. package/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.js +1 -1
  148. package/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.js.map +1 -1
  149. package/components/nav-drawer/styles/nav-drawer-item.base.css.js +1 -1
  150. package/components/nav-drawer/styles/nav-drawer-item.base.css.js.map +1 -1
  151. package/components/nav-drawer/styles/nav-drawer.base.css.js +1 -1
  152. package/components/nav-drawer/styles/nav-drawer.base.css.js.map +1 -1
  153. package/components/navbar/navbar.js +4 -4
  154. package/components/navbar/navbar.js.map +1 -1
  155. package/components/progress/base.js +2 -2
  156. package/components/progress/base.js.map +1 -1
  157. package/components/progress/circular-progress.d.ts +2 -2
  158. package/components/progress/circular-progress.js +6 -6
  159. package/components/progress/circular-progress.js.map +1 -1
  160. package/components/progress/linear-progress.d.ts +1 -1
  161. package/components/progress/linear-progress.js +7 -7
  162. package/components/progress/linear-progress.js.map +1 -1
  163. package/components/progress/themes/circular/circular.progress.base.css.js +1 -1
  164. package/components/progress/themes/circular/circular.progress.base.css.js.map +1 -1
  165. package/components/progress/themes/circular/circular.progress.bootstrap.css.js +1 -1
  166. package/components/progress/themes/circular/circular.progress.bootstrap.css.js.map +1 -1
  167. package/components/radio/radio.js +9 -9
  168. package/components/radio/radio.js.map +1 -1
  169. package/components/radio/themes/light/radio.base.css.js +1 -1
  170. package/components/radio/themes/light/radio.base.css.js.map +1 -1
  171. package/components/radio/themes/light/radio.bootstrap.css.js +1 -1
  172. package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
  173. package/components/radio/themes/light/radio.fluent.css.js +1 -1
  174. package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
  175. package/components/radio/themes/light/radio.indigo.css.js +1 -1
  176. package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
  177. package/components/radio-group/radio-group.js +1 -1
  178. package/components/radio-group/radio-group.js.map +1 -1
  179. package/components/rating/rating.d.ts +2 -2
  180. package/components/rating/rating.js +9 -9
  181. package/components/rating/rating.js.map +1 -1
  182. package/components/ripple/ripple.js +1 -1
  183. package/components/ripple/ripple.js.map +1 -1
  184. package/components/slider/range-slider.d.ts +3 -3
  185. package/components/slider/range-slider.js +2 -2
  186. package/components/slider/range-slider.js.map +1 -1
  187. package/components/slider/slider-base.js +8 -7
  188. package/components/slider/slider-base.js.map +1 -1
  189. package/components/slider/slider.d.ts +3 -3
  190. package/components/slider/slider.js +2 -2
  191. package/components/slider/slider.js.map +1 -1
  192. package/components/slider/themes/light/slider.base.css.js +1 -1
  193. package/components/slider/themes/light/slider.base.css.js.map +1 -1
  194. package/components/snackbar/snackbar.d.ts +2 -0
  195. package/components/snackbar/snackbar.js +8 -5
  196. package/components/snackbar/snackbar.js.map +1 -1
  197. package/components/toast/toast.js +5 -5
  198. package/components/toast/toast.js.map +1 -1
  199. package/components/toggle/toggle.controller.d.ts +3 -3
  200. package/components/toggle/toggle.controller.js +1 -1
  201. package/components/toggle/toggle.controller.js.map +1 -1
  202. package/components/toggle/toggle.directive.d.ts +1 -1
  203. package/components/toggle/toggle.directive.js.map +1 -1
  204. package/components/toggle/{utilities.d.ts → types.d.ts} +0 -0
  205. package/components/toggle/types.js +2 -0
  206. package/components/toggle/types.js.map +1 -0
  207. package/custom-elements.json +3 -3
  208. package/index.d.ts +53 -52
  209. package/index.js +51 -51
  210. package/index.js.map +1 -1
  211. package/package.json +1 -1
  212. package/themes/dark/bootstrap.css +1 -1
  213. package/themes/dark/fluent.css +1 -1
  214. package/themes/light/fluent.css +1 -1
  215. package/theming/config.d.ts +1 -1
  216. package/theming/config.js +2 -2
  217. package/theming/config.js.map +1 -1
  218. package/theming/index.d.ts +3 -3
  219. package/theming/index.js +3 -3
  220. package/theming/index.js.map +1 -1
  221. package/theming/{theming-controlller.d.ts → theming-controller.d.ts} +1 -1
  222. package/theming/{theming-controlller.js → theming-controller.js} +3 -3
  223. package/theming/theming-controller.js.map +1 -0
  224. package/theming/theming-decorator.js +1 -1
  225. package/theming/theming-decorator.js.map +1 -1
  226. package/theming/theming-event.d.ts +1 -1
  227. package/theming/theming-event.js.map +1 -1
  228. package/vscode-html-custom-data.json +8 -5
  229. package/components/toggle/utilities.js +0 -2
  230. package/components/toggle/utilities.js.map +0 -1
  231. package/theming/theming-controlller.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"nav-drawer-item.js","sourceRoot":"","sources":["../../../src/components/nav-drawer/nav-drawer-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAC;AAe3D,IAAqB,yBAAyB,GAA9C,MAAqB,yBAA0B,SAAQ,UAAU;IAAjE;;QAMS,aAAQ,GAAG,KAAK,CAAC;QAIjB,WAAM,GAAG,KAAK,CAAC;IAkCxB,CAAC;IA1BiB,iBAAiB;;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,MAAA,IAAI,CAAC,UAAU,0CAAE,gBAAgB,CAAC,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YACpD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QACvC,CAAC,CAAC,CAAC;IACL,CAAC;IAES,gBAAgB,CAAC,IAAY;QACrC,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,IAAI,EAAE,IAAI,CAAC,WAAW,GAAG,CAAC;SAC3B,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;mBACI,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;;;;;;;;KAQxD,CAAC;IACJ,CAAC;CACF,CAAA;AA3CwB,iCAAO,GAAG,qBAAsB,CAAA;AAChC,gCAAM,GAAG,MAAO,CAAA;AAIvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DACnB;AAIxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yDACrB;AAGtB;IADC,KAAK,EAAE;8DACqB;AAG7B;IADC,qBAAqB,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;wDACR;AAhBhB,yBAAyB;IAD7C,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;GACE,yBAAyB,CA4C7C;eA5CoB,yBAAyB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements, state } from 'lit/decorators.js';\nimport { themes } from '../../theming';\nimport { partNameMap } from '../common/util';\nimport { styles as indigo } from './styles/indigo/nav-drawer-item.indigo.css';\nimport { styles } from './styles/nav-drawer-item.base.css';\n\n/**\n * Represents a navigation drawer item.\n *\n * @element igc-nav-drawer-item\n *\n * @slot content - The content slot for the drawer item.\n * @slot icon - The slot for the icon of the drawer item.\n *\n * @csspart base - The base wrapper of the drawer item.\n * @csspart icon - The icon container.\n * @csspart content - The content container.\n */\n@themes({ indigo })\nexport default class IgcNavDrawerItemComponent extends LitElement {\n public static readonly tagName = 'igc-nav-drawer-item';\n public static override styles = styles;\n\n /** Determines whether the drawer is disabled. */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /** Determines whether the drawer is active. */\n @property({ type: Boolean, reflect: true })\n public active = false;\n\n @state()\n private _textLength!: number;\n\n @queryAssignedElements({ slot: 'content' })\n private _text!: Array<HTMLElement>;\n\n public override connectedCallback() {\n super.connectedCallback();\n this.shadowRoot?.addEventListener('slotchange', (_) => {\n this._textLength = this._text.length;\n });\n }\n\n protected resolvePartNames(base: string) {\n return {\n [base]: true,\n mini: this._textLength < 1,\n };\n }\n\n protected override render() {\n return html`\n <div part=\"${partNameMap(this.resolvePartNames('base'))}\">\n <span part=\"icon\">\n <slot name=\"icon\"></slot>\n </span>\n <span part=\"content\">\n <slot name=\"content\"></slot>\n </span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-nav-drawer-item': IgcNavDrawerItemComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"nav-drawer-item.js","sourceRoot":"","sources":["../../../src/components/nav-drawer/nav-drawer-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+CAA+C,CAAC;AACjF,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAe9D,IAAqB,yBAAyB,GAA9C,MAAqB,yBAA0B,SAAQ,UAAU;IAAjE;;QAMS,aAAQ,GAAG,KAAK,CAAC;QAIjB,WAAM,GAAG,KAAK,CAAC;IAkCxB,CAAC;IA1BiB,iBAAiB;;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,MAAA,IAAI,CAAC,UAAU,0CAAE,gBAAgB,CAAC,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YACpD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QACvC,CAAC,CAAC,CAAC;IACL,CAAC;IAES,gBAAgB,CAAC,IAAY;QACrC,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,IAAI,EAAE,IAAI,CAAC,WAAW,GAAG,CAAC;SAC3B,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;mBACI,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;;;;;;;;KAQxD,CAAC;IACJ,CAAC;CACF,CAAA;AA3CwB,iCAAO,GAAG,qBAAsB,CAAA;AAChC,gCAAM,GAAG,MAAO,CAAA;AAIvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DACnB;AAIxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yDACrB;AAGtB;IADC,KAAK,EAAE;8DACqB;AAG7B;IADC,qBAAqB,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;wDACR;AAhBhB,yBAAyB;IAD7C,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;GACE,yBAAyB,CA4C7C;eA5CoB,yBAAyB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements, state } from 'lit/decorators.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { partNameMap } from '../common/util.js';\nimport { styles as indigo } from './styles/indigo/nav-drawer-item.indigo.css.js';\nimport { styles } from './styles/nav-drawer-item.base.css.js';\n\n/**\n * Represents a navigation drawer item.\n *\n * @element igc-nav-drawer-item\n *\n * @slot content - The content slot for the drawer item.\n * @slot icon - The slot for the icon of the drawer item.\n *\n * @csspart base - The base wrapper of the drawer item.\n * @csspart icon - The icon container.\n * @csspart content - The content container.\n */\n@themes({ indigo })\nexport default class IgcNavDrawerItemComponent extends LitElement {\n public static readonly tagName = 'igc-nav-drawer-item';\n public static override styles = styles;\n\n /** Determines whether the drawer is disabled. */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /** Determines whether the drawer is active. */\n @property({ type: Boolean, reflect: true })\n public active = false;\n\n @state()\n private _textLength!: number;\n\n @queryAssignedElements({ slot: 'content' })\n private _text!: Array<HTMLElement>;\n\n public override connectedCallback() {\n super.connectedCallback();\n this.shadowRoot?.addEventListener('slotchange', (_) => {\n this._textLength = this._text.length;\n });\n }\n\n protected resolvePartNames(base: string) {\n return {\n [base]: true,\n mini: this._textLength < 1,\n };\n }\n\n protected override render() {\n return html`\n <div part=\"${partNameMap(this.resolvePartNames('base'))}\">\n <span part=\"icon\">\n <slot name=\"icon\"></slot>\n </span>\n <span part=\"content\">\n <slot name=\"content\"></slot>\n </span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-nav-drawer-item': IgcNavDrawerItemComponent;\n }\n}\n"]}
@@ -16,7 +16,7 @@ export default class IgcNavDrawerComponent extends LitElement {
16
16
  static readonly tagName = "igc-nav-drawer";
17
17
  static styles: import("lit").CSSResult;
18
18
  /** The position of the drawer. */
19
- position: 'start' | 'end' | 'top' | 'bottom';
19
+ position: 'start' | 'end' | 'top' | 'bottom' | 'relative';
20
20
  /** Determines whether the drawer is opened. */
21
21
  open: boolean;
22
22
  /** Opens the drawer. */
@@ -6,10 +6,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { html, LitElement } from 'lit';
8
8
  import { property } from 'lit/decorators.js';
9
- import { themes } from '../../theming';
10
- import { partNameMap } from '../common/util';
11
- import { styles as indigo } from './styles/indigo/nav-drawer.indigo.css';
12
- import { styles } from './styles/nav-drawer.base.css';
9
+ import { themes } from '../../theming/theming-decorator.js';
10
+ import { partNameMap } from '../common/util.js';
11
+ import { styles as indigo } from './styles/indigo/nav-drawer.indigo.css.js';
12
+ import { styles } from './styles/nav-drawer.base.css.js';
13
13
  let IgcNavDrawerComponent = class IgcNavDrawerComponent extends LitElement {
14
14
  constructor() {
15
15
  super(...arguments);
@@ -45,15 +45,18 @@ let IgcNavDrawerComponent = class IgcNavDrawerComponent extends LitElement {
45
45
  };
46
46
  }
47
47
  render() {
48
- return html ` <div part="base">
49
- <div part="main">
50
- <slot></slot>
51
- </div>
48
+ return html `
49
+ <div part="overlay" @click=${this.hide}></div>
50
+ <div part="base">
51
+ <div part="main">
52
+ <slot></slot>
53
+ </div>
52
54
 
53
- <div part="${partNameMap(this.resolvePartNames('mini'))}">
54
- <slot name="mini"></slot>
55
+ <div part="${partNameMap(this.resolvePartNames('mini'))}">
56
+ <slot name="mini"></slot>
57
+ </div>
55
58
  </div>
56
- </div>`;
59
+ `;
57
60
  }
58
61
  };
59
62
  IgcNavDrawerComponent.tagName = 'igc-nav-drawer';
@@ -1 +1 @@
1
- {"version":3,"file":"nav-drawer.js","sourceRoot":"","sources":["../../../src/components/nav-drawer/nav-drawer.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAgBtD,IAAqB,qBAAqB,GAA1C,MAAqB,qBAAsB,SAAQ,UAAU;IAA7D;;QAMS,aAAQ,GAAuC,OAAO,CAAC;QAIvD,SAAI,GAAG,KAAK,CAAC;IAkDtB,CAAC;IA/CQ,IAAI;QACT,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,OAAO;SACR;QAED,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAGM,IAAI;QACT,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,OAAO;SACR;QAED,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAGM,MAAM;QACX,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;aAAM;YACL,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;IACH,CAAC;IAEO,gBAAgB,CAAC,IAAY;QACnC,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACxD,MAAM,WAAW,GAAG,IAAI,KAAK,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;QAE9D,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,MAAM,EAAE,CAAC,WAAW;SACrB,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;mBAKI,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;;;WAGlD,CAAC;IACV,CAAC;CACF,CAAA;AA3DwB,6BAAO,GAAG,gBAAiB,CAAA;AAC3B,4BAAM,GAAG,MAAO,CAAA;AAIvC;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACkC;AAI9D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACvB;AAVD,qBAAqB;IADzC,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;GACE,qBAAqB,CA4DzC;eA5DoB,qBAAqB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { themes } from '../../theming';\nimport { partNameMap } from '../common/util';\nimport { styles as indigo } from './styles/indigo/nav-drawer.indigo.css';\nimport { styles } from './styles/nav-drawer.base.css';\n\n/**\n * Represents a side navigation container that provides\n * quick access between views.\n *\n * @element igc-nav-drawer\n *\n * @slot - The default slot for the drawer.\n * @slot mini - The slot for the mini variant of the drawer.\n *\n * @csspart base - The base wrapper of the navigation drawer.\n * @csspart main - The main container.\n * @csspart mini - The mini container.\n */\n@themes({ indigo })\nexport default class IgcNavDrawerComponent extends LitElement {\n public static readonly tagName = 'igc-nav-drawer';\n public static override styles = styles;\n\n /** The position of the drawer. */\n @property({ reflect: true })\n public position: 'start' | 'end' | 'top' | 'bottom' = 'start';\n\n /** Determines whether the drawer is opened. */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /** Opens the drawer. */\n public show() {\n if (this.open) {\n return;\n }\n\n this.open = true;\n }\n\n /** Closes the drawer. */\n public hide() {\n if (!this.open) {\n return;\n }\n\n this.open = false;\n }\n\n /** Toggles the open state of the drawer. */\n public toggle() {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n private resolvePartNames(base: string) {\n const mini = document.querySelector('div[slot=\"mini\"]');\n const hasChildren = mini !== null && mini.children.length > 0;\n\n return {\n [base]: true,\n hidden: !hasChildren,\n };\n }\n\n protected override render() {\n return html` <div part=\"base\">\n <div part=\"main\">\n <slot></slot>\n </div>\n\n <div part=\"${partNameMap(this.resolvePartNames('mini'))}\">\n <slot name=\"mini\"></slot>\n </div>\n </div>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-nav-drawer': IgcNavDrawerComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"nav-drawer.js","sourceRoot":"","sources":["../../../src/components/nav-drawer/nav-drawer.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAgBzD,IAAqB,qBAAqB,GAA1C,MAAqB,qBAAsB,SAAQ,UAAU;IAA7D;;QAMS,aAAQ,GAAoD,OAAO,CAAC;QAIpE,SAAI,GAAG,KAAK,CAAC;IAqDtB,CAAC;IAlDQ,IAAI;QACT,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,OAAO;SACR;QAED,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAGM,IAAI;QACT,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,OAAO;SACR;QAED,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAGM,MAAM;QACX,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;aAAM;YACL,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;IACH,CAAC;IAEO,gBAAgB,CAAC,IAAY;QACnC,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACxD,MAAM,WAAW,GAAG,IAAI,KAAK,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;QAE9D,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,MAAM,EAAE,CAAC,WAAW;SACrB,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;mCACoB,IAAI,CAAC,IAAI;;;;;;qBAMvB,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;;;;KAI1D,CAAC;IACJ,CAAC;CACF,CAAA;AA9DwB,6BAAO,GAAG,gBAAiB,CAAA;AAC3B,4BAAM,GAAG,MAAO,CAAA;AAIvC;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDAC+C;AAI3E;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACvB;AAVD,qBAAqB;IADzC,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;GACE,qBAAqB,CA+DzC;eA/DoB,qBAAqB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { partNameMap } from '../common/util.js';\nimport { styles as indigo } from './styles/indigo/nav-drawer.indigo.css.js';\nimport { styles } from './styles/nav-drawer.base.css.js';\n\n/**\n * Represents a side navigation container that provides\n * quick access between views.\n *\n * @element igc-nav-drawer\n *\n * @slot - The default slot for the drawer.\n * @slot mini - The slot for the mini variant of the drawer.\n *\n * @csspart base - The base wrapper of the navigation drawer.\n * @csspart main - The main container.\n * @csspart mini - The mini container.\n */\n@themes({ indigo })\nexport default class IgcNavDrawerComponent extends LitElement {\n public static readonly tagName = 'igc-nav-drawer';\n public static override styles = styles;\n\n /** The position of the drawer. */\n @property({ reflect: true })\n public position: 'start' | 'end' | 'top' | 'bottom' | 'relative' = 'start';\n\n /** Determines whether the drawer is opened. */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /** Opens the drawer. */\n public show() {\n if (this.open) {\n return;\n }\n\n this.open = true;\n }\n\n /** Closes the drawer. */\n public hide() {\n if (!this.open) {\n return;\n }\n\n this.open = false;\n }\n\n /** Toggles the open state of the drawer. */\n public toggle() {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n private resolvePartNames(base: string) {\n const mini = document.querySelector('div[slot=\"mini\"]');\n const hasChildren = mini !== null && mini.children.length > 0;\n\n return {\n [base]: true,\n hidden: !hasChildren,\n };\n }\n\n protected override render() {\n return html`\n <div part=\"overlay\" @click=${this.hide}></div>\n <div part=\"base\">\n <div part=\"main\">\n <slot></slot>\n </div>\n\n <div part=\"${partNameMap(this.resolvePartNames('mini'))}\">\n <slot name=\"mini\"></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-nav-drawer': IgcNavDrawerComponent;\n }\n}\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host [part~=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*1.5rem,1.5rem);color:hsla(var(--igc-gray-300), 0.8);padding:.25rem;margin:.9375rem .5rem !important}:host [part~=base]:hover,:host [part~=base]:focus-within{background:transparent;color:hsla(var(--igc-gray-100), var(--igc-gray-a))}:host [part=content]{-webkit-margin-start:1.5rem;margin-inline-start:1.5rem;-webkit-padding-start:.5rem;padding-inline-start:.5rem}:host([active]) [part~=base]{background:hsla(var(--igc-gray-600), 0.8);color:hsla(var(--igc-gray-50), var(--igc-gray-a))}`;
2
+ export const styles = css `:host [part~=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*1.5rem,1.5rem);color:hsla(var(--igc-gray-300), 0.8);padding:.25rem;margin:.9375rem .5rem !important}:host [part~=base]:hover,:host [part~=base]:focus-within{background:rgba(0,0,0,0);color:hsla(var(--igc-gray-100), var(--igc-gray-a))}:host [part=content]{-webkit-margin-start:1.5rem;margin-inline-start:1.5rem;-webkit-padding-start:.5rem;padding-inline-start:.5rem}:host([active]) [part~=base]{background:hsla(var(--igc-gray-600), 0.8);color:hsla(var(--igc-gray-50), var(--igc-gray-a))}`;
3
3
  //# sourceMappingURL=nav-drawer-item.indigo.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"nav-drawer-item.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0iBAA0iB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host [part~=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*1.5rem,1.5rem);color:hsla(var(--igc-gray-300), 0.8);padding:.25rem;margin:.9375rem .5rem !important}:host [part~=base]:hover,:host [part~=base]:focus-within{background:transparent;color:hsla(var(--igc-gray-100), var(--igc-gray-a))}:host [part=content]{-webkit-margin-start:1.5rem;margin-inline-start:1.5rem;-webkit-padding-start:.5rem;padding-inline-start:.5rem}:host([active]) [part~=base]{background:hsla(var(--igc-gray-600), 0.8);color:hsla(var(--igc-gray-50), var(--igc-gray-a))}`;\n"]}
1
+ {"version":3,"file":"nav-drawer-item.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,4iBAA4iB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host [part~=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*1.5rem,1.5rem);color:hsla(var(--igc-gray-300), 0.8);padding:.25rem;margin:.9375rem .5rem !important}:host [part~=base]:hover,:host [part~=base]:focus-within{background:rgba(0,0,0,0);color:hsla(var(--igc-gray-100), var(--igc-gray-a))}:host [part=content]{-webkit-margin-start:1.5rem;margin-inline-start:1.5rem;-webkit-padding-start:.5rem;padding-inline-start:.5rem}:host([active]) [part~=base]{background:hsla(var(--igc-gray-600), 0.8);color:hsla(var(--igc-gray-50), var(--igc-gray-a))}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}[part~=base]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;position:relative;color:hsla(var(--igc-gray-800), var(--igc-gray-a));max-height:3rem;margin:0.5rem !important;padding:.75rem .5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:transparent;white-space:nowrap;text-decoration:none;width:calc(100% - 1rem);border:none;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-transition:background .15s ease-out;-o-transition:background .15s ease-out;transition:background .15s ease-out;border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);font-family:var(--igc-subtitle-2-font-family);font-weight:var(--igc-subtitle-2-font-weight);font-size:var(--igc-subtitle-2-font-size);font-style:var(--igc-subtitle-2-font-style);letter-spacing:var(--igc-subtitle-2-letter-spacing);text-transform:var(--igc-subtitle-2-text-transform);line-height:var(--igc-subtitle-2-line-height);margin-top:var(--igc-subtitle-2-margin-top);margin-bottom:var(--igc-subtitle-2-margin-bottom)}[part~=base] ::slotted(igc-icon){display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit}[part~=base]:hover{background:hsla(var(--igc-gray-200), 0.87)}[part~=base]:focus-within{background:hsla(var(--igc-gray-300), 0.87)}[part=content]{-webkit-margin-start:2rem;margin-inline-start:2rem;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden}[part="base mini"]{display:block}[part="base mini"] [part=content]{display:none}[part="base mini"] ::slotted(igc-icon){width:100%}:host([disabled]){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([disabled]) [part~=base]{color:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([active]) [part~=base]{background:hsla(var(--igc-primary-500), 0.12);color:hsla(var(--igc-primary-500), var(--igc-primary-a))}`;
2
+ export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}[part~=base]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;position:relative;color:hsla(var(--igc-gray-800), var(--igc-gray-a));max-height:3rem;margin:0.5rem !important;padding:.75rem .5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:rgba(0,0,0,0);white-space:nowrap;text-decoration:none;width:calc(100% - 1rem);border:none;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-transition:background .15s ease-out;-o-transition:background .15s ease-out;transition:background .15s ease-out;border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);font-family:var(--igc-subtitle-2-font-family);font-weight:var(--igc-subtitle-2-font-weight);font-size:var(--igc-subtitle-2-font-size);font-style:var(--igc-subtitle-2-font-style);letter-spacing:var(--igc-subtitle-2-letter-spacing);text-transform:var(--igc-subtitle-2-text-transform);line-height:var(--igc-subtitle-2-line-height);margin-top:var(--igc-subtitle-2-margin-top);margin-bottom:var(--igc-subtitle-2-margin-bottom)}[part~=base] ::slotted(igc-icon){display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit}[part~=base]:hover{background:hsla(var(--igc-gray-200), 0.87)}[part~=base]:focus-within{background:hsla(var(--igc-gray-300), 0.87)}[part=content]{-webkit-margin-start:2rem;margin-inline-start:2rem;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden}[part="base mini"]{display:block}[part="base mini"] [part=content]{display:none}[part="base mini"] ::slotted(igc-icon){width:100%}:host([disabled]){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([disabled]) [part~=base]{color:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([active]) [part~=base]{background:hsla(var(--igc-primary-500), 0.12);color:hsla(var(--igc-primary-500), var(--igc-primary-a))}`;
3
3
  //# sourceMappingURL=nav-drawer-item.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"nav-drawer-item.base.css.js","sourceRoot":"","sources":["../../../../src/components/nav-drawer/styles/nav-drawer-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,sxFAAsxF,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}[part~=base]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;position:relative;color:hsla(var(--igc-gray-800), var(--igc-gray-a));max-height:3rem;margin:0.5rem !important;padding:.75rem .5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:transparent;white-space:nowrap;text-decoration:none;width:calc(100% - 1rem);border:none;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-transition:background .15s ease-out;-o-transition:background .15s ease-out;transition:background .15s ease-out;border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);font-family:var(--igc-subtitle-2-font-family);font-weight:var(--igc-subtitle-2-font-weight);font-size:var(--igc-subtitle-2-font-size);font-style:var(--igc-subtitle-2-font-style);letter-spacing:var(--igc-subtitle-2-letter-spacing);text-transform:var(--igc-subtitle-2-text-transform);line-height:var(--igc-subtitle-2-line-height);margin-top:var(--igc-subtitle-2-margin-top);margin-bottom:var(--igc-subtitle-2-margin-bottom)}[part~=base] ::slotted(igc-icon){display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit}[part~=base]:hover{background:hsla(var(--igc-gray-200), 0.87)}[part~=base]:focus-within{background:hsla(var(--igc-gray-300), 0.87)}[part=content]{-webkit-margin-start:2rem;margin-inline-start:2rem;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden}[part=\"base mini\"]{display:block}[part=\"base mini\"] [part=content]{display:none}[part=\"base mini\"] ::slotted(igc-icon){width:100%}:host([disabled]){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([disabled]) [part~=base]{color:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([active]) [part~=base]{background:hsla(var(--igc-primary-500), 0.12);color:hsla(var(--igc-primary-500), var(--igc-primary-a))}`;\n"]}
1
+ {"version":3,"file":"nav-drawer-item.base.css.js","sourceRoot":"","sources":["../../../../src/components/nav-drawer/styles/nav-drawer-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,wxFAAwxF,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}[part~=base]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;position:relative;color:hsla(var(--igc-gray-800), var(--igc-gray-a));max-height:3rem;margin:0.5rem !important;padding:.75rem .5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:rgba(0,0,0,0);white-space:nowrap;text-decoration:none;width:calc(100% - 1rem);border:none;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-transition:background .15s ease-out;-o-transition:background .15s ease-out;transition:background .15s ease-out;border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);font-family:var(--igc-subtitle-2-font-family);font-weight:var(--igc-subtitle-2-font-weight);font-size:var(--igc-subtitle-2-font-size);font-style:var(--igc-subtitle-2-font-style);letter-spacing:var(--igc-subtitle-2-letter-spacing);text-transform:var(--igc-subtitle-2-text-transform);line-height:var(--igc-subtitle-2-line-height);margin-top:var(--igc-subtitle-2-margin-top);margin-bottom:var(--igc-subtitle-2-margin-bottom)}[part~=base] ::slotted(igc-icon){display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit}[part~=base]:hover{background:hsla(var(--igc-gray-200), 0.87)}[part~=base]:focus-within{background:hsla(var(--igc-gray-300), 0.87)}[part=content]{-webkit-margin-start:2rem;margin-inline-start:2rem;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden}[part=\"base mini\"]{display:block}[part=\"base mini\"] [part=content]{display:none}[part=\"base mini\"] ::slotted(igc-icon){width:100%}:host([disabled]){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([disabled]) [part~=base]{color:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([active]) [part~=base]{background:hsla(var(--igc-primary-500), 0.12);color:hsla(var(--igc-primary-500), var(--igc-primary-a))}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{-ms-flex-negative:0;flex-shrink:0;font-family:var(--igc-font-family)}:host [part=base]{position:fixed;height:100%;min-height:100%;overflow-x:hidden;top:0;bottom:0;left:0;z-index:999;background:hsla(var(--igc-surface-500), var(--igc-surface-a));-webkit-border-end:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-end:1px solid hsla(var(--igc-gray-900), 0.14);-webkit-box-shadow:var(--igc-elevation-16);box-shadow:var(--igc-elevation-16);border-radius:0;-webkit-transition:all ease-out .3s,.3s;-o-transition:all ease-out .3s,.3s;transition:all ease-out .3s,.3s}:host [part=main]{width:16rem}:host [part=mini]{width:3.75rem}:host([position=top]) [part=main],:host([position=bottom]) [part=main]{width:100%}:host([position=top]) [part=base],:host([position=bottom]) [part=base]{height:50vh;min-height:initial;top:auto;width:100%}:host([position=top]) [part=base]{top:0;bottom:auto}:host(:not([open])[position=top]) [part=base],:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, -60vh, 0);transform:translate3d(0, -60vh, 0)}:host(:not([open])[position=top]) [part=mini],:host(:not([open])[position=bottom]) [part=mini]{display:none}:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, 60vh, 0);transform:translate3d(0, 60vh, 0)}:host([position=end]) [part=base]{-webkit-border-end:none;border-inline-end:none;-webkit-border-start:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-start:1px solid hsla(var(--igc-gray-900), 0.14);left:auto;right:0}:host([open]) [part=mini]{display:none}:host(:not([open])) [part=main]{display:none}`;
2
+ export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{-ms-flex-negative:0;flex-shrink:0;font-family:var(--igc-font-family)}:host [part=base]{position:fixed;height:100%;min-height:100%;overflow-x:hidden;top:0;bottom:0;inset-inline-start:0;z-index:999;background:hsla(var(--igc-surface-500), var(--igc-surface-a));border-radius:0;-webkit-transition:all ease-out .3s,.3s;-o-transition:all ease-out .3s,.3s;transition:all ease-out .3s,.3s}:host [part=main]{width:16rem}:host [part=mini]{width:3.75rem}:host [part=overlay]{background:hsla(var(--igc-gray-500), 0.54);position:fixed;inset:0;z-index:2}:host([position=start]) [part=mini],:host([position=end]) [part=mini]{background:hsla(var(--igc-surface-500), var(--igc-surface-a));-webkit-box-shadow:var(--igc-elevation-16);box-shadow:var(--igc-elevation-16);position:fixed;top:0;bottom:0}:host([position=start]) [part=mini]{-webkit-border-end:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-end:1px solid hsla(var(--igc-gray-900), 0.14);inset-inline-start:0}:host([position=end]) [part=mini]{-webkit-border-start:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-start:1px solid hsla(var(--igc-gray-900), 0.14);inset-inline-end:0}:host([position=top]) [part=main],:host([position=bottom]) [part=main]{width:100%}:host([position=top]) [part=base],:host([position=bottom]) [part=base]{height:50vh;min-height:initial;top:auto;width:100%}:host([position=top]) [part=base]{top:0;bottom:auto}:host(:not([open])[position=top]) [part=base],:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, -60vh, 0);transform:translate3d(0, -60vh, 0)}:host(:not([open])[position=top]) [part=mini],:host(:not([open])[position=bottom]) [part=mini]{display:none}:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, 60vh, 0);transform:translate3d(0, 60vh, 0)}:host([open][position=end]) [part=base]{-webkit-border-end:none;border-inline-end:none;-webkit-border-start:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-start:1px solid hsla(var(--igc-gray-900), 0.14);inset-inline-start:auto;inset-inline-end:0}:host([position=relative]) [part=base]{position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;-webkit-box-shadow:none;box-shadow:none}:host([position=relative]) [part=overlay]{display:none}:host([open]) [part=mini]{display:none}:host([open]:not([position=relative])) [part=base]{-webkit-border-end:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-end:1px solid hsla(var(--igc-gray-900), 0.14);-webkit-box-shadow:var(--igc-elevation-16);box-shadow:var(--igc-elevation-16)}:host(:not([open])) [part=main]{display:none}:host(:not([open])) [part=overlay]{display:none}`;
3
3
  //# sourceMappingURL=nav-drawer.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"nav-drawer.base.css.js","sourceRoot":"","sources":["../../../../src/components/nav-drawer/styles/nav-drawer.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,oyEAAoyE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{-ms-flex-negative:0;flex-shrink:0;font-family:var(--igc-font-family)}:host [part=base]{position:fixed;height:100%;min-height:100%;overflow-x:hidden;top:0;bottom:0;left:0;z-index:999;background:hsla(var(--igc-surface-500), var(--igc-surface-a));-webkit-border-end:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-end:1px solid hsla(var(--igc-gray-900), 0.14);-webkit-box-shadow:var(--igc-elevation-16);box-shadow:var(--igc-elevation-16);border-radius:0;-webkit-transition:all ease-out .3s,.3s;-o-transition:all ease-out .3s,.3s;transition:all ease-out .3s,.3s}:host [part=main]{width:16rem}:host [part=mini]{width:3.75rem}:host([position=top]) [part=main],:host([position=bottom]) [part=main]{width:100%}:host([position=top]) [part=base],:host([position=bottom]) [part=base]{height:50vh;min-height:initial;top:auto;width:100%}:host([position=top]) [part=base]{top:0;bottom:auto}:host(:not([open])[position=top]) [part=base],:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, -60vh, 0);transform:translate3d(0, -60vh, 0)}:host(:not([open])[position=top]) [part=mini],:host(:not([open])[position=bottom]) [part=mini]{display:none}:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, 60vh, 0);transform:translate3d(0, 60vh, 0)}:host([position=end]) [part=base]{-webkit-border-end:none;border-inline-end:none;-webkit-border-start:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-start:1px solid hsla(var(--igc-gray-900), 0.14);left:auto;right:0}:host([open]) [part=mini]{display:none}:host(:not([open])) [part=main]{display:none}`;\n"]}
1
+ {"version":3,"file":"nav-drawer.base.css.js","sourceRoot":"","sources":["../../../../src/components/nav-drawer/styles/nav-drawer.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,o0GAAo0G,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{-ms-flex-negative:0;flex-shrink:0;font-family:var(--igc-font-family)}:host [part=base]{position:fixed;height:100%;min-height:100%;overflow-x:hidden;top:0;bottom:0;inset-inline-start:0;z-index:999;background:hsla(var(--igc-surface-500), var(--igc-surface-a));border-radius:0;-webkit-transition:all ease-out .3s,.3s;-o-transition:all ease-out .3s,.3s;transition:all ease-out .3s,.3s}:host [part=main]{width:16rem}:host [part=mini]{width:3.75rem}:host [part=overlay]{background:hsla(var(--igc-gray-500), 0.54);position:fixed;inset:0;z-index:2}:host([position=start]) [part=mini],:host([position=end]) [part=mini]{background:hsla(var(--igc-surface-500), var(--igc-surface-a));-webkit-box-shadow:var(--igc-elevation-16);box-shadow:var(--igc-elevation-16);position:fixed;top:0;bottom:0}:host([position=start]) [part=mini]{-webkit-border-end:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-end:1px solid hsla(var(--igc-gray-900), 0.14);inset-inline-start:0}:host([position=end]) [part=mini]{-webkit-border-start:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-start:1px solid hsla(var(--igc-gray-900), 0.14);inset-inline-end:0}:host([position=top]) [part=main],:host([position=bottom]) [part=main]{width:100%}:host([position=top]) [part=base],:host([position=bottom]) [part=base]{height:50vh;min-height:initial;top:auto;width:100%}:host([position=top]) [part=base]{top:0;bottom:auto}:host(:not([open])[position=top]) [part=base],:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, -60vh, 0);transform:translate3d(0, -60vh, 0)}:host(:not([open])[position=top]) [part=mini],:host(:not([open])[position=bottom]) [part=mini]{display:none}:host(:not([open])[position=bottom]) [part=base]{-webkit-transform:translate3d(0, 60vh, 0);transform:translate3d(0, 60vh, 0)}:host([open][position=end]) [part=base]{-webkit-border-end:none;border-inline-end:none;-webkit-border-start:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-start:1px solid hsla(var(--igc-gray-900), 0.14);inset-inline-start:auto;inset-inline-end:0}:host([position=relative]) [part=base]{position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;-webkit-box-shadow:none;box-shadow:none}:host([position=relative]) [part=overlay]{display:none}:host([open]) [part=mini]{display:none}:host([open]:not([position=relative])) [part=base]{-webkit-border-end:1px solid hsla(var(--igc-gray-900), 0.14);border-inline-end:1px solid hsla(var(--igc-gray-900), 0.14);-webkit-box-shadow:var(--igc-elevation-16);box-shadow:var(--igc-elevation-16)}:host(:not([open])) [part=main]{display:none}:host(:not([open])) [part=overlay]{display:none}`;\n"]}
@@ -5,10 +5,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
7
  import { html, LitElement } from 'lit';
8
- import { themes } from '../../theming';
9
- import { styles } from './themes/light/navbar.base.css';
10
- import { styles as bootstrap } from './themes/light/navbar.bootstrap.css';
11
- import { styles as indigo } from './themes/light/navbar.indigo.css';
8
+ import { themes } from '../../theming/theming-decorator.js';
9
+ import { styles } from './themes/light/navbar.base.css.js';
10
+ import { styles as bootstrap } from './themes/light/navbar.bootstrap.css.js';
11
+ import { styles as indigo } from './themes/light/navbar.indigo.css.js';
12
12
  let IgcNavbarComponent = class IgcNavbarComponent extends LitElement {
13
13
  render() {
14
14
  return html `
@@ -1 +1 @@
1
- {"version":3,"file":"navbar.js","sourceRoot":"","sources":["../../../src/components/navbar/navbar.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAkBpE,IAAqB,kBAAkB,GAAvC,MAAqB,kBAAmB,SAAQ,UAAU;IAIrC,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;;;;;;;;KAYV,CAAC;IACJ,CAAC;CACF,CAAA;AAlBwB,0BAAO,GAAG,YAAa,CAAA;AACvB,yBAAM,GAAG,MAAO,CAAA;AAFpB,kBAAkB;IADtC,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;GACT,kBAAkB,CAmBtC;eAnBoB,kBAAkB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { themes } from '../../theming';\nimport { styles } from './themes/light/navbar.base.css';\nimport { styles as bootstrap } from './themes/light/navbar.bootstrap.css';\nimport { styles as indigo } from './themes/light/navbar.indigo.css';\n\n/**\n * A navigation bar component is used to facilitate navigation through\n * a series of hierarchical screens within an app.\n *\n * @element igc-navbar\n *\n * @slot - Renders a title inside the default slot.\n * @slot start - Renders left aligned icons.\n * @slot end - Renders right aligned action icons.\n *\n * @csspart base - The base wrapper of the navigation bar.\n * @csspart start - The left aligned icon container.\n * @csspart middle - The navigation bar title container.\n * @csspart end - The right aligned action icons container.\n */\n@themes({ bootstrap, indigo })\nexport default class IgcNavbarComponent extends LitElement {\n public static readonly tagName = 'igc-navbar';\n public static override styles = styles;\n\n protected override render() {\n return html`\n <div part=\"base\">\n <span part=\"start\">\n <slot name=\"start\"></slot>\n </span>\n <span part=\"middle\">\n <slot></slot>\n </span>\n <span part=\"end\">\n <slot name=\"end\"></slot>\n </span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-navbar': IgcNavbarComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"navbar.js","sourceRoot":"","sources":["../../../src/components/navbar/navbar.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAC;AAC3D,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,qCAAqC,CAAC;AAkBvE,IAAqB,kBAAkB,GAAvC,MAAqB,kBAAmB,SAAQ,UAAU;IAIrC,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;;;;;;;;KAYV,CAAC;IACJ,CAAC;CACF,CAAA;AAlBwB,0BAAO,GAAG,YAAa,CAAA;AACvB,yBAAM,GAAG,MAAO,CAAA;AAFpB,kBAAkB;IADtC,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;GACT,kBAAkB,CAmBtC;eAnBoB,kBAAkB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { styles } from './themes/light/navbar.base.css.js';\nimport { styles as bootstrap } from './themes/light/navbar.bootstrap.css.js';\nimport { styles as indigo } from './themes/light/navbar.indigo.css.js';\n\n/**\n * A navigation bar component is used to facilitate navigation through\n * a series of hierarchical screens within an app.\n *\n * @element igc-navbar\n *\n * @slot - Renders a title inside the default slot.\n * @slot start - Renders left aligned icons.\n * @slot end - Renders right aligned action icons.\n *\n * @csspart base - The base wrapper of the navigation bar.\n * @csspart start - The left aligned icon container.\n * @csspart middle - The navigation bar title container.\n * @csspart end - The right aligned action icons container.\n */\n@themes({ bootstrap, indigo })\nexport default class IgcNavbarComponent extends LitElement {\n public static readonly tagName = 'igc-navbar';\n public static override styles = styles;\n\n protected override render() {\n return html`\n <div part=\"base\">\n <span part=\"start\">\n <slot name=\"start\"></slot>\n </span>\n <span part=\"middle\">\n <slot></slot>\n </span>\n <span part=\"end\">\n <slot name=\"end\"></slot>\n </span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-navbar': IgcNavbarComponent;\n }\n}\n"]}
@@ -7,8 +7,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { html, LitElement, nothing } from 'lit';
8
8
  import { property, query, queryAssignedElements, state, } from 'lit/decorators.js';
9
9
  import { when } from 'lit/directives/when.js';
10
- import { watch } from '../common/decorators';
11
- import { asPercent, clamp } from '../common/util';
10
+ import { watch } from '../common/decorators/watch.js';
11
+ import { asPercent, clamp } from '../common/util.js';
12
12
  export class IgcProgressBaseComponent extends LitElement {
13
13
  constructor() {
14
14
  super(...arguments);
@@ -1 +1 @@
1
- {"version":3,"file":"base.js","sourceRoot":"","sources":["../../../src/components/progress/base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport {\n property,\n query,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { when } from 'lit/directives/when.js';\nimport { watch } from '../common/decorators';\nimport { asPercent, clamp } from '../common/util';\n\nexport abstract class IgcProgressBaseComponent extends LitElement {\n private initialMax!: number;\n private initialValue!: number;\n\n protected tick!: number;\n\n @queryAssignedElements()\n protected assignedElements!: Array<HTMLElement>;\n\n @query('[part~=\"fill\"]', true)\n protected progressIndicator!: Element;\n\n @state()\n protected percentage = 0;\n\n /** Maximum value of the control. */\n @property({ type: Number })\n public max = 100;\n\n /** The value of the control. */\n @property({ type: Number })\n public value = 0;\n\n /** The variant of the control. */\n @property({ reflect: true })\n public variant: 'primary' | 'info' | 'success' | 'warning' | 'danger' =\n 'primary';\n\n /** Animation duration in milliseconds. */\n @property({ type: Number, attribute: 'animation-duration' })\n public animationDuration = 500;\n\n /** The indeterminate state of the control. */\n @property({ type: Boolean, reflect: false })\n public indeterminate = false;\n\n /** Shows/hides the label of the control. */\n @property({ type: Boolean, attribute: 'hide-label', reflect: false })\n public hideLabel = false;\n\n /**\n * Format string for the default label of the control.\n * Placeholders:\n * {0} - current value of the control.\n * {1} - max value of the control.\n */\n @property({ attribute: 'label-format' })\n public labelFormat!: string;\n\n @watch('indeterminate', { waitUntilFirstUpdate: true })\n protected indeterminateChange() {\n this.cancelAnimations();\n if (!this.indeterminate) {\n this.percentage = Math.floor(asPercent(this.value, this.max));\n }\n }\n\n @watch('max', { waitUntilFirstUpdate: true })\n protected maxChange() {\n this.max = Math.max(0, this.max);\n if (this.value > this.max) {\n this.value = this.max;\n } else {\n if (!this.indeterminate) {\n this.animateLabelTo(this.max, this.value);\n }\n }\n }\n\n @watch('value', { waitUntilFirstUpdate: true })\n protected valueChange(oldVal: number) {\n this.value = clamp(this.value, 0, this.max);\n if (!this.indeterminate) {\n cancelAnimationFrame(this.tick);\n if (this.percentage !== Math.floor(asPercent(this.value, this.max))) {\n this.animateLabelTo(oldVal, this.value);\n }\n }\n }\n\n protected slotChanges() {\n this.requestUpdate();\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.initialMax = Math.max(0, this.max);\n this.initialValue = clamp(this.value, 0, this.initialMax);\n this.value = 0;\n this.max = 100;\n }\n\n protected override firstUpdated() {\n if (!this.indeterminate) {\n // trigger transition initially\n setTimeout(() => {\n this.max = this.initialMax;\n this.value = this.initialValue;\n }, 0);\n }\n }\n\n protected cancelAnimations() {\n requestAnimationFrame(() => {\n this.progressIndicator?.getAnimations().forEach((animation) => {\n if (animation instanceof CSSTransition) {\n animation.cancel();\n }\n });\n });\n cancelAnimationFrame(this.tick);\n }\n\n protected animateLabelTo(start: number, end: number) {\n let t0: number;\n\n const tick = (t1: number) => {\n t0 = t0 ?? t1;\n\n const progress = Math.min((t1 - t0) / (this.animationDuration || 1), 1);\n this.percentage = Math.floor(\n asPercent(progress * (end - start) + start, this.max)\n );\n progress < 1\n ? (this.tick = requestAnimationFrame(tick))\n : cancelAnimationFrame(this.tick);\n };\n\n requestAnimationFrame(tick);\n }\n\n protected renderLabelFormat() {\n return this.labelFormat\n .replace(/\\{0\\}/gm, `${this.value}`)\n .replace(/\\{1\\}/gm, `${this.max}`);\n }\n\n protected renderDefaultSlot() {\n return html`<slot part=\"label\" @slotchange=${this.slotChanges}></slot>\n ${when(\n this.indeterminate || this.hideLabel || this.assignedElements.length,\n () => nothing,\n () => html`<span part=\"label value\">${this.renderLabelText()}</span>`\n )}`;\n }\n\n protected renderLabelText() {\n return this.labelFormat ? this.renderLabelFormat() : `${this.percentage}%`;\n }\n}\n"]}
1
+ {"version":3,"file":"base.js","sourceRoot":"","sources":["../../../src/components/progress/base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport {\n property,\n query,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { when } from 'lit/directives/when.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { asPercent, clamp } from '../common/util.js';\n\nexport abstract class IgcProgressBaseComponent extends LitElement {\n private initialMax!: number;\n private initialValue!: number;\n\n protected tick!: number;\n\n @queryAssignedElements()\n protected assignedElements!: Array<HTMLElement>;\n\n @query('[part~=\"fill\"]', true)\n protected progressIndicator!: Element;\n\n @state()\n protected percentage = 0;\n\n /** Maximum value of the control. */\n @property({ type: Number })\n public max = 100;\n\n /** The value of the control. */\n @property({ type: Number })\n public value = 0;\n\n /** The variant of the control. */\n @property({ reflect: true })\n public variant: 'primary' | 'info' | 'success' | 'warning' | 'danger' =\n 'primary';\n\n /** Animation duration in milliseconds. */\n @property({ type: Number, attribute: 'animation-duration' })\n public animationDuration = 500;\n\n /** The indeterminate state of the control. */\n @property({ type: Boolean, reflect: false })\n public indeterminate = false;\n\n /** Shows/hides the label of the control. */\n @property({ type: Boolean, attribute: 'hide-label', reflect: false })\n public hideLabel = false;\n\n /**\n * Format string for the default label of the control.\n * Placeholders:\n * {0} - current value of the control.\n * {1} - max value of the control.\n */\n @property({ attribute: 'label-format' })\n public labelFormat!: string;\n\n @watch('indeterminate', { waitUntilFirstUpdate: true })\n protected indeterminateChange() {\n this.cancelAnimations();\n if (!this.indeterminate) {\n this.percentage = Math.floor(asPercent(this.value, this.max));\n }\n }\n\n @watch('max', { waitUntilFirstUpdate: true })\n protected maxChange() {\n this.max = Math.max(0, this.max);\n if (this.value > this.max) {\n this.value = this.max;\n } else {\n if (!this.indeterminate) {\n this.animateLabelTo(this.max, this.value);\n }\n }\n }\n\n @watch('value', { waitUntilFirstUpdate: true })\n protected valueChange(oldVal: number) {\n this.value = clamp(this.value, 0, this.max);\n if (!this.indeterminate) {\n cancelAnimationFrame(this.tick);\n if (this.percentage !== Math.floor(asPercent(this.value, this.max))) {\n this.animateLabelTo(oldVal, this.value);\n }\n }\n }\n\n protected slotChanges() {\n this.requestUpdate();\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.initialMax = Math.max(0, this.max);\n this.initialValue = clamp(this.value, 0, this.initialMax);\n this.value = 0;\n this.max = 100;\n }\n\n protected override firstUpdated() {\n if (!this.indeterminate) {\n // trigger transition initially\n setTimeout(() => {\n this.max = this.initialMax;\n this.value = this.initialValue;\n }, 0);\n }\n }\n\n protected cancelAnimations() {\n requestAnimationFrame(() => {\n this.progressIndicator?.getAnimations().forEach((animation) => {\n if (animation instanceof CSSTransition) {\n animation.cancel();\n }\n });\n });\n cancelAnimationFrame(this.tick);\n }\n\n protected animateLabelTo(start: number, end: number) {\n let t0: number;\n\n const tick = (t1: number) => {\n t0 = t0 ?? t1;\n\n const progress = Math.min((t1 - t0) / (this.animationDuration || 1), 1);\n this.percentage = Math.floor(\n asPercent(progress * (end - start) + start, this.max)\n );\n progress < 1\n ? (this.tick = requestAnimationFrame(tick))\n : cancelAnimationFrame(this.tick);\n };\n\n requestAnimationFrame(tick);\n }\n\n protected renderLabelFormat() {\n return this.labelFormat\n .replace(/\\{0\\}/gm, `${this.value}`)\n .replace(/\\{1\\}/gm, `${this.max}`);\n }\n\n protected renderDefaultSlot() {\n return html`<slot part=\"label\" @slotchange=${this.slotChanges}></slot>\n ${when(\n this.indeterminate || this.hideLabel || this.assignedElements.length,\n () => nothing,\n () => html`<span part=\"label value\">${this.renderLabelText()}</span>`\n )}`;\n }\n\n protected renderLabelText() {\n return this.labelFormat ? this.renderLabelFormat() : `${this.percentage}%`;\n }\n}\n"]}
@@ -1,5 +1,5 @@
1
- import { IgcProgressBaseComponent } from './base';
2
- import IgcCircularGradientComponent from './circular-gradient';
1
+ import { IgcProgressBaseComponent } from './base.js';
2
+ import type IgcCircularGradientComponent from './circular-gradient';
3
3
  /**
4
4
  * A circular progress indicator used to express unspecified wait time or display
5
5
  * the length of a process.
@@ -8,12 +8,12 @@ import { html, nothing, svg } from 'lit';
8
8
  import { queryAssignedElements } from 'lit/decorators.js';
9
9
  import { when } from 'lit/directives/when.js';
10
10
  import { styleMap } from 'lit/directives/style-map.js';
11
- import { asPercent, partNameMap } from '../common/util';
12
- import { IgcProgressBaseComponent } from './base';
13
- import { styles } from './themes/circular/circular.progress.base.css';
14
- import { styles as bootstrap } from './themes/circular/circular.progress.bootstrap.css';
15
- import { styles as fluent } from './themes/circular/circular.progress.fluent.css';
16
- import { themes } from '../../theming';
11
+ import { asPercent, partNameMap } from '../common/util.js';
12
+ import { IgcProgressBaseComponent } from './base.js';
13
+ import { styles } from './themes/circular/circular.progress.base.css.js';
14
+ import { styles as bootstrap } from './themes/circular/circular.progress.bootstrap.css.js';
15
+ import { styles as fluent } from './themes/circular/circular.progress.fluent.css.js';
16
+ import { themes } from '../../theming/theming-decorator.js';
17
17
  let IgcCircularProgressComponent = class IgcCircularProgressComponent extends IgcProgressBaseComponent {
18
18
  constructor() {
19
19
  super(...arguments);
@@ -1 +1 @@
1
- {"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["../../../src/components/progress/circular-progress.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,QAAQ,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,8CAA8C,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,gDAAgD,CAAC;AAElF,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AA2BvC,IAAqB,4BAA4B,GAAjD,MAAqB,4BAA6B,SAAQ,wBAAwB;IAAlF;;QAIY,eAAU,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAiEjD,CAAC;IA5DC,IAAc,MAAM;QAClB,OAAO;YACL,MAAM,EAAE,QAAQ,IAAI,CAAC,UAAU,GAAG;YAClC,cAAc,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,QAAQ,EAAE;YAClE,YAAY,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI;SAC5C,CAAC;IACJ,CAAC;IAED,IAAc,QAAQ;QACpB,OAAO;YACL,aAAa,EAAE,IAAI,CAAC,aAAa;SAClC,CAAC;IACJ,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAES,SAAS;QACjB,OAAO,GAAG,CAAA;4BACc,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;uBAC/B,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC;;;+BAGb,IAAI,CAAC,UAAU;YAClC,IAAI,CACJ,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAC5B,GAAG,EAAE,CACH,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,EAAgC,EAAE,EAAE;YAC7D,OAAO,GAAG,CAAA,gBAAgB,EAAE,CAAC,MAAM,eAAe,EAAE,CAAC,KAAK,iBAAiB,EAAE,CAAC,OAAO,IAAI,CAAC;QAC5F,CAAC,CAAC,EACJ,GAAG,EAAE,CAAC,GAAG,CAAA;;;WAGV,CACA;;;KAGN,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,OAAO,IAAI,CAAA;;oBAEK,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;;;wBAGtB,IAAI,CAAC,GAAG;wBACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK;;UAEvD,IAAI,CAAC,SAAS,EAAE;;0CAEgB,IAAI,CAAC,cAAc;QACrD,IAAI,CAAC,iBAAiB,EAAE;KAC3B,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;IAC9B,CAAC;CACF,CAAA;AApEwB,oCAAO,GAAG,uBAAwB,CAAA;AAClC,mCAAM,GAAG,MAAO,CAAA;AAKvC;IADC,qBAAqB,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;sEACqB;AAP9C,4BAA4B;IADhD,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;GACT,4BAA4B,CAqEhD;eArEoB,4BAA4B","sourcesContent":["import { html, nothing, svg } from 'lit';\nimport { queryAssignedElements } from 'lit/decorators.js';\nimport { when } from 'lit/directives/when.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { asPercent, partNameMap } from '../common/util';\nimport { IgcProgressBaseComponent } from './base';\nimport { styles } from './themes/circular/circular.progress.base.css';\nimport { styles as bootstrap } from './themes/circular/circular.progress.bootstrap.css';\nimport { styles as fluent } from './themes/circular/circular.progress.fluent.css';\nimport IgcCircularGradientComponent from './circular-gradient';\nimport { themes } from '../../theming';\n\n/**\n * A circular progress indicator used to express unspecified wait time or display\n * the length of a process.\n *\n * @element igc-circular-progress\n *\n * @slot - The text area container.\n * @slot gradient - Customize the progress bar in order to use a color gradient instead of a solid color. Accepts `igc-circular-gradient` elements.\n *\n * @csspart svg\n * @csspart gradient_start\n * @csspart gradient_end\n * @csspart track\n * @csspart fill\n * @csspart label\n * @csspart value\n * @csspart indeterminate\n * @csspart primary\n * @csspart danger\n * @csspart warning\n * @csspart info\n * @csspart success\n */\n\n@themes({ bootstrap, fluent })\nexport default class IgcCircularProgressComponent extends IgcProgressBaseComponent {\n public static readonly tagName = 'igc-circular-progress';\n public static override styles = styles;\n\n protected gradientId = Date.now().toString(16);\n\n @queryAssignedElements({ slot: 'gradient' })\n protected gradientElements!: Array<IgcCircularGradientComponent>;\n\n protected get stroke() {\n return {\n stroke: `url(#${this.gradientId})`,\n '--percentage': (asPercent(this.value, this.max) / 100).toString(),\n '--duration': this.animationDuration + 'ms',\n };\n }\n\n protected get svgParts() {\n return {\n indeterminate: this.indeterminate,\n };\n }\n\n private gradientChange() {\n this.requestUpdate();\n }\n\n protected renderSvg() {\n return svg`\n <circle part=\"track ${partNameMap(this.svgParts)}\"/>\n <circle style=\"${styleMap(this.stroke)}\" part=\"fill\"/>\n\n <defs>\n <linearGradient id=${this.gradientId} gradientTransform=\"rotate(90)\">\n ${when(\n this.gradientElements.length,\n () =>\n this.gradientElements.map((el: IgcCircularGradientComponent) => {\n return svg`<stop offset=${el.offset} stop-color=${el.color} stop-opacity=${el.opacity}/>`;\n }),\n () => svg`\n <stop offset=\"0%\" part=\"gradient_start\" />\n <stop offset=\"100%\" part=\"gradient_end\" />\n `\n )}\n </linearGradient>\n </defs>\n `;\n }\n\n protected renderWrapper() {\n return html`\n <svg\n part=\"svg ${partNameMap(this.svgParts)}\"\n role=\"progressbar\"\n aria-valuemin=\"0\"\n aria-valuemax=${this.max}\n aria-valuenow=${this.indeterminate ? nothing : this.value}\n >\n ${this.renderSvg()}\n </svg>\n <slot name=\"gradient\" @slotchange=${this.gradientChange}></slot>\n ${this.renderDefaultSlot()}\n `;\n }\n\n protected override render() {\n return this.renderWrapper();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-circular-progress': IgcCircularProgressComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["../../../src/components/progress/circular-progress.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,iDAAiD,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,sDAAsD,CAAC;AAC3F,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,mDAAmD,CAAC;AAErF,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AA2B5D,IAAqB,4BAA4B,GAAjD,MAAqB,4BAA6B,SAAQ,wBAAwB;IAAlF;;QAIY,eAAU,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAiEjD,CAAC;IA5DC,IAAc,MAAM;QAClB,OAAO;YACL,MAAM,EAAE,QAAQ,IAAI,CAAC,UAAU,GAAG;YAClC,cAAc,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,QAAQ,EAAE;YAClE,YAAY,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI;SAC5C,CAAC;IACJ,CAAC;IAED,IAAc,QAAQ;QACpB,OAAO;YACL,aAAa,EAAE,IAAI,CAAC,aAAa;SAClC,CAAC;IACJ,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAES,SAAS;QACjB,OAAO,GAAG,CAAA;4BACc,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;uBAC/B,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC;;;+BAGb,IAAI,CAAC,UAAU;YAClC,IAAI,CACJ,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAC5B,GAAG,EAAE,CACH,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,EAAgC,EAAE,EAAE;YAC7D,OAAO,GAAG,CAAA,gBAAgB,EAAE,CAAC,MAAM,eAAe,EAAE,CAAC,KAAK,iBAAiB,EAAE,CAAC,OAAO,IAAI,CAAC;QAC5F,CAAC,CAAC,EACJ,GAAG,EAAE,CAAC,GAAG,CAAA;;;WAGV,CACA;;;KAGN,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,OAAO,IAAI,CAAA;;oBAEK,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;;;wBAGtB,IAAI,CAAC,GAAG;wBACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK;;UAEvD,IAAI,CAAC,SAAS,EAAE;;0CAEgB,IAAI,CAAC,cAAc;QACrD,IAAI,CAAC,iBAAiB,EAAE;KAC3B,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;IAC9B,CAAC;CACF,CAAA;AApEwB,oCAAO,GAAG,uBAAwB,CAAA;AAClC,mCAAM,GAAG,MAAO,CAAA;AAKvC;IADC,qBAAqB,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;sEACqB;AAP9C,4BAA4B;IADhD,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;GACT,4BAA4B,CAqEhD;eArEoB,4BAA4B","sourcesContent":["import { html, nothing, svg } from 'lit';\nimport { queryAssignedElements } from 'lit/decorators.js';\nimport { when } from 'lit/directives/when.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { asPercent, partNameMap } from '../common/util.js';\nimport { IgcProgressBaseComponent } from './base.js';\nimport { styles } from './themes/circular/circular.progress.base.css.js';\nimport { styles as bootstrap } from './themes/circular/circular.progress.bootstrap.css.js';\nimport { styles as fluent } from './themes/circular/circular.progress.fluent.css.js';\nimport type IgcCircularGradientComponent from './circular-gradient';\nimport { themes } from '../../theming/theming-decorator.js';\n\n/**\n * A circular progress indicator used to express unspecified wait time or display\n * the length of a process.\n *\n * @element igc-circular-progress\n *\n * @slot - The text area container.\n * @slot gradient - Customize the progress bar in order to use a color gradient instead of a solid color. Accepts `igc-circular-gradient` elements.\n *\n * @csspart svg\n * @csspart gradient_start\n * @csspart gradient_end\n * @csspart track\n * @csspart fill\n * @csspart label\n * @csspart value\n * @csspart indeterminate\n * @csspart primary\n * @csspart danger\n * @csspart warning\n * @csspart info\n * @csspart success\n */\n\n@themes({ bootstrap, fluent })\nexport default class IgcCircularProgressComponent extends IgcProgressBaseComponent {\n public static readonly tagName = 'igc-circular-progress';\n public static override styles = styles;\n\n protected gradientId = Date.now().toString(16);\n\n @queryAssignedElements({ slot: 'gradient' })\n protected gradientElements!: Array<IgcCircularGradientComponent>;\n\n protected get stroke() {\n return {\n stroke: `url(#${this.gradientId})`,\n '--percentage': (asPercent(this.value, this.max) / 100).toString(),\n '--duration': this.animationDuration + 'ms',\n };\n }\n\n protected get svgParts() {\n return {\n indeterminate: this.indeterminate,\n };\n }\n\n private gradientChange() {\n this.requestUpdate();\n }\n\n protected renderSvg() {\n return svg`\n <circle part=\"track ${partNameMap(this.svgParts)}\"/>\n <circle style=\"${styleMap(this.stroke)}\" part=\"fill\"/>\n\n <defs>\n <linearGradient id=${this.gradientId} gradientTransform=\"rotate(90)\">\n ${when(\n this.gradientElements.length,\n () =>\n this.gradientElements.map((el: IgcCircularGradientComponent) => {\n return svg`<stop offset=${el.offset} stop-color=${el.color} stop-opacity=${el.opacity}/>`;\n }),\n () => svg`\n <stop offset=\"0%\" part=\"gradient_start\" />\n <stop offset=\"100%\" part=\"gradient_end\" />\n `\n )}\n </linearGradient>\n </defs>\n `;\n }\n\n protected renderWrapper() {\n return html`\n <svg\n part=\"svg ${partNameMap(this.svgParts)}\"\n role=\"progressbar\"\n aria-valuemin=\"0\"\n aria-valuemax=${this.max}\n aria-valuenow=${this.indeterminate ? nothing : this.value}\n >\n ${this.renderSvg()}\n </svg>\n <slot name=\"gradient\" @slotchange=${this.gradientChange}></slot>\n ${this.renderDefaultSlot()}\n `;\n }\n\n protected override render() {\n return this.renderWrapper();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-circular-progress': IgcCircularProgressComponent;\n }\n}\n"]}
@@ -1,4 +1,4 @@
1
- import { IgcProgressBaseComponent } from './base';
1
+ import { IgcProgressBaseComponent } from './base.js';
2
2
  /**
3
3
  * A linear progress indicator used to express unspecified wait time or display
4
4
  * the length of a process.
@@ -6,14 +6,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { html, nothing } from 'lit';
8
8
  import { property } from 'lit/decorators.js';
9
- import { asPercent, partNameMap } from '../common/util';
10
- import { IgcProgressBaseComponent } from './base';
11
- import { styles } from './themes/linear/linear.progress.base.css';
12
- import { styles as bootstrap } from './themes/linear/linear.progress.bootstrap.css';
13
- import { styles as fluent } from './themes/linear/linear.progress.fluent.css';
14
- import { styles as indigo } from './themes/linear/linear.progress.indigo.css';
15
- import { themes } from '../../theming';
9
+ import { asPercent, partNameMap } from '../common/util.js';
10
+ import { IgcProgressBaseComponent } from './base.js';
11
+ import { styles } from './themes/linear/linear.progress.base.css.js';
12
+ import { styles as bootstrap } from './themes/linear/linear.progress.bootstrap.css.js';
13
+ import { styles as fluent } from './themes/linear/linear.progress.fluent.css.js';
14
+ import { styles as indigo } from './themes/linear/linear.progress.indigo.css.js';
16
15
  import { styleMap } from 'lit/directives/style-map.js';
16
+ import { themes } from '../../theming/theming-decorator.js';
17
17
  let IgcLinearProgressComponent = class IgcLinearProgressComponent extends IgcProgressBaseComponent {
18
18
  constructor() {
19
19
  super(...arguments);
@@ -1 +1 @@
1
- {"version":3,"file":"linear-progress.js","sourceRoot":"","sources":["../../../src/components/progress/linear-progress.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,QAAQ,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAClE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAuBvD,IAAqB,0BAA0B,GAA/C,MAAqB,0BAA2B,SAAQ,wBAAwB;IAAhF;;QAMS,YAAO,GAAG,KAAK,CAAC;QAIhB,eAAU,GAME,WAAW,CAAC;IAuCjC,CAAC;IArCC,IAAc,YAAY;QACxB,OAAO;YACL,IAAI,EAAE,IAAI;YACV,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,aAAa,EAAE,IAAI,CAAC,aAAa;YACjC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YACnC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YACnC,MAAM,EAAE,IAAI,CAAC,OAAO,KAAK,QAAQ;YACjC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YACnC,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;SAC9B,CAAC;IACJ,CAAC;IAED,IAAc,QAAQ;QACpB,OAAO;YACL,KAAK,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG;YAC5C,YAAY,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI;SAC5C,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;wBAKS,IAAI,CAAC,GAAG;wBACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK;;;kBAG/C,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC;mBAC7B,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC;;;QAGlC,IAAI,CAAC,iBAAiB,EAAE;KAC3B,CAAC;IACJ,CAAC;CACF,CAAA;AAtDwB,kCAAO,GAAG,qBAAsB,CAAA;AAChC,iCAAM,GAAG,MAAO,CAAA;AAIvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DACpB;AAIvB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8DAOvB;AAhBZ,0BAA0B;IAD9C,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;GACjB,0BAA0B,CAuD9C;eAvDoB,0BAA0B","sourcesContent":["import { html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { asPercent, partNameMap } from '../common/util';\nimport { IgcProgressBaseComponent } from './base';\nimport { styles } from './themes/linear/linear.progress.base.css';\nimport { styles as bootstrap } from './themes/linear/linear.progress.bootstrap.css';\nimport { styles as fluent } from './themes/linear/linear.progress.fluent.css';\nimport { styles as indigo } from './themes/linear/linear.progress.indigo.css';\nimport { themes } from '../../theming';\nimport { styleMap } from 'lit/directives/style-map.js';\n\n/**\n * A linear progress indicator used to express unspecified wait time or display\n * the length of a process.\n *\n * @element igc-linear-progress\n *\n * @slot - The text area container.\n *\n * @csspart track\n * @csspart fill\n * @csspart striped\n * @csspart label\n * @csspart value\n * @csspart indeterminate\n * @csspart primary\n * @csspart danger\n * @csspart warning\n * @csspart info\n * @csspart success\n */\n@themes({ bootstrap, indigo, fluent })\nexport default class IgcLinearProgressComponent extends IgcProgressBaseComponent {\n public static readonly tagName = 'igc-linear-progress';\n public static override styles = styles;\n\n /** Sets the striped look of the control. */\n @property({ type: Boolean, reflect: true })\n public striped = false;\n\n /** The position for the default label of the control. */\n @property({ attribute: 'label-align', reflect: true })\n public labelAlign:\n | 'top-start'\n | 'top'\n | 'top-end'\n | 'bottom-start'\n | 'bottom'\n | 'bottom-end' = 'top-start';\n\n protected get wrapperParts() {\n return {\n fill: true,\n striped: this.striped,\n indeterminate: this.indeterminate,\n primary: this.variant === 'primary',\n success: this.variant === 'success',\n danger: this.variant === 'danger',\n warning: this.variant === 'warning',\n info: this.variant === 'info',\n };\n }\n\n protected get animInfo() {\n return {\n width: asPercent(this.value, this.max) + '%',\n '--duration': this.animationDuration + 'ms',\n };\n }\n\n protected override render() {\n return html`\n <div\n part=\"track\"\n role=\"progressbar\"\n aria-valuemin=\"0\"\n aria-valuemax=${this.max}\n aria-valuenow=${this.indeterminate ? nothing : this.value}\n >\n <div\n part=\"${partNameMap(this.wrapperParts)}\"\n style=\"${styleMap(this.animInfo)}\"\n ></div>\n </div>\n ${this.renderDefaultSlot()}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-linear-progress': IgcLinearProgressComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"linear-progress.js","sourceRoot":"","sources":["../../../src/components/progress/linear-progress.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,6CAA6C,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,kDAAkD,CAAC;AACvF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+CAA+C,CAAC;AACjF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+CAA+C,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAuB5D,IAAqB,0BAA0B,GAA/C,MAAqB,0BAA2B,SAAQ,wBAAwB;IAAhF;;QAMS,YAAO,GAAG,KAAK,CAAC;QAIhB,eAAU,GAME,WAAW,CAAC;IAuCjC,CAAC;IArCC,IAAc,YAAY;QACxB,OAAO;YACL,IAAI,EAAE,IAAI;YACV,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,aAAa,EAAE,IAAI,CAAC,aAAa;YACjC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YACnC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YACnC,MAAM,EAAE,IAAI,CAAC,OAAO,KAAK,QAAQ;YACjC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YACnC,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;SAC9B,CAAC;IACJ,CAAC;IAED,IAAc,QAAQ;QACpB,OAAO;YACL,KAAK,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG;YAC5C,YAAY,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI;SAC5C,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;wBAKS,IAAI,CAAC,GAAG;wBACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK;;;kBAG/C,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC;mBAC7B,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC;;;QAGlC,IAAI,CAAC,iBAAiB,EAAE;KAC3B,CAAC;IACJ,CAAC;CACF,CAAA;AAtDwB,kCAAO,GAAG,qBAAsB,CAAA;AAChC,iCAAM,GAAG,MAAO,CAAA;AAIvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DACpB;AAIvB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8DAOvB;AAhBZ,0BAA0B;IAD9C,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;GACjB,0BAA0B,CAuD9C;eAvDoB,0BAA0B","sourcesContent":["import { html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { asPercent, partNameMap } from '../common/util.js';\nimport { IgcProgressBaseComponent } from './base.js';\nimport { styles } from './themes/linear/linear.progress.base.css.js';\nimport { styles as bootstrap } from './themes/linear/linear.progress.bootstrap.css.js';\nimport { styles as fluent } from './themes/linear/linear.progress.fluent.css.js';\nimport { styles as indigo } from './themes/linear/linear.progress.indigo.css.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { themes } from '../../theming/theming-decorator.js';\n\n/**\n * A linear progress indicator used to express unspecified wait time or display\n * the length of a process.\n *\n * @element igc-linear-progress\n *\n * @slot - The text area container.\n *\n * @csspart track\n * @csspart fill\n * @csspart striped\n * @csspart label\n * @csspart value\n * @csspart indeterminate\n * @csspart primary\n * @csspart danger\n * @csspart warning\n * @csspart info\n * @csspart success\n */\n@themes({ bootstrap, indigo, fluent })\nexport default class IgcLinearProgressComponent extends IgcProgressBaseComponent {\n public static readonly tagName = 'igc-linear-progress';\n public static override styles = styles;\n\n /** Sets the striped look of the control. */\n @property({ type: Boolean, reflect: true })\n public striped = false;\n\n /** The position for the default label of the control. */\n @property({ attribute: 'label-align', reflect: true })\n public labelAlign:\n | 'top-start'\n | 'top'\n | 'top-end'\n | 'bottom-start'\n | 'bottom'\n | 'bottom-end' = 'top-start';\n\n protected get wrapperParts() {\n return {\n fill: true,\n striped: this.striped,\n indeterminate: this.indeterminate,\n primary: this.variant === 'primary',\n success: this.variant === 'success',\n danger: this.variant === 'danger',\n warning: this.variant === 'warning',\n info: this.variant === 'info',\n };\n }\n\n protected get animInfo() {\n return {\n width: asPercent(this.value, this.max) + '%',\n '--duration': this.animationDuration + 'ms',\n };\n }\n\n protected override render() {\n return html`\n <div\n part=\"track\"\n role=\"progressbar\"\n aria-valuemin=\"0\"\n aria-valuemax=${this.max}\n aria-valuenow=${this.indeterminate ? nothing : this.value}\n >\n <div\n part=\"${partNameMap(this.wrapperParts)}\"\n style=\"${styleMap(this.animInfo)}\"\n ></div>\n </div>\n ${this.renderDefaultSlot()}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-linear-progress': IgcLinearProgressComponent;\n }\n}\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}@-webkit-keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@-webkit-keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@-webkit-keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@-webkit-keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:host{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-family:var(--igc-font-family);color:hsla(var(--igc-gray-900), var(--igc-gray-a))}[part~=label]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:inherit;font-weight:600}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;--stroke-thickness: 0.125rem;--diameter: 1.875rem}[part~=label]{fill:hsla(var(--igc-gray-900), var(--igc-gray-a));position:absolute;-webkit-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);top:50%;left:50%}[part~=label],[part~=value]{font-size:calc(var(--diameter)/3 - var(--stroke-thickness));line-height:normal}[part="svg indeterminate"]{-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-animation:3s linear 0s infinite normal none running rotate-center;animation:3s linear 0s infinite normal none running rotate-center}[part="svg indeterminate"] [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);-webkit-animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite}[part~=svg]{width:calc(var(--diameter) + var(--stroke-thickness));height:calc(var(--diameter) + var(--stroke-thickness))}[part~=track]{stroke:hsla(var(--igc-gray-300), var(--igc-gray-a))}[part~=fill]{stroke-dasharray:calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) - var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));-webkit-transition:stroke-dashoffset var(--duration) linear;-o-transition:stroke-dashoffset var(--duration) linear;transition:stroke-dashoffset var(--duration) linear;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);--percentage: 0;--duration: 500ms}[part~=track],[part~=fill]{fill:transparent;stroke-width:var(--stroke-thickness);cx:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);cy:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);r:calc(var(--diameter)/2 - var(--stroke-thickness)*.5)}[part~=gradient_start],[part~=gradient_end]{stop-color:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=danger]) [part~=gradient_start],:host([variant=danger]) [part~=gradient_end]{stop-color:hsla(var(--igc-error-500), var(--igc-error-a))}:host([variant=warning]) [part~=gradient_start],:host([variant=warning]) [part~=gradient_end]{stop-color:hsla(var(--igc-warn-500), var(--igc-warn-a))}:host([variant=info]) [part~=gradient_start],:host([variant=info]) [part~=gradient_end]{stop-color:hsla(var(--igc-info-500), var(--igc-info-a))}:host([variant=success]) [part~=gradient_start],:host([variant=success]) [part~=gradient_end]{stop-color:hsla(var(--igc-success-500), var(--igc-success-a))}:host([dir=rtl]) [part="svg indeterminate"] [part~=fill]{-webkit-animation-name:indeterminate-accordion-rtl;animation-name:indeterminate-accordion-rtl}:host([dir=rtl]) [part~=indeterminate]{animation-direction:reverse}:host([dir=rtl]) [part~=indeterminate] [part~=track]{animation-direction:reverse}:host([dir=rtl]) [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) + var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416))}`;
2
+ export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}@-webkit-keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@-webkit-keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@-webkit-keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@-webkit-keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:host{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-family:var(--igc-font-family);color:hsla(var(--igc-gray-900), var(--igc-gray-a))}[part~=label]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:inherit;font-weight:600}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;--stroke-thickness: 0.125rem;--diameter: 1.875rem}[part~=label]{fill:hsla(var(--igc-gray-900), var(--igc-gray-a));position:absolute;-webkit-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);top:50%;left:50%}[part~=label],[part~=value]{font-size:calc(var(--diameter)/3 - var(--stroke-thickness));line-height:normal}[part="svg indeterminate"]{-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-animation:3s linear 0s infinite normal none running rotate-center;animation:3s linear 0s infinite normal none running rotate-center}[part="svg indeterminate"] [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);-webkit-animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite}[part~=svg]{width:calc(var(--diameter) + var(--stroke-thickness));height:calc(var(--diameter) + var(--stroke-thickness))}[part~=track]{stroke:hsla(var(--igc-gray-300), var(--igc-gray-a))}[part~=fill]{stroke-dasharray:calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) - var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));-webkit-transition:stroke-dashoffset var(--duration) linear;-o-transition:stroke-dashoffset var(--duration) linear;transition:stroke-dashoffset var(--duration) linear;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);--percentage: 0;--duration: 500ms}[part~=track],[part~=fill]{fill:rgba(0,0,0,0);stroke-width:var(--stroke-thickness);cx:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);cy:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);r:calc(var(--diameter)/2 - var(--stroke-thickness)*.5)}[part~=gradient_start],[part~=gradient_end]{stop-color:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=danger]) [part~=gradient_start],:host([variant=danger]) [part~=gradient_end]{stop-color:hsla(var(--igc-error-500), var(--igc-error-a))}:host([variant=warning]) [part~=gradient_start],:host([variant=warning]) [part~=gradient_end]{stop-color:hsla(var(--igc-warn-500), var(--igc-warn-a))}:host([variant=info]) [part~=gradient_start],:host([variant=info]) [part~=gradient_end]{stop-color:hsla(var(--igc-info-500), var(--igc-info-a))}:host([variant=success]) [part~=gradient_start],:host([variant=success]) [part~=gradient_end]{stop-color:hsla(var(--igc-success-500), var(--igc-success-a))}:host([dir=rtl]) [part="svg indeterminate"] [part~=fill]{-webkit-animation-name:indeterminate-accordion-rtl;animation-name:indeterminate-accordion-rtl}:host([dir=rtl]) [part~=indeterminate]{animation-direction:reverse}:host([dir=rtl]) [part~=indeterminate] [part~=track]{animation-direction:reverse}:host([dir=rtl]) [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) + var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416))}`;
3
3
  //# sourceMappingURL=circular.progress.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"circular.progress.base.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ivQAAivQ,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}@-webkit-keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@-webkit-keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@-webkit-keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@-webkit-keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:host{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-family:var(--igc-font-family);color:hsla(var(--igc-gray-900), var(--igc-gray-a))}[part~=label]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:inherit;font-weight:600}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;--stroke-thickness: 0.125rem;--diameter: 1.875rem}[part~=label]{fill:hsla(var(--igc-gray-900), var(--igc-gray-a));position:absolute;-webkit-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);top:50%;left:50%}[part~=label],[part~=value]{font-size:calc(var(--diameter)/3 - var(--stroke-thickness));line-height:normal}[part=\"svg indeterminate\"]{-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-animation:3s linear 0s infinite normal none running rotate-center;animation:3s linear 0s infinite normal none running rotate-center}[part=\"svg indeterminate\"] [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);-webkit-animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite}[part~=svg]{width:calc(var(--diameter) + var(--stroke-thickness));height:calc(var(--diameter) + var(--stroke-thickness))}[part~=track]{stroke:hsla(var(--igc-gray-300), var(--igc-gray-a))}[part~=fill]{stroke-dasharray:calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) - var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));-webkit-transition:stroke-dashoffset var(--duration) linear;-o-transition:stroke-dashoffset var(--duration) linear;transition:stroke-dashoffset var(--duration) linear;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);--percentage: 0;--duration: 500ms}[part~=track],[part~=fill]{fill:transparent;stroke-width:var(--stroke-thickness);cx:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);cy:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);r:calc(var(--diameter)/2 - var(--stroke-thickness)*.5)}[part~=gradient_start],[part~=gradient_end]{stop-color:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=danger]) [part~=gradient_start],:host([variant=danger]) [part~=gradient_end]{stop-color:hsla(var(--igc-error-500), var(--igc-error-a))}:host([variant=warning]) [part~=gradient_start],:host([variant=warning]) [part~=gradient_end]{stop-color:hsla(var(--igc-warn-500), var(--igc-warn-a))}:host([variant=info]) [part~=gradient_start],:host([variant=info]) [part~=gradient_end]{stop-color:hsla(var(--igc-info-500), var(--igc-info-a))}:host([variant=success]) [part~=gradient_start],:host([variant=success]) [part~=gradient_end]{stop-color:hsla(var(--igc-success-500), var(--igc-success-a))}:host([dir=rtl]) [part=\"svg indeterminate\"] [part~=fill]{-webkit-animation-name:indeterminate-accordion-rtl;animation-name:indeterminate-accordion-rtl}:host([dir=rtl]) [part~=indeterminate]{animation-direction:reverse}:host([dir=rtl]) [part~=indeterminate] [part~=track]{animation-direction:reverse}:host([dir=rtl]) [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) + var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416))}`;\n"]}
1
+ {"version":3,"file":"circular.progress.base.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,mvQAAmvQ,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}@-webkit-keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar{0%{-webkit-transform:scaleX(0) translateX(-100%);transform:scaleX(0) translateX(-100%);-webkit-transform-origin:left;transform-origin:left}50%{-webkit-transform:scaleX(1) translateX(50%);transform:scaleX(1) translateX(50%);-webkit-transform-origin:right;transform-origin:right}100%{-webkit-transform:scaleX(0) translateX(200%);transform:scaleX(0) translateX(200%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@keyframes indeterminate-bar-fluent{from{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transform-origin:left;transform-origin:left}to{-webkit-transform:translateX(310%);transform:translateX(310%);-webkit-transform-origin:right;transform-origin:right}}@-webkit-keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@keyframes indeterminate-bar-fluent-rtl{from{-webkit-transform:translateX(-310%);transform:translateX(-310%);-webkit-transform-origin:right;transform-origin:right}to{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transform-origin:left;transform-origin:left}}@-webkit-keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@keyframes indeterminate-accordion{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5)}}@-webkit-keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@keyframes indeterminate-accordion-rtl{from{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);stroke-dasharray:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10)}to{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5)}}@-webkit-keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:host{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-family:var(--igc-font-family);color:hsla(var(--igc-gray-900), var(--igc-gray-a))}[part~=label]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:inherit;font-weight:600}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;--stroke-thickness: 0.125rem;--diameter: 1.875rem}[part~=label]{fill:hsla(var(--igc-gray-900), var(--igc-gray-a));position:absolute;-webkit-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);top:50%;left:50%}[part~=label],[part~=value]{font-size:calc(var(--diameter)/3 - var(--stroke-thickness));line-height:normal}[part=\"svg indeterminate\"]{-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-animation:3s linear 0s infinite normal none running rotate-center;animation:3s linear 0s infinite normal none running rotate-center}[part=\"svg indeterminate\"] [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);-webkit-animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;animation:indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite}[part~=svg]{width:calc(var(--diameter) + var(--stroke-thickness));height:calc(var(--diameter) + var(--stroke-thickness))}[part~=track]{stroke:hsla(var(--igc-gray-300), var(--igc-gray-a))}[part~=fill]{stroke-dasharray:calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) - var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));-webkit-transition:stroke-dashoffset var(--duration) linear;-o-transition:stroke-dashoffset var(--duration) linear;transition:stroke-dashoffset var(--duration) linear;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);--percentage: 0;--duration: 500ms}[part~=track],[part~=fill]{fill:rgba(0,0,0,0);stroke-width:var(--stroke-thickness);cx:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);cy:calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);r:calc(var(--diameter)/2 - var(--stroke-thickness)*.5)}[part~=gradient_start],[part~=gradient_end]{stop-color:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=danger]) [part~=gradient_start],:host([variant=danger]) [part~=gradient_end]{stop-color:hsla(var(--igc-error-500), var(--igc-error-a))}:host([variant=warning]) [part~=gradient_start],:host([variant=warning]) [part~=gradient_end]{stop-color:hsla(var(--igc-warn-500), var(--igc-warn-a))}:host([variant=info]) [part~=gradient_start],:host([variant=info]) [part~=gradient_end]{stop-color:hsla(var(--igc-info-500), var(--igc-info-a))}:host([variant=success]) [part~=gradient_start],:host([variant=success]) [part~=gradient_end]{stop-color:hsla(var(--igc-success-500), var(--igc-success-a))}:host([dir=rtl]) [part=\"svg indeterminate\"] [part~=fill]{-webkit-animation-name:indeterminate-accordion-rtl;animation-name:indeterminate-accordion-rtl}:host([dir=rtl]) [part~=indeterminate]{animation-direction:reverse}:host([dir=rtl]) [part~=indeterminate] [part~=track]{animation-direction:reverse}:host([dir=rtl]) [part~=fill]{stroke-dashoffset:calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) + var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416))}`;\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--stroke-thickness: 0.25rem;--diameter: 1.75rem}[part~=svg][part~=indeterminate]{-webkit-animation-duration:.75s;animation-duration:.75s}[part="svg indeterminate"] [part~=fill]{stroke-dashoffset:60% !important;-webkit-animation:none;animation:none}[part~=track][part~=indeterminate]{stroke:transparent}`;
2
+ export const styles = css `:host{--stroke-thickness: 0.25rem;--diameter: 1.75rem}[part~=svg][part~=indeterminate]{-webkit-animation-duration:.75s;animation-duration:.75s}[part="svg indeterminate"] [part~=fill]{stroke-dashoffset:60% !important;-webkit-animation:none;animation:none}[part~=track][part~=indeterminate]{stroke:rgba(0,0,0,0)}`;
3
3
  //# sourceMappingURL=circular.progress.bootstrap.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"circular.progress.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,sTAAsT,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--stroke-thickness: 0.25rem;--diameter: 1.75rem}[part~=svg][part~=indeterminate]{-webkit-animation-duration:.75s;animation-duration:.75s}[part=\"svg indeterminate\"] [part~=fill]{stroke-dashoffset:60% !important;-webkit-animation:none;animation:none}[part~=track][part~=indeterminate]{stroke:transparent}`;\n"]}
1
+ {"version":3,"file":"circular.progress.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,wTAAwT,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--stroke-thickness: 0.25rem;--diameter: 1.75rem}[part~=svg][part~=indeterminate]{-webkit-animation-duration:.75s;animation-duration:.75s}[part=\"svg indeterminate\"] [part~=fill]{stroke-dashoffset:60% !important;-webkit-animation:none;animation:none}[part~=track][part~=indeterminate]{stroke:rgba(0,0,0,0)}`;\n"]}
@@ -8,15 +8,17 @@ import { html, LitElement } from 'lit';
8
8
  import { property, query, state } from 'lit/decorators.js';
9
9
  import { ifDefined } from 'lit/directives/if-defined.js';
10
10
  import { live } from 'lit/directives/live.js';
11
- import { themes } from '../../theming';
12
- import { alternateName, blazorTwoWayBind, watch } from '../common/decorators';
11
+ import { themes } from '../../theming/theming-decorator.js';
12
+ import { alternateName } from '../common/decorators/alternateName.js';
13
+ import { blazorTwoWayBind } from '../common/decorators/blazorTwoWayBind.js';
14
+ import { watch } from '../common/decorators/watch.js';
13
15
  import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
14
16
  import { partNameMap } from '../common/util.js';
15
- import { styles } from './themes/light/radio.base.css';
16
- import { styles as bootstrap } from './themes/light/radio.bootstrap.css';
17
- import { styles as fluent } from './themes/light/radio.fluent.css';
18
- import { styles as indigo } from './themes/light/radio.indigo.css';
19
- import { styles as material } from './themes/light/radio.material.css';
17
+ import { styles } from './themes/light/radio.base.css.js';
18
+ import { styles as bootstrap } from './themes/light/radio.bootstrap.css.js';
19
+ import { styles as fluent } from './themes/light/radio.fluent.css.js';
20
+ import { styles as indigo } from './themes/light/radio.indigo.css.js';
21
+ import { styles as material } from './themes/light/radio.material.css.js';
20
22
  let nextId = 0;
21
23
  let IgcRadioComponent = class IgcRadioComponent extends EventEmitterMixin(LitElement) {
22
24
  constructor() {
@@ -110,7 +112,6 @@ let IgcRadioComponent = class IgcRadioComponent extends EventEmitterMixin(LitEle
110
112
  })}"
111
113
  for="${this.inputId}"
112
114
  @pointerdown="${this.handleMouseDown}"
113
- .focused="${this.focused}"
114
115
  >
115
116
  <input
116
117
  id="${this.inputId}"
@@ -119,7 +120,6 @@ let IgcRadioComponent = class IgcRadioComponent extends EventEmitterMixin(LitEle
119
120
  value="${ifDefined(this.value)}"
120
121
  .required="${this.required}"
121
122
  .disabled="${this.disabled}"
122
- .invalid="${this.invalid}"
123
123
  .checked="${live(this.checked)}"
124
124
  tabindex=${this._tabIndex}
125
125
  aria-checked="${this.checked ? 'true' : 'false'}"