igniteui-webcomponents 7.2.3 → 7.2.4

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 (104) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/animations/player.d.ts +4 -11
  3. package/animations/player.js +3 -9
  4. package/animations/player.js.map +1 -1
  5. package/animations/view-transition.d.ts +44 -0
  6. package/animations/view-transition.js +81 -0
  7. package/animations/view-transition.js.map +1 -0
  8. package/components/avatar/avatar.js +7 -7
  9. package/components/avatar/avatar.js.map +1 -1
  10. package/components/button/button-base.d.ts +1 -1
  11. package/components/button/button-base.js +7 -5
  12. package/components/button/button-base.js.map +1 -1
  13. package/components/button/icon-button.js +9 -9
  14. package/components/button/icon-button.js.map +1 -1
  15. package/components/calendar/calendar.js.map +1 -1
  16. package/components/calendar/days-view/days-view.js.map +1 -1
  17. package/components/carousel/carousel.js +1 -2
  18. package/components/carousel/carousel.js.map +1 -1
  19. package/components/chat/chat-input.js +4 -4
  20. package/components/chat/chat-input.js.map +1 -1
  21. package/components/chat/chat.js +6 -6
  22. package/components/chat/chat.js.map +1 -1
  23. package/components/chat/message-attachments.js.map +1 -1
  24. package/components/checkbox/checkbox.js.map +1 -1
  25. package/components/combo/combo.d.ts +1 -0
  26. package/components/combo/combo.js +9 -1
  27. package/components/combo/combo.js.map +1 -1
  28. package/components/common/controllers/gestures.js.map +1 -1
  29. package/components/common/controllers/internals.d.ts +9 -0
  30. package/components/common/controllers/internals.js +4 -0
  31. package/components/common/controllers/internals.js.map +1 -1
  32. package/components/common/controllers/mutation-observer.d.ts +2 -2
  33. package/components/common/controllers/mutation-observer.js +10 -7
  34. package/components/common/controllers/mutation-observer.js.map +1 -1
  35. package/components/common/controllers/slot.d.ts +1 -1
  36. package/components/common/controllers/slot.js +4 -1
  37. package/components/common/controllers/slot.js.map +1 -1
  38. package/components/common/i18n/utils.js.map +1 -1
  39. package/components/common/mixins/forms/associated.d.ts +1 -1
  40. package/components/common/mixins/forms/associated.js +21 -13
  41. package/components/common/mixins/forms/associated.js.map +1 -1
  42. package/components/common/mixins/forms/types.d.ts +2 -1
  43. package/components/common/mixins/forms/types.js.map +1 -1
  44. package/components/common/templates/masked-input.d.ts +2 -0
  45. package/components/common/templates/masked-input.js +2 -1
  46. package/components/common/templates/masked-input.js.map +1 -1
  47. package/components/date-picker/date-picker.d.ts +2 -1
  48. package/components/date-picker/date-picker.js +6 -0
  49. package/components/date-picker/date-picker.js.map +1 -1
  50. package/components/date-range-picker/date-range-mask-parser.js.map +1 -1
  51. package/components/date-range-picker/date-range-picker.d.ts +2 -1
  52. package/components/date-range-picker/date-range-picker.js +10 -8
  53. package/components/date-range-picker/date-range-picker.js.map +1 -1
  54. package/components/date-range-picker/predefined-ranges-area.js.map +1 -1
  55. package/components/date-time-input/date-time-input.base.d.ts +15 -0
  56. package/components/date-time-input/date-time-input.base.js +9 -1
  57. package/components/date-time-input/date-time-input.base.js.map +1 -1
  58. package/components/dialog/dialog.js +4 -4
  59. package/components/dialog/dialog.js.map +1 -1
  60. package/components/file-input/file-input.js.map +1 -1
  61. package/components/icon/icon-state.broadcast.js.map +1 -1
  62. package/components/icon/icon.d.ts +3 -2
  63. package/components/icon/icon.js +7 -2
  64. package/components/icon/icon.js.map +1 -1
  65. package/components/input/input-base.d.ts +15 -0
  66. package/components/input/input-base.js +8 -1
  67. package/components/input/input-base.js.map +1 -1
  68. package/components/input/input.js +1 -0
  69. package/components/input/input.js.map +1 -1
  70. package/components/mask-input/mask-input.js +1 -0
  71. package/components/mask-input/mask-input.js.map +1 -1
  72. package/components/select/select.d.ts +7 -1
  73. package/components/select/select.js +12 -1
  74. package/components/select/select.js.map +1 -1
  75. package/components/slider/range-slider.js +5 -5
  76. package/components/slider/range-slider.js.map +1 -1
  77. package/components/slider/slider-base.js +9 -9
  78. package/components/slider/slider-base.js.map +1 -1
  79. package/components/snackbar/snackbar.js +4 -4
  80. package/components/snackbar/snackbar.js.map +1 -1
  81. package/components/splitter/splitter.js.map +1 -1
  82. package/components/stepper/common/animations.js.map +1 -1
  83. package/components/stepper/step.js.map +1 -1
  84. package/components/tabs/tabs.js +29 -10
  85. package/components/tabs/tabs.js.map +1 -1
  86. package/components/textarea/textarea.js +1 -0
  87. package/components/textarea/textarea.js.map +1 -1
  88. package/components/tile-manager/tile.js +14 -13
  89. package/components/tile-manager/tile.js.map +1 -1
  90. package/components/tooltip/tooltip.js +8 -8
  91. package/components/tooltip/tooltip.js.map +1 -1
  92. package/components/tree/tree-item.js +31 -31
  93. package/components/tree/tree-item.js.map +1 -1
  94. package/components/types.js.map +1 -1
  95. package/components/validation-container/validation-container.d.ts +32 -5
  96. package/components/validation-container/validation-container.js +74 -64
  97. package/components/validation-container/validation-container.js.map +1 -1
  98. package/custom-elements.json +780 -137
  99. package/igniteui-webcomponents.html-data.json +1 -1
  100. package/index.d.ts +3 -3
  101. package/index.js.map +1 -1
  102. package/package.json +1 -1
  103. package/skills/igniteui-wc-generate-from-image-design/references/gotchas.md +15 -1
  104. package/web-types.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"date-time-input.base.js","sourceRoot":"","sources":["../../../src/components/date-time-input/date-time-input.base.ts"],"names":[],"mappings":"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","sourcesContent":["import { getDateFormatter } from 'igniteui-i18n-core';\nimport { LitElement, type PropertyValues, type TemplateResult } from 'lit';\nimport { eventOptions, property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport type { ThemingController } from '../../theming/theming-controller.js';\nimport { convertToDate } from '../calendar/helpers.js';\nimport {\n addKeybindings,\n arrowDown,\n arrowLeft,\n arrowRight,\n arrowUp,\n ctrlKey,\n} from '../common/controllers/key-bindings.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { shadowOptions } from '../common/decorators/shadow-options.js';\nimport {\n addI18nController,\n getDefaultDateTimeFormat,\n} from '../common/i18n/i18n-controller.js';\nimport { FormAssociatedRequiredMixin } from '../common/mixins/forms/associated-required.js';\nimport {\n MaskBehaviorMixin,\n type MaskSelection,\n} from '../common/mixins/mask-behavior.js';\nimport {\n nextInputId,\n renderInputShell,\n} from '../common/templates/input-shell.js';\nimport { renderMaskedNativeInput } from '../common/templates/masked-input.js';\nimport type { DatePartDeltas } from './date-part.js';\nimport { dateTimeInputValidators } from './validators.js';\n\nexport type { MaskSelection };\n\nconst Slots = setSlots(\n 'prefix',\n 'suffix',\n 'helper-text',\n 'value-missing',\n 'range-overflow',\n 'range-underflow',\n 'custom-error',\n 'invalid'\n);\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n@blazorDeepImport\n@shadowOptions({ delegatesFocus: true })\nexport abstract class IgcDateTimeInputBaseComponent extends MaskBehaviorMixin(\n FormAssociatedRequiredMixin(LitElement)\n) {\n // #region Internal state and properties\n\n protected abstract readonly _themes: ThemingController;\n\n protected readonly _slots = addSlotController(this, { slots: Slots });\n\n protected readonly _inputId = nextInputId();\n\n @query('input')\n protected override readonly _input?: HTMLInputElement;\n\n protected override get __validators() {\n return dateTimeInputValidators;\n }\n\n private readonly _i18nController = addI18nController(this, {\n defaultEN: {},\n onResourceChange: this._handleResourceChange,\n });\n\n protected _min: Date | null = null;\n protected _max: Date | null = null;\n\n protected _defaultMask!: string;\n\n protected _defaultDisplayFormat = '';\n protected _displayFormat?: string;\n protected _inputFormat?: string;\n\n protected get _targetDatePart(): unknown {\n return this._focused\n ? this._getDatePartAtCursor()\n : this._getDefaultDatePart();\n }\n\n // #endregion\n\n // #region Public attributes and properties\n\n /**\n * Whether the control will have outlined appearance.\n *\n * @attr\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public outlined = false;\n\n /**\n * The placeholder attribute of the control.\n * @attr\n */\n @property()\n public placeholder!: string;\n\n /**\n * The label for the control.\n * @attr\n */\n @property()\n public label!: string;\n\n /**\n * The date format to apply on the input.\n * @attr input-format\n */\n @property({ attribute: 'input-format' })\n public get inputFormat(): string {\n return this._inputFormat || this._parser.mask;\n }\n\n public set inputFormat(val: string) {\n if (val) {\n this._applyMask(val);\n this._inputFormat = val;\n this._updateMaskDisplay();\n }\n }\n\n /**\n * The minimum value required for the input to remain valid.\n * @attr\n */\n @property({ converter: convertToDate })\n public set min(value: Date | string | null | undefined) {\n this._min = convertToDate(value);\n this._validate();\n }\n\n public get min(): Date | null {\n return this._min;\n }\n\n /**\n * The maximum value required for the input to remain valid.\n * @attr\n */\n @property({ converter: convertToDate })\n public set max(value: Date | string | null | undefined) {\n this._max = convertToDate(value);\n this._validate();\n }\n\n public get max(): Date | null {\n return this._max;\n }\n\n /**\n * Format to display the value in when not editing.\n * Defaults to the locale format if not set.\n * @attr display-format\n */\n @property({ attribute: 'display-format' })\n public set displayFormat(value: string) {\n this._displayFormat = value;\n }\n\n public get displayFormat(): string {\n return (\n this._displayFormat ?? this._inputFormat ?? this._defaultDisplayFormat\n );\n }\n\n /**\n * Delta values used to increment or decrement each date part on step actions.\n * All values default to `1`.\n */\n @property({ attribute: false })\n public spinDelta?: DatePartDeltas;\n\n /**\n * Sets whether to loop over the currently spun segment.\n * @attr spin-loop\n */\n @property({ type: Boolean, attribute: 'spin-loop' })\n public spinLoop = true;\n\n /**\n * Gets/Sets the locale used for formatting the display value.\n * @attr locale\n */\n @property()\n public set locale(value: string) {\n this._i18nController.locale = value;\n }\n\n public get locale(): string {\n return this._i18nController.locale;\n }\n\n // #endregion\n\n //#region Lifecycle Hooks\n\n constructor() {\n super();\n\n addKeybindings(this, {\n skip: () => this.readOnly,\n bindingDefaults: { repeat: true },\n })\n .set([ctrlKey, ';'], this._setCurrentDateTime)\n .set(arrowUp, this._keyboardSpin.bind(this, 'up'))\n .set(arrowDown, this._keyboardSpin.bind(this, 'down'))\n .set([ctrlKey, arrowLeft], this._navigateParts.bind(this, 0))\n .set([ctrlKey, arrowRight], this._navigateParts.bind(this, 1));\n }\n\n protected override update(props: PropertyValues<this>): void {\n if (props.has('displayFormat')) {\n this._updateDefaultDisplayFormat();\n }\n\n if (props.has('locale')) {\n this._initializeDefaultMask();\n }\n\n if (props.has('displayFormat') || props.has('locale')) {\n this._updateMaskDisplay();\n }\n\n super.update(props);\n }\n\n //#endregion\n\n // #region Event handlers\n\n private _handleResourceChange(): void {\n this._initializeDefaultMask();\n this._updateMaskDisplay();\n }\n\n protected _handleDragLeave(): void {\n if (!this._focused) {\n this._updateMaskDisplay();\n }\n }\n\n protected _handleDragEnter(): void {\n if (!this._focused) {\n this._maskedValue = this._buildMaskedValue();\n }\n }\n\n /**\n * Handles wheel events for spinning date parts.\n */\n @eventOptions({ passive: false })\n protected async _handleWheel(event: WheelEvent): Promise<void> {\n if (!this._focused || this.readOnly) return;\n\n event.preventDefault();\n event.stopPropagation();\n\n const { start, end } = this._inputSelection;\n event.deltaY > 0 ? this.stepDown() : this.stepUp();\n this._emitInputEvent();\n\n await this.updateComplete;\n this.setSelectionRange(start, end);\n }\n\n // #endregion\n\n //#region Keybindings\n\n /**\n * Navigates to the previous or next date part.\n */\n protected _navigateParts(direction: number): void {\n const position = this._calculatePartNavigationPosition(\n this._input?.value ?? '',\n direction\n );\n this.setSelectionRange(position, position);\n }\n\n /**\n * Handles keyboard-triggered spinning (arrow up/down).\n */\n protected async _keyboardSpin(direction: 'up' | 'down'): Promise<void> {\n direction === 'up' ? this.stepUp() : this.stepDown();\n this._emitInputEvent();\n await this.updateComplete;\n this.setSelectionRange(this._maskSelection.start, this._maskSelection.end);\n }\n\n // #endregion\n\n //#region Internal API\n\n /**\n * Common logic for stepping up or down a date part.\n * @internal\n */\n protected _performStep(\n datePart: unknown,\n delta: number | undefined,\n isDecrement: boolean\n ): void {\n const part = datePart || this._targetDatePart;\n if (!part) return;\n\n const { start, end } = this._inputSelection;\n const newValue = this._calculateSpunValue(part, delta, isDecrement);\n this._commitSpunValue(newValue);\n this.updateComplete.then(() => this._input?.setSelectionRange(start, end));\n }\n\n /**\n * Updates the displayed mask value based on focus state.\n * When focused, shows the editable mask. When unfocused, defers to the leaf's display formatter.\n */\n protected _updateMaskDisplay(): void {\n this._maskedValue = this._focused\n ? this._buildMaskedValue()\n : this._buildDisplayValue();\n }\n\n /**\n * Checks if all mask positions are filled (no prompt characters remain).\n */\n protected _isMaskComplete(): boolean {\n return !this._maskedValue.includes(this.prompt);\n }\n\n /**\n * Applies a mask pattern to the input, parsing the format string into date parts.\n */\n protected _applyMask(formatString: string): void {\n const previous = this._parser.mask;\n this._parser.mask = formatString;\n\n // Update placeholder if not set or if it matches the old format\n if (!this.placeholder || previous === this.placeholder) {\n this.placeholder = this._parser.mask;\n }\n }\n\n /**\n * Updates the default display format based on current locale.\n */\n private _updateDefaultDisplayFormat(): void {\n this._defaultDisplayFormat = getDateFormatter().getLocaleDateTimeFormat(\n this.locale\n );\n }\n\n protected _initializeDefaultMask(): void {\n this._updateDefaultDisplayFormat();\n\n if (!this._inputFormat) {\n this._applyMask(getDefaultDateTimeFormat(this.locale));\n }\n }\n\n /**\n * Resolves the part names for the container based on the current state.\n */\n protected _resolvePartNames(base: string): Record<string, boolean> {\n return {\n [base]: true,\n prefixed: this._slots.hasAssignedElements('prefix', {\n selector: '[slot=\"prefix\"]:not([hidden])',\n }),\n suffixed: this._slots.hasAssignedElements('suffix', {\n selector: '[slot=\"suffix\"]:not([hidden])',\n }),\n filled: !this._isEmptyMask,\n };\n }\n\n // #endregion\n\n // #region Public API\n\n /** Selects all the text inside the input. */\n public select(): void {\n this._input?.select();\n }\n\n /* alternateName: focusComponent */\n /** Sets focus on the control. */\n public override focus(options?: FocusOptions): void {\n this._input?.focus(options);\n }\n\n /* alternateName: blurComponent */\n /** Removes focus from the control. */\n public override blur(): void {\n this._input?.blur();\n }\n\n /* blazorSuppress */\n /** Increments a date/time portion. */\n public stepUp(datePart?: unknown, delta?: number): void {\n this._performStep(datePart, delta, false);\n }\n\n /* blazorSuppress */\n /** Decrements a date/time portion. */\n public stepDown(datePart?: unknown, delta?: number): void {\n this._performStep(datePart, delta, true);\n }\n\n /** Clears the input element of user input. */\n public abstract clear(): void;\n\n //#endregion\n\n //#region Render\n\n protected _renderInput(): TemplateResult {\n const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';\n const hasHelperText = this._slots.hasAssignedElements('helper-text');\n\n return renderMaskedNativeInput({\n id: this._inputId,\n partNames: this._resolvePartNames('input'),\n name: this.name,\n value: this._maskedValue,\n placeholder: this.placeholder || this._parser.emptyMask,\n readOnly: this.readOnly,\n disabled: this.disabled,\n tabindex: hasNegativeTabIndex ? -1 : undefined,\n ariaDescribedBy: hasHelperText ? 'helper-text' : undefined,\n onInput: this._handleInput,\n onFocus: this._handleFocus,\n onBlur: this._handleBlur,\n onClick: this._handleClick,\n onSetMaskSelection: this._setMaskSelection,\n onCompositionStart: this._handleCompositionStart,\n onCompositionEnd: this._handleCompositionEnd,\n onWheel: this._handleWheel,\n onDragEnter: this._handleDragEnter,\n onDragLeave: this._handleDragLeave,\n });\n }\n\n protected override render() {\n return cache(\n renderInputShell(this, {\n theme: this._themes.theme,\n label: this.label,\n labelId: this._inputId,\n containerParts: this._resolvePartNames('container'),\n renderInput: this._renderInput,\n })\n );\n }\n\n //#endregion\n\n // #region Abstract methods and properties\n\n protected abstract get _datePartDeltas(): DatePartDeltas;\n\n protected abstract _buildMaskedValue(): string;\n protected abstract _buildDisplayValue(): string;\n protected abstract override _syncValueFromMask(): void;\n protected abstract _calculatePartNavigationPosition(\n value: string,\n direction: number\n ): number;\n protected abstract _calculateSpunValue(\n part: unknown,\n delta: number | undefined,\n isDecrement: boolean\n ): unknown;\n protected abstract _commitSpunValue(value: unknown): void;\n protected abstract _setCurrentDateTime(): void;\n protected abstract _handleFocus(): Promise<void>;\n protected abstract _getDatePartAtCursor(): unknown;\n protected abstract _getDefaultDatePart(): unknown;\n\n public abstract hasDateParts(): boolean;\n public abstract hasTimeParts(): boolean;\n\n // #endregion\n}\n"]}
