@oslokommune/punkt-elements 12.3.9 → 12.3.10

package/dist/pkt-datepicker.js

@@ -1,9 +1,9 @@
-import { R as K, a as z, k as P, D as N, n as y } from "./index-BoxUN9GL.js";
+import { R as K, a as z, k as O, D as B, n as y } from "./index-BoxUN9GL.js";
 import { e as Z, i as tt, a as et, t as nt } from "./directive-DA0-wdk7.js";
-import { u as at, c as M, a as S, p as F, d as rt, i as C, K as D } from "./ref-DzpbHCb_.js";
+import { u as at, c as $, a as S, p as F, d as rt, i as C, K as P } from "./ref-DzpbHCb_.js";
 import { R } from "./class-map-DnAEF9tj.js";
 import { a as G } from "./converters-DNCwIFwr.js";
-import { s as it, t as k, c as _, m as st, a as ot, g as ut, b as lt, d as dt } from "./index-CiTPWPc2.js";
+import { s as it, t as k, c as _, m as st, a as ot, g as ut, b as lt, d as dt } from "./index-BAKMcM4b.js";
 import "./pkt-input-wrapper.js";
 import "./index-CsKoXqeT.js";
 import "./pkt-tag.js";
@@ -18,7 +18,7 @@ function U(t) {
   const s = Y(i);
   return e.getTime() >= r.getTime() ? n + 1 : e.getTime() >= s.getTime() ? n : n - 1;
 }
