/**
 * Copyright IBM Corp. 2026
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

import "../../globals/settings.js";
import { carbonElement } from "../../globals/decorators/carbon-element.js";
import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
import iconLoader from "../../globals/internal/icon-loader.js";
import FocusMixin from "../../globals/mixins/focus.js";
import { NOTIFICATION_KIND, NOTIFICATION_TYPE } from "./defs.js";
import inline_notification_default$1 from "./inline-notification.scss.js";
import { LitElement, html } from "lit";
import { property } from "lit/decorators.js";
import { ifDefined } from "lit/directives/if-defined.js";
import Close16 from "@carbon/icons/es/close/16.js";
import ErrorFilled20 from "@carbon/icons/es/error--filled/20.js";
import WarningAltFilled20 from "@carbon/icons/es/warning--alt--filled/20.js";
import CheckmarkFilled20 from "@carbon/icons/es/checkmark--filled/20.js";
import InformationFilled20 from "@carbon/icons/es/information--filled/20.js";
import InformationSquareFilled20 from "@carbon/icons/es/information--square--filled/20.js";
import WarningFilled20 from "@carbon/icons/es/warning--filled/20.js";
//#region src/components/notification/inline-notification.ts
/**
* Copyright IBM Corp. 2019, 2024
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* The default icons, keyed by notification kind.
*/
const iconNamesForKinds = {
	["success"]: CheckmarkFilled20,
	["info"]: InformationFilled20,
	["info-square"]: InformationSquareFilled20,
	["warning"]: WarningFilled20,
	["warning-alt"]: WarningAltFilled20,
	["error"]: ErrorFilled20
};
/**
* Inline notification.
*
* @element cds-custom-inline-notification
* @slot subtitle - The subtitle.
* @slot title - The title.
* @fires cds-custom-notification-beingclosed
*   The custom event fired before this notification is being closed upon a user gesture.
*   Cancellation of this event stops the user-initiated action of closing this notification.
* @fires cds-custom-notification-closed - The custom event fired after this notification is closed upon a user gesture.
*/
let CDSInlineNotification = class CDSInlineNotification extends FocusMixin(LitElement) {
	constructor(..._args) {
		super(..._args);
		this._timeoutID = null;
		this._type = "inline";
		this.hideCloseButton = false;
		this.kind = "success";
		this.lowContrast = false;
		this.open = true;
		this.timeout = null;
		this.subtitle = "";
		this.title = "";
	}
	/**
	* Cancels the current timeout configured for the notification
	*
	* @param timeoutID current timeout's identifier
	*/
	_cancelTimeout(timeoutID) {
		clearTimeout(timeoutID);
		this._timeoutID = null;
	}
	/**
	* Overrides (if exists) the timeout to close the notification
	*
	* @param timeout the time in ms
	*/
	_initializeTimeout(timeout) {
		if (this._timeoutID) this._cancelTimeout(this._timeoutID);
		this._timeoutID = setTimeout(this._handleUserOrTimerInitiatedClose.bind(this, null), timeout);
	}
	/**
	* Handles `click` event on the close button.
	*
	* @param event The event.
	* @param event.target The event target.
	*/
	_handleClickCloseButton({ target }) {
		this._handleUserOrTimerInitiatedClose(target);
	}
	/**
	* Handles user-initiated or through timer close request of this modal.
	*
	* @param triggeredBy The element that triggered this close request, if there is one.
	*/
	_handleUserOrTimerInitiatedClose(triggeredBy) {
		if (this.open) {
			const init = {
				bubbles: true,
				cancelable: true,
				composed: true,
				detail: { triggeredBy }
			};
			if (this.dispatchEvent(new CustomEvent(this.constructor.eventBeforeClose, init))) {
				this.open = false;
				this.dispatchEvent(new CustomEvent(this.constructor.eventClose, init));
			}
		}
	}
	/**
	* @returns The template part for the close button.
	*/
	_renderButton() {
		const { ariaLabel, _type: type, _handleClickCloseButton: handleClickCloseButton } = this;
		return html`
      <button
        type="button"
        class="${"cds-custom"}--${type}-notification__close-button"
        aria-label=${ifDefined(ariaLabel)}
        title=${ifDefined(ariaLabel)}
        @click="${handleClickCloseButton}">
        ${iconLoader(Close16, { class: `cds-custom--${type}-notification__close-icon` })}
      </button>
    `;
	}
	/**
	* @returns The template part for the text contents.
	*/
	_renderText() {
		const { subtitle, title, _type: type } = this;
		return html`
      <div class="${"cds-custom"}--${type}-notification__text-wrapper">
        <p class="${"cds-custom"}--${type}-notification__title">
          ${title}<slot name="title"></slot>
        </p>
        <div class="${"cds-custom"}--${type}-notification__subtitle">
          ${subtitle}<slot name="subtitle"></slot>
        </div>
        <slot></slot>
      </div>
    `;
	}
	/**
	* @returns The template part for the icon.
	*/
	_renderIcon() {
		const { statusIconDescription, kind, _type: type } = this;
		const IconComponent = iconNamesForKinds[kind];
		return !IconComponent ? void 0 : iconLoader(IconComponent, {
			class: `cds-custom--${type}-notification__icon`,
			"aria-label": statusIconDescription
		});
	}
	connectedCallback() {
		if (!this.hasAttribute("role")) this.setAttribute("role", "alert");
		super.connectedCallback();
	}
	updated(changedProperties) {
		const openChanged = changedProperties.has("open");
		const timeoutChanged = changedProperties.has("timeout");
		if (openChanged || timeoutChanged) {
			if (this.open && this.timeout) this._initializeTimeout(this.timeout);
			else if (!this.open && this._timeoutID) this._cancelTimeout(this._timeoutID);
		}
	}
	render() {
		const { _type: type } = this;
		return html`
      <div class="${"cds-custom"}--${type}-notification__details">
        ${this._renderIcon()}${this._renderText()}
      </div>
      ${this._renderButton()}
    `;
	}
	/**
	* The name of the custom event fired before this notification is being closed upon a user gesture.
	* Cancellation of this event stops the user-initiated action of closing this notification.
	*/
	static get eventBeforeClose() {
		return `cds-custom-notification-beingclosed`;
	}
	/**
	* The name of the custom event fired after this notification is closed upon a user gesture.
	*/
	static get eventClose() {
		return `cds-custom-notification-closed`;
	}
	static {
		this.styles = inline_notification_default$1;
	}
};
__decorate([property({ attribute: "aria-label" })], CDSInlineNotification.prototype, "ariaLabel", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "hide-close-button"
})], CDSInlineNotification.prototype, "hideCloseButton", void 0);
__decorate([property({ attribute: "status-icon-description" })], CDSInlineNotification.prototype, "statusIconDescription", void 0);
__decorate([property({ reflect: true })], CDSInlineNotification.prototype, "kind", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "low-contrast"
})], CDSInlineNotification.prototype, "lowContrast", void 0);
__decorate([property({
	type: Boolean,
	reflect: true
})], CDSInlineNotification.prototype, "open", void 0);
__decorate([property({
	type: Number,
	reflect: true
})], CDSInlineNotification.prototype, "timeout", void 0);
__decorate([property()], CDSInlineNotification.prototype, "subtitle", void 0);
__decorate([property()], CDSInlineNotification.prototype, "title", void 0);
CDSInlineNotification = __decorate([carbonElement(`cds-custom-inline-notification`)], CDSInlineNotification);
var inline_notification_default = CDSInlineNotification;
//#endregion
export { NOTIFICATION_KIND, NOTIFICATION_TYPE, inline_notification_default as default };

//# sourceMappingURL=inline-notification.js.map