igniteui-webcomponents 7.3.0-beta.0 → 7.3.0

package/components/file-input/file-input.js.map

@@ -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 { ariaBindings } from '#internals/controllers/aria-projection.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addI18nController } from '#internals/i18n/i18n-controller.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormValueFileListTransformers } from '#internals/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { partMap } from '#internals/part-map.js';\nimport { hasFiles } from '#internals/utils/dom.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.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   * Whether the control 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 file types the control accepts, as a comma-separated list.\n   * @attr\n   */\n  @property()\n  public accept = '';\n\n  /**\n   * Whether the control should receive focus automatically.\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  /**\n   * A file input cannot have a default file list, so the `value` attribute\n   * never contributes a default - otherwise its string would be stored as the\n   * FileList default and submitted character-by-character after a form reset.\n   */\n  protected override _setDefaultValue(): void {\n    this._formValue.defaultValue = null;\n  }\n\n  /**\n   * Restores directly instead of through the `value` setter: the setter is\n   * deliberately inert (read-only semantics) and never updates the form state.\n   */\n  protected override _restoreDefaultValue(): void {\n    if (this._input) {\n      this._input.value = '';\n    }\n    this._formValue.setValueAndFormState(this._formValue.defaultValue);\n    this.requestUpdate();\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\n    return html`\n      <input\n        ${ariaBindings(this._ariaTarget.resolveBindings())}\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        @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"]}
+{"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 { ariaBindings } from '#internals/controllers/aria-projection.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { I18nControllerConfig } from '#internals/i18n/i18n-controller.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormValueFileListTransformers } from '#internals/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { I18nMixin } from '#internals/mixins/i18n.js';\nimport { partMap } from '#internals/part-map.js';\nimport { hasFiles } from '#internals/utils/dom.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.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\nconst i18n: I18nControllerConfig<IFileInputResourceStrings> = {\n  defaultEN: FileInputResourceStringsEN,\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 I18nMixin(\n  EventEmitterMixin<\n    IgcFileInputComponentEventMap,\n    AbstractConstructor<IgcInputBaseComponent>\n  >(IgcInputBaseComponent),\n  i18n\n) {\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 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   * Whether the control 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 file types the control accepts, as a comma-separated list.\n   * @attr\n   */\n  @property()\n  public accept = '';\n\n  /**\n   * Whether the control should receive focus automatically.\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  /**\n   * A file input cannot have a default file list, so the `value` attribute\n   * never contributes a default - otherwise its string would be stored as the\n   * FileList default and submitted character-by-character after a form reset.\n   */\n  protected override _setDefaultValue(): void {\n    this._formValue.defaultValue = null;\n  }\n\n  /**\n   * Restores directly instead of through the `value` setter: the setter is\n   * deliberately inert (read-only semantics) and never updates the form state.\n   */\n  protected override _restoreDefaultValue(): void {\n    if (this._input) {\n      this._input.value = '';\n    }\n    this._formValue.setValueAndFormState(this._formValue.defaultValue);\n    this.requestUpdate();\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\n    return html`\n      <input\n        ${ariaBindings(this._ariaTarget.resolveBindings())}\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        @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"]}

package/components/highlight/highlight.d.ts

@@ -18,7 +18,7 @@ import { type HighlightNavigation } from './service.js';
  * @cssproperty --background-active - The background color for the active highlighted text node.
  *
  * @example
- * Basic usage — wrap your text and set the `search-text` attribute:
+ * Basic usage - wrap your text and set the `search-text` attribute:
  * ```html
  * <igc-highlight search-text="world">
  *   <p>Hello, world! The world is a wonderful place.</p>
@@ -29,7 +29,7 @@ import { type HighlightNavigation } from './service.js';
  * Case-sensitive search:
  * ```html
  * <igc-highlight search-text="Hello" case-sensitive>