-function B(t) {
+function V(t) {
   const e = k(t);
   return e.setHours(0, 0, 0, 0), e;
 }
@@ -37,18 +37,18 @@ function H(t) {
   return n.setUTCFullYear(e.getFullYear()), +t - +n;
 }
 function ct(t, e) {
-  const n = B(t), a = B(e), r = +n - H(n), i = +a - H(a);
+  const n = V(t), a = V(e), r = +n - H(n), i = +a - H(a);
   return Math.round((r - i) / st);
 }
 function ht(t) {
   const e = U(t), n = _(t, 0);
   return n.setFullYear(e, 0, 4), n.setHours(0, 0, 0, 0), Y(n);
 }
-function mt(t) {
+function ft(t) {
   return t instanceof Date || typeof t == "object" && Object.prototype.toString.call(t) === "[object Date]";
 }
-function ft(t) {
-  if (!mt(t) && typeof t != "number")
+function mt(t) {
+  if (!ft(t) && typeof t != "number")
     return !1;
   const e = k(t);
   return !isNaN(Number(e));
@@ -165,7 +165,7 @@ const vt = {
   tomorrow: "'tomorrow at' p",
   nextWeek: "eeee 'at' p",
   other: "P"
-}, Ot = (t, e, n, a) => xt[t];
+}, Mt = (t, e, n, a) => xt[t];
 function E(t) {
   return (e, n) => {
     const a = n != null && n.context ? String(n.context) : "standalone";
@@ -181,15 +181,15 @@ function E(t) {
     return r[i];
   };
 }
-const Pt = {
+const Ot = {
   narrow: ["B", "A"],
   abbreviated: ["BC", "AD"],
   wide: ["Before Christ", "Anno Domini"]
-}, Mt = {
+}, $t = {
   narrow: ["1", "2", "3", "4"],
   abbreviated: ["Q1", "Q2", "Q3", "Q4"],
   wide: ["1st quarter", "2nd quarter", "3rd quarter", "4th quarter"]
-}, Dt = {
+}, Pt = {
   narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"],
   abbreviated: [
     "Jan",
@@ -219,7 +219,7 @@ const Pt = {
     "November",
     "December"
   ]
-}, Tt = {
+}, Dt = {
   narrow: ["S", "M", "T", "W", "T", "F", "S"],
   short: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
   abbreviated: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
@@ -232,7 +232,7 @@ const Pt = {
     "Friday",
     "Saturday"
   ]
-}, $t = {
+}, Tt = {
   narrow: {
     am: "a",
     pm: "p",
@@ -309,24 +309,24 @@ const Pt = {
 }, Rt = {
   ordinalNumber: Ct,
   era: E({
-    values: Pt,
+    values: Ot,
     defaultWidth: "wide"
   }),
   quarter: E({
-    values: Mt,
+    values: $t,
     defaultWidth: "wide",
     argumentCallback: (t) => t - 1
   }),
   month: E({
-    values: Dt,
+    values: Pt,
     defaultWidth: "wide"
   }),
   day: E({
-    values: Tt,
+    values: Dt,
     defaultWidth: "wide"
   }),
   dayPeriod: E({
-    values: $t,
+    values: Tt,
     defaultWidth: "wide",
     formattingValues: St,
     defaultFormattingWidth: "wide"
@@ -384,11 +384,11 @@ const Yt = /^(\d+)(th|st|nd|rd)?/i, Ft = /\d+/i, qt = {
   wide: /^[1234](th|st|nd|rd)? quarter/i
 }, Bt = {
   any: [/1/i, /2/i, /3/i, /4/i]
-}, Ht = {
+}, Vt = {
   narrow: /^[jfmasond]/i,
   abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,
   wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i
-}, Vt = {
+}, Ht = {
   narrow: [
     /^j/i,
     /^f/i,
@@ -459,9 +459,9 @@ const Yt = /^(\d+)(th|st|nd|rd)?/i, Ft = /\d+/i, qt = {
     valueCallback: (t) => t + 1
   }),
   month: W({
-    matchPatterns: Ht,
+    matchPatterns: Vt,
     defaultMatchWidth: "wide",
-    parsePatterns: Vt,
+    parsePatterns: Ht,
     defaultParseWidth: "any"
   }),
   day: W({
@@ -480,7 +480,7 @@ const Yt = /^(\d+)(th|st|nd|rd)?/i, Ft = /\d+/i, qt = {
   code: "en-US",
   formatDistance: yt,
   formatLong: kt,
-  formatRelative: Ot,
+  formatRelative: Mt,
   localize: Rt,
   match: Xt,
   options: {
@@ -554,7 +554,7 @@ const b = {
     );
     return o(r, e.length);
   }
-}, $ = {
+}, T = {
   am: "am",
   pm: "pm",
   midnight: "midnight",
@@ -563,7 +563,7 @@ const b = {
   afternoon: "afternoon",
   evening: "evening",
   night: "night"
-}, V = {
+}, j = {
   // Era
   G: function(t, e, n) {
     const a = t.getFullYear() > 0 ? 1 : 0;
@@ -898,7 +898,7 @@ const b = {
   b: function(t, e, n) {
     const a = t.getHours();
     let r;
-    switch (a === 12 ? r = $.noon : a === 0 ? r = $.midnight : r = a / 12 >= 1 ? "pm" : "am", e) {
+    switch (a === 12 ? r = T.noon : a === 0 ? r = T.midnight : r = a / 12 >= 1 ? "pm" : "am", e) {
       case "b":
       case "bb":
         return n.dayPeriod(r, {
@@ -927,7 +927,7 @@ const b = {
   B: function(t, e, n) {
     const a = t.getHours();
     let r;
-    switch (a >= 17 ? r = $.evening : a >= 12 ? r = $.afternoon : a >= 4 ? r = $.morning : r = $.night, e) {
+    switch (a >= 17 ? r = T.evening : a >= 12 ? r = T.afternoon : a >= 4 ? r = T.morning : r = T.night, e) {
       case "B":
       case "BB":
       case "BBB":
@@ -989,14 +989,14 @@ const b = {
       return "Z";
     switch (e) {
       case "X":
-        return A(a);
+        return L(a);
       case "XXXX":
       case "XX":
-        return T(a);
+        return D(a);
       case "XXXXX":
       case "XXX":
       default:
-        return T(a, ":");
+        return D(a, ":");
     }
   },
   // Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent)
@@ -1004,14 +1004,14 @@ const b = {
     const a = t.getTimezoneOffset();
     switch (e) {
       case "x":
-        return A(a);
+        return L(a);
       case "xxxx":
       case "xx":
-        return T(a);
+        return D(a);
       case "xxxxx":
       case "xxx":
       default:
-        return T(a, ":");
+        return D(a, ":");
     }
   },
   // Timezone (GMT)
@@ -1021,10 +1021,10 @@ const b = {
       case "O":
       case "OO":
       case "OOO":
-        return "GMT" + j(a, ":");
+        return "GMT" + A(a, ":");
       case "OOOO":
       default:
-        return "GMT" + T(a, ":");
+        return "GMT" + D(a, ":");
     }
   },
   // Timezone (specific non-location)
@@ -1034,10 +1034,10 @@ const b = {
       case "z":
       case "zz":
       case "zzz":
-        return "GMT" + j(a, ":");
+        return "GMT" + A(a, ":");
       case "zzzz":
       default:
-        return "GMT" + T(a, ":");
+        return "GMT" + D(a, ":");
     }
   },
   // Seconds timestamp
@@ -1051,18 +1051,18 @@ const b = {
     return o(a, e.length);
   }
 };
-function j(t, e = "") {
+function A(t, e = "") {
   const n = t > 0 ? "-" : "+", a = Math.abs(t), r = Math.trunc(a / 60), i = a % 60;
   return i === 0 ? n + String(r) : n + String(r) + e + o(i, 2);
 }
-function A(t, e) {
-  return t % 60 === 0 ? (t > 0 ? "-" : "+") + o(Math.abs(t) / 60, 2) : T(t, e);
+function L(t, e) {
+  return t % 60 === 0 ? (t > 0 ? "-" : "+") + o(Math.abs(t) / 60, 2) : D(t, e);
 }
-function T(t, e = "") {
+function D(t, e = "") {
   const n = t > 0 ? "-" : "+", a = Math.abs(t), r = o(Math.trunc(a / 60), 2), i = o(a % 60, 2);
   return n + r + e + i;
 }
-const L = (t, e) => {
+const Q = (t, e) => {
   switch (t) {
     case "P":
       return e.date({ width: "short" });
@@ -1089,7 +1089,7 @@ const L = (t, e) => {
 }, Kt = (t, e) => {
   const n = t.match(/(P+)(p+)?/) || [], a = n[1], r = n[2];
   if (!r)
-    return L(t, e);
+    return Q(t, e);
   let i;
   switch (a) {
     case "P":
@@ -1106,7 +1106,7 @@ const L = (t, e) => {
       i = e.dateTime({ width: "full" });
       break;
   }
-  return i.replace("{{date}}", L(a, e)).replace("{{time}}", J(r, e));
+  return i.replace("{{date}}", Q(a, e)).replace("{{time}}", J(r, e));
 }, zt = {
   p: J,
   P: Kt
@@ -1127,15 +1127,15 @@ function ie(t, e, n) {
 }
 const se = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g, oe = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g, ue = /^'([^]*?)'?$/, le = /''/g, de = /[a-zA-Z]/;
 function ce(t, e, n) {
-  var x, l, f, h;
-  const a = dt(), r = a.locale ?? Gt, i = a.firstWeekContainsDate ?? ((l = (x = a.locale) == null ? void 0 : x.options) == null ? void 0 : l.firstWeekContainsDate) ?? 1, s = a.weekStartsOn ?? ((h = (f = a.locale) == null ? void 0 : f.options) == null ? void 0 : h.weekStartsOn) ?? 0, d = k(t);
-  if (!ft(d))
+  var x, l, m, h;
+  const a = dt(), r = a.locale ?? Gt, i = a.firstWeekContainsDate ?? ((l = (x = a.locale) == null ? void 0 : x.options) == null ? void 0 : l.firstWeekContainsDate) ?? 1, s = a.weekStartsOn ?? ((h = (m = a.locale) == null ? void 0 : m.options) == null ? void 0 : h.weekStartsOn) ?? 0, d = k(t);
+  if (!mt(d))
     throw new RangeError("Invalid time value");
   let g = e.match(oe).map((u) => {
     const c = u[0];
     if (c === "p" || c === "P") {
-      const O = zt[c];
-      return O(u, r.formatLong);
+      const M = zt[c];
+      return M(u, r.formatLong);
     }
     return u;
   }).join("").match(se).map((u) => {
@@ -1144,7 +1144,7 @@ function ce(t, e, n) {
     const c = u[0];
     if (c === "'")
       return { isToken: !1, value: he(u) };
-    if (V[c])
+    if (j[c])
       return { isToken: !0, value: u };
     if (c.match(de))
       throw new RangeError(
@@ -1162,8 +1162,8 @@ function ce(t, e, n) {
     if (!u.isToken) return u.value;
     const c = u.value;
     (ae(c) || ne(c)) && re(c, e, String(t));
-    const O = V[c[0]];
-    return O(d, c, r.localize, v);
+    const M = j[c[0]];
+    return M(d, c, r.localize, v);
   }).join("");
 }
 function he(t) {
@@ -1175,11 +1175,11 @@ function he(t) {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Q = (t, e, n) => {
+const X = (t, e, n) => {
   const a = /* @__PURE__ */ new Map();
   for (let r = e; r <= n; r++) a.set(t[r], r);
   return a;
-}, me = Z(class extends tt {
+}, fe = Z(class extends tt {
   constructor(t) {
     if (super(t), t.type !== et.CHILD) throw Error("repeat() can only be used in text expressions");
   }
@@ -1198,33 +1198,33 @@ const Q = (t, e, n) => {
     const r = at(t), { values: i, keys: s } = this.dt(e, n, a);
     if (!Array.isArray(r)) return this.ut = s, i;
     const d = this.ut ?? (this.ut = []), g = [];
-    let v, x, l = 0, f = r.length - 1, h = 0, u = i.length - 1;
-    for (; l <= f && h <= u; ) if (r[l] === null) l++;
-    else if (r[f] === null) f--;
-    else if (d[l] === s[h]) g[h] = M(r[l], i[h]), l++, h++;
-    else if (d[f] === s[u]) g[u] = M(r[f], i[u]), f--, u--;
-    else if (d[l] === s[u]) g[u] = M(r[l], i[u]), S(t, g[u + 1], r[l]), l++, u--;
-    else if (d[f] === s[h]) g[h] = M(r[f], i[h]), S(t, r[l], r[f]), f--, h++;
-    else if (v === void 0 && (v = Q(s, h, u), x = Q(d, l, f)), v.has(d[l])) if (v.has(d[f])) {
-      const c = x.get(s[h]), O = c !== void 0 ? r[c] : null;
-      if (O === null) {
-        const I = S(t, r[l]);
-        M(I, i[h]), g[h] = I;
-      } else g[h] = M(O, i[h]), S(t, r[l], O), r[c] = null;
+    let v, x, l = 0, m = r.length - 1, h = 0, u = i.length - 1;
+    for (; l <= m && h <= u; ) if (r[l] === null) l++;
+    else if (r[m] === null) m--;
+    else if (d[l] === s[h]) g[h] = $(r[l], i[h]), l++, h++;
+    else if (d[m] === s[u]) g[u] = $(r[m], i[u]), m--, u--;
+    else if (d[l] === s[u]) g[u] = $(r[l], i[u]), S(t, g[u + 1], r[l]), l++, u--;
+    else if (d[m] === s[h]) g[h] = $(r[m], i[h]), S(t, r[l], r[m]), m--, h++;
+    else if (v === void 0 && (v = X(s, h, u), x = X(d, l, m)), v.has(d[l])) if (v.has(d[m])) {
+      const c = x.get(s[h]), M = c !== void 0 ? r[c] : null;
+      if (M === null) {
+        const N = S(t, r[l]);
+        $(N, i[h]), g[h] = N;
+      } else g[h] = $(M, i[h]), S(t, r[l], M), r[c] = null;
       h++;
-    } else F(r[f]), f--;
+    } else F(r[m]), m--;
     else F(r[l]), l++;
     for (; h <= u; ) {
       const c = S(t, g[u + 1]);
-      M(c, i[h]), g[h++] = c;
+      $(c, i[h]), g[h++] = c;
     }
-    for (; l <= f; ) {
+    for (; l <= m; ) {
       const c = r[l++];
       c !== null && F(c);
     }
     return this.ut = s, rt(t, g), K;
   }
-}), fe = "pkt-datepicker", pe = !0, ge = {
+}), me = "pkt-datepicker", pe = !0, ge = {
   name: {
     type: "string",
     name: "Navn",
@@ -1400,7 +1400,7 @@ const Q = (t, e, n) => {
     description: "Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes"
   }
 }, w = {
-  name: fe,
+  name: me,
   "css-class": "pkt-datepicker",
   isElement: pe,
   props: ge,
@@ -1411,8 +1411,8 @@ var ve = Object.defineProperty, we = Object.getOwnPropertyDescriptor, p = (t, e,
     (s = t[i]) && (r = (a ? s(e, n, r) : s(r)) || r);
   return a && r && ve(e, n, r), r;
 };
-const X = (t) => new Promise((e) => setTimeout(e, t));
-let m = class extends z {
+const I = (t) => new Promise((e) => setTimeout(e, t));
+let f = class extends z {
   constructor() {
     super(...arguments), this.value = "", this._value = this.value ? Array.isArray(this.value) ? this.value : this.value.split(",") : [], this.label = "Datovelger", this.helptext = "", this.helptextDropdown = "", this.helptextDropdownButton = w.props.helptextDropdownButton.default, this.dateformat = w.props.dateformat.default, this.multiple = w.props.multiple.default, this.maxlength = w.props.maxlength.default, this.range = w.props.range.default, this.weeknumbers = w.props.weeknumbers.default, this.withcontrols = w.props.withcontrols.default, this.fullwidth = !1, this.excludedates = [], this.excludeweekdays = [], this.currentmonth = this.formatISODate(/* @__PURE__ */ new Date()), this.calendarOpen = !1, this.inputRef = C(), this.inputRefTo = C(), this.btnRef = C(), this.calRef = C(), this.popupRef = C(), this.inputClasses = {
       "pkt-input": !0,
@@ -1443,10 +1443,10 @@ let m = class extends z {
    * Housekeeping / lifecycle methods
    */
   async connectedCallback() {
-    super.connectedCallback(), document && document.body.addEventListener("click", (t) => {
+    super.connectedCallback(), this.isMobileSafari = /iP(ad|od|hone)/i.test(window.navigator.userAgent) && !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/), this.inputType = this.isMobileSafari ? "text" : "date", document && document.body.addEventListener("click", (t) => {
       var e, n;
       (e = this.inputRef) != null && e.value && ((n = this.btnRef) != null && n.value) && !this.inputRef.value.contains(t.target) && !(this.inputRefTo.value && this.inputRefTo.value.contains(t.target)) && !this.btnRef.value.contains(t.target) && !t.target.closest(".pkt-calendar-popup") && this.hideCalendar();
-    }), this.value.length && this._value.length === 0 && (this._value = Array.isArray(this.value) ? this.value : this.value.split(",")), this.min = this.min || w.props.min.default, this.max = this.max || w.props.max.default, typeof this.excludedates == "string" && (this.excludedates = this.excludedates.split(",")), typeof this.excludeweekdays == "string" && (this.excludeweekdays = this.excludeweekdays.split(",")), (this.multiple || this.range) && this.name && !this.name.endsWith("[]") && (this.name = this.name + "[]"), this.calendarOpen && (await X(20), this.handleCalendarPosition());
+    }), this.value.length && this._value.length === 0 && (this._value = Array.isArray(this.value) ? this.value : this.value.split(",")), this.min = this.min || w.props.min.default, this.max = this.max || w.props.max.default, typeof this.excludedates == "string" && (this.excludedates = this.excludedates.split(",")), typeof this.excludeweekdays == "string" && (this.excludeweekdays = this.excludeweekdays.split(",")), (this.multiple || this.range) && this.name && !this.name.endsWith("[]") && (this.name = this.name + "[]"), this.calendarOpen && (await I(20), this.handleCalendarPosition());
   }
   disconnectedCallback() {
     super.disconnectedCallback(), document && document.body.removeEventListener("click", (t) => {
@@ -1473,10 +1473,10 @@ let m = class extends z {
     return t.toISOString().split("T")[0];
   }
   renderInput() {
-    return P`
+    return O`
       <input
         class="${R(this.inputClasses)}"
-        type="date"
+        .type=${this.inputType}
         id="${this.id}-input"
         .value=${this._value[0] ?? ""}
         min=${this.min}
@@ -1485,22 +1485,29 @@ let m = class extends z {
       t.preventDefault(), this.showCalendar();
     }}
         ?disabled=${this.disabled}
+        @keydown=${(t) => {
+      var e;
+      (t.key === "," || t.key === "Enter") && ((e = this.inputRef.value) == null || e.blur());
+    }}
+        @focus=${() => {
+      this.isMobileSafari && this.showCalendar();
+    }}
         @blur=${(t) => {
       this.manageValidity(t.target), this.value = t.target.value;
     }}
         @change=${(t) => {
       t.stopImmediatePropagation();
     }}
-        ${D(this.inputRef)}
+        ${P(this.inputRef)}
       />
     `;
   }
   renderRangeInput() {
-    return P`
+    return O`
       <div class="pkt-input-prefix">Fra</div>
       <input
         class=${R(this.inputClasses)}
-        type="date"
+        .type=${this.inputType}
         id="${this.id}-input"
         .value=${this._value[0] ?? ""}
         min=${this.min}
@@ -1509,6 +1516,13 @@ let m = class extends z {
       t.preventDefault(), this.showCalendar();
     }}
         ?disabled=${this.disabled}
+        @keydown=${(t) => {
+      var e;
+      (t.key === "," || t.key === "Enter") && ((e = this.inputRef.value) == null || e.blur());
+    }}
+        @focus=${() => {
+      this.isMobileSafari && this.showCalendar();
+    }}
         @blur=${(t) => {
       var e, n;
       if (t.target.value) {
@@ -1520,12 +1534,12 @@ let m = class extends z {
         @change=${(t) => {
       t.stopImmediatePropagation();
     }}
-        ${D(this.inputRef)}
+        ${P(this.inputRef)}
       />
       <div class="pkt-input-prefix">Til</div>
       <input
         class=${R(this.inputClasses)}
-        type="date"
+        .type=${this.inputType}
         id="${this.id}-to"
         .value=${this._value[1] ?? ""}
         min=${this.min}
@@ -1534,6 +1548,13 @@ let m = class extends z {
       t.preventDefault(), this.showCalendar();
     }}
         ?disabled=${this.disabled}
+        @keydown=${(t) => {
+      var e;
+      (t.key === "," || t.key === "Enter") && ((e = this.inputRefTo.value) == null || e.blur());
+    }}
+        @focus=${() => {
+      this.isMobileSafari && this.showCalendar();
+    }}
         @blur=${(t) => {
       var e, n;
       if (t.target.value) {
@@ -1555,15 +1576,15 @@ let m = class extends z {
         @change=${(t) => {
       t.stopImmediatePropagation();
     }}
-        ${D(this.inputRefTo)}
+        ${P(this.inputRefTo)}
       />
     `;
   }
   renderMultipleInput() {
-    return P`
+    return O`
       <input
         class=${R(this.inputClasses)}
-        type="date"
+        .type=${this.inputType}
         id="${this.id}-input"
         min=${this.min}
         max=${this.max}
@@ -1572,6 +1593,9 @@ let m = class extends z {
     }}
         @blur=${(t) => {
       this.addToSelected(t);
+    }}
+        @focus=${() => {
+      this.isMobileSafari && this.showCalendar();
     }}
         @keydown=${(t) => {
       (t.key === "," || t.key === "Enter") && (t.preventDefault(), this.addToSelected(t));
@@ -1580,17 +1604,17 @@ let m = class extends z {
         @change=${(t) => {
       t.stopImmediatePropagation();
     }}
-        ${D(this.inputRef)}
+        ${P(this.inputRef)}
       />
     `;
   }
   renderTags() {
-    return P`
+    return O`
       <div class="pkt-datepicker__tags" aria-live="polite">
-        ${this._value[0] ? me(
+        ${this._value[0] ? fe(
       this._value ?? [],
       (t) => t,
-      (t) => P`
+      (t) => O`
                 <pkt-tag
                   .id="${this.id + t + "-tag"}"
                   closeTag
@@ -1601,16 +1625,16 @@ let m = class extends z {
                   >${this.fromISOtoLocal(t)}</pkt-tag
                 >
               `
-    ) : N}
+    ) : B}
       </div>
     `;
   }
   renderCalendar() {
-    return P`<div
+    return O`<div
       class="pkt-calendar-popup pkt-${this.calendarOpen ? "show" : "hide"}"
       @focusout=${this.handleFocusOut}
       id="${this.id}-popup"
-      ${D(this.popupRef)}
+      ${P(this.popupRef)}
     >
       <pkt-calendar
         ?multiple=${this.multiple}
@@ -1628,12 +1652,12 @@ let m = class extends z {
       this.value = !this.multiple && !this.range ? t.detail[0] : t.detail, this._value = t.detail, this.inputRef.value && (this.range && this.inputRefTo.value ? (this.inputRef.value.value = this._value[0] ?? "", this.inputRefTo.value.value = this._value[1] ?? "") : this.multiple || (this.inputRef.value.value = this._value.length ? this._value[0] : ""));
     }}
         @close=${this.hideCalendar}
-        ${D(this.calRef)}
+        ${P(this.calRef)}
       ></pkt-calendar>
     </div>`;
   }
   render() {
-    return P`
+    return O`
       <pkt-input-wrapper
         label="${this.label}"
         forId="${this.id}-input"
@@ -1645,6 +1669,7 @@ let m = class extends z {
         ?required=${this.required}
         ?optionalTag=${this.optionalTag}
         ?requiredTag=${this.requiredTag}
+        ?focusPreventDefault=${!0}
         .optionalText=${this.optionalText}
         .requiredText=${this.requiredText}
         .errorMessage=${this.errorMessage}
@@ -1653,14 +1678,15 @@ let m = class extends z {
         .helptextDropdownButton=${this.helptextDropdownButton}
         class="pkt-datepicker"
       >
-        ${this.multiple ? this.renderTags() : N}
+        ${this.multiple ? this.renderTags() : B}
         <div class="pkt-datepicker__inputs ${this.range ? "pkt-input__range-inputs" : ""}">
           <div class="pkt-input__container">
             ${this.range ? this.renderRangeInput() : this.multiple ? this.renderMultipleInput() : this.renderInput()}
             <button
               class="${R(this.buttonClasses)}"
               @click=${this.toggleCalendar}
-              ${D(this.btnRef)}
+              ?disabled=${this.disabled}
+              ${P(this.btnRef)}
             >
               <pkt-icon name="calendar"></pkt-icon>
               <span class="pkt-btn__text">${this.strings.calendar.buttonAltText}</span>
@@ -1686,69 +1712,71 @@ let m = class extends z {
     this.contains(t.target) || this.hideCalendar();
   }
   async showCalendar() {
-    this.calendarOpen = !0, await X(20), this.handleCalendarPosition();
+    var t;
+    this.calendarOpen = !0, await I(20), this.handleCalendarPosition(), this.isMobileSafari && ((t = this.calRef.value) == null || t.focusOnCurrentDate());
   }
   hideCalendar() {
     this.calendarOpen = !1;
   }
-  toggleCalendar(t) {
-    t.preventDefault(), this.calendarOpen ? this.hideCalendar() : this.showCalendar();
+  async toggleCalendar(t) {
+    var e;
+    t.preventDefault(), this.calendarOpen ? this.hideCalendar() : this.showCalendar(), await I(20), this.isMobileSafari && ((e = this.calRef.value) == null || e.focusOnCurrentDate());
   }
 };
 p([
   y({ type: String, reflect: !0 })
-], m.prototype, "value", 2);
+], f.prototype, "value", 2);
 p([
   y({ type: Array, reflect: !1 })
-], m.prototype, "_value", 2);
+], f.prototype, "_value", 2);
 p([
   y({ type: String })
-], m.prototype, "label", 2);
+], f.prototype, "label", 2);
 p([
   y({ type: String })
-], m.prototype, "helptext", 2);
+], f.prototype, "helptext", 2);
 p([
   y({ type: String })
-], m.prototype, "helptextDropdown", 2);
+], f.prototype, "helptextDropdown", 2);
 p([
   y({ type: String })
-], m.prototype, "helptextDropdownButton", 2);
+], f.prototype, "helptextDropdownButton", 2);
 p([
   y({ type: String })
-], m.prototype, "dateformat", 2);
+], f.prototype, "dateformat", 2);
 p([
   y({ type: Boolean, reflect: !0 })
-], m.prototype, "multiple", 2);
+], f.prototype, "multiple", 2);
 p([
   y({ type: Number })
-], m.prototype, "maxlength", 2);
+], f.prototype, "maxlength", 2);
 p([
   y({ type: Boolean, reflect: !0 })
-], m.prototype, "range", 2);
+], f.prototype, "range", 2);
 p([
   y({ type: Boolean })
-], m.prototype, "weeknumbers", 2);
+], f.prototype, "weeknumbers", 2);
 p([
   y({ type: Boolean })
-], m.prototype, "withcontrols", 2);
+], f.prototype, "withcontrols", 2);
 p([
   y({ type: Boolean })
-], m.prototype, "fullwidth", 2);
+], f.prototype, "fullwidth", 2);
 p([
   y({ converter: G.csvToArray })
-], m.prototype, "excludedates", 2);
+], f.prototype, "excludedates", 2);
 p([
   y({ converter: G.csvToArray })
-], m.prototype, "excludeweekdays", 2);
+], f.prototype, "excludeweekdays", 2);
 p([
   y({ type: String })
-], m.prototype, "currentmonth", 2);
+], f.prototype, "currentmonth", 2);
 p([
   y({ type: Boolean, reflect: !0 })
-], m.prototype, "calendarOpen", 2);
-m = p([
+], f.prototype, "calendarOpen", 2);
+f = p([
   nt("pkt-datepicker")
-], m);
+], f);
 export {
-  m as PktDatepicker
+  f as PktDatepicker
 };