igniteui-webcomponents 7.1.1 → 7.1.3

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 (197) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/README.md +13 -11
  3. package/animations/easings.d.ts +1 -1
  4. package/animations/easings.js +1 -1
  5. package/animations/easings.js.map +1 -1
  6. package/components/button-group/button-group.js +2 -2
  7. package/components/button-group/button-group.js.map +1 -1
  8. package/components/button-group/themes/dark/button-group.bootstrap.css.js +1 -1
  9. package/components/button-group/themes/dark/button-group.bootstrap.css.js.map +1 -1
  10. package/components/button-group/themes/dark/button-group.fluent.css.js +1 -1
  11. package/components/button-group/themes/dark/button-group.fluent.css.js.map +1 -1
  12. package/components/button-group/themes/dark/button-group.indigo.css.js +1 -1
  13. package/components/button-group/themes/dark/button-group.indigo.css.js.map +1 -1
  14. package/components/button-group/themes/dark/button-group.material.css.js +1 -1
  15. package/components/button-group/themes/dark/button-group.material.css.js.map +1 -1
  16. package/components/button-group/themes/dark/button-group.shared.css.js +1 -1
  17. package/components/button-group/themes/dark/button-group.shared.css.js.map +1 -1
  18. package/components/button-group/themes/light/button-group.bootstrap.css.js +1 -1
  19. package/components/button-group/themes/light/button-group.bootstrap.css.js.map +1 -1
  20. package/components/button-group/themes/light/button-group.fluent.css.js +1 -1
  21. package/components/button-group/themes/light/button-group.fluent.css.js.map +1 -1
  22. package/components/button-group/themes/light/button-group.indigo.css.js +1 -1
  23. package/components/button-group/themes/light/button-group.indigo.css.js.map +1 -1
  24. package/components/button-group/themes/light/button-group.material.css.js +1 -1
  25. package/components/button-group/themes/light/button-group.material.css.js.map +1 -1
  26. package/components/button-group/themes/light/button-group.shared.css.js +1 -1
  27. package/components/button-group/themes/light/button-group.shared.css.js.map +1 -1
  28. package/components/button-group/themes/shared/button/button.bootstrap.css.js +1 -1
  29. package/components/button-group/themes/shared/button/button.bootstrap.css.js.map +1 -1
  30. package/components/button-group/themes/shared/button/button.common.css.js +1 -1
  31. package/components/button-group/themes/shared/button/button.common.css.js.map +1 -1
  32. package/components/button-group/themes/shared/button/button.fluent.css.js +1 -1
  33. package/components/button-group/themes/shared/button/button.fluent.css.js.map +1 -1
  34. package/components/button-group/themes/shared/button/button.indigo.css.js +1 -1
  35. package/components/button-group/themes/shared/button/button.indigo.css.js.map +1 -1
  36. package/components/button-group/themes/shared/button/button.material.css.js +1 -1
  37. package/components/button-group/themes/shared/button/button.material.css.js.map +1 -1
  38. package/components/calendar/calendar.js +3 -3
  39. package/components/calendar/calendar.js.map +1 -1
  40. package/components/calendar/helpers.js +2 -2
  41. package/components/calendar/helpers.js.map +1 -1
  42. package/components/carousel/carousel.js +2 -2
  43. package/components/carousel/carousel.js.map +1 -1
  44. package/components/chat/chat-message.js +1 -0
  45. package/components/chat/chat-message.js.map +1 -1
  46. package/components/chat/themes/dark/chat.bootstrap.css.js +1 -1
  47. package/components/chat/themes/dark/chat.bootstrap.css.js.map +1 -1
  48. package/components/chat/themes/dark/chat.fluent.css.js +1 -1
  49. package/components/chat/themes/dark/chat.fluent.css.js.map +1 -1
  50. package/components/chat/themes/dark/chat.indigo.css.js +1 -1
  51. package/components/chat/themes/dark/chat.indigo.css.js.map +1 -1
  52. package/components/chat/themes/dark/chat.material.css.js +1 -1
  53. package/components/chat/themes/dark/chat.material.css.js.map +1 -1
  54. package/components/chat/themes/light/chat.bootstrap.css.js +1 -1
  55. package/components/chat/themes/light/chat.bootstrap.css.js.map +1 -1
  56. package/components/chat/themes/light/chat.fluent.css.js +1 -1
  57. package/components/chat/themes/light/chat.fluent.css.js.map +1 -1
  58. package/components/chat/themes/light/chat.indigo.css.js +1 -1
  59. package/components/chat/themes/light/chat.indigo.css.js.map +1 -1
  60. package/components/chat/themes/light/chat.material.css.js +1 -1
  61. package/components/chat/themes/light/chat.material.css.js.map +1 -1
  62. package/components/chat/themes/light/chat.shared.css.js +1 -1
  63. package/components/chat/themes/light/chat.shared.css.js.map +1 -1
  64. package/components/chat/themes/message.base.css.js +1 -1
  65. package/components/chat/themes/message.base.css.js.map +1 -1
  66. package/components/chat/themes/message.js +0 -14
  67. package/components/chat/themes/message.js.map +1 -1
  68. package/components/chat/themes/shared/chat-message/chat-message.common.css.js +1 -1
  69. package/components/chat/themes/shared/chat-message/chat-message.common.css.js.map +1 -1
  70. package/components/chat/themes/shared/chat-message/chat-message.indigo.css.js +1 -1
  71. package/components/chat/themes/shared/chat-message/chat-message.indigo.css.js.map +1 -1
  72. package/components/chip/chip.d.ts +1 -0
  73. package/components/chip/chip.js +3 -1
  74. package/components/chip/chip.js.map +1 -1
  75. package/components/chip/themes/chip.base.css.js +1 -1
  76. package/components/chip/themes/chip.base.css.js.map +1 -1
  77. package/components/chip/themes/shared/chip.common.css.js +1 -1
  78. package/components/chip/themes/shared/chip.common.css.js.map +1 -1
  79. package/components/combo/combo-header.js.map +1 -1
  80. package/components/combo/combo-item.d.ts +6 -2
  81. package/components/combo/combo-item.js +5 -4
  82. package/components/combo/combo-item.js.map +1 -1
  83. package/components/combo/combo-list.js.map +1 -1
  84. package/components/combo/combo.d.ts +92 -81
  85. package/components/combo/combo.js +327 -281
  86. package/components/combo/combo.js.map +1 -1
  87. package/components/combo/controllers/data.d.ts +50 -13
  88. package/components/combo/controllers/data.js +49 -28
  89. package/components/combo/controllers/data.js.map +1 -1
  90. package/components/combo/controllers/navigation.d.ts +19 -18
  91. package/components/combo/controllers/navigation.js +73 -90
  92. package/components/combo/controllers/navigation.js.map +1 -1
  93. package/components/combo/operations/filter.d.ts +2 -2
  94. package/components/combo/operations/filter.js.map +1 -1
  95. package/components/combo/operations/group.d.ts +2 -2
  96. package/components/combo/operations/group.js.map +1 -1
  97. package/components/common/context.d.ts +1 -1
  98. package/components/common/context.js +1 -1
  99. package/components/common/context.js.map +1 -1
  100. package/components/common/controllers/drag.js +2 -2
  101. package/components/common/controllers/drag.js.map +1 -1
  102. package/components/common/controllers/key-bindings.d.ts +100 -18
  103. package/components/common/controllers/key-bindings.js +54 -47
  104. package/components/common/controllers/key-bindings.js.map +1 -1
  105. package/components/common/controllers/root-click.js +3 -3
  106. package/components/common/controllers/root-click.js.map +1 -1
  107. package/components/common/controllers/slot.d.ts +1 -1
  108. package/components/common/controllers/slot.js.map +1 -1
  109. package/components/common/mixins/combo-box.d.ts +24 -19
  110. package/components/common/mixins/combo-box.js +26 -23
  111. package/components/common/mixins/combo-box.js.map +1 -1
  112. package/components/common/util.d.ts +40 -2
  113. package/components/common/util.js +5 -2
  114. package/components/common/util.js.map +1 -1
  115. package/components/date-picker/date-picker.d.ts +3 -3
  116. package/components/date-picker/date-picker.js +10 -10
  117. package/components/date-picker/date-picker.js.map +1 -1
  118. package/components/date-range-picker/date-range-picker.d.ts +3 -3
  119. package/components/date-range-picker/date-range-picker.js +9 -9
  120. package/components/date-range-picker/date-range-picker.js.map +1 -1
  121. package/components/date-time-input/date-time-input.js +1 -1
  122. package/components/date-time-input/date-time-input.js.map +1 -1
  123. package/components/date-time-input/datetime-mask-parser.d.ts +1 -2
  124. package/components/date-time-input/datetime-mask-parser.js +1 -2
  125. package/components/date-time-input/datetime-mask-parser.js.map +1 -1
  126. package/components/dropdown/dropdown.d.ts +2 -2
  127. package/components/dropdown/dropdown.js +6 -6
  128. package/components/dropdown/dropdown.js.map +1 -1
  129. package/components/dropdown/themes/shared/item/dropdown-item.common.css.js +1 -1
  130. package/components/dropdown/themes/shared/item/dropdown-item.common.css.js.map +1 -1
  131. package/components/dropdown/themes/shared/item/dropdown-item.indigo.css.js +1 -1
  132. package/components/dropdown/themes/shared/item/dropdown-item.indigo.css.js.map +1 -1
  133. package/components/progress/themes/circular/dark/circular.progress.indigo.css.js +1 -1
  134. package/components/progress/themes/circular/dark/circular.progress.indigo.css.js.map +1 -1
  135. package/components/progress/themes/circular/dark/circular.progress.shared.css.js +1 -1
  136. package/components/progress/themes/circular/dark/circular.progress.shared.css.js.map +1 -1
  137. package/components/progress/themes/circular/light/circular.progress.indigo.css.js +1 -1
  138. package/components/progress/themes/circular/light/circular.progress.indigo.css.js.map +1 -1
  139. package/components/progress/themes/circular/light/circular.progress.shared.css.js +1 -1
  140. package/components/progress/themes/circular/light/circular.progress.shared.css.js.map +1 -1
  141. package/components/progress/themes/circular/shared/circular.progress.common.css.js +1 -1
  142. package/components/progress/themes/circular/shared/circular.progress.common.css.js.map +1 -1
  143. package/components/progress/themes/linear/linear.progress.base.css.js +1 -1
  144. package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
  145. package/components/radio/radio.js +1 -1
  146. package/components/radio/radio.js.map +1 -1
  147. package/components/rating/rating.d.ts +57 -28
  148. package/components/rating/rating.js +123 -120
  149. package/components/rating/rating.js.map +1 -1
  150. package/components/resize-container/resize-controller.js +2 -3
  151. package/components/resize-container/resize-controller.js.map +1 -1
  152. package/components/select/select.d.ts +3 -3
  153. package/components/select/select.js +10 -10
  154. package/components/select/select.js.map +1 -1
  155. package/components/splitter/types.d.ts +1 -1
  156. package/components/splitter/types.js.map +1 -1
  157. package/components/stepper/common/state.d.ts +1 -1
  158. package/components/stepper/common/state.js.map +1 -1
  159. package/components/stepper/stepper.js +8 -3
  160. package/components/stepper/stepper.js.map +1 -1
  161. package/components/stepper/themes/step/step.base.css.js +1 -1
  162. package/components/stepper/themes/step/step.base.css.js.map +1 -1
  163. package/components/stepper/themes/stepper/stepper.base.css.js +1 -1
  164. package/components/stepper/themes/stepper/stepper.base.css.js.map +1 -1
  165. package/components/tabs/tabs.js +3 -3
  166. package/components/tabs/tabs.js.map +1 -1
  167. package/components/tile-manager/tile.js +2 -2
  168. package/components/tile-manager/tile.js.map +1 -1
  169. package/components/tree/themes/shared/item.indigo.css.js +1 -1
  170. package/components/tree/themes/shared/item.indigo.css.js.map +1 -1
  171. package/components/tree/tree-item.js +2 -3
  172. package/components/tree/tree-item.js.map +1 -1
  173. package/custom-elements.json +1690 -966
  174. package/igniteui-webcomponents.css-data.json +1 -1
  175. package/igniteui-webcomponents.html-data.json +1 -1
  176. package/package.json +1 -1
  177. package/skills/README.md +3 -0
  178. package/skills/igniteui-wc-choose-components/SKILL.md +73 -0
  179. package/skills/igniteui-wc-choose-components/reference/mcp-setup.md +82 -0
  180. package/skills/igniteui-wc-generate-from-image-design/SKILL.md +228 -0
  181. package/skills/igniteui-wc-generate-from-image-design/references/component-mapping.md +130 -0
  182. package/skills/igniteui-wc-generate-from-image-design/references/gotchas.md +147 -0
  183. package/skills/igniteui-wc-integrate-with-framework/SKILL.md +22 -1
  184. package/skills/igniteui-wc-integrate-with-framework/references/angular.md +2 -0
  185. package/skills/igniteui-wc-integrate-with-framework/references/react.md +2 -0
  186. package/skills/igniteui-wc-integrate-with-framework/references/vanilla-js.md +2 -0
  187. package/skills/igniteui-wc-integrate-with-framework/references/vue.md +2 -0
  188. package/web-types.json +2 -2
  189. package/components/chat/themes/shared/chat-message/chat-message.bootstrap.css.d.ts +0 -1
  190. package/components/chat/themes/shared/chat-message/chat-message.bootstrap.css.js +0 -3
  191. package/components/chat/themes/shared/chat-message/chat-message.bootstrap.css.js.map +0 -1
  192. package/components/chat/themes/shared/chat-message/chat-message.fluent.css.d.ts +0 -1
  193. package/components/chat/themes/shared/chat-message/chat-message.fluent.css.js +0 -3
  194. package/components/chat/themes/shared/chat-message/chat-message.fluent.css.js.map +0 -1
  195. package/components/combo/controllers/selection.d.ts +0 -33
  196. package/components/combo/controllers/selection.js +0 -169
  197. package/components/combo/controllers/selection.js.map +0 -1