- *   <p>Hello hello HELLO — only the first one matches.</p>
+ *   <p>Hello hello HELLO - only the first one matches.</p>
  * </igc-highlight>
  * ```
  *
@@ -67,8 +67,8 @@ export default class IgcHighlightComponent extends LitElement {
     static styles: import("lit").CSSResult[];
     static register(): void;
     private readonly _service;
-    private _caseSensitive;
-    private _searchText;
+    /** Shared config for the properties that trigger a new search when changed. */
+    private static readonly _search;
     /**
      * Whether to match the searched text with case sensitivity in mind.
      * When `true`, only exact-case occurrences of `searchText` are highlighted.
@@ -76,8 +76,7 @@ export default class IgcHighlightComponent extends LitElement {
      * @attr case-sensitive
      * @default false
      */
-    set caseSensitive(value: boolean);
-    get caseSensitive(): boolean;
+    caseSensitive: boolean;
     /**
      * The string to search and highlight in the DOM content of the component.
      * Setting this property triggers a new search automatically.
@@ -85,8 +84,7 @@ export default class IgcHighlightComponent extends LitElement {
      *
      * @attr search-text
      */
-    set searchText(value: string);
-    get searchText(): string;
+    searchText: string;
     /** The total number of matches found for the current `searchText`. Returns `0` when there are no matches or `searchText` is empty. */
     get size(): number;
     /** The zero-based index of the currently active (focused) match. Returns `0` when there are no matches. */

package/components/highlight/highlight.js

@@ -6,6 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
+import { coercedProperty, } from '#internals/decorators/coerced-property.js';
 import { registerComponent } from '#internals/definitions/register.js';
 import { addThemingController } from '#theming/theming-controller.js';
 import { createHighlightController, } from './service.js';
@@ -17,20 +18,9 @@ export default class IgcHighlightComponent extends LitElement {
     static register() {
         registerComponent(IgcHighlightComponent);
     }
-    set caseSensitive(value) {
-        this._caseSensitive = value;
-        this.search();
-    }
-    get caseSensitive() {
-        return this._caseSensitive;
-    }
-    set searchText(value) {
-        this._searchText = value;
-        this.search();
-    }
-    get searchText() {
-        return this._searchText;
-    }
+    static { this._search = {
+        onChange: ({ host }) => host.search(),
+    }; }
     get size() {
         return this._service.size;
     }
@@ -40,8 +30,8 @@ export default class IgcHighlightComponent extends LitElement {
     constructor() {
         super();
         this._service = createHighlightController(this);
-        this._caseSensitive = false;
-        this._searchText = '';
+        this.caseSensitive = false;
+        this.searchText = '';
         addThemingController(this, all, {
             themeChange: this._addStylesheet,
         });
@@ -69,9 +59,11 @@ export default class IgcHighlightComponent extends LitElement {
     }
 }
 __decorate([
-    property({ type: Boolean, reflect: true, attribute: 'case-sensitive' })
-], IgcHighlightComponent.prototype, "caseSensitive", null);
+    property({ type: Boolean, reflect: true, attribute: 'case-sensitive' }),
+    coercedProperty(IgcHighlightComponent._search)
+], IgcHighlightComponent.prototype, "caseSensitive", void 0);
 __decorate([
-    property({ attribute: 'search-text' })
-], IgcHighlightComponent.prototype, "searchText", null);
+    property({ attribute: 'search-text' }),
+    coercedProperty(IgcHighlightComponent._search)
+], IgcHighlightComponent.prototype, "searchText", void 0);
 //# sourceMappingURL=highlight.js.map

package/components/highlight/highlight.js.map

@@ -1 +1 @@
-{"version":3,"file":"highlight.js","sourceRoot":"","sources":["../../../src/components/highlight/highlight.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EACL,yBAAyB,GAE1B,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAgEzC,MAAM,CAAC,OAAO,OAAO,qBAAsB,SAAQ,UAAU;aACpC,YAAO,GAAG,eAAe,AAAlB,CAAmB;aAC1B,WAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;IAGlC,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;IAC3C,CAAC;IAqBD,IAAW,aAAa,CAAC,KAAc;QACrC,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,IAAW,aAAa;QACtB,OAAO,IAAI,CAAC,cAAc,CAAC;IAC7B,CAAC;IAUD,IAAW,UAAU,CAAC,KAAa;QACjC,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,IAAW,UAAU;QACnB,OAAO,IAAI,CAAC,WAAW,CAAC;IAC1B,CAAC;IAGD,IAAW,IAAI;QACb,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC5B,CAAC;IAGD,IAAW,OAAO;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;IAC/B,CAAC;IAID;QACE,KAAK,EAAE,CAAC;QAxDO,aAAQ,GAAG,yBAAyB,CAAC,IAAI,CAAC,CAAC;QAEpD,mBAAc,GAAG,KAAK,CAAC;QACvB,gBAAW,GAAG,EAAE,CAAC;QAuDvB,oBAAoB,CAAC,IAAI,EAAE,GAAG,EAAE;YAC9B,WAAW,EAAE,IAAI,CAAC,cAAc;SACjC,CAAC,CAAC;IACL,CAAC;IAIO,cAAc;QACpB,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAE,CAAC;IACnC,CAAC;IAYM,IAAI,CAAC,OAA6B;QACvC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAQM,QAAQ,CAAC,OAA6B;QAC3C,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC;IAQM,SAAS,CAAC,KAAa,EAAE,OAA6B;QAC3D,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAC1C,CAAC;IAQM,MAAM;QACX,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;YACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACtC,CAAC;IACH,CAAC;IAIkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AAvGD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;0DAIvE;AAcD;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;uDAItC","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport {\n  createHighlightController,\n  type HighlightNavigation,\n} from './service.js';\nimport { styles as shared } from './themes/shared/highlight.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * The highlight component provides efficient searching and highlighting of text\n * projected into it via its default slot. It uses the native CSS Custom Highlight API\n * to apply highlight styles to matched text nodes without modifying the DOM.\n *\n * The component supports case-sensitive matching, programmatic navigation between\n * matches, and automatic scroll-into-view of the active match.\n *\n * @element igc-highlight\n *\n * @slot - The default slot. Place the text content you want to search and highlight here.\n *\n * @cssproperty --foreground - The text color for a highlighted text node.\n * @cssproperty --background - The background color for a highlighted text node.\n * @cssproperty --foreground-active - The text color for the active highlighted text node.\n * @cssproperty --background-active - The background color for the active highlighted text node.\n *\n * @example\n * Basic usage — wrap your text and set the `search-text` attribute:\n * ```html\n * <igc-highlight search-text=\"world\">\n *   <p>Hello, world! The world is a wonderful place.</p>\n * </igc-highlight>\n * ```\n *\n * @example\n * Case-sensitive search:\n * ```html\n * <igc-highlight search-text=\"Hello\" case-sensitive>\n *   <p>Hello hello HELLO — only the first one matches.</p>\n * </igc-highlight>\n * ```\n *\n * @example\n * Navigating between matches programmatically:\n * ```typescript\n * const highlight = document.querySelector('igc-highlight');\n *\n * highlight.searchText = 'world';\n * console.log(highlight.size);    // total number of matches\n * console.log(highlight.current); // index of the active match (0-based)\n *\n * highlight.next();               // move to the next match\n * highlight.previous();           // move to the previous match\n * highlight.setActive(2);         // jump to a specific match by index\n * ```\n *\n * @example\n * Prevent scroll-into-view when navigating:\n * ```typescript\n * const highlight = document.querySelector('igc-highlight');\n * highlight.next({ preventScroll: true });\n * ```\n *\n * @example\n * Re-run search after dynamic content changes (e.g. lazy-loaded text):\n * ```typescript\n * const highlight = document.querySelector('igc-highlight');\n * // After slotted content has been updated:\n * highlight.search();\n * ```\n */\nexport default class IgcHighlightComponent extends LitElement {\n  public static readonly tagName = 'igc-highlight';\n  public static override styles = [shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcHighlightComponent);\n  }\n\n  //#region Internal properties and state\n\n  private readonly _service = createHighlightController(this);\n\n  private _caseSensitive = false;\n  private _searchText = '';\n\n  //#endregion\n\n  //#region Public properties and attributes\n\n  /**\n   * Whether to match the searched text with case sensitivity in mind.\n   * When `true`, only exact-case occurrences of `searchText` are highlighted.\n   *\n   * @attr case-sensitive\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'case-sensitive' })\n  public set caseSensitive(value: boolean) {\n    this._caseSensitive = value;\n    this.search();\n  }\n\n  public get caseSensitive(): boolean {\n    return this._caseSensitive;\n  }\n\n  /**\n   * The string to search and highlight in the DOM content of the component.\n   * Setting this property triggers a new search automatically.\n   * An empty string clears all highlights.\n   *\n   * @attr search-text\n   */\n  @property({ attribute: 'search-text' })\n  public set searchText(value: string) {\n    this._searchText = value;\n    this.search();\n  }\n\n  public get searchText(): string {\n    return this._searchText;\n  }\n\n  /** The total number of matches found for the current `searchText`. Returns `0` when there are no matches or `searchText` is empty. */\n  public get size(): number {\n    return this._service.size;\n  }\n\n  /** The zero-based index of the currently active (focused) match. Returns `0` when there are no matches. */\n  public get current(): number {\n    return this._service.current;\n  }\n\n  //#endregion\n\n  constructor() {\n    super();\n\n    addThemingController(this, all, {\n      themeChange: this._addStylesheet,\n    });\n  }\n\n  //#region Internal methods\n\n  private _addStylesheet(): void {\n    this._service.attachStylesheet();\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /**\n   * Moves the active highlight to the next match.\n   * Wraps around to the first match after the last one.\n   *\n   * @param options - Optional navigation options (e.g. `preventScroll`).\n   */\n  public next(options?: HighlightNavigation): void {\n    this._service.next(options);\n  }\n\n  /**\n   * Moves the active highlight to the previous match.\n   * Wraps around to the last match when going back from the first one.\n   *\n   * @param options - Optional navigation options (e.g. `preventScroll`).\n   */\n  public previous(options?: HighlightNavigation): void {\n    this._service.previous(options);\n  }\n\n  /**\n   * Moves the active highlight to the match at the specified zero-based index.\n   *\n   * @param index - The zero-based index of the match to activate.\n   * @param options - Optional navigation options (e.g. `preventScroll`).\n   */\n  public setActive(index: number, options?: HighlightNavigation): void {\n    this._service.setActive(index, options);\n  }\n\n  /**\n   * Re-runs the highlight search based on the current `searchText` and `caseSensitive` values.\n   *\n   * Call this method after the slotted content changes dynamically (e.g. after lazy loading\n   * or programmatic DOM mutations) to ensure all matches are up to date.\n   */\n  public search(): void {\n    if (this.hasUpdated) {\n      this._service.clear();\n      this._service.find(this.searchText);\n    }\n  }\n\n  //#endregion\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-highlight': IgcHighlightComponent;\n  }\n}\n"]}
+{"version":3,"file":"highlight.js","sourceRoot":"","sources":["../../../src/components/highlight/highlight.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EACL,eAAe,GAEhB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EACL,yBAAyB,GAE1B,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAgEzC,MAAM,CAAC,OAAO,OAAO,qBAAsB,SAAQ,UAAU;aACpC,YAAO,GAAG,eAAe,AAAlB,CAAmB;aAC1B,WAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;IAGlC,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;IAC3C,CAAC;aAOuB,YAAO,GAG3B;QACF,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE;KACtC,AAL8B,CAK7B;IA6BF,IAAW,IAAI;QACb,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC5B,CAAC;IAGD,IAAW,OAAO;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;IAC/B,CAAC;IAID;QACE,KAAK,EAAE,CAAC;QAjDO,aAAQ,GAAG,yBAAyB,CAAC,IAAI,CAAC,CAAC;QAuBrD,kBAAa,GAAG,KAAK,CAAC;QAWtB,eAAU,GAAG,EAAE,CAAC;QAiBrB,oBAAoB,CAAC,IAAI,EAAE,GAAG,EAAE;YAC9B,WAAW,EAAE,IAAI,CAAC,cAAc;SACjC,CAAC,CAAC;IACL,CAAC;IAIO,cAAc;QACpB,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAE,CAAC;IACnC,CAAC;IAYM,IAAI,CAAC,OAA6B;QACvC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAQM,QAAQ,CAAC,OAA6B;QAC3C,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC;IAQM,SAAS,CAAC,KAAa,EAAE,OAA6B;QAC3D,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAC1C,CAAC;IAQM,MAAM;QACX,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;YACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACtC,CAAC;IACH,CAAC;IAIkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AA1FM;IAFN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;IACvE,eAAe,CAAC,qBAAqB,CAAC,OAAO,CAAC;4DAClB;AAWtB;IAFN,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;IACtC,eAAe,CAAC,qBAAqB,CAAC,OAAO,CAAC;yDACxB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport {\n  coercedProperty,\n  type CoercedPropertyConfig,\n} from '#internals/decorators/coerced-property.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport {\n  createHighlightController,\n  type HighlightNavigation,\n} from './service.js';\nimport { styles as shared } from './themes/shared/highlight.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * The highlight component provides efficient searching and highlighting of text\n * projected into it via its default slot. It uses the native CSS Custom Highlight API\n * to apply highlight styles to matched text nodes without modifying the DOM.\n *\n * The component supports case-sensitive matching, programmatic navigation between\n * matches, and automatic scroll-into-view of the active match.\n *\n * @element igc-highlight\n *\n * @slot - The default slot. Place the text content you want to search and highlight here.\n *\n * @cssproperty --foreground - The text color for a highlighted text node.\n * @cssproperty --background - The background color for a highlighted text node.\n * @cssproperty --foreground-active - The text color for the active highlighted text node.\n * @cssproperty --background-active - The background color for the active highlighted text node.\n *\n * @example\n * Basic usage - wrap your text and set the `search-text` attribute:\n * ```html\n * <igc-highlight search-text=\"world\">\n *   <p>Hello, world! The world is a wonderful place.</p>\n * </igc-highlight>\n * ```\n *\n * @example\n * Case-sensitive search:\n * ```html\n * <igc-highlight search-text=\"Hello\" case-sensitive>\n *   <p>Hello hello HELLO - only the first one matches.</p>\n * </igc-highlight>\n * ```\n *\n * @example\n * Navigating between matches programmatically:\n * ```typescript\n * const highlight = document.querySelector('igc-highlight');\n *\n * highlight.searchText = 'world';\n * console.log(highlight.size);    // total number of matches\n * console.log(highlight.current); // index of the active match (0-based)\n *\n * highlight.next();               // move to the next match\n * highlight.previous();           // move to the previous match\n * highlight.setActive(2);         // jump to a specific match by index\n * ```\n *\n * @example\n * Prevent scroll-into-view when navigating:\n * ```typescript\n * const highlight = document.querySelector('igc-highlight');\n * highlight.next({ preventScroll: true });\n * ```\n *\n * @example\n * Re-run search after dynamic content changes (e.g. lazy-loaded text):\n * ```typescript\n * const highlight = document.querySelector('igc-highlight');\n * // After slotted content has been updated:\n * highlight.search();\n * ```\n */\nexport default class IgcHighlightComponent extends LitElement {\n  public static readonly tagName = 'igc-highlight';\n  public static override styles = [shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcHighlightComponent);\n  }\n\n  //#region Internal properties and state\n\n  private readonly _service = createHighlightController(this);\n\n  /** Shared config for the properties that trigger a new search when changed. */\n  private static readonly _search: CoercedPropertyConfig<\n    unknown,\n    IgcHighlightComponent\n  > = {\n    onChange: ({ host }) => host.search(),\n  };\n\n  //#endregion\n\n  //#region Public properties and attributes\n\n  /**\n   * Whether to match the searched text with case sensitivity in mind.\n   * When `true`, only exact-case occurrences of `searchText` are highlighted.\n   *\n   * @attr case-sensitive\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'case-sensitive' })\n  @coercedProperty(IgcHighlightComponent._search)\n  public caseSensitive = false;\n\n  /**\n   * The string to search and highlight in the DOM content of the component.\n   * Setting this property triggers a new search automatically.\n   * An empty string clears all highlights.\n   *\n   * @attr search-text\n   */\n  @property({ attribute: 'search-text' })\n  @coercedProperty(IgcHighlightComponent._search)\n  public searchText = '';\n\n  /** The total number of matches found for the current `searchText`. Returns `0` when there are no matches or `searchText` is empty. */\n  public get size(): number {\n    return this._service.size;\n  }\n\n  /** The zero-based index of the currently active (focused) match. Returns `0` when there are no matches. */\n  public get current(): number {\n    return this._service.current;\n  }\n\n  //#endregion\n\n  constructor() {\n    super();\n\n    addThemingController(this, all, {\n      themeChange: this._addStylesheet,\n    });\n  }\n\n  //#region Internal methods\n\n  private _addStylesheet(): void {\n    this._service.attachStylesheet();\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /**\n   * Moves the active highlight to the next match.\n   * Wraps around to the first match after the last one.\n   *\n   * @param options - Optional navigation options (e.g. `preventScroll`).\n   */\n  public next(options?: HighlightNavigation): void {\n    this._service.next(options);\n  }\n\n  /**\n   * Moves the active highlight to the previous match.\n   * Wraps around to the last match when going back from the first one.\n   *\n   * @param options - Optional navigation options (e.g. `preventScroll`).\n   */\n  public previous(options?: HighlightNavigation): void {\n    this._service.previous(options);\n  }\n\n  /**\n   * Moves the active highlight to the match at the specified zero-based index.\n   *\n   * @param index - The zero-based index of the match to activate.\n   * @param options - Optional navigation options (e.g. `preventScroll`).\n   */\n  public setActive(index: number, options?: HighlightNavigation): void {\n    this._service.setActive(index, options);\n  }\n\n  /**\n   * Re-runs the highlight search based on the current `searchText` and `caseSensitive` values.\n   *\n   * Call this method after the slotted content changes dynamically (e.g. after lazy loading\n   * or programmatic DOM mutations) to ensure all matches are up to date.\n   */\n  public search(): void {\n    if (this.hasUpdated) {\n      this._service.clear();\n      this._service.find(this.searchText);\n    }\n  }\n\n  //#endregion\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-highlight': IgcHighlightComponent;\n  }\n}\n"]}

