rk-designsystem 1.3.0 → 1.3.2

package/dist/components/DateInput/index.js

@@ -0,0 +1,258 @@
+"use client";
+import { jsxs as S, jsx as g } from "react/jsx-runtime";
+import pe, { forwardRef as be, useEffect as O, useRef as P, useCallback as k, useState as me, useId as ve } from "react";
+import { parse as ge, isValid as xe } from "date-fns";
+import a from "./styles.module.css.js";
+import { useLanguageOptional as he } from "../../context/LanguageContext.js";
+const x = (e) => {
+  const n = e.slice(0, 2), h = e.slice(2, 4), o = e.slice(4, 8);
+  return e.length > 4 ? `${n}.${h}.${o}` : e.length > 2 ? `${n}.${h}` : e.length > 0 ? n : "";
+}, N = (e) => (e || "").replace(/\D/g, "").slice(0, 8), q = (e) => {
+  if (e.length < 8) return null;
+  const n = ge(x(e), "dd.MM.yyyy", /* @__PURE__ */ new Date());
+  return xe(n);
+}, ye = be(
+  (e, n) => {
+    const { t: h } = he();
+    O(() => {
+      const r = "rk-dateinput-inline-styles";
+      if (typeof document > "u" || document.getElementById(r)) return;
+      const t = Ie(a), m = document.createElement("style");
+      m.id = r, m.textContent = t, document.head.prepend(m);
+    }, []);
+    const {
+      label: o,
+      suffixIcon: V,
+      onSuffixClick: c,
+      className: A,
+      inputWrapperClassName: H,
+      inputClassName: G,
+      value: y,
+      defaultValue: J,
+      onChange: I,
+      onValidationChange: $,
+      readOnly: K,
+      placeholder: Q = "dd.mm.åååå",
+      id: T,
+      name: U,
+      required: X,
+      disabled: w,
+      onClick: Y,
+      onFocus: Z,
+      onBlur: z,
+      autoComplete: _ = "off",
+      "aria-label": j,
+      "aria-labelledby": W,
+      description: C,
+      error: u,
+      "data-color": ee,
+      "data-size": re,
+      ...te
+    } = e, B = y !== void 0, f = P(null);
+    pe.useImperativeHandle(
+      n,
+      () => f.current
+    );
+    const R = P(null), i = k(
+      (r, t) => {
+        r !== R.current && (R.current = r, $ == null || $(r, t));
+      },
+      [$]
+    ), D = k(
+      (r) => x(N(r)),
+      []
+    ), [p, E] = me(
+      () => D(y ?? J)
+    );
+    O(() => {
+      if (B) {
+        const r = D(y);
+        r !== p && (E(r), f.current && f.current.value !== r && (f.current.value = r));
+      }
+    }, [y, B, p, D]);
+    const oe = k(
+      (r) => {
+        const t = r.target, m = p, s = N(t.value), d = x(s);
+        let l = 0;
+        const v = s.length;
+        v <= 2 ? l = v : v <= 4 ? l = v + 1 : l = v + 2, l = Math.min(l, d.length), E(d), t.value = d, t.setSelectionRange(l, l), (d !== m || B) && (I == null || I(r, d));
+        const fe = q(s);
+        (s.length === 0 || s.length === 8) && i(s.length === 0 ? null : fe, d);
+      },
+      [p, B, I, i]
+    ), ae = k(
+      (r) => {
+        const t = N(r.target.value);
+        t.length === 0 ? i(null, "") : t.length < 8 ? i(!1, x(t)) : i(q(t), x(t)), z == null || z(r);
+      },
+      [z, i]
+    ), ne = [a.fieldset, A].filter(Boolean).join(" "), le = [
+      a.inputWrapper,
+      H,
+      u ? a.inputWrapperError : ""
+    ].filter(Boolean).join(" "), ie = [
+      G
+    ].filter(Boolean).join(" "), se = [
+      a.suffixButton,
+      c ? a.suffixButtonInteractive : ""
+    ].filter(Boolean).join(" ");
+    !o && !j && !W && console.warn("Advarsel: DateInput-komponenten bør ha label, aria-label, eller aria-labelledby for tilgjengelighet.");
+    const de = ve(), b = T ?? `dateinput${de}`, F = o && typeof o == "string" ? `${b}-label` : void 0, L = C ? `${b}-desc` : void 0, M = u ? `${b}-err` : void 0, ce = [L, M].filter(Boolean).join(" ") || void 0, ue = W ?? F;
+    return (
+      // --- Bruk data-color og data-size på den ytre wrapperen ---
+      /* @__PURE__ */ S(
+        "div",
+        {
+          className: ne,
+          "data-color": ee,
+          "data-size": re,
+          children: [
+            o && typeof o == "string" ? /* @__PURE__ */ g("label", { id: F, htmlFor: b, children: o }) : o,
+            C && /* @__PURE__ */ g("p", { id: L, className: a.description, children: C }),
+            /* @__PURE__ */ S("div", { className: le, children: [
+              /* @__PURE__ */ g(
+                "input",
+                {
+                  ref: f,
+                  type: "text",
+                  inputMode: "numeric",
+                  pattern: "\\d{2}\\.\\d{2}\\.\\d{4}",
+                  maxLength: 10,
+                  value: p,
+                  readOnly: K,
+                  placeholder: Q,
+                  id: b,
+                  name: U,
+                  required: X,
+                  disabled: w,
+                  onClick: Y,
+                  onChange: oe,
+                  onFocus: Z,
+                  onBlur: ae,
+                  autoComplete: _,
+                  "aria-label": j,
+                  "aria-labelledby": ue,
+                  "aria-describedby": ce,
+                  "aria-invalid": !!u,
+                  className: ie,
+                  ...te
+                }
+              ),
+              V && /* @__PURE__ */ g(
+                "button",
+                {
+                  type: "button",
+                  className: se,
+                  onClick: w ? void 0 : c,
+                  tabIndex: c && !w ? 0 : -1,
+                  "aria-hidden": !c,
+                  disabled: w,
+                  "aria-label": c ? h("dateInput.openDatePicker") : void 0,
+                  children: V
+                }
+              )
+            ] }),
+            u && /* @__PURE__ */ g("p", { id: M, className: a.error, role: "alert", children: u })
+          ]
+        }
+      )
+    );
+  }
+);
+ye.displayName = "DateInput";
+function Ie(e) {
+  return `
+.${e.fieldset} {
+  margin-bottom: var(--ds-size-4, 16px);
+}
+.${e.fieldset} label {
+  display: block;
+  margin-bottom: var(--ds-size-1, 4px);
+  font-weight: var(--ds-font-weight-medium, 500);
+  color: var(--ds-color-text-default, #2b2b2b);
+}
+.${e.description} {
+  font-size: var(--ds-font-size-2, 14px);
+  color: var(--ds-color-text-subtle, #5d5d5d);
+  margin-top: var(--ds-size-1, 4px);
+  margin-bottom: var(--ds-size-2, 8px);
+}
+.${e.error} {
+  font-size: var(--ds-font-size-2, 14px);
+  color: var(--ds-color-danger-text-default, #c30000);
+  margin-top: var(--ds-size-1, 4px);
+}
+.${e.inputWrapper} {
+  display: flex;
+  align-items: stretch;
+  width: 100%;
+  position: relative;
+  border: var(--ds-border-width-default, 1px) solid var(--ds-color-border-default, #797979);
+  border-radius: var(--ds-border-radius-md, 4px);
+  overflow: hidden;
+  transition: border-color 0.1s ease-out, outline 0.1s ease-out;
+}
+.${e.inputWrapperError} {
+  border-color: var(--ds-color-danger-border-default, #c30000);
+}
+.${e.inputWrapper}:focus-within {
+  outline: var(--ds-border-width-focus, 3px) solid var(--ds-color-focus-outer, #2B2B2B);
+  outline-offset: var(--ds-border-width-focus, 2px);
+}
+.${e.inputWrapper} input {
+  box-sizing: border-box;
+  flex-grow: 1;
+  width: auto;
+  min-width: 0;
+  background-color: var(--ds-color-background-default, #fff);
+  color: var(--ds-color-text-default, #2b2b2b);
+  border: none;
+  border-radius: 0;
+  outline: none;
+  padding: var(--ds-size-2, 8px) var(--ds-size-3, 12px);
+  font-family: inherit;
+  font-size: inherit;
+  appearance: none;
+  -webkit-appearance: none;
+}
+.${e.inputWrapper} input:disabled {
+  opacity: var(--ds-opacity-disabled, 0.5);
+  cursor: not-allowed;
+  background-color: var(--ds-color-neutral-surface-tinted, #f0f0f0);
+  color: var(--ds-color-neutral-text-subtle, #5d5d5d);
+}
+.${e.suffixButton} {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  padding: 0 var(--ds-size-3, 12px);
+  margin: 0;
+  border: none;
+  border-radius: 0;
+  border-left: var(--ds-border-width-default, 1px) solid var(--ds-color-border-default, #797979);
+  background-color: var(--ds-color-surface-tinted, #e8e8e8);
+  color: var(--ds-color-text-subtle, #5d5d5d);
+  font-size: 1.25rem;
+  box-sizing: border-box;
+  cursor: default;
+  transition: background-color 0.15s ease-out, border-color 0.15s ease-out, color 0.15s ease-out;
+}
+.${e.suffixButtonInteractive} {
+  cursor: pointer;
+}
+.${e.suffixButtonInteractive}:hover:not(:disabled) {
+  color: var(--ds-color-text-default, #2b2b2b);
+  background-color: var(--ds-color-surface-hover, #dadada);
+}
+.${e.suffixButton}:disabled {
+  opacity: var(--ds-opacity-disabled, 0.3);
+  cursor: not-allowed;
+  background-color: var(--ds-color-neutral-surface-tinted, #e8e8e8);
+  border-left-color: var(--ds-color-neutral-border-default, #797979);
+}
+`;
+}
+export {
+  ye as DateInput
+};

