@equinor/roma-ui 0.1.0 → 0.2.0

package/switch.mjs

@@ -1,68 +1,43 @@
-import { jsxs as S, jsx as r } from "react/jsx-runtime";
-import { useSwitch as _, useFocusRing as x, useHover as R, VisuallyHidden as O } from "react-aria";
-import { useState as k, useRef as C, useEffect as L, useCallback as v, useMemo as w } from "react";
-import { tokens as a } from "@equinor/eds-tokens";
-import { useEds as D, Typography as $ } from "@equinor/eds-core-react";
-function V(e, t, i) {
-  let [o, f] = k(e || t), u = C(e !== void 0), l = e !== void 0;
-  L(() => {
-    let c = u.current;
-    c !== l && process.env.NODE_ENV !== "production" && console.warn(`WARN: A component changed from ${c ? "controlled" : "uncontrolled"} to ${l ? "controlled" : "uncontrolled"}.`), u.current = l;
-  }, [
-    l
-  ]);
-  let d = l ? e : o, b = v((c, ...s) => {
-    let n = (h, ...p) => {
-      i && (Object.is(d, h) || i(h, ...p)), l || (d = h);
-    };
-    typeof c == "function" ? (process.env.NODE_ENV !== "production" && console.warn("We can not support a function callback. See Github Issues for details https://github.com/adobe/react-spectrum/issues/2320"), f((p, ...y) => {
-      let g = c(l ? d : p, ...y);
-      return n(g, ...s), l ? p : g;
-    })) : (l || f(c), n(c, ...s));
-  }, [
-    l,
-    d,
-    i
-  ]);
-  return [
-    d,
-    b
-  ];
-}
-function E(e = {}) {
-  let { isReadOnly: t } = e, [i, o] = V(e.isSelected, e.defaultSelected || !1, e.onChange);
-  function f(l) {
-    t || o(l);
+import { jsxs as h, jsx as l } from "react/jsx-runtime";
+import { useSwitch as b, useFocusRing as x, useHover as _, VisuallyHidden as v } from "react-aria";
+import { useRef as C, useMemo as R } from "react";
+import { tokens as c } from "@equinor/eds-tokens";
+import { useEds as L, Typography as k } from "@equinor/eds-core-react";
+import { $ as O } from "./useControlledState-u436Wbp1.mjs";
+function $(t = {}) {
+  let { isReadOnly: e } = t, [i, s] = O(t.isSelected, t.defaultSelected || !1, t.onChange);
+  function o(f) {
+    e || s(f);
   }
-  function u() {
-    t || o(!i);
+  function d() {
+    e || s(!i);
   }
   return {
     isSelected: i,
-    setSelected: f,
-    toggle: u
+    setSelected: o,
+    toggle: d
   };
 }
-const m = {
+const y = {
   close: "M8.21967 9.28033C8.51256 9.57322 8.98744 9.57322 9.28033 9.28033C9.57322 8.98744 9.57322 8.51256 9.28033 8.21967L6.06066 5L9.28033 1.78033C9.57322 1.48744 9.57322 1.01256 9.28033 0.71967C8.98744 0.426777 8.51256 0.426777 8.21967 0.71967L5 3.93934L1.78033 0.71967C1.48744 0.426777 1.01256 0.426777 0.71967 0.71967C0.426777 1.01256 0.426777 1.48744 0.71967 1.78033L3.93934 5L0.71967 8.21967C0.426777 8.51256 0.426777 8.98744 0.71967 9.28033C1.01256 9.57322 1.48744 9.57322 1.78033 9.28033L5 6.06066L8.21967 9.28033Z",
   check: "M13.0303 4.21967C13.3232 4.51256 13.3232 4.98744 13.0303 5.28033L6.78033 11.5303C6.48744 11.8232 6.01256 11.8232 5.71967 11.5303L2.96967 8.78033C2.67678 8.48744 2.67678 8.01256 2.96967 7.71967C3.26256 7.42678 3.73744 7.42678 4.03033 7.71967L6.25 9.93934L11.9697 4.21967C12.2626 3.92678 12.7374 3.92678 13.0303 4.21967Z"
 };
-function W(e) {
-  const t = {
-    ...e,
-    isDisabled: e.isDisabled ?? e.disabled,
-    isReadOnly: e.isReadOnly ?? e.readOnly,
-    isSelected: e.isSelected ?? e.checked,
-    defaultSelected: e.defaultSelected ?? e.defaultChecked
-  }, i = E(t), o = C(null), { inputProps: f } = _(t, i, o), { isFocusVisible: u, focusProps: l } = x(), { isHovered: d, hoverProps: b } = R({ isDisabled: !1 }), { density: c } = D(), s = c === "compact", n = w(() => ({
-    ripple: a.colors.interactive.primary__hover_alt.rgba,
-    background: i.isSelected ? a.colors.interactive.primary__resting.hex : "rgba(220, 220, 220, 1)",
-    circle: i.isSelected ? a.colors.interactive.primary__hover_alt.hex : "rgba(111, 111, 111, 1)",
-    icon: i.isSelected ? a.colors.interactive.primary__resting.hex : "white",
-    focus: a.colors.interactive.primary__resting.hex
-  }), [i.isSelected]), h = s ? 32 : 48, p = s ? 4 : 12, y = s ? 0 : 8;
-  return /* @__PURE__ */ S(
-    $,
+function F(t) {
+  const e = {
+    ...t,
+    isDisabled: t.isDisabled ?? t.disabled,
+    isReadOnly: t.isReadOnly ?? t.readOnly,
+    isSelected: t.isSelected ?? t.checked,
+    defaultSelected: t.defaultSelected ?? t.defaultChecked
+  }, i = $(e), s = C(null), { inputProps: o } = b(e, i, s), { isFocusVisible: d, focusProps: f } = x(), { isHovered: u, hoverProps: g } = _({ isDisabled: !1 }), { density: p } = L(), r = p === "compact", n = R(() => ({
+    ripple: c.colors.interactive.primary__hover_alt.rgba,
+    background: i.isSelected ? c.colors.interactive.primary__resting.hex : "rgba(220, 220, 220, 1)",
+    circle: i.isSelected ? c.colors.interactive.primary__hover_alt.hex : "rgba(111, 111, 111, 1)",
+    icon: i.isSelected ? c.colors.interactive.primary__resting.hex : "white",
+    focus: c.colors.interactive.primary__resting.hex
+  }), [i.isSelected]), m = r ? 32 : 48, S = r ? 4 : 12, a = r ? 0 : 8;
+  return /* @__PURE__ */ h(
+    k,
     {
       as: "label",
       variant: "text",
@@ -70,72 +45,73 @@ function W(e) {
       style: {
         display: "flex",
         alignItems: "center",
-        color: t.isReadOnly || t.isDisabled ? a.colors.text.static_icons__tertiary.rgba : a.colors.text.static_icons__default.rgba,
-        cursor: t.isReadOnly || t.isDisabled ? "not-allowed" : "pointer"
+        width: "fit-content",
+        color: e.isReadOnly || e.isDisabled ? c.colors.text.static_icons__tertiary.rgba : c.colors.text.static_icons__default.rgba,
+        cursor: e.isReadOnly || e.isDisabled ? "not-allowed" : "pointer"
       },
       children: [
-        /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("input", { ...f, ...l, ref: o }) }),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ l(v, { children: /* @__PURE__ */ l("input", { ...o, ...f, ref: s }) }),
+        /* @__PURE__ */ l(
           "div",
           {
-            style: { display: "inline", height: s ? 32 : 48 },
-            ...b,
-            children: /* @__PURE__ */ S(
+            style: { display: "inline", height: r ? 32 : 48 },
+            ...g,
+            children: /* @__PURE__ */ h(
               "svg",
               {
                 width: 60,
-                height: h,
+                height: m,
                 "aria-hidden": "true",
                 style: {
                   marginRight: 4,
-                  opacity: t.isDisabled || t.isReadOnly ? 0.4 : 1
+                  opacity: e.isDisabled || e.isReadOnly ? 0.4 : 1
                 },
                 children: [
-                  d && !t.isDisabled && !t.isReadOnly && /* @__PURE__ */ r(
+                  u && !e.isDisabled && !e.isReadOnly && /* @__PURE__ */ l(
                     "circle",
                     {
                       cx: i.isSelected ? 42 : 20,
-                      cy: 16 + y,
-                      r: s ? 16 : 20,
+                      cy: 16 + a,
+                      r: r ? 16 : 20,
                       fill: n.ripple
                     }
                   ),
-                  /* @__PURE__ */ r(
+                  /* @__PURE__ */ l(
                     "rect",
                     {
                       x: 8,
-                      y: p,
+                      y: S,
                       width: 46,
                       height: 24,
                       rx: 12,
                       fill: n.background
                     }
                   ),
-                  /* @__PURE__ */ r(
+                  /* @__PURE__ */ l(
                     "circle",
                     {
                       cx: i.isSelected ? 42 : 20,
-                      cy: 16 + y,
+                      cy: 16 + a,
                       r: 9.5,
                       fill: n.circle
                     }
                   ),
-                  /* @__PURE__ */ r(
+                  /* @__PURE__ */ l(
                     "path",
                     {
                       fillRule: "evenodd",
                       clipRule: "evenodd",
-                      d: i.isSelected ? m.check : m.close,
-                      transform: `translate(${i.isSelected ? 32 : 14},${(i.isSelected ? 6 : 10) + y}) scale(1.2)`,
+                      d: i.isSelected ? y.check : y.close,
+                      transform: `translate(${i.isSelected ? 32 : 14},${(i.isSelected ? 6 : 10) + a}) scale(1.2)`,
                       fill: n.icon,
                       style: { pointerEvents: "none" }
                     }
                   ),
-                  u && /* @__PURE__ */ r(
+                  d && /* @__PURE__ */ l(
                     "rect",
                     {
                       x: 6,
-                      y,
+                      y: a,
                       width: 50,
                       height: 32,
                       rx: 12,
@@ -150,11 +126,11 @@ function W(e) {
             )
           }
         ),
-        t.children ?? t.label
+        e.children ?? e.label
       ]
     }
   );
 }
 export {
-  W as Switch
+  F as Switch
 };

package/useControlledState-D0L6S_5r.js

@@ -0,0 +1 @@
+"use strict";const s=require("react");function E(o,p,l){let[b,i]=s.useState(o||p),u=s.useRef(o!==void 0),e=o!==void 0;s.useEffect(()=>{let t=u.current;t!==e&&process.env.NODE_ENV!=="production"&&console.warn(`WARN: A component changed from ${t?"controlled":"uncontrolled"} to ${e?"controlled":"uncontrolled"}.`),u.current=e},[e]);let n=e?o:b,$=s.useCallback((t,...f)=>{let a=(c,...r)=>{l&&(Object.is(n,c)||l(c,...r)),e||(n=c)};typeof t=="function"?(process.env.NODE_ENV!=="production"&&console.warn("We can not support a function callback. See Github Issues for details https://github.com/adobe/react-spectrum/issues/2320"),i((r,...V)=>{let d=t(e?n:r,...V);return a(d,...f),e?r:d})):(e||i(t),a(t,...f))},[e,n,l]);return[n,$]}exports.$458b0a5536c1a7cf$export$40bfa8c7b0832715=E;

package/useControlledState-u436Wbp1.mjs

@@ -0,0 +1,30 @@
+import { useState as V, useRef as $, useEffect as E, useCallback as N } from "react";
+function h(o, a, l) {
+  let [p, s] = V(o || a), i = $(o !== void 0), e = o !== void 0;
+  E(() => {
+    let t = i.current;
+    t !== e && process.env.NODE_ENV !== "production" && console.warn(`WARN: A component changed from ${t ? "controlled" : "uncontrolled"} to ${e ? "controlled" : "uncontrolled"}.`), i.current = e;
+  }, [
+    e
+  ]);
+  let n = e ? o : p, b = N((t, ...u) => {
+    let f = (r, ...c) => {
+      l && (Object.is(n, r) || l(r, ...c)), e || (n = r);
+    };
+    typeof t == "function" ? (process.env.NODE_ENV !== "production" && console.warn("We can not support a function callback. See Github Issues for details https://github.com/adobe/react-spectrum/issues/2320"), s((c, ...m) => {
+      let d = t(e ? n : c, ...m);
+      return f(d, ...u), e ? c : d;
+    })) : (e || s(t), f(t, ...u));
+  }, [
+    e,
+    n,
+    l
+  ]);
+  return [
+    n,
+    b
+  ];
+}
+export {
+  h as $
+};