@oslokommune/punkt-elements 16.7.3 → 16.7.4

package/dist/tabs-Y7utmJi9.js

@@ -0,0 +1,318 @@
+import { c as e, d as t, o as n, r, s as i } from "./element-cZ85T_aa.js";
+import { n as a, t as o } from "./element-with-slot-4J2o3SeU.js";
+import { t as s } from "./if-defined-Cjj8qN-Z.js";
+import { n as c, t as l } from "./ref-RS8Uv6uC.js";
+//#region ../../node_modules/@lit/context/lib/context-request-event.js
+var u = class extends Event {
+	constructor(e, t, n, r) {
+		super("context-request", {
+			bubbles: !0,
+			composed: !0
+		}), this.context = e, this.contextTarget = t, this.callback = n, this.subscribe = r ?? !1;
+	}
+};
+//#endregion
+//#region ../../node_modules/@lit/context/lib/create-context.js
+function d(e) {
+	return e;
+}
+//#endregion
+//#region ../../node_modules/@lit/context/lib/controllers/context-consumer.js
+var f = class {
+	constructor(e, t, n, r) {
+		if (this.subscribe = !1, this.provided = !1, this.value = void 0, this.t = (e, t) => {
+			this.unsubscribe && (this.unsubscribe !== t && (this.provided = !1, this.unsubscribe()), this.subscribe || this.unsubscribe()), this.value = e, this.host.requestUpdate(), this.provided && !this.subscribe || (this.provided = !0, this.callback && this.callback(e, t)), this.unsubscribe = t;
+		}, this.host = e, t.context !== void 0) {
+			let e = t;
+			this.context = e.context, this.callback = e.callback, this.subscribe = e.subscribe ?? !1;
+		} else this.context = t, this.callback = n, this.subscribe = r ?? !1;
+		this.host.addController(this);
+	}
+	hostConnected() {
+		this.dispatchRequest();
+	}
+	hostDisconnected() {
+		this.unsubscribe &&= (this.unsubscribe(), void 0);
+	}
+	dispatchRequest() {
+		this.host.dispatchEvent(new u(this.context, this.host, this.t, this.subscribe));
+	}
+}, p = class {
+	get value() {
+		return this.o;
+	}
+	set value(e) {
+		this.setValue(e);
+	}
+	setValue(e, t = !1) {
+		let n = t || !Object.is(e, this.o);
+		this.o = e, n && this.updateObservers();
+	}
+	constructor(e) {
+		this.subscriptions = /* @__PURE__ */ new Map(), this.updateObservers = () => {
+			for (let [e, { disposer: t }] of this.subscriptions) e(this.o, t);
+		}, e !== void 0 && (this.value = e);
+	}
+	addCallback(e, t, n) {
+		if (!n) return void e(this.value);
+		this.subscriptions.has(e) || this.subscriptions.set(e, {
+			disposer: () => {
+				this.subscriptions.delete(e);
+			},
+			consumerHost: t
+		});
+		let { disposer: r } = this.subscriptions.get(e);
+		e(this.value, r);
+	}
+	clearCallbacks() {
+		this.subscriptions.clear();
+	}
+}, m = class extends Event {
+	constructor(e, t) {
+		super("context-provider", {
+			bubbles: !0,
+			composed: !0
+		}), this.context = e, this.contextTarget = t;
+	}
+}, h = class extends p {
+	constructor(e, t, n) {
+		super(t.context === void 0 ? n : t.initialValue), this.onContextRequest = (e) => {
+			if (e.context !== this.context) return;
+			let t = e.contextTarget ?? e.composedPath()[0];
+			t !== this.host && (e.stopPropagation(), this.addCallback(e.callback, t, e.subscribe));
+		}, this.onProviderRequest = (e) => {
+			if (e.context !== this.context || (e.contextTarget ?? e.composedPath()[0]) === this.host) return;
+			let t = /* @__PURE__ */ new Set();
+			for (let [e, { consumerHost: n }] of this.subscriptions) t.has(e) || (t.add(e), n.dispatchEvent(new u(this.context, n, e, !0)));
+			e.stopPropagation();
+		}, this.host = e, t.context === void 0 ? this.context = t : this.context = t.context, this.attachListeners(), this.host.addController?.(this);
+	}
+	attachListeners() {
+		this.host.addEventListener("context-request", this.onContextRequest), this.host.addEventListener("context-provider", this.onProviderRequest);
+	}
+	hostConnected() {
+		this.host.dispatchEvent(new m(this.context, this.host));
+	}
+};
+//#endregion
+//#region ../../node_modules/@lit/context/lib/decorators/provide.js
+function g({ context: e }) {
+	return (t, n) => {
+		let r = /* @__PURE__ */ new WeakMap();
+		if (typeof n == "object") return {
+			get() {
+				return t.get.call(this);
+			},
+			set(e) {
+				return r.get(this).setValue(e), t.set.call(this, e);
+			},
+			init(t) {
+				return r.set(this, new h(this, {
+					context: e,
+					initialValue: t
+				})), t;
+			}
+		};
+		{
+			t.constructor.addInitializer(((t) => {
+				r.set(t, new h(t, { context: e }));
+			}));
+			let i = Object.getOwnPropertyDescriptor(t, n), a;
+			if (i === void 0) {
+				let e = /* @__PURE__ */ new WeakMap();
+				a = {
+					get() {
+						return e.get(this);
+					},
+					set(t) {
+						r.get(this).setValue(t), e.set(this, t);
+					},
+					configurable: !0,
+					enumerable: !0
+				};
+			} else {
+				let e = i.set;
+				a = {
+					...i,
+					set(t) {
+						r.get(this).setValue(t), e?.call(this, t);
+					}
+				};
+			}
+			Object.defineProperty(t, n, a);
+			return;
+		}
+	};
+}
+//#endregion
+//#region ../../node_modules/@lit/context/lib/decorators/consume.js
+function _({ context: e, subscribe: t }) {
+	return (n, r) => {
+		typeof r == "object" ? r.addInitializer((function() {
+			new f(this, {
+				context: e,
+				callback: (e) => {
+					n.set.call(this, e);
+				},
+				subscribe: t
+			});
+		})) : n.constructor.addInitializer(((n) => {
+			new f(n, {
+				context: e,
+				callback: (e) => {
+					n[r] = e;
+				},
+				subscribe: t
+			});
+		}));
+	};
+}
+//#endregion
+//#region src/components/tabs/tabs-context.ts
+var v = d(Symbol("pkt-tabs-context")), y = class extends o {
+	constructor(...e) {
+		super(...e), this.arrowNav = !0, this.disableArrowNav = !1, this.tabRefs = [], this.tabCount = 0, this.context = {
+			useArrowNav: this.useArrowNav,
+			registerTab: this.registerTab.bind(this),
+			handleClick: this.handleClick.bind(this),
+			handleKeyUp: this.handleKeyUp.bind(this)
+		};
+	}
+	get useArrowNav() {
+		return this.arrowNav && !this.disableArrowNav;
+	}
+	updated(e) {
+		(e.has("arrowNav") || e.has("disableArrowNav")) && (this.context = {
+			...this.context,
+			useArrowNav: this.useArrowNav
+		});
+	}
+	registerTab(e, t) {
+		this.tabRefs[t] = e, this.tabCount = Math.max(this.tabCount, t + 1);
+	}
+	handleClick(e) {
+		this.dispatchEvent(new CustomEvent("tab-selected", {
+			detail: { index: e },
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	handleKeyUp(e, t) {
+		this.useArrowNav && (e.code === "ArrowLeft" && t !== 0 && this.tabRefs[t - 1]?.focus(), e.code === "ArrowRight" && t < this.tabCount - 1 && this.tabRefs[t + 1]?.focus(), (e.code === "ArrowDown" || e.code === "Space") && this.dispatchEvent(new CustomEvent("tab-selected", {
+			detail: { index: t },
+			bubbles: !0,
+			composed: !0
+		})));
+	}
+	render() {
+		return t`
+      <div class="pkt-tabs">
+        <div class="pkt-tabs__list" role=${this.useArrowNav ? "tablist" : "navigation"}>${a(this)}</div>
+      </div>
+    `;
+	}
+};
+r([i({
+	type: Boolean,
+	reflect: !0,
+	attribute: "arrow-nav"
+})], y.prototype, "arrowNav", void 0), r([i({
+	type: Boolean,
+	reflect: !0,
+	attribute: "disable-arrow-nav"
+})], y.prototype, "disableArrowNav", void 0), r([n()], y.prototype, "tabRefs", void 0), r([n()], y.prototype, "tabCount", void 0), r([g({ context: v }), n()], y.prototype, "context", void 0);
+try {
+	e("pkt-tabs")(y);
+} catch {
+	console.warn("Forsøker å definere <pkt-tabs>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/tabs/tabitem.ts
+var b = class extends o {
+	constructor() {
+		super(), this.active = !1, this.href = "", this.icon = "", this.controls = "", this.tag = "", this.tagSkin = "blue", this.index = 0, this.elementRef = l();
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.updateComplete.then(() => {
+			this.elementRef.value && this.context && this.context.registerTab(this.elementRef.value, this.index);
+		});
+	}
+	handleClick() {
+		this.context && this.context.handleClick(this.index);
+	}
+	handleKeyUp(e) {
+		this.context && this.context.handleKeyUp(e, this.index);
+	}
+	render() {
+		let e = this.context?.useArrowNav ?? !0, n = this.active ? "active" : "", r = e ? "tab" : void 0, i = e ? this.active : void 0, o = this.active || !e ? void 0 : -1, l = t`
+      ${this.icon ? t`<pkt-icon name=${this.icon} class="pkt-icon--small"></pkt-icon>` : ""}
+      <span>${a(this)}</span>
+      ${this.tag ? t`<pkt-tag skin=${this.tagSkin} size="small">${this.tag}</pkt-tag>` : ""}
+    `;
+		return this.href ? t`
+        <a
+          ${c(this.elementRef)}
+          href=${this.href}
+          class="pkt-tabs__link ${n}"
+          role=${s(r)}
+          aria-selected=${s(i)}
+          aria-controls=${s(this.controls || void 0)}
+          tabindex=${s(o)}
+          @click=${this.handleClick}
+          @keyup=${this.handleKeyUp}
+        >
+          ${l}
+        </a>
+      ` : t`
+      <button
+        ${c(this.elementRef)}
+        type="button"
+        class="pkt-tabs__button pkt-link-button ${n}"
+        role=${s(r)}
+        aria-selected=${s(i)}
+        aria-controls=${s(this.controls || void 0)}
+        tabindex=${s(o)}
+        @click=${this.handleClick}
+        @keyup=${this.handleKeyUp}
+      >
+        ${l}
+      </button>
+    `;
+	}
+};
+r([i({
+	type: Boolean,
+	reflect: !0
+})], b.prototype, "active", void 0), r([i({
+	type: String,
+	reflect: !0
+})], b.prototype, "href", void 0), r([i({
+	type: String,
+	reflect: !0
+})], b.prototype, "icon", void 0), r([i({
+	type: String,
+	reflect: !0
+})], b.prototype, "controls", void 0), r([i({
+	type: String,
+	reflect: !0
+})], b.prototype, "tag", void 0), r([i({
+	type: String,
+	reflect: !0,
+	attribute: "tag-skin"
+})], b.prototype, "tagSkin", void 0), r([i({
+	type: Number,
+	reflect: !0
+})], b.prototype, "index", void 0), r([_({
+	context: v,
+	subscribe: !0
+}), i({ attribute: !1 })], b.prototype, "context", void 0);
+try {
+	e("pkt-tab-item")(b);
+} catch {
+	console.warn("Forsøker å definere <pkt-tab-item>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/tabs/index.ts
+var x = y;
+//#endregion
+export { b as n, y as r, x as t };

package/dist/tag-DLthw5b4.cjs

@@ -0,0 +1,27 @@
+const e=require(`./element-DjtxO-1r.cjs`),t=require(`./class-map-CJ-msbHs.cjs`),n=require(`./element-with-slot-CWoTGA1B.cjs`);require(`./icon-Dr8sfT2X.cjs`);const r=require(`./if-defined-XKOD_t_V.cjs`);var i={name:`pkt-tag`,react:`PktTag`,"css-class":`pkt-tag`,isElement:!0,"dark-mode":!0,props:{size:{name:`Størrelse`,description:`Størrelsen på taggen`,required:!1,default:`medium`,type:[`small`,`medium`,`large`],category:`ui`},iconName:{name:`Ikon`,description:`Navnet på ikonet som skal vises i taggen`,type:`icon`,required:!1,category:`ui`},skin:{name:`Utseende`,description:`Utseendet til taggen`,required:!1,default:`blue`,type:[`blue`,`blue-light`,`blue-dark`,`green`,`red`,`beige`,`yellow`,`gray`],category:`ui`},closeTag:{name:`Lukk tag`,description:`Skal taggen ha en lukkeknapp?`,type:`boolean`,required:!1,default:!1,category:`ui`},textStyle:{name:`Tekststil`,description:`Stilen på teksten i taggen`,required:!1,default:`normal-text`,type:[`thin-text`,`normal-text`],category:`ui`},type:{name:`Type, dersom lukkeknapp`,description:`Type tag, brukes for å spesifisere om det er en knapp, submit eller reset`,required:!1,default:`button`,type:[`button`,`submit`,`reset`],category:`tech`},ariaLabel:{name:`aria-label`,description:`aria-label for taggen, brukes for tilgjengelighet`,type:`string`,required:!1,category:`accessibility`}},slots:{default:{description:`Teksten til tag`}}},a=class extends n.t{constructor(){super(),this.closeTag=i.props.closeTag.default,this.size=i.props.size.default,this.skin=i.props.skin.default,this.textStyle=null,this.iconName=void 0,this.type=i.props.type.default,this.ariaLabel=null,this.buttonTabindex=void 0,this._isClosed=!1,this._ariaDescription=null,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent(`close`,{detail:{origin:e},bubbles:!1,composed:!0})),this.dispatchEvent(new CustomEvent(`on-close`,{detail:{origin:e},bubbles:!1,composed:!0}))},this._isClosed=!1}firstUpdated(e){if(super.firstUpdated(e),this.closeTag&&!this.ariaLabel){let e=this.querySelector(`button span, .pkt-tag > span`)?.textContent?.trim();e&&(this._ariaDescription=`Klikk for å fjerne ${e}`)}}render(){let i={"pkt-tag":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.textStyle}`]:!!this.textStyle},a={"pkt-tag":!0,"pkt-btn":!0,"pkt-btn--tertiary":!0,[`pkt-tag--${this.textStyle}`]:!!this.textStyle,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,"pkt-btn--icons-right-and-left":this.closeTag&&!!this.iconName,"pkt-hide":this._isClosed};return this.closeTag?e.d`
+        <button
+          class=${t.t(a)}
+          type=${this.type}
+          tabindex=${r.t(this.buttonTabindex)}
+          @click=${this.close}
+          aria-label=${r.t(this.ariaLabel||void 0)}
+          aria-description=${r.t(this._ariaDescription||void 0)}
+        >
+          ${this.iconName&&e.d`<pkt-icon
+            class="pkt-tag__icon"
+            name=${this.iconName}
+            aria-hidden="true"
+          ></pkt-icon>`}
+          <span>${n.n(this)}</span>
+          <pkt-icon class="pkt-tag__close-btn" name="close"></pkt-icon>
+        </button>
+      `:e.d`
+        <span class=${t.t(i)}>
+          ${this.iconName&&e.d`<pkt-icon
+            class="pkt-tag__icon"
+            name=${this.iconName}
+            aria-hidden="true"
+          ></pkt-icon>`}
+          <span>${n.n(this)}</span>
+        </span>
+      `}};e.r([e.s({type:Boolean,reflect:!0})],a.prototype,`closeTag`,void 0),e.r([e.s({type:String,reflect:!0})],a.prototype,`size`,void 0),e.r([e.s({type:String,reflect:!0})],a.prototype,`skin`,void 0),e.r([e.s({type:String,reflect:!0})],a.prototype,`textStyle`,void 0),e.r([e.s({type:String,reflect:!0})],a.prototype,`iconName`,void 0),e.r([e.s({type:String})],a.prototype,`type`,void 0),e.r([e.s({type:String})],a.prototype,`ariaLabel`,void 0),e.r([e.s({type:Number,attribute:`button-tabindex`})],a.prototype,`buttonTabindex`,void 0),e.r([e.o()],a.prototype,`_isClosed`,void 0),e.r([e.o()],a.prototype,`_ariaDescription`,void 0);try{e.c(`pkt-tag`)(a)}catch{console.warn(`Forsøker å definere <pkt-tag>, men den er allerede definert`)}var o=a;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return o}});

package/dist/tag-VwykmuQR.js

@@ -0,0 +1,179 @@
+import { c as e, d as t, o as n, r, s as i } from "./element-cZ85T_aa.js";
+import { t as a } from "./class-map-C8HuhNzZ.js";
+import { n as o, t as s } from "./element-with-slot-4J2o3SeU.js";
+import "./icon-Co72KtgF.js";
+import { t as c } from "./if-defined-Cjj8qN-Z.js";
+var l = {
+	name: "pkt-tag",
+	react: "PktTag",
+	"css-class": "pkt-tag",
+	isElement: !0,
+	"dark-mode": !0,
+	props: {
+		size: {
+			name: "Størrelse",
+			description: "Størrelsen på taggen",
+			required: !1,
+			default: "medium",
+			type: [
+				"small",
+				"medium",
+				"large"
+			],
+			category: "ui"
+		},
+		iconName: {
+			name: "Ikon",
+			description: "Navnet på ikonet som skal vises i taggen",
+			type: "icon",
+			required: !1,
+			category: "ui"
+		},
+		skin: {
+			name: "Utseende",
+			description: "Utseendet til taggen",
+			required: !1,
+			default: "blue",
+			type: [
+				"blue",
+				"blue-light",
+				"blue-dark",
+				"green",
+				"red",
+				"beige",
+				"yellow",
+				"gray"
+			],
+			category: "ui"
+		},
+		closeTag: {
+			name: "Lukk tag",
+			description: "Skal taggen ha en lukkeknapp?",
+			type: "boolean",
+			required: !1,
+			default: !1,
+			category: "ui"
+		},
+		textStyle: {
+			name: "Tekststil",
+			description: "Stilen på teksten i taggen",
+			required: !1,
+			default: "normal-text",
+			type: ["thin-text", "normal-text"],
+			category: "ui"
+		},
+		type: {
+			name: "Type, dersom lukkeknapp",
+			description: "Type tag, brukes for å spesifisere om det er en knapp, submit eller reset",
+			required: !1,
+			default: "button",
+			type: [
+				"button",
+				"submit",
+				"reset"
+			],
+			category: "tech"
+		},
+		ariaLabel: {
+			name: "aria-label",
+			description: "aria-label for taggen, brukes for tilgjengelighet",
+			type: "string",
+			required: !1,
+			category: "accessibility"
+		}
+	},
+	slots: { default: { description: "Teksten til tag" } }
+}, u = class extends s {
+	constructor() {
+		super(), this.closeTag = l.props.closeTag.default, this.size = l.props.size.default, this.skin = l.props.skin.default, this.textStyle = null, this.iconName = void 0, this.type = l.props.type.default, this.ariaLabel = null, this.buttonTabindex = void 0, this._isClosed = !1, this._ariaDescription = null, this.close = (e) => {
+			this._isClosed = !0, this.dispatchEvent(new CustomEvent("close", {
+				detail: { origin: e },
+				bubbles: !1,
+				composed: !0
+			})), this.dispatchEvent(new CustomEvent("on-close", {
+				detail: { origin: e },
+				bubbles: !1,
+				composed: !0
+			}));
+		}, this._isClosed = !1;
+	}
+	firstUpdated(e) {
+		if (super.firstUpdated(e), this.closeTag && !this.ariaLabel) {
+			let e = this.querySelector("button span, .pkt-tag > span")?.textContent?.trim();
+			e && (this._ariaDescription = `Klikk for å fjerne ${e}`);
+		}
+	}
+	render() {
+		let e = {
+			"pkt-tag": !0,
+			[`pkt-tag--${this.size}`]: !!this.size,
+			[`pkt-tag--${this.skin}`]: !!this.skin,
+			[`pkt-tag--${this.textStyle}`]: !!this.textStyle
+		}, n = {
+			"pkt-tag": !0,
+			"pkt-btn": !0,
+			"pkt-btn--tertiary": !0,
+			[`pkt-tag--${this.textStyle}`]: !!this.textStyle,
+			[`pkt-tag--${this.size}`]: !!this.size,
+			[`pkt-tag--${this.skin}`]: !!this.skin,
+			"pkt-btn--icons-right-and-left": this.closeTag && !!this.iconName,
+			"pkt-hide": this._isClosed
+		};
+		return this.closeTag ? t`
+        <button
+          class=${a(n)}
+          type=${this.type}
+          tabindex=${c(this.buttonTabindex)}
+          @click=${this.close}
+          aria-label=${c(this.ariaLabel || void 0)}
+          aria-description=${c(this._ariaDescription || void 0)}
+        >
+          ${this.iconName && t`<pkt-icon
+            class="pkt-tag__icon"
+            name=${this.iconName}
+            aria-hidden="true"
+          ></pkt-icon>`}
+          <span>${o(this)}</span>
+          <pkt-icon class="pkt-tag__close-btn" name="close"></pkt-icon>
+        </button>
+      ` : t`
+        <span class=${a(e)}>
+          ${this.iconName && t`<pkt-icon
+            class="pkt-tag__icon"
+            name=${this.iconName}
+            aria-hidden="true"
+          ></pkt-icon>`}
+          <span>${o(this)}</span>
+        </span>
+      `;
+	}
+};
+r([i({
+	type: Boolean,
+	reflect: !0
+})], u.prototype, "closeTag", void 0), r([i({
+	type: String,
+	reflect: !0
+})], u.prototype, "size", void 0), r([i({
+	type: String,
+	reflect: !0
+})], u.prototype, "skin", void 0), r([i({
+	type: String,
+	reflect: !0
+})], u.prototype, "textStyle", void 0), r([i({
+	type: String,
+	reflect: !0
+})], u.prototype, "iconName", void 0), r([i({ type: String })], u.prototype, "type", void 0), r([i({ type: String })], u.prototype, "ariaLabel", void 0), r([i({
+	type: Number,
+	attribute: "button-tabindex"
+})], u.prototype, "buttonTabindex", void 0), r([n()], u.prototype, "_isClosed", void 0), r([n()], u.prototype, "_ariaDescription", void 0);
+try {
+	e("pkt-tag")(u);
+} catch {
+	console.warn("Forsøker å definere <pkt-tag>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/tag/index.ts
+var d = u;
+//#endregion
+export { u as n, d as t };

package/dist/textarea-D7aGOyDf.cjs

@@ -0,0 +1,46 @@
+const e=require(`./element-DjtxO-1r.cjs`),t=require(`./directive-CJ2giQBZ.cjs`),n=require(`./class-map-CJ-msbHs.cjs`),r=require(`./directive-helpers-D1QSxY17.cjs`),i=require(`./element-with-slot-CWoTGA1B.cjs`);require(`./icon-Dr8sfT2X.cjs`);const a=require(`./if-defined-XKOD_t_V.cjs`),o=require(`./ref-BaJ0mBT_.cjs`),s=require(`./input-element-B1yxcfz4.cjs`);require(`./input-wrapper-BRuVELpK.cjs`);var c=t.t(class extends t.n{constructor(e){if(super(e),e.type!==t.r.PROPERTY&&e.type!==t.r.ATTRIBUTE&&e.type!==t.r.BOOLEAN_ATTRIBUTE)throw Error("The `live` directive is not allowed on child or event bindings");if(!r.i(e))throw Error("`live` bindings can only contain a single expression")}render(e){return e}update(n,[i]){if(i===e.u||i===e.l)return i;let a=n.element,o=n.name;if(n.type===t.r.PROPERTY){if(i===a[o])return e.u}else if(n.type===t.r.BOOLEAN_ATTRIBUTE){if(!!i===a.hasAttribute(o))return e.u}else if(n.type===t.r.ATTRIBUTE&&a.getAttribute(o)===i+``)return e.u;return r.r(n),i}}),l=class extends s.t{constructor(...e){super(...e),this.inputRef=o.t(),this.value=``,this.autocomplete=`off`,this.rows=null,this.counterCurrent=0}attributeChangedCallback(e,t,n){e===`value`&&this.value!==t&&(this.counterCurrent=n?n.length:0,this.valueChanged(n,t)),super.attributeChangedCallback(e,t,n)}updated(e){super.updated(e),e.has(`value`)&&(this.counterCurrent=this.value?.length||0,this.valueChanged(this.value,e.get(`value`))),e.has(`id`)&&!this.name&&this.id&&(this.name=this.id)}render(){let t=n.t({"pkt-input":!0,"pkt-input--fullwidth":this.fullwidth,"pkt-input--counter-error":this.counter&&this.counterMaxLength&&this.value.length&&this.value.length>this.counterMaxLength}),r=this.ariaLabelledby||`${this.id}-input-label`;return e.d`<pkt-input-wrapper
+      label=${this.label}
+      ?counter=${this.counter}
+      ?disabled=${this.disabled}
+      ?hasError=${this.hasError}
+      ?inline=${this.inline}
+      ?optionalTag=${this.optionalTag}
+      ?required=${this.required}
+      ?requiredTag=${this.requiredTag}
+      useWrapper=${this.useWrapper}
+      .ariaDescribedBy=${this.ariaDescribedBy}
+      .counterCurrent=${this.counterCurrent}
+      .counterMaxLength=${this.counterMaxLength}
+      .errorMessage=${this.errorMessage}
+      .forId="${this.id+`-input`}"
+      .helptext=${this.helptext}
+      .helptextDropdown=${this.helptextDropdown}
+      .helptextDropdownButton=${this.helptextDropdownButton}
+      .optionalText=${this.optionalText}
+      .requiredText=${this.requiredText}
+      .tagText=${this.tagText}
+      class="pkt-textarea"
+    >
+      <div class="pkt-contents" slot="helptext">${i.n(this,`helptext`)}</div>
+      <textarea
+        ${o.n(this.inputRef)}
+        class=${t}
+        id=${this.id+`-input`}
+        name=${(this.name||this.id)+`-input`}
+        placeholder=${a.t(this.placeholder)}
+        .value=${c(this.value)}
+        minlength=${a.t(this.minlength)}
+        maxlength=${a.t(this.maxlength)}
+        ?readonly=${this.readonly}
+        autocomplete=${this.autocomplete}
+        aria-labelledby=${r}
+        aria-invalid=${this.hasError}
+        aria-errormessage=${`${this.id}-error`}
+        rows=${this.rows}
+        ?disabled=${this.disabled}
+        @input=${e=>{this.value=e.target.value,this.onInput(),e.stopImmediatePropagation()}}
+        @change=${e=>{e.stopImmediatePropagation()}}
+        @focus=${e=>{this.onFocus(),e.stopImmediatePropagation()}}
+        @blur=${e=>{this.value=e.target.value,this.onBlur(),e.stopImmediatePropagation()}}
+      ></textarea>
+    </pkt-input-wrapper>`}};e.r([e.s({type:String,reflect:!0})],l.prototype,`value`,void 0),e.r([e.s({type:String})],l.prototype,`autocomplete`,void 0),e.r([e.s({type:Number})],l.prototype,`rows`,void 0),e.r([e.o()],l.prototype,`counterCurrent`,void 0);try{e.c(`pkt-textarea`)(l)}catch{console.warn(`Forsøker å definere <pkt-textarea>, men den er allerede definert`)}var u=l;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return u}});

package/dist/textarea-DYOBhJrN.js

@@ -0,0 +1,115 @@
+import { c as e, d as t, l as n, o as r, r as i, s as a, u as o } from "./element-cZ85T_aa.js";
+import { n as s, r as c, t as l } from "./directive-3THFsVew.js";
+import { t as u } from "./class-map-C8HuhNzZ.js";
+import { i as d, r as f } from "./directive-helpers-Dkv2gKgs.js";
+import { n as p } from "./element-with-slot-4J2o3SeU.js";
+import "./icon-Co72KtgF.js";
+import { t as m } from "./if-defined-Cjj8qN-Z.js";
+import { n as h, t as g } from "./ref-RS8Uv6uC.js";
+import { t as _ } from "./input-element-Bw1s6NlF.js";
+import "./input-wrapper-YfTmpSSY.js";
+//#region ../../node_modules/lit-html/directives/live.js
+var v = l(class extends s {
+	constructor(e) {
+		if (super(e), e.type !== c.PROPERTY && e.type !== c.ATTRIBUTE && e.type !== c.BOOLEAN_ATTRIBUTE) throw Error("The `live` directive is not allowed on child or event bindings");
+		if (!d(e)) throw Error("`live` bindings can only contain a single expression");
+	}
+	render(e) {
+		return e;
+	}
+	update(e, [t]) {
+		if (t === o || t === n) return t;
+		let r = e.element, i = e.name;
+		if (e.type === c.PROPERTY) {
+			if (t === r[i]) return o;
+		} else if (e.type === c.BOOLEAN_ATTRIBUTE) {
+			if (!!t === r.hasAttribute(i)) return o;
+		} else if (e.type === c.ATTRIBUTE && r.getAttribute(i) === t + "") return o;
+		return f(e), t;
+	}
+}), y = class extends _ {
+	constructor(...e) {
+		super(...e), this.inputRef = g(), this.value = "", this.autocomplete = "off", this.rows = null, this.counterCurrent = 0;
+	}
+	attributeChangedCallback(e, t, n) {
+		e === "value" && this.value !== t && (this.counterCurrent = n ? n.length : 0, this.valueChanged(n, t)), super.attributeChangedCallback(e, t, n);
+	}
+	updated(e) {
+		super.updated(e), e.has("value") && (this.counterCurrent = this.value?.length || 0, this.valueChanged(this.value, e.get("value"))), e.has("id") && !this.name && this.id && (this.name = this.id);
+	}
+	render() {
+		let e = u({
+			"pkt-input": !0,
+			"pkt-input--fullwidth": this.fullwidth,
+			"pkt-input--counter-error": this.counter && this.counterMaxLength && this.value.length && this.value.length > this.counterMaxLength
+		}), n = this.ariaLabelledby || `${this.id}-input-label`;
+		return t`<pkt-input-wrapper
+      label=${this.label}
+      ?counter=${this.counter}
+      ?disabled=${this.disabled}
+      ?hasError=${this.hasError}
+      ?inline=${this.inline}
+      ?optionalTag=${this.optionalTag}
+      ?required=${this.required}
+      ?requiredTag=${this.requiredTag}
+      useWrapper=${this.useWrapper}
+      .ariaDescribedBy=${this.ariaDescribedBy}
+      .counterCurrent=${this.counterCurrent}
+      .counterMaxLength=${this.counterMaxLength}
+      .errorMessage=${this.errorMessage}
+      .forId="${this.id + "-input"}"
+      .helptext=${this.helptext}
+      .helptextDropdown=${this.helptextDropdown}
+      .helptextDropdownButton=${this.helptextDropdownButton}
+      .optionalText=${this.optionalText}
+      .requiredText=${this.requiredText}
+      .tagText=${this.tagText}
+      class="pkt-textarea"
+    >
+      <div class="pkt-contents" slot="helptext">${p(this, "helptext")}</div>
+      <textarea
+        ${h(this.inputRef)}
+        class=${e}
+        id=${this.id + "-input"}
+        name=${(this.name || this.id) + "-input"}
+        placeholder=${m(this.placeholder)}
+        .value=${v(this.value)}
+        minlength=${m(this.minlength)}
+        maxlength=${m(this.maxlength)}
+        ?readonly=${this.readonly}
+        autocomplete=${this.autocomplete}
+        aria-labelledby=${n}
+        aria-invalid=${this.hasError}
+        aria-errormessage=${`${this.id}-error`}
+        rows=${this.rows}
+        ?disabled=${this.disabled}
+        @input=${(e) => {
+			this.value = e.target.value, this.onInput(), e.stopImmediatePropagation();
+		}}
+        @change=${(e) => {
+			e.stopImmediatePropagation();
+		}}
+        @focus=${(e) => {
+			this.onFocus(), e.stopImmediatePropagation();
+		}}
+        @blur=${(e) => {
+			this.value = e.target.value, this.onBlur(), e.stopImmediatePropagation();
+		}}
+      ></textarea>
+    </pkt-input-wrapper>`;
+	}
+};
+i([a({
+	type: String,
+	reflect: !0
+})], y.prototype, "value", void 0), i([a({ type: String })], y.prototype, "autocomplete", void 0), i([a({ type: Number })], y.prototype, "rows", void 0), i([r()], y.prototype, "counterCurrent", void 0);
+try {
+	e("pkt-textarea")(y);
+} catch {
+	console.warn("Forsøker å definere <pkt-textarea>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/textarea/index.ts
+var b = y;
+//#endregion
+export { y as n, b as t };