Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.cjs");
const require_safe_custom_element = require("../../shared/safe-custom-element.cjs");
const require_index = require("../../shared/tailwind-element/index.cjs");
const require_decorate = require("../../_virtual/_@oxc-project_runtime@0.127.0/helpers/decorate.cjs");
require("../lukso-icon/index.cjs");
require("../lukso-sanitize/index.cjs");
const require_style = require("./style.css?inline.cjs");
let lit = require("lit");
let lit_decorators_js = require("lit/decorators.js");
let tailwind_variants = require("tailwind-variants");
//#region src/components/lukso-alert/index.ts
var LuksoAlert = class LuksoAlert extends require_index.TailwindStyledElement(require_style.default) {
	constructor(..._args) {
		super(..._args);
		this.variant = "info";
		this.size = "medium";
		this.hasIcon = false;
		this.title = "";
		this.description = "";
		this.isFullWidth = false;
		this.styles = (0, tailwind_variants.tv)({
			slots: {
				container: "flex items-center",
				title: "",
				description: ""
			},
			variants: {
				variant: {
					info: { container: "bg-blue-95 text-blue-40" },
					warning: { container: "bg-honey-92 text-yellow-25" },
					error: { container: "bg-red-95 text-red-55" },
					success: { container: "bg-green-95 text-green-45" }
				},
				size: {
					medium: {
						container: "p-4 gap-3 rounded-8",
						title: "paragraph-inter-14-semi-bold",
						description: "paragraph-inter-12-regular"
					},
					large: {
						container: "p-5 gap-4 rounded-10",
						title: "paragraph-inter-16-semi-bold",
						description: "paragraph-inter-14-regular"
					}
				},
				isFullWidth: { true: { container: "w-full" } }
			}
		});
	}
	get icon() {
		switch (this.variant) {
			case "warning": return {
				name: "info-circle",
				color: "yellow-25"
			};
			case "error": return {
				name: "danger",
				color: "red-55"
			};
			case "success": return {
				name: "tick-circle",
				color: "green-45"
			};
			default: return {
				name: "info-circle",
				color: "blue-40"
			};
		}
	}
	render() {
		const { container, title, description } = this.styles({
			variant: this.variant,
			size: this.size,
			isFullWidth: this.isFullWidth
		});
		return lit.html`
      <div class=${container()}>
        ${this.hasIcon ? lit.html`<lukso-icon
              pack="vuesax"
              name="${this.icon.name}"
              color="${this.icon.color}"
            ></lukso-icon>` : lit.nothing}
        <div class="flex flex-col gap-1">
          ${this.title ? lit.html`<div class=${title()}>${this.title}</div>` : lit.nothing}
          ${this.description ? lit.html`<lukso-sanitize
                class=${description()}
                html-content="${this.description}"
              ></lukso-sanitize>` : lit.nothing}
        </div>
      </div>
    `;
	}
};
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoAlert.prototype, "variant", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoAlert.prototype, "size", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: Boolean,
	attribute: "has-icon",
	reflect: true
})], LuksoAlert.prototype, "hasIcon", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoAlert.prototype, "title", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoAlert.prototype, "description", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: Boolean,
	attribute: "is-full-width",
	reflect: true
})], LuksoAlert.prototype, "isFullWidth", void 0);
LuksoAlert = require_decorate.__decorate([require_safe_custom_element.safeCustomElement("lukso-alert")], LuksoAlert);
//#endregion
Object.defineProperty(exports, "LuksoAlert", {
	enumerable: true,
	get: function() {
		return LuksoAlert;
	}
});