@@ -13,7 +13,7 @@ import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, endKey, home
13
13
  import { addSlotController, setSlots } from '../common/controllers/slot.js';
14
14
  import { registerComponent } from '../common/definitions/register.js';
15
15
  import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
16
- import { addSafeEventListener, findElementFromEventPath, first, getRoot, isLTR, last, wrap, } from '../common/util.js';
16
+ import { addSafeEventListener, first, getElementFromPath, getRoot, isLTR, last, wrap, } from '../common/util.js';
17
17
  import { STEPPER_CONTEXT } from './common/context.js';
18
18
  import { createStepperState } from './common/state.js';
19
19
  import IgcStepComponent from './step.js';
@@ -93,10 +93,15 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
93
93
  if (properties.has('linear')) {
94
94
  this._state.setVisitedState(this.linear);
95
95
  }
96
+ if (properties.has('horizontalAnimation') ||
97
+ properties.has('animationDuration')) {
98
+ const duration = this.horizontalAnimation !== 'none' ? this.animationDuration : 0;
99
+ this.style.setProperty('--animation-duration', `${duration}ms`);
100
+ }
96
101
  super.update(properties);
97
102
  }
98
103
  _skipKeyboard(_, event) {
99
- return !findElementFromEventPath('[data-step-header]', event);
104
+ return !getElementFromPath('[data-step-header]', event);
100
105
  }
101
106
  _handleHomeKey() {
102
107
  this._getStepHeader(first(this._state.accessibleSteps))?.focus();
@@ -139,7 +144,7 @@ export default class IgcStepperComponent extends EventEmitterMixin(LitElement) {
139
144
  }
140
145
  }
