@oslokommune/punkt-elements/dist/heading-BxvE80bb.js

Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo

import { c as e, d as t, n, r, s as i } from "./element-cZ85T_aa.js";
//#region src/components/heading/heading.ts
var a = class extends n {
	constructor(...e) {
		super(...e), this.size = void 0, this.level = 2, this.weight = void 0, this.visuallyHidden = !1, this.align = void 0;
	}
	connectedCallback() {
		super.connectedCallback(), this.setAttribute("role", "heading"), this.setAttribute("aria-level", String(this.level)), this.updateHostClasses();
	}
	attributeChangedCallback(e, t, n) {
		super.attributeChangedCallback(e, t, n), e === "level" && n && this.setLevel(Number(n)), e === "visuallyHidden" && (this.visuallyHidden = n !== null && n !== "false"), (e === "size" || e === "visuallyHidden" || e === "align" || e === "weight") && this.updateHostClasses();
	}
	updated(e) {
		super.updated(e), e.has("level") && (this.setLevel(this.level), this.hasAttribute("size") || (this.size = this.defaultSizeForLevel), this.hasAttribute("weight") || (this.weight = this.defaultWeightForLevel)), !this.hasAttribute("size") && (e.has("level") || this.size === void 0) && (this.size = this.defaultSizeForLevel), (e.has("size") || e.has("visuallyHidden") || e.has("align") || e.has("weight")) && this.updateHostClasses();
	}
	setLevel(e) {
		e >= 1 && e <= 6 ? (this.level = e, this.setAttribute("aria-level", String(e))) : console.warn(`Invalid heading level: ${e}. Must be between 1 and 6.`);
	}
	get defaultSizeForLevel() {
		switch (this.level) {
			case 1: return "xlarge";
			case 2: return "large";
			case 3: return "medium";
			case 4: return "small";
			case 5: return "xsmall";
			case 6: return "xsmall";
			default: return "medium";
		}
	}
	get defaultWeightForLevel() {
		switch (this.level) {
			case 1: return "regular";
			case 2: return "regular";
			case 3: return "medium";
			case 4: return "medium";
			case 5: return "medium";
			case 6: return "medium";
			default: return "medium";
		}
	}
	updateHostClasses() {
		this.classList.remove("pkt-heading", "pkt-heading--xsmall", "pkt-heading--small", "pkt-heading--medium", "pkt-heading--large", "pkt-heading--xlarge", "pkt-sr-only", "pkt-heading--start", "pkt-heading--center", "pkt-heading--end", "pkt-heading--light", "pkt-heading--regular", "pkt-heading--medium", "pkt-heading--bold"), this.classList.add("pkt-heading"), this.size && this.classList.add(`pkt-heading--${this.size}`), this.weight && this.classList.add(`pkt-heading--fw-${this.weight}`), this.visuallyHidden && this.classList.add("pkt-sr-only"), this.align && this.classList.add(`pkt-heading--${this.align}`);
	}
	render() {
		return t`<slot></slot>`;
	}
};
r([i({
	type: String,
	reflect: !0
})], a.prototype, "size", void 0), r([i({
	type: Number,
	reflect: !0
})], a.prototype, "level", void 0), r([i({
	type: String,
	reflect: !0
})], a.prototype, "weight", void 0), r([i({
	type: Boolean,
	reflect: !0
})], a.prototype, "visuallyHidden", void 0), r([i({
	type: String,
	reflect: !0
})], a.prototype, "align", void 0);
try {
	e("pkt-heading")(a);
} catch {
	console.warn("Forsøker å definere <pkt-heading>, men den er allerede definert");
}
//#endregion
//#region src/components/heading/index.ts
var o = a;
//#endregion
export { a as n, o as t };