@oslokommune/punkt-elements 16.7.0 → 16.7.3

package/dist/pkt-timepicker.js

@@ -1,34 +1,34 @@
-import { s as c, b as u, A as o, n as b, t as w } from "./element-CPpT3rFQ.js";
+import { t as I, s as c, b as u, A as p, n as b } from "./element-CPpT3rFQ.js";
 import { r as v } from "./state-C_1EOo3D.js";
 import { e as m, n as _ } from "./ref-Bg_Swj5w.js";
 import { o as k } from "./if-defined-B0krMLad.js";
-import { e as x } from "./class-map-CEnykyO_.js";
-import { P as I } from "./input-element-8nLwuQS4.js";
-import { s as F } from "./element-with-slot-Dqk6-TRR.js";
-import "./icon-BlKA8YuW.js";
-import "./input-wrapper-B2JpK016.js";
-const A = (t) => /^\d{2}:\d{2}$/.test(t) && parseInt(t.slice(0, 2), 10) <= 23 && parseInt(t.slice(3), 10) <= 59, f = (t) => {
-  const [e, s] = t.split(":").map(Number);
-  return e * 60 + s;
-}, g = (t) => t ? Math.max(1, Math.round(t / 60)) : 1, C = (t, e) => {
-  const s = t ? parseInt(String(t).split(":")[0], 10) : 0, i = e ? parseInt(String(e).split(":")[0], 10) : 23;
-  return Array.from({ length: i - s + 1 }, (n, r) => r + s);
-}, O = (t) => {
-  const e = g(t);
-  return Array.from({ length: Math.floor(60 / e) }, (s, i) => i * e);
-}, T = (t, e, s, i) => {
-  let a = t !== "" ? parseInt(t, 10) : s === 1 ? 0 : 23, p = e !== "" ? parseInt(e, 10) : s === 1 ? 0 : Math.floor(59 / i) * i;
-  return p += s * i, p > 59 ? (p = 0, a = (a + 1) % 24) : p < 0 && (p = Math.floor(59 / i) * i, a = (a - 1 + 24) % 24), {
-    hours: String(a).padStart(2, "0"),
-    minutes: String(p).padStart(2, "0")
+import { e as F } from "./class-map-CEnykyO_.js";
+import { P as A } from "./input-element-8nLwuQS4.js";
+import { s as C } from "./element-with-slot-Dqk6-TRR.js";
+import "./icon-CxQcIa5F.js";
+import "./input-wrapper-Bs4CRNst.js";
+const O = (a) => /^\d{2}:\d{2}$/.test(a) && parseInt(a.slice(0, 2), 10) <= 23 && parseInt(a.slice(3), 10) <= 59, f = (a) => {
+  const [t, e] = a.split(":").map(Number);
+  return t * 60 + e;
+}, g = (a) => a ? Math.max(1, Math.round(a / 60)) : 1, T = (a, t) => {
+  const e = a ? parseInt(String(a).split(":")[0], 10) : 0, s = t ? parseInt(String(t).split(":")[0], 10) : 23;
+  return Array.from({ length: s - e + 1 }, (i, n) => n + e);
+}, M = (a) => {
+  const t = g(a);
+  return Array.from({ length: Math.floor(60 / t) }, (e, s) => s * t);
+}, V = (a, t, e, s) => {
+  let r = a !== "" ? parseInt(a, 10) : e === 1 ? 0 : 23, o = t !== "" ? parseInt(t, 10) : e === 1 ? 0 : Math.floor(59 / s) * s;
+  return o += e * s, o > 59 ? (o = 0, r = (r + 1) % 24) : o < 0 && (o = Math.floor(59 / s) * s, r = (r - 1 + 24) % 24), {
+    hours: String(r).padStart(2, "0"),
+    minutes: String(o).padStart(2, "0")
   };
 };
-var M = Object.defineProperty, V = Object.getOwnPropertyDescriptor, l = (t, e, s, i) => {
-  for (var n = i > 1 ? void 0 : i ? V(e, s) : e, r = t.length - 1, a; r >= 0; r--)
-    (a = t[r]) && (n = (i ? a(e, s, n) : a(n)) || n);
-  return i && n && M(e, s, n), n;
+var P = Object.defineProperty, d = (a, t, e, s) => {
+  for (var i = void 0, n = a.length - 1, r; n >= 0; n--)
+    (r = a[n]) && (i = r(t, e, i) || i);
+  return i && P(t, e, i), i;
 };
-let h = class extends I {
+class l extends A {
   constructor() {
     super(...arguments), this.hiddenInputRef = m(), this.hoursInputRef = m(), this.minutesInputRef = m(), this.buttonRef = m(), this.value = "", this.hidePicker = !1, this.stepArrows = !1, this._hours = "", this._minutes = "", this._isOpen = !1, this._hoursDigitCount = 0, this._hoursFirstDigit = -1, this._minutesDigitCount = 0, this._minutesFirstDigit = -1, this._hasFocus = !1, this._outsideClickHandler = (t) => {
       this.contains(t.target) || this._closePopup();
@@ -74,8 +74,8 @@ let h = class extends I {
             if (this._hoursDigitCount === 0)
               this._hoursFirstDigit = r, this._hours = String(r).padStart(2, "0"), this._hoursDigitCount = 1, this.onInput(), r >= 3 && (this._hoursFirstDigit = -1, this._hoursDigitCount = 0, this._syncValueFromDisplay(), (i = this.minutesInputRef.value) == null || i.focus());
             else {
-              const a = this._hoursFirstDigit * 10 + r;
-              this._hours = a <= 23 ? String(a).padStart(2, "0") : String(r).padStart(2, "0"), this._hoursFirstDigit = -1, this._hoursDigitCount = 0, this._syncValueFromDisplay(), this.onInput(), (n = this.minutesInputRef.value) == null || n.focus();
+              const o = this._hoursFirstDigit * 10 + r;
+              this._hours = o <= 23 ? String(o).padStart(2, "0") : String(r).padStart(2, "0"), this._hoursFirstDigit = -1, this._hoursDigitCount = 0, this._syncValueFromDisplay(), this.onInput(), (n = this.minutesInputRef.value) == null || n.focus();
             }
           } else
             t.preventDefault();
@@ -129,7 +129,7 @@ let h = class extends I {
     }, this._handleMinutesBlur = () => {
       this._minutes !== "" && (this._minutes = String(parseInt(this._minutes, 10)).padStart(2, "0")), this._minutesDigitCount = 0, this._minutesFirstDigit = -1, this._syncValueFromDisplay();
     }, this._handlePopupKeydown = (t) => {
-      var a;
+      var o;
       const e = document.activeElement, s = e.closest(".pkt-timepicker-popup__col");
       if (!s) return;
       const i = Array.from(s.querySelectorAll(".pkt-timepicker-popup__option")), n = i.indexOf(e), r = e.dataset.type ?? "";
@@ -161,7 +161,7 @@ let h = class extends I {
           t.preventDefault(), e.click();
           break;
         case "Escape":
-          t.preventDefault(), this._closePopup(), (a = this.buttonRef.value) == null || a.focus();
+          t.preventDefault(), this._closePopup(), (o = this.buttonRef.value) == null || o.focus();
           break;
       }
     };
@@ -245,7 +245,7 @@ let h = class extends I {
     return t === 3600 || t < 3600 && 3600 % t === 0 && t % 60 === 0;
   }
   _syncDisplayFromValue() {
-    const t = A(this.value) ? this.value.split(":") : null;
+    const t = O(this.value) ? this.value.split(":") : null;
     t ? (this._hours = t[0], this._minutes = t[1]) : (this._hours = "", this._minutes = "");
   }
   _syncValueFromDisplay() {
@@ -258,10 +258,10 @@ let h = class extends I {
     return g(this.step);
   }
   get _hourOptions() {
-    return C(this.min, this.max);
+    return T(this.min, this.max);
   }
   get _minuteOptions() {
-    return O(this.step);
+    return M(this.step);
   }
   _openPopup() {
     this._isOpen = !0, this.updateComplete.then(() => {
@@ -282,7 +282,7 @@ let h = class extends I {
     });
   }
   _focusSelectedOrFirst(t) {
-    var a;
+    var o;
     const e = this.querySelector(".pkt-timepicker-popup");
     if (!e) return;
     const s = e.querySelectorAll(".pkt-timepicker-popup__col"), i = t === "hour" ? s[0] : s[1];
@@ -290,7 +290,7 @@ let h = class extends I {
     const n = i.querySelector(
       ".pkt-timepicker-popup__option--selected"
     ), r = i.querySelector(".pkt-timepicker-popup__option");
-    (a = n || r) == null || a.focus();
+    (o = n || r) == null || o.focus();
   }
   _handleOptionClick(t, e) {
     var i;
@@ -303,14 +303,14 @@ let h = class extends I {
     e === "hour" ? this._hours = String(s).padStart(2, "0") : this._minutes = String(s).padStart(2, "0"), t.focus();
   }
   _stepTime(t) {
-    const e = T(this._hours, this._minutes, t, this._minuteStep);
+    const e = V(this._hours, this._minutes, t, this._minuteStep);
     this._hours = e.hours, this._minutes = e.minutes, this._syncValueFromDisplay();
   }
   _renderOption(t, e) {
     const s = String(t).padStart(2, "0"), i = e === "hour" ? this._hours !== "" ? parseInt(this._hours, 10) : NaN : this._minutes !== "" ? parseInt(this._minutes, 10) : NaN, n = t === i;
     return u`
       <button
-        class=${x({
+        class=${F({
       "pkt-btn": !0,
       "pkt-btn--tertiary": !0,
       "pkt-btn--small": !0,
@@ -367,24 +367,30 @@ let h = class extends I {
     `;
   }
   _renderContainer() {
-    var n, r, a, p, $, y, S, D;
+    var n, r, o, $, y, S, D, w;
     const t = ((n = this.strings.timepicker) == null ? void 0 : n.hours) ?? "Timer", e = ((r = this.strings.timepicker) == null ? void 0 : r.minutes) ?? "Minutter", s = this.label ? `${t}, ${this.label}` : t, i = this.label ? `${e}, ${this.label}` : e;
     return u`
-      <div class="pkt-input__container">
+      <div
+        class="pkt-input__container"
+        @click=${(h) => {
+      var x;
+      h.target.closest("button, input") || (x = this.hoursInputRef.value) == null || x.focus();
+    }}
+      >
         ${this.stepArrows ? u`
               <button
                 class="pkt-input-icon pkt-btn pkt-btn--icon-only pkt-btn--tertiary pkt-timepicker__button pkt-timepicker__button--prev"
                 type="button"
-                aria-label=${((a = this.strings.timepicker) == null ? void 0 : a.prevTime) ?? "Forrige tidspunkt"}
+                aria-label=${((o = this.strings.timepicker) == null ? void 0 : o.prevTime) ?? "Forrige tidspunkt"}
                 ?disabled=${this.disabled}
                 @click=${() => this._stepTime(-1)}
               >
                 <pkt-icon name="chevron-thin-left"></pkt-icon>
                 <span class="pkt-btn__text"
-                  >${((p = this.strings.timepicker) == null ? void 0 : p.prevTime) ?? "Forrige tidspunkt"}</span
+                  >${(($ = this.strings.timepicker) == null ? void 0 : $.prevTime) ?? "Forrige tidspunkt"}</span
                 >
               </button>
-            ` : o}
+            ` : p}
         <input
           ${_(this.hoursInputRef)}
           type="text"
@@ -399,17 +405,17 @@ let h = class extends I {
           placeholder="––"
           aria-label=${s}
           role="spinbutton"
-          aria-invalid=${this.hasError ? "true" : o}
+          aria-invalid=${this.hasError ? "true" : p}
           aria-valuemin="0"
           aria-valuemax="23"
-          aria-valuenow=${this._hours !== "" ? this._hours : o}
-          aria-valuetext=${this._hours !== "" ? `${this._hours} ${t.toLowerCase()}` : o}
+          aria-valuenow=${this._hours !== "" ? this._hours : p}
+          aria-valuetext=${this._hours !== "" ? `${this._hours} ${t.toLowerCase()}` : p}
           autocomplete="off"
           ?disabled=${this.disabled}
           @keydown=${this._handleHoursKeydown}
           @blur=${this._handleHoursBlur}
-          @focus=${(d) => {
-      d.target.select(), d.stopImmediatePropagation();
+          @focus=${(h) => {
+      h.target.select(), h.stopImmediatePropagation();
     }}
         />
         <span class="pkt-timepicker__separator">:</span>
@@ -427,30 +433,30 @@ let h = class extends I {
           placeholder="––"
           aria-label=${i}
           role="spinbutton"
-          aria-invalid=${this.hasError ? "true" : o}
+          aria-invalid=${this.hasError ? "true" : p}
           aria-valuemin="0"
           aria-valuemax="59"
-          aria-valuenow=${this._minutes !== "" ? this._minutes : o}
-          aria-valuetext=${this._minutes !== "" ? `${this._minutes} ${e.toLowerCase()}` : o}
+          aria-valuenow=${this._minutes !== "" ? this._minutes : p}
+          aria-valuetext=${this._minutes !== "" ? `${this._minutes} ${e.toLowerCase()}` : p}
           autocomplete="off"
           ?disabled=${this.disabled}
           @keydown=${this._handleMinutesKeydown}
           @blur=${this._handleMinutesBlur}
-          @focus=${(d) => {
-      d.target.select(), d.stopImmediatePropagation();
+          @focus=${(h) => {
+      h.target.select(), h.stopImmediatePropagation();
     }}
         />
         ${this.hidePicker && !this.stepArrows ? u`<pkt-icon
               class="pkt-input-icon pkt-timepicker__icon"
               name="clock"
               aria-hidden="true"
-            ></pkt-icon>` : o}
+            ></pkt-icon>` : p}
         ${!this.hidePicker && !this.stepArrows ? u`
               <button
                 ${_(this.buttonRef)}
                 class="pkt-input-icon pkt-btn pkt-btn--icon-only pkt-btn--tertiary pkt-timepicker__button"
                 type="button"
-                aria-label=${(($ = this.strings.timepicker) == null ? void 0 : $.openPicker) ?? "Åpne tidspunkt-velger"}
+                aria-label=${((y = this.strings.timepicker) == null ? void 0 : y.openPicker) ?? "Åpne tidspunkt-velger"}
                 aria-haspopup="listbox"
                 aria-expanded=${this._isOpen ? "true" : "false"}
                 aria-controls=${this.id + "-popup"}
@@ -459,24 +465,24 @@ let h = class extends I {
               >
                 <pkt-icon name="clock"></pkt-icon>
                 <span class="pkt-btn__text"
-                  >${((y = this.strings.timepicker) == null ? void 0 : y.openPicker) ?? "Åpne tidspunkt-velger"}</span
+                  >${((S = this.strings.timepicker) == null ? void 0 : S.openPicker) ?? "Åpne tidspunkt-velger"}</span
                 >
               </button>
-            ` : o}
+            ` : p}
         ${this.stepArrows ? u`
               <button
                 class="pkt-input-icon pkt-btn pkt-btn--icon-only pkt-btn--tertiary pkt-timepicker__button pkt-timepicker__button--next"
                 type="button"
-                aria-label=${((S = this.strings.timepicker) == null ? void 0 : S.nextTime) ?? "Neste tidspunkt"}
+                aria-label=${((D = this.strings.timepicker) == null ? void 0 : D.nextTime) ?? "Neste tidspunkt"}
                 ?disabled=${this.disabled}
                 @click=${() => this._stepTime(1)}
               >
                 <pkt-icon name="chevron-thin-right"></pkt-icon>
                 <span class="pkt-btn__text"
-                  >${((D = this.strings.timepicker) == null ? void 0 : D.nextTime) ?? "Neste tidspunkt"}</span
+                  >${((w = this.strings.timepicker) == null ? void 0 : w.nextTime) ?? "Neste tidspunkt"}</span
                 >
               </button>
-            ` : o}
+            ` : p}
         <input
           ${_(this.hiddenInputRef)}
           type="time"
@@ -516,7 +522,7 @@ let h = class extends I {
         .requiredText=${this.requiredText}
         .tagText=${this.tagText}
       >
-        <div class="pkt-contents" slot="helptext">${F(this, "helptext")}</div>
+        <div class="pkt-contents" slot="helptext">${C(this, "helptext")}</div>
         ${!this.hidePicker && !this.stepArrows ? u`
               <div class="pkt-timepicker__anchor">
                 ${this._renderContainer()} ${this._renderPopup()}
@@ -525,28 +531,30 @@ let h = class extends I {
       </pkt-input-wrapper>
     `;
   }
-};
-l([
+}
+d([
   b({ type: String, reflect: !0 })
-], h.prototype, "value", 2);
-l([
+], l.prototype, "value");
+d([
   b({ type: Boolean, reflect: !0, attribute: "hide-picker" })
-], h.prototype, "hidePicker", 2);
-l([
+], l.prototype, "hidePicker");
+d([
   b({ type: Boolean, reflect: !0, attribute: "step-arrows" })
-], h.prototype, "stepArrows", 2);
-l([
+], l.prototype, "stepArrows");
+d([
   v()
-], h.prototype, "_hours", 2);
-l([
+], l.prototype, "_hours");
+d([
   v()
-], h.prototype, "_minutes", 2);
-l([
+], l.prototype, "_minutes");
+d([
   v()
-], h.prototype, "_isOpen", 2);
-h = l([
-  w("pkt-timepicker")
-], h);
+], l.prototype, "_isOpen");
+try {
+  I("pkt-timepicker")(l);
+} catch {
+  console.warn("Forsøker å definere <pkt-timepicker>, men den er allerede definert");
+}
 export {
-  h as PktTimepicker
+  l as PktTimepicker
 };

package/dist/progressbar-BqlMzkM_.cjs

@@ -0,0 +1,21 @@
+"use strict";const p=require("./class-map-CsENJXf1.cjs"),e=require("./element-gR_VtSiD.cjs"),h=require("./state-Dg-53wQ8.cjs"),d=require("./ref-CL-Xk9Xm.cjs"),b=require("./directive-C7oCP5Bh.cjs"),c=require("./utils-byXsEz1u.cjs");require("./icon-q81vqPK_.cjs");/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const y="important",m=" !"+y,_=b.e(class extends b.i{constructor(n){var t;if(super(n),n.type!==b.t.ATTRIBUTE||n.name!=="style"||((t=n.strings)==null?void 0:t.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(n){return Object.keys(n).reduce((t,s)=>{const a=n[s];return a==null?t:t+`${s=s.includes("-")?s:s.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${a};`},"")}update(n,[t]){const{style:s}=n.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(t)),this.render(t);for(const a of this.ft)t[a]==null&&(this.ft.delete(a),a.includes("-")?s.removeProperty(a):s[a]=null);for(const a in t){const l=t[a];if(l!=null){this.ft.add(a);const u=typeof l=="string"&&l.endsWith(m);a.includes("-")||u?s.setProperty(a,u?l.slice(0,-11):l,u?y:""):s[a]=l}}return e.E}});var A=Object.defineProperty,i=(n,t,s,a)=>{for(var l=void 0,u=n.length-1,o;u>=0;u--)(o=n[u])&&(l=o(t,s,l)||l);return l&&A(t,s,l),l};class r extends e.PktElement{constructor(){super(),this.ariaLabel=null,this.ariaLabelledby=null,this.ariaValueText=null,this.ariaLive="polite",this.id=c.uuidish(),this.role="progressbar",this.skin="dark-blue",this.statusPlacement="following",this.statusType="none",this.title="",this.titlePosition="left",this.valueCurrent=0,this.valueMax=100,this.valueMin=0,this.labelWidth=0,this.progressbarId=this.id,this.computedAriaLabelledby=null,this.computedAriaValueText="",this.labelRef=d.e(),this.progressBarRef=d.e()}firstUpdated(t){super.firstUpdated(t),this.setComputedValues(),this.syncAttributes()}updated(t){super.updated(t),t.has("valueCurrent")&&this.labelRef.value&&(this.labelWidth=this.labelRef.value.getBoundingClientRect().width||0),t.has("id")&&this.id&&(this.progressBarId=this.id),(t.has("statusType")||t.has("id")||t.has("ariaLabelledby"))&&(this.progressbarId=this.id||c.uuidish(),this.computedAriaLabelledby=this.ariaLabelledby||`${this.progressbarId}-title`),(t.has("ariaValueText")||t.has("valueCurrent")||t.has("valueMax"))&&(this.computedAriaValueText=this.statusType==="fraction"&&!this.ariaValueText?`${this.valueCurrent} av ${this.valueMax-this.valueMin}`:this.ariaValueText||""),this.syncAttributes()}render(){const t=this.statusType!=="none",s=this.valueMax-this.valueMin,a=this.valueCurrent/s*100,l=this.statusType==="fraction"?Math.round(a):Math.round((this.valueCurrent-this.valueMin)/(this.valueMax-this.valueMin)*100),u=`${this.valueCurrent} av ${s}`,o=p.e({"pkt-progressbar__bar":!0,[`pkt-progressbar__bar--${this.skin}`]:!!this.skin}),v=p.e({"pkt-progressbar__title":!0,"pkt-progressbar__title-center":this.titlePosition==="center"}),f=p.e({"pkt-progressbar__status":!0,"pkt-progressbar__status--center":this.statusPlacement==="center"}),g=p.e({"pkt-progressbar__status-placement--following":this.statusPlacement==="following","pkt-progressbar__status-placement--center":this.statusPlacement==="center","pkt-progressbar__status-placement--left":this.statusPlacement==="left"});return e.b` <div
+      class="pkt-progressbar__container"
+      .ref=${this.progressBarRef}
+      style=${_({"--pkt-progress-label-width":`${this.labelWidth}px`,"--pkt-progress-width":`${l}%`})}
+    >
+      ${this.title?e.b`<p id=${`${this.progressBarId}-title`} class=${v}>${this.title}</p>`:e.A}
+
+      <div class="pkt-progressbar__bar-wrapper">
+        <div class=${o}></div>
+      </div>
+
+      ${t?e.b`<div class=${f}>
+            <span class=${g} ${d.n(this.labelRef)}>
+              ${this.statusType==="percentage"?`${l}%`:u}
+            </span>
+          </div>`:e.A}
+    </div>`}setComputedValues(){this.progressbarId=this.id||c.uuidish(),this.computedAriaLabelledby=this.ariaLabelledby||`${this.progressbarId}-title`,this.computedAriaValueText=this.statusType==="fraction"&&!this.ariaValueText?`${this.valueCurrent} av ${this.valueMax-this.valueMin}`:this.ariaValueText||""}syncAttributes(){this._handleAttribute("aria-live",this.ariaLive),this._handleAttribute("aria-valuenow",this.valueCurrent),this._handleAttribute("aria-valuemin",this.valueMin),this._handleAttribute("aria-valuemax",this.valueMax),this._handleAttribute("aria-valuetext",this.computedAriaValueText),this._handleAttribute("aria-label",this.ariaLabel),this._handleAttribute("role",this.role),this._handleAttribute("aria-atomic","true"),this._handleAttribute("id",this.progressbarId),this.ariaLabel||this._handleAttribute("aria-labelledby",this.computedAriaLabelledby)}_handleAttribute(t,s){s==null||s===""?this.removeAttribute(t):this.setAttribute(t,String(s))}}i([e.n({type:String})],r.prototype,"ariaLabel");i([e.n({type:String,reflect:!0})],r.prototype,"ariaLabelledby");i([e.n({type:String,reflect:!0})],r.prototype,"ariaValueText");i([e.n({type:String})],r.prototype,"ariaLive");i([e.n({type:String,reflect:!0})],r.prototype,"id");i([e.n({type:String})],r.prototype,"role");i([e.n({type:String})],r.prototype,"skin");i([e.n({type:String})],r.prototype,"statusPlacement");i([e.n({type:String})],r.prototype,"statusType");i([e.n({type:String,reflect:!0})],r.prototype,"title");i([e.n({type:String})],r.prototype,"titlePosition");i([e.n({type:Number,reflect:!0})],r.prototype,"valueCurrent");i([e.n({type:Number})],r.prototype,"valueMax");i([e.n({type:Number})],r.prototype,"valueMin");i([h.r()],r.prototype,"labelWidth");i([h.r()],r.prototype,"progressbarId");i([h.r()],r.prototype,"computedAriaLabelledby");i([h.r()],r.prototype,"computedAriaValueText");try{e.t("pkt-progressbar")(r)}catch{console.warn("Forsøker å definere <pkt-progressbar>, men den er allerede definert")}exports.PktProgressbar=r;

package/dist/{progressbar-By7e0lEI.js → progressbar-sbHDFC12.js}

@@ -1,95 +1,95 @@
-import { e as n } from "./class-map-CEnykyO_.js";
-import { E as g, P as _, A as c, b, n as u, t as $ } from "./element-CPpT3rFQ.js";
+import { e as p } from "./class-map-CEnykyO_.js";
+import { E as _, t as $, P as A, A as c, b as d, n as u } from "./element-CPpT3rFQ.js";
 import { r as h } from "./state-C_1EOo3D.js";
-import { e as y, n as A } from "./ref-Bg_Swj5w.js";
-import { e as x, i as T, t as k } from "./directive-oAbCiebi.js";
-import { u as d } from "./utils-DznhwRXm.js";
-import "./icon-BlKA8YuW.js";
+import { e as y, n as k } from "./ref-Bg_Swj5w.js";
+import { e as x, i as T, t as C } from "./directive-oAbCiebi.js";
+import { u as b } from "./utils-DznhwRXm.js";
+import "./icon-CxQcIa5F.js";
 /**
  * @license
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const v = "important", C = " !" + v, M = x(class extends T {
-  constructor(t) {
-    var e;
-    if (super(t), t.type !== k.ATTRIBUTE || t.name !== "style" || ((e = t.strings) == null ? void 0 : e.length) > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
+const f = "important", M = " !" + f, L = x(class extends T {
+  constructor(l) {
+    var t;
+    if (super(l), l.type !== C.ATTRIBUTE || l.name !== "style" || ((t = l.strings) == null ? void 0 : t.length) > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
   }
-  render(t) {
-    return Object.keys(t).reduce((e, a) => {
-      const s = t[a];
-      return s == null ? e : e + `${a = a.includes("-") ? a : a.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${s};`;
+  render(l) {
+    return Object.keys(l).reduce((t, e) => {
+      const i = l[e];
+      return i == null ? t : t + `${e = e.includes("-") ? e : e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${i};`;
     }, "");
   }
-  update(t, [e]) {
-    const { style: a } = t.element;
-    if (this.ft === void 0) return this.ft = new Set(Object.keys(e)), this.render(e);
-    for (const s of this.ft) e[s] == null && (this.ft.delete(s), s.includes("-") ? a.removeProperty(s) : a[s] = null);
-    for (const s in e) {
-      const l = e[s];
-      if (l != null) {
-        this.ft.add(s);
-        const o = typeof l == "string" && l.endsWith(C);
-        s.includes("-") || o ? a.setProperty(s, o ? l.slice(0, -11) : l, o ? v : "") : a[s] = l;
+  update(l, [t]) {
+    const { style: e } = l.element;
+    if (this.ft === void 0) return this.ft = new Set(Object.keys(t)), this.render(t);
+    for (const i of this.ft) t[i] == null && (this.ft.delete(i), i.includes("-") ? e.removeProperty(i) : e[i] = null);
+    for (const i in t) {
+      const a = t[i];
+      if (a != null) {
+        this.ft.add(i);
+        const o = typeof a == "string" && a.endsWith(M);
+        i.includes("-") || o ? e.setProperty(i, o ? a.slice(0, -11) : a, o ? f : "") : e[i] = a;
       }
     }
-    return g;
+    return _;
   }
 });
-var L = Object.defineProperty, S = Object.getOwnPropertyDescriptor, i = (t, e, a, s) => {
-  for (var l = s > 1 ? void 0 : s ? S(e, a) : e, o = t.length - 1, p; o >= 0; o--)
-    (p = t[o]) && (l = (s ? p(e, a, l) : p(l)) || l);
-  return s && l && L(e, a, l), l;
+var S = Object.defineProperty, r = (l, t, e, i) => {
+  for (var a = void 0, o = l.length - 1, n; o >= 0; o--)
+    (n = l[o]) && (a = n(t, e, a) || a);
+  return a && S(t, e, a), a;
 };
-let r = class extends _ {
+class s extends A {
   constructor() {
-    super(), this.ariaLabel = null, this.ariaLabelledby = null, this.ariaValueText = null, this.ariaLive = "polite", this.id = d(), this.role = "progressbar", this.skin = "dark-blue", this.statusPlacement = "following", this.statusType = "none", this.title = "", this.titlePosition = "left", this.valueCurrent = 0, this.valueMax = 100, this.valueMin = 0, this.labelWidth = 0, this.progressbarId = this.id, this.computedAriaLabelledby = null, this.computedAriaValueText = "", this.labelRef = y(), this.progressBarRef = y();
+    super(), this.ariaLabel = null, this.ariaLabelledby = null, this.ariaValueText = null, this.ariaLive = "polite", this.id = b(), this.role = "progressbar", this.skin = "dark-blue", this.statusPlacement = "following", this.statusType = "none", this.title = "", this.titlePosition = "left", this.valueCurrent = 0, this.valueMax = 100, this.valueMin = 0, this.labelWidth = 0, this.progressbarId = this.id, this.computedAriaLabelledby = null, this.computedAriaValueText = "", this.labelRef = y(), this.progressBarRef = y();
   }
   firstUpdated(t) {
     super.firstUpdated(t), this.setComputedValues(), this.syncAttributes();
   }
   updated(t) {
-    super.updated(t), t.has("valueCurrent") && this.labelRef.value && (this.labelWidth = this.labelRef.value.getBoundingClientRect().width || 0), t.has("id") && this.id && (this.progressBarId = this.id), (t.has("statusType") || t.has("id") || t.has("ariaLabelledby")) && (this.progressbarId = this.id || d(), this.computedAriaLabelledby = this.ariaLabelledby || `${this.progressbarId}-title`), (t.has("ariaValueText") || t.has("valueCurrent") || t.has("valueMax")) && (this.computedAriaValueText = this.statusType === "fraction" && !this.ariaValueText ? `${this.valueCurrent} av ${this.valueMax - this.valueMin}` : this.ariaValueText || ""), this.syncAttributes();
+    super.updated(t), t.has("valueCurrent") && this.labelRef.value && (this.labelWidth = this.labelRef.value.getBoundingClientRect().width || 0), t.has("id") && this.id && (this.progressBarId = this.id), (t.has("statusType") || t.has("id") || t.has("ariaLabelledby")) && (this.progressbarId = this.id || b(), this.computedAriaLabelledby = this.ariaLabelledby || `${this.progressbarId}-title`), (t.has("ariaValueText") || t.has("valueCurrent") || t.has("valueMax")) && (this.computedAriaValueText = this.statusType === "fraction" && !this.ariaValueText ? `${this.valueCurrent} av ${this.valueMax - this.valueMin}` : this.ariaValueText || ""), this.syncAttributes();
   }
   render() {
-    const t = this.statusType !== "none", e = this.valueMax - this.valueMin, a = this.valueCurrent / e * 100, s = this.statusType === "fraction" ? Math.round(a) : Math.round((this.valueCurrent - this.valueMin) / (this.valueMax - this.valueMin) * 100), l = `${this.valueCurrent} av ${e}`, o = n({
+    const t = this.statusType !== "none", e = this.valueMax - this.valueMin, i = this.valueCurrent / e * 100, a = this.statusType === "fraction" ? Math.round(i) : Math.round((this.valueCurrent - this.valueMin) / (this.valueMax - this.valueMin) * 100), o = `${this.valueCurrent} av ${e}`, n = p({
       "pkt-progressbar__bar": !0,
       [`pkt-progressbar__bar--${this.skin}`]: !!this.skin
-    }), p = n({
+    }), v = p({
       "pkt-progressbar__title": !0,
       "pkt-progressbar__title-center": this.titlePosition === "center"
-    }), f = n({
+    }), m = p({
       "pkt-progressbar__status": !0,
       "pkt-progressbar__status--center": this.statusPlacement === "center"
-    }), m = n({
+    }), g = p({
       "pkt-progressbar__status-placement--following": this.statusPlacement === "following",
       "pkt-progressbar__status-placement--center": this.statusPlacement === "center",
       "pkt-progressbar__status-placement--left": this.statusPlacement === "left"
     });
-    return b` <div
+    return d` <div
       class="pkt-progressbar__container"
       .ref=${this.progressBarRef}
-      style=${M({
+      style=${L({
       "--pkt-progress-label-width": `${this.labelWidth}px`,
-      "--pkt-progress-width": `${s}%`
+      "--pkt-progress-width": `${a}%`
     })}
     >
-      ${this.title ? b`<p id=${`${this.progressBarId}-title`} class=${p}>${this.title}</p>` : c}
+      ${this.title ? d`<p id=${`${this.progressBarId}-title`} class=${v}>${this.title}</p>` : c}
 
       <div class="pkt-progressbar__bar-wrapper">
-        <div class=${o}></div>
+        <div class=${n}></div>
       </div>
 
-      ${t ? b`<div class=${f}>
-            <span class=${m} ${A(this.labelRef)}>
-              ${this.statusType === "percentage" ? `${s}%` : l}
+      ${t ? d`<div class=${m}>
+            <span class=${g} ${k(this.labelRef)}>
+              ${this.statusType === "percentage" ? `${a}%` : o}
             </span>
           </div>` : c}
     </div>`;
   }
   // methods
   setComputedValues() {
-    this.progressbarId = this.id || d(), this.computedAriaLabelledby = this.ariaLabelledby || `${this.progressbarId}-title`, this.computedAriaValueText = this.statusType === "fraction" && !this.ariaValueText ? `${this.valueCurrent} av ${this.valueMax - this.valueMin}` : this.ariaValueText || "";
+    this.progressbarId = this.id || b(), this.computedAriaLabelledby = this.ariaLabelledby || `${this.progressbarId}-title`, this.computedAriaValueText = this.statusType === "fraction" && !this.ariaValueText ? `${this.valueCurrent} av ${this.valueMax - this.valueMin}` : this.ariaValueText || "";
   }
   syncAttributes() {
     this._handleAttribute("aria-live", this.ariaLive), this._handleAttribute("aria-valuenow", this.valueCurrent), this._handleAttribute("aria-valuemin", this.valueMin), this._handleAttribute("aria-valuemax", this.valueMax), this._handleAttribute("aria-valuetext", this.computedAriaValueText), this._handleAttribute("aria-label", this.ariaLabel), this._handleAttribute("role", this.role), this._handleAttribute("aria-atomic", "true"), this._handleAttribute("id", this.progressbarId), this.ariaLabel || this._handleAttribute("aria-labelledby", this.computedAriaLabelledby);
@@ -97,66 +97,66 @@ let r = class extends _ {
   _handleAttribute(t, e) {
     e == null || e === "" ? this.removeAttribute(t) : this.setAttribute(t, String(e));
   }
-};
-i([
+}
+r([
   u({ type: String })
-], r.prototype, "ariaLabel", 2);
-i([
+], s.prototype, "ariaLabel");
+r([
   u({ type: String, reflect: !0 })
-], r.prototype, "ariaLabelledby", 2);
-i([
+], s.prototype, "ariaLabelledby");
+r([
   u({ type: String, reflect: !0 })
-], r.prototype, "ariaValueText", 2);
-i([
+], s.prototype, "ariaValueText");
+r([
   u({ type: String })
-], r.prototype, "ariaLive", 2);
-i([
+], s.prototype, "ariaLive");
+r([
   u({ type: String, reflect: !0 })
-], r.prototype, "id", 2);
-i([
+], s.prototype, "id");
+r([
   u({ type: String })
-], r.prototype, "role", 2);
-i([
+], s.prototype, "role");
+r([
   u({ type: String })
-], r.prototype, "skin", 2);
-i([
+], s.prototype, "skin");
+r([
   u({ type: String })
-], r.prototype, "statusPlacement", 2);
-i([
+], s.prototype, "statusPlacement");
+r([
   u({ type: String })
-], r.prototype, "statusType", 2);
-i([
+], s.prototype, "statusType");
+r([
   u({ type: String, reflect: !0 })
-], r.prototype, "title", 2);
-i([
+], s.prototype, "title");
+r([
   u({ type: String })
-], r.prototype, "titlePosition", 2);
-i([
+], s.prototype, "titlePosition");
+r([
   u({ type: Number, reflect: !0 })
-], r.prototype, "valueCurrent", 2);
-i([
+], s.prototype, "valueCurrent");
+r([
   u({ type: Number })
-], r.prototype, "valueMax", 2);
-i([
+], s.prototype, "valueMax");
+r([
   u({ type: Number })
-], r.prototype, "valueMin", 2);
-i([
+], s.prototype, "valueMin");
+r([
   h()
-], r.prototype, "labelWidth", 2);
-i([
+], s.prototype, "labelWidth");
+r([
   h()
-], r.prototype, "progressbarId", 2);
-i([
+], s.prototype, "progressbarId");
+r([
   h()
-], r.prototype, "computedAriaLabelledby", 2);
-i([
+], s.prototype, "computedAriaLabelledby");
+r([
   h()
-], r.prototype, "computedAriaValueText", 2);
-r = i([
-  $("pkt-progressbar")
-], r);
-const W = r;
+], s.prototype, "computedAriaValueText");
+try {
+  $("pkt-progressbar")(s);
+} catch {
+  console.warn("Forsøker å definere <pkt-progressbar>, men den er allerede definert");
+}
 export {
-  r as P,
-  W as a
+  s as P
 };