141
146
  _handleInteraction(event) {
142
- const step = findElementFromEventPath(IgcStepComponent.tagName, event);
147
+ const step = getElementFromPath(IgcStepComponent.tagName, event);
143
148
  if (step && this._state.isAccessible(step)) {
144
149
  this._activateStep(step);
145
150
  }
@@ -1 +1 @@
1
- {"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/stepper.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport {\n addKeybindings,\n arrowDown,\n arrowLeft,\n arrowRight,\n arrowUp,\n endKey,\n homeKey,\n} from '../common/controllers/key-bindings.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport {\n addSafeEventListener,\n findElementFromEventPath,\n first,\n getRoot,\n isLTR,\n last,\n wrap,\n} from '../common/util.js';\nimport type {\n HorizontalTransitionAnimation,\n StepperOrientation,\n StepperStepType,\n StepperTitlePosition,\n StepperVerticalAnimation,\n} from '../types.js';\nimport { STEPPER_CONTEXT } from './common/context.js';\nimport { createStepperState } from './common/state.js';\nimport type {\n IgcActiveStepChangedEventArgs,\n IgcActiveStepChangingEventArgs,\n IgcStepperComponentEventMap,\n} from './common/types.js';\nimport IgcStepComponent from './step.js';\nimport { styles } from './themes/stepper/stepper.base.css.js';\nimport { styles as bootstrap } from './themes/stepper/stepper.bootstrap.css.js';\nimport { styles as fluent } from './themes/stepper/stepper.fluent.css.js';\nimport { styles as indigo } from './themes/stepper/stepper.indigo.css.js';\n\nconst STEPPER_SYNC_PROPERTIES: (keyof IgcStepperComponent)[] = [\n 'orientation',\n 'stepType',\n 'contentTop',\n 'verticalAnimation',\n 'horizontalAnimation',\n 'animationDuration',\n 'titlePosition',\n];\n\n/**\n * A stepper component that provides a wizard-like workflow by dividing content into logical steps.\n *\n * @remarks\n * The stepper component allows the user to navigate between multiple `igc-step` elements.\n * It supports horizontal and vertical orientation, linear and non-linear navigation,\n * keyboard navigation, and provides API methods to control the active step.\n *\n * In linear mode, the user can only advance to the next step if the current step is valid\n * (not marked as `invalid`).\n *\n * @element igc-stepper\n *\n * @slot - Renders `igc-step` components inside the default slot.\n *\n * @fires igcActiveStepChanging - Emitted when the active step is about to change. Cancelable.\n * @fires igcActiveStepChanged - Emitted after the active step has changed.\n *\n * @example\n * ```html\n * <igc-stepper>\n * <igc-step>\n * <span slot=\"title\">Step 1</span>\n * <p>Step 1 content</p>\n * </igc-step>\n * <igc-step>\n * <span slot=\"title\">Step 2</span>\n * <p>Step 2 content</p>\n * </igc-step>\n * </igc-stepper>\n * ```\n *\n * @example Linear stepper with vertical orientation\n * ```html\n * <igc-stepper orientation=\"vertical\" linear>\n * <igc-step complete>\n * <span slot=\"title\">Completed step</span>\n * <p>This step is already complete.</p>\n * </igc-step>\n * <igc-step active>\n * <span slot=\"title\">Current step</span>\n * <p>Fill in the details to proceed.</p>\n * </igc-step>\n * <igc-step>\n * <span slot=\"title\">Next step</span>\n * <p>Upcoming content.</p>\n * </igc-step>\n * </igc-stepper>\n * ```\n */\nexport default class IgcStepperComponent extends EventEmitterMixin<\n IgcStepperComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-stepper';\n public static styles = styles;\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcStepperComponent, IgcStepComponent);\n }\n\n //#region Internal state and properties\n\n private readonly _state = createStepperState();\n\n private readonly _contextProvider = new ContextProvider(this, {\n context: STEPPER_CONTEXT,\n initialValue: {\n stepper: this,\n state: this._state,\n },\n });\n\n private readonly _internals = addInternalsController(this, {\n initialARIA: {\n role: 'tablist',\n },\n });\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots(),\n onChange: this._handleSlotChange,\n });\n\n private get _isHorizontal(): boolean {\n return this.orientation === 'horizontal';\n }\n\n //#endregion\n\n //#region Public attributes and properties\n\n /** Returns all of the stepper's steps. */\n public get steps(): readonly IgcStepComponent[] {\n return this._state.steps;\n }\n\n /**\n * The orientation of the stepper.\n *\n * @attr orientation\n * @default 'horizontal'\n */\n @property({ reflect: true })\n public orientation: StepperOrientation = 'horizontal';\n\n /**\n * The visual type of the steps.\n *\n * @attr step-type\n * @default 'full'\n */\n @property({ reflect: true, attribute: 'step-type' })\n public stepType: StepperStepType = 'full';\n\n /**\n * Whether the stepper is linear.\n *\n * @remarks\n * If the stepper is in linear mode and if the active step is valid only then the user is able to move forward.\n *\n * @attr linear\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public linear = false;\n\n /**\n * Whether the content is displayed above the steps.\n *\n * @attr content-top\n * @default false\n */\n @property({ type: Boolean, reflect: true, attribute: 'content-top' })\n public contentTop = false;\n\n /**\n * The animation type when in vertical mode.\n *\n * @attr vertical-animation\n * @default 'grow'\n */\n @property({ attribute: 'vertical-animation' })\n public verticalAnimation: StepperVerticalAnimation = 'grow';\n\n /**\n * The animation type when in horizontal mode.\n *\n * @attr horizontal-animation\n * @default 'slide'\n */\n @property({ attribute: 'horizontal-animation' })\n public horizontalAnimation: HorizontalTransitionAnimation = 'slide';\n\n /**\n * The animation duration in either vertical or horizontal mode in milliseconds.\n *\n * @attr animation-duration\n * @default 320\n */\n @property({ type: Number, attribute: 'animation-duration' })\n public animationDuration = 320;\n\n /**\n * The position of the steps title.\n *\n * @remarks\n * When the stepper is horizontally orientated the title is positioned below the indicator.\n * When the stepper is vertically orientated the title is positioned on the right side of the indicator.\n *\n * @attr title-position\n * @default 'auto'\n */\n @property({ reflect: false, attribute: 'title-position' })\n public titlePosition: StepperTitlePosition = 'auto';\n\n //#endregion\n\n constructor() {\n super();\n\n addSafeEventListener(this, 'click', this._handleInteraction);\n\n addThemingController(this, {\n light: { bootstrap, fluent, indigo },\n dark: { bootstrap, fluent, indigo },\n });\n\n addKeybindings(this, {\n skip: this._skipKeyboard,\n })\n .set(arrowUp, this._handleArrowUp)\n .set(arrowDown, this._handleArrowDown)\n .set(arrowLeft, this._handleArrowLeft)\n .set(arrowRight, this._handleArrowRight)\n .set(homeKey, this._handleHomeKey)\n .set(endKey, this._handleEndKey)\n .setActivateHandler(this._handleInteraction);\n }\n\n //#region Lifecycle hooks\n\n protected override update(properties: PropertyValues<this>): void {\n this._syncStepperAttributes(properties);\n\n if (properties.has('orientation')) {\n this._internals.setARIA({ ariaOrientation: this.orientation });\n }\n\n if (properties.has('linear')) {\n this._state.setVisitedState(this.linear);\n }\n\n super.update(properties);\n }\n\n //#endregion\n\n //#region Keyboard navigation handlers\n\n private _skipKeyboard(_: Element, event: KeyboardEvent): boolean {\n return !findElementFromEventPath('[data-step-header]', event);\n }\n\n private _handleHomeKey(): void {\n this._getStepHeader(first(this._state.accessibleSteps))?.focus();\n }\n\n private _handleEndKey(): void {\n this._getStepHeader(last(this._state.accessibleSteps))?.focus();\n }\n\n private _handleArrowDown(): void {\n if (!this._isHorizontal) {\n const step = this._getActiveStepComponent();\n\n if (step) {\n this._getStepHeader(this._getNextStep(step))?.focus();\n }\n }\n }\n\n private _handleArrowUp(): void {\n if (!this._isHorizontal) {\n const step = this._getActiveStepComponent();\n\n if (step) {\n this._getStepHeader(this._getPreviousStep(step))?.focus();\n }\n }\n }\n\n private _handleArrowLeft(): void {\n const step = this._getActiveStepComponent();\n\n if (step) {\n const next = isLTR(this)\n ? this._getPreviousStep(step)\n : this._getNextStep(step);\n\n this._getStepHeader(next)?.focus();\n }\n }\n\n private _handleArrowRight(): void {\n const step = this._getActiveStepComponent();\n\n if (step) {\n const next = isLTR(this)\n ? this._getNextStep(step)\n : this._getPreviousStep(step);\n\n this._getStepHeader(next)?.focus();\n }\n }\n\n //#endregion\n\n //#region Event handlers\n\n private _handleInteraction(event: Event): void {\n const step = findElementFromEventPath(IgcStepComponent.tagName, event);\n\n if (step && this._state.isAccessible(step)) {\n this._activateStep(step);\n }\n }\n\n private _handleSlotChange(): void {\n this._state.setSteps(\n this._slots.getAssignedElements('[default]', {\n selector: IgcStepComponent.tagName,\n })\n );\n\n this._state.stepsChanged();\n this.style.setProperty('--steps-count', this.steps.length.toString());\n }\n\n //#endregion\n\n //#region Internal methods\n\n private _syncStepperAttributes(properties: PropertyValues<this>): void {\n if (STEPPER_SYNC_PROPERTIES.some((p) => properties.has(p))) {\n this._contextProvider.updateObservers();\n }\n }\n\n private _animateSteps(\n nextStep: IgcStepComponent,\n currentStep: IgcStepComponent\n ): void {\n const steps = this._state.steps;\n\n if (steps.indexOf(nextStep) > steps.indexOf(currentStep)) {\n // Animate steps in ascending/next direction\n currentStep.toggleAnimation('out');\n nextStep.toggleAnimation('in');\n } else {\n // Animate steps in descending/previous direction\n currentStep.toggleAnimation('in', 'reverse');\n nextStep.toggleAnimation('out', 'reverse');\n }\n }\n\n private _emitChanging(args: IgcActiveStepChangingEventArgs): boolean {\n return this.emitEvent('igcActiveStepChanging', {\n detail: args,\n cancelable: true,\n });\n }\n\n private _emitChanged(args: IgcActiveStepChangedEventArgs): void {\n this.emitEvent('igcActiveStepChanged', {\n detail: args,\n });\n }\n\n private _activateStep(step: IgcStepComponent, shouldEmit = true): void {\n if (step === this._state.activeStep) {\n return;\n }\n\n if (!shouldEmit) {\n this._state.changeActiveStep(step);\n return;\n }\n\n const steps = this._state.steps;\n const activeIndex = steps.indexOf(this._state.activeStep!);\n const index = steps.indexOf(step);\n\n const args = { oldIndex: activeIndex, newIndex: index };\n\n if (!this._emitChanging(args)) {\n return;\n }\n\n if (this._state.activeStep) {\n this._animateSteps(step, this._state.activeStep);\n }\n\n this._state.changeActiveStep(step);\n this._emitChanged({ index });\n }\n\n private _moveToNextStep(next = true): void {\n const step = this._state.getAdjacentStep(next);\n\n if (step) {\n if (this._state.activeStep) {\n this._animateSteps(step, this._state.activeStep);\n }\n this._state.changeActiveStep(step);\n }\n }\n\n private _getNextStep(step: IgcStepComponent): IgcStepComponent {\n const steps = this._state.accessibleSteps;\n const next = wrap(0, steps.length - 1, steps.indexOf(step) + 1);\n\n return steps[next];\n }\n\n private _getPreviousStep(step: IgcStepComponent): IgcStepComponent {\n const steps = this._state.accessibleSteps;\n const previous = wrap(0, steps.length - 1, steps.indexOf(step) - 1);\n\n return steps[previous];\n }\n\n private _getActiveStepComponent(): IgcStepComponent | null {\n const active = getRoot(this).activeElement;\n return active ? active.closest(IgcStepComponent.tagName) : null;\n }\n\n private _getStepHeader(step?: IgcStepComponent): HTMLElement | null {\n return step?.renderRoot.querySelector('[data-step-header]') ?? null;\n }\n\n //#endregion\n\n //#region Public API\n\n /** Activates the step at a given index. */\n public navigateTo(index: number): void {\n const step = this._state.steps[index];\n\n if (step) {\n this._activateStep(step, false);\n }\n }\n\n /** Activates the next enabled step. */\n public next(): void {\n this._moveToNextStep();\n }\n\n /** Activates the previous enabled step. */\n public prev(): void {\n this._moveToNextStep(false);\n }\n\n /**\n * Resets the stepper to its initial state i.e. activates the first step.\n *\n * @remarks\n * The steps' content will not be automatically reset.\n */\n public reset(): void {\n this._state.reset();\n }\n\n //#endregion\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-stepper': IgcStepperComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/stepper.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport {\n addKeybindings,\n arrowDown,\n arrowLeft,\n arrowRight,\n arrowUp,\n endKey,\n homeKey,\n} from '../common/controllers/key-bindings.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport {\n addSafeEventListener,\n first,\n getElementFromPath,\n getRoot,\n isLTR,\n last,\n wrap,\n} from '../common/util.js';\nimport type {\n HorizontalTransitionAnimation,\n StepperOrientation,\n StepperStepType,\n StepperTitlePosition,\n StepperVerticalAnimation,\n} from '../types.js';\nimport { STEPPER_CONTEXT } from './common/context.js';\nimport { createStepperState } from './common/state.js';\nimport type {\n IgcActiveStepChangedEventArgs,\n IgcActiveStepChangingEventArgs,\n IgcStepperComponentEventMap,\n} from './common/types.js';\nimport IgcStepComponent from './step.js';\nimport { styles } from './themes/stepper/stepper.base.css.js';\nimport { styles as bootstrap } from './themes/stepper/stepper.bootstrap.css.js';\nimport { styles as fluent } from './themes/stepper/stepper.fluent.css.js';\nimport { styles as indigo } from './themes/stepper/stepper.indigo.css.js';\n\nconst STEPPER_SYNC_PROPERTIES: (keyof IgcStepperComponent)[] = [\n 'orientation',\n 'stepType',\n 'contentTop',\n 'verticalAnimation',\n 'horizontalAnimation',\n 'animationDuration',\n 'titlePosition',\n];\n\n/**\n * A stepper component that provides a wizard-like workflow by dividing content into logical steps.\n *\n * @remarks\n * The stepper component allows the user to navigate between multiple `igc-step` elements.\n * It supports horizontal and vertical orientation, linear and non-linear navigation,\n * keyboard navigation, and provides API methods to control the active step.\n *\n * In linear mode, the user can only advance to the next step if the current step is valid\n * (not marked as `invalid`).\n *\n * @element igc-stepper\n *\n * @slot - Renders `igc-step` components inside the default slot.\n *\n * @fires igcActiveStepChanging - Emitted when the active step is about to change. Cancelable.\n * @fires igcActiveStepChanged - Emitted after the active step has changed.\n *\n * @example\n * ```html\n * <igc-stepper>\n * <igc-step>\n * <span slot=\"title\">Step 1</span>\n * <p>Step 1 content</p>\n * </igc-step>\n * <igc-step>\n * <span slot=\"title\">Step 2</span>\n * <p>Step 2 content</p>\n * </igc-step>\n * </igc-stepper>\n * ```\n *\n * @example Linear stepper with vertical orientation\n * ```html\n * <igc-stepper orientation=\"vertical\" linear>\n * <igc-step complete>\n * <span slot=\"title\">Completed step</span>\n * <p>This step is already complete.</p>\n * </igc-step>\n * <igc-step active>\n * <span slot=\"title\">Current step</span>\n * <p>Fill in the details to proceed.</p>\n * </igc-step>\n * <igc-step>\n * <span slot=\"title\">Next step</span>\n * <p>Upcoming content.</p>\n * </igc-step>\n * </igc-stepper>\n * ```\n */\nexport default class IgcStepperComponent extends EventEmitterMixin<\n IgcStepperComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-stepper';\n public static styles = styles;\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcStepperComponent, IgcStepComponent);\n }\n\n //#region Internal state and properties\n\n private readonly _state = createStepperState();\n\n private readonly _contextProvider = new ContextProvider(this, {\n context: STEPPER_CONTEXT,\n initialValue: {\n stepper: this,\n state: this._state,\n },\n });\n\n private readonly _internals = addInternalsController(this, {\n initialARIA: {\n role: 'tablist',\n },\n });\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots(),\n onChange: this._handleSlotChange,\n });\n\n private get _isHorizontal(): boolean {\n return this.orientation === 'horizontal';\n }\n\n //#endregion\n\n //#region Public attributes and properties\n\n /** Returns all of the stepper's steps. */\n public get steps(): readonly IgcStepComponent[] {\n return this._state.steps;\n }\n\n /**\n * The orientation of the stepper.\n *\n * @attr orientation\n * @default 'horizontal'\n */\n @property({ reflect: true })\n public orientation: StepperOrientation = 'horizontal';\n\n /**\n * The visual type of the steps.\n *\n * @attr step-type\n * @default 'full'\n */\n @property({ reflect: true, attribute: 'step-type' })\n public stepType: StepperStepType = 'full';\n\n /**\n * Whether the stepper is linear.\n *\n * @remarks\n * If the stepper is in linear mode and if the active step is valid only then the user is able to move forward.\n *\n * @attr linear\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public linear = false;\n\n /**\n * Whether the content is displayed above the steps.\n *\n * @attr content-top\n * @default false\n */\n @property({ type: Boolean, reflect: true, attribute: 'content-top' })\n public contentTop = false;\n\n /**\n * The animation type when in vertical mode.\n *\n * @attr vertical-animation\n * @default 'grow'\n */\n @property({ attribute: 'vertical-animation' })\n public verticalAnimation: StepperVerticalAnimation = 'grow';\n\n /**\n * The animation type when in horizontal mode.\n *\n * @attr horizontal-animation\n * @default 'slide'\n */\n @property({ attribute: 'horizontal-animation' })\n public horizontalAnimation: HorizontalTransitionAnimation = 'slide';\n\n /**\n * The animation duration in either vertical or horizontal mode in milliseconds.\n *\n * @attr animation-duration\n * @default 320\n */\n @property({ type: Number, attribute: 'animation-duration' })\n public animationDuration = 320;\n\n /**\n * The position of the steps title.\n *\n * @remarks\n * When the stepper is horizontally orientated the title is positioned below the indicator.\n * When the stepper is vertically orientated the title is positioned on the right side of the indicator.\n *\n * @attr title-position\n * @default 'auto'\n */\n @property({ reflect: false, attribute: 'title-position' })\n public titlePosition: StepperTitlePosition = 'auto';\n\n //#endregion\n\n constructor() {\n super();\n\n addSafeEventListener(this, 'click', this._handleInteraction);\n\n addThemingController(this, {\n light: { bootstrap, fluent, indigo },\n dark: { bootstrap, fluent, indigo },\n });\n\n addKeybindings(this, {\n skip: this._skipKeyboard,\n })\n .set(arrowUp, this._handleArrowUp)\n .set(arrowDown, this._handleArrowDown)\n .set(arrowLeft, this._handleArrowLeft)\n .set(arrowRight, this._handleArrowRight)\n .set(homeKey, this._handleHomeKey)\n .set(endKey, this._handleEndKey)\n .setActivateHandler(this._handleInteraction);\n }\n\n //#region Lifecycle hooks\n\n protected override update(properties: PropertyValues<this>): void {\n this._syncStepperAttributes(properties);\n\n if (properties.has('orientation')) {\n this._internals.setARIA({ ariaOrientation: this.orientation });\n }\n\n if (properties.has('linear')) {\n this._state.setVisitedState(this.linear);\n }\n\n if (\n properties.has('horizontalAnimation') ||\n properties.has('animationDuration')\n ) {\n const duration =\n this.horizontalAnimation !== 'none' ? this.animationDuration : 0;\n\n this.style.setProperty('--animation-duration', `${duration}ms`);\n }\n\n super.update(properties);\n }\n\n //#endregion\n\n //#region Keyboard navigation handlers\n\n private _skipKeyboard(_: Element, event: KeyboardEvent): boolean {\n return !getElementFromPath('[data-step-header]', event);\n }\n\n private _handleHomeKey(): void {\n this._getStepHeader(first(this._state.accessibleSteps))?.focus();\n }\n\n private _handleEndKey(): void {\n this._getStepHeader(last(this._state.accessibleSteps))?.focus();\n }\n\n private _handleArrowDown(): void {\n if (!this._isHorizontal) {\n const step = this._getActiveStepComponent();\n\n if (step) {\n this._getStepHeader(this._getNextStep(step))?.focus();\n }\n }\n }\n\n private _handleArrowUp(): void {\n if (!this._isHorizontal) {\n const step = this._getActiveStepComponent();\n\n if (step) {\n this._getStepHeader(this._getPreviousStep(step))?.focus();\n }\n }\n }\n\n private _handleArrowLeft(): void {\n const step = this._getActiveStepComponent();\n\n if (step) {\n const next = isLTR(this)\n ? this._getPreviousStep(step)\n : this._getNextStep(step);\n\n this._getStepHeader(next)?.focus();\n }\n }\n\n private _handleArrowRight(): void {\n const step = this._getActiveStepComponent();\n\n if (step) {\n const next = isLTR(this)\n ? this._getNextStep(step)\n : this._getPreviousStep(step);\n\n this._getStepHeader(next)?.focus();\n }\n }\n\n //#endregion\n\n //#region Event handlers\n\n private _handleInteraction(event: Event): void {\n const step = getElementFromPath(IgcStepComponent.tagName, event);\n\n if (step && this._state.isAccessible(step)) {\n this._activateStep(step);\n }\n }\n\n private _handleSlotChange(): void {\n this._state.setSteps(\n this._slots.getAssignedElements('[default]', {\n selector: IgcStepComponent.tagName,\n })\n );\n\n this._state.stepsChanged();\n this.style.setProperty('--steps-count', this.steps.length.toString());\n }\n\n //#endregion\n\n //#region Internal methods\n\n private _syncStepperAttributes(properties: PropertyValues<this>): void {\n if (STEPPER_SYNC_PROPERTIES.some((p) => properties.has(p))) {\n this._contextProvider.updateObservers();\n }\n }\n\n private _animateSteps(\n nextStep: IgcStepComponent,\n currentStep: IgcStepComponent\n ): void {\n const steps = this._state.steps;\n\n if (steps.indexOf(nextStep) > steps.indexOf(currentStep)) {\n // Animate steps in ascending/next direction\n currentStep.toggleAnimation('out');\n nextStep.toggleAnimation('in');\n } else {\n // Animate steps in descending/previous direction\n currentStep.toggleAnimation('in', 'reverse');\n nextStep.toggleAnimation('out', 'reverse');\n }\n }\n\n private _emitChanging(args: IgcActiveStepChangingEventArgs): boolean {\n return this.emitEvent('igcActiveStepChanging', {\n detail: args,\n cancelable: true,\n });\n }\n\n private _emitChanged(args: IgcActiveStepChangedEventArgs): void {\n this.emitEvent('igcActiveStepChanged', {\n detail: args,\n });\n }\n\n private _activateStep(step: IgcStepComponent, shouldEmit = true): void {\n if (step === this._state.activeStep) {\n return;\n }\n\n if (!shouldEmit) {\n this._state.changeActiveStep(step);\n return;\n }\n\n const steps = this._state.steps;\n const activeIndex = steps.indexOf(this._state.activeStep!);\n const index = steps.indexOf(step);\n\n const args = { oldIndex: activeIndex, newIndex: index };\n\n if (!this._emitChanging(args)) {\n return;\n }\n\n if (this._state.activeStep) {\n this._animateSteps(step, this._state.activeStep);\n }\n\n this._state.changeActiveStep(step);\n this._emitChanged({ index });\n }\n\n private _moveToNextStep(next = true): void {\n const step = this._state.getAdjacentStep(next);\n\n if (step) {\n if (this._state.activeStep) {\n this._animateSteps(step, this._state.activeStep);\n }\n this._state.changeActiveStep(step);\n }\n }\n\n private _getNextStep(step: IgcStepComponent): IgcStepComponent {\n const steps = this._state.accessibleSteps;\n const next = wrap(0, steps.length - 1, steps.indexOf(step) + 1);\n\n return steps[next];\n }\n\n private _getPreviousStep(step: IgcStepComponent): IgcStepComponent {\n const steps = this._state.accessibleSteps;\n const previous = wrap(0, steps.length - 1, steps.indexOf(step) - 1);\n\n return steps[previous];\n }\n\n private _getActiveStepComponent(): IgcStepComponent | null {\n const active = getRoot(this).activeElement;\n return active ? active.closest(IgcStepComponent.tagName) : null;\n }\n\n private _getStepHeader(step?: IgcStepComponent): HTMLElement | null {\n return step?.renderRoot.querySelector('[data-step-header]') ?? null;\n }\n\n //#endregion\n\n //#region Public API\n\n /** Activates the step at a given index. */\n public navigateTo(index: number): void {\n const step = this._state.steps[index];\n\n if (step) {\n this._activateStep(step, false);\n }\n }\n\n /** Activates the next enabled step. */\n public next(): void {\n this._moveToNextStep();\n }\n\n /** Activates the previous enabled step. */\n public prev(): void {\n this._moveToNextStep(false);\n }\n\n /**\n * Resets the stepper to its initial state i.e. activates the first step.\n *\n * @remarks\n * The steps' content will not be automatically reset.\n */\n public reset(): void {\n this._state.reset();\n }\n\n //#endregion\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-stepper': IgcStepperComponent;\n }\n}\n"]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{align-items:flex-start}[part~=header-container],[part~=header]{width:var(--header-width-vertical, auto)}[part~=header-container]::before,[part~=header]::before{content:"";width:auto;flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);position:relative}[part~=header-container]{display:flex;pointer-events:none;position:relative;justify-content:center;z-index:0}[part~=header-container] [part~=header]{pointer-events:all;align-items:center}[part~=header-container] [part=indicator],[part~=header-container] [part=title],[part~=header-container] [part=subtitle]{pointer-events:none}[part~=header-container]::before{min-width:var(--separator-min-width);display:var(--hide-horizontal-separator, var(--horizontal-separator-display--first-of-type))}[part~=header]{display:flex;align-items:var(--align-items, flex-start);grid-row:var(--header-bottom, 1);position:relative;overflow:hidden;padding:var(--header-padding);justify-content:flex-start;gap:var(--header-gap);z-index:var(--vertical-header-z-index)}[part~=header]::before,[part~=header]::after{content:"";flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);min-width:var(--separator-min-width--header);width:calc(50% - var(--indicator-size)/2 - var(--header-padding));position:absolute;z-index:-1}[part~=header]::before{inset-inline-start:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--first-of-type)))}[part~=header]::after{inset-inline-end:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--last-of-type)))}[part~=header]:focus,[part~=header]:hover{cursor:pointer;outline:none}[part~=header]:hover::before,[part~=header]:hover::after{visibility:var(--header-separator-visibility--hover)}[part~=header]:focus::before,[part~=header]:focus::after,[part~=header]:focus-within::before,[part~=header]:focus-within::after,[part~=header]:active::before,[part~=header]:active::after{visibility:var(--header-separator-visibility--hover)}[part~=body]{display:block;grid-row-start:var(--body-top, 2);grid-column:1/span var(--steps-count);padding-inline-start:calc(var(--body-indent--vertical)/2);z-index:1;position:relative;overflow:hidden;width:0;height:var(--vertical-body-height, auto);min-width:100%}[part~=body]::before{display:var(--hide-last-separator, var(--hide-first-separator, var(--vertical-separator-visibility)));content:"";position:absolute;inset-inline-start:calc(var(--body-indent--vertical)/2 - var(--separator-size)/2);height:100%;inset-block-start:0 !important;border-inline-start-style:var(--separator-type);border-inline-start-width:var(--separator-size)}[part=content]{display:block;height:auto;overflow:auto;opacity:0}[part=content]>slot{display:block;padding-inline:var(--horizontal-body-padding, calc(var(--body-indent--vertical) / 2)) var(--horizontal-body-padding, var(--vertical-body-padding));padding-block:var(--horizontal-body-padding, var(--vertical-body-padding)) var(--horizontal-body-padding, var(--vertical-body-padding))}[part~=top]{align-items:var(--step-not-full-header-aligmnet, flex-end)}[part~=top]::before,[part~=top]::after{inset-block-end:var(--step-separator-position)}[part~=top] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column-reverse}[part~=top] [part~=header]::before,[part~=top] [part~=header]::after{inset-block-end:var(--step-separator-position)}[part~=bottom]{align-items:var(--step-not-full-header-aligmnet, start)}[part~=bottom]::before,[part~=bottom]::after{inset-block-start:var(--step-separator-position)}[part~=bottom] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column}[part~=bottom] [part~=header]::before,[part~=bottom] [part~=header]::after{inset-block-start:var(--step-separator-position)}[part~=top] [part~=text],[part~=bottom] [part~=text]{width:100%}[part~=start]{--align-text: end}[part~=start] [part=text]{order:-1}[part~=end]{--align-text: start}[part~=start],[part~=end]{align-items:center}[part~=start] [part~=text],[part~=end] [part~=text]{overflow:hidden}[part~=start] [part~=header]::before,[part~=start] [part~=header]::after,[part~=end] [part~=header]::before,[part~=end] [part~=header]::after{display:none}[part~=indicator]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);width:var(--indicator-size);min-width:var(--indicator-size);height:var(--indicator-size);position:relative}[part~=indicator],::slotted([slot=indicator]){display:flex;align-items:center;justify-content:center}::slotted([slot=indicator]){--diameter: calc(var(--indicator-size) - 0.125rem);--ig-icon-size: 1.125rem}[part~=text]{text-align:var(--align-text, initial);min-width:var(--indicator-size)}[part~=subtitle],[part~=title]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[part~=title]{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}[part~=subtitle]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom)}[part~=empty]{display:none}:host([active]) [part~=body]{height:100%}:host([active]) [part~="body bottom"]::before{inset-block-start:0}:host([active]) [part=content]{pointer-events:all;opacity:1}[part~=disabled] [part=header]{cursor:default}`;
2
+ export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{align-items:flex-start}[part~=header-container],[part~=header]{width:var(--header-width-vertical, auto)}[part~=header-container]::before,[part~=header]::before{content:"";width:auto;flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);position:relative}[part~=header-container]{display:flex;pointer-events:none;position:relative;justify-content:center;z-index:0}[part~=header-container] [part~=header]{pointer-events:all;align-items:center}[part~=header-container] [part=indicator],[part~=header-container] [part=title],[part~=header-container] [part=subtitle]{pointer-events:none}[part~=header-container]::before{min-width:var(--separator-min-width);display:var(--hide-horizontal-separator, var(--horizontal-separator-display--first-of-type))}[part~=header]{display:flex;align-items:var(--align-items, flex-start);grid-row:var(--header-bottom, 1);position:relative;overflow:hidden;padding:var(--header-padding);justify-content:flex-start;gap:var(--header-gap);z-index:var(--vertical-header-z-index)}[part~=header]::before,[part~=header]::after{content:"";flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);min-width:var(--separator-min-width--header);width:calc(50% - var(--indicator-size)/2 - var(--header-padding));position:absolute;z-index:-1}[part~=header]::before{inset-inline-start:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--first-of-type)))}[part~=header]::after{inset-inline-end:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--last-of-type)))}[part~=header]:focus,[part~=header]:hover{cursor:pointer;outline:none}[part~=header]:hover::before,[part~=header]:hover::after{visibility:var(--header-separator-visibility--hover)}[part~=header]:focus::before,[part~=header]:focus::after,[part~=header]:focus-within::before,[part~=header]:focus-within::after,[part~=header]:active::before,[part~=header]:active::after{visibility:var(--header-separator-visibility--hover)}[part~=body]{display:var(--body-display, block);grid-template-rows:var(--body-grid-rows, none);grid-row-start:var(--body-top, 2);grid-column:1/span var(--steps-count);padding-inline-start:calc(var(--body-indent--vertical)/2);z-index:1;transition:grid-template-rows var(--animation-duration, 320ms) var(--body-transition-delay, 0ms);position:relative;overflow:hidden;width:0;height:var(--vertical-body-height, auto);min-width:100%}[part~=body]::before{display:var(--hide-last-separator, var(--hide-first-separator, var(--vertical-separator-visibility)));content:"";position:absolute;inset-inline-start:calc(var(--body-indent--vertical)/2 - var(--separator-size)/2);height:100%;inset-block-start:0 !important;border-inline-start-style:var(--separator-type);border-inline-start-width:var(--separator-size)}[part=content]{display:block;min-height:0;overflow:hidden;opacity:0}[part=content]>slot{display:block;padding-inline:var(--horizontal-body-padding, calc(var(--body-indent--vertical) / 2)) var(--horizontal-body-padding, var(--vertical-body-padding));padding-block:var(--horizontal-body-padding, var(--vertical-body-padding)) var(--horizontal-body-padding, var(--vertical-body-padding))}[part~=top]{align-items:var(--step-not-full-header-aligmnet, flex-end)}[part~=top]::before,[part~=top]::after{inset-block-end:var(--step-separator-position)}[part~=top] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column-reverse}[part~=top] [part~=header]::before,[part~=top] [part~=header]::after{inset-block-end:var(--step-separator-position)}[part~=bottom]{align-items:var(--step-not-full-header-aligmnet, start)}[part~=bottom]::before,[part~=bottom]::after{inset-block-start:var(--step-separator-position)}[part~=bottom] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column}[part~=bottom] [part~=header]::before,[part~=bottom] [part~=header]::after{inset-block-start:var(--step-separator-position)}[part~=top] [part~=text],[part~=bottom] [part~=text]{width:100%}[part~=start]{--align-text: end}[part~=start] [part=text]{order:-1}[part~=end]{--align-text: start}[part~=start],[part~=end]{align-items:center}[part~=start] [part~=text],[part~=end] [part~=text]{overflow:hidden}[part~=start] [part~=header]::before,[part~=start] [part~=header]::after,[part~=end] [part~=header]::before,[part~=end] [part~=header]::after{display:none}[part~=indicator]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);width:var(--indicator-size);min-width:var(--indicator-size);height:var(--indicator-size);position:relative}[part~=indicator],::slotted([slot=indicator]){display:flex;align-items:center;justify-content:center}::slotted([slot=indicator]){--diameter: calc(var(--indicator-size) - 0.125rem);--ig-icon-size: 1.125rem}[part~=text]{text-align:var(--align-text, initial);min-width:var(--indicator-size)}[part~=subtitle],[part~=title]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[part~=title]{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}[part~=subtitle]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom)}[part~=empty]{display:none}:host([active]) [part~=body]{height:100%}:host([active]) [part~="body bottom"]::before{inset-block-start:0}:host([active]) [part=content]{pointer-events:all;opacity:1}[part~=disabled] [part=header]{cursor:default}`;
3
3
  //# sourceMappingURL=step.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"step.base.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/step/step.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0kOAA0kO,CAAC","sourcesContent":["\n import { css } from 'lit';\n export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{align-items:flex-start}[part~=header-container],[part~=header]{width:var(--header-width-vertical, auto)}[part~=header-container]::before,[part~=header]::before{content:\"\";width:auto;flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);position:relative}[part~=header-container]{display:flex;pointer-events:none;position:relative;justify-content:center;z-index:0}[part~=header-container] [part~=header]{pointer-events:all;align-items:center}[part~=header-container] [part=indicator],[part~=header-container] [part=title],[part~=header-container] [part=subtitle]{pointer-events:none}[part~=header-container]::before{min-width:var(--separator-min-width);display:var(--hide-horizontal-separator, var(--horizontal-separator-display--first-of-type))}[part~=header]{display:flex;align-items:var(--align-items, flex-start);grid-row:var(--header-bottom, 1);position:relative;overflow:hidden;padding:var(--header-padding);justify-content:flex-start;gap:var(--header-gap);z-index:var(--vertical-header-z-index)}[part~=header]::before,[part~=header]::after{content:\"\";flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);min-width:var(--separator-min-width--header);width:calc(50% - var(--indicator-size)/2 - var(--header-padding));position:absolute;z-index:-1}[part~=header]::before{inset-inline-start:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--first-of-type)))}[part~=header]::after{inset-inline-end:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--last-of-type)))}[part~=header]:focus,[part~=header]:hover{cursor:pointer;outline:none}[part~=header]:hover::before,[part~=header]:hover::after{visibility:var(--header-separator-visibility--hover)}[part~=header]:focus::before,[part~=header]:focus::after,[part~=header]:focus-within::before,[part~=header]:focus-within::after,[part~=header]:active::before,[part~=header]:active::after{visibility:var(--header-separator-visibility--hover)}[part~=body]{display:block;grid-row-start:var(--body-top, 2);grid-column:1/span var(--steps-count);padding-inline-start:calc(var(--body-indent--vertical)/2);z-index:1;position:relative;overflow:hidden;width:0;height:var(--vertical-body-height, auto);min-width:100%}[part~=body]::before{display:var(--hide-last-separator, var(--hide-first-separator, var(--vertical-separator-visibility)));content:\"\";position:absolute;inset-inline-start:calc(var(--body-indent--vertical)/2 - var(--separator-size)/2);height:100%;inset-block-start:0 !important;border-inline-start-style:var(--separator-type);border-inline-start-width:var(--separator-size)}[part=content]{display:block;height:auto;overflow:auto;opacity:0}[part=content]>slot{display:block;padding-inline:var(--horizontal-body-padding, calc(var(--body-indent--vertical) / 2)) var(--horizontal-body-padding, var(--vertical-body-padding));padding-block:var(--horizontal-body-padding, var(--vertical-body-padding)) var(--horizontal-body-padding, var(--vertical-body-padding))}[part~=top]{align-items:var(--step-not-full-header-aligmnet, flex-end)}[part~=top]::before,[part~=top]::after{inset-block-end:var(--step-separator-position)}[part~=top] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column-reverse}[part~=top] [part~=header]::before,[part~=top] [part~=header]::after{inset-block-end:var(--step-separator-position)}[part~=bottom]{align-items:var(--step-not-full-header-aligmnet, start)}[part~=bottom]::before,[part~=bottom]::after{inset-block-start:var(--step-separator-position)}[part~=bottom] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column}[part~=bottom] [part~=header]::before,[part~=bottom] [part~=header]::after{inset-block-start:var(--step-separator-position)}[part~=top] [part~=text],[part~=bottom] [part~=text]{width:100%}[part~=start]{--align-text: end}[part~=start] [part=text]{order:-1}[part~=end]{--align-text: start}[part~=start],[part~=end]{align-items:center}[part~=start] [part~=text],[part~=end] [part~=text]{overflow:hidden}[part~=start] [part~=header]::before,[part~=start] [part~=header]::after,[part~=end] [part~=header]::before,[part~=end] [part~=header]::after{display:none}[part~=indicator]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);width:var(--indicator-size);min-width:var(--indicator-size);height:var(--indicator-size);position:relative}[part~=indicator],::slotted([slot=indicator]){display:flex;align-items:center;justify-content:center}::slotted([slot=indicator]){--diameter: calc(var(--indicator-size) - 0.125rem);--ig-icon-size: 1.125rem}[part~=text]{text-align:var(--align-text, initial);min-width:var(--indicator-size)}[part~=subtitle],[part~=title]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[part~=title]{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}[part~=subtitle]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom)}[part~=empty]{display:none}:host([active]) [part~=body]{height:100%}:host([active]) [part~=\"body bottom\"]::before{inset-block-start:0}:host([active]) [part=content]{pointer-events:all;opacity:1}[part~=disabled] [part=header]{cursor:default}`;\n "]}
