@orioncactuscorp/ui 1.10.0 → 1.11.0

package/dist/components/Modal/useModalContentBlockTransition.js

@@ -1,58 +1,63 @@
-import { useRef as r, useCallback as d, useLayoutEffect as S, useEffect as N } from "react";
-const w = 600, E = 4;
-function v(t) {
-  const n = Number.parseFloat(window.getComputedStyle(t).height);
-  return Number.isFinite(n) && n > 0 ? n : t.getBoundingClientRect().height;
+import { useRef as r, useCallback as T, useLayoutEffect as E, useEffect as S } from "react";
+const _ = 600, O = 4, B = 1;
+function g(e) {
+  const n = Number.parseFloat(window.getComputedStyle(e).height);
+  return Number.isFinite(n) && n > 0 ? n : e.getBoundingClientRect().height;
 }
-function B({
-  enabled: t,
+function w({
+  enabled: e,
   node: n
 }) {
-  const s = r(null), i = r(null), a = r(null), T = r(null), l = r(!1), o = r(0), g = r(!1), f = d(() => {
-    T.current?.(), T.current = null;
-  }, []), u = d(() => {
-    i.current !== null && (window.cancelAnimationFrame(i.current), i.current = null), a.current !== null && (window.clearTimeout(a.current), a.current = null), f();
-  }, [f]), h = d(() => {
-    const e = s.current;
-    e && (u(), e.style.removeProperty("height"), e.dataset.ocContentTransitionState = "idle", l.current = !1, o.current = v(e));
-  }, [u]), C = d(() => {
-    const e = s.current;
-    !e || !t || l.current || i.current === null && (i.current = window.requestAnimationFrame(() => {
-      i.current = null;
-      const m = o.current, c = v(e);
-      if (!g.current) {
-        g.current = !0, o.current = c;
+  const a = r(null), c = r(null), l = r(null), h = r(null), f = r(!1), i = r(0), v = r(0), m = r(!1), d = T(() => {
+    h.current?.(), h.current = null;
+  }, []), u = T(() => {
+    c.current !== null && (window.cancelAnimationFrame(c.current), c.current = null), l.current !== null && (window.clearTimeout(l.current), l.current = null), d();
+  }, [d]), C = T(() => {
+    const t = a.current;
+    t && (u(), t.style.removeProperty("height"), t.dataset.ocContentTransitionState = "idle", f.current = !1, i.current = g(t));
+  }, [u]), p = T(() => {
+    const t = a.current;
+    !t || !e || f.current || c.current === null && (c.current = window.requestAnimationFrame(() => {
+      c.current = null;
+      const s = i.current, o = g(t);
+      if (!m.current) {
+        m.current = !0, i.current = o;
         return;
       }
-      if (m <= 0 || Math.abs(c - m) <= E) {
-        o.current = c;
+      if (Math.abs(o - v.current) > B) {
+        i.current = o;
         return;
       }
-      l.current = !0, e.dataset.ocContentTransitionState = "changing", e.style.height = `${m}px`, e.getBoundingClientRect(), e.style.height = `${c}px`, o.current = c;
-      const p = (R) => {
-        R.target !== e || R.propertyName !== "height" || (e.removeEventListener("transitionend", p), h());
+      if (s <= 0 || Math.abs(o - s) <= O) {
+        i.current = o;
+        return;
+      }
+      f.current = !0, t.dataset.ocContentTransitionState = "changing", t.style.height = `${s}px`, t.getBoundingClientRect(), t.style.height = `${o}px`, i.current = o;
+      const N = (R) => {
+        R.target !== t || R.propertyName !== "height" || (t.removeEventListener("transitionend", N), C());
       };
-      f(), e.addEventListener("transitionend", p), T.current = () => {
-        e.removeEventListener("transitionend", p);
-      }, a.current = window.setTimeout(() => {
-        h();
-      }, w);
+      d(), t.addEventListener("transitionend", N), h.current = () => {
+        t.removeEventListener("transitionend", N);
+      }, l.current = window.setTimeout(() => {
+        C();
+      }, _);
     }));
-  }, [t, h, f]);
-  S(() => {
-    s.current = n;
-    const e = s.current;
-    e && (o.current = v(e), g.current = !1, t || (u(), e.style.removeProperty("height"), e.dataset.ocContentTransitionState = "idle", l.current = !1));
-  }, [u, t, n]), N(() => {
-    if (!n || !t || typeof ResizeObserver > "u")
+  }, [e, C, d]);
+  E(() => {
+    a.current = n;
+    const t = a.current;
+    t && (i.current = g(t), m.current = !1, e || (u(), t.style.removeProperty("height"), t.dataset.ocContentTransitionState = "idle", f.current = !1));
+  }, [u, e, n]), S(() => {
+    if (!n || !e || typeof ResizeObserver > "u")
       return;
-    const e = new ResizeObserver(() => {
-      C();
+    const t = new ResizeObserver(() => {
+      const s = a.current;
+      s && (v.current = g(s)), p();
     });
-    return e.observe(n), () => {
-      e.disconnect();
+    return t.observe(n), () => {
+      t.disconnect();
     };
-  }, [t, n, C]), N(
+  }, [e, n, p]), S(
     () => () => {
       u();
     },
@@ -60,5 +65,5 @@ function B({
   );
 }
 export {
-  B as useModalContentBlockTransition
+  w as useModalContentBlockTransition
 };

package/dist/components/Radio/Radio.css

@@ -1 +1 @@
-.oc-Radio-module__radio__qhO7H{font-size:calc(var(--oc-typo-size-body2) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body2) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body2);display:inline-flex;position:relative;align-items:flex-start;gap:.5em;opacity:1;color:var(--oc-color-theme-label-normal);transition:opacity calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1.5) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Radio-module__radio__qhO7H{transition-property:opacity;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1.5);transition-timing-function:var(--oc-motion-timing-feedback)}}.oc-Radio-module__radio__qhO7H{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.oc-Radio-module__radio__qhO7H:has([data-oc-part=input]:disabled){opacity:var(--oc-color-global-opacity-43);cursor:not-allowed}.oc-Radio-module__radio__qhO7H{--oc-radio-icon-scale: .675}.oc-Radio-module__fill__h24zJ{display:flex;inline-size:100%}.oc-Radio-module__small__PGRQA{font-size:calc(var(--oc-typo-size-body2) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body2) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body2);--oc-radio-control-size: var(--oc-typo-height-body2);--oc-radio-content-height: var(--oc-typo-height-body2)}.oc-Radio-module__medium__OItEm{font-size:calc(var(--oc-typo-size-body1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body1);--oc-radio-control-size: var(--oc-typo-height-body1);--oc-radio-content-height: var(--oc-typo-height-body1)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]{position:absolute;opacity:0;pointer-events:none;inline-size:0;block-size:0}.oc-Radio-module__radio__qhO7H [data-oc-part=container]{position:relative;isolation:isolate;flex-shrink:0;padding:.125em;inline-size:var(--oc-radio-control-size);block-size:var(--oc-radio-control-size);--oc-interaction-inset-x: -.25em;--oc-interaction-inset-y: -.25em;--oc-interaction-z-index: 2;--oc-interaction-radius: var(--oc-atomic-radius-max)}.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{display:flex;box-shadow:inset 0 0 0 1.5px currentcolor}@supports (-webkit-backdrop-filter: none){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{box-shadow:inset 0 0 0 1px currentcolor}@media only screen and (resolution:2dppx){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{box-shadow:inset 0 0 0 1.5px currentcolor}}@media only screen and (resolution:3dppx){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{box-shadow:inset 0 0 0 1.6666px currentcolor}}}.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{border-radius:var(--oc-atomic-radius-max);inline-size:100%;block-size:100%;color:var(--oc-color-theme-line-normal-normal);transition:color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback),background-color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{transition-property:color,background-color;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-feedback)}}.oc-Radio-module__radio__qhO7H [data-oc-part=icon-wrapper]{display:flex;align-items:center;justify-content:center;transform:scale(var(--oc-radio-icon-scale));inline-size:100%;block-size:100%;color:transparent;transition:color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Radio-module__radio__qhO7H [data-oc-part=icon-wrapper]{transition-property:color;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-feedback)}}.oc-Radio-module__radio__qhO7H [data-oc-part=icon-wrapper]>svg{inline-size:100%;block-size:100%;padding:.125rem}.oc-Radio-module__radio__qhO7H [data-oc-part=content]{display:flex;flex:1;align-items:flex-start;gap:var(--oc-space-item-gap-tiny);min-inline-size:0;padding-block:calc((var(--oc-radio-control-size) - var(--oc-radio-content-height)) / 2)}.oc-Radio-module__radio__qhO7H [data-oc-part=label]{-webkit-user-select:none;user-select:none}.oc-Radio-module__radio__qhO7H [data-oc-part=trailing-compound]{display:flex;flex-shrink:0;margin-inline-start:auto}.oc-Radio-module__fill__h24zJ [data-oc-part=label]{flex:1}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:disabled+[data-oc-part=container] [data-oc-part=wrapper]{color:var(--oc-color-theme-line-normal-alternative)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:checked+[data-oc-part=container] [data-oc-part=wrapper]{color:transparent;background-color:var(--oc-color-theme-primary-normal)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:checked+[data-oc-part=container] [data-oc-part=icon-wrapper]{color:var(--oc-color-theme-static-white)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:focus-visible+[data-oc-part=container] [data-oc-part=wrapper]{outline:2px solid var(--oc-color-theme-primary-normal);outline-offset:2px}
+.oc-Radio-module__radio__qhO7H{font-size:calc(var(--oc-typo-size-body2) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body2) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body2);display:inline-flex;position:relative;align-items:flex-start;gap:.5em;opacity:1;color:var(--oc-color-theme-label-normal);transition:opacity calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1.5) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Radio-module__radio__qhO7H{transition-property:opacity;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1.5);transition-timing-function:var(--oc-motion-timing-feedback)}}.oc-Radio-module__radio__qhO7H{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.oc-Radio-module__radio__qhO7H:has([data-oc-part=input]:disabled){opacity:var(--oc-color-global-opacity-43);cursor:not-allowed}.oc-Radio-module__radio__qhO7H{--oc-radio-icon-scale: .675}.oc-Radio-module__fill__h24zJ{display:flex;inline-size:100%}.oc-Radio-module__small__PGRQA{font-size:calc(var(--oc-typo-size-body2) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body2) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body2);--oc-radio-control-size: var(--oc-typo-height-body2);--oc-radio-content-height: var(--oc-typo-height-body2)}.oc-Radio-module__medium__OItEm{font-size:calc(var(--oc-typo-size-body1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body1);--oc-radio-control-size: var(--oc-typo-height-body1);--oc-radio-content-height: var(--oc-typo-height-body1)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]{position:absolute;opacity:0;pointer-events:none;inline-size:0;block-size:0}.oc-Radio-module__radio__qhO7H [data-oc-part=container]{position:relative;isolation:isolate;flex-shrink:0;padding:.125em;inline-size:var(--oc-radio-control-size);block-size:var(--oc-radio-control-size);--oc-interaction-inset-x: -.25em;--oc-interaction-inset-y: -.25em;--oc-interaction-z-index: 2;--oc-interaction-radius: var(--oc-atomic-radius-max)}.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{display:flex;box-shadow:inset 0 0 0 1.5px currentcolor}@supports (-webkit-backdrop-filter: none){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{box-shadow:inset 0 0 0 1px currentcolor}@media only screen and (resolution:2dppx){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{box-shadow:inset 0 0 0 1.5px currentcolor}}@media only screen and (resolution:3dppx){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{box-shadow:inset 0 0 0 1.6666px currentcolor}}}.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{border-radius:var(--oc-atomic-radius-max);inline-size:100%;block-size:100%;color:var(--oc-color-theme-line-normal-normal);transition:color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback),background-color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Radio-module__radio__qhO7H [data-oc-part=wrapper]{transition-property:color,background-color;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-feedback)}}.oc-Radio-module__radio__qhO7H [data-oc-part=icon-wrapper]{display:flex;align-items:center;justify-content:center;transform:scale(var(--oc-radio-icon-scale));inline-size:100%;block-size:100%;color:transparent;transition:color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Radio-module__radio__qhO7H [data-oc-part=icon-wrapper]{transition-property:color;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-feedback)}}.oc-Radio-module__radio__qhO7H [data-oc-part=icon-wrapper]>svg{inline-size:100%;block-size:100%;padding:.125rem}.oc-Radio-module__radio__qhO7H [data-oc-part=content]{display:flex;flex:1;align-items:flex-start;gap:var(--oc-space-item-gap-tiny);min-inline-size:0;padding-block:calc((var(--oc-radio-control-size) - var(--oc-radio-content-height)) / 2)}.oc-Radio-module__radio__qhO7H [data-oc-part=label]{-webkit-user-select:none;user-select:none}.oc-Radio-module__radio__qhO7H [data-oc-part=trailing-compound]{display:flex;flex-shrink:0;margin-inline-start:auto}.oc-Radio-module__fill__h24zJ [data-oc-part=label]{flex:1}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:disabled+[data-oc-part=container] [data-oc-part=wrapper]{color:var(--oc-color-theme-line-normal-alternative)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:checked+[data-oc-part=container] [data-oc-part=wrapper]{color:transparent;background-color:var(--oc-color-theme-primary-normal)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:checked+[data-oc-part=container] [data-oc-part=icon-wrapper]{color:var(--oc-color-theme-static-white)}.oc-Radio-module__radio__qhO7H [data-oc-part=input]:focus-visible+[data-oc-part=container] [data-oc-part=wrapper]{outline:var(--oc-focus-ring-width) solid var(--oc-color-theme-focus-ring);outline-offset:var(--oc-focus-ring-offset)}