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");
const require_slice_address = require("../../shared/tools/slice-address.cjs");
const require_cn = require("../../shared/tools/cn.cjs");
require("../../shared/tools/index.cjs");
const require_index$2 = require("../../shared/directives/custom-style-map/index.cjs");
require("../../shared/directives/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");
let viem = require("viem");
let lit_html = require("lit-html");
let web3_utils = require("web3-utils");
//#region src/components/lukso-username/index.ts
var LuksoUsername = class LuksoUsername extends require_index.TailwindStyledElement(require_style.default) {
	constructor(..._args) {
		super(..._args);
		this.name = "";
		this.address = "";
		this.size = "large";
		this.sliceBy = 8;
		this.addressColor = "";
		this.nameColor = "";
		this.customClass = "";
		this.hidePrefix = false;
		this.prefix = "@";
		this.noTransform = false;
		this.styles = (0, tailwind_variants.tv)({
			slots: {
				wrapper: "inline-flex w-full min-w-0",
				name: "inline-block whitespace-nowrap overflow-hidden text-ellipsis shrink min-w-0",
				address: "inline-block shrink-0",
				bytes: "inline-block shrink-0"
			},
			variants: {
				size: {
					"2x-small": { wrapper: "paragraph-ptmono-10-bold" },
					"x-small": { wrapper: "paragraph-ptmono-10-bold" },
					small: { wrapper: "paragraph-ptmono-12-bold" },
					medium: { wrapper: "paragraph-ptmono-14-bold" },
					large: { wrapper: "paragraph-ptmono-16-bold" },
					"x-large": { wrapper: "paragraph-ptmono-24-bold" },
					"2x-large": { wrapper: "paragraph-ptmono-24-bold" }
				},
				hasNameColor: { false: { name: "text-transparent bg-clip-text bg-gradient-to-r from-gradient-1-start to-gradient-1-end" } },
				hasAddressColor: { false: {
					address: "text-neutral-20",
					bytes: "text-neutral-60"
				} }
			}
		});
	}
	transformName(name) {
		if (this.noTransform) return name;
		return name?.toLowerCase();
	}
	transformAddress(address) {
		if (this.noTransform || !(0, viem.isAddress)(address)) return address;
		try {
			return (0, web3_utils.toChecksumAddress)(address);
		} catch (error) {
			console.warn(error);
			return address;
		}
	}
	addressBytesTemplate(styles) {
		const address = this.transformAddress(this.address);
		return lit.html`<div
      class=${styles}
      style=${require_index$2.customStyleMap({ [`color: var(--${this.addressColor})`]: this.addressColor !== "" })}
    >
      #${address.slice(2, 6)}
    </div>`;
	}
	nameTemplate(styles) {
		const name = this.transformName(this.name);
		return lit.html`<div
      class=${styles}
      style=${require_index$2.customStyleMap({ [`color: var(--${this.nameColor})`]: this.nameColor !== "" })}
    >
      ${this.hidePrefix ? lit_html.nothing : this.prefix}${name}
    </div>`;
	}
	addressTemplate(styles) {
		const address = this.transformAddress(this.address);
		return lit.html`<div
      class=${styles}
      style=${require_index$2.customStyleMap({ [`color: var(--${this.addressColor})`]: this.addressColor !== "" })}
    >
      ${require_slice_address.sliceAddress(address, this.sliceBy, this.sliceBy)}
    </div>`;
	}
	render() {
		const { wrapper, name, address, bytes } = this.styles({
			size: this.size,
			hasNameColor: this.nameColor !== "",
			hasAddressColor: this.addressColor !== ""
		});
		const template = (() => {
			if (this.name && this.address) return lit.html`${this.nameTemplate(name())}${this.addressBytesTemplate(bytes())}`;
			if (this.name) return this.nameTemplate(name());
			if (this.address) return this.addressTemplate(address());
		})();
		return lit.html`<div part="wrapper" class=${require_cn.cn(wrapper(), this.customClass)}>
      ${template}
    </div>`;
	}
};
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoUsername.prototype, "name", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoUsername.prototype, "address", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: "string" })], LuksoUsername.prototype, "size", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: Number,
	attribute: "slice-by"
})], LuksoUsername.prototype, "sliceBy", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: String,
	attribute: "address-color"
})], LuksoUsername.prototype, "addressColor", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: String,
	attribute: "name-color"
})], LuksoUsername.prototype, "nameColor", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: String,
	attribute: "custom-class"
})], LuksoUsername.prototype, "customClass", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: Boolean,
	attribute: "hide-prefix"
})], LuksoUsername.prototype, "hidePrefix", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({ type: String })], LuksoUsername.prototype, "prefix", void 0);
require_decorate.__decorate([(0, lit_decorators_js.property)({
	type: Boolean,
	attribute: "no-transform"
})], LuksoUsername.prototype, "noTransform", void 0);
LuksoUsername = require_decorate.__decorate([require_safe_custom_element.safeCustomElement("lukso-username")], LuksoUsername);
//#endregion
Object.defineProperty(exports, "LuksoUsername", {
	enumerable: true,
	get: function() {
		return LuksoUsername;
	}
});