1
+ {"version":3,"file":"step.base.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/step/step.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,kvOAAkvO,CAAC","sourcesContent":["\n import { css } from 'lit';\n export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{align-items:flex-start}[part~=header-container],[part~=header]{width:var(--header-width-vertical, auto)}[part~=header-container]::before,[part~=header]::before{content:\"\";width:auto;flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);position:relative}[part~=header-container]{display:flex;pointer-events:none;position:relative;justify-content:center;z-index:0}[part~=header-container] [part~=header]{pointer-events:all;align-items:center}[part~=header-container] [part=indicator],[part~=header-container] [part=title],[part~=header-container] [part=subtitle]{pointer-events:none}[part~=header-container]::before{min-width:var(--separator-min-width);display:var(--hide-horizontal-separator, var(--horizontal-separator-display--first-of-type))}[part~=header]{display:flex;align-items:var(--align-items, flex-start);grid-row:var(--header-bottom, 1);position:relative;overflow:hidden;padding:var(--header-padding);justify-content:flex-start;gap:var(--header-gap);z-index:var(--vertical-header-z-index)}[part~=header]::before,[part~=header]::after{content:\"\";flex:1;border-block-start-width:var(--separator-size);height:var(--separator-size);min-width:var(--separator-min-width--header);width:calc(50% - var(--indicator-size)/2 - var(--header-padding));position:absolute;z-index:-1}[part~=header]::before{inset-inline-start:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--first-of-type)))}[part~=header]::after{inset-inline-end:0;display:var(--hide-horizontal-separator, var(--separator-disply-not-full, var(--horizontal-separator-display--last-of-type)))}[part~=header]:focus,[part~=header]:hover{cursor:pointer;outline:none}[part~=header]:hover::before,[part~=header]:hover::after{visibility:var(--header-separator-visibility--hover)}[part~=header]:focus::before,[part~=header]:focus::after,[part~=header]:focus-within::before,[part~=header]:focus-within::after,[part~=header]:active::before,[part~=header]:active::after{visibility:var(--header-separator-visibility--hover)}[part~=body]{display:var(--body-display, block);grid-template-rows:var(--body-grid-rows, none);grid-row-start:var(--body-top, 2);grid-column:1/span var(--steps-count);padding-inline-start:calc(var(--body-indent--vertical)/2);z-index:1;transition:grid-template-rows var(--animation-duration, 320ms) var(--body-transition-delay, 0ms);position:relative;overflow:hidden;width:0;height:var(--vertical-body-height, auto);min-width:100%}[part~=body]::before{display:var(--hide-last-separator, var(--hide-first-separator, var(--vertical-separator-visibility)));content:\"\";position:absolute;inset-inline-start:calc(var(--body-indent--vertical)/2 - var(--separator-size)/2);height:100%;inset-block-start:0 !important;border-inline-start-style:var(--separator-type);border-inline-start-width:var(--separator-size)}[part=content]{display:block;min-height:0;overflow:hidden;opacity:0}[part=content]>slot{display:block;padding-inline:var(--horizontal-body-padding, calc(var(--body-indent--vertical) / 2)) var(--horizontal-body-padding, var(--vertical-body-padding));padding-block:var(--horizontal-body-padding, var(--vertical-body-padding)) var(--horizontal-body-padding, var(--vertical-body-padding))}[part~=top]{align-items:var(--step-not-full-header-aligmnet, flex-end)}[part~=top]::before,[part~=top]::after{inset-block-end:var(--step-separator-position)}[part~=top] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column-reverse}[part~=top] [part~=header]::before,[part~=top] [part~=header]::after{inset-block-end:var(--step-separator-position)}[part~=bottom]{align-items:var(--step-not-full-header-aligmnet, start)}[part~=bottom]::before,[part~=bottom]::after{inset-block-start:var(--step-separator-position)}[part~=bottom] [part~=header]{align-items:var(--align-items, flex-start);flex-direction:column}[part~=bottom] [part~=header]::before,[part~=bottom] [part~=header]::after{inset-block-start:var(--step-separator-position)}[part~=top] [part~=text],[part~=bottom] [part~=text]{width:100%}[part~=start]{--align-text: end}[part~=start] [part=text]{order:-1}[part~=end]{--align-text: start}[part~=start],[part~=end]{align-items:center}[part~=start] [part~=text],[part~=end] [part~=text]{overflow:hidden}[part~=start] [part~=header]::before,[part~=start] [part~=header]::after,[part~=end] [part~=header]::before,[part~=end] [part~=header]::after{display:none}[part~=indicator]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);width:var(--indicator-size);min-width:var(--indicator-size);height:var(--indicator-size);position:relative}[part~=indicator],::slotted([slot=indicator]){display:flex;align-items:center;justify-content:center}::slotted([slot=indicator]){--diameter: calc(var(--indicator-size) - 0.125rem);--ig-icon-size: 1.125rem}[part~=text]{text-align:var(--align-text, initial);min-width:var(--indicator-size)}[part~=subtitle],[part~=title]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[part~=title]{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}[part~=subtitle]{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom)}[part~=empty]{display:none}:host([active]) [part~=body]{height:100%}:host([active]) [part~=\"body bottom\"]::before{inset-block-start:0}:host([active]) [part=content]{pointer-events:all;opacity:1}[part~=disabled] [part=header]{cursor:default}`;\n "]}
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{font-family:var(--ig-font-family);overflow:hidden;--margin: 1rem;--body-padding: 1rem;--header-gap: 0.5rem;--header-padding: 0.5rem;--vertical-body-padding: var(--body-padding);--indicator-size: 1.5rem;--indicator-roundness: calc(var(--indicator-size) / 2);--indicator-box-shadow-size: 0.0625rem;--separator-size: 0.0625rem;--separator-type: dashed;--separator-type--completed: solid;--separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));--separator-min-width: 2.25rem;--separator-min-width--header: 0.25rem;--separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));--text-min-width: var(--indicator-size);--header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));--step-min-width--first-step: var(--header-min-width)}:host([orientation=horizontal]){--horizontal-content-disply: block;--vertical-separator-visibility: none;--horizontal-body-padding: 1rem;display:grid;grid-template-columns:minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-rows:auto 1fr}:host([orientation=horizontal]) ::slotted(igc-step){display:contents;pointer-events:none;--align-text: center;--align-items: center}:host([orientation=horizontal]) ::slotted(igc-step:first-of-type){--horizontal-separator-visibility--first-of-type: none}:host([orientation=horizontal]) ::slotted(igc-step:last-of-type){--horizontal-separator-visibility--last-of-type: none}:host([orientation=horizontal][title-position=start]),:host([orientation=horizontal][title-position=end]){--step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding))}::slotted(igc-step:first-of-type){--horizontal-separator-display--first-of-type: none}::slotted(igc-step:last-of-type){--vertical-body-disply--last-of-type: none;--horizontal-separator-display--last-of-type: none}:host(:not([step-type=full])){--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));--separator-disply-not-full: none}:host(:not([step-type=full])) ::slotted(igc-step){--step-not-full-header-aligmnet: center}:host([step-type=full]) ::slotted(igc-step){--step-separator-position: var(--separator-position)}:host([content-top]) ::slotted(igc-step){--header-bottom: 2;--body-top: 1}:host(:not([orientation=horizontal])){--vertical-header-z-index: 2;--vertical-body-disply: block;--vertical-body-height: 1.5rem;--header-width-vertical: 100%;--hide-horizontal-separator: none;display:flex;flex-direction:column;width:100%}:host(:not([orientation=horizontal])) ::slotted(igc-step){--horizontal-separator-display: none;--step-hide-last-of-type: none;--step-hide-first-of-type: none;--step-width: 100%;--body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));display:flex;flex-direction:column}:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type){--vertical-body-height: 0;--hide-last-separator: none}`;
2
+ export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{font-family:var(--ig-font-family);overflow:hidden;--margin: 1rem;--body-padding: 1rem;--header-gap: 0.5rem;--header-padding: 0.5rem;--vertical-body-padding: var(--body-padding);--indicator-size: 1.5rem;--indicator-roundness: calc(var(--indicator-size) / 2);--indicator-box-shadow-size: 0.0625rem;--separator-size: 0.0625rem;--separator-type: dashed;--separator-type--completed: solid;--separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));--separator-min-width: 2.25rem;--separator-min-width--header: 0.25rem;--separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));--text-min-width: var(--indicator-size);--header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));--step-min-width--first-step: var(--header-min-width)}:host([orientation=horizontal]){--horizontal-content-disply: block;--vertical-separator-visibility: none;--horizontal-body-padding: 1rem;--body-display: grid;--body-grid-rows: 1fr;--body-transition-delay: var(--animation-duration, 320ms);display:grid;grid-template-columns:minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-rows:auto 1fr}:host([orientation=horizontal]) ::slotted(igc-step){display:contents;pointer-events:none;--align-text: center;--align-items: center}:host([orientation=horizontal]) ::slotted(igc-step[active]){--body-grid-rows: 1fr;--body-transition-delay: 0ms}:host([orientation=horizontal]) ::slotted(igc-step:first-of-type){--horizontal-separator-visibility--first-of-type: none}:host([orientation=horizontal]) ::slotted(igc-step:last-of-type){--horizontal-separator-visibility--last-of-type: none}:host([orientation=horizontal][title-position=start]),:host([orientation=horizontal][title-position=end]){--step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding))}::slotted(igc-step:first-of-type){--horizontal-separator-display--first-of-type: none}::slotted(igc-step:last-of-type){--vertical-body-disply--last-of-type: none;--horizontal-separator-display--last-of-type: none}:host(:not([step-type=full])){--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));--separator-disply-not-full: none}:host(:not([step-type=full])) ::slotted(igc-step){--step-not-full-header-aligmnet: center}:host([step-type=full]) ::slotted(igc-step){--step-separator-position: var(--separator-position)}:host([content-top]) ::slotted(igc-step){--header-bottom: 2;--body-top: 1}:host(:not([orientation=horizontal])){--vertical-header-z-index: 2;--vertical-body-disply: block;--vertical-body-height: 1.5rem;--header-width-vertical: 100%;--hide-horizontal-separator: none;display:flex;flex-direction:column;width:100%}:host(:not([orientation=horizontal])) ::slotted(igc-step){--horizontal-separator-display: none;--step-hide-last-of-type: none;--step-hide-first-of-type: none;--step-width: 100%;--body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));display:flex;flex-direction:column}:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type){--vertical-body-height: 0;--hide-last-separator: none}`;
3
3
  //# sourceMappingURL=stepper.base.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"stepper.base.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,mtIAAmtI,CAAC","sourcesContent":["\n import { css } from 'lit';\n export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{font-family:var(--ig-font-family);overflow:hidden;--margin: 1rem;--body-padding: 1rem;--header-gap: 0.5rem;--header-padding: 0.5rem;--vertical-body-padding: var(--body-padding);--indicator-size: 1.5rem;--indicator-roundness: calc(var(--indicator-size) / 2);--indicator-box-shadow-size: 0.0625rem;--separator-size: 0.0625rem;--separator-type: dashed;--separator-type--completed: solid;--separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));--separator-min-width: 2.25rem;--separator-min-width--header: 0.25rem;--separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));--text-min-width: var(--indicator-size);--header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));--step-min-width--first-step: var(--header-min-width)}:host([orientation=horizontal]){--horizontal-content-disply: block;--vertical-separator-visibility: none;--horizontal-body-padding: 1rem;display:grid;grid-template-columns:minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-rows:auto 1fr}:host([orientation=horizontal]) ::slotted(igc-step){display:contents;pointer-events:none;--align-text: center;--align-items: center}:host([orientation=horizontal]) ::slotted(igc-step:first-of-type){--horizontal-separator-visibility--first-of-type: none}:host([orientation=horizontal]) ::slotted(igc-step:last-of-type){--horizontal-separator-visibility--last-of-type: none}:host([orientation=horizontal][title-position=start]),:host([orientation=horizontal][title-position=end]){--step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding))}::slotted(igc-step:first-of-type){--horizontal-separator-display--first-of-type: none}::slotted(igc-step:last-of-type){--vertical-body-disply--last-of-type: none;--horizontal-separator-display--last-of-type: none}:host(:not([step-type=full])){--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));--separator-disply-not-full: none}:host(:not([step-type=full])) ::slotted(igc-step){--step-not-full-header-aligmnet: center}:host([step-type=full]) ::slotted(igc-step){--step-separator-position: var(--separator-position)}:host([content-top]) ::slotted(igc-step){--header-bottom: 2;--body-top: 1}:host(:not([orientation=horizontal])){--vertical-header-z-index: 2;--vertical-body-disply: block;--vertical-body-height: 1.5rem;--header-width-vertical: 100%;--hide-horizontal-separator: none;display:flex;flex-direction:column;width:100%}:host(:not([orientation=horizontal])) ::slotted(igc-step){--horizontal-separator-display: none;--step-hide-last-of-type: none;--step-hide-first-of-type: none;--step-width: 100%;--body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));display:flex;flex-direction:column}:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type){--vertical-body-height: 0;--hide-last-separator: none}`;\n "]}