package/components/icon/icon-references.js

@@ -36,6 +36,7 @@ const ICON_ALIASES = {
     regenerate: { default: 'reload' },
     copy_content: { default: 'copy' },
     collapse: { default: 'keyboard_arrow_up', indigo: 'indigo_chevron_up' },
+    eye_dropper: { default: 'colorize' },
     arrow_prev: {
         default: 'navigate_before',
         fluent: 'arrow_upward',

package/components/icon/icon-references.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-references.js","sourceRoot":"","sources":["../../../src/components/icon/icon-references.ts"],"names":[],"mappings":"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","sourcesContent":["/** READ BEFORE YOU MODIFY THIS FILE!\n *\n * Before you add/modify an icon reference, please think about the semantics of the icon you are adding/modifying.\n *\n * Icon aliases have sematic meaning depending on the context in which they are used.\n * For instance, if your component handles toggling between expanded and collapsed states,\n * you may want to use the already existing `expand` and `collapse` aliases that point to\n * the `expand_more` and `expand_less` icons in the material font set.\n *\n * It may so happen, however, that the design of your component requires you to use the `chevron_right` for the\n * expand icon and the `expand_more` for the collapse icon. In this case the `tree_expand` and `tree_collapse` aliases\n * would be appropriate.\n * This distinction is important when choosing which icon to use for your component as it will have an impact\n * when a user decides to rewire the `expand`/`collapse` icons to some other icons.\n *\n * Likewise, modifying existing references should be handled with caution as many component in the framework already\n * share icons that have equivalent semantic meaning. For example, the `Paginator`, `Grid Filtering Row`,\n * and `Tabs` components in Ignite UI for Angular all use the `prev` and `next` icons for navigating between pages\n * or lists of items. Changing the underlying target for those icons should be done in a way that suits all components.\n *\n * Keep in mind that icon aliases and their underlying names are shared between Ignite UI component frameworks\n * and changing an alias name here should be reflected in the other frameworks as well.\n *\n * To get acquainted with which component uses what icon, please make sure to read the\n * [docs](https://infragistics.com/products/ignite-ui-angular/Angular/components/icon-service#internal-usage).\n */\nimport type { IconMeta, IconThemeKey } from './registry/types.js';\n\n/** The collection every built-in alias target lives in. */\nconst INTERNAL = 'internal';\n\n/**\n * Maps an alias in the `default` collection to the name of its target icon in\n * the `internal` collection, per theme. The `default` entry is the fallback for\n * themes without an explicit target.\n */\nconst ICON_ALIASES: Record<string, Partial<Record<IconThemeKey, string>>> = {\n  expand: { default: 'keyboard_arrow_down', indigo: 'indigo_chevron_down' },\n  attach_file: { default: 'attach_file', indigo: 'indigo_attach_file' },\n  attach_document: { default: 'document_filled' },\n  attach_image: { default: 'document_image' },\n  auto_suggest: { default: 'auto_suggest' },\n  send_message: { default: 'send' },\n  image_thumbnail: { default: 'image' },\n  table_thumbnail: { default: 'table' },\n  layout_thumbnail: { default: 'layout' },\n  code_thumbnail: { default: 'code_circle' },\n  document_thumbnail: { default: 'document_empty' },\n  file_generic: { default: 'file_generic' },\n  file_css: { default: 'file_css' },\n  file_csv: { default: 'file_csv' },\n  file_doc: { default: 'file_doc' },\n  file_htm: { default: 'file_htm' },\n  file_html: { default: 'file_html' },\n  file_js: { default: 'file_js' },\n  file_json: { default: 'file_json' },\n  file_pdf: { default: 'file_pdf' },\n  file_rtf: { default: 'file_rtf' },\n  file_svg: { default: 'file_svg' },\n  file_txt: { default: 'file_txt' },\n  file_xls: { default: 'file_xls' },\n  file_xml: { default: 'file_xml' },\n  file_zip: { default: 'file_zip' },\n  file_link: { default: 'file_link' },\n  more_horiz: { default: 'more_horiz' },\n  open_in_new: { default: 'open_in_new' },\n  thumb_up_active: { default: 'thumb_up_filled' },\n  thumb_up_inactive: { default: 'thumb_up_empty' },\n  thumb_down_active: { default: 'thumb_down_filled' },\n  thumb_down_inactive: { default: 'thumb_down_empty' },\n  regenerate: { default: 'reload' },\n  copy_content: { default: 'copy' },\n  collapse: { default: 'keyboard_arrow_up', indigo: 'indigo_chevron_up' },\n  arrow_prev: {\n    default: 'navigate_before',\n    fluent: 'arrow_upward',\n    indigo: 'indigo_chevron_left',\n  },\n  arrow_next: {\n    default: 'navigate_next',\n    fluent: 'arrow_downward',\n    indigo: 'indigo_chevron_right',\n  },\n  selected: { default: 'chip_select' },\n  remove: { default: 'chip_cancel', indigo: 'indigo_cancel' },\n  input_clear: { default: 'clear', indigo: 'indigo_clear' },\n  input_expand: {\n    default: 'keyboard_arrow_down',\n    indigo: 'indigo_chevron_down',\n  },\n  input_collapse: { default: 'keyboard_arrow_up', indigo: 'indigo_chevron_up' },\n  chevron_right: {\n    default: 'keyboard_arrow_right',\n    indigo: 'indigo_chevron_right',\n  },\n  chevron_left: { default: 'navigate_before', indigo: 'indigo_chevron_left' },\n  case_sensitive: { default: 'case_sensitive' },\n  today: { default: 'calendar_today', indigo: 'indigo_calendar_today' },\n  clock: { default: 'access_time', indigo: 'indigo_access_time' },\n  star_filled: { default: 'star' },\n  star_outlined: { default: 'star_border' },\n  prev: { default: 'navigate_before', indigo: 'indigo_chevron_left' },\n  next: { default: 'navigate_next', indigo: 'indigo_chevron_right' },\n  tree_expand: {\n    default: 'keyboard_arrow_right',\n    indigo: 'indigo_chevron_right',\n  },\n  tree_collapse: {\n    default: 'keyboard_arrow_down',\n    indigo: 'indigo_chevron_down',\n  },\n  carousel_prev: {\n    default: 'keyboard_arrow_left',\n    indigo: 'indigo_chevron_left',\n  },\n  carousel_next: {\n    default: 'keyboard_arrow_right',\n    indigo: 'indigo_chevron_right',\n  },\n  error: { default: 'error', indigo: 'indigo_error' },\n  fullscreen: { default: 'fullscreen', indigo: 'indigo_fullscreen' },\n  fullscreen_exit: {\n    default: 'fullscreen_exit',\n    indigo: 'indigo_fullscreen_exit',\n  },\n  expand_content: {\n    default: 'expand_content',\n    indigo: 'indigo_expand_content',\n  },\n  collapse_content: {\n    default: 'collapse_content',\n    indigo: 'indigo_collapse_content',\n  },\n  resize: { default: 'resize' },\n};\n\n/** Resolved alias name -> theme -> target icon. */\nexport const ICON_REFERENCES: ReadonlyMap<\n  string,\n  ReadonlyMap<IconThemeKey, IconMeta>\n> = new Map(\n  Object.entries(ICON_ALIASES).map(([alias, targets]) => [\n    alias,\n    new Map(\n      (Object.entries(targets) as [IconThemeKey, string][]).map(\n        ([theme, name]) => [theme, { name, collection: INTERNAL }]\n      )\n    ),\n  ])\n);\n"]}
+{"version":3,"file":"icon-references.js","sourceRoot":"","sources":["../../../src/components/icon/icon-references.ts"],"names":[],"mappings":"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","sourcesContent":["/** READ BEFORE YOU MODIFY THIS FILE!\n *\n * Before you add/modify an icon reference, please think about the semantics of the icon you are adding/modifying.\n *\n * Icon aliases have sematic meaning depending on the context in which they are used.\n * For instance, if your component handles toggling between expanded and collapsed states,\n * you may want to use the already existing `expand` and `collapse` aliases that point to\n * the `expand_more` and `expand_less` icons in the material font set.\n *\n * It may so happen, however, that the design of your component requires you to use the `chevron_right` for the\n * expand icon and the `expand_more` for the collapse icon. In this case the `tree_expand` and `tree_collapse` aliases\n * would be appropriate.\n * This distinction is important when choosing which icon to use for your component as it will have an impact\n * when a user decides to rewire the `expand`/`collapse` icons to some other icons.\n *\n * Likewise, modifying existing references should be handled with caution as many component in the framework already\n * share icons that have equivalent semantic meaning. For example, the `Paginator`, `Grid Filtering Row`,\n * and `Tabs` components in Ignite UI for Angular all use the `prev` and `next` icons for navigating between pages\n * or lists of items. Changing the underlying target for those icons should be done in a way that suits all components.\n *\n * Keep in mind that icon aliases and their underlying names are shared between Ignite UI component frameworks\n * and changing an alias name here should be reflected in the other frameworks as well.\n *\n * To get acquainted with which component uses what icon, please make sure to read the\n * [docs](https://infragistics.com/products/ignite-ui-angular/Angular/components/icon-service#internal-usage).\n */\nimport type { IconMeta, IconThemeKey } from './registry/types.js';\n\n/** The collection every built-in alias target lives in. */\nconst INTERNAL = 'internal';\n\n/**\n * Maps an alias in the `default` collection to the name of its target icon in\n * the `internal` collection, per theme. The `default` entry is the fallback for\n * themes without an explicit target.\n */\nconst ICON_ALIASES: Record<string, Partial<Record<IconThemeKey, string>>> = {\n  expand: { default: 'keyboard_arrow_down', indigo: 'indigo_chevron_down' },\n  attach_file: { default: 'attach_file', indigo: 'indigo_attach_file' },\n  attach_document: { default: 'document_filled' },\n  attach_image: { default: 'document_image' },\n  auto_suggest: { default: 'auto_suggest' },\n  send_message: { default: 'send' },\n  image_thumbnail: { default: 'image' },\n  table_thumbnail: { default: 'table' },\n  layout_thumbnail: { default: 'layout' },\n  code_thumbnail: { default: 'code_circle' },\n  document_thumbnail: { default: 'document_empty' },\n  file_generic: { default: 'file_generic' },\n  file_css: { default: 'file_css' },\n  file_csv: { default: 'file_csv' },\n  file_doc: { default: 'file_doc' },\n  file_htm: { default: 'file_htm' },\n  file_html: { default: 'file_html' },\n  file_js: { default: 'file_js' },\n  file_json: { default: 'file_json' },\n  file_pdf: { default: 'file_pdf' },\n  file_rtf: { default: 'file_rtf' },\n  file_svg: { default: 'file_svg' },\n  file_txt: { default: 'file_txt' },\n  file_xls: { default: 'file_xls' },\n  file_xml: { default: 'file_xml' },\n  file_zip: { default: 'file_zip' },\n  file_link: { default: 'file_link' },\n  more_horiz: { default: 'more_horiz' },\n  open_in_new: { default: 'open_in_new' },\n  thumb_up_active: { default: 'thumb_up_filled' },\n  thumb_up_inactive: { default: 'thumb_up_empty' },\n  thumb_down_active: { default: 'thumb_down_filled' },\n  thumb_down_inactive: { default: 'thumb_down_empty' },\n  regenerate: { default: 'reload' },\n  copy_content: { default: 'copy' },\n  collapse: { default: 'keyboard_arrow_up', indigo: 'indigo_chevron_up' },\n  eye_dropper: { default: 'colorize' },\n  arrow_prev: {\n    default: 'navigate_before',\n    fluent: 'arrow_upward',\n    indigo: 'indigo_chevron_left',\n  },\n  arrow_next: {\n    default: 'navigate_next',\n    fluent: 'arrow_downward',\n    indigo: 'indigo_chevron_right',\n  },\n  selected: { default: 'chip_select' },\n  remove: { default: 'chip_cancel', indigo: 'indigo_cancel' },\n  input_clear: { default: 'clear', indigo: 'indigo_clear' },\n  input_expand: {\n    default: 'keyboard_arrow_down',\n    indigo: 'indigo_chevron_down',\n  },\n  input_collapse: { default: 'keyboard_arrow_up', indigo: 'indigo_chevron_up' },\n  chevron_right: {\n    default: 'keyboard_arrow_right',\n    indigo: 'indigo_chevron_right',\n  },\n  chevron_left: { default: 'navigate_before', indigo: 'indigo_chevron_left' },\n  case_sensitive: { default: 'case_sensitive' },\n  today: { default: 'calendar_today', indigo: 'indigo_calendar_today' },\n  clock: { default: 'access_time', indigo: 'indigo_access_time' },\n  star_filled: { default: 'star' },\n  star_outlined: { default: 'star_border' },\n  prev: { default: 'navigate_before', indigo: 'indigo_chevron_left' },\n  next: { default: 'navigate_next', indigo: 'indigo_chevron_right' },\n  tree_expand: {\n    default: 'keyboard_arrow_right',\n    indigo: 'indigo_chevron_right',\n  },\n  tree_collapse: {\n    default: 'keyboard_arrow_down',\n    indigo: 'indigo_chevron_down',\n  },\n  carousel_prev: {\n    default: 'keyboard_arrow_left',\n    indigo: 'indigo_chevron_left',\n  },\n  carousel_next: {\n    default: 'keyboard_arrow_right',\n    indigo: 'indigo_chevron_right',\n  },\n  error: { default: 'error', indigo: 'indigo_error' },\n  fullscreen: { default: 'fullscreen', indigo: 'indigo_fullscreen' },\n  fullscreen_exit: {\n    default: 'fullscreen_exit',\n    indigo: 'indigo_fullscreen_exit',\n  },\n  expand_content: {\n    default: 'expand_content',\n    indigo: 'indigo_expand_content',\n  },\n  collapse_content: {\n    default: 'collapse_content',\n    indigo: 'indigo_collapse_content',\n  },\n  resize: { default: 'resize' },\n};\n\n/** Resolved alias name -> theme -> target icon. */\nexport const ICON_REFERENCES: ReadonlyMap<\n  string,\n  ReadonlyMap<IconThemeKey, IconMeta>\n> = new Map(\n  Object.entries(ICON_ALIASES).map(([alias, targets]) => [\n    alias,\n    new Map(\n      (Object.entries(targets) as [IconThemeKey, string][]).map(\n        ([theme, name]) => [theme, { name, collection: INTERNAL }]\n      )\n    ),\n  ])\n);\n"]}

package/components/icon/icon.d.ts

@@ -96,7 +96,7 @@ export default class IgcIconComponent extends LitElement {
     protected update(props: PropertyValues<this>): void;
     protected firstUpdated(): void;
     private _getIcon;
-    protected render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    protected render(): typeof nothing | import("lit-html").TemplateResult<1>;
     protected registerIcon(name: string, url: string, collection?: string, stripMeta?: boolean): Promise<void>;
     protected registerIconFromText(name: string, iconText: string, collection?: string, stripMeta?: boolean): void;
     protected setIconRef(name: string, collection: string, icon: IconMeta): void;

package/components/icon/internal-icons-lib.js

@@ -32,6 +32,9 @@ export const internalIcons = new Map(Object.entries({
     copy: {
         svg: `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px"><path d="M360-240q-33 0-56.5-23.5T280-320v-480q0-33 23.5-56.5T360-880h360q33 0 56.5 23.5T800-800v480q0 33-23.5 56.5T720-240H360Zm0-80h360v-480H360v480ZM200-80q-33 0-56.5-23.5T120-160v-560h80v560h440v80H200Zm160-240v-480 480Z"/></svg>`,
     },
+    colorize: {
+        svg: `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M120-120v-190l358-358-58-56 58-56 76 76 124-124q5-5 12.5-8t15.5-3q8 0 15 3t13 8l94 94q5 6 8 13t3 15q0 8-3 15.5t-8 12.5L705-555l76 78-57 57-56-58-358 358H120Zm80-80h78l332-334-76-76-334 332v78Zm447-410 96-96-37-37-96 96 37 37Zm0 0-37-37 37 37Z"/></svg>`,
+    },
     chip_cancel: {
         svg: `<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"/></svg>`,
     },