package/dist/components/DateInput/styles.module.css.js

@@ -0,0 +1,20 @@
+"use client";
+const t = "_fieldset_1d1ez_2", r = "_description_1d1ez_14", e = "_error_1d1ez_21", n = "_inputWrapper_1d1ez_30", i = "_inputWrapperError_1d1ez_42", o = "_suffixButton_1d1ez_80", s = "_suffixButtonInteractive_1d1ez_100", p = {
+  fieldset: t,
+  description: r,
+  error: e,
+  inputWrapper: n,
+  inputWrapperError: i,
+  suffixButton: o,
+  suffixButtonInteractive: s
+};
+export {
+  p as default,
+  r as description,
+  e as error,
+  t as fieldset,
+  n as inputWrapper,
+  i as inputWrapperError,
+  o as suffixButton,
+  s as suffixButtonInteractive
+};

package/dist/components/DatePicker/index.js

@@ -0,0 +1,360 @@
+"use client";
+import { jsxs as y, jsx as i } from "react/jsx-runtime";
+import { useEffect as N, useState as B, useRef as R, useMemo as D, useCallback as b, useId as te } from "react";
+import { Button as A } from "@digdir/designsystemet-react";
+import { startOfMonth as f, isValid as w, isSameMonth as C, format as u, startOfWeek as I, addDays as g, subMonths as S, addMonths as W, endOfWeek as L, isSameDay as F, isToday as re, endOfMonth as oe, eachDayOfInterval as ae, getDaysInMonth as ne, setDate as ie } from "date-fns";
+import { nb as d } from "date-fns/locale";
+import { ChevronLeftIcon as se } from "../../assets/images/ChevronLeftIcon.js";
+import { ChevronRightIcon as de } from "../../assets/images/ChevronRightIcon.js";
+import n from "./styles.module.css.js";
+import { useLanguageOptional as le } from "../../context/LanguageContext.js";
+const ce = (t) => {
+  const o = f(t), l = I(o, { locale: d }), z = L(oe(t), { locale: d });
+  return ae({ start: l, end: z });
+}, H = (t) => t && t.charAt(0).toUpperCase() + t.slice(1), v = (t, o) => {
+  const l = Math.min(t.getDate(), ne(o));
+  return ie(f(o), l);
+}, ue = ({
+  initialDate: t = /* @__PURE__ */ new Date(),
+  selectedDate: o = null,
+  onDateSelect: l,
+  "data-color": z,
+  "data-size": Y
+}) => {
+  const { t: E } = le();
+  N(() => {
+    const r = "rk-datepicker-inline-styles";
+    if (typeof document > "u" || document.getElementById(r)) return;
+    const e = fe(n), a = document.createElement("style");
+    a.id = r, a.textContent = e, document.head.prepend(a);
+  }, []);
+  const [c, x] = B(
+    f(o && w(o) ? o : t)
+  ), [h, p] = B(
+    () => o && w(o) ? o : t
+  ), P = R(null), $ = R(!1);
+  N(() => {
+    if (o && w(o)) {
+      p(o);
+      const r = f(o);
+      x(
+        (e) => C(r, e) ? e : r
+      );
+    }
+  }, [o]), N(() => {
+    var e;
+    if (!$.current) return;
+    $.current = !1;
+    const r = (e = P.current) == null ? void 0 : e.querySelector(
+      `[data-date="${u(h, "yyyy-MM-dd")}"]`
+    );
+    r == null || r.focus();
+  }, [h, c]);
+  const M = D(
+    () => ce(c),
+    [c]
+  ), U = D(() => {
+    const r = [];
+    for (let e = 0; e < M.length; e += 7)
+      r.push(M.slice(e, e + 7));
+    return r;
+  }, [M]), K = D(() => {
+    const r = I(/* @__PURE__ */ new Date(), { locale: d });
+    return Array.from({ length: 7 }).map((e, a) => {
+      const m = u(g(r, a), "EEEEEE", { locale: d });
+      return H(m);
+    });
+  }, []), T = b(() => {
+    x((r) => {
+      const e = f(S(r, 1));
+      return p((a) => v(a, e)), e;
+    });
+  }, []), q = b(() => {
+    x((r) => {
+      const e = f(W(r, 1));
+      return p((a) => v(a, e)), e;
+    });
+  }, []), k = b(
+    (r) => {
+      p(r), l == null || l(r);
+    },
+    [l]
+  ), s = b((r) => {
+    $.current = !0, p(r), x(
+      (e) => C(r, e) ? e : f(r)
+    );
+  }, []), V = b(
+    (r, e) => {
+      switch (r.key) {
+        case "Enter":
+        case " ":
+          r.preventDefault(), k(e);
+          return;
+        case "ArrowLeft":
+          r.preventDefault(), s(g(e, -1));
+          return;
+        case "ArrowRight":
+          r.preventDefault(), s(g(e, 1));
+          return;
+        case "ArrowUp":
+          r.preventDefault(), s(g(e, -7));
+          return;
+        case "ArrowDown":
+          r.preventDefault(), s(g(e, 7));
+          return;
+        case "Home":
+          r.preventDefault(), s(I(e, { locale: d }));
+          return;
+        case "End":
+          r.preventDefault(), s(L(e, { locale: d }));
+          return;
+        case "PageUp":
+          r.preventDefault(), s(v(e, S(e, 1)));
+          return;
+        case "PageDown":
+          r.preventDefault(), s(v(e, W(e, 1)));
+          return;
+      }
+    },
+    [k, s]
+  ), _ = u(c, "MMMM", { locale: d }), G = u(c, "yyyy", { locale: d }), J = `${H(_)} ${G}`, O = te(), Q = C(h, c) ? h : v(h, c);
+  return /* @__PURE__ */ y(
+    "div",
+    {
+      className: n.calendarContainer,
+      "data-color": z,
+      "data-size": Y,
+      children: [
+        /* @__PURE__ */ y("div", { className: n.calendarHeader, children: [
+          /* @__PURE__ */ i("span", { className: n.monthYear, id: O, "aria-live": "polite", children: J }),
+          /* @__PURE__ */ y("div", { className: n.navigationButtons, children: [
+            /* @__PURE__ */ i(
+              A,
+              {
+                variant: "tertiary",
+                icon: !0,
+                onClick: T,
+                "aria-label": E("datePicker.previousMonth"),
+                children: /* @__PURE__ */ i(se, {})
+              }
+            ),
+            /* @__PURE__ */ i(
+              A,
+              {
+                variant: "tertiary",
+                icon: !0,
+                onClick: q,
+                "aria-label": E("datePicker.nextMonth"),
+                children: /* @__PURE__ */ i(de, {})
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ y("div", { role: "grid", "aria-labelledby": O, className: n.gridWrapper, ref: P, children: [
+          /* @__PURE__ */ i("div", { role: "row", className: n.gridRow, children: K.map((r) => /* @__PURE__ */ i("div", { role: "columnheader", className: n.dayNameCell, children: r }, r)) }),
+          U.map((r) => /* @__PURE__ */ i("div", { role: "row", className: n.gridRow, children: r.map((e) => {
+            const a = C(e, c), m = o && w(o) && F(e, o), j = re(e), X = a && F(e, Q), Z = [
+              n.dateCell,
+              a ? "" : n.otherMonth,
+              m ? n.selectedDate : "",
+              j && !m ? n.todayDate : ""
+            ].filter(Boolean).join(" ");
+            return /* @__PURE__ */ i(
+              "div",
+              {
+                role: "gridcell",
+                className: Z,
+                "data-date": u(e, "yyyy-MM-dd"),
+                onClick: a ? () => k(e) : void 0,
+                onKeyDown: a ? (ee) => V(ee, e) : void 0,
+                tabIndex: a ? X ? 0 : -1 : void 0,
+                "aria-selected": a ? !!m : void 0,
+                "aria-disabled": !a || void 0,
+                "aria-current": j ? "date" : void 0,
+                "aria-label": u(e, "PPP", { locale: d }),
+                children: /* @__PURE__ */ i("span", { className: n.dateNumberContainer, children: u(e, "d") })
+              },
+              e.toISOString()
+            );
+          }) }, r[0].toISOString()))
+        ] })
+      ]
+    }
+  );
+};
+ue.displayName = "DatePicker";
+function fe(t) {
+  return `
+.${t.calendarContainer} {
+  display: inline-flex;
+  padding: var(--ds-size-8, 32px);
+  flex-direction: column;
+  align-items: flex-start;
+  gap: var(--ds-size-3, 12px);
+  border: 1px solid var(--ds-color-border-subtle, #ccc);
+  border-radius: var(--ds-border-radius-md, 4px);
+  background-color: var(--ds-color-background-default, #fff);
+  font-family: var(--ds-font-family, sans-serif);
+  color: var(--ds-color-text-default, #2b2b2b);
+  max-width: 100%;
+  box-sizing: border-box;
+}
+.${t.calendarHeader} {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  align-self: stretch;
+}
+.${t.monthYear} {
+  color: var(--ds-color-text-default, #2b2b2b);
+  font-family: var(--ds-font-family, sans-serif);
+  font-size: var(--ds-heading-sm-font-size, 1.5rem);
+  font-weight: var(--ds-heading-sm-font-weight, 500);
+  line-height: var(--ds-heading-sm-line-height, 1.3);
+  margin: 0;
+}
+.${t.navigationButtons} {
+  display: flex;
+  gap: var(--ds-size-1, 4px);
+}
+.${t.navigationButtons} > button:disabled svg {
+  opacity: var(--ds-opacity-disabled, 0.3);
+}
+.${t.gridWrapper} {
+  width: 100%;
+  overflow: hidden;
+}
+.${t.gridRow} {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  width: 100%;
+  text-align: center;
+}
+.${t.dayNameCell} {
+  display: flex;
+  padding: var(--ds-size-2, 8px);
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: var(--ds-color-text-default, #2b2b2b);
+  text-align: center;
+  font-family: var(--ds-font-family, sans-serif);
+  font-size: var(--ds-body-xs-font-size, 14px);
+  font-weight: var(--ds-font-weight-semibold, 600);
+  line-height: var(--ds-body-short-xs-line-height, 1.3);
+  box-sizing: border-box;
+  min-width: 0;
+}
+.${t.dateCell} {
+  display: flex;
+  padding: var(--ds-size-5, 22px);
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  border: var(--ds-border-width-default, 1px) solid var(--ds-color-border-subtle, #bcbcbc);
+  box-sizing: border-box;
+  margin: -0.5px;
+  font-family: var(--ds-font-family, sans-serif);
+  color: var(--ds-color-text-default, #2b2b2b);
+  text-align: center;
+  font-size: var(--ds-body-xs-font-size, 14px);
+  font-weight: var(--ds-body-xs-font-weight, 400);
+  line-height: var(--ds-body-short-xs-line-height, 1.3);
+  cursor: pointer;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
+  user-select: none;
+  min-width: 0;
+}
+.${t.dateCell}:focus-visible {
+  outline: var(--ds-border-width-focus, 3px) solid var(--ds-color-focus-outer, #2b2b2b);
+  outline-offset: calc(-1 * var(--ds-border-width-focus, 3px));
+  position: relative;
+  z-index: 2;
+}
+.${t.dateNumberContainer} {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  transition: color 0.15s ease-in-out, font-weight 0.15s ease-in-out;
+  line-height: 1;
+  box-sizing: border-box;
+  background-color: transparent;
+}
+.${t.dateCell}:hover:not(.${t.otherMonth}):not(.${t.disabled}) {
+  background-color: var(--ds-color-surface-hover, #eee);
+  position: relative;
+  z-index: 1;
+}
+.${t.otherMonth} {
+  /* Neutral-scoped tokens on purpose: under the red color scope the
+     scope-relative tints turn pink, which emphasized the outside days
+     instead of muting them. */
+  color: var(--ds-color-neutral-text-subtle, #aaa);
+  cursor: default;
+  pointer-events: none;
+  background-color: var(--ds-color-neutral-surface-tinted, #e8e8e8);
+  border: var(--ds-border-width-default, 1px) solid var(--ds-color-neutral-border-subtle, #bcbcbc);
+  margin: -0.5px;
+}
+.${t.selectedDate} {
+  background-color: var(--ds-color-base-default, #C30000);
+  border-color: var(--ds-color-base-default, #C30000);
+  color: var(--ds-color-base-contrast-default, #fff);
+  position: relative;
+  z-index: 1;
+}
+.${t.selectedDate} .${t.dateNumberContainer} {
+  color: var(--ds-color-base-contrast-default, #fff);
+  font-weight: var(--ds-font-weight-semibold, 600);
+  background-color: transparent;
+}
+.${t.todayDate} .${t.dateNumberContainer} {
+  font-weight: var(--ds-font-weight-semibold, 600);
+}
+@media (max-width: 480px) {
+  .${t.calendarContainer} {
+    padding: var(--ds-size-4, 16px);
+    gap: var(--ds-size-2, 8px);
+    width: 100%;
+  }
+  .${t.monthYear} {
+    font-size: var(--ds-heading-xs-font-size, 1.125rem);
+  }
+  .${t.dayNameCell} {
+    padding: var(--ds-size-1, 4px);
+    font-size: var(--ds-font-size-1, 12px);
+  }
+  .${t.dateCell} {
+    padding: var(--ds-size-2, 8px);
+    font-size: var(--ds-font-size-1, 12px);
+  }
+  .${t.dateNumberContainer} {
+    width: 20px;
+    height: 20px;
+  }
+}
+@media (max-width: 360px) {
+  .${t.calendarContainer} {
+    padding: var(--ds-size-2, 8px);
+  }
+  .${t.dayNameCell} {
+    padding: 2px;
+    font-size: 10px;
+  }
+  .${t.dateCell} {
+    padding: var(--ds-size-1, 4px);
+    font-size: 11px;
+  }
+  .${t.dateNumberContainer} {
+    width: 16px;
+    height: 16px;
+  }
+}
+`;
+}
+export {
+  ue as DatePicker
+};

package/dist/components/DatePicker/styles.module.css.js

@@ -0,0 +1,30 @@
+"use client";
+const e = "_calendarContainer_1xn54_1", n = "_calendarHeader_1xn54_16", a = "_monthYear_1xn54_23", t = "_navigationButtons_1xn54_34", o = "_gridWrapper_1xn54_43", r = "_gridRow_1xn54_48", _ = "_dayNameCell_1xn54_55", d = "_dateCell_1xn54_73", l = "_dateNumberContainer_1xn54_106", s = "_otherMonth_1xn54_119", c = "_disabled_1xn54_119", i = "_selectedDate_1xn54_148", x = {
+  calendarContainer: e,
+  calendarHeader: n,
+  monthYear: a,
+  navigationButtons: t,
+  gridWrapper: o,
+  gridRow: r,
+  dayNameCell: _,
+  dateCell: d,
+  dateNumberContainer: l,
+  otherMonth: s,
+  disabled: c,
+  selectedDate: i
+};
+export {
+  e as calendarContainer,
+  n as calendarHeader,
+  d as dateCell,
+  l as dateNumberContainer,
+  _ as dayNameCell,
+  x as default,
+  c as disabled,
+  r as gridRow,
+  o as gridWrapper,
+  a as monthYear,
+  t as navigationButtons,
+  s as otherMonth,
+  i as selectedDate
+};

package/dist/components/Details/index.js

@@ -0,0 +1,6 @@
+"use client";
+import { Details as t } from "@digdir/designsystemet-react";
+const s = t;
+export {
+  s as Details
+};

package/dist/components/Dialog/index.js

@@ -0,0 +1,6 @@
+"use client";
+import { Dialog as o } from "@digdir/designsystemet-react";
+const a = o;
+export {
+  a as Dialog
+};

package/dist/components/Divider/index.js

@@ -0,0 +1,6 @@
+"use client";
+import { Divider as i } from "@digdir/designsystemet-react";
+const r = i;
+export {
+  r as Divider
+};