1
+ {"version":3,"file":"stepper.base.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,u6IAAu6I,CAAC","sourcesContent":["\n import { css } from 'lit';\n export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{font-family:var(--ig-font-family);overflow:hidden;--margin: 1rem;--body-padding: 1rem;--header-gap: 0.5rem;--header-padding: 0.5rem;--vertical-body-padding: var(--body-padding);--indicator-size: 1.5rem;--indicator-roundness: calc(var(--indicator-size) / 2);--indicator-box-shadow-size: 0.0625rem;--separator-size: 0.0625rem;--separator-type: dashed;--separator-type--completed: solid;--separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));--separator-min-width: 2.25rem;--separator-min-width--header: 0.25rem;--separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));--text-min-width: var(--indicator-size);--header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));--step-min-width--first-step: var(--header-min-width)}:host([orientation=horizontal]){--horizontal-content-disply: block;--vertical-separator-visibility: none;--horizontal-body-padding: 1rem;--body-display: grid;--body-grid-rows: 1fr;--body-transition-delay: var(--animation-duration, 320ms);display:grid;grid-template-columns:minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-rows:auto 1fr}:host([orientation=horizontal]) ::slotted(igc-step){display:contents;pointer-events:none;--align-text: center;--align-items: center}:host([orientation=horizontal]) ::slotted(igc-step[active]){--body-grid-rows: 1fr;--body-transition-delay: 0ms}:host([orientation=horizontal]) ::slotted(igc-step:first-of-type){--horizontal-separator-visibility--first-of-type: none}:host([orientation=horizontal]) ::slotted(igc-step:last-of-type){--horizontal-separator-visibility--last-of-type: none}:host([orientation=horizontal][title-position=start]),:host([orientation=horizontal][title-position=end]){--step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding))}::slotted(igc-step:first-of-type){--horizontal-separator-display--first-of-type: none}::slotted(igc-step:last-of-type){--vertical-body-disply--last-of-type: none;--horizontal-separator-display--last-of-type: none}:host(:not([step-type=full])){--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));--separator-disply-not-full: none}:host(:not([step-type=full])) ::slotted(igc-step){--step-not-full-header-aligmnet: center}:host([step-type=full]) ::slotted(igc-step){--step-separator-position: var(--separator-position)}:host([content-top]) ::slotted(igc-step){--header-bottom: 2;--body-top: 1}:host(:not([orientation=horizontal])){--vertical-header-z-index: 2;--vertical-body-disply: block;--vertical-body-height: 1.5rem;--header-width-vertical: 100%;--hide-horizontal-separator: none;display:flex;flex-direction:column;width:100%}:host(:not([orientation=horizontal])) ::slotted(igc-step){--horizontal-separator-display: none;--step-hide-last-of-type: none;--step-hide-first-of-type: none;--step-width: 100%;--body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));display:flex;flex-direction:column}:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type){--vertical-body-height: 0;--hide-last-separator: none}`;\n "]}
@@ -18,7 +18,7 @@ import { watch } from '../common/decorators/watch.js';
18
18
  import { registerComponent } from '../common/definitions/register.js';