1
+ {"version":3,"file":"date-time-input.base.js","sourceRoot":"","sources":["../../../src/components/date-time-input/date-time-input.base.ts"],"names":[],"mappings":"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","sourcesContent":["import { getDateFormatter } from 'igniteui-i18n-core';\nimport { LitElement, type PropertyValues, type TemplateResult } from 'lit';\nimport { eventOptions, property, query, state } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport type { ThemingController } from '../../theming/theming-controller.js';\nimport { convertToDate } from '../calendar/helpers.js';\nimport {\n addKeybindings,\n arrowDown,\n arrowLeft,\n arrowRight,\n arrowUp,\n ctrlKey,\n} from '../common/controllers/key-bindings.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { shadowOptions } from '../common/decorators/shadow-options.js';\nimport {\n addI18nController,\n getDefaultDateTimeFormat,\n} from '../common/i18n/i18n-controller.js';\nimport { FormAssociatedRequiredMixin } from '../common/mixins/forms/associated-required.js';\nimport {\n MaskBehaviorMixin,\n type MaskSelection,\n} from '../common/mixins/mask-behavior.js';\nimport {\n nextInputId,\n renderInputShell,\n} from '../common/templates/input-shell.js';\nimport { renderMaskedNativeInput } from '../common/templates/masked-input.js';\nimport type { DatePartDeltas } from './date-part.js';\nimport { dateTimeInputValidators } from './validators.js';\n\nexport type { MaskSelection };\n\nconst Slots = setSlots(\n 'prefix',\n 'suffix',\n 'helper-text',\n 'value-missing',\n 'range-overflow',\n 'range-underflow',\n 'custom-error',\n 'invalid'\n);\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n@blazorDeepImport\n@shadowOptions({ delegatesFocus: true })\nexport abstract class IgcDateTimeInputBaseComponent extends MaskBehaviorMixin(\n FormAssociatedRequiredMixin(LitElement)\n) {\n // #region Internal state and properties\n\n protected abstract readonly _themes: ThemingController;\n\n protected readonly _slots = addSlotController(this, { slots: Slots });\n\n protected readonly _inputId = nextInputId();\n\n @query('input')\n protected override readonly _input?: HTMLInputElement;\n\n /**\n * Externally supplied label elements forwarded by a composite host (e.g. `igc-date-picker`)\n * so that the host's associated labels reach the inner native input. When set, these take\n * precedence over the component's own `ElementInternals` labels.\n *\n * @hidden @internal\n */\n @state()\n public _labelElements: ReadonlyArray<Element> | null = null;\n\n /**\n * Resolves the label elements applied to the native input as `aria-labelledby` targets,\n * preferring forwarded labels over the component's own `ElementInternals` labels.\n *\n * @hidden @internal\n */\n protected get _resolvedLabelElements(): ReadonlyArray<Element> | null {\n return this._labelElements ?? this._internals.labels;\n }\n\n protected override get __validators() {\n return dateTimeInputValidators;\n }\n\n private readonly _i18nController = addI18nController(this, {\n defaultEN: {},\n onResourceChange: this._handleResourceChange,\n });\n\n protected _min: Date | null = null;\n protected _max: Date | null = null;\n\n protected _defaultMask!: string;\n\n protected _defaultDisplayFormat = '';\n protected _displayFormat?: string;\n protected _inputFormat?: string;\n\n protected get _targetDatePart(): unknown {\n return this._focused\n ? this._getDatePartAtCursor()\n : this._getDefaultDatePart();\n }\n\n // #endregion\n\n // #region Public attributes and properties\n\n /**\n * Whether the control will have outlined appearance.\n *\n * @attr\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public outlined = false;\n\n /**\n * The placeholder attribute of the control.\n * @attr\n */\n @property()\n public placeholder!: string;\n\n /**\n * The label for the control.\n * @attr\n */\n @property()\n public label!: string;\n\n /**\n * The date format to apply on the input.\n * @attr input-format\n */\n @property({ attribute: 'input-format' })\n public get inputFormat(): string {\n return this._inputFormat || this._parser.mask;\n }\n\n public set inputFormat(val: string) {\n if (val) {\n this._applyMask(val);\n this._inputFormat = val;\n this._updateMaskDisplay();\n }\n }\n\n /**\n * The minimum value required for the input to remain valid.\n * @attr\n */\n @property({ converter: convertToDate })\n public set min(value: Date | string | null | undefined) {\n this._min = convertToDate(value);\n this._validate();\n }\n\n public get min(): Date | null {\n return this._min;\n }\n\n /**\n * The maximum value required for the input to remain valid.\n * @attr\n */\n @property({ converter: convertToDate })\n public set max(value: Date | string | null | undefined) {\n this._max = convertToDate(value);\n this._validate();\n }\n\n public get max(): Date | null {\n return this._max;\n }\n\n /**\n * Format to display the value in when not editing.\n * Defaults to the locale format if not set.\n * @attr display-format\n */\n @property({ attribute: 'display-format' })\n public set displayFormat(value: string) {\n this._displayFormat = value;\n }\n\n public get displayFormat(): string {\n return (\n this._displayFormat ?? this._inputFormat ?? this._defaultDisplayFormat\n );\n }\n\n /**\n * Delta values used to increment or decrement each date part on step actions.\n * All values default to `1`.\n */\n @property({ attribute: false })\n public spinDelta?: DatePartDeltas;\n\n /**\n * Sets whether to loop over the currently spun segment.\n * @attr spin-loop\n */\n @property({ type: Boolean, attribute: 'spin-loop' })\n public spinLoop = true;\n\n /**\n * Gets/Sets the locale used for formatting the display value.\n * @attr locale\n */\n @property()\n public set locale(value: string) {\n this._i18nController.locale = value;\n }\n\n public get locale(): string {\n return this._i18nController.locale;\n }\n\n // #endregion\n\n //#region Lifecycle Hooks\n\n constructor() {\n super();\n\n addKeybindings(this, {\n skip: () => this.readOnly,\n bindingDefaults: { repeat: true },\n })\n .set([ctrlKey, ';'], this._setCurrentDateTime)\n .set(arrowUp, this._keyboardSpin.bind(this, 'up'))\n .set(arrowDown, this._keyboardSpin.bind(this, 'down'))\n .set([ctrlKey, arrowLeft], this._navigateParts.bind(this, 0))\n .set([ctrlKey, arrowRight], this._navigateParts.bind(this, 1));\n }\n\n protected override update(props: PropertyValues<this>): void {\n if (props.has('displayFormat')) {\n this._updateDefaultDisplayFormat();\n }\n\n if (props.has('locale')) {\n this._initializeDefaultMask();\n }\n\n if (props.has('displayFormat') || props.has('locale')) {\n this._updateMaskDisplay();\n }\n\n super.update(props);\n }\n\n //#endregion\n\n // #region Event handlers\n\n private _handleResourceChange(): void {\n this._initializeDefaultMask();\n this._updateMaskDisplay();\n }\n\n protected _handleDragLeave(): void {\n if (!this._focused) {\n this._updateMaskDisplay();\n }\n }\n\n protected _handleDragEnter(): void {\n if (!this._focused) {\n this._maskedValue = this._buildMaskedValue();\n }\n }\n\n /**\n * Handles wheel events for spinning date parts.\n */\n @eventOptions({ passive: false })\n protected async _handleWheel(event: WheelEvent): Promise<void> {\n if (!this._focused || this.readOnly) return;\n\n event.preventDefault();\n event.stopPropagation();\n\n const { start, end } = this._inputSelection;\n event.deltaY > 0 ? this.stepDown() : this.stepUp();\n this._emitInputEvent();\n\n await this.updateComplete;\n this.setSelectionRange(start, end);\n }\n\n // #endregion\n\n //#region Keybindings\n\n /**\n * Navigates to the previous or next date part.\n */\n protected _navigateParts(direction: number): void {\n const position = this._calculatePartNavigationPosition(\n this._input?.value ?? '',\n direction\n );\n this.setSelectionRange(position, position);\n }\n\n /**\n * Handles keyboard-triggered spinning (arrow up/down).\n */\n protected async _keyboardSpin(direction: 'up' | 'down'): Promise<void> {\n direction === 'up' ? this.stepUp() : this.stepDown();\n this._emitInputEvent();\n await this.updateComplete;\n this.setSelectionRange(this._maskSelection.start, this._maskSelection.end);\n }\n\n // #endregion\n\n //#region Internal API\n\n /**\n * Common logic for stepping up or down a date part.\n * @internal\n */\n protected _performStep(\n datePart: unknown,\n delta: number | undefined,\n isDecrement: boolean\n ): void {\n const part = datePart || this._targetDatePart;\n if (!part) return;\n\n const { start, end } = this._inputSelection;\n const newValue = this._calculateSpunValue(part, delta, isDecrement);\n this._commitSpunValue(newValue);\n this.updateComplete.then(() => this._input?.setSelectionRange(start, end));\n }\n\n /**\n * Updates the displayed mask value based on focus state.\n * When focused, shows the editable mask. When unfocused, defers to the leaf's display formatter.\n */\n protected _updateMaskDisplay(): void {\n this._maskedValue = this._focused\n ? this._buildMaskedValue()\n : this._buildDisplayValue();\n }\n\n /**\n * Checks if all mask positions are filled (no prompt characters remain).\n */\n protected _isMaskComplete(): boolean {\n return !this._maskedValue.includes(this.prompt);\n }\n\n /**\n * Applies a mask pattern to the input, parsing the format string into date parts.\n */\n protected _applyMask(formatString: string): void {\n const previous = this._parser.mask;\n this._parser.mask = formatString;\n\n // Update placeholder if not set or if it matches the old format\n if (!this.placeholder || previous === this.placeholder) {\n this.placeholder = this._parser.mask;\n }\n }\n\n /**\n * Updates the default display format based on current locale.\n */\n private _updateDefaultDisplayFormat(): void {\n this._defaultDisplayFormat = getDateFormatter().getLocaleDateTimeFormat(\n this.locale\n );\n }\n\n protected _initializeDefaultMask(): void {\n this._updateDefaultDisplayFormat();\n\n if (!this._inputFormat) {\n this._applyMask(getDefaultDateTimeFormat(this.locale));\n }\n }\n\n /**\n * Resolves the part names for the container based on the current state.\n */\n protected _resolvePartNames(base: string): Record<string, boolean> {\n return {\n [base]: true,\n prefixed: this._slots.hasAssignedElements('prefix', {\n selector: '[slot=\"prefix\"]:not([hidden])',\n }),\n suffixed: this._slots.hasAssignedElements('suffix', {\n selector: '[slot=\"suffix\"]:not([hidden])',\n }),\n filled: !this._isEmptyMask,\n };\n }\n\n // #endregion\n\n // #region Public API\n\n /** Selects all the text inside the input. */\n public select(): void {\n this._input?.select();\n }\n\n /* alternateName: focusComponent */\n /** Sets focus on the control. */\n public override focus(options?: FocusOptions): void {\n this._input?.focus(options);\n }\n\n /* alternateName: blurComponent */\n /** Removes focus from the control. */\n public override blur(): void {\n this._input?.blur();\n }\n\n /* blazorSuppress */\n /** Increments a date/time portion. */\n public stepUp(datePart?: unknown, delta?: number): void {\n this._performStep(datePart, delta, false);\n }\n\n /* blazorSuppress */\n /** Decrements a date/time portion. */\n public stepDown(datePart?: unknown, delta?: number): void {\n this._performStep(datePart, delta, true);\n }\n\n /** Clears the input element of user input. */\n public abstract clear(): void;\n\n //#endregion\n\n //#region Render\n\n protected _renderInput(): TemplateResult {\n const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';\n const hasHelperText = this._slots.hasAssignedElements('helper-text');\n\n return renderMaskedNativeInput({\n id: this._inputId,\n partNames: this._resolvePartNames('input'),\n name: this.name,\n value: this._maskedValue,\n placeholder: this.placeholder || this._parser.emptyMask,\n readOnly: this.readOnly,\n disabled: this.disabled,\n tabindex: hasNegativeTabIndex ? -1 : undefined,\n ariaDescribedBy: hasHelperText ? 'helper-text' : undefined,\n ariaLabelledByElements: this._resolvedLabelElements,\n onInput: this._handleInput,\n onFocus: this._handleFocus,\n onBlur: this._handleBlur,\n onClick: this._handleClick,\n onSetMaskSelection: this._setMaskSelection,\n onCompositionStart: this._handleCompositionStart,\n onCompositionEnd: this._handleCompositionEnd,\n onWheel: this._handleWheel,\n onDragEnter: this._handleDragEnter,\n onDragLeave: this._handleDragLeave,\n });\n }\n\n protected override render() {\n return cache(\n renderInputShell(this, {\n theme: this._themes.theme,\n label: this.label,\n labelId: this._inputId,\n containerParts: this._resolvePartNames('container'),\n renderInput: this._renderInput,\n })\n );\n }\n\n //#endregion\n\n // #region Abstract methods and properties\n\n protected abstract get _datePartDeltas(): DatePartDeltas;\n\n protected abstract _buildMaskedValue(): string;\n protected abstract _buildDisplayValue(): string;\n protected abstract override _syncValueFromMask(): void;\n protected abstract _calculatePartNavigationPosition(\n value: string,\n direction: number\n ): number;\n protected abstract _calculateSpunValue(\n part: unknown,\n delta: number | undefined,\n isDecrement: boolean\n ): unknown;\n protected abstract _commitSpunValue(value: unknown): void;\n protected abstract _setCurrentDateTime(): void;\n protected abstract _handleFocus(): Promise<void>;\n protected abstract _getDatePartAtCursor(): unknown;\n protected abstract _getDefaultDatePart(): unknown;\n\n public abstract hasDateParts(): boolean;\n public abstract hasTimeParts(): boolean;\n\n // #endregion\n}\n"]}
@@ -153,10 +153,10 @@ export default class IgcDialogComponent extends EventEmitterMixin(LitElement) {
153
153
  ${this.hideDefaultAction
154
154
  ? nothing
155
155
  : html `
156
- <igc-button variant="flat" @click=${this._closeWithEvent}>
157
- OK
158
- </igc-button>
159
- `}
156
+ <igc-button variant="flat" @click=${this._closeWithEvent}>
157
+ OK
158
+ </igc-button>
159
+ `}
160
160
  </slot>
161
161
  </footer>
162
162
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../src/components/dialog/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, type PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { addAnimationController } from '../../animations/player.js';\nimport { fadeIn, fadeOut } from '../../animations/presets/fade/index.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { addCommandController } from '../common/controllers/command.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 { partMap } from '../common/part-map.js';\nimport { bindIf, numberInRangeInclusive } from '../common/util.js';\nimport { styles } from './themes/dialog.base.css.js';\nimport { styles as shared } from './themes/shared/dialog.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcDialogComponentEventMap {\n igcClosing: CustomEvent<void>;\n igcClosed: CustomEvent<void>;\n}\n\nlet nextId = 1;\n\n/* blazorAdditionalDependency: IgcButtonComponent */\n/**\n * A modal dialog component built on the native `<dialog>` element.\n *\n * The dialog traps focus while open and blocks interaction with the rest\n * of the page (modal semantics). It supports animated open/close\n * transitions, an optional backdrop overlay, and multiple content areas\n * through named slots.\n *\n * The component integrates with the\n * [Invoker Commands API](https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API):\n * an Ignite button or a native `<button>` with `command=\"--show\"` / `\"--hide\"` / `\"--toggle\"`\n * and `commandfor` pointing to this element will call the corresponding method\n * declaratively without any JavaScript.\n *\n * @element igc-dialog\n *\n * @fires igcClosing - Emitted just before the dialog closes. Cancelable —\n * call `event.preventDefault()` to abort the closing sequence.\n * @fires igcClosed - Emitted after the dialog has fully closed and its\n * exit animation has completed.\n *\n * @slot - General-purpose content area. Also the target for any\n * `<form method=\"dialog\">` placed inside the dialog.\n * @slot title - Content rendered in the dialog header. Falls back to the\n * `title` attribute when empty.\n * @slot message - A dedicated message/body area rendered above the default\n * slot. Hidden when no content is assigned.\n * @slot footer - Content rendered in the dialog footer. When empty, a\n * default \"OK\" close button is shown (unless `hide-default-action` is set).\n *\n * @csspart base - The native `<dialog>` element.\n * @csspart title - The `<header>` element wrapping the title slot.\n * @csspart content - The `<section>` element wrapping the message and default slots.\n * @csspart footer - The `<footer>` element wrapping the footer slot.\n * @csspart backdrop - The decorative backdrop overlay element.\n * @csspart animating - Applied to the backdrop while an animation is running.\n */\nexport default class IgcDialogComponent extends EventEmitterMixin<\n IgcDialogComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-dialog';\n public static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcDialogComponent, IgcButtonComponent);\n }\n\n //#region Private state and properties\n\n private readonly _titleId = `title-${nextId++}`;\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots('title', 'message', 'footer'),\n });\n\n private readonly _dialogRef = createRef<HTMLDialogElement>();\n private readonly _player = addAnimationController(this, this._dialogRef);\n\n /**\n * Backdrop animation helper.\n */\n @state()\n private _animating = false;\n\n private get _dialog(): HTMLDialogElement | undefined {\n return this._dialogRef.value;\n }\n\n //#endregion\n\n //#region Public properties\n\n /**\n * When set, pressing the `Escape` key will not close the dialog.\n *\n * By default the browser closes a modal dialog on `Escape`. Enable this\n * option when the dialog guards unsaved work and should require an explicit\n * user action to dismiss.\n * @attr keep-open-on-escape\n * @default false\n */\n @property({ type: Boolean, attribute: 'keep-open-on-escape' })\n public keepOpenOnEscape = false;\n\n /**\n * When set, clicking on the backdrop area outside the dialog surface\n * will close it (emitting close events).\n *\n * Has no effect when the dialog is not yet open.\n * @attr close-on-outside-click\n * @default false\n */\n @property({ type: Boolean, attribute: 'close-on-outside-click' })\n public closeOnOutsideClick = false;\n\n /**\n * When set, the built-in \"OK\" close button in the footer is not rendered.\n *\n * Has no effect when content is projected into the `footer` slot, since\n * the slot content replaces the default button entirely.\n * @attr hide-default-action\n * @default false\n */\n @property({ type: Boolean, attribute: 'hide-default-action' })\n public hideDefaultAction = false;\n\n /**\n * Whether the dialog is open.\n *\n * Setting this property programmatically will open or close the dialog\n * without animation and without emitting close events.\n * Prefer the `show()`, `hide()`, and `toggle()` methods for animated\n * transitions.\n * @attr open\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * The title displayed in the dialog header.\n *\n * Overridden by any content projected into the `title` slot.\n * @attr title\n */\n @property()\n public override title!: string;\n\n /**\n * The return value of the dialog.\n *\n * Automatically set to the `value` of the submitter element when a\n * `<form method=\"dialog\">` inside the dialog is submitted. Can also\n * be set programmatically before calling `hide()`.\n */\n @property({ attribute: false })\n public returnValue?: string;\n\n //#endregion\n\n //#region Lifecycle\n\n constructor() {\n super();\n\n addThemingController(this, all);\n addCommandController(this)\n .set('--show', this.show)\n .set('--hide', this.hide)\n .set('--toggle', this.toggle);\n }\n\n protected override updated(properties: PropertyValues<this>): void {\n if (properties.has('open')) {\n this.open ? this._dialog?.showModal() : this._dialog?.close();\n }\n }\n\n //#endregion\n\n //#region Event handlers\n\n protected _handleFormSubmit(event: SubmitEvent): void {\n const form = event.target as HTMLFormElement;\n\n if (form.method === 'dialog') {\n if (hasSubmitter(event.submitter)) {\n this.returnValue = event.submitter.value ?? '';\n }\n\n if (!event.defaultPrevented) {\n this._closeWithEvent();\n }\n }\n }\n\n private _handleCancel(event: Event): void {\n event.preventDefault();\n\n if (!this.keepOpenOnEscape) {\n this._closeWithEvent();\n }\n }\n\n private _handleClose(): void {\n // When a non-cancelable close event is fired (e.g., from repeated Escape presses),\n // reopen the dialog to prevent the broken state with visible backdrop.\n // Note that this handler is invoked only when `keepOpenOnEscape` is true.\n if (this.open) {\n this._dialog?.showModal();\n }\n }\n\n private _handleClick({ clientX, clientY, target }: PointerEvent): void {\n if (this.closeOnOutsideClick && this._dialog === target) {\n const rect = this._dialog.getBoundingClientRect();\n const inX = numberInRangeInclusive(clientX, rect.left, rect.right);\n const inY = numberInRangeInclusive(clientY, rect.top, rect.bottom);\n\n if (!(inX && inY)) {\n this._closeWithEvent();\n }\n }\n }\n\n //#endregion\n\n //#region Internal API\n\n private async _hide(emitEvent = false): Promise<boolean> {\n if (!this.open || (emitEvent && !this._emitClosing())) {\n return false;\n }\n\n this._animating = true;\n await this._player.playExclusive(fadeOut());\n this.open = false;\n this._animating = false;\n\n if (emitEvent) {\n await this.updateComplete;\n this.emitEvent('igcClosed');\n }\n\n return true;\n }\n\n private _emitClosing(): boolean {\n return this.emitEvent('igcClosing', { cancelable: true });\n }\n\n private _closeWithEvent(): void {\n this._hide(true);\n }\n\n //#endregion\n\n //#region Public API\n\n /**\n * Opens the dialog with an animated fade-in transition.\n *\n * Returns `true` when the dialog was successfully opened, or `false` if\n * it was already open.\n */\n public async show(): Promise<boolean> {\n if (this.open) {\n return false;\n }\n\n this.open = true;\n await this._player.playExclusive(fadeIn());\n return true;\n }\n\n /**\n * Closes the dialog with an animated fade-out transition.\n *\n * Returns `true` when the dialog was successfully closed, or `false` if\n * it was already closed.\n */\n public async hide(): Promise<boolean> {\n return this._hide();\n }\n\n /**\n * Toggles the dialog open or closed depending on its current state.\n *\n * Equivalent to calling `show()` when closed and `hide()` when open.\n * Returns `true` when the transition completed successfully.\n */\n public async toggle(): Promise<boolean> {\n return this.open ? this.hide() : this.show();\n }\n\n //#endregion\n\n //#region Render methods\n\n protected _renderBackdrop() {\n return html`\n <div\n aria-hidden=${!this.open}\n part=${partMap({ backdrop: true, animating: this._animating })}\n ></div>\n `;\n }\n\n protected _renderHeader() {\n return html`\n <header part=\"title\" id=${this._titleId}>\n <slot name=\"title\">\n <span>${this.title}</span>\n </slot>\n </header>\n `;\n }\n\n protected _renderContent() {\n const hasMessage = this._slots.hasAssignedElements('message');\n return html`\n <section part=\"content\">\n <slot name=\"message\" ?hidden=${!hasMessage}></slot>\n <slot @submit=${this._handleFormSubmit}></slot>\n </section>\n `;\n }\n\n protected _renderFooter() {\n return html`\n <footer part=\"footer\">\n <slot name=\"footer\">\n ${this.hideDefaultAction\n ? nothing\n : html`\n <igc-button variant=\"flat\" @click=${this._closeWithEvent}>\n OK\n </igc-button>\n `}\n </slot>\n </footer>\n `;\n }\n\n protected override render() {\n const hasTitle = this._slots.hasAssignedElements('title') || !!this.title;\n const hasFooter =\n this._slots.hasAssignedElements('footer') || !this.hideDefaultAction;\n const labelledBy = this.ariaLabel ?? this._titleId;\n\n return html`\n ${this._renderBackdrop()}\n <dialog\n ${ref(this._dialogRef)}\n part=${partMap({ base: true, titled: hasTitle, footed: hasFooter })}\n role=\"dialog\"\n aria-label=${bindIf(this.ariaLabel, this.ariaLabel)}\n aria-labelledby=${bindIf(labelledBy, labelledBy)}\n @click=${this._handleClick}\n @cancel=${this._handleCancel}\n @close=${bindIf(this.keepOpenOnEscape, this._handleClose)}\n >\n ${this._renderHeader()} ${this._renderContent()} ${this._renderFooter()}\n </dialog>\n `;\n }\n\n //#endregion\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-dialog': IgcDialogComponent;\n }\n}\n\nfunction hasSubmitter(\n submitter: SubmitEvent['submitter']\n): submitter is HTMLButtonElement | HTMLInputElement {\n return submitter != null;\n}\n"]}
1
+ {"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../src/components/dialog/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, type PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { addAnimationController } from '../../animations/player.js';\nimport { fadeIn, fadeOut } from '../../animations/presets/fade/index.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { addCommandController } from '../common/controllers/command.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 { partMap } from '../common/part-map.js';\nimport { bindIf, numberInRangeInclusive } from '../common/util.js';\nimport { styles } from './themes/dialog.base.css.js';\nimport { styles as shared } from './themes/shared/dialog.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcDialogComponentEventMap {\n igcClosing: CustomEvent<void>;\n igcClosed: CustomEvent<void>;\n}\n\nlet nextId = 1;\n\n/* blazorAdditionalDependency: IgcButtonComponent */\n/**\n * A modal dialog component built on the native `<dialog>` element.\n *\n * The dialog traps focus while open and blocks interaction with the rest\n * of the page (modal semantics). It supports animated open/close\n * transitions, an optional backdrop overlay, and multiple content areas\n * through named slots.\n *\n * The component integrates with the\n * [Invoker Commands API](https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API):\n * an Ignite button or a native `<button>` with `command=\"--show\"` / `\"--hide\"` / `\"--toggle\"`\n * and `commandfor` pointing to this element will call the corresponding method\n * declaratively without any JavaScript.\n *\n * @element igc-dialog\n *\n * @fires igcClosing - Emitted just before the dialog closes. Cancelable —\n * call `event.preventDefault()` to abort the closing sequence.\n * @fires igcClosed - Emitted after the dialog has fully closed and its\n * exit animation has completed.\n *\n * @slot - General-purpose content area. Also the target for any\n * `<form method=\"dialog\">` placed inside the dialog.\n * @slot title - Content rendered in the dialog header. Falls back to the\n * `title` attribute when empty.\n * @slot message - A dedicated message/body area rendered above the default\n * slot. Hidden when no content is assigned.\n * @slot footer - Content rendered in the dialog footer. When empty, a\n * default \"OK\" close button is shown (unless `hide-default-action` is set).\n *\n * @csspart base - The native `<dialog>` element.\n * @csspart title - The `<header>` element wrapping the title slot.\n * @csspart content - The `<section>` element wrapping the message and default slots.\n * @csspart footer - The `<footer>` element wrapping the footer slot.\n * @csspart backdrop - The decorative backdrop overlay element.\n * @csspart animating - Applied to the backdrop while an animation is running.\n */\nexport default class IgcDialogComponent extends EventEmitterMixin<\n IgcDialogComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-dialog';\n public static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcDialogComponent, IgcButtonComponent);\n }\n\n //#region Private state and properties\n\n private readonly _titleId = `title-${nextId++}`;\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots('title', 'message', 'footer'),\n });\n\n private readonly _dialogRef = createRef<HTMLDialogElement>();\n private readonly _player = addAnimationController(this, this._dialogRef);\n\n /**\n * Backdrop animation helper.\n */\n @state()\n private _animating = false;\n\n private get _dialog(): HTMLDialogElement | undefined {\n return this._dialogRef.value;\n }\n\n //#endregion\n\n //#region Public properties\n\n /**\n * When set, pressing the `Escape` key will not close the dialog.\n *\n * By default the browser closes a modal dialog on `Escape`. Enable this\n * option when the dialog guards unsaved work and should require an explicit\n * user action to dismiss.\n * @attr keep-open-on-escape\n * @default false\n */\n @property({ type: Boolean, attribute: 'keep-open-on-escape' })\n public keepOpenOnEscape = false;\n\n /**\n * When set, clicking on the backdrop area outside the dialog surface\n * will close it (emitting close events).\n *\n * Has no effect when the dialog is not yet open.\n * @attr close-on-outside-click\n * @default false\n */\n @property({ type: Boolean, attribute: 'close-on-outside-click' })\n public closeOnOutsideClick = false;\n\n /**\n * When set, the built-in \"OK\" close button in the footer is not rendered.\n *\n * Has no effect when content is projected into the `footer` slot, since\n * the slot content replaces the default button entirely.\n * @attr hide-default-action\n * @default false\n */\n @property({ type: Boolean, attribute: 'hide-default-action' })\n public hideDefaultAction = false;\n\n /**\n * Whether the dialog is open.\n *\n * Setting this property programmatically will open or close the dialog\n * without animation and without emitting close events.\n * Prefer the `show()`, `hide()`, and `toggle()` methods for animated\n * transitions.\n * @attr open\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * The title displayed in the dialog header.\n *\n * Overridden by any content projected into the `title` slot.\n * @attr title\n */\n @property()\n public override title!: string;\n\n /**\n * The return value of the dialog.\n *\n * Automatically set to the `value` of the submitter element when a\n * `<form method=\"dialog\">` inside the dialog is submitted. Can also\n * be set programmatically before calling `hide()`.\n */\n @property({ attribute: false })\n public returnValue?: string;\n\n //#endregion\n\n //#region Lifecycle\n\n constructor() {\n super();\n\n addThemingController(this, all);\n addCommandController(this)\n .set('--show', this.show)\n .set('--hide', this.hide)\n .set('--toggle', this.toggle);\n }\n\n protected override updated(properties: PropertyValues<this>): void {\n if (properties.has('open')) {\n this.open ? this._dialog?.showModal() : this._dialog?.close();\n }\n }\n\n //#endregion\n\n //#region Event handlers\n\n protected _handleFormSubmit(event: SubmitEvent): void {\n const form = event.target as HTMLFormElement;\n\n if (form.method === 'dialog') {\n if (hasSubmitter(event.submitter)) {\n this.returnValue = event.submitter.value ?? '';\n }\n\n if (!event.defaultPrevented) {\n this._closeWithEvent();\n }\n }\n }\n\n private _handleCancel(event: Event): void {\n event.preventDefault();\n\n if (!this.keepOpenOnEscape) {\n this._closeWithEvent();\n }\n }\n\n private _handleClose(): void {\n // When a non-cancelable close event is fired (e.g., from repeated Escape presses),\n // reopen the dialog to prevent the broken state with visible backdrop.\n // Note that this handler is invoked only when `keepOpenOnEscape` is true.\n if (this.open) {\n this._dialog?.showModal();\n }\n }\n\n private _handleClick({ clientX, clientY, target }: PointerEvent): void {\n if (this.closeOnOutsideClick && this._dialog === target) {\n const rect = this._dialog.getBoundingClientRect();\n const inX = numberInRangeInclusive(clientX, rect.left, rect.right);\n const inY = numberInRangeInclusive(clientY, rect.top, rect.bottom);\n\n if (!(inX && inY)) {\n this._closeWithEvent();\n }\n }\n }\n\n //#endregion\n\n //#region Internal API\n\n private async _hide(emitEvent = false): Promise<boolean> {\n if (!this.open || (emitEvent && !this._emitClosing())) {\n return false;\n }\n\n this._animating = true;\n await this._player.playExclusive(fadeOut());\n this.open = false;\n this._animating = false;\n\n if (emitEvent) {\n await this.updateComplete;\n this.emitEvent('igcClosed');\n }\n\n return true;\n }\n\n private _emitClosing(): boolean {\n return this.emitEvent('igcClosing', { cancelable: true });\n }\n\n private _closeWithEvent(): void {\n this._hide(true);\n }\n\n //#endregion\n\n //#region Public API\n\n /**\n * Opens the dialog with an animated fade-in transition.\n *\n * Returns `true` when the dialog was successfully opened, or `false` if\n * it was already open.\n */\n public async show(): Promise<boolean> {\n if (this.open) {\n return false;\n }\n\n this.open = true;\n await this._player.playExclusive(fadeIn());\n return true;\n }\n\n /**\n * Closes the dialog with an animated fade-out transition.\n *\n * Returns `true` when the dialog was successfully closed, or `false` if\n * it was already closed.\n */\n public async hide(): Promise<boolean> {\n return this._hide();\n }\n\n /**\n * Toggles the dialog open or closed depending on its current state.\n *\n * Equivalent to calling `show()` when closed and `hide()` when open.\n * Returns `true` when the transition completed successfully.\n */\n public async toggle(): Promise<boolean> {\n return this.open ? this.hide() : this.show();\n }\n\n //#endregion\n\n //#region Render methods\n\n protected _renderBackdrop() {\n return html`\n <div\n aria-hidden=${!this.open}\n part=${partMap({ backdrop: true, animating: this._animating })}\n ></div>\n `;\n }\n\n protected _renderHeader() {\n return html`\n <header part=\"title\" id=${this._titleId}>\n <slot name=\"title\">\n <span>${this.title}</span>\n </slot>\n </header>\n `;\n }\n\n protected _renderContent() {\n const hasMessage = this._slots.hasAssignedElements('message');\n return html`\n <section part=\"content\">\n <slot name=\"message\" ?hidden=${!hasMessage}></slot>\n <slot @submit=${this._handleFormSubmit}></slot>\n </section>\n `;\n }\n\n protected _renderFooter() {\n return html`\n <footer part=\"footer\">\n <slot name=\"footer\">\n ${\n this.hideDefaultAction\n ? nothing\n : html`\n <igc-button variant=\"flat\" @click=${this._closeWithEvent}>\n OK\n </igc-button>\n `\n }\n </slot>\n </footer>\n `;\n }\n\n protected override render() {\n const hasTitle = this._slots.hasAssignedElements('title') || !!this.title;\n const hasFooter =\n this._slots.hasAssignedElements('footer') || !this.hideDefaultAction;\n const labelledBy = this.ariaLabel ?? this._titleId;\n\n return html`\n ${this._renderBackdrop()}\n <dialog\n ${ref(this._dialogRef)}\n part=${partMap({ base: true, titled: hasTitle, footed: hasFooter })}\n role=\"dialog\"\n aria-label=${bindIf(this.ariaLabel, this.ariaLabel)}\n aria-labelledby=${bindIf(labelledBy, labelledBy)}\n @click=${this._handleClick}\n @cancel=${this._handleCancel}\n @close=${bindIf(this.keepOpenOnEscape, this._handleClose)}\n >\n ${this._renderHeader()} ${this._renderContent()} ${this._renderFooter()}\n </dialog>\n `;\n }\n\n //#endregion\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-dialog': IgcDialogComponent;\n }\n}\n\nfunction hasSubmitter(\n submitter: SubmitEvent['submitter']\n): submitter is HTMLButtonElement | HTMLInputElement {\n return submitter != null;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"file-input.js","sourceRoot":"","sources":["../../../src/components/file-input/file-input.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n FileInputResourceStringsEN,\n type IFileInputResourceStrings,\n} from 'igniteui-i18n-core';\nimport { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { addI18nController } from '../common/i18n/i18n-controller.js';\nimport type { AbstractConstructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormValueFileListTransformers } from '../common/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '../common/mixins/forms/form-value.js';\nimport { partMap } from '../common/part-map.js';\nimport { bindIf, hasFiles } from '../common/util.js';\nimport {\n IgcInputBaseComponent,\n type IgcInputComponentEventMap,\n} from '../input/input-base.js';\nimport { styles as baseStyle } from '../input/themes/input.base.css.js';\nimport { styles as shared } from '../input/themes/shared/input.common.css.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { styles } from './themes/file-input.base.css.js';\nimport { all } from './themes/themes.js';\nimport { fileValidators } from './validators.js';\n\n/* blazorSuppress */\nexport interface IgcFileInputComponentEventMap extends Omit<\n IgcInputComponentEventMap,\n 'igcChange' | 'igcInput'\n> {\n igcCancel: CustomEvent<FileList>;\n igcChange: CustomEvent<FileList>;\n}\n\nconst Slots = setSlots(\n 'prefix',\n 'suffix',\n 'helper-text',\n 'file-selector-text',\n 'file-missing-text',\n 'value-missing',\n 'custom-error',\n 'invalid'\n);\n\n/* blazorSuppress */\n/**\n * @element igc-file-input\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after input.\n * @slot helper-text - Renders content below the input.\n * @slot file-selector-text - Renders content for the browse button when input type is file.\n * @slot file-missing-text - Renders content when input type is file and no file is chosen.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n * @fires igcCancel - Emitted when the control's file picker dialog is canceled.\n *\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart label - The native label element.\n * @csspart file-names - The file names wrapper when input type is 'file'.\n * @csspart file-selector-button - The browse button when input type is 'file'.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart helper-text - The helper text wrapper.\n */\nexport default class IgcFileInputComponent extends EventEmitterMixin<\n IgcFileInputComponentEventMap,\n AbstractConstructor<IgcInputBaseComponent>\n>(IgcInputBaseComponent) {\n public static readonly tagName = 'igc-file-input';\n public static styles = [baseStyle, shared, styles];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(\n IgcFileInputComponent,\n IgcValidationContainerComponent,\n IgcButtonComponent\n );\n }\n\n //#region Internal attributes and properties\n\n protected override readonly _themes = addThemingController(this, all);\n\n protected override readonly _slots = addSlotController(this, {\n slots: Slots,\n });\n\n protected override readonly _formValue = createFormValueState(this, {\n initialValue: null,\n transformers: FormValueFileListTransformers,\n });\n\n protected readonly _i18nController = addI18nController(this, {\n defaultEN: FileInputResourceStringsEN,\n });\n\n protected override get __validators() {\n return fileValidators;\n }\n\n private get _fileNames(): string | null {\n if (!hasFiles(this)) {\n return null;\n }\n\n return Array.from(this.files)\n .map((file) => file.name || 'unnamed')\n .join(', ');\n }\n\n /**\n * Indicates whether the file picker dialog is currently active.\n * Used to manage validation on blur.\n */\n @state()\n private _filePickerActive = false;\n\n //#endregion\n\n //#region Public attributes and properties\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n /**\n * The value of the control.\n * Similar to native file input, this property is read-only and cannot be set programmatically.\n * @attr\n */\n @property()\n public set value(value: string) {\n if (value === '' && this._input) {\n this._input.value = value;\n }\n }\n\n public get value(): string {\n return this._input?.value ?? '';\n }\n\n /**\n * The resource strings for localization.\n */\n @property({ attribute: false })\n public set resourceStrings(value: IFileInputResourceStrings) {\n this._i18nController.resourceStrings = value;\n }\n\n public get resourceStrings(): IFileInputResourceStrings {\n return this._i18nController.resourceStrings;\n }\n\n /**\n * Gets/Sets the locale used for getting language, affecting resource strings.\n * @attr locale\n */\n @property()\n public set locale(value: string) {\n this._i18nController.locale = value;\n }\n\n public get locale(): string {\n return this._i18nController.locale;\n }\n\n /**\n * The multiple attribute of the control.\n * Used to indicate that a file input allows the user to select more than one file.\n *\n * @attr\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public multiple = false;\n\n /**\n * The accept attribute of the control.\n * Defines the file types as a list of comma-separated values that the file input should accept.\n * @attr\n */\n @property()\n public accept = '';\n\n /**\n * The autofocus attribute of the control.\n * @attr\n */\n @property({ type: Boolean })\n public override autofocus!: boolean;\n\n /** Returns the list of selected files. */\n public get files(): FileList {\n return this._input?.files ?? new DataTransfer().files;\n }\n\n //#endregion\n\n //#region Internal methods\n\n protected override _restoreDefaultValue(): void {\n if (this._input) {\n this._input.value = '';\n }\n super._restoreDefaultValue();\n }\n\n //#endregion\n\n //#region Event Handlers\n\n private _handleChange(): void {\n this._filePickerActive = false;\n this._setTouchedState();\n this._formValue.setValueAndFormState(this.files);\n\n this.requestUpdate();\n this.emitEvent('igcChange', { detail: this.files });\n }\n\n private _handleCancel(): void {\n this._filePickerActive = false;\n this._setTouchedState();\n this._validate();\n\n this.emitEvent('igcCancel', { detail: this.files });\n }\n\n protected override _handleBlur(): void {\n this._filePickerActive ? this._validate() : super._handleBlur();\n }\n\n /* c8 ignore next 3 */\n protected _handleClick(): void {\n this._filePickerActive = true;\n }\n\n //#endregion\n\n protected override _renderFileParts() {\n const emptyText =\n this.placeholder ?? this.resourceStrings.file_input_placeholder;\n\n return html`\n <div part=\"file-parts\">\n <div part=\"file-selector-button\">\n <igc-button variant=\"flat\" ?disabled=${this.disabled} tabindex=\"-1\">\n <slot name=\"file-selector-text\"\n >${this.resourceStrings.file_input_upload_button}</slot\n >\n </igc-button>\n </div>\n <div part=\"file-names\">\n <span>\n ${this._fileNames ??\n html`<slot name=\"file-missing-text\">${emptyText}</slot>`}\n </span>\n </div>\n </div>\n `;\n }\n\n protected override _renderInput() {\n const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';\n const hasHelperText = this._slots.hasAssignedElements('helper-text');\n\n return html`\n <input\n id=${this._inputId}\n part=${partMap(this._resolvePartNames('input'))}\n type=\"file\"\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?autofocus=${this.autofocus}\n ?multiple=${this.multiple}\n tabindex=${bindIf(hasNegativeTabIndex, -1)}\n accept=${bindIf(this.accept, this.accept)}\n aria-describedby=${bindIf(hasHelperText, 'helper-text')}\n @click=${this._handleClick}\n @change=${this._handleChange}\n @cancel=${this._handleCancel}\n @blur=${this._handleBlur}\n />\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-file-input': IgcFileInputComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"file-input.js","sourceRoot":"","sources":["../../../src/components/file-input/file-input.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n FileInputResourceStringsEN,\n type IFileInputResourceStrings,\n} from 'igniteui-i18n-core';\nimport { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { addI18nController } from '../common/i18n/i18n-controller.js';\nimport type { AbstractConstructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormValueFileListTransformers } from '../common/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '../common/mixins/forms/form-value.js';\nimport { partMap } from '../common/part-map.js';\nimport { bindIf, hasFiles } from '../common/util.js';\nimport {\n IgcInputBaseComponent,\n type IgcInputComponentEventMap,\n} from '../input/input-base.js';\nimport { styles as baseStyle } from '../input/themes/input.base.css.js';\nimport { styles as shared } from '../input/themes/shared/input.common.css.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { styles } from './themes/file-input.base.css.js';\nimport { all } from './themes/themes.js';\nimport { fileValidators } from './validators.js';\n\n/* blazorSuppress */\nexport interface IgcFileInputComponentEventMap extends Omit<\n IgcInputComponentEventMap,\n 'igcChange' | 'igcInput'\n> {\n igcCancel: CustomEvent<FileList>;\n igcChange: CustomEvent<FileList>;\n}\n\nconst Slots = setSlots(\n 'prefix',\n 'suffix',\n 'helper-text',\n 'file-selector-text',\n 'file-missing-text',\n 'value-missing',\n 'custom-error',\n 'invalid'\n);\n\n/* blazorSuppress */\n/**\n * @element igc-file-input\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after input.\n * @slot helper-text - Renders content below the input.\n * @slot file-selector-text - Renders content for the browse button when input type is file.\n * @slot file-missing-text - Renders content when input type is file and no file is chosen.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n * @fires igcCancel - Emitted when the control's file picker dialog is canceled.\n *\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart label - The native label element.\n * @csspart file-names - The file names wrapper when input type is 'file'.\n * @csspart file-selector-button - The browse button when input type is 'file'.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart helper-text - The helper text wrapper.\n */\nexport default class IgcFileInputComponent extends EventEmitterMixin<\n IgcFileInputComponentEventMap,\n AbstractConstructor<IgcInputBaseComponent>\n>(IgcInputBaseComponent) {\n public static readonly tagName = 'igc-file-input';\n public static styles = [baseStyle, shared, styles];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(\n IgcFileInputComponent,\n IgcValidationContainerComponent,\n IgcButtonComponent\n );\n }\n\n //#region Internal attributes and properties\n\n protected override readonly _themes = addThemingController(this, all);\n\n protected override readonly _slots = addSlotController(this, {\n slots: Slots,\n });\n\n protected override readonly _formValue = createFormValueState(this, {\n initialValue: null,\n transformers: FormValueFileListTransformers,\n });\n\n protected readonly _i18nController = addI18nController(this, {\n defaultEN: FileInputResourceStringsEN,\n });\n\n protected override get __validators() {\n return fileValidators;\n }\n\n private get _fileNames(): string | null {\n if (!hasFiles(this)) {\n return null;\n }\n\n return Array.from(this.files)\n .map((file) => file.name || 'unnamed')\n .join(', ');\n }\n\n /**\n * Indicates whether the file picker dialog is currently active.\n * Used to manage validation on blur.\n */\n @state()\n private _filePickerActive = false;\n\n //#endregion\n\n //#region Public attributes and properties\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n /**\n * The value of the control.\n * Similar to native file input, this property is read-only and cannot be set programmatically.\n * @attr\n */\n @property()\n public set value(value: string) {\n if (value === '' && this._input) {\n this._input.value = value;\n }\n }\n\n public get value(): string {\n return this._input?.value ?? '';\n }\n\n /**\n * The resource strings for localization.\n */\n @property({ attribute: false })\n public set resourceStrings(value: IFileInputResourceStrings) {\n this._i18nController.resourceStrings = value;\n }\n\n public get resourceStrings(): IFileInputResourceStrings {\n return this._i18nController.resourceStrings;\n }\n\n /**\n * Gets/Sets the locale used for getting language, affecting resource strings.\n * @attr locale\n */\n @property()\n public set locale(value: string) {\n this._i18nController.locale = value;\n }\n\n public get locale(): string {\n return this._i18nController.locale;\n }\n\n /**\n * The multiple attribute of the control.\n * Used to indicate that a file input allows the user to select more than one file.\n *\n * @attr\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public multiple = false;\n\n /**\n * The accept attribute of the control.\n * Defines the file types as a list of comma-separated values that the file input should accept.\n * @attr\n */\n @property()\n public accept = '';\n\n /**\n * The autofocus attribute of the control.\n * @attr\n */\n @property({ type: Boolean })\n public override autofocus!: boolean;\n\n /** Returns the list of selected files. */\n public get files(): FileList {\n return this._input?.files ?? new DataTransfer().files;\n }\n\n //#endregion\n\n //#region Internal methods\n\n protected override _restoreDefaultValue(): void {\n if (this._input) {\n this._input.value = '';\n }\n super._restoreDefaultValue();\n }\n\n //#endregion\n\n //#region Event Handlers\n\n private _handleChange(): void {\n this._filePickerActive = false;\n this._setTouchedState();\n this._formValue.setValueAndFormState(this.files);\n\n this.requestUpdate();\n this.emitEvent('igcChange', { detail: this.files });\n }\n\n private _handleCancel(): void {\n this._filePickerActive = false;\n this._setTouchedState();\n this._validate();\n\n this.emitEvent('igcCancel', { detail: this.files });\n }\n\n protected override _handleBlur(): void {\n this._filePickerActive ? this._validate() : super._handleBlur();\n }\n\n /* c8 ignore next 3 */\n protected _handleClick(): void {\n this._filePickerActive = true;\n }\n\n //#endregion\n\n protected override _renderFileParts() {\n const emptyText =\n this.placeholder ?? this.resourceStrings.file_input_placeholder;\n\n return html`\n <div part=\"file-parts\">\n <div part=\"file-selector-button\">\n <igc-button variant=\"flat\" ?disabled=${this.disabled} tabindex=\"-1\">\n <slot name=\"file-selector-text\"\n >${this.resourceStrings.file_input_upload_button}</slot\n >\n </igc-button>\n </div>\n <div part=\"file-names\">\n <span>\n ${\n this._fileNames ??\n html`<slot name=\"file-missing-text\">${emptyText}</slot>`\n }\n </span>\n </div>\n </div>\n `;\n }\n\n protected override _renderInput() {\n const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';\n const hasHelperText = this._slots.hasAssignedElements('helper-text');\n\n return html`\n <input\n id=${this._inputId}\n part=${partMap(this._resolvePartNames('input'))}\n type=\"file\"\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?autofocus=${this.autofocus}\n ?multiple=${this.multiple}\n tabindex=${bindIf(hasNegativeTabIndex, -1)}\n accept=${bindIf(this.accept, this.accept)}\n aria-describedby=${bindIf(hasHelperText, 'helper-text')}\n @click=${this._handleClick}\n @change=${this._handleChange}\n @cancel=${this._handleCancel}\n @blur=${this._handleBlur}\n />\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-file-input': IgcFileInputComponent;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"icon-state.broadcast.js","sourceRoot":"","sources":["../../../src/components/icon/icon-state.broadcast.ts"],"names":[],"mappings":"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","sourcesContent":["import { createIconDefaultMap } from './registry/default-map.js';\nimport type {\n BroadcastIconsChangeMessage,\n IconMeta,\n IconsCollection,\n SvgIcon,\n} from './registry/types.js';\nimport { ActionType } from './registry/types.js';\n\ntype IconBroadcastEvent =\n | MessageEvent<BroadcastIconsChangeMessage>\n | PageTransitionEvent;\n\n/**\n * Manages cross-context synchronization of icon state using the BroadcastChannel API.\n *\n * @remarks\n * This class enables icon registry state to be shared between different browsing contexts\n * (e.g., iframes, tabs) within the same origin. It specifically handles synchronization\n * with Angular elements that may be running in separate contexts.\n *\n * The broadcast channel is automatically created on page show and disposed on page hide\n * to properly handle bfcache (back/forward cache) scenarios.\n */\nexport class IconsStateBroadcast {\n private static readonly _origin = 'igniteui-webcomponents';\n\n private readonly _iconsCollection: IconsCollection<SvgIcon>;\n private readonly _iconReferences: IconsCollection<IconMeta>;\n\n private _channel: BroadcastChannel | null = null;\n\n /**\n * Creates an instance of IconsStateBroadcast.\n *\n * @param iconsCollection - The collection of registered SVG icons.\n * @param iconReferences - The collection of icon references/aliases.\n */\n constructor(\n iconsCollection: IconsCollection<SvgIcon>,\n iconReferences: IconsCollection<IconMeta>\n ) {\n this._iconsCollection = iconsCollection;\n this._iconReferences = iconReferences;\n\n globalThis.addEventListener('pageshow', this);\n globalThis.addEventListener('pagehide', this);\n\n this._create();\n }\n\n /**\n * Sends a message to other browsing contexts via the broadcast channel.\n */\n public send(data: BroadcastIconsChangeMessage): void {\n this._channel?.postMessage(data);\n }\n\n /** @internal */\n public handleEvent(event: IconBroadcastEvent): void {\n switch (event.type) {\n case 'message':\n this._syncState(event as MessageEvent<BroadcastIconsChangeMessage>);\n break;\n case 'pageshow':\n this._create();\n break;\n case 'pagehide':\n this._dispose();\n break;\n }\n }\n\n private _syncState({\n data: { actionType, origin },\n }: MessageEvent<BroadcastIconsChangeMessage>): void {\n // no need to sync with other wc icon services, just with angular elements\n if (\n actionType !== ActionType.SyncState ||\n origin === IconsStateBroadcast._origin\n ) {\n return;\n }\n\n this.send({\n actionType: ActionType.SyncState,\n collections: this._getUserSetCollection(\n this._iconsCollection\n ).toPlainMap(),\n references: this._getUserRefsCollection(\n this._iconReferences\n ).toPlainMap(),\n origin: IconsStateBroadcast._origin,\n });\n }\n\n private _create(): void {\n if (!this._channel) {\n this._channel = new BroadcastChannel('ignite-ui-icon-channel');\n this._channel.addEventListener('message', this);\n }\n }\n\n private _dispose(): void {\n this._channel?.removeEventListener('message', this);\n this._channel?.close();\n this._channel = null;\n }\n\n private _getUserRefsCollection(\n collections: IconsCollection<IconMeta>\n ): IconsCollection<IconMeta> {\n const userSetIcons = createIconDefaultMap<string, IconMeta>();\n\n for (const [collectionKey, collection] of collections.entries()) {\n for (const [iconKey, icon] of collection.entries()) {\n if (icon.external) {\n userSetIcons.getOrCreate(collectionKey).set(iconKey, icon);\n }\n }\n }\n\n return userSetIcons;\n }\n\n private _getUserSetCollection(\n collections: IconsCollection<SvgIcon>\n ): IconsCollection<SvgIcon> {\n const userSetIcons = createIconDefaultMap<string, SvgIcon>();\n\n for (const [collectionKey, collection] of collections.entries()) {\n if (collectionKey === 'internal') {\n continue;\n }\n for (const [iconKey, icon] of collection.entries()) {\n userSetIcons.getOrCreate(collectionKey).set(iconKey, icon);\n }\n }\n\n return userSetIcons;\n }\n}\n"]}
1
+ {"version":3,"file":"icon-state.broadcast.js","sourceRoot":"","sources":["../../../src/components/icon/icon-state.broadcast.ts"],"names":[],"mappings":"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","sourcesContent":["import { createIconDefaultMap } from './registry/default-map.js';\nimport type {\n BroadcastIconsChangeMessage,\n IconMeta,\n IconsCollection,\n SvgIcon,\n} from './registry/types.js';\nimport { ActionType } from './registry/types.js';\n\ntype IconBroadcastEvent =\n MessageEvent<BroadcastIconsChangeMessage> | PageTransitionEvent;\n\n/**\n * Manages cross-context synchronization of icon state using the BroadcastChannel API.\n *\n * @remarks\n * This class enables icon registry state to be shared between different browsing contexts\n * (e.g., iframes, tabs) within the same origin. It specifically handles synchronization\n * with Angular elements that may be running in separate contexts.\n *\n * The broadcast channel is automatically created on page show and disposed on page hide\n * to properly handle bfcache (back/forward cache) scenarios.\n */\nexport class IconsStateBroadcast {\n private static readonly _origin = 'igniteui-webcomponents';\n\n private readonly _iconsCollection: IconsCollection<SvgIcon>;\n private readonly _iconReferences: IconsCollection<IconMeta>;\n\n private _channel: BroadcastChannel | null = null;\n\n /**\n * Creates an instance of IconsStateBroadcast.\n *\n * @param iconsCollection - The collection of registered SVG icons.\n * @param iconReferences - The collection of icon references/aliases.\n */\n constructor(\n iconsCollection: IconsCollection<SvgIcon>,\n iconReferences: IconsCollection<IconMeta>\n ) {\n this._iconsCollection = iconsCollection;\n this._iconReferences = iconReferences;\n\n globalThis.addEventListener('pageshow', this);\n globalThis.addEventListener('pagehide', this);\n\n this._create();\n }\n\n /**\n * Sends a message to other browsing contexts via the broadcast channel.\n */\n public send(data: BroadcastIconsChangeMessage): void {\n this._channel?.postMessage(data);\n }\n\n /** @internal */\n public handleEvent(event: IconBroadcastEvent): void {\n switch (event.type) {\n case 'message':\n this._syncState(event as MessageEvent<BroadcastIconsChangeMessage>);\n break;\n case 'pageshow':\n this._create();\n break;\n case 'pagehide':\n this._dispose();\n break;\n }\n }\n\n private _syncState({\n data: { actionType, origin },\n }: MessageEvent<BroadcastIconsChangeMessage>): void {\n // no need to sync with other wc icon services, just with angular elements\n if (\n actionType !== ActionType.SyncState ||\n origin === IconsStateBroadcast._origin\n ) {\n return;\n }\n\n this.send({\n actionType: ActionType.SyncState,\n collections: this._getUserSetCollection(\n this._iconsCollection\n ).toPlainMap(),\n references: this._getUserRefsCollection(\n this._iconReferences\n ).toPlainMap(),\n origin: IconsStateBroadcast._origin,\n });\n }\n\n private _create(): void {\n if (!this._channel) {\n this._channel = new BroadcastChannel('ignite-ui-icon-channel');\n this._channel.addEventListener('message', this);\n }\n }\n\n private _dispose(): void {\n this._channel?.removeEventListener('message', this);\n this._channel?.close();\n this._channel = null;\n }\n\n private _getUserRefsCollection(\n collections: IconsCollection<IconMeta>\n ): IconsCollection<IconMeta> {\n const userSetIcons = createIconDefaultMap<string, IconMeta>();\n\n for (const [collectionKey, collection] of collections.entries()) {\n for (const [iconKey, icon] of collection.entries()) {\n if (icon.external) {\n userSetIcons.getOrCreate(collectionKey).set(iconKey, icon);\n }\n }\n }\n\n return userSetIcons;\n }\n\n private _getUserSetCollection(\n collections: IconsCollection<SvgIcon>\n ): IconsCollection<SvgIcon> {\n const userSetIcons = createIconDefaultMap<string, SvgIcon>();\n\n for (const [collectionKey, collection] of collections.entries()) {\n if (collectionKey === 'internal') {\n continue;\n }\n for (const [iconKey, icon] of collection.entries()) {\n userSetIcons.getOrCreate(collectionKey).set(iconKey, icon);\n }\n }\n\n return userSetIcons;\n }\n}\n"]}
@@ -1,4 +1,4 @@
1
- import { LitElement, type PropertyValues } from 'lit';
1
+ import { LitElement, nothing, type PropertyValues } from 'lit';
2
2
  import type { IconMeta } from './registry/types.js';
3
3
  /**
4
4
  * The icon component allows visualizing collections of pre-registered SVG icons.
@@ -87,6 +87,7 @@ export default class IgcIconComponent extends LitElement {
87
87
  /** @internal */
88
88
  disconnectedCallback(): void;
89
89
  protected update(props: PropertyValues<this>): void;
90
+ protected firstUpdated(): void;
90
91
  /**
91
92
  * Callback invoked when an icon is registered or updated in the registry.
92
93
  * Re-fetches the icon if it matches this component's name and collection.
@@ -107,7 +108,7 @@ export default class IgcIconComponent extends LitElement {
107
108
  *
108
109
  */
109
110
  private _getIcon;
110
- protected render(): import("lit-html").TemplateResult<1>;
111
+ protected render(): typeof nothing | import("lit-html").TemplateResult<1>;
111
112
  protected registerIcon(name: string, url: string, collection?: string): Promise<void>;
112
113
  protected registerIconFromText(name: string, iconText: string, collection?: string): void;
113
114
  protected setIconRef(name: string, collection: string, icon: IconMeta): void;
@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
4
4
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
- import { html, LitElement } from 'lit';
7
+ import { html, LitElement, nothing } from 'lit';
8
8
  import { property, state } from 'lit/decorators.js';
9
9
  import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
10
10
  import { addThemingController } from '../../theming/theming-controller.js';
@@ -51,6 +51,11 @@ export default class IgcIconComponent extends LitElement {
51
51
  }
52
52
  super.update(props);
53
53
  }
