@rikstv/shared-components 3.0.43 → 3.0.45-1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # 📖 Changelog
 
+## 3.2.0
+
+- Add support for react 19
+- Might not work to use this version for apps that are on `^18`
+
+## 3.0.44
+
+- only add light mode for buttons inside `.strm` (RiksTV are same anyways)
+- fix `box-sizing` for `<TextField>` so it looks better in portal and is easier to style
+- fix css variables for `<Accordion>` in light mode so it works for rikstv
+- fix typography colors in lightmode for RiksTV
+- fix `<TextField>` autoComplete-styling in light mode, and caret color in dark mode
+- fix dropdown icon max-width so portal looks ok
+- style ghost-button as blue for RiksTV since that is well used
+- fix checkbox in lightmode for RiksTV
+
 ## 3.0.43
 
 - Remove the hardcoded letterspacing from the TAG typography element

package/dist/components/accordion/Accordion-C-Lu1AN3.mjs

@@ -0,0 +1,311 @@
+import ee, { useRef as re, useEffect as te } from "react";
+import { C as ne } from "../icons/Chevron-D7z5f5Ni.mjs";
+var w = { exports: {} }, R = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var F;
+function oe() {
+  if (F) return R;
+  F = 1;
+  var c = Symbol.for("react.transitional.element"), m = Symbol.for("react.fragment");
+  function f(d, a, s) {
+    var l = null;
+    if (s !== void 0 && (l = "" + s), a.key !== void 0 && (l = "" + a.key), "key" in a) {
+      s = {};
+      for (var _ in a)
+        _ !== "key" && (s[_] = a[_]);
+    } else s = a;
+    return a = s.ref, {
+      $$typeof: c,
+      type: d,
+      key: l,
+      ref: a !== void 0 ? a : null,
+      props: s
+    };
+  }
+  return R.Fragment = m, R.jsx = f, R.jsxs = f, R;
+}
+var b = {};
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var D;
+function ae() {
+  return D || (D = 1, process.env.NODE_ENV !== "production" && function() {
+    function c(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === B ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case p:
+          return "Fragment";
+        case z:
+          return "Profiler";
+        case U:
+          return "StrictMode";
+        case q:
+          return "Suspense";
+        case X:
+          return "SuspenseList";
+        case Z:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case W:
+            return "Portal";
+          case G:
+            return (e.displayName || "Context") + ".Provider";
+          case V:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case J:
+            var r = e.render;
+            return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case H:
+            return r = e.displayName || null, r !== null ? r : c(e.type) || "Memo";
+          case y:
+            r = e._payload, e = e._init;
+            try {
+              return c(e(r));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function m(e) {
+      return "" + e;
+    }
+    function f(e) {
+      try {
+        m(e);
+        var r = !1;
+      } catch {
+        r = !0;
+      }
+      if (r) {
+        r = console;
+        var t = r.error, n = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return t.call(
+          r,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          n
+        ), m(e);
+      }
+    }
+    function d(e) {
+      if (e === p) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === y)
+        return "<...>";
+      try {
+        var r = c(e);
+        return r ? "<" + r + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function a() {
+      var e = k.A;
+      return e === null ? null : e.getOwner();
+    }
+    function s() {
+      return Error("react-stack-top-frame");
+    }
+    function l(e) {
+      if (g.call(e, "key")) {
+        var r = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (r && r.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function _(e, r) {
+      function t() {
+        N || (N = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          r
+        ));
+      }
+      t.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: t,
+        configurable: !0
+      });
+    }
+    function L() {
+      var e = c(this.type);
+      return C[e] || (C[e] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function M(e, r, t, n, i, u, O, j) {
+      return t = u.ref, e = {
+        $$typeof: x,
+        type: e,
+        key: r,
+        props: u,
+        _owner: i
+      }, (t !== void 0 ? t : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: L
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: O
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: j
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function P(e, r, t, n, i, u, O, j) {
+      var o = r.children;
+      if (o !== void 0)
+        if (n)
+          if (Q(o)) {
+            for (n = 0; n < o.length; n++)
+              h(o[n]);
+            Object.freeze && Object.freeze(o);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else h(o);
+      if (g.call(r, "key")) {
+        o = c(e);
+        var E = Object.keys(r).filter(function(K) {
+          return K !== "key";
+        });
+        n = 0 < E.length ? "{key: someKey, " + E.join(": ..., ") + ": ...}" : "{key: someKey}", I[o + n] || (E = 0 < E.length ? "{" + E.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          n,
+          o,
+          E,
+          o
+        ), I[o + n] = !0);
+      }
+      if (o = null, t !== void 0 && (f(t), o = "" + t), l(r) && (f(r.key), o = "" + r.key), "key" in r) {
+        t = {};
+        for (var S in r)
+          S !== "key" && (t[S] = r[S]);
+      } else t = r;
+      return o && _(
+        t,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), M(
+        e,
+        o,
+        u,
+        i,
+        a(),
+        t,
+        O,
+        j
+      );
+    }
+    function h(e) {
+      typeof e == "object" && e !== null && e.$$typeof === x && e._store && (e._store.validated = 1);
+    }
+    var v = ee, x = Symbol.for("react.transitional.element"), W = Symbol.for("react.portal"), p = Symbol.for("react.fragment"), U = Symbol.for("react.strict_mode"), z = Symbol.for("react.profiler"), V = Symbol.for("react.consumer"), G = Symbol.for("react.context"), J = Symbol.for("react.forward_ref"), q = Symbol.for("react.suspense"), X = Symbol.for("react.suspense_list"), H = Symbol.for("react.memo"), y = Symbol.for("react.lazy"), Z = Symbol.for("react.activity"), B = Symbol.for("react.client.reference"), k = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, g = Object.prototype.hasOwnProperty, Q = Array.isArray, A = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    v = {
+      "react-stack-bottom-frame": function(e) {
+        return e();
+      }
+    };
+    var N, C = {}, Y = v["react-stack-bottom-frame"].bind(
+      v,
+      s
+    )(), $ = A(d(s)), I = {};
+    b.Fragment = p, b.jsx = function(e, r, t, n, i) {
+      var u = 1e4 > k.recentlyCreatedOwnerStacks++;
+      return P(
+        e,
+        r,
+        t,
+        !1,
+        n,
+        i,
+        u ? Error("react-stack-top-frame") : Y,
+        u ? A(d(e)) : $
+      );
+    }, b.jsxs = function(e, r, t, n, i) {
+      var u = 1e4 > k.recentlyCreatedOwnerStacks++;
+      return P(
+        e,
+        r,
+        t,
+        !0,
+        n,
+        i,
+        u ? Error("react-stack-top-frame") : Y,
+        u ? A(d(e)) : $
+      );
+    };
+  }()), b;
+}
+process.env.NODE_ENV === "production" ? w.exports = oe() : w.exports = ae();
+var T = w.exports;
+const ue = ({
+  initialOpen: c = !0,
+  children: m,
+  heading: f,
+  className: d = "",
+  lightBackground: a = !1,
+  ...s
+}) => {
+  const l = re(null);
+  return te(() => {
+    l.current && (l.current.open = c);
+  }, [c]), /* @__PURE__ */ T.jsxs(
+    "details",
+    {
+      ref: l,
+      "data-testid": "rds-accordion",
+      className: `rds-accordion-details ${a ? "rds-accordion-details--light" : ""} ${a === "white" ? "rds-accordion-details--white" : ""} ${d}`,
+      ...s,
+      children: [
+        /* @__PURE__ */ T.jsxs("summary", { "data-testid": "rds-accordion-summary", className: "rds-accordion-details__summary", children: [
+          /* @__PURE__ */ T.jsx(ne, {}),
+          /* @__PURE__ */ T.jsx("div", { className: "rds-accordion-details__summary__content", children: f })
+        ] }),
+        m
+      ]
+    }
+  );
+};
+export {
+  ue as A,
+  T as j
+};

package/dist/components/accordion/accordion.scss

@@ -125,22 +125,17 @@
   }
 }
 
+.rds-light .rds-accordion-details,
 .rds-accordion-details--light {
   // TODO: USE COLORS FROM CORE
   --accordion-color: var(--rds-background-tertiary);
-  --accordion-hover-bg: #d6ffec;
-  --accordion-active-bg: #bcfbde;
-  --accordion-border-color: #5d8b82;
+  --accordion-hover-bg: var(--rds-accordion-light-hover-bg);
+  --accordion-active-bg: var(--rds-accordion-light-active-bg);
+  --accordion-border-color: var(--rds-accordion-light-border-color);
   --accordion-shadow: 0px 4px 8px rgba(0, 75, 80, 0.2);
 }
 
 .rds-accordion-details--white {
   // TODO: USE COLORS FROM CORE
-  --accordion-hover-bg: #edfef6;
-}
-
-.rds-light {
-  .rds-accordion-details {
-    @extend .rds-accordion-details--light;
-  }
+  --accordion-hover-bg: var(--rds-accordion-light-hover-bg, #edfef6);
 }

package/dist/components/alert/{Alert-C3DRURBA.mjs → Alert-D1ytM5Dq.mjs}

@@ -1,8 +1,8 @@
-import { j as s } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as s } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as w, useState as a } from "react";
-import { H as y, B } from "../typography/Typography-qfbU_T11.mjs";
-import "../icons/HeartToggle-BHSYQIN4.mjs";
-import { S as F, a as T, b as o, c as b } from "../icons/Icons-De2TWMGd.mjs";
+import { H as y, B } from "../typography/Typography-BDz_QfCz.mjs";
+import "../icons/HeartToggle-Buv7f9yB.mjs";
+import { S as F, a as T, b as o, c as b } from "../icons/Icons-D0X7KrxA.mjs";
 const O = "_rds-alert--icon_m8jce_67", R = "_rds-alert--content-title_m8jce_79", E = "_rds-alert--content_m8jce_79", H = "_rds-alert--dismiss_m8jce_109", D = "_dismissed_m8jce_138", M = "_dismiss-fade-out_m8jce_1", e = {
   rdsAlertIcon: O,
   rdsAlertContentTitle: R,

package/dist/components/breadcrumb/{Breadcrumb-ou16wYBD.mjs → Breadcrumb-Dpi45ZU-.mjs}

@@ -1,6 +1,6 @@
-import { j as r } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as r } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as u } from "react";
-import { S as d } from "../typography/Typography-qfbU_T11.mjs";
+import { S as d } from "../typography/Typography-BDz_QfCz.mjs";
 const b = u(({ className: a = "", crumbs: s, render: c, ...m }, i) => /* @__PURE__ */ r.jsx("nav", { className: `rds-breadcrumb ${a}`, ref: i, ...m, children: /* @__PURE__ */ r.jsx(d, { children: /* @__PURE__ */ r.jsx("ol", { className: "rds-breadcrumb__list", children: s.map(({ name: e, href: l }, n) => {
   const t = n === s.length - 1;
   return /* @__PURE__ */ r.jsx(

package/dist/components/button/{ArrowButton-C0WywcBN.mjs → ArrowButton-DMr9aNBX.mjs}

@@ -1,7 +1,7 @@
-import { j as s } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as s } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as n } from "react";
-import { P as e, S as u, T as d, G as b } from "./DecoratedButton-B1ElGmyl.mjs";
-import { A as c } from "../icons/Arrow-CHtynMwo.mjs";
+import { P as e, S as u, T as d, G as b } from "./DecoratedButton-BPD31Ccf.mjs";
+import { A as c } from "../icons/Arrow-DpNA_SD7.mjs";
 const w = () => /* @__PURE__ */ s.jsx(c, {}), m = n(
   ({ forwards: r = !0, className: o = "", ...t }, a) => /* @__PURE__ */ s.jsx(
     e,

package/dist/components/button/{BaseButton-B2fMKlSI.mjs → BaseButton-BDwLDH8l.mjs}

@@ -1,4 +1,4 @@
-import { j as s } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as s } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as c } from "react";
 const f = c(
   ({

package/dist/components/button/BaseButton.d.ts

@@ -1,4 +1,5 @@
 import { ButtonHTMLAttributes } from 'react';
+import { JSX } from 'react/jsx-runtime';
 
 export type ButtonStyles = "primary" | "secondary" | "tertiary" | "ghost";
 export type ButtonBackgroundStyles = boolean | "white";

package/dist/components/button/{BaseDecoratedButton-C0cesANX.mjs → BaseDecoratedButton-ChPN1ek7.mjs}

@@ -1,6 +1,6 @@
-import { j as s } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as s } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as c } from "react";
-import { B as m } from "./BaseButton-B2fMKlSI.mjs";
+import { B as m } from "./BaseButton-BDwLDH8l.mjs";
 const x = c(
   ({ children: n, buttonType: t, postfix: r, icon: a, arrow: o, iconClass: e = "", ...d }, i) => /* @__PURE__ */ s.jsx(m, { buttonType: t, ref: i, ...d, children: /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
     a && /* @__PURE__ */ s.jsx("span", { "data-testid": "rds-button__icon", className: `rds-button__icon ${e}`, children: /* @__PURE__ */ s.jsx(a, {}) }),

package/dist/components/button/BaseDecoratedButton.d.ts

@@ -1,4 +1,5 @@
 import { BaseButtonProps, ButtonProps } from './BaseButton';
+import { JSX } from 'react/jsx-runtime';
 
 export interface DecoratedButtonProps extends ButtonProps {
     postfix?: string;

package/dist/components/button/{BaseLinkButton-CquLmqew.mjs → BaseLinkButton-BsJ_29CO.mjs}

@@ -1,7 +1,7 @@
-import { j as r } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as r } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as c } from "react";
-import "./ArrowButton-C0WywcBN.mjs";
-import { A as l } from "../icons/Arrow-CHtynMwo.mjs";
+import "./ArrowButton-DMr9aNBX.mjs";
+import { A as l } from "../icons/Arrow-DpNA_SD7.mjs";
 const p = () => /* @__PURE__ */ r.jsx(l, {}), u = c(
   ({
     element: o,

package/dist/components/button/BaseLinkButton.d.ts

@@ -1,4 +1,5 @@
 import { ButtonBackgroundStyles, ButtonStyles } from './BaseButton';
+import { JSX } from 'react/jsx-runtime';
 
 export type LinkButtonStyles = ButtonStyles | "highlighted";
 interface BaseLinkButtonPropsWithElement<ElementProps> {

package/dist/components/button/{Button-Bs_Tl8uJ.mjs → Button-ChxzP0BI.mjs}

@@ -1,8 +1,8 @@
-import { j as r } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as r } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as n } from "react";
-import { B as s } from "./BaseButton-B2fMKlSI.mjs";
-import "./ArrowButton-C0WywcBN.mjs";
-import "./BaseLinkButton-CquLmqew.mjs";
+import { B as s } from "./BaseButton-BDwLDH8l.mjs";
+import "./ArrowButton-DMr9aNBX.mjs";
+import "./BaseLinkButton-BsJ_29CO.mjs";
 const a = n((t, o) => /* @__PURE__ */ r.jsx(s, { buttonType: "rds-button", buttonStyle: "primary", ref: o, ...t }));
 a.displayName = "PrimaryButton";
 const e = n((t, o) => /* @__PURE__ */ r.jsx(s, { buttonType: "rds-button", buttonStyle: "secondary", ref: o, ...t }));

package/dist/components/button/{DecoratedButton-B1ElGmyl.mjs → DecoratedButton-BPD31Ccf.mjs}

@@ -1,7 +1,7 @@
-import { j as e } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as e } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as r } from "react";
-import { B as a } from "./BaseDecoratedButton-C0cesANX.mjs";
-import "./ArrowButton-C0WywcBN.mjs";
+import { B as a } from "./BaseDecoratedButton-ChPN1ek7.mjs";
+import "./ArrowButton-DMr9aNBX.mjs";
 const s = r(
   (t, o) => /* @__PURE__ */ e.jsx(a, { buttonStyle: "primary", ref: o, ...t })
 );

package/dist/components/button/{IconButton-3TUWI6Mc.mjs → IconButton-DYRG4f36.mjs}

@@ -1,7 +1,7 @@
-import { j as n } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as n } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as r } from "react";
-import { P as a, S as s, T as e, G as c } from "./DecoratedButton-B1ElGmyl.mjs";
-import "./ArrowButton-C0WywcBN.mjs";
+import { P as a, S as s, T as e, G as c } from "./DecoratedButton-BPD31Ccf.mjs";
+import "./ArrowButton-DMr9aNBX.mjs";
 const u = r((t, o) => /* @__PURE__ */ n.jsx(a, { buttonType: "rds-icon-button", ref: o, ...t }));
 u.displayName = "PrimaryIconButton";
 const i = r((t, o) => /* @__PURE__ */ n.jsx(s, { buttonType: "rds-icon-button", ref: o, ...t }));

package/dist/components/button/IconButton.d.ts

@@ -1,4 +1,5 @@
 import { DecoratedButtonProps } from './BaseDecoratedButton';
+import { JSX } from 'react/jsx-runtime';
 
 interface IconButtonProps extends Omit<DecoratedButtonProps, "icon"> {
     icon: () => JSX.Element;

package/dist/components/button/baselink-button.scss

@@ -52,7 +52,10 @@
   .rds-baselink-button--highlighted,
   &.rds-baselink-button--highlighted {
     --highlighted-color: var(--rds-surface-foreground);
-    --highlighted-border-color: var(--strim-romance-green-80); // Add variables in strm.scss and rtv.scss
+    --highlighted-border-color: var(
+      --strim-romance-green-80,
+      var(--rds-surface-foreground)
+    ); // Add variables in strm.scss and rtv.scss
 
     @media (hover: hover) {
       &:hover,

package/dist/components/button/button-shared.scss

@@ -19,10 +19,10 @@
   --common-button--disabled-color: var(--rds-foreground-tertiary);
 
   &--ghost {
-    --common-button--bg: var(--rds-background-ghost);
-    --common-button--color: var(--rds-button-primary-fg);
-    --common-button--hover-bg: var(--rds-accent-hover);
-    --common-button--pressed-bg: var(--rds-accent-color);
+    --common-button--fg: var(--rds-button-ghost-fg);
+    --common-button--bg: var(--rds-button-ghost-bg);
+    --common-button--hover-bg: var(--rds-button-ghost--hover-bg);
+    --common-button--pressed-bg: var(--rds-button-ghost--pressed-bg);
   }
   &--secondary {
     --common-button--bg: var(--rds-background-primary);
@@ -46,7 +46,8 @@
   }
 }
 // light-mode can be a class on the button or ona a ancestor
-.rds-light {
+// rikstv has same style for light/dark mode
+:where(.strm) :where(.rds-light) {
   .rds-button__shared,
   &.rds-button__shared {
     --common-button--bg: var(--rds-button-primary-fg);
@@ -56,8 +57,8 @@
     --common-button--disabled-color: var(--rds-button-tertiary-hover-bg);
 
     &--ghost {
-      --common-button--bg: var(--strim-fantasy-green);
-      --common-button--color: var(--strim-standup-green-10);
+      --common-button--bg: var(--rds-background-primary);
+      --common-button--color: var(--rds-surface-background);
       --common-button--hover-bg: var(--rds-foreground-tertiary);
       --common-button--pressed-bg: var(--rds-background-primary);
     }
@@ -69,7 +70,6 @@
       --common-button--pressed-bg: var(--rds-button-primary-fg);
       --common-button--pressed-color: var(--rds-foreground-primary);
       --common-button--outline: 2px solid var(--rds-button-tertiary-hover-bg);
-      --common-button--disabled-color: var(--rds-button-primary-fg);
     }
     &--tertiary {
       --common-button--bg: var(--rds-button-tertiary-bg);
@@ -84,14 +84,20 @@
     }
   }
 }
+
 // light mode white
-.rds-light.rds-white.rds-button__shared--secondary {
+:where(.strm) .rds-light.rds-white.rds-button__shared--secondary {
   --common-button--bg: var(--rds-foreground-primary);
 }
 // transparent
 .rds-transparent {
   &.rds-button__shared--secondary {
     --common-button--bg: transparent;
+    // Special case for RTV
+    :where(.rtv) &:where(.rds-light) {
+      --common-button--color: var(--rds-background-primary);
+      --common-button--outline: 2px solid var(--rds-background-primary);
+    }
   }
 }
 /*#endregion Button variables per style */

package/dist/components/checkbox/{BaseCheckbox-vLDQvJOz.mjs → BaseCheckbox-Ds7EbRAQ.mjs}

@@ -1,4 +1,4 @@
-import { j as s } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as s } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as x } from "react";
 const b = (e) => {
   if (e)

package/dist/components/checkbox/{Checkbox-D6f5jfzl.mjs → Checkbox-DqG1H_l_.mjs}

@@ -1,6 +1,6 @@
-import { j as c } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as c } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as b } from "react";
-import { B as p } from "./BaseCheckbox-vLDQvJOz.mjs";
+import { B as p } from "./BaseCheckbox-Ds7EbRAQ.mjs";
 const i = b(
   ({ className: r = "", id: o, lightBackground: s, hasError: e, style: a, children: m, ...t }, x) => /* @__PURE__ */ c.jsx(
     p,

package/dist/components/checkbox/checkbox.scss

@@ -17,6 +17,13 @@
     --checkbox-label-color: var(--rds-background-primary);
     --checkbox-error-color: var(--rds-feedback-error-dark);
   }
+  /* Fix RiksTV so checkboxes are not red by default */
+  :where(.rtv) & {
+    --checkbox-border-color: var(--rds-foreground-primary);
+  }
+  :where(.rtv .rds-light) & {
+    --checkbox-border-color: var(--rds-background-primary);
+  }
   /* error overrides */
   &:where(.rds-form-group-box--error) {
     --checkbox-border-color: var(--checkbox-error-color);

package/dist/components/core/{Core-BrDaupPg.mjs → Core-GV7d4sn7.mjs}

@@ -1,4 +1,4 @@
-import { j as i } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as i } from "../accordion/Accordion-C-Lu1AN3.mjs";
 let a = !1, n = !1, u = !1;
 const s = {
   mousedown: c,

package/dist/components/core/{LightMode-DENdo5SC.mjs → LightMode-QGX5KWDc.mjs}

@@ -1,4 +1,4 @@
-import { j as i } from "../accordion/Accordion-CrPiD_81.mjs";
+import { j as i } from "../accordion/Accordion-C-Lu1AN3.mjs";
 import { forwardRef as a } from "react";
 const e = a(
   ({ children: o, className: s = "", ...r }, t) => /* @__PURE__ */ i.jsx("div", { ref: t, className: `rds-light ${s}`, ...r, children: o })

package/dist/components/core/{RiksTV-DwRmJooI.mjs → RiksTV-CLsPQKYj.mjs}

@@ -1,5 +1,5 @@
-import { j as o } from "../accordion/Accordion-CrPiD_81.mjs";
-import { C as s } from "./Core-BrDaupPg.mjs";
+import { j as o } from "../accordion/Accordion-C-Lu1AN3.mjs";
+import { C as s } from "./Core-GV7d4sn7.mjs";
 const m = ({ children: r }) => /* @__PURE__ */ o.jsx(s, { brand: "rtv", children: r });
 export {
   m as R

package/dist/components/core/{Strim-DzoD2YI9.mjs → Strim-D7gNGKkV.mjs}

@@ -1,5 +1,5 @@
-import { j as o } from "../accordion/Accordion-CrPiD_81.mjs";
-import { C as s } from "./Core-BrDaupPg.mjs";
+import { j as o } from "../accordion/Accordion-C-Lu1AN3.mjs";
+import { C as s } from "./Core-GV7d4sn7.mjs";
 const i = ({ children: r }) => /* @__PURE__ */ o.jsx(s, { brand: "strm", children: r });
 export {
   i as S

package/dist/components/core/docs/hooks/Mutation.d.ts

@@ -1 +1 @@
-export declare const Mutation: () => JSX.Element;
+export declare const Mutation: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/core/hooks/useAnimatedHeight.d.ts

@@ -17,4 +17,4 @@ export interface UseAnimatedHeightOptions {
  * with care and attention
  *
  */
-export declare function useAnimatedHeight<T extends HTMLElement>(isOpen: boolean, options?: UseAnimatedHeightOptions): [RefObject<T>, () => void];
+export declare function useAnimatedHeight<T extends HTMLElement>(isOpen: boolean, options?: UseAnimatedHeightOptions): [RefObject<T | null>, () => void];

package/dist/components/core/hooks/useClickOutsideListener.d.ts

@@ -1,7 +1,7 @@
 import { RefObject } from 'react';
 
 interface Props {
-    ref: RefObject<HTMLElement> | null;
+    ref?: RefObject<HTMLElement | null>;
     callback: (e: MouseEvent) => void;
     condition?: boolean;
 }