19
19
  import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
20
20
  import { partMap } from '../common/part-map.js';
21
- import { findElementFromEventPath, first, getRoot, isEmpty, isLTR, isString, last, scrollIntoView, wrap, } from '../common/util.js';
21
+ import { first, getElementFromPath, getRoot, isEmpty, isLTR, isString, last, scrollIntoView, wrap, } from '../common/util.js';
22
22
  import IgcTabComponent from './tab.js';
23
23
  import { createTabHelpers, getTabHeader } from './tab-dom.js';
24
24
  import { styles as shared } from './themes/shared/tabs/tabs.common.css.js';
@@ -168,7 +168,7 @@ export default class IgcTabsComponent extends EventEmitterMixin(LitElement) {
168
168
  this._tabs.includes(node.closest(IgcTabComponent.tagName)));
169
169
  }
170
170
  _isEventFromTabHeader(event) {
171
- return findElementFromEventPath('[part~="tab-header"]', event);
171
+ return getElementFromPath('[part~="tab-header"]', event);
172
172
  }
173
173
  _handleArrowKeys(delta) {
174
174
  const tabs = this._enabledTabs;
@@ -192,7 +192,7 @@ export default class IgcTabsComponent extends EventEmitterMixin(LitElement) {
192
192
  if (!this._isEventFromTabHeader(event)) {
193
193
  return;
194
194
  }
195
- const tab = findElementFromEventPath(IgcTabComponent.tagName, event);
195
+ const tab = getElementFromPath(IgcTabComponent.tagName, event);
196
196
  if (!(tab && this._tabs.includes(tab)) || tab?.disabled) {
197
197
  return;
198
198
  }
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport {\n eventOptions,\n property,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\n\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport {\n addKeybindings,\n arrowLeft,\n arrowRight,\n endKey,\n homeKey,\n} from '../common/controllers/key-bindings.js';\nimport {\n createMutationController,\n type MutationControllerParams,\n} from '../common/controllers/mutation-observer.js';\nimport { createResizeObserverController } from '../common/controllers/resize-observer.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { partMap } from '../common/part-map.js';\nimport {\n findElementFromEventPath,\n first,\n getRoot,\n isEmpty,\n isLTR,\n isString,\n last,\n scrollIntoView,\n wrap,\n} from '../common/util.js';\nimport type { TabsActivation, TabsAlignment } from '../types.js';\nimport IgcTabComponent from './tab.js';\nimport { createTabHelpers, getTabHeader } from './tab-dom.js';\nimport { styles as shared } from './themes/shared/tabs/tabs.common.css.js';\nimport { styles } from './themes/tabs.base.css.js';\nimport { all } from './themes/tabs-themes.js';\n\nexport interface IgcTabsComponentEventMap {\n igcChange: CustomEvent<IgcTabComponent>;\n}\n\n/* blazorAdditionalDependency: IgcTabComponent */\n/**\n * Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.\n *\n * The `<igc-tabs>` component allows the user to navigate between multiple `<igc-tab>` elements.\n * It supports keyboard navigation and provides API methods to control the selected tab.\n *\n * @element igc-tabs\n *\n * @fires igcChange - Emitted when the selected tab changes.\n *\n * @slot - Renders the `IgcTabComponents` inside default slot.\n *\n * @csspart start-scroll-button - The start scroll button displayed when the tabs overflow.\n * @csspart end-scroll-button - The end scroll button displayed when the tabs overflow.\n * @csspart selected-indicator - The indicator that shows which tab is selected.\n */\nexport default class IgcTabsComponent extends EventEmitterMixin<\n IgcTabsComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-tabs';\n public static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(\n IgcTabsComponent,\n IgcTabComponent,\n IgcIconButtonComponent\n );\n }\n\n //#region Private state & properties\n\n private readonly _resizeController = createResizeObserverController(this, {\n callback: this._resizeCallback,\n options: { box: 'border-box' },\n target: null,\n });\n\n /** The tabs container reference holding the tab headers. */\n private readonly _headerRef = createRef<HTMLElement>();\n\n /** The selected tab indicator reference. */\n private readonly _indicatorRef = createRef<HTMLElement>();\n\n private readonly _domHelpers = createTabHelpers(\n this,\n this._headerRef,\n this._indicatorRef\n );\n\n @queryAssignedElements({ selector: IgcTabComponent.tagName })\n private _tabs!: IgcTabComponent[];\n\n protected get _enabledTabs(): IgcTabComponent[] {\n return this._tabs.filter((tab) => !tab.disabled);\n }\n\n @state()\n private _activeTab?: IgcTabComponent;\n\n //#endregion\n\n //#region Public properties\n\n /**\n * Sets the alignment for the tab headers\n * @attr\n */\n @property({ reflect: true })\n public alignment: TabsAlignment = 'start';\n\n /**\n * Determines the tab activation. When set to auto,\n * the tab is instantly selected while navigating with the Left/Right Arrows, Home or End keys\n * and the corresponding panel is displayed.\n * When set to manual, the tab is only focused. The selection happens after pressing Space or Enter.\n * @attr\n */\n @property()\n public activation: TabsActivation = 'auto';\n\n /* blazorSuppress */\n /** Returns the direct `igc-tab` elements that are children of this element. */\n public get tabs(): IgcTabComponent[] {\n return this._tabs;\n }\n\n /** Returns the currently selected tab label or IDREF if no label property is set. */\n public get selected(): string {\n if (this._activeTab) {\n return this._activeTab.label || this._activeTab.id;\n }\n\n return '';\n }\n\n //#endregion\n\n @watch('alignment', { waitUntilFirstUpdate: true })\n protected _alignmentChanged(): void {\n this._domHelpers.setIndicator(this._activeTab);\n }\n\n //#region Life-cycle hooks\n\n constructor() {\n super();\n\n addThemingController(this, all);\n\n addKeybindings(this, {\n ref: this._headerRef,\n skip: this._skipKeyboard,\n })\n .set(arrowLeft, () => this._handleArrowKeys(isLTR(this) ? -1 : 1))\n .set(arrowRight, () => this._handleArrowKeys(isLTR(this) ? 1 : -1))\n .set(homeKey, this._handleHomeKey)\n .set(endKey, this._handleEndKey)\n .setActivateHandler(this._handleActivationKeys, {\n preventDefault: false,\n });\n\n createMutationController(this, {\n callback: this._mutationCallback,\n config: {\n attributeFilter: ['selected'],\n childList: true,\n subtree: true,\n },\n filter: [IgcTabComponent.tagName],\n });\n }\n\n protected override async firstUpdated() {\n await this.updateComplete;\n\n const selectedTab =\n this._tabs.findLast((tab) => tab.selected) ?? first(this._enabledTabs);\n\n this._domHelpers.setStyleProperties();\n this._domHelpers.setScrollButtonState();\n this._setSelectedTab(selectedTab, false);\n\n this._resizeController.observe(this._headerRef.value!);\n }\n\n /** @internal */\n public override connectedCallback(): void {\n super.connectedCallback();\n this.role = 'tablist';\n }\n\n protected override updated(): void {\n if (this._domHelpers.isLeftToRightChanged) {\n this._domHelpers.setIndicator(this._activeTab);\n }\n }\n\n //#endregion\n\n //#region Observers callbacks\n\n private _resizeCallback(): void {\n this._domHelpers.setStyleProperties();\n this._domHelpers.setScrollButtonState();\n this._domHelpers.setIndicator(this._activeTab);\n }\n\n private _mutationCallback(\n parameters: MutationControllerParams<IgcTabComponent>\n ): void {\n this._selectedAttributeChanged(parameters);\n this._handleTabsRemoved(parameters);\n this._handleTabsAdded(parameters);\n\n this._domHelpers.setStyleProperties();\n this._domHelpers.setScrollButtonState();\n this._domHelpers.setIndicator(this._activeTab);\n }\n\n private _selectedAttributeChanged({\n changes,\n }: MutationControllerParams<IgcTabComponent>): void {\n const selected = changes.attributes.find(\n ({ node: tab }) => this._tabs.includes(tab) && tab.selected\n )?.node;\n this._setSelectedTab(selected, false);\n }\n\n private _handleTabsAdded({\n changes,\n }: MutationControllerParams<IgcTabComponent>): void {\n if (!isEmpty(changes.added)) {\n const lastAdded = changes.added.findLast(\n (change) =>\n change.target.closest(this.tagName) === this && change.node.selected\n )?.node;\n\n this._setSelectedTab(lastAdded, false);\n }\n }\n\n private _handleTabsRemoved({\n changes,\n }: MutationControllerParams<IgcTabComponent>): void {\n if (!isEmpty(changes.removed)) {\n let nextSelectedTab: IgcTabComponent | null = null;\n\n const removed = changes.removed.filter(\n (change) => change.target.closest(this.tagName) === this\n );\n\n for (const each of removed) {\n if (each.node.selected && each.node === this._activeTab) {\n nextSelectedTab = first(this._enabledTabs);\n break;\n }\n }\n\n if (nextSelectedTab) {\n this._setSelectedTab(nextSelectedTab, false);\n }\n }\n }\n\n //#endregion\n\n //#region Private API\n\n private _getClosestActiveTabIndex(): number {\n const active = getRoot(this).activeElement;\n const tab = active ? active.closest(IgcTabComponent.tagName) : null;\n return tab ? this._enabledTabs.indexOf(tab) : -1;\n }\n\n private _setSelectedTab(tab?: IgcTabComponent, shouldEmit = true): void {\n if (!tab || tab === this._activeTab) {\n return;\n }\n\n if (this._activeTab) {\n this._activeTab.selected = false;\n }\n\n tab.selected = true;\n this._activeTab = tab;\n\n scrollIntoView(getTabHeader(tab));\n this._domHelpers.setIndicator(this._activeTab);\n\n if (shouldEmit) {\n this.emitEvent('igcChange', { detail: this._activeTab });\n }\n }\n\n private _keyboardActivateTab(tab: IgcTabComponent) {\n const header = getTabHeader(tab);\n\n this._domHelpers.setScrollSnap();\n scrollIntoView(header);\n header.focus({ preventScroll: true });\n\n if (this.activation === 'auto') {\n this._setSelectedTab(tab);\n }\n }\n\n private _skipKeyboard(node: Element, event: KeyboardEvent): boolean {\n return !(\n this._isEventFromTabHeader(event) &&\n this._tabs.includes(node.closest(IgcTabComponent.tagName)!)\n );\n }\n\n private _isEventFromTabHeader(event: Event) {\n return findElementFromEventPath('[part~=\"tab-header\"]', event);\n }\n\n //#endregion\n\n //#region Event handlers\n\n protected _handleArrowKeys(delta: -1 | 1): void {\n const tabs = this._enabledTabs;\n this._keyboardActivateTab(\n tabs[wrap(0, tabs.length - 1, this._getClosestActiveTabIndex() + delta)]\n );\n }\n\n protected _handleHomeKey(): void {\n this._keyboardActivateTab(first(this._enabledTabs));\n }\n\n protected _handleEndKey(): void {\n this._keyboardActivateTab(last(this._enabledTabs));\n }\n\n protected _handleActivationKeys(): void {\n const tabs = this._enabledTabs;\n const index = this._getClosestActiveTabIndex();\n\n if (index > -1) {\n this._setSelectedTab(tabs[index], false);\n this._keyboardActivateTab(tabs[index]);\n }\n }\n\n protected _handleClick(event: PointerEvent): void {\n if (!this._isEventFromTabHeader(event)) {\n return;\n }\n\n const tab = findElementFromEventPath(IgcTabComponent.tagName, event);\n\n if (!(tab && this._tabs.includes(tab)) || tab?.disabled) {\n return;\n }\n\n this._domHelpers.setScrollSnap();\n getTabHeader(tab).focus();\n this._setSelectedTab(tab);\n }\n\n @eventOptions({ passive: true })\n protected _handleScroll(): void {\n this._domHelpers.setScrollButtonState();\n }\n\n //#endregion\n\n //#region Public API methods\n\n /** Selects the specified tab and displays the corresponding panel. */\n public select(id: string): void;\n /* blazorSuppress (ref is reserved) */\n public select(ref: IgcTabComponent): void;\n /* blazorSuppress (ref is reserved) */\n public select(ref: IgcTabComponent | string): void {\n const tab = isString(ref) ? this._tabs.find((t) => t.id === ref) : ref;\n\n if (tab) {\n this._setSelectedTab(tab, false);\n }\n }\n\n //#endregion\n\n //#region Render\n\n protected _renderScrollButton(direction: 'start' | 'end') {\n const isStart = direction === 'start';\n const { start, end } = this._domHelpers.scrollButtonsDisabled;\n\n return html`${cache(\n this._domHelpers.hasScrollButtons\n ? html`\n <igc-icon-button\n tabindex=\"-1\"\n variant=\"flat\"\n collection=\"default\"\n part=\"${direction}-scroll-button\"\n exportparts=\"icon\"\n name=${isStart ? 'prev' : 'next'}\n ?disabled=${isStart ? start : end}\n @click=${() => this._domHelpers.scrollTabs(direction)}\n >\n </igc-icon-button>\n `\n : nothing\n )}`;\n }\n\n protected override render() {\n return html`\n <div\n ${ref(this._headerRef)}\n part=\"tabs\"\n style=${styleMap(this._domHelpers.styleProperties)}\n @scroll=${this._handleScroll}\n >\n <div\n part=${partMap({\n inner: true,\n scrollable: this._domHelpers.hasScrollButtons,\n })}\n >\n ${this._renderScrollButton('start')}\n <slot @click=${this._handleClick}></slot>\n ${this._renderScrollButton('end')}\n <div part=\"selected-indicator\">\n <span ${ref(this._indicatorRef)}></span>\n </div>\n </div>\n </div>\n `;\n }\n\n //#endregion\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-tabs': IgcTabsComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport {\n eventOptions,\n property,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\n\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport {\n addKeybindings,\n arrowLeft,\n arrowRight,\n endKey,\n homeKey,\n} from '../common/controllers/key-bindings.js';\nimport {\n createMutationController,\n type MutationControllerParams,\n} from '../common/controllers/mutation-observer.js';\nimport { createResizeObserverController } from '../common/controllers/resize-observer.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { partMap } from '../common/part-map.js';\nimport {\n first,\n getElementFromPath,\n getRoot,\n isEmpty,\n isLTR,\n isString,\n last,\n scrollIntoView,\n wrap,\n} from '../common/util.js';\nimport type { TabsActivation, TabsAlignment } from '../types.js';\nimport IgcTabComponent from './tab.js';\nimport { createTabHelpers, getTabHeader } from './tab-dom.js';\nimport { styles as shared } from './themes/shared/tabs/tabs.common.css.js';\nimport { styles } from './themes/tabs.base.css.js';\nimport { all } from './themes/tabs-themes.js';\n\nexport interface IgcTabsComponentEventMap {\n igcChange: CustomEvent<IgcTabComponent>;\n}\n\n/* blazorAdditionalDependency: IgcTabComponent */\n/**\n * Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.\n *\n * The `<igc-tabs>` component allows the user to navigate between multiple `<igc-tab>` elements.\n * It supports keyboard navigation and provides API methods to control the selected tab.\n *\n * @element igc-tabs\n *\n * @fires igcChange - Emitted when the selected tab changes.\n *\n * @slot - Renders the `IgcTabComponents` inside default slot.\n *\n * @csspart start-scroll-button - The start scroll button displayed when the tabs overflow.\n * @csspart end-scroll-button - The end scroll button displayed when the tabs overflow.\n * @csspart selected-indicator - The indicator that shows which tab is selected.\n */\nexport default class IgcTabsComponent extends EventEmitterMixin<\n IgcTabsComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-tabs';\n public static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(\n IgcTabsComponent,\n IgcTabComponent,\n IgcIconButtonComponent\n );\n }\n\n //#region Private state & properties\n\n private readonly _resizeController = createResizeObserverController(this, {\n callback: this._resizeCallback,\n options: { box: 'border-box' },\n target: null,\n });\n\n /** The tabs container reference holding the tab headers. */\n private readonly _headerRef = createRef<HTMLElement>();\n\n /** The selected tab indicator reference. */\n private readonly _indicatorRef = createRef<HTMLElement>();\n\n private readonly _domHelpers = createTabHelpers(\n this,\n this._headerRef,\n this._indicatorRef\n );\n\n @queryAssignedElements({ selector: IgcTabComponent.tagName })\n private _tabs!: IgcTabComponent[];\n\n protected get _enabledTabs(): IgcTabComponent[] {\n return this._tabs.filter((tab) => !tab.disabled);\n }\n\n @state()\n private _activeTab?: IgcTabComponent;\n\n //#endregion\n\n //#region Public properties\n\n /**\n * Sets the alignment for the tab headers\n * @attr\n */\n @property({ reflect: true })\n public alignment: TabsAlignment = 'start';\n\n /**\n * Determines the tab activation. When set to auto,\n * the tab is instantly selected while navigating with the Left/Right Arrows, Home or End keys\n * and the corresponding panel is displayed.\n * When set to manual, the tab is only focused. The selection happens after pressing Space or Enter.\n * @attr\n */\n @property()\n public activation: TabsActivation = 'auto';\n\n /* blazorSuppress */\n /** Returns the direct `igc-tab` elements that are children of this element. */\n public get tabs(): IgcTabComponent[] {\n return this._tabs;\n }\n\n /** Returns the currently selected tab label or IDREF if no label property is set. */\n public get selected(): string {\n if (this._activeTab) {\n return this._activeTab.label || this._activeTab.id;\n }\n\n return '';\n }\n\n //#endregion\n\n @watch('alignment', { waitUntilFirstUpdate: true })\n protected _alignmentChanged(): void {\n this._domHelpers.setIndicator(this._activeTab);\n }\n\n //#region Life-cycle hooks\n\n constructor() {\n super();\n\n addThemingController(this, all);\n\n addKeybindings(this, {\n ref: this._headerRef,\n skip: this._skipKeyboard,\n })\n .set(arrowLeft, () => this._handleArrowKeys(isLTR(this) ? -1 : 1))\n .set(arrowRight, () => this._handleArrowKeys(isLTR(this) ? 1 : -1))\n .set(homeKey, this._handleHomeKey)\n .set(endKey, this._handleEndKey)\n .setActivateHandler(this._handleActivationKeys, {\n preventDefault: false,\n });\n\n createMutationController(this, {\n callback: this._mutationCallback,\n config: {\n attributeFilter: ['selected'],\n childList: true,\n subtree: true,\n },\n filter: [IgcTabComponent.tagName],\n });\n }\n\n protected override async firstUpdated() {\n await this.updateComplete;\n\n const selectedTab =\n this._tabs.findLast((tab) => tab.selected) ?? first(this._enabledTabs);\n\n this._domHelpers.setStyleProperties();\n this._domHelpers.setScrollButtonState();\n this._setSelectedTab(selectedTab, false);\n\n this._resizeController.observe(this._headerRef.value!);\n }\n\n /** @internal */\n public override connectedCallback(): void {\n super.connectedCallback();\n this.role = 'tablist';\n }\n\n protected override updated(): void {\n if (this._domHelpers.isLeftToRightChanged) {\n this._domHelpers.setIndicator(this._activeTab);\n }\n }\n\n //#endregion\n\n //#region Observers callbacks\n\n private _resizeCallback(): void {\n this._domHelpers.setStyleProperties();\n this._domHelpers.setScrollButtonState();\n this._domHelpers.setIndicator(this._activeTab);\n }\n\n private _mutationCallback(\n parameters: MutationControllerParams<IgcTabComponent>\n ): void {\n this._selectedAttributeChanged(parameters);\n this._handleTabsRemoved(parameters);\n this._handleTabsAdded(parameters);\n\n this._domHelpers.setStyleProperties();\n this._domHelpers.setScrollButtonState();\n this._domHelpers.setIndicator(this._activeTab);\n }\n\n private _selectedAttributeChanged({\n changes,\n }: MutationControllerParams<IgcTabComponent>): void {\n const selected = changes.attributes.find(\n ({ node: tab }) => this._tabs.includes(tab) && tab.selected\n )?.node;\n this._setSelectedTab(selected, false);\n }\n\n private _handleTabsAdded({\n changes,\n }: MutationControllerParams<IgcTabComponent>): void {\n if (!isEmpty(changes.added)) {\n const lastAdded = changes.added.findLast(\n (change) =>\n change.target.closest(this.tagName) === this && change.node.selected\n )?.node;\n\n this._setSelectedTab(lastAdded, false);\n }\n }\n\n private _handleTabsRemoved({\n changes,\n }: MutationControllerParams<IgcTabComponent>): void {\n if (!isEmpty(changes.removed)) {\n let nextSelectedTab: IgcTabComponent | null = null;\n\n const removed = changes.removed.filter(\n (change) => change.target.closest(this.tagName) === this\n );\n\n for (const each of removed) {\n if (each.node.selected && each.node === this._activeTab) {\n nextSelectedTab = first(this._enabledTabs);\n break;\n }\n }\n\n if (nextSelectedTab) {\n this._setSelectedTab(nextSelectedTab, false);\n }\n }\n }\n\n //#endregion\n\n //#region Private API\n\n private _getClosestActiveTabIndex(): number {\n const active = getRoot(this).activeElement;\n const tab = active ? active.closest(IgcTabComponent.tagName) : null;\n return tab ? this._enabledTabs.indexOf(tab) : -1;\n }\n\n private _setSelectedTab(tab?: IgcTabComponent, shouldEmit = true): void {\n if (!tab || tab === this._activeTab) {\n return;\n }\n\n if (this._activeTab) {\n this._activeTab.selected = false;\n }\n\n tab.selected = true;\n this._activeTab = tab;\n\n scrollIntoView(getTabHeader(tab));\n this._domHelpers.setIndicator(this._activeTab);\n\n if (shouldEmit) {\n this.emitEvent('igcChange', { detail: this._activeTab });\n }\n }\n\n private _keyboardActivateTab(tab: IgcTabComponent) {\n const header = getTabHeader(tab);\n\n this._domHelpers.setScrollSnap();\n scrollIntoView(header);\n header.focus({ preventScroll: true });\n\n if (this.activation === 'auto') {\n this._setSelectedTab(tab);\n }\n }\n\n private _skipKeyboard(node: Element, event: KeyboardEvent): boolean {\n return !(\n this._isEventFromTabHeader(event) &&\n this._tabs.includes(node.closest(IgcTabComponent.tagName)!)\n );\n }\n\n private _isEventFromTabHeader(event: Event) {\n return getElementFromPath('[part~=\"tab-header\"]', event);\n }\n\n //#endregion\n\n //#region Event handlers\n\n protected _handleArrowKeys(delta: -1 | 1): void {\n const tabs = this._enabledTabs;\n this._keyboardActivateTab(\n tabs[wrap(0, tabs.length - 1, this._getClosestActiveTabIndex() + delta)]\n );\n }\n\n protected _handleHomeKey(): void {\n this._keyboardActivateTab(first(this._enabledTabs));\n }\n\n protected _handleEndKey(): void {\n this._keyboardActivateTab(last(this._enabledTabs));\n }\n\n protected _handleActivationKeys(): void {\n const tabs = this._enabledTabs;\n const index = this._getClosestActiveTabIndex();\n\n if (index > -1) {\n this._setSelectedTab(tabs[index], false);\n this._keyboardActivateTab(tabs[index]);\n }\n }\n\n protected _handleClick(event: PointerEvent): void {\n if (!this._isEventFromTabHeader(event)) {\n return;\n }\n\n const tab = getElementFromPath(IgcTabComponent.tagName, event);\n\n if (!(tab && this._tabs.includes(tab)) || tab?.disabled) {\n return;\n }\n\n this._domHelpers.setScrollSnap();\n getTabHeader(tab).focus();\n this._setSelectedTab(tab);\n }\n\n @eventOptions({ passive: true })\n protected _handleScroll(): void {\n this._domHelpers.setScrollButtonState();\n }\n\n //#endregion\n\n //#region Public API methods\n\n /** Selects the specified tab and displays the corresponding panel. */\n public select(id: string): void;\n /* blazorSuppress (ref is reserved) */\n public select(ref: IgcTabComponent): void;\n /* blazorSuppress (ref is reserved) */\n public select(ref: IgcTabComponent | string): void {\n const tab = isString(ref) ? this._tabs.find((t) => t.id === ref) : ref;\n\n if (tab) {\n this._setSelectedTab(tab, false);\n }\n }\n\n //#endregion\n\n //#region Render\n\n protected _renderScrollButton(direction: 'start' | 'end') {\n const isStart = direction === 'start';\n const { start, end } = this._domHelpers.scrollButtonsDisabled;\n\n return html`${cache(\n this._domHelpers.hasScrollButtons\n ? html`\n <igc-icon-button\n tabindex=\"-1\"\n variant=\"flat\"\n collection=\"default\"\n part=\"${direction}-scroll-button\"\n exportparts=\"icon\"\n name=${isStart ? 'prev' : 'next'}\n ?disabled=${isStart ? start : end}\n @click=${() => this._domHelpers.scrollTabs(direction)}\n >\n </igc-icon-button>\n `\n : nothing\n )}`;\n }\n\n protected override render() {\n return html`\n <div\n ${ref(this._headerRef)}\n part=\"tabs\"\n style=${styleMap(this._domHelpers.styleProperties)}\n @scroll=${this._handleScroll}\n >\n <div\n part=${partMap({\n inner: true,\n scrollable: this._domHelpers.hasScrollButtons,\n })}\n >\n ${this._renderScrollButton('start')}\n <slot @click=${this._handleClick}></slot>\n ${this._renderScrollButton('end')}\n <div part=\"selected-indicator\">\n <span ${ref(this._indicatorRef)}></span>\n </div>\n </div>\n </div>\n `;\n }\n\n //#endregion\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-tabs': IgcTabsComponent;\n }\n}\n"]}
@@ -18,7 +18,7 @@ import { addSlotController, setSlots } from '../common/controllers/slot.js';
18
18
  import { registerComponent } from '../common/definitions/register.js';
19
19
  import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
20
20
  import { partMap } from '../common/part-map.js';
21
- import { asNumber, findElementFromEventPath, isLTR } from '../common/util.js';
21
+ import { asNumber, getElementFromPath, isLTR } from '../common/util.js';
22
22
  import IgcDividerComponent from '../divider/divider.js';
23
23
  import IgcResizeContainerComponent from '../resize-container/resize-container.js';
24
24
  import { createTileDragStack, swapTiles } from './position.js';
@@ -217,7 +217,7 @@ export default class IgcTileComponent extends EventEmitterMixin(LitElement) {
217
217
  if (this._maximized || this.fullscreen) {
218
218
  return true;
219
219
  }
220
- return Boolean(findElementFromEventPath((e) => e.matches('[part*=trigger]') || e.matches('#tile-actions'), event));
220
+ return Boolean(getElementFromPath((e) => e.matches('[part*=trigger]') || e.matches('#tile-actions'), event));
221
221
  }
222
222
  _match(element) {
223
223
  return element !== this && IgcTileComponent.tagName === element.localName;