54
+ firstUpdated() {
55
+ if (this._svg) {
56
+ queueMicrotask(() => this.requestUpdate());
57
+ }
58
+ }
54
59
  _iconLoaded(name, collection) {
55
60
  if (this.name === name && this.collection === collection) {
56
61
  this._getIcon();
@@ -63,7 +68,7 @@ export default class IgcIconComponent extends LitElement {
63
68
  this._internals.setARIA({ ariaLabel: title });
64
69
  }
65
70
  render() {
66
- return html `${unsafeSVG(this._svg)}`;
71
+ return this.hasUpdated ? html `${unsafeSVG(this._svg)}` : nothing;
67
72
  }
68
73
  async registerIcon(name, url, collection = 'default') {
69
74
  await registerIcon_impl(name, url, collection);
@@ -1 +1 @@
1
- {"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, type PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport { blazorInclude } from '../common/decorators/blazorInclude.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport {\n getIconRegistry,\n registerIcon as registerIcon_impl,\n registerIconFromText as registerIconFromText_impl,\n setIconRef as setIconRef_impl,\n} from './icon.registry.js';\nimport type { IconCallback, IconMeta } from './registry/types.js';\nimport { styles } from './themes/icon.base.css.js';\nimport { styles as shared } from './themes/shared/icon.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * The icon component allows visualizing collections of pre-registered SVG icons.\n *\n * @element igc-icon\n *\n * @remarks\n * The icon component renders SVG icons from registered icon collections. Icons can be:\n * - Loaded from the internal collection (built-in icons)\n * - Registered dynamically using `registerIcon` or `registerIconFromText`\n * - Referenced by aliases that resolve differently based on the active theme\n *\n * Icons automatically adapt to the current theme when used within an `igc-theme-provider`.\n * The component subscribes to the icon registry and updates automatically when icons\n * are registered or references are updated.\n *\n * @example\n * ```html\n * <!-- Use a built-in icon -->\n * <igc-icon name=\"star\"></igc-icon>\n *\n * <!-- Use an icon from a specific collection -->\n * <igc-icon name=\"search\" collection=\"material\"></igc-icon>\n *\n * <!-- Mirror the icon for RTL layouts -->\n * <igc-icon name=\"arrow-forward\" mirrored></igc-icon>\n * ```\n *\n * @example\n * ```typescript\n * // Register a custom icon\n * import { registerIconFromText } from 'igniteui-webcomponents';\n *\n * const customIconSvg = '<svg viewBox=\"0 0 24 24\">...</svg>';\n * registerIconFromText('custom-icon', customIconSvg, 'my-collection');\n * ```\n */\nexport default class IgcIconComponent extends LitElement {\n public static readonly tagName = 'igc-icon';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcIconComponent);\n }\n\n private readonly _internals = addInternalsController(this, {\n initialARIA: { role: 'img' },\n });\n\n private readonly _theming = addThemingController(this, all, {\n themeChange: this._getIcon,\n });\n\n private _boundIconLoaded?: IconCallback;\n\n @state()\n private _svg = '';\n\n /* alternateName: iconName */\n /**\n * The name of the icon glyph to draw.\n *\n * @attr name\n *\n * @remarks\n * The icon name can be:\n * - A direct reference to a registered icon in the specified collection\n * - An alias that resolves to different icons based on the current theme\n *\n * When the icon name or collection changes, the component automatically\n * fetches and renders the new icon.\n */\n @property()\n public name = '';\n\n /**\n * The name of the registered collection for look up of icons.\n *\n * @attr collection\n * @default \"default\"\n *\n * @remarks\n * Collections allow organizing icons into logical groups. The \"default\"\n * collection is used for most icons.\n * Custom collections can be created by registering icons with a specific collection name.\n */\n @property()\n public collection = 'default';\n\n /**\n * Whether to flip the icon horizontally. Useful for RTL (right-to-left) layouts.\n *\n * @attr mirrored\n * @default false\n *\n * @remarks\n * When true, the icon is flipped horizontally using CSS transform.\n * This is particularly useful for directional icons (arrows, chevrons)\n * in right-to-left language contexts.\n */\n @property({ type: Boolean, reflect: true })\n public mirrored = false;\n\n /** @internal */\n public override connectedCallback(): void {\n super.connectedCallback();\n this._boundIconLoaded = this._iconLoaded.bind(this);\n getIconRegistry().subscribe(this._boundIconLoaded);\n }\n\n /** @internal */\n public override disconnectedCallback(): void {\n if (this._boundIconLoaded) {\n getIconRegistry().unsubscribe(this._boundIconLoaded);\n }\n super.disconnectedCallback();\n }\n\n protected override update(props: PropertyValues<this>): void {\n if (props.has('name') || props.has('collection')) {\n this._getIcon();\n }\n\n super.update(props);\n }\n\n /**\n * Callback invoked when an icon is registered or updated in the registry.\n * Re-fetches the icon if it matches this component's name and collection.\n *\n * @param name - The name of the registered icon\n * @param collection - The collection of the registered icon\n */\n private _iconLoaded(name: string, collection: string): void {\n if (this.name === name && this.collection === collection) {\n this._getIcon();\n }\n }\n\n /**\n * Fetches and updates the icon from the registry.\n *\n * @remarks\n * This method:\n * 1. Resolves the icon reference based on the current theme\n * 2. Retrieves the SVG content from the registry\n * 3. Updates the component's rendered SVG\n * 4. Sets the appropriate ARIA label from the icon's title\n *\n */\n private _getIcon(): void {\n const { name, collection } = getIconRegistry().getIconRef(\n this.name,\n this.collection,\n this._theming.theme\n );\n const { svg = '', title = null } =\n getIconRegistry().get(name, collection) ?? {};\n\n this._svg = svg;\n this._internals.setARIA({ ariaLabel: title });\n }\n\n protected override render() {\n return html`${unsafeSVG(this._svg)}`;\n }\n\n /* c8 ignore next 8 */\n @blazorInclude()\n protected async registerIcon(\n name: string,\n url: string,\n collection = 'default'\n ) {\n await registerIcon_impl(name, url, collection);\n }\n\n /* c8 ignore next 8 */\n @blazorInclude()\n protected registerIconFromText(\n name: string,\n iconText: string,\n collection = 'default'\n ) {\n registerIconFromText_impl(name, iconText, collection);\n }\n\n /* c8 ignore next 4 */\n @blazorInclude()\n protected setIconRef(name: string, collection: string, icon: IconMeta) {\n setIconRef_impl(name, collection, icon);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-icon': IgcIconComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, type PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport { blazorInclude } from '../common/decorators/blazorInclude.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport {\n getIconRegistry,\n registerIcon as registerIcon_impl,\n registerIconFromText as registerIconFromText_impl,\n setIconRef as setIconRef_impl,\n} from './icon.registry.js';\nimport type { IconCallback, IconMeta } from './registry/types.js';\nimport { styles } from './themes/icon.base.css.js';\nimport { styles as shared } from './themes/shared/icon.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * The icon component allows visualizing collections of pre-registered SVG icons.\n *\n * @element igc-icon\n *\n * @remarks\n * The icon component renders SVG icons from registered icon collections. Icons can be:\n * - Loaded from the internal collection (built-in icons)\n * - Registered dynamically using `registerIcon` or `registerIconFromText`\n * - Referenced by aliases that resolve differently based on the active theme\n *\n * Icons automatically adapt to the current theme when used within an `igc-theme-provider`.\n * The component subscribes to the icon registry and updates automatically when icons\n * are registered or references are updated.\n *\n * @example\n * ```html\n * <!-- Use a built-in icon -->\n * <igc-icon name=\"star\"></igc-icon>\n *\n * <!-- Use an icon from a specific collection -->\n * <igc-icon name=\"search\" collection=\"material\"></igc-icon>\n *\n * <!-- Mirror the icon for RTL layouts -->\n * <igc-icon name=\"arrow-forward\" mirrored></igc-icon>\n * ```\n *\n * @example\n * ```typescript\n * // Register a custom icon\n * import { registerIconFromText } from 'igniteui-webcomponents';\n *\n * const customIconSvg = '<svg viewBox=\"0 0 24 24\">...</svg>';\n * registerIconFromText('custom-icon', customIconSvg, 'my-collection');\n * ```\n */\nexport default class IgcIconComponent extends LitElement {\n public static readonly tagName = 'igc-icon';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcIconComponent);\n }\n\n private readonly _internals = addInternalsController(this, {\n initialARIA: { role: 'img' },\n });\n\n private readonly _theming = addThemingController(this, all, {\n themeChange: this._getIcon,\n });\n\n private _boundIconLoaded?: IconCallback;\n\n @state()\n private _svg = '';\n\n /* alternateName: iconName */\n /**\n * The name of the icon glyph to draw.\n *\n * @attr name\n *\n * @remarks\n * The icon name can be:\n * - A direct reference to a registered icon in the specified collection\n * - An alias that resolves to different icons based on the current theme\n *\n * When the icon name or collection changes, the component automatically\n * fetches and renders the new icon.\n */\n @property()\n public name = '';\n\n /**\n * The name of the registered collection for look up of icons.\n *\n * @attr collection\n * @default \"default\"\n *\n * @remarks\n * Collections allow organizing icons into logical groups. The \"default\"\n * collection is used for most icons.\n * Custom collections can be created by registering icons with a specific collection name.\n */\n @property()\n public collection = 'default';\n\n /**\n * Whether to flip the icon horizontally. Useful for RTL (right-to-left) layouts.\n *\n * @attr mirrored\n * @default false\n *\n * @remarks\n * When true, the icon is flipped horizontally using CSS transform.\n * This is particularly useful for directional icons (arrows, chevrons)\n * in right-to-left language contexts.\n */\n @property({ type: Boolean, reflect: true })\n public mirrored = false;\n\n /** @internal */\n public override connectedCallback(): void {\n super.connectedCallback();\n this._boundIconLoaded = this._iconLoaded.bind(this);\n getIconRegistry().subscribe(this._boundIconLoaded);\n }\n\n /** @internal */\n public override disconnectedCallback(): void {\n if (this._boundIconLoaded) {\n getIconRegistry().unsubscribe(this._boundIconLoaded);\n }\n super.disconnectedCallback();\n }\n\n protected override update(props: PropertyValues<this>): void {\n if (props.has('name') || props.has('collection')) {\n this._getIcon();\n }\n\n super.update(props);\n }\n\n protected override firstUpdated(): void {\n // During SSR and the client's first (hydrating) render `hasUpdated` is\n // `false`, so the SVG is withheld and both renders match. Once hydration\n // has settled, reconcile so the icon content is projected. Deferring via\n // `queueMicrotask` keeps it off the current update cycle (avoids Lit's\n // change-in-update warning).\n if (this._svg) {\n queueMicrotask(() => this.requestUpdate());\n }\n }\n\n /**\n * Callback invoked when an icon is registered or updated in the registry.\n * Re-fetches the icon if it matches this component's name and collection.\n *\n * @param name - The name of the registered icon\n * @param collection - The collection of the registered icon\n */\n private _iconLoaded(name: string, collection: string): void {\n if (this.name === name && this.collection === collection) {\n this._getIcon();\n }\n }\n\n /**\n * Fetches and updates the icon from the registry.\n *\n * @remarks\n * This method:\n * 1. Resolves the icon reference based on the current theme\n * 2. Retrieves the SVG content from the registry\n * 3. Updates the component's rendered SVG\n * 4. Sets the appropriate ARIA label from the icon's title\n *\n */\n private _getIcon(): void {\n const { name, collection } = getIconRegistry().getIconRef(\n this.name,\n this.collection,\n this._theming.theme\n );\n const { svg = '', title = null } =\n getIconRegistry().get(name, collection) ?? {};\n\n this._svg = svg;\n this._internals.setARIA({ ariaLabel: title });\n }\n\n protected override render() {\n // Withhold the SVG until after hydration so the server render and the\n // client's first hydrating render are structurally identical. See\n // `firstUpdated` for the post-hydration reconcile.\n return this.hasUpdated ? html`${unsafeSVG(this._svg)}` : nothing;\n }\n\n /* c8 ignore next 8 */\n @blazorInclude()\n protected async registerIcon(\n name: string,\n url: string,\n collection = 'default'\n ) {\n await registerIcon_impl(name, url, collection);\n }\n\n /* c8 ignore next 8 */\n @blazorInclude()\n protected registerIconFromText(\n name: string,\n iconText: string,\n collection = 'default'\n ) {\n registerIconFromText_impl(name, iconText, collection);\n }\n\n /* c8 ignore next 4 */\n @blazorInclude()\n protected setIconRef(name: string, collection: string, icon: IconMeta) {\n setIconRef_impl(name, collection, icon);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-icon': IgcIconComponent;\n }\n}\n"]}
@@ -14,6 +14,21 @@ export declare abstract class IgcInputBaseComponent extends IgcInputBaseComponen
14
14
  protected abstract readonly _slots: SlotController<any>;
15
15
  protected readonly _inputId: string;
16
16
  protected readonly _input?: HTMLInputElement;
17
+ /**
18
+ * Externally supplied label elements forwarded by a composite host (e.g. `igc-select`)
19
+ * so that the host's associated labels reach the inner native input. When set, these take
20
+ * precedence over the component's own `ElementInternals` labels.
21
+ *
22
+ * @hidden @internal
23
+ */
24
+ _labelElements: ReadonlyArray<Element> | null;
25
+ /**
26
+ * Resolves the label elements applied to the native input as `aria-labelledby` targets,
27
+ * preferring forwarded labels over the component's own `ElementInternals` labels.
28
+ *
29
+ * @hidden @internal
30
+ */
31
+ protected get _resolvedLabelElements(): ReadonlyArray<Element> | null;
17
32
  /** The value attribute of the control. */
18
33
  abstract value: string;
19
34
  /**
@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
7
  import { LitElement, nothing } from 'lit';
8
- import { property, query } from 'lit/decorators.js';
8
+ import { property, query, state } from 'lit/decorators.js';
9
9
  import { cache } from 'lit/directives/cache.js';
10
10
  import { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';
11
11
  import { shadowOptions } from '../common/decorators/shadow-options.js';
@@ -16,8 +16,12 @@ let IgcInputBaseComponent = class IgcInputBaseComponent extends FormAssociatedRe
16
16
  constructor() {
17
17
  super(...arguments);
18
18
  this._inputId = nextInputId();
19
+ this._labelElements = null;
19
20
  this.outlined = false;
20
21
  }
22
+ get _resolvedLabelElements() {
23
+ return this._labelElements ?? this._internals.labels;
24
+ }
21
25
  _resolvePartNames(base) {
22
26
  return {
23
27
  [base]: true,
@@ -56,6 +60,9 @@ let IgcInputBaseComponent = class IgcInputBaseComponent extends FormAssociatedRe
56
60
  __decorate([
57
61
  query('input')
58
62
  ], IgcInputBaseComponent.prototype, "_input", void 0);
63
+ __decorate([
64
+ state()
65
+ ], IgcInputBaseComponent.prototype, "_labelElements", void 0);
59
66
  __decorate([
60
67
  property({ type: Boolean, reflect: true })
61
68
  ], IgcInputBaseComponent.prototype, "outlined", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"input-base.js","sourceRoot":"","sources":["../../../src/components/input/input-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAEvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,2BAA2B,EAAE,MAAM,+CAA+C,CAAC;AAC5F,OAAO,EACL,WAAW,EACX,gBAAgB,GACjB,MAAM,oCAAoC,CAAC;AAkBrC,IAAe,qBAAqB,GAApC,MAAe,qBAAsB,SAAQ,2BAA2B,CAC7E,iBAAiB,CACf,UAAU,CACX,CACF;IAJM;;QAQc,aAAQ,GAAG,WAAW,EAAE,CAAC;QAgBrC,aAAQ,GAAG,KAAK,CAAC;IAoE1B,CAAC;IAhDW,iBAAiB,CAAC,IAAY;QACtC,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE;gBAClD,QAAQ,EAAE,+BAA+B;aAC1C,CAAC;YACF,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE;gBAClD,QAAQ,EAAE,+BAA+B;aAC1C,CAAC;YACF,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;SACrB,CAAC;IACJ,CAAC;IAGM,MAAM;QACX,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;IACxB,CAAC;IAIe,KAAK,CAAC,OAAsB;QAC1C,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAIe,IAAI;QAClB,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC;IACtB,CAAC;IAIS,gBAAgB;QACxB,OAAO,OAAO,CAAC;IACjB,CAAC;IAEkB,MAAM;QACvB,OAAO,KAAK,CACV,gBAAgB,CAAC,IAAI,EAAE;YACrB,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,KAAK;YACzB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,QAAQ;YACtB,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC;YACnD,WAAW,EAAE,IAAI,CAAC,YAAY;YAC9B,eAAe,EAAE,IAAI,CAAC,gBAAgB;SACvC,CAAC,CACH,CAAC;IACJ,CAAC;CACF,CAAA;AAjFoB;IADlB,KAAK,CAAC,OAAO,CAAC;qDAC8B;AAatC;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACnB;AAOjB;IADN,QAAQ,EAAE;0DACiB;AAOrB;IADN,QAAQ,EAAE;oDACW;AAtCF,qBAAqB;IAF1C,gBAAgB;IAChB,aAAa,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;GAClB,qBAAqB,CA4F1C","sourcesContent":["import { LitElement, nothing, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport type { ThemingController } from '../../theming/theming-controller.js';\nimport type { SlotController } from '../common/controllers/slot.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { shadowOptions } from '../common/decorators/shadow-options.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '../common/mixins/forms/associated-required.js';\nimport {\n nextInputId,\n renderInputShell,\n} from '../common/templates/input-shell.js';\n\nexport interface IgcInputComponentEventMap {\n /* alternateName: inputOcurred */\n igcInput: CustomEvent<string>;\n /* blazorSuppress */\n igcChange: CustomEvent<string>;\n // For analyzer meta only:\n /* skipWCPrefix */\n focus: FocusEvent;\n /* skipWCPrefix */\n blur: FocusEvent;\n}\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n@blazorDeepImport\n@shadowOptions({ delegatesFocus: true })\nexport abstract class IgcInputBaseComponent extends FormAssociatedRequiredMixin(\n EventEmitterMixin<IgcInputComponentEventMap, Constructor<LitElement>>(\n LitElement\n )\n) {\n protected abstract readonly _themes: ThemingController;\n protected abstract readonly _slots: SlotController<any>;\n\n protected readonly _inputId = nextInputId();\n\n @query('input')\n protected readonly _input?: HTMLInputElement;\n\n /* blazorSuppress */\n /** The value attribute of the control. */\n public abstract value: string;\n\n /**\n * Whether the control will have outlined appearance.\n *\n * @attr\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public outlined = false;\n\n /**\n * The placeholder attribute of the control.\n * @attr\n */\n @property()\n public placeholder!: string;\n\n /**\n * The label for the control.\n * @attr\n */\n @property()\n public label!: string;\n\n /**\n * Resolves the part names for the container based on the current state.\n * Used to apply conditional styling via CSS parts.\n */\n protected _resolvePartNames(base: string) {\n return {\n [base]: true,\n prefixed: this._slots.hasAssignedElements('prefix', {\n selector: '[slot=\"prefix\"]:not([hidden])',\n }),\n suffixed: this._slots.hasAssignedElements('suffix', {\n selector: '[slot=\"suffix\"]:not([hidden])',\n }),\n filled: !!this.value,\n };\n }\n\n /** Selects all the text inside the input. */\n public select(): void {\n this._input?.select();\n }\n\n /* alternateName: focusComponent */\n /** Sets focus on the control. */\n public override focus(options?: FocusOptions): void {\n this._input?.focus(options);\n }\n\n /* alternateName: blurComponent */\n /** Removes focus from the control. */\n public override blur(): void {\n this._input?.blur();\n }\n\n protected abstract _renderInput(): TemplateResult;\n\n protected _renderFileParts(): TemplateResult | typeof nothing {\n return nothing;\n }\n\n protected override render() {\n return cache(\n renderInputShell(this, {\n theme: this._themes.theme,\n label: this.label,\n labelId: this._inputId,\n containerParts: this._resolvePartNames('container'),\n renderInput: this._renderInput,\n renderFileParts: this._renderFileParts,\n })\n );\n }\n}\n"]}
1
+ {"version":3,"file":"input-base.js","sourceRoot":"","sources":["../../../src/components/input/input-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAEvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,2BAA2B,EAAE,MAAM,+CAA+C,CAAC;AAC5F,OAAO,EACL,WAAW,EACX,gBAAgB,GACjB,MAAM,oCAAoC,CAAC;AAkBrC,IAAe,qBAAqB,GAApC,MAAe,qBAAsB,SAAQ,2BAA2B,CAC7E,iBAAiB,CACf,UAAU,CACX,CACF;IAJM;;QAQc,aAAQ,GAAG,WAAW,EAAE,CAAC;QAarC,mBAAc,GAAkC,IAAI,CAAC;QAuBrD,aAAQ,GAAG,KAAK,CAAC;IAoE1B,CAAC;IAnFC,IAAc,sBAAsB;QAClC,OAAO,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC;IACvD,CAAC;IAiCS,iBAAiB,CAAC,IAAY;QACtC,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE;gBAClD,QAAQ,EAAE,+BAA+B;aAC1C,CAAC;YACF,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE;gBAClD,QAAQ,EAAE,+BAA+B;aAC1C,CAAC;YACF,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;SACrB,CAAC;IACJ,CAAC;IAGM,MAAM;QACX,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;IACxB,CAAC;IAIe,KAAK,CAAC,OAAsB;QAC1C,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAIe,IAAI;QAClB,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC;IACtB,CAAC;IAIS,gBAAgB;QACxB,OAAO,OAAO,CAAC;IACjB,CAAC;IAEkB,MAAM;QACvB,OAAO,KAAK,CACV,gBAAgB,CAAC,IAAI,EAAE;YACrB,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,KAAK;YACzB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,QAAQ;YACtB,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC;YACnD,WAAW,EAAE,IAAI,CAAC,YAAY;YAC9B,eAAe,EAAE,IAAI,CAAC,gBAAgB;SACvC,CAAC,CACH,CAAC;IACJ,CAAC;CACF,CAAA;AArGoB;IADlB,KAAK,CAAC,OAAO,CAAC;qDAC8B;AAUtC;IADN,KAAK,EAAE;6DACoD;AAuBrD;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACnB;AAOjB;IADN,QAAQ,EAAE;0DACiB;AAOrB;IADN,QAAQ,EAAE;oDACW;AA1DF,qBAAqB;IAF1C,gBAAgB;IAChB,aAAa,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;GAClB,qBAAqB,CAgH1C","sourcesContent":["import { LitElement, nothing, type TemplateResult } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport type { ThemingController } from '../../theming/theming-controller.js';\nimport type { SlotController } from '../common/controllers/slot.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { shadowOptions } from '../common/decorators/shadow-options.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '../common/mixins/forms/associated-required.js';\nimport {\n nextInputId,\n renderInputShell,\n} from '../common/templates/input-shell.js';\n\nexport interface IgcInputComponentEventMap {\n /* alternateName: inputOcurred */\n igcInput: CustomEvent<string>;\n /* blazorSuppress */\n igcChange: CustomEvent<string>;\n // For analyzer meta only:\n /* skipWCPrefix */\n focus: FocusEvent;\n /* skipWCPrefix */\n blur: FocusEvent;\n}\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n@blazorDeepImport\n@shadowOptions({ delegatesFocus: true })\nexport abstract class IgcInputBaseComponent extends FormAssociatedRequiredMixin(\n EventEmitterMixin<IgcInputComponentEventMap, Constructor<LitElement>>(\n LitElement\n )\n) {\n protected abstract readonly _themes: ThemingController;\n protected abstract readonly _slots: SlotController<any>;\n\n protected readonly _inputId = nextInputId();\n\n @query('input')\n protected readonly _input?: HTMLInputElement;\n\n /**\n * Externally supplied label elements forwarded by a composite host (e.g. `igc-select`)\n * so that the host's associated labels reach the inner native input. When set, these take\n * precedence over the component's own `ElementInternals` labels.\n *\n * @hidden @internal\n */\n @state()\n public _labelElements: ReadonlyArray<Element> | null = null;\n\n /**\n * Resolves the label elements applied to the native input as `aria-labelledby` targets,\n * preferring forwarded labels over the component's own `ElementInternals` labels.\n *\n * @hidden @internal\n */\n protected get _resolvedLabelElements(): ReadonlyArray<Element> | null {\n return this._labelElements ?? this._internals.labels;\n }\n\n /* blazorSuppress */\n /** The value attribute of the control. */\n public abstract value: string;\n\n /**\n * Whether the control will have outlined appearance.\n *\n * @attr\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public outlined = false;\n\n /**\n * The placeholder attribute of the control.\n * @attr\n */\n @property()\n public placeholder!: string;\n\n /**\n * The label for the control.\n * @attr\n */\n @property()\n public label!: string;\n\n /**\n * Resolves the part names for the container based on the current state.\n * Used to apply conditional styling via CSS parts.\n */\n protected _resolvePartNames(base: string) {\n return {\n [base]: true,\n prefixed: this._slots.hasAssignedElements('prefix', {\n selector: '[slot=\"prefix\"]:not([hidden])',\n }),\n suffixed: this._slots.hasAssignedElements('suffix', {\n selector: '[slot=\"suffix\"]:not([hidden])',\n }),\n filled: !!this.value,\n };\n }\n\n /** Selects all the text inside the input. */\n public select(): void {\n this._input?.select();\n }\n\n /* alternateName: focusComponent */\n /** Sets focus on the control. */\n public override focus(options?: FocusOptions): void {\n this._input?.focus(options);\n }\n\n /* alternateName: blurComponent */\n /** Removes focus from the control. */\n public override blur(): void {\n this._input?.blur();\n }\n\n protected abstract _renderInput(): TemplateResult;\n\n protected _renderFileParts(): TemplateResult | typeof nothing {\n return nothing;\n }\n\n protected override render() {\n return cache(\n renderInputShell(this, {\n theme: this._themes.theme,\n label: this.label,\n labelId: this._inputId,\n containerParts: this._resolvePartNames('container'),\n renderInput: this._renderInput,\n renderFileParts: this._renderFileParts,\n })\n );\n }\n}\n"]}
@@ -140,6 +140,7 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
140
140
  minlength=${ifDefined(this.minLength)}
141
141
  maxlength=${bindIf(!this.validateOnly, this.maxLength)}
142
142
  step=${ifDefined(this.step)}
143
+ .ariaLabelledByElements=${this._resolvedLabelElements}
143
144
  aria-describedby=${bindIf(hasHelperText, 'helper-text')}
144
145
  @keydown=${this._handleEnterKeydown}
145
146
  @change=${this._handleChange}