@functionalui/functionalui 0.2.1 → 0.2.4

package/dist/radio/index.mjs

@@ -0,0 +1,121 @@
+"use client";
+import { jsx as o, jsxs as x } from "react/jsx-runtime";
+import { d as k, c as I, u as L } from "../react-spring_web.modern-DgQDaJ06.js";
+import { C as i } from "../component-C1Gs4nVu.js";
+import { L as w } from "../component-DRXQXr2G.js";
+import { C as d } from "../generics-D33J7ILI.js";
+import { a as u } from "../values-CSE3dLnv.js";
+import { S as F } from "../generics-C-WSPclF.js";
+import { h as A, b as E } from "../classes-CVxy1f4M.js";
+import { S as R } from "../generics-BrMr2-Gs.js";
+import { useState as y, useEffect as g } from "react";
+const W = ({
+  id: t,
+  checked: e,
+  size: a = R.Size3,
+  handleChange: s = () => {
+  },
+  vertigo: l,
+  ref: c,
+  children: h,
+  ...C
+}) => {
+  const [r, m] = y(e), [f, p] = y(!1), S = (n) => {
+    m(n), s(t, n);
+  };
+  return g(() => {
+    const n = (b) => {
+      !f || r || b.key === " " && S(!0);
+    };
+    return document && document.addEventListener("keydown", n, !1), () => {
+      document && document.removeEventListener("keydown", n, !1);
+    };
+  }, [f, r]), g(() => {
+    m(e);
+  }, [e]), /* @__PURE__ */ o(
+    i,
+    {
+      onClick: () => {
+        l && r || (m(!r), s(t, r));
+      },
+      style: { cursor: "pointer" },
+      tabIndex: 0,
+      role: "button",
+      onFocus: () => p(!0),
+      onBlur: () => p(!1),
+      children: /* @__PURE__ */ x(w, { display: E.Flex, flexAlignItem: A.Center, children: [
+        /* @__PURE__ */ o(j, { checked: r, size: a }),
+        /* @__PURE__ */ o(
+          i,
+          {
+            marginLeft: F.Size1,
+            style: { transform: "translateY(-1px)", userSelect: "none" },
+            children: h
+          }
+        ),
+        /* @__PURE__ */ o(
+          "input",
+          {
+            ref: c,
+            id: t,
+            checked: r,
+            onChange: () => {
+            },
+            type: "radio",
+            style: {
+              appearance: "none",
+              backgroundColor: "transparent",
+              margin: 0,
+              display: "none"
+            },
+            ...C
+          }
+        )
+      ] })
+    }
+  );
+}, j = ({ checked: t, size: e }) => {
+  const a = k(t, {
+    from: { opacity: 0, scale: 0.6 },
+    enter: { opacity: 1, scale: 1 },
+    leave: { opacity: 0, scale: 0.6 },
+    config: {
+      ...I.stiff
+    }
+  }), s = L({
+    borderColor: t ? u[d.Primary5] : u[d.Grey5]
+  });
+  return /* @__PURE__ */ o(
+    i,
+    {
+      style: {
+        ...s,
+        width: e,
+        height: e,
+        borderRadius: "50%",
+        borderWidth: 2,
+        borderStyle: "solid",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center"
+      },
+      children: a(
+        (l, c) => c && /* @__PURE__ */ o(
+          i,
+          {
+            style: {
+              ...l,
+              width: e - 10,
+              height: e - 10,
+              borderRadius: "50%",
+              backgroundColor: u[d.Primary5]
+            }
+          }
+        )
+      )
+    }
+  );
+};
+export {
+  W as Radio
+};