igniteui-webcomponents 6.4.0-alpha.0 → 6.4.0-alpha.2

package/components/chat/chat-message.js.map

@@ -1 +1 @@
-{"version":3,"file":"chat-message.js","sourceRoot":"","sources":["../../../src/components/chat/chat-message.ts"],"names":[],"mappings":"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","sourcesContent":["import { consume } from '@lit/context';\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { until } from 'lit/directives/until.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport { chatContext } from '../common/context.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { partMap } from '../common/part-map.js';\nimport { isEmpty, trimmedHtml } from '../common/util.js';\nimport type { ChatState } from './chat-state.js';\nimport IgcMessageAttachmentsComponent from './message-attachments.js';\nimport { styles } from './themes/message.base.css.js';\nimport { all } from './themes/message.js';\nimport { styles as shared } from './themes/shared/chat-message/chat-message.common.css.js';\nimport type {\n  ChatMessageRenderContext,\n  ChatTemplateRenderer,\n  IgcChatMessage,\n} from './types.js';\nimport { chatMessageAdoptPageStyles } from './utils.js';\n\nconst LIKE_INACTIVE = 'thumb_up_inactive';\nconst LIKE_ACTIVE = 'thumb_up_active';\nconst DISLIKE_INACTIVE = 'thumb_down_inactive';\nconst DISLIKE_ACTIVE = 'thumb_down_active';\nconst COPY_CONTENT = 'copy_content';\nconst REGENERATE = 'regenerate';\n\ntype DefaultMessageRenderers = {\n  messageHeader: ChatTemplateRenderer<ChatMessageRenderContext>;\n  messageContent: ChatTemplateRenderer<ChatMessageRenderContext>;\n  messageAttachments: ChatTemplateRenderer<ChatMessageRenderContext>;\n  messageActions: ChatTemplateRenderer<ChatMessageRenderContext>;\n};\n\n/* blazorSuppress */\n/**\n * A chat message component for displaying individual messages in `<igc-chat>`.\n *\n * @element igc-chat-message\n *\n *\n * This component renders a single chat message including:\n * - Message text (sanitized)\n * - Attachments (if any)\n * - Custom templates for message content and actions (if provided via chat options)\n *\n * It distinguishes sent messages from received messages by comparing\n * the message sender with the current user ID from chat state.\n *\n * The message text is sanitized with DOMPurify before rendering,\n * and can be rendered with a markdown renderer if provided.\n */\nexport default class IgcChatMessageComponent extends LitElement {\n  public static readonly tagName = 'igc-chat-message';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcChatMessageComponent,\n      IgcMessageAttachmentsComponent,\n      IgcIconButtonComponent\n    );\n  }\n\n  private readonly _defaults = Object.freeze<DefaultMessageRenderers>({\n    messageHeader: () => this._renderHeader(),\n    messageContent: () => this._renderContent(),\n    messageAttachments: () => this._renderAttachments(),\n    messageActions: () => this._renderActions(),\n  });\n\n  @consume({ context: chatContext, subscribe: true })\n  private readonly _state!: ChatState;\n\n  /**\n   * The chat message to render.\n   */\n  @property({ attribute: false })\n  public message!: IgcChatMessage;\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  protected override firstUpdated(): void {\n    if (this._state.options?.adoptRootStyles) {\n      chatMessageAdoptPageStyles(this);\n    }\n  }\n\n  private _getRenderer(name: keyof DefaultMessageRenderers) {\n    return this._state.options?.renderers\n      ? (this._state.options.renderers[name] ?? this._defaults[name])\n      : this._defaults[name];\n  }\n\n  private async _handleCopy(): Promise<void> {\n    const text = this.message.text;\n    const separator = text ? '\\n\\n' : '';\n    const attachments = this.message.attachments ?? [];\n    const { attachmentLabel, attachmentsListLabel, messageCopied } =\n      this._state.resourceStrings!;\n\n    const attachmentsText = isEmpty(attachments)\n      ? ''\n      : attachments\n          .map(({ name, url }) => `${name ?? attachmentLabel}: ${url ?? ''}`)\n          .join('\\n');\n\n    const payload = attachmentsText\n      ? `${text}${separator}${attachmentsListLabel}:\\n${attachmentsText}`\n      : text;\n\n    try {\n      await navigator.clipboard.writeText(payload);\n      this._state.showActionToast(messageCopied);\n    } catch (err) {\n      throw new Error(`Failed to copy message: ${err}`);\n    }\n  }\n\n  private _handleMessageActionClick(event: PointerEvent): void {\n    const targetButton = event.target as HTMLElement;\n    const button = targetButton.closest(IgcIconButtonComponent.tagName);\n\n    if (!button) {\n      return;\n    }\n\n    let reaction = button.name;\n\n    switch (reaction) {\n      case LIKE_INACTIVE:\n      case LIKE_ACTIVE:\n        reaction = this.message.reactions?.includes(LIKE_ACTIVE)\n          ? LIKE_INACTIVE\n          : LIKE_ACTIVE;\n        break;\n      case DISLIKE_INACTIVE:\n      case DISLIKE_ACTIVE:\n        reaction = this.message.reactions?.includes(DISLIKE_ACTIVE)\n          ? DISLIKE_INACTIVE\n          : DISLIKE_ACTIVE;\n        break;\n      case COPY_CONTENT:\n        reaction = COPY_CONTENT;\n        this._handleCopy();\n        break;\n      case REGENERATE:\n        reaction = REGENERATE;\n        break;\n      default:\n        reaction = '';\n    }\n\n    this.message.reactions = reaction ? [reaction] : [];\n    this._state.emitMessageReaction({ message: this.message, reaction });\n    this.requestUpdate();\n  }\n\n  private _renderHeader() {\n    return nothing;\n  }\n\n  private _renderContent() {\n    return html`${this.message.text}`;\n  }\n\n  private _renderActions() {\n    const isSent = this.message.sender === this._state.currentUserId;\n    const hasText = this.message.text.trim();\n    const hasAttachments = !isEmpty(this.message.attachments ?? []);\n    const isTyping = this._state.options?.isTyping;\n    const isLastMessage = this.message === this._state.messages.at(-1);\n    const resourceStrings = this._state.resourceStrings!;\n\n    if (isSent || !(hasText || hasAttachments) || (isLastMessage && isTyping)) {\n      return nothing;\n    }\n\n    return html`\n      ${this._renderActionButton(COPY_CONTENT, resourceStrings.reactionCopy)}\n      ${this._renderActionButton(\n        this.message.reactions?.includes(LIKE_ACTIVE)\n          ? LIKE_ACTIVE\n          : LIKE_INACTIVE,\n        resourceStrings.reactionLike\n      )}\n      ${this._renderActionButton(\n        this.message.reactions?.includes(DISLIKE_ACTIVE)\n          ? DISLIKE_ACTIVE\n          : DISLIKE_INACTIVE,\n        resourceStrings.reactionDislike\n      )}\n      ${this._renderActionButton(\n        REGENERATE,\n        resourceStrings.reactionRegenerate\n      )}\n    `;\n  }\n\n  private _renderActionButton(name: string, tooltipMessage: string) {\n    return html`\n      <igc-icon-button\n        id=${`${name}-button`}\n        name=${name}\n        variant=\"flat\"\n        @pointerenter=${({ target }: PointerEvent) =>\n          this._state.showActionsTooltip(target as Element, tooltipMessage)}\n        @focus=${({ target }: FocusEvent) =>\n          this._state.showActionsTooltip(target as Element, tooltipMessage)}\n      ></igc-icon-button>\n    `;\n  }\n\n  private _renderAttachments() {\n    return isEmpty(this.message.attachments ?? [])\n      ? nothing\n      : html`\n          <igc-message-attachments\n            .message=${this.message}\n            exportparts=\"\n              attachment,\n              attachment-header,\n              attachment-icon,\n              file-name,\n              attachment-content\"\n          ></igc-message-attachments>\n        `;\n  }\n\n  private _renderMessage() {\n    const ctx: ChatMessageRenderContext = {\n      message: this.message,\n      instance: this._state.host,\n    };\n\n    return trimmedHtml`\n      <div part=\"message-header\">\n        ${until(this._getRenderer('messageHeader')(ctx))}\n      </div>\n      <div part=\"plain-text\">\n        ${until(this._getRenderer('messageContent')(ctx))}\n      </div>\n      <div part=\"message-attachments\">\n        ${until(this._getRenderer('messageAttachments')(ctx))}\n      </div>\n      <div part=\"message-actions\" @click=${this._handleMessageActionClick}>\n        ${until(this._getRenderer('messageActions')(ctx))}\n      </div>\n    `;\n  }\n\n  protected override render() {\n    const messageRenderer = this._state.options?.renderers?.message;\n    const ctx: ChatMessageRenderContext = {\n      message: this.message,\n      instance: this._state.host,\n    };\n\n    const parts = {\n      'message-container': true,\n      sent: this._state.isCurrentUserMessage(this.message),\n    };\n\n    return html`\n      ${cache(\n        this.message\n          ? html`\n              <div part=${partMap(parts)}>\n                ${cache(\n                  messageRenderer\n                    ? until(messageRenderer(ctx))\n                    : this._renderMessage()\n                )}\n              </div>\n            `\n          : nothing\n      )}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-chat-message': IgcChatMessageComponent;\n  }\n}\n"]}
+{"version":3,"file":"chat-message.js","sourceRoot":"","sources":["../../../src/components/chat/chat-message.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextConsumer } from '@lit/context';\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { until } from 'lit/directives/until.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport { chatContext } from '../common/context.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { partMap } from '../common/part-map.js';\nimport { isEmpty, trimmedHtml } from '../common/util.js';\nimport type { ChatState } from './chat-state.js';\nimport IgcMessageAttachmentsComponent from './message-attachments.js';\nimport { styles } from './themes/message.base.css.js';\nimport { all } from './themes/message.js';\nimport { styles as shared } from './themes/shared/chat-message/chat-message.common.css.js';\nimport type {\n  ChatMessageRenderContext,\n  ChatTemplateRenderer,\n  IgcChatMessage,\n} from './types.js';\nimport { addAdoptedStylesController } from './utils.js';\n\nconst LIKE_INACTIVE = 'thumb_up_inactive';\nconst LIKE_ACTIVE = 'thumb_up_active';\nconst DISLIKE_INACTIVE = 'thumb_down_inactive';\nconst DISLIKE_ACTIVE = 'thumb_down_active';\nconst COPY_CONTENT = 'copy_content';\nconst REGENERATE = 'regenerate';\n\ntype DefaultMessageRenderers = {\n  messageHeader: ChatTemplateRenderer<ChatMessageRenderContext>;\n  messageContent: ChatTemplateRenderer<ChatMessageRenderContext>;\n  messageAttachments: ChatTemplateRenderer<ChatMessageRenderContext>;\n  messageActions: ChatTemplateRenderer<ChatMessageRenderContext>;\n};\n\n/* blazorSuppress */\n/**\n * A chat message component for displaying individual messages in `<igc-chat>`.\n *\n * @element igc-chat-message\n *\n *\n * This component renders a single chat message including:\n * - Message text (sanitized)\n * - Attachments (if any)\n * - Custom templates for message content and actions (if provided via chat options)\n *\n * It distinguishes sent messages from received messages by comparing\n * the message sender with the current user ID from chat state.\n *\n * The message text is sanitized with DOMPurify before rendering,\n * and can be rendered with a markdown renderer if provided.\n */\nexport default class IgcChatMessageComponent extends LitElement {\n  public static readonly tagName = 'igc-chat-message';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcChatMessageComponent,\n      IgcMessageAttachmentsComponent,\n      IgcIconButtonComponent\n    );\n  }\n\n  private readonly _adoptedStyles = addAdoptedStylesController(this);\n\n  private readonly _defaults = Object.freeze<DefaultMessageRenderers>({\n    messageHeader: () => this._renderHeader(),\n    messageContent: () => this._renderContent(),\n    messageAttachments: () => this._renderAttachments(),\n    messageActions: () => this._renderActions(),\n  });\n\n  private readonly _stateChanged = () => {\n    this._adoptedStyles.shouldAdoptStyles(\n      !!this._state.options?.adoptRootStyles &&\n        !this._adoptedStyles.hasAdoptedStyles\n    );\n  };\n\n  private readonly _stateConsumer = new ContextConsumer(this, {\n    context: chatContext,\n    callback: this._stateChanged,\n    subscribe: true,\n  });\n\n  private get _state(): ChatState {\n    return this._stateConsumer.value!;\n  }\n\n  /**\n   * The chat message to render.\n   */\n  @property({ attribute: false })\n  public message!: IgcChatMessage;\n\n  constructor() {\n    super();\n    addThemingController(this, all, { themeChange: this._adoptPageStyles });\n  }\n\n  private _adoptPageStyles(): void {\n    this._adoptedStyles.shouldAdoptStyles(this._adoptedStyles.hasAdoptedStyles);\n  }\n\n  private _getRenderer(name: keyof DefaultMessageRenderers) {\n    return this._state.options?.renderers\n      ? (this._state.options.renderers[name] ?? this._defaults[name])\n      : this._defaults[name];\n  }\n\n  private async _handleCopy(): Promise<void> {\n    const text = this.message.text;\n    const separator = text ? '\\n\\n' : '';\n    const attachments = this.message.attachments ?? [];\n    const { attachmentLabel, attachmentsListLabel, messageCopied } =\n      this._state.resourceStrings!;\n\n    const attachmentsText = isEmpty(attachments)\n      ? ''\n      : attachments\n          .map(({ name, url }) => `${name ?? attachmentLabel}: ${url ?? ''}`)\n          .join('\\n');\n\n    const payload = attachmentsText\n      ? `${text}${separator}${attachmentsListLabel}:\\n${attachmentsText}`\n      : text;\n\n    try {\n      await navigator.clipboard.writeText(payload);\n      this._state.showActionToast(messageCopied);\n    } catch (err) {\n      throw new Error(`Failed to copy message: ${err}`);\n    }\n  }\n\n  private _handleMessageActionClick(event: PointerEvent): void {\n    const targetButton = event.target as HTMLElement;\n    const button = targetButton.closest(IgcIconButtonComponent.tagName);\n\n    if (!button) {\n      return;\n    }\n\n    let reaction = button.name;\n\n    switch (reaction) {\n      case LIKE_INACTIVE:\n      case LIKE_ACTIVE:\n        reaction = this.message.reactions?.includes(LIKE_ACTIVE)\n          ? LIKE_INACTIVE\n          : LIKE_ACTIVE;\n        break;\n      case DISLIKE_INACTIVE:\n      case DISLIKE_ACTIVE:\n        reaction = this.message.reactions?.includes(DISLIKE_ACTIVE)\n          ? DISLIKE_INACTIVE\n          : DISLIKE_ACTIVE;\n        break;\n      case COPY_CONTENT:\n        reaction = COPY_CONTENT;\n        this._handleCopy();\n        break;\n      case REGENERATE:\n        reaction = REGENERATE;\n        break;\n      default:\n        reaction = '';\n    }\n\n    this.message.reactions = reaction ? [reaction] : [];\n    this._state.emitMessageReaction({ message: this.message, reaction });\n    this.requestUpdate();\n  }\n\n  private _renderHeader() {\n    return nothing;\n  }\n\n  private _renderContent() {\n    return html`${this.message.text}`;\n  }\n\n  private _renderActions() {\n    const isSent = this.message.sender === this._state.currentUserId;\n    const hasText = this.message.text.trim();\n    const hasAttachments = !isEmpty(this.message.attachments ?? []);\n    const isTyping = this._state.options?.isTyping;\n    const isLastMessage = this.message === this._state.messages.at(-1);\n    const resourceStrings = this._state.resourceStrings!;\n\n    if (isSent || !(hasText || hasAttachments) || (isLastMessage && isTyping)) {\n      return nothing;\n    }\n\n    return html`\n      ${this._renderActionButton(COPY_CONTENT, resourceStrings.reactionCopy)}\n      ${this._renderActionButton(\n        this.message.reactions?.includes(LIKE_ACTIVE)\n          ? LIKE_ACTIVE\n          : LIKE_INACTIVE,\n        resourceStrings.reactionLike\n      )}\n      ${this._renderActionButton(\n        this.message.reactions?.includes(DISLIKE_ACTIVE)\n          ? DISLIKE_ACTIVE\n          : DISLIKE_INACTIVE,\n        resourceStrings.reactionDislike\n      )}\n      ${this._renderActionButton(\n        REGENERATE,\n        resourceStrings.reactionRegenerate\n      )}\n    `;\n  }\n\n  private _renderActionButton(name: string, tooltipMessage: string) {\n    return html`\n      <igc-icon-button\n        id=${`${name}-button`}\n        name=${name}\n        variant=\"flat\"\n        @pointerenter=${({ target }: PointerEvent) =>\n          this._state.showActionsTooltip(target as Element, tooltipMessage)}\n        @focus=${({ target }: FocusEvent) =>\n          this._state.showActionsTooltip(target as Element, tooltipMessage)}\n      ></igc-icon-button>\n    `;\n  }\n\n  private _renderAttachments() {\n    return isEmpty(this.message.attachments ?? [])\n      ? nothing\n      : html`\n          <igc-message-attachments\n            .message=${this.message}\n            exportparts=\"\n              attachment,\n              attachment-header,\n              attachment-icon,\n              file-name,\n              attachment-content\"\n          ></igc-message-attachments>\n        `;\n  }\n\n  private _renderMessage() {\n    const ctx: ChatMessageRenderContext = {\n      message: this.message,\n      instance: this._state.host,\n    };\n\n    return trimmedHtml`\n      <div part=\"message-header\">\n        ${until(this._getRenderer('messageHeader')(ctx))}\n      </div>\n      <div part=\"plain-text\">\n        ${until(this._getRenderer('messageContent')(ctx))}\n      </div>\n      <div part=\"message-attachments\">\n        ${until(this._getRenderer('messageAttachments')(ctx))}\n      </div>\n      <div part=\"message-actions\" @click=${this._handleMessageActionClick}>\n        ${until(this._getRenderer('messageActions')(ctx))}\n      </div>\n    `;\n  }\n\n  protected override render() {\n    const messageRenderer = this._state.options?.renderers?.message;\n    const ctx: ChatMessageRenderContext = {\n      message: this.message,\n      instance: this._state.host,\n    };\n\n    const parts = {\n      'message-container': true,\n      sent: this._state.isCurrentUserMessage(this.message),\n    };\n\n    return html`\n      ${cache(\n        this.message\n          ? html`\n              <div part=${partMap(parts)}>\n                ${cache(\n                  messageRenderer\n                    ? until(messageRenderer(ctx))\n                    : this._renderMessage()\n                )}\n              </div>\n            `\n          : nothing\n      )}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-chat-message': IgcChatMessageComponent;\n  }\n}\n"]}

package/components/chat/chat.d.ts

@@ -77,6 +77,7 @@ declare const IgcChatComponent_base: Constructor<import("../common/mixins/event-
  * @slot suggestions-actions - Slot for rendering additional actions.
  * @slot suggestion - Slot for rendering a single suggestion item.
  * @slot empty-state - Slot shown when there are no messages.
+ * @slot typing-indicator - Slot for the "is typing" indicator.
  *
  * @csspart chat-container - Styles the main chat container.
  * @csspart header - Styles the chat header container.

package/components/chat/chat.js

@@ -27,7 +27,7 @@ import { ChatState } from './chat-state.js';
 import { styles } from './themes/chat.base.css.js';
 import { styles as shared } from './themes/shared/chat.common.css.js';
 import { all } from './themes/themes.js';
-const Slots = setSlots('prefix', 'title', 'actions', 'suggestions-header', 'suggestions', 'suggestions-actions', 'suggestion', 'empty-state');
+const Slots = setSlots('prefix', 'title', 'actions', 'suggestions-header', 'suggestions', 'suggestions-actions', 'suggestion', 'empty-state', 'typing-indicator');
 export default class IgcChatComponent extends EventEmitterMixin(LitElement) {
     static { this.tagName = 'igc-chat'; }
     static { this.styles = [styles, shared]; }
@@ -167,7 +167,9 @@ export default class IgcChatComponent extends EventEmitterMixin(LitElement) {
         ${this._state.options?.isTyping
             ? html `
               <div part="typing-indicator">
-                ${this._getRenderer('typingIndicator')(ctx)}
+                <slot name="typing-indicator"
+                  >${this._getRenderer('typingIndicator')(ctx)}</slot
+                >
               </div>
             `
             : nothing}

package/components/chat/chat.js.map

@@ -1 +1 @@
-{"version":3,"file":"chat.js","sourceRoot":"","sources":["../../../src/components/chat/chat.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement, nothing, type PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { chatContext, chatUserInputContext } from '../common/context.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { IgcChatResourceStringEN } from '../common/i18n/EN/chat.resources.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { isEmpty } from '../common/util.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcListComponent from '../list/list.js';\nimport IgcToastComponent from '../toast/toast.js';\nimport IgcTooltipComponent from '../tooltip/tooltip.js';\nimport IgcChatInputComponent from './chat-input.js';\nimport IgcChatMessageComponent from './chat-message.js';\nimport { ChatState } from './chat-state.js';\nimport { styles } from './themes/chat.base.css.js';\nimport { styles as shared } from './themes/shared/chat.common.css.js';\nimport { all } from './themes/themes.js';\nimport type {\n  ChatRenderContext,\n  ChatTemplateRenderer,\n  IgcChatMessage,\n  IgcChatMessageAttachment,\n  IgcChatMessageReaction,\n  IgcChatOptions,\n} from './types.js';\n\ntype DefaultChatRenderers = {\n  typingIndicator: ChatTemplateRenderer<ChatRenderContext>;\n  suggestionPrefix: ChatTemplateRenderer<ChatRenderContext>;\n};\n\n/**\n * Defines the custom events dispatched by the `<igc-chat>` component.\n */\nexport interface IgcChatComponentEventMap {\n  /**\n   * Dispatched when a new chat message is created (sent).\n   */\n  igcMessageCreated: CustomEvent<IgcChatMessage>;\n\n  /**\n   * Dispatched when a message is reacted to.\n   */\n  igcMessageReact: CustomEvent<IgcChatMessageReaction>;\n\n  /**\n   * Dispatched when a chat message attachment is clicked.\n   */\n  igcAttachmentClick: CustomEvent<IgcChatMessageAttachment>;\n\n  /**\n   * Dispatched when attachment(s) are added either through drag & drop or through\n   * the default file input.\n   */\n  igcAttachmentAdded: CustomEvent<IgcChatMessageAttachment[]>;\n\n  /**\n   * Dispatched when an attachment is removed by the user.\n   */\n  igcAttachmentRemoved: CustomEvent<IgcChatMessageAttachment>;\n\n  /**\n   * Dispatched during an attachment drag operation.\n   */\n  igcAttachmentDrag: CustomEvent<void>;\n\n  /**\n   * Dispatched when an attachment is dropped (e.g., in a drag-and-drop operation).\n   */\n  igcAttachmentDrop: CustomEvent<void>;\n\n  /**\n   * Dispatched when the typing status changes (e.g., user starts or stops typing).\n   */\n  igcTypingChange: CustomEvent<boolean>;\n\n  /**\n   * Dispatched when the chat input field gains focus.\n   */\n  igcInputFocus: CustomEvent<void>;\n\n  /**\n   * Dispatched when the chat input field loses focus.\n   */\n  igcInputBlur: CustomEvent<void>;\n\n  /**\n   * Dispatched when the content of the chat input changes.\n   */\n  igcInputChange: CustomEvent<string>;\n}\n\nconst Slots = setSlots(\n  'prefix',\n  'title',\n  'actions',\n  'suggestions-header',\n  'suggestions',\n  'suggestions-actions',\n  'suggestion',\n  'empty-state'\n);\n\n/**\n * A chat UI component for displaying messages, attachments, and input interaction.\n *\n * @element igc-chat\n *\n * @fires igcMessageCreated - Dispatched when a new chat message is created (sent).\n * @fires igcMessageReact - Dispatched when a message is reacted to.\n * @fires igcAttachmentClick - Dispatched when a chat message attachment is clicked.\n * @fires igcAttachmentAdded - Dispatched when attachment(s) are added either through drag & drop or through the default file input.\n * @fires igcAttachmentRemoved - Dispatched when an attachment is removed by the user.\n * @fires igcAttachmentDrag - Dispatched during an attachment drag operation.\n * @fires igcAttachmentDrop - Dispatched when an attachment is dropped (e.g., in a drag-and-drop operation).\n * @fires igcTypingChange - Dispatched when the typing status changes (e.g., user starts or stops typing).\n * @fires igcInputFocus - Dispatched when the chat input field gains focus.\n * @fires igcInputBlur - Dispatched when the chat input field loses focus.\n * @fires igcInputChange - Dispatched when the content of the chat input changes.\n *\n * @slot prefix - Slot for injecting content (e.g., avatar or icon) before the chat title.\n * @slot title - Slot for overriding the chat title content.\n * @slot actions - Slot for injecting header actions (e.g., buttons, menus).\n * @slot suggestions-header - Slot for rendering a custom header for the suggestions list.\n * @slot suggestions - Slot for rendering a custom list of quick reply suggestions.\n * @slot suggestions-actions - Slot for rendering additional actions.\n * @slot suggestion - Slot for rendering a single suggestion item.\n * @slot empty-state - Slot shown when there are no messages.\n *\n * @csspart chat-container - Styles the main chat container.\n * @csspart header - Styles the chat header container.\n * @csspart prefix - Styles the element before the chat title (e.g., avatar).\n * @csspart title - Styles the chat header title.\n *\n * @csspart message-area-container - Styles the container holding the messages and (optional) suggestions.\n * @csspart message-list - Styles the message list container.\n * @csspart message-item - Styles each message wrapper.\n * @csspart typing-indicator - Styles the typing indicator container.\n * @csspart typing-dot - Styles individual typing indicator dots.\n *\n * @csspart suggestions-container - Styles the container holding all suggestions.\n * @csspart suggestions-header - Styles the suggestions header.\n * @csspart suggestion - Styles each suggestion item.\n * @csspart suggestion-prefix - Styles the icon or prefix in a suggestion.\n * @csspart suggestion-title - Styles the text/title of a suggestion.\n *\n * @csspart empty-state - Styles the empty state container when there are no messages.\n *\n * @csspart input-area-container - Styles the wrapper around the chat input area.\n * @csspart input-container - Styles the main input container.\n * @csspart input-attachments-container - Styles the container for attachments in the input.\n * @csspart input-attachment-container - Styles a single attachment in the input area.\n * @csspart input-attachment-name - Styles the file name of an attachment.\n * @csspart input-attachment-icon - Styles the icon of an attachment.\n * @csspart text-input - Styles the text input field for typing messages.\n * @csspart input-actions-container - Styles the container for input actions.\n * @csspart input-actions-start - Styles the group of actions at the start of the input after the default file upload.\n * @csspart input-actions-end - Styles the group of actions at the end of the input.\n * @csspart file-upload-container - Styles the container for the file upload input.\n * @csspart file-upload - Styles the file upload input itself.\n * @csspart send-button-container - Styles the container around the send button.\n * @csspart send-button - Styles the send button.\n *\n * @csspart message-container - Styles the container of a single message.\n * @csspart message-list (forwarded) - Styles the internal list of messages.\n * @csspart message-header - Styles the header of a message (e.g., sender, timestamp).\n * @csspart message-content - Styles the text content of a message.\n * @csspart message-attachments-container - Styles the container for message attachments.\n * @csspart message-attachment - Styles a single message attachment.\n * @csspart message-actions-container - Styles the container holding message actions.\n * @csspart message-sent - Styles messages marked as sent by the current user.\n * @csspart attachment-header - Styles the header of an attachment block.\n * @csspart attachment-content - Styles the content of an attachment block.\n * @csspart attachment-icon - Styles the icon of an attachment.\n * @csspart file-name - Styles the file name shown in an attachment.\n */\nexport default class IgcChatComponent extends EventEmitterMixin<\n  IgcChatComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-chat';\n\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcChatComponent,\n      IgcChatInputComponent,\n      IgcChatMessageComponent,\n      IgcButtonComponent,\n      IgcIconComponent,\n      IgcListComponent,\n      IgcTooltipComponent,\n      IgcToastComponent\n    );\n  }\n\n  private readonly _state = new ChatState(\n    this,\n    this._updateContext,\n    this._updateUserInputContext\n  );\n\n  private readonly _defaults = Object.freeze<DefaultChatRenderers>({\n    typingIndicator: () => this._renderLoadingTemplate(),\n    suggestionPrefix: () => this._renderSuggestionPrefix(),\n  });\n\n  private readonly _slots = addSlotController(this, {\n    slots: Slots,\n  });\n\n  private readonly _context = new ContextProvider(this, {\n    context: chatContext,\n    initialValue: this._state,\n  });\n\n  private readonly _userInputContext = new ContextProvider(this, {\n    context: chatUserInputContext,\n    initialValue: this._state,\n  });\n\n  @query(IgcChatInputComponent.tagName)\n  private readonly _input?: IgcChatInputComponent;\n\n  @query('[part=\"typing-indicator\"]')\n  private readonly _typingIndicator?: HTMLElement;\n\n  @query('[part=\"suggestions-container\"]')\n  private readonly _suggestionsContainer?: HTMLElement;\n\n  @query('[part=\"message-area-container\"]', true)\n  private readonly _scrollContainer!: HTMLElement;\n\n  private _updateContext(): void {\n    this._context.setValue(this._state, true);\n  }\n\n  private _updateUserInputContext(): void {\n    this._userInputContext.setValue(this._state, true);\n  }\n\n  /**\n   * The list of chat messages currently displayed.\n   * Use this property to set or update the message history.\n   */\n  @property({ attribute: false })\n  public set messages(value: IgcChatMessage[]) {\n    this._state.messages = value;\n  }\n\n  public get messages(): IgcChatMessage[] {\n    return this._state.messages;\n  }\n\n  /**\n   * The chat message currently being composed but not yet sent.\n   * Includes the draft text and any attachments.\n   */\n  @property({ attribute: false })\n  public set draftMessage(value: {\n    text: string;\n    attachments?: IgcChatMessageAttachment[];\n  }) {\n    if (this._state && value) {\n      this._state.inputValue = value.text;\n      this._state.inputAttachments = value.attachments || [];\n      this.requestUpdate();\n    }\n  }\n\n  public get draftMessage(): {\n    text: string;\n    attachments?: IgcChatMessageAttachment[];\n  } {\n    return {\n      text: this._state.inputValue,\n      attachments: this._state.inputAttachments,\n    };\n  }\n\n  /**\n   * Controls the chat behavior and appearance through a configuration object.\n   * Use this to toggle UI options, provide suggestions, templates, etc.\n   */\n  @property({ attribute: false })\n  public set options(value: IgcChatOptions) {\n    this._state.options = value;\n  }\n\n  public get options(): IgcChatOptions | undefined {\n    return this._state.options;\n  }\n\n  /**\n   * The resource strings of the chat.\n   */\n  @property({ attribute: false })\n  public resourceStrings = IgcChatResourceStringEN;\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  private _getRenderer<U extends keyof DefaultChatRenderers>(\n    name: U\n  ): DefaultChatRenderers[U] {\n    return this._state.options?.renderers\n      ? (this._state.options.renderers[name] ?? this._defaults[name])\n      : this._defaults[name];\n  }\n\n  private _handleSuggestionClick(text: string): void {\n    this._state.addMessageWithEvent({ text });\n    this._input?.focusInput();\n  }\n\n  /**\n   * Scrolls the view to a specific message by id.\n   */\n  public scrollToMessage(messageId: string): void {\n    if (!isEmpty(this.messages)) {\n      const message = this.renderRoot.querySelector(`#message-${messageId}`);\n      message?.scrollIntoView({ block: 'end', inline: 'end' });\n    }\n  }\n\n  protected override updated(properties: PropertyValues<this>): void {\n    if (\n      (properties.has('messages') ||\n        this._typingIndicator ||\n        this._suggestionsContainer) &&\n      !this._state.disableAutoScroll\n    ) {\n      this._scrollToBottom();\n    }\n  }\n\n  private _scrollToBottom(): void {\n    const current = this._scrollContainer.scrollTop;\n\n    requestAnimationFrame(() => {\n      const scrollHeight = this._scrollContainer.scrollHeight;\n      if (current < scrollHeight) {\n        this._scrollContainer.scrollBy({\n          top: Math.abs(scrollHeight - current),\n        });\n      }\n    });\n  }\n\n  private _renderHeader() {\n    const hasContent =\n      this._slots.hasAssignedElements('prefix') ||\n      this._slots.hasAssignedElements('title') ||\n      this._slots.hasAssignedElements('actions') ||\n      this._state.options?.headerText;\n\n    return html`\n      <div part=\"header\" ?hidden=${!hasContent}>\n        <slot\n          name=\"prefix\"\n          ?hidden=${!this._slots.hasAssignedElements('prefix')}\n        ></slot>\n        <slot name=\"title\">${this._state.options?.headerText}</slot>\n        <slot name=\"actions\"></slot>\n      </div>\n    `;\n  }\n\n  private _renderMessages() {\n    const ctx = { instance: this };\n\n    return html`\n      <div part=\"message-list\" tabindex=\"0\">\n        ${repeat(\n          this._state.messages,\n          (message) => message.id,\n          (message) => {\n            return html`\n              <igc-chat-message\n                id=${`message-${message.id}`}\n                part=\"message-item\"\n                .message=${message}\n                exportparts=\"\n                  message-container,\n                  message-list,\n                  message-header,\n                  plain-text: message-content,\n                  message-attachments: message-attachments-container,\n                  attachment: message-attachment,\n                  message-actions: message-actions-container,\n                  sent: message-sent,\n                  attachment-header,\n                  attachment-content,\n                  attachment-icon,\n                  file-name,\n                \"\n              >\n              </igc-chat-message>\n            `;\n          }\n        )}\n        ${this._state.options?.isTyping\n          ? html`\n              <div part=\"typing-indicator\">\n                ${this._getRenderer('typingIndicator')(ctx)}\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n\n  private _renderLoadingTemplate() {\n    return html`\n      <div part=\"typing-dot\"></div>\n      <div part=\"typing-dot\"></div>\n      <div part=\"typing-dot\"></div>\n      <div part=\"typing-dot\"></div>\n    `;\n  }\n\n  private _renderSuggestionPrefix() {\n    return html`<igc-icon name=\"auto_suggest\"></igc-icon>`;\n  }\n\n  private _renderSuggestions() {\n    const hasContent = this._slots.hasAssignedElements('suggestions-header');\n    const suggestions = this._state.options?.suggestions ?? [];\n    const ctx = { instance: this };\n\n    return html`\n      <div part=\"suggestions-container\">\n        <igc-list>\n          <igc-list-header part=\"suggestions-header\">\n            <span ?hidden=${hasContent}>\n              ${this.resourceStrings.suggestionsHeader}\n            </span>\n            <slot name=\"suggestions-header\"></slot>\n          </igc-list-header>\n          <slot name=\"suggestions\">\n            ${suggestions.map(\n              (suggestion) => html`\n                <slot name=\"suggestion\">\n                  <igc-list-item\n                    part=\"suggestion\"\n                    @click=${() => this._handleSuggestionClick(suggestion)}\n                  >\n                    <span slot=\"start\" part=\"suggestion-prefix\">\n                      ${this._getRenderer('suggestionPrefix')(ctx)}\n                    </span>\n                    <span slot=\"title\" part=\"suggestion-title\"\n                      >${suggestion}</span\n                    >\n                  </igc-list-item>\n                </slot>\n              `\n            )}\n          </slot>\n          <slot name=\"suggestions-actions\"></slot>\n        </igc-list>\n      </div>\n    `;\n  }\n\n  private _renderEmptyState() {\n    return html`\n      <div part=\"empty-state\">\n        <slot name=\"empty-state\"></slot>\n      </div>\n    `;\n  }\n\n  protected override render() {\n    const hasMessages = !isEmpty(this.messages);\n    const suggestions = isEmpty(this._state.options?.suggestions ?? [])\n      ? nothing\n      : this._renderSuggestions();\n\n    return html`\n      <div part=\"chat-container\">\n        ${this._renderHeader()}\n\n        <div part=\"message-area-container\">\n          ${cache(\n            hasMessages || this._state.options?.isTyping\n              ? this._renderMessages()\n              : this._renderEmptyState()\n          )}\n          ${this._state.suggestionsPosition === 'below-messages'\n            ? suggestions\n            : nothing}\n        </div>\n\n        <div part=\"input-area-container\">\n          <igc-chat-input\n            exportparts=\"\n                input-container: input-area-container,\n                input-wrapper: input-container,\n                attachments: input-attachments-container,\n                attachment-wrapper: input-attachment-container,\n                attachment-name: input-attachment-name,\n                attachment-icon: input-attachment-icon,\n                text-input,\n                actions-container: input-actions-container,\n                input-actions-start,\n                input-actions-end,\n                file-upload-container,\n                file-upload,\n                send-button-container,\n                send-button\"\n          >\n          </igc-chat-input>\n          ${this._state.suggestionsPosition === 'below-input'\n            ? suggestions\n            : nothing}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-chat': IgcChatComponent;\n  }\n}\n"]}
+{"version":3,"file":"chat.js","sourceRoot":"","sources":["../../../src/components/chat/chat.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement, nothing, type PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { chatContext, chatUserInputContext } from '../common/context.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { IgcChatResourceStringEN } from '../common/i18n/EN/chat.resources.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { isEmpty } from '../common/util.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcListComponent from '../list/list.js';\nimport IgcToastComponent from '../toast/toast.js';\nimport IgcTooltipComponent from '../tooltip/tooltip.js';\nimport IgcChatInputComponent from './chat-input.js';\nimport IgcChatMessageComponent from './chat-message.js';\nimport { ChatState } from './chat-state.js';\nimport { styles } from './themes/chat.base.css.js';\nimport { styles as shared } from './themes/shared/chat.common.css.js';\nimport { all } from './themes/themes.js';\nimport type {\n  ChatRenderContext,\n  ChatTemplateRenderer,\n  IgcChatMessage,\n  IgcChatMessageAttachment,\n  IgcChatMessageReaction,\n  IgcChatOptions,\n} from './types.js';\n\ntype DefaultChatRenderers = {\n  typingIndicator: ChatTemplateRenderer<ChatRenderContext>;\n  suggestionPrefix: ChatTemplateRenderer<ChatRenderContext>;\n};\n\n/**\n * Defines the custom events dispatched by the `<igc-chat>` component.\n */\nexport interface IgcChatComponentEventMap {\n  /**\n   * Dispatched when a new chat message is created (sent).\n   */\n  igcMessageCreated: CustomEvent<IgcChatMessage>;\n\n  /**\n   * Dispatched when a message is reacted to.\n   */\n  igcMessageReact: CustomEvent<IgcChatMessageReaction>;\n\n  /**\n   * Dispatched when a chat message attachment is clicked.\n   */\n  igcAttachmentClick: CustomEvent<IgcChatMessageAttachment>;\n\n  /**\n   * Dispatched when attachment(s) are added either through drag & drop or through\n   * the default file input.\n   */\n  igcAttachmentAdded: CustomEvent<IgcChatMessageAttachment[]>;\n\n  /**\n   * Dispatched when an attachment is removed by the user.\n   */\n  igcAttachmentRemoved: CustomEvent<IgcChatMessageAttachment>;\n\n  /**\n   * Dispatched during an attachment drag operation.\n   */\n  igcAttachmentDrag: CustomEvent<void>;\n\n  /**\n   * Dispatched when an attachment is dropped (e.g., in a drag-and-drop operation).\n   */\n  igcAttachmentDrop: CustomEvent<void>;\n\n  /**\n   * Dispatched when the typing status changes (e.g., user starts or stops typing).\n   */\n  igcTypingChange: CustomEvent<boolean>;\n\n  /**\n   * Dispatched when the chat input field gains focus.\n   */\n  igcInputFocus: CustomEvent<void>;\n\n  /**\n   * Dispatched when the chat input field loses focus.\n   */\n  igcInputBlur: CustomEvent<void>;\n\n  /**\n   * Dispatched when the content of the chat input changes.\n   */\n  igcInputChange: CustomEvent<string>;\n}\n\nconst Slots = setSlots(\n  'prefix',\n  'title',\n  'actions',\n  'suggestions-header',\n  'suggestions',\n  'suggestions-actions',\n  'suggestion',\n  'empty-state',\n  'typing-indicator'\n);\n\n/**\n * A chat UI component for displaying messages, attachments, and input interaction.\n *\n * @element igc-chat\n *\n * @fires igcMessageCreated - Dispatched when a new chat message is created (sent).\n * @fires igcMessageReact - Dispatched when a message is reacted to.\n * @fires igcAttachmentClick - Dispatched when a chat message attachment is clicked.\n * @fires igcAttachmentAdded - Dispatched when attachment(s) are added either through drag & drop or through the default file input.\n * @fires igcAttachmentRemoved - Dispatched when an attachment is removed by the user.\n * @fires igcAttachmentDrag - Dispatched during an attachment drag operation.\n * @fires igcAttachmentDrop - Dispatched when an attachment is dropped (e.g., in a drag-and-drop operation).\n * @fires igcTypingChange - Dispatched when the typing status changes (e.g., user starts or stops typing).\n * @fires igcInputFocus - Dispatched when the chat input field gains focus.\n * @fires igcInputBlur - Dispatched when the chat input field loses focus.\n * @fires igcInputChange - Dispatched when the content of the chat input changes.\n *\n * @slot prefix - Slot for injecting content (e.g., avatar or icon) before the chat title.\n * @slot title - Slot for overriding the chat title content.\n * @slot actions - Slot for injecting header actions (e.g., buttons, menus).\n * @slot suggestions-header - Slot for rendering a custom header for the suggestions list.\n * @slot suggestions - Slot for rendering a custom list of quick reply suggestions.\n * @slot suggestions-actions - Slot for rendering additional actions.\n * @slot suggestion - Slot for rendering a single suggestion item.\n * @slot empty-state - Slot shown when there are no messages.\n * @slot typing-indicator - Slot for the \"is typing\" indicator.\n *\n * @csspart chat-container - Styles the main chat container.\n * @csspart header - Styles the chat header container.\n * @csspart prefix - Styles the element before the chat title (e.g., avatar).\n * @csspart title - Styles the chat header title.\n *\n * @csspart message-area-container - Styles the container holding the messages and (optional) suggestions.\n * @csspart message-list - Styles the message list container.\n * @csspart message-item - Styles each message wrapper.\n * @csspart typing-indicator - Styles the typing indicator container.\n * @csspart typing-dot - Styles individual typing indicator dots.\n *\n * @csspart suggestions-container - Styles the container holding all suggestions.\n * @csspart suggestions-header - Styles the suggestions header.\n * @csspart suggestion - Styles each suggestion item.\n * @csspart suggestion-prefix - Styles the icon or prefix in a suggestion.\n * @csspart suggestion-title - Styles the text/title of a suggestion.\n *\n * @csspart empty-state - Styles the empty state container when there are no messages.\n *\n * @csspart input-area-container - Styles the wrapper around the chat input area.\n * @csspart input-container - Styles the main input container.\n * @csspart input-attachments-container - Styles the container for attachments in the input.\n * @csspart input-attachment-container - Styles a single attachment in the input area.\n * @csspart input-attachment-name - Styles the file name of an attachment.\n * @csspart input-attachment-icon - Styles the icon of an attachment.\n * @csspart text-input - Styles the text input field for typing messages.\n * @csspart input-actions-container - Styles the container for input actions.\n * @csspart input-actions-start - Styles the group of actions at the start of the input after the default file upload.\n * @csspart input-actions-end - Styles the group of actions at the end of the input.\n * @csspart file-upload-container - Styles the container for the file upload input.\n * @csspart file-upload - Styles the file upload input itself.\n * @csspart send-button-container - Styles the container around the send button.\n * @csspart send-button - Styles the send button.\n *\n * @csspart message-container - Styles the container of a single message.\n * @csspart message-list (forwarded) - Styles the internal list of messages.\n * @csspart message-header - Styles the header of a message (e.g., sender, timestamp).\n * @csspart message-content - Styles the text content of a message.\n * @csspart message-attachments-container - Styles the container for message attachments.\n * @csspart message-attachment - Styles a single message attachment.\n * @csspart message-actions-container - Styles the container holding message actions.\n * @csspart message-sent - Styles messages marked as sent by the current user.\n * @csspart attachment-header - Styles the header of an attachment block.\n * @csspart attachment-content - Styles the content of an attachment block.\n * @csspart attachment-icon - Styles the icon of an attachment.\n * @csspart file-name - Styles the file name shown in an attachment.\n */\nexport default class IgcChatComponent extends EventEmitterMixin<\n  IgcChatComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-chat';\n\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcChatComponent,\n      IgcChatInputComponent,\n      IgcChatMessageComponent,\n      IgcButtonComponent,\n      IgcIconComponent,\n      IgcListComponent,\n      IgcTooltipComponent,\n      IgcToastComponent\n    );\n  }\n\n  private readonly _state = new ChatState(\n    this,\n    this._updateContext,\n    this._updateUserInputContext\n  );\n\n  private readonly _defaults = Object.freeze<DefaultChatRenderers>({\n    typingIndicator: () => this._renderLoadingTemplate(),\n    suggestionPrefix: () => this._renderSuggestionPrefix(),\n  });\n\n  private readonly _slots = addSlotController(this, {\n    slots: Slots,\n  });\n\n  private readonly _context = new ContextProvider(this, {\n    context: chatContext,\n    initialValue: this._state,\n  });\n\n  private readonly _userInputContext = new ContextProvider(this, {\n    context: chatUserInputContext,\n    initialValue: this._state,\n  });\n\n  @query(IgcChatInputComponent.tagName)\n  private readonly _input?: IgcChatInputComponent;\n\n  @query('[part=\"typing-indicator\"]')\n  private readonly _typingIndicator?: HTMLElement;\n\n  @query('[part=\"suggestions-container\"]')\n  private readonly _suggestionsContainer?: HTMLElement;\n\n  @query('[part=\"message-area-container\"]', true)\n  private readonly _scrollContainer!: HTMLElement;\n\n  private _updateContext(): void {\n    this._context.setValue(this._state, true);\n  }\n\n  private _updateUserInputContext(): void {\n    this._userInputContext.setValue(this._state, true);\n  }\n\n  /**\n   * The list of chat messages currently displayed.\n   * Use this property to set or update the message history.\n   */\n  @property({ attribute: false })\n  public set messages(value: IgcChatMessage[]) {\n    this._state.messages = value;\n  }\n\n  public get messages(): IgcChatMessage[] {\n    return this._state.messages;\n  }\n\n  /**\n   * The chat message currently being composed but not yet sent.\n   * Includes the draft text and any attachments.\n   */\n  @property({ attribute: false })\n  public set draftMessage(value: {\n    text: string;\n    attachments?: IgcChatMessageAttachment[];\n  }) {\n    if (this._state && value) {\n      this._state.inputValue = value.text;\n      this._state.inputAttachments = value.attachments || [];\n      this.requestUpdate();\n    }\n  }\n\n  public get draftMessage(): {\n    text: string;\n    attachments?: IgcChatMessageAttachment[];\n  } {\n    return {\n      text: this._state.inputValue,\n      attachments: this._state.inputAttachments,\n    };\n  }\n\n  /**\n   * Controls the chat behavior and appearance through a configuration object.\n   * Use this to toggle UI options, provide suggestions, templates, etc.\n   */\n  @property({ attribute: false })\n  public set options(value: IgcChatOptions) {\n    this._state.options = value;\n  }\n\n  public get options(): IgcChatOptions | undefined {\n    return this._state.options;\n  }\n\n  /**\n   * The resource strings of the chat.\n   */\n  @property({ attribute: false })\n  public resourceStrings = IgcChatResourceStringEN;\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  private _getRenderer<U extends keyof DefaultChatRenderers>(\n    name: U\n  ): DefaultChatRenderers[U] {\n    return this._state.options?.renderers\n      ? (this._state.options.renderers[name] ?? this._defaults[name])\n      : this._defaults[name];\n  }\n\n  private _handleSuggestionClick(text: string): void {\n    this._state.addMessageWithEvent({ text });\n    this._input?.focusInput();\n  }\n\n  /**\n   * Scrolls the view to a specific message by id.\n   */\n  public scrollToMessage(messageId: string): void {\n    if (!isEmpty(this.messages)) {\n      const message = this.renderRoot.querySelector(`#message-${messageId}`);\n      message?.scrollIntoView({ block: 'end', inline: 'end' });\n    }\n  }\n\n  protected override updated(properties: PropertyValues<this>): void {\n    if (\n      (properties.has('messages') ||\n        this._typingIndicator ||\n        this._suggestionsContainer) &&\n      !this._state.disableAutoScroll\n    ) {\n      this._scrollToBottom();\n    }\n  }\n\n  private _scrollToBottom(): void {\n    const current = this._scrollContainer.scrollTop;\n\n    requestAnimationFrame(() => {\n      const scrollHeight = this._scrollContainer.scrollHeight;\n      if (current < scrollHeight) {\n        this._scrollContainer.scrollBy({\n          top: Math.abs(scrollHeight - current),\n        });\n      }\n    });\n  }\n\n  private _renderHeader() {\n    const hasContent =\n      this._slots.hasAssignedElements('prefix') ||\n      this._slots.hasAssignedElements('title') ||\n      this._slots.hasAssignedElements('actions') ||\n      this._state.options?.headerText;\n\n    return html`\n      <div part=\"header\" ?hidden=${!hasContent}>\n        <slot\n          name=\"prefix\"\n          ?hidden=${!this._slots.hasAssignedElements('prefix')}\n        ></slot>\n        <slot name=\"title\">${this._state.options?.headerText}</slot>\n        <slot name=\"actions\"></slot>\n      </div>\n    `;\n  }\n\n  private _renderMessages() {\n    const ctx = { instance: this };\n\n    return html`\n      <div part=\"message-list\" tabindex=\"0\">\n        ${repeat(\n          this._state.messages,\n          (message) => message.id,\n          (message) => {\n            return html`\n              <igc-chat-message\n                id=${`message-${message.id}`}\n                part=\"message-item\"\n                .message=${message}\n                exportparts=\"\n                  message-container,\n                  message-list,\n                  message-header,\n                  plain-text: message-content,\n                  message-attachments: message-attachments-container,\n                  attachment: message-attachment,\n                  message-actions: message-actions-container,\n                  sent: message-sent,\n                  attachment-header,\n                  attachment-content,\n                  attachment-icon,\n                  file-name,\n                \"\n              >\n              </igc-chat-message>\n            `;\n          }\n        )}\n        ${this._state.options?.isTyping\n          ? html`\n              <div part=\"typing-indicator\">\n                <slot name=\"typing-indicator\"\n                  >${this._getRenderer('typingIndicator')(ctx)}</slot\n                >\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n\n  private _renderLoadingTemplate() {\n    return html`\n      <div part=\"typing-dot\"></div>\n      <div part=\"typing-dot\"></div>\n      <div part=\"typing-dot\"></div>\n      <div part=\"typing-dot\"></div>\n    `;\n  }\n\n  private _renderSuggestionPrefix() {\n    return html`<igc-icon name=\"auto_suggest\"></igc-icon>`;\n  }\n\n  private _renderSuggestions() {\n    const hasContent = this._slots.hasAssignedElements('suggestions-header');\n    const suggestions = this._state.options?.suggestions ?? [];\n    const ctx = { instance: this };\n\n    return html`\n      <div part=\"suggestions-container\">\n        <igc-list>\n          <igc-list-header part=\"suggestions-header\">\n            <span ?hidden=${hasContent}>\n              ${this.resourceStrings.suggestionsHeader}\n            </span>\n            <slot name=\"suggestions-header\"></slot>\n          </igc-list-header>\n          <slot name=\"suggestions\">\n            ${suggestions.map(\n              (suggestion) => html`\n                <slot name=\"suggestion\">\n                  <igc-list-item\n                    part=\"suggestion\"\n                    @click=${() => this._handleSuggestionClick(suggestion)}\n                  >\n                    <span slot=\"start\" part=\"suggestion-prefix\">\n                      ${this._getRenderer('suggestionPrefix')(ctx)}\n                    </span>\n                    <span slot=\"title\" part=\"suggestion-title\"\n                      >${suggestion}</span\n                    >\n                  </igc-list-item>\n                </slot>\n              `\n            )}\n          </slot>\n          <slot name=\"suggestions-actions\"></slot>\n        </igc-list>\n      </div>\n    `;\n  }\n\n  private _renderEmptyState() {\n    return html`\n      <div part=\"empty-state\">\n        <slot name=\"empty-state\"></slot>\n      </div>\n    `;\n  }\n\n  protected override render() {\n    const hasMessages = !isEmpty(this.messages);\n    const suggestions = isEmpty(this._state.options?.suggestions ?? [])\n      ? nothing\n      : this._renderSuggestions();\n\n    return html`\n      <div part=\"chat-container\">\n        ${this._renderHeader()}\n\n        <div part=\"message-area-container\">\n          ${cache(\n            hasMessages || this._state.options?.isTyping\n              ? this._renderMessages()\n              : this._renderEmptyState()\n          )}\n          ${this._state.suggestionsPosition === 'below-messages'\n            ? suggestions\n            : nothing}\n        </div>\n\n        <div part=\"input-area-container\">\n          <igc-chat-input\n            exportparts=\"\n                input-container: input-area-container,\n                input-wrapper: input-container,\n                attachments: input-attachments-container,\n                attachment-wrapper: input-attachment-container,\n                attachment-name: input-attachment-name,\n                attachment-icon: input-attachment-icon,\n                text-input,\n                actions-container: input-actions-container,\n                input-actions-start,\n                input-actions-end,\n                file-upload-container,\n                file-upload,\n                send-button-container,\n                send-button\"\n          >\n          </igc-chat-input>\n          ${this._state.suggestionsPosition === 'below-input'\n            ? suggestions\n            : nothing}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-chat': IgcChatComponent;\n  }\n}\n"]}

package/components/chat/types.d.ts

@@ -217,6 +217,8 @@ export interface ChatRenderers {
     messageHeader?: ChatTemplateRenderer<ChatMessageRenderContext>;
     /**
      * Custom renderer for the "is typing" indicator.
+     *
+     * @deprecated since 6.4.0. Use the `typing-indicator` slot.
      */
     typingIndicator?: ChatTemplateRenderer<ChatRenderContext>;
     /**

package/components/chat/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/chat/types.ts"],"names":[],"mappings":"","sourcesContent":["import type IgcChatComponent from './chat.js';\n\n/**\n * Represents a single chat message in the conversation.\n */\nexport interface IgcChatMessage {\n  /**\n   * A unique identifier for the message.\n   */\n  id: string;\n\n  /**\n   * The textual content of the message.\n   */\n  text: string;\n\n  /**\n   * The identifier or name of the sender of the message.\n   */\n  sender: string;\n\n  /**\n   * The timestamp indicating when the message was sent.\n   */\n  timestamp?: string;\n\n  /**\n   * Optional list of attachments associated with the message,\n   * such as images, files, or links.\n   */\n  attachments?: IgcChatMessageAttachment[];\n\n  /**\n   * Optional list of reactions associated with the message.\n   */\n  reactions?: string[];\n}\n\n/**\n * Represents an attachment associated with a chat message.\n */\nexport interface IgcChatMessageAttachment {\n  /**\n   * A unique identifier for the attachment.\n   */\n  id: string;\n\n  /**\n   * The display name of the attachment (e.g. file name).\n   */\n  name: string;\n\n  /**\n   * The URL from which the attachment can be downloaded or viewed.\n   * Typically used for attachments stored on a server or CDN.\n   */\n  url?: string;\n\n  /**\n   * The actual File object, if the attachment was provided locally (e.g. via upload).\n   */\n  file?: File;\n\n  /**\n   * The MIME type or a custom type identifier for the attachment (e.g. \"image/png\", \"pdf\", \"audio\").\n   */\n  type?: string;\n\n  /**\n   * Optional URL to a thumbnail preview of the attachment (e.g. for images or videos).\n   */\n  thumbnail?: string;\n}\n\n/**\n * Configuration options for customizing the behavior and appearance of the chat component.\n */\nexport type IgcChatOptions = {\n  /**\n   * The ID of the current user. Used to differentiate between incoming and outgoing messages.\n   */\n  currentUserId?: string;\n  /**\n   * If `true`, prevents the chat from automatically scrolling to the latest message.\n   */\n  disableAutoScroll?: boolean;\n  /**\n   * If `true`, disables the ability to upload and send attachments.\n   * Defaults to `false`.\n   */\n  disableInputAttachments?: boolean;\n  /**\n   * Indicates whether the other user is currently typing a message.\n   */\n  isTyping?: boolean;\n  /**\n   * The accepted files that could be attached.\n   * Defines the file types as a list of comma-separated values (e.g. \"image/*,.pdf\") that the file input should accept.\n   */\n  acceptedFiles?: string;\n  /**\n   * Optional header text to display at the top of the chat component.\n   */\n  headerText?: string;\n  /**\n   * Optional placeholder text for the chat input area.\n   * Provides a hint to the user about what they can type (e.g. \"Type a message...\").\n   */\n  inputPlaceholder?: string;\n  /**\n   * Suggested text snippets or quick replies that can be shown as user-selectable options.\n   */\n  suggestions?: string[];\n  /**\n   * Controls the position of the chat suggestions within the component layout.\n   *\n   * - `\"below-input\"`: Renders suggestions below the chat input area.\n   * - `\"below-messages\"`: Renders suggestions below the chat messages area.\n   *\n   * Default is `\"below-messages\"`.\n   */\n  suggestionsPosition?: ChatSuggestionsPosition;\n  /**\n   * Time in milliseconds to wait before dispatching a stop typing event.\n   * Default is `3000`.\n   */\n  stopTypingDelay?: number;\n\n  /**\n   * A boolean flag that, when `true`, enables a **quick and dirty workaround** for styling\n   * components rendered within the Shadow DOM, from custom message renderers, by allowing them\n   * to inherit styles from the document's root. This can be useful for developers who prefer not to handle\n   * Shadow DOM encapsulation, but it is **not the recommended approach**.\n   *\n   * It is highly advised to use standard Web Component styling methods first, in this order:\n   *\n   * 1.  **CSS Variables and Parts API**: Use the exposed `::part` API with custom CSS variables to style\n   * your content in your custom renderers.\n   *\n   * 2.  **`link` elements**: For larger style sheets, link them directly within the Shadow DOM to maintain\n   * encapsulation.\n   *\n   * 3.  **Inline `<style>` tags**: Use these for small, self-contained styles within a template.\n   *\n   * This property should be used as a **last resort** as it can lead to **style leakage**, where\n   * global styles unexpectedly bleed into the component, breaking encapsulation and causing\n   * unpredictable visual issues.\n   *\n   * **WARNING**: This is a once time shot. Changing this property in runtime won't reflect\n   * its value.\n   */\n  adoptRootStyles?: boolean;\n\n  /**\n   * An object containing a collection of custom renderers for different parts of the chat UI.\n   */\n  renderers?: ChatRenderers;\n};\n\n/**\n * Represents a user's reaction to a specific chat message.\n */\nexport interface IgcChatMessageReaction {\n  /**\n   * The chat message that the reaction is associated with.\n   */\n  message: IgcChatMessage;\n  /**\n   * The string representation of the reaction, such as an emoji or a string;\n   */\n  reaction: string;\n}\n\n/**\n * A collection of optional rendering functions that allow for custom UI rendering.\n * Each property is a function that takes a context object and returns a template result.\n */\nexport interface ChatRenderers {\n  /**\n   * Custom renderer for a single chat message attachment.\n   */\n  attachment?: ChatTemplateRenderer<ChatAttachmentRenderContext>;\n  /**\n   * Custom renderer for the content of an attachment.\n   */\n  attachmentContent?: ChatTemplateRenderer<ChatAttachmentRenderContext>;\n  /**\n   * Custom renderer for the header of an attachment.\n   */\n  attachmentHeader?: ChatTemplateRenderer<ChatAttachmentRenderContext>;\n  /**\n   * Custom renderer for the file upload button in the input area.\n   */\n  fileUploadButton?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the main chat input field.\n   */\n  input?: ChatTemplateRenderer<ChatInputRenderContext>;\n  /**\n   * Custom renderer for the actions container within the input area.\n   */\n  inputActions?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the actions at the end of the input area.\n   */\n  inputActionsEnd?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the actions at the start of the input area.\n   */\n  inputActionsStart?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the attachment previews within the input field.\n   */\n  inputAttachments?: ChatTemplateRenderer<ChatInputRenderContext>;\n  /**\n   * Custom renderer for an entire chat message bubble.\n   */\n  message?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for message-specific actions (e.g., reply or delete buttons).\n   */\n  messageActions?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the attachments associated with a message.\n   */\n  messageAttachments?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the main text and content of a message.\n   */\n  messageContent?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the header of a message, including sender and timestamp.\n   */\n  messageHeader?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the \"is typing\" indicator.\n   */\n  typingIndicator?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the message send button.\n   */\n  sendButton?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the prefix text shown before suggestions.\n   */\n  suggestionPrefix?: ChatTemplateRenderer<ChatRenderContext>;\n}\n\n/**\n * A generic type for a function that serves as a custom renderer.\n * It takes a context object of type T and returns a template result.\n */\nexport type ChatTemplateRenderer<T> = (ctx: T) => unknown;\n\n/**\n * A string literal type defining the two possible positions for chat suggestions.\n */\nexport type ChatSuggestionsPosition = 'below-input' | 'below-messages';\n\n/**\n * The base context object passed to custom renderer functions, containing the chat component instance.\n */\nexport interface ChatRenderContext {\n  /**\n   * The instance of the IgcChatComponent.\n   */\n  instance: IgcChatComponent;\n}\n\n/**\n * The context object for renderers that deal with the chat input area.\n * It extends the base context with input-specific properties.\n */\nexport interface ChatInputRenderContext extends ChatRenderContext {\n  /**\n   * The list of attachments currently in the input area.\n   */\n  attachments: IgcChatMessageAttachment[];\n  /**\n   * The current value of the input field.\n   */\n  value: string;\n}\n\n/**\n * The context object for renderers that deal with a specific chat message.\n * It extends the base context with the message data.\n */\nexport interface ChatMessageRenderContext extends ChatRenderContext {\n  /**\n   * The specific chat message being rendered.\n   */\n  message: IgcChatMessage;\n}\n\n/**\n * The context object for renderers that deal with a specific attachment within a message.\n * It extends the message context with the attachment data.\n */\nexport interface ChatAttachmentRenderContext extends ChatMessageRenderContext {\n  /**\n   * The specific attachment being rendered.\n   */\n  attachment: IgcChatMessageAttachment;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/chat/types.ts"],"names":[],"mappings":"","sourcesContent":["import type IgcChatComponent from './chat.js';\n\n/**\n * Represents a single chat message in the conversation.\n */\nexport interface IgcChatMessage {\n  /**\n   * A unique identifier for the message.\n   */\n  id: string;\n\n  /**\n   * The textual content of the message.\n   */\n  text: string;\n\n  /**\n   * The identifier or name of the sender of the message.\n   */\n  sender: string;\n\n  /**\n   * The timestamp indicating when the message was sent.\n   */\n  timestamp?: string;\n\n  /**\n   * Optional list of attachments associated with the message,\n   * such as images, files, or links.\n   */\n  attachments?: IgcChatMessageAttachment[];\n\n  /**\n   * Optional list of reactions associated with the message.\n   */\n  reactions?: string[];\n}\n\n/**\n * Represents an attachment associated with a chat message.\n */\nexport interface IgcChatMessageAttachment {\n  /**\n   * A unique identifier for the attachment.\n   */\n  id: string;\n\n  /**\n   * The display name of the attachment (e.g. file name).\n   */\n  name: string;\n\n  /**\n   * The URL from which the attachment can be downloaded or viewed.\n   * Typically used for attachments stored on a server or CDN.\n   */\n  url?: string;\n\n  /**\n   * The actual File object, if the attachment was provided locally (e.g. via upload).\n   */\n  file?: File;\n\n  /**\n   * The MIME type or a custom type identifier for the attachment (e.g. \"image/png\", \"pdf\", \"audio\").\n   */\n  type?: string;\n\n  /**\n   * Optional URL to a thumbnail preview of the attachment (e.g. for images or videos).\n   */\n  thumbnail?: string;\n}\n\n/**\n * Configuration options for customizing the behavior and appearance of the chat component.\n */\nexport type IgcChatOptions = {\n  /**\n   * The ID of the current user. Used to differentiate between incoming and outgoing messages.\n   */\n  currentUserId?: string;\n  /**\n   * If `true`, prevents the chat from automatically scrolling to the latest message.\n   */\n  disableAutoScroll?: boolean;\n  /**\n   * If `true`, disables the ability to upload and send attachments.\n   * Defaults to `false`.\n   */\n  disableInputAttachments?: boolean;\n  /**\n   * Indicates whether the other user is currently typing a message.\n   */\n  isTyping?: boolean;\n  /**\n   * The accepted files that could be attached.\n   * Defines the file types as a list of comma-separated values (e.g. \"image/*,.pdf\") that the file input should accept.\n   */\n  acceptedFiles?: string;\n  /**\n   * Optional header text to display at the top of the chat component.\n   */\n  headerText?: string;\n  /**\n   * Optional placeholder text for the chat input area.\n   * Provides a hint to the user about what they can type (e.g. \"Type a message...\").\n   */\n  inputPlaceholder?: string;\n  /**\n   * Suggested text snippets or quick replies that can be shown as user-selectable options.\n   */\n  suggestions?: string[];\n  /**\n   * Controls the position of the chat suggestions within the component layout.\n   *\n   * - `\"below-input\"`: Renders suggestions below the chat input area.\n   * - `\"below-messages\"`: Renders suggestions below the chat messages area.\n   *\n   * Default is `\"below-messages\"`.\n   */\n  suggestionsPosition?: ChatSuggestionsPosition;\n  /**\n   * Time in milliseconds to wait before dispatching a stop typing event.\n   * Default is `3000`.\n   */\n  stopTypingDelay?: number;\n\n  /**\n   * A boolean flag that, when `true`, enables a **quick and dirty workaround** for styling\n   * components rendered within the Shadow DOM, from custom message renderers, by allowing them\n   * to inherit styles from the document's root. This can be useful for developers who prefer not to handle\n   * Shadow DOM encapsulation, but it is **not the recommended approach**.\n   *\n   * It is highly advised to use standard Web Component styling methods first, in this order:\n   *\n   * 1.  **CSS Variables and Parts API**: Use the exposed `::part` API with custom CSS variables to style\n   * your content in your custom renderers.\n   *\n   * 2.  **`link` elements**: For larger style sheets, link them directly within the Shadow DOM to maintain\n   * encapsulation.\n   *\n   * 3.  **Inline `<style>` tags**: Use these for small, self-contained styles within a template.\n   *\n   * This property should be used as a **last resort** as it can lead to **style leakage**, where\n   * global styles unexpectedly bleed into the component, breaking encapsulation and causing\n   * unpredictable visual issues.\n   *\n   * **WARNING**: This is a once time shot. Changing this property in runtime won't reflect\n   * its value.\n   */\n  adoptRootStyles?: boolean;\n\n  /**\n   * An object containing a collection of custom renderers for different parts of the chat UI.\n   */\n  renderers?: ChatRenderers;\n};\n\n/**\n * Represents a user's reaction to a specific chat message.\n */\nexport interface IgcChatMessageReaction {\n  /**\n   * The chat message that the reaction is associated with.\n   */\n  message: IgcChatMessage;\n  /**\n   * The string representation of the reaction, such as an emoji or a string;\n   */\n  reaction: string;\n}\n\n/**\n * A collection of optional rendering functions that allow for custom UI rendering.\n * Each property is a function that takes a context object and returns a template result.\n */\nexport interface ChatRenderers {\n  /**\n   * Custom renderer for a single chat message attachment.\n   */\n  attachment?: ChatTemplateRenderer<ChatAttachmentRenderContext>;\n  /**\n   * Custom renderer for the content of an attachment.\n   */\n  attachmentContent?: ChatTemplateRenderer<ChatAttachmentRenderContext>;\n  /**\n   * Custom renderer for the header of an attachment.\n   */\n  attachmentHeader?: ChatTemplateRenderer<ChatAttachmentRenderContext>;\n  /**\n   * Custom renderer for the file upload button in the input area.\n   */\n  fileUploadButton?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the main chat input field.\n   */\n  input?: ChatTemplateRenderer<ChatInputRenderContext>;\n  /**\n   * Custom renderer for the actions container within the input area.\n   */\n  inputActions?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the actions at the end of the input area.\n   */\n  inputActionsEnd?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the actions at the start of the input area.\n   */\n  inputActionsStart?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the attachment previews within the input field.\n   */\n  inputAttachments?: ChatTemplateRenderer<ChatInputRenderContext>;\n  /**\n   * Custom renderer for an entire chat message bubble.\n   */\n  message?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for message-specific actions (e.g., reply or delete buttons).\n   */\n  messageActions?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the attachments associated with a message.\n   */\n  messageAttachments?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the main text and content of a message.\n   */\n  messageContent?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the header of a message, including sender and timestamp.\n   */\n  messageHeader?: ChatTemplateRenderer<ChatMessageRenderContext>;\n  /**\n   * Custom renderer for the \"is typing\" indicator.\n   *\n   * @deprecated since 6.4.0. Use the `typing-indicator` slot.\n   */\n  typingIndicator?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the message send button.\n   */\n  sendButton?: ChatTemplateRenderer<ChatRenderContext>;\n  /**\n   * Custom renderer for the prefix text shown before suggestions.\n   */\n  suggestionPrefix?: ChatTemplateRenderer<ChatRenderContext>;\n}\n\n/**\n * A generic type for a function that serves as a custom renderer.\n * It takes a context object of type T and returns a template result.\n */\nexport type ChatTemplateRenderer<T> = (ctx: T) => unknown;\n\n/**\n * A string literal type defining the two possible positions for chat suggestions.\n */\nexport type ChatSuggestionsPosition = 'below-input' | 'below-messages';\n\n/**\n * The base context object passed to custom renderer functions, containing the chat component instance.\n */\nexport interface ChatRenderContext {\n  /**\n   * The instance of the IgcChatComponent.\n   */\n  instance: IgcChatComponent;\n}\n\n/**\n * The context object for renderers that deal with the chat input area.\n * It extends the base context with input-specific properties.\n */\nexport interface ChatInputRenderContext extends ChatRenderContext {\n  /**\n   * The list of attachments currently in the input area.\n   */\n  attachments: IgcChatMessageAttachment[];\n  /**\n   * The current value of the input field.\n   */\n  value: string;\n}\n\n/**\n * The context object for renderers that deal with a specific chat message.\n * It extends the base context with the message data.\n */\nexport interface ChatMessageRenderContext extends ChatRenderContext {\n  /**\n   * The specific chat message being rendered.\n   */\n  message: IgcChatMessage;\n}\n\n/**\n * The context object for renderers that deal with a specific attachment within a message.\n * It extends the message context with the attachment data.\n */\nexport interface ChatAttachmentRenderContext extends ChatMessageRenderContext {\n  /**\n   * The specific attachment being rendered.\n   */\n  attachment: IgcChatMessageAttachment;\n}\n"]}

package/components/chat/utils.d.ts

@@ -1,4 +1,4 @@
-import type IgcChatMessageComponent from './chat-message.js';
+import { type LitElement, type ReactiveController, type ReactiveControllerHost } from 'lit';
 import type { IgcChatMessageAttachment } from './types.js';
 export type ChatAcceptedFileTypes = {
     extensions: Set<string>;
@@ -13,4 +13,15 @@ export declare function getIconName(fileType?: string): "attach_document" | "att
 export declare function createAttachmentURL(attachment: IgcChatMessageAttachment): string;
 export declare function getFileExtension(name: string): string;
 export declare function isImageAttachment(attachment: IgcChatMessageAttachment | File): boolean;
-export declare function chatMessageAdoptPageStyles(message: IgcChatMessageComponent): void;
+declare class AdoptedStylesController implements ReactiveController {
+    private readonly _host;
+    private _hasAdoptedStyles;
+    get hasAdoptedStyles(): boolean;
+    private _adoptRootStyles;
+    constructor(host: ReactiveControllerHost & LitElement);
+    shouldAdoptStyles(condition: boolean): void;
+    /** @internal */
+    hostDisconnected(): void;
+}
+export declare function addAdoptedStylesController(host: ReactiveControllerHost & LitElement): AdoptedStylesController;
+export type { AdoptedStylesController };

package/components/chat/utils.js

@@ -1,4 +1,4 @@
-import { adoptStyles } from 'lit';
+import { adoptStyles, } from 'lit';
 import { last } from '../common/util.js';
 export const ChatFileTypeIcons = new Map(Object.entries({
     css: 'file_css',
@@ -64,22 +64,44 @@ export function isImageAttachment(attachment) {
     }
     return Boolean(attachment.type === 'image' || attachment.file?.type.startsWith('image/'));
 }
-export function chatMessageAdoptPageStyles(message) {
-    const sheets = [];
-    for (const sheet of document.styleSheets) {
-        try {
-            const constructed = new CSSStyleSheet();
-            for (const rule of sheet.cssRules) {
-                if (rule.cssText.startsWith('@import')) {
-                    continue;
+class AdoptedStylesController {
+    get hasAdoptedStyles() {
+        return this._hasAdoptedStyles;
+    }
+    _adoptRootStyles() {
+        const sheets = [];
+        for (const sheet of document.styleSheets) {
+            try {
+                const constructed = new CSSStyleSheet();
+                for (const rule of sheet.cssRules) {
+                    if (rule.cssText.startsWith('@import')) {
+                        continue;
+                    }
+                    constructed.insertRule(rule.cssText);
                 }
-                constructed.insertRule(rule.cssText);
+                sheets.push(constructed);
             }
-            sheets.push(constructed);
+            catch { }
+        }
+        const ctor = this._host.constructor;
+        adoptStyles(this._host.shadowRoot, [...ctor.elementStyles, ...sheets]);
+    }
+    constructor(host) {
+        this._hasAdoptedStyles = false;
+        this._host = host;
+        host.addController(this);
+    }
+    shouldAdoptStyles(condition) {
+        if (condition) {
+            this._adoptRootStyles();
+            this._hasAdoptedStyles = true;
         }
-        catch { }
     }
-    const ctor = message.constructor;
-    adoptStyles(message.shadowRoot, [...ctor.elementStyles, ...sheets]);
+    hostDisconnected() {
+        this._hasAdoptedStyles = false;
+    }
+}
+export function addAdoptedStylesController(host) {
+    return new AdoptedStylesController(host);
 }
 //# sourceMappingURL=utils.js.map

package/components/chat/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/chat/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { adoptStyles, type LitElement } from 'lit';\nimport { last } from '../common/util.js';\nimport type IgcChatMessageComponent from './chat-message.js';\nimport type { IgcChatMessageAttachment } from './types.js';\n\nexport type ChatAcceptedFileTypes = {\n  extensions: Set<string>;\n  mimeTypes: Set<string>;\n  wildcardTypes: Set<string>;\n};\n\nexport const ChatFileTypeIcons = new Map(\n  Object.entries({\n    css: 'file_css',\n    csv: 'file_csv',\n    doc: 'file_doc',\n    docx: 'file_doc',\n    htm: 'file_htm',\n    html: 'file_html',\n    js: 'file_js',\n    json: 'file_json',\n    pdf: 'file_pdf',\n    rtf: 'file_rtf',\n    svg: 'file_svg',\n    txt: 'file_txt',\n    url: 'file_link',\n    xls: 'file_xls',\n    xlsx: 'file_xls',\n    xml: 'file_xml',\n    zip: 'file_zip',\n    default: 'file_generic',\n  })\n);\n\nexport function parseAcceptedFileTypes(\n  fileTypes: string\n): ChatAcceptedFileTypes {\n  const types = fileTypes.split(',').map((each) => each.trim().toLowerCase());\n  return {\n    extensions: new Set(types.filter((t) => t.startsWith('.'))),\n    mimeTypes: new Set(\n      types.filter((t) => !t.startsWith('.') && !t.endsWith('/*'))\n    ),\n    wildcardTypes: new Set(\n      types.filter((t) => t.endsWith('/*')).map((t) => t.slice(0, -2))\n    ),\n  };\n}\n\nexport function isAcceptedFileType(\n  file: File,\n  accepted: ChatAcceptedFileTypes | null\n): boolean {\n  if (!(accepted && file)) {\n    return true;\n  }\n\n  const { extensions, mimeTypes, wildcardTypes } = accepted;\n  const fileType = file.type.toLowerCase();\n  const fileExtension = `.${last(file.name.split('.'))?.toLowerCase()}`;\n  const [fileBaseType] = fileType.split('/');\n\n  return (\n    extensions.has(fileExtension) ||\n    mimeTypes.has(fileType) ||\n    wildcardTypes.has(fileBaseType)\n  );\n}\n\nexport function getChatAcceptedFiles(\n  event: DragEvent,\n  accepted: ChatAcceptedFileTypes | null\n): File[] {\n  return Array.from(event.dataTransfer?.items ?? [])\n    .filter(\n      (item) =>\n        item.kind === 'file' && isAcceptedFileType(item.getAsFile()!, accepted)\n    )\n    .map((item) => item.getAsFile()!);\n}\n\nexport function getIconName(fileType?: string) {\n  return fileType?.startsWith('image') ? 'attach_image' : 'attach_document';\n}\n\nexport function createAttachmentURL(\n  attachment: IgcChatMessageAttachment\n): string {\n  if (attachment.file) {\n    return URL.createObjectURL(attachment.file);\n  }\n\n  return attachment.url || '';\n}\n\nexport function getFileExtension(name: string): string {\n  const parts = name.split('.');\n  return parts.length > 1 ? last(parts) : '';\n}\n\nexport function isImageAttachment(\n  attachment: IgcChatMessageAttachment | File\n): boolean {\n  if (attachment instanceof File) {\n    return attachment.type.startsWith('image/');\n  }\n\n  return Boolean(\n    attachment.type === 'image' || attachment.file?.type.startsWith('image/')\n  );\n}\n\nexport function chatMessageAdoptPageStyles(\n  message: IgcChatMessageComponent\n): void {\n  const sheets: CSSStyleSheet[] = [];\n\n  for (const sheet of document.styleSheets) {\n    try {\n      const constructed = new CSSStyleSheet();\n      for (const rule of sheet.cssRules) {\n        // https://drafts.csswg.org/cssom/#dom-cssstylesheet-insertrule:~:text=If%20parsed%20rule%20is%20an%20%40import%20rule\n        if (rule.cssText.startsWith('@import')) {\n          continue;\n        }\n        constructed.insertRule(rule.cssText);\n      }\n      sheets.push(constructed);\n    } catch {}\n  }\n\n  const ctor = message.constructor as typeof LitElement;\n  adoptStyles(message.shadowRoot!, [...ctor.elementStyles, ...sheets]);\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/chat/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  adoptStyles,\n  type LitElement,\n  type ReactiveController,\n  type ReactiveControllerHost,\n} from 'lit';\nimport { last } from '../common/util.js';\nimport type { IgcChatMessageAttachment } from './types.js';\n\nexport type ChatAcceptedFileTypes = {\n  extensions: Set<string>;\n  mimeTypes: Set<string>;\n  wildcardTypes: Set<string>;\n};\n\nexport const ChatFileTypeIcons = new Map(\n  Object.entries({\n    css: 'file_css',\n    csv: 'file_csv',\n    doc: 'file_doc',\n    docx: 'file_doc',\n    htm: 'file_htm',\n    html: 'file_html',\n    js: 'file_js',\n    json: 'file_json',\n    pdf: 'file_pdf',\n    rtf: 'file_rtf',\n    svg: 'file_svg',\n    txt: 'file_txt',\n    url: 'file_link',\n    xls: 'file_xls',\n    xlsx: 'file_xls',\n    xml: 'file_xml',\n    zip: 'file_zip',\n    default: 'file_generic',\n  })\n);\n\nexport function parseAcceptedFileTypes(\n  fileTypes: string\n): ChatAcceptedFileTypes {\n  const types = fileTypes.split(',').map((each) => each.trim().toLowerCase());\n  return {\n    extensions: new Set(types.filter((t) => t.startsWith('.'))),\n    mimeTypes: new Set(\n      types.filter((t) => !t.startsWith('.') && !t.endsWith('/*'))\n    ),\n    wildcardTypes: new Set(\n      types.filter((t) => t.endsWith('/*')).map((t) => t.slice(0, -2))\n    ),\n  };\n}\n\nexport function isAcceptedFileType(\n  file: File,\n  accepted: ChatAcceptedFileTypes | null\n): boolean {\n  if (!(accepted && file)) {\n    return true;\n  }\n\n  const { extensions, mimeTypes, wildcardTypes } = accepted;\n  const fileType = file.type.toLowerCase();\n  const fileExtension = `.${last(file.name.split('.'))?.toLowerCase()}`;\n  const [fileBaseType] = fileType.split('/');\n\n  return (\n    extensions.has(fileExtension) ||\n    mimeTypes.has(fileType) ||\n    wildcardTypes.has(fileBaseType)\n  );\n}\n\nexport function getChatAcceptedFiles(\n  event: DragEvent,\n  accepted: ChatAcceptedFileTypes | null\n): File[] {\n  return Array.from(event.dataTransfer?.items ?? [])\n    .filter(\n      (item) =>\n        item.kind === 'file' && isAcceptedFileType(item.getAsFile()!, accepted)\n    )\n    .map((item) => item.getAsFile()!);\n}\n\nexport function getIconName(fileType?: string) {\n  return fileType?.startsWith('image') ? 'attach_image' : 'attach_document';\n}\n\nexport function createAttachmentURL(\n  attachment: IgcChatMessageAttachment\n): string {\n  if (attachment.file) {\n    return URL.createObjectURL(attachment.file);\n  }\n\n  return attachment.url || '';\n}\n\nexport function getFileExtension(name: string): string {\n  const parts = name.split('.');\n  return parts.length > 1 ? last(parts) : '';\n}\n\nexport function isImageAttachment(\n  attachment: IgcChatMessageAttachment | File\n): boolean {\n  if (attachment instanceof File) {\n    return attachment.type.startsWith('image/');\n  }\n\n  return Boolean(\n    attachment.type === 'image' || attachment.file?.type.startsWith('image/')\n  );\n}\n\nclass AdoptedStylesController implements ReactiveController {\n  private readonly _host: ReactiveControllerHost & LitElement;\n  private _hasAdoptedStyles = false;\n\n  public get hasAdoptedStyles(): boolean {\n    return this._hasAdoptedStyles;\n  }\n\n  private _adoptRootStyles(): void {\n    const sheets: CSSStyleSheet[] = [];\n\n    for (const sheet of document.styleSheets) {\n      try {\n        const constructed = new CSSStyleSheet();\n        for (const rule of sheet.cssRules) {\n          // https://drafts.csswg.org/cssom/#dom-cssstylesheet-insertrule:~:text=If%20parsed%20rule%20is%20an%20%40import%20rule\n          if (rule.cssText.startsWith('@import')) {\n            continue;\n          }\n          constructed.insertRule(rule.cssText);\n        }\n        sheets.push(constructed);\n      } catch {}\n    }\n\n    const ctor = this._host.constructor as typeof LitElement;\n    adoptStyles(this._host.shadowRoot!, [...ctor.elementStyles, ...sheets]);\n  }\n\n  constructor(host: ReactiveControllerHost & LitElement) {\n    this._host = host;\n    host.addController(this);\n  }\n\n  public shouldAdoptStyles(condition: boolean): void {\n    if (condition) {\n      this._adoptRootStyles();\n      this._hasAdoptedStyles = true;\n    }\n  }\n\n  /** @internal */\n  public hostDisconnected(): void {\n    this._hasAdoptedStyles = false;\n  }\n}\n\nexport function addAdoptedStylesController(\n  host: ReactiveControllerHost & LitElement\n): AdoptedStylesController {\n  return new AdoptedStylesController(host);\n}\n\nexport type { AdoptedStylesController };\n"]}

package/components/checkbox/themes/checkbox.base.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=control]{--size: 1.25rem;width:var(--size);height:var(--size);min-width:var(--size);position:relative;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=control]::after{position:absolute;content:"";left:50%;top:50%;transform:translate(-50%, -50%);width:var(--size);height:var(--size);transition:all .15s ease-in}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow-wrap:break-all;transition:color .2s ease-in-out}[part~=base]{gap:.5rem}[part~=indicator]{--indicator-size: 1.125rem;display:flex;align-items:center;justify-content:center;position:absolute;inset:0;stroke-linecap:square;stroke-width:var(--mark-stroke, 3);stroke-dasharray:24;stroke-dashoffset:24;fill:none;opacity:0;z-index:1;transform-origin:center}[part~=indicator] svg{width:var(--indicator-size);height:var(--indicator-size)}label{display:flex;align-items:center;cursor:pointer;flex-flow:row nowrap}[part="indicator checked"]{transition:all .2s ease-out;stroke-dashoffset:0;opacity:1}:host([indeterminate]) [part~=indicator]{stroke-dashoffset:41;opacity:1;transform:rotate(45deg) scale(0.45) translateX(-0.25rem)}:host([indeterminate]) [part~=indicator] svg{width:100%;height:100%}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([label-position=before]) [part~=label]{order:-1}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=control]{--size: 1.25rem;width:var(--size);height:var(--size);min-width:var(--size);position:relative;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=control]::after{position:absolute;content:"";left:50%;top:50%;transform:translate(-50%, -50%);width:var(--size);height:var(--size);transition:all .15s ease-in}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow-wrap:break-all;transition:color .2s ease-in-out}[part~=base]{gap:.5rem}[part~=indicator]{--indicator-size: 1.125rem;display:flex;align-items:center;justify-content:center;position:absolute;inset:0;stroke-linecap:square;stroke-width:var(--tick-width);stroke-dasharray:24;stroke-dashoffset:24;fill:none;opacity:0;z-index:1;transform-origin:center}[part~=indicator] svg{width:var(--indicator-size);height:var(--indicator-size)}label{display:flex;align-items:center;cursor:pointer;flex-flow:row nowrap}[part="indicator checked"]{transition:all .2s ease-out;stroke-dashoffset:0;opacity:1}:host([indeterminate]) [part~=indicator]{stroke-dashoffset:41;opacity:1;transform:rotate(45deg) scale(0.45) translateX(-0.25rem)}:host([indeterminate]) [part~=indicator] svg{width:100%;height:100%}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([label-position=before]) [part~=label]{order:-1}`;
 //# sourceMappingURL=checkbox.base.css.js.map

package/components/checkbox/themes/checkbox.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.base.css.js","sourceRoot":"","sources":["../../../../src/components/checkbox/themes/checkbox.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,+pFAA+pF,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=control]{--size: 1.25rem;width:var(--size);height:var(--size);min-width:var(--size);position:relative;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=control]::after{position:absolute;content:\"\";left:50%;top:50%;transform:translate(-50%, -50%);width:var(--size);height:var(--size);transition:all .15s ease-in}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow-wrap:break-all;transition:color .2s ease-in-out}[part~=base]{gap:.5rem}[part~=indicator]{--indicator-size: 1.125rem;display:flex;align-items:center;justify-content:center;position:absolute;inset:0;stroke-linecap:square;stroke-width:var(--mark-stroke, 3);stroke-dasharray:24;stroke-dashoffset:24;fill:none;opacity:0;z-index:1;transform-origin:center}[part~=indicator] svg{width:var(--indicator-size);height:var(--indicator-size)}label{display:flex;align-items:center;cursor:pointer;flex-flow:row nowrap}[part=\"indicator checked\"]{transition:all .2s ease-out;stroke-dashoffset:0;opacity:1}:host([indeterminate]) [part~=indicator]{stroke-dashoffset:41;opacity:1;transform:rotate(45deg) scale(0.45) translateX(-0.25rem)}:host([indeterminate]) [part~=indicator] svg{width:100%;height:100%}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([label-position=before]) [part~=label]{order:-1}`;\n"]}
+{"version":3,"file":"checkbox.base.css.js","sourceRoot":"","sources":["../../../../src/components/checkbox/themes/checkbox.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2pFAA2pF,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=control]{--size: 1.25rem;width:var(--size);height:var(--size);min-width:var(--size);position:relative;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=control]::after{position:absolute;content:\"\";left:50%;top:50%;transform:translate(-50%, -50%);width:var(--size);height:var(--size);transition:all .15s ease-in}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow-wrap:break-all;transition:color .2s ease-in-out}[part~=base]{gap:.5rem}[part~=indicator]{--indicator-size: 1.125rem;display:flex;align-items:center;justify-content:center;position:absolute;inset:0;stroke-linecap:square;stroke-width:var(--tick-width);stroke-dasharray:24;stroke-dashoffset:24;fill:none;opacity:0;z-index:1;transform-origin:center}[part~=indicator] svg{width:var(--indicator-size);height:var(--indicator-size)}label{display:flex;align-items:center;cursor:pointer;flex-flow:row nowrap}[part=\"indicator checked\"]{transition:all .2s ease-out;stroke-dashoffset:0;opacity:1}:host([indeterminate]) [part~=indicator]{stroke-dashoffset:41;opacity:1;transform:rotate(45deg) scale(0.45) translateX(-0.25rem)}:host([indeterminate]) [part~=indicator] svg{width:100%;height:100%}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:initial;pointer-events:none}:host([label-position=before]) [part~=label]{order:-1}`;\n"]}

package/components/checkbox/themes/shared/checkbox/checkbox.fluent.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host ::part(helper-text){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin-block-start:max(var(--is-large, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));grid-auto-rows:minmax(1.125rem, auto)}[part~=control]{transform:translate3d(0, 0, 0)}[part~=control]::after{border-radius:var(--border-radius);background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--empty-color)}[part="control checked"]::after{background:var(--fill-color);box-shadow:inset 0 0 0 .0625rem var(--fill-color)}[part~=indicator]{--indicator-size: 1rem;--mark-stroke: 1.5}:host(:hover) [part~=indicator]{opacity:1;stroke:var(--tick-color-hover);stroke-dashoffset:0;transition:opacity .1s ease-out}:host(:hover) [part="indicator checked"]{stroke:var(--tick-color)}:host([indeterminate]) [part~=indicator]{display:none}:host([indeterminate]) [part~=control]::before{border-radius:var(--border-radius);display:block;width:inherit;height:inherit;content:"";transform:scale(0.5);transition-duration:.1s;background:var(--fill-color);z-index:1}:host([indeterminate]) [part="control checked"]::after{background:rgba(0,0,0,0)}:host([indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color)}:host([indeterminate]:hover) [part~=control]::before,:host([indeterminate]:focus-visible) [part~=control]::before{background:var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control]::after,:host([indeterminate]:focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control] [part="control checked"]::after,:host([indeterminate]:focus-visible) [part~=control] [part="control checked"]::after{background:rgba(0,0,0,0)}:host(:state(ig-invalid):not([disabled])) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color)}:host(:state(ig-invalid):not([disabled])) [part="control checked"]::after{background:var(--error-color)}:host(:state(ig-invalid):focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):focus-visible) [part="control checked"]::after{background:var(--error-color-hover)}:host(:state(ig-invalid):hover) [part~=indicator]{stroke:var(--error-color)}:host(:state(ig-invalid):hover) [part="indicator checked"]{stroke:var(--tick-color)}:host(:state(ig-invalid):hover) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):hover) [part="control checked"]::after{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color);background:rgba(0,0,0,0)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color-hover)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:not([disabled],:state(ig-invalid))[indeterminate]:hover) [part="control checked"]::after{background:rgba(0,0,0,0)}[part~=focused]{position:relative}[part~=focused]::after{content:"";position:absolute;top:-0.125rem;left:-0.125rem;box-shadow:0 0 0 .0625rem var(--focus-outline-color);width:calc(100% + 0.125rem*2);height:calc(100% + 0.125rem*2)}:host([disabled]) [part~=control]::after,:host(:disabled) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color)}:host([disabled]) [part="control checked"]::after,:host(:disabled) [part="control checked"]::after{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::before,:host(:disabled[indeterminate]) [part~=control]::before{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::after,:host(:disabled[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color);background:rgba(0,0,0,0)}`;
+export const styles = css `:host ::part(helper-text){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin-block-start:max(var(--is-large, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));grid-auto-rows:minmax(1.125rem, auto)}[part~=control]{transform:translate3d(0, 0, 0)}[part~=control]::after{border-radius:var(--border-radius);background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--empty-color)}[part="control checked"]::after{background:var(--fill-color);box-shadow:inset 0 0 0 .0625rem var(--fill-color)}[part~=indicator]{--indicator-size: 1rem}:host(:hover) [part~=indicator]{opacity:1;stroke:var(--tick-color-hover);stroke-dashoffset:0;transition:opacity .1s ease-out}:host(:hover) [part="indicator checked"]{stroke:var(--tick-color)}:host([indeterminate]) [part~=indicator]{display:none}:host([indeterminate]) [part~=control]::before{border-radius:var(--border-radius);display:block;width:inherit;height:inherit;content:"";transform:scale(0.5);transition-duration:.1s;background:var(--fill-color);z-index:1}:host([indeterminate]) [part="control checked"]::after{background:rgba(0,0,0,0)}:host([indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color)}:host([indeterminate]:hover) [part~=control]::before,:host([indeterminate]:focus-visible) [part~=control]::before{background:var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control]::after,:host([indeterminate]:focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control] [part="control checked"]::after,:host([indeterminate]:focus-visible) [part~=control] [part="control checked"]::after{background:rgba(0,0,0,0)}:host(:state(ig-invalid):not([disabled])) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color)}:host(:state(ig-invalid):not([disabled])) [part="control checked"]::after{background:var(--error-color)}:host(:state(ig-invalid):focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):focus-visible) [part="control checked"]::after{background:var(--error-color-hover)}:host(:state(ig-invalid):hover) [part~=indicator]{stroke:var(--error-color)}:host(:state(ig-invalid):hover) [part="indicator checked"]{stroke:var(--tick-color)}:host(:state(ig-invalid):hover) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):hover) [part="control checked"]::after{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color);background:rgba(0,0,0,0)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color-hover)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:not([disabled],:state(ig-invalid))[indeterminate]:hover) [part="control checked"]::after{background:rgba(0,0,0,0)}[part~=focused]{position:relative}[part~=focused]::after{content:"";position:absolute;top:-0.125rem;left:-0.125rem;box-shadow:0 0 0 .0625rem var(--focus-outline-color);width:calc(100% + 0.125rem*2);height:calc(100% + 0.125rem*2)}:host([disabled]) [part~=control]::after,:host(:disabled) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color)}:host([disabled]) [part="control checked"]::after,:host(:disabled) [part="control checked"]::after{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::before,:host(:disabled[indeterminate]) [part~=control]::before{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::after,:host(:disabled[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color);background:rgba(0,0,0,0)}`;
 //# sourceMappingURL=checkbox.fluent.css.js.map

package/components/checkbox/themes/shared/checkbox/checkbox.fluent.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/checkbox/themes/shared/checkbox/checkbox.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,m3KAAm3K,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host ::part(helper-text){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin-block-start:max(var(--is-large, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));grid-auto-rows:minmax(1.125rem, auto)}[part~=control]{transform:translate3d(0, 0, 0)}[part~=control]::after{border-radius:var(--border-radius);background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--empty-color)}[part=\"control checked\"]::after{background:var(--fill-color);box-shadow:inset 0 0 0 .0625rem var(--fill-color)}[part~=indicator]{--indicator-size: 1rem;--mark-stroke: 1.5}:host(:hover) [part~=indicator]{opacity:1;stroke:var(--tick-color-hover);stroke-dashoffset:0;transition:opacity .1s ease-out}:host(:hover) [part=\"indicator checked\"]{stroke:var(--tick-color)}:host([indeterminate]) [part~=indicator]{display:none}:host([indeterminate]) [part~=control]::before{border-radius:var(--border-radius);display:block;width:inherit;height:inherit;content:\"\";transform:scale(0.5);transition-duration:.1s;background:var(--fill-color);z-index:1}:host([indeterminate]) [part=\"control checked\"]::after{background:rgba(0,0,0,0)}:host([indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color)}:host([indeterminate]:hover) [part~=control]::before,:host([indeterminate]:focus-visible) [part~=control]::before{background:var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control]::after,:host([indeterminate]:focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control] [part=\"control checked\"]::after,:host([indeterminate]:focus-visible) [part~=control] [part=\"control checked\"]::after{background:rgba(0,0,0,0)}:host(:state(ig-invalid):not([disabled])) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color)}:host(:state(ig-invalid):not([disabled])) [part=\"control checked\"]::after{background:var(--error-color)}:host(:state(ig-invalid):focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):focus-visible) [part=\"control checked\"]::after{background:var(--error-color-hover)}:host(:state(ig-invalid):hover) [part~=indicator]{stroke:var(--error-color)}:host(:state(ig-invalid):hover) [part=\"indicator checked\"]{stroke:var(--tick-color)}:host(:state(ig-invalid):hover) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):hover) [part=\"control checked\"]::after{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color);background:rgba(0,0,0,0)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color-hover)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:not([disabled],:state(ig-invalid))[indeterminate]:hover) [part=\"control checked\"]::after{background:rgba(0,0,0,0)}[part~=focused]{position:relative}[part~=focused]::after{content:\"\";position:absolute;top:-0.125rem;left:-0.125rem;box-shadow:0 0 0 .0625rem var(--focus-outline-color);width:calc(100% + 0.125rem*2);height:calc(100% + 0.125rem*2)}:host([disabled]) [part~=control]::after,:host(:disabled) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color)}:host([disabled]) [part=\"control checked\"]::after,:host(:disabled) [part=\"control checked\"]::after{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::before,:host(:disabled[indeterminate]) [part~=control]::before{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::after,:host(:disabled[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color);background:rgba(0,0,0,0)}`;\n"]}
+{"version":3,"file":"checkbox.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/checkbox/themes/shared/checkbox/checkbox.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,g2KAAg2K,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host ::part(helper-text){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin-block-start:max(var(--is-large, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));grid-auto-rows:minmax(1.125rem, auto)}[part~=control]{transform:translate3d(0, 0, 0)}[part~=control]::after{border-radius:var(--border-radius);background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--empty-color)}[part=\"control checked\"]::after{background:var(--fill-color);box-shadow:inset 0 0 0 .0625rem var(--fill-color)}[part~=indicator]{--indicator-size: 1rem}:host(:hover) [part~=indicator]{opacity:1;stroke:var(--tick-color-hover);stroke-dashoffset:0;transition:opacity .1s ease-out}:host(:hover) [part=\"indicator checked\"]{stroke:var(--tick-color)}:host([indeterminate]) [part~=indicator]{display:none}:host([indeterminate]) [part~=control]::before{border-radius:var(--border-radius);display:block;width:inherit;height:inherit;content:\"\";transform:scale(0.5);transition-duration:.1s;background:var(--fill-color);z-index:1}:host([indeterminate]) [part=\"control checked\"]::after{background:rgba(0,0,0,0)}:host([indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color)}:host([indeterminate]:hover) [part~=control]::before,:host([indeterminate]:focus-visible) [part~=control]::before{background:var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control]::after,:host([indeterminate]:focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--fill-color-hover)}:host([indeterminate]:hover) [part~=control] [part=\"control checked\"]::after,:host([indeterminate]:focus-visible) [part~=control] [part=\"control checked\"]::after{background:rgba(0,0,0,0)}:host(:state(ig-invalid):not([disabled])) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color)}:host(:state(ig-invalid):not([disabled])) [part=\"control checked\"]::after{background:var(--error-color)}:host(:state(ig-invalid):focus-visible) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):focus-visible) [part=\"control checked\"]::after{background:var(--error-color-hover)}:host(:state(ig-invalid):hover) [part~=indicator]{stroke:var(--error-color)}:host(:state(ig-invalid):hover) [part=\"indicator checked\"]{stroke:var(--tick-color)}:host(:state(ig-invalid):hover) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover)}:host(:state(ig-invalid):hover) [part=\"control checked\"]::after{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color)}:host(:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color);background:rgba(0,0,0,0)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::before{background:var(--error-color-hover)}:host(:not([disabled]):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after,:host(:not(:disabled):state(ig-invalid)[indeterminate]):focus-within [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::before,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::before{background:var(--error-color-hover)}:host(:hover:not([disabled]):state(ig-invalid)[indeterminate]) [part~=control]::after,:host(:hover:not(:disabled):state(ig-invalid)[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--error-color-hover);background:rgba(0,0,0,0)}:host(:not([disabled],:state(ig-invalid))[indeterminate]:hover) [part=\"control checked\"]::after{background:rgba(0,0,0,0)}[part~=focused]{position:relative}[part~=focused]::after{content:\"\";position:absolute;top:-0.125rem;left:-0.125rem;box-shadow:0 0 0 .0625rem var(--focus-outline-color);width:calc(100% + 0.125rem*2);height:calc(100% + 0.125rem*2)}:host([disabled]) [part~=control]::after,:host(:disabled) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color)}:host([disabled]) [part=\"control checked\"]::after,:host(:disabled) [part=\"control checked\"]::after{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::before,:host(:disabled[indeterminate]) [part~=control]::before{background:var(--disabled-color)}:host([disabled][indeterminate]) [part~=control]::after,:host(:disabled[indeterminate]) [part~=control]::after{box-shadow:inset 0 0 0 .0625rem var(--disabled-color);background:rgba(0,0,0,0)}`;\n"]}

package/components/combo/combo.d.ts

@@ -1,9 +1,8 @@
 import { type IComboResourceStrings } from 'igniteui-i18n-core';
 import { LitElement, type TemplateResult } from 'lit';
 import type { Constructor } from '../common/mixins/constructor.js';
-import IgcInputComponent from '../input/input.js';
 import { DataController } from './controllers/data.js';
-import { NavigationController } from './controllers/navigation.js';
+import { ComboNavigationController } from './controllers/navigation.js';
 import { SelectionController } from './controllers/selection.js';
 import type { ComboItemTemplate, ComboRenderFunction, ComboValue, FilteringOptions, GroupingDirection, IgcComboComponentEventMap, Item, Keys } from './types.js';
 declare const IgcComboComponent_base: Constructor<import("../common/mixins/forms/types.js").FormRequiredInterface & import("../common/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcComboComponentEventMap>> & Constructor<LitElement>;
@@ -20,6 +19,7 @@ declare const IgcComboComponent_base: Constructor<import("../common/mixins/forms
  * @slot suffix - Renders content after the input of the combo.
  * @slot header - Renders a container before the list of options of the combo.
  * @slot footer - Renders a container after the list of options of the combo.
+ * @slot empty - Renders content when the combo dropdown list has no items/data.
  * @slot helper-text - Renders content below the input of the combo.
  * @slot toggle-icon - Renders content inside the suffix container of the combo.
  * @slot clear-icon - Renders content inside the suffix container of the combo.
@@ -61,6 +61,12 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     static styles: import("lit").CSSResult[];
     static register(): void;
     protected get __validators(): import("../common/validators.js").Validator<IgcComboComponent<any>>[];
+    /** The primary input of the combo component. */
+    private _inputRef;
+    /** The search input of the combo component. */
+    private _searchRef;
+    /** The combo virtualized dropdown list. */
+    private _listRef;
     private readonly _rootClickController;
     private readonly _i18nController;
     protected readonly _formValue: import("../common/mixins/forms/form-value.js").FormValue<ComboValue<T>[]>;
@@ -76,12 +82,9 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     private _displayValue;
     protected _state: DataController<T>;
     protected _selection: SelectionController<T>;
-    protected _navigation: NavigationController<T>;
+    protected _navigation: ComboNavigationController<T>;
     protected inputSuffix: HTMLElement[];
     protected inputPrefix: HTMLElement[];
-    protected _searchInput: IgcInputComponent;
-    private _input;
-    private _list;
     /** The data source used to generate the list of options. */
     set data(value: T[]);
     get data(): T[];
@@ -316,14 +319,13 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     toggle(): Promise<boolean>;
     private _getActiveDescendantId;
     protected itemRenderer: ComboRenderFunction<T>;
-    protected listKeydownHandler(event: KeyboardEvent): void;
     protected itemClickHandler(event: PointerEvent): void;
     protected toggleSelect(index: number): void;
     protected selectByIndex(index: number): void;
+    /** @hidden @internal */
+    clearSelection(): void;
     protected clearSingleSelection(): void;
     protected handleClearIconClick(e: PointerEvent): void;
-    protected handleMainInputKeydown(e: KeyboardEvent): void;
-    protected handleSearchInputKeydown(e: KeyboardEvent): void;
     protected toggleCaseSensitivity(): void;
     private _stopPropagation;
     private renderToggleIcon;