bj-web-components 0.2.27 → 0.2.28

package/dist/web/Switch/Switch.mjs

@@ -1,47 +1,57 @@
-import { jsx as t, jsxs as N } from "react/jsx-runtime";
-import { useState as x, useCallback as B } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
 /* empty css             */
-const C = ({
-  checked: r,
-  defaultChecked: u = !1,
-  onChange: c,
-  disabled: e = !1,
-  loading: l = !1,
-  checkedChildren: a,
-  unCheckedChildren: o,
-  theme: n = "light",
-  activeColor: b,
-  inactiveColor: w,
-  className: d,
-  style: k
+const BuSwitch = ({
+  checked: controlledChecked,
+  defaultChecked = false,
+  onChange,
+  disabled = false,
+  loading = false,
+  checkedChildren,
+  unCheckedChildren,
+  theme = "light",
+  activeColor,
+  inactiveColor,
+  className,
+  style
 }) => {
-  const i = r !== void 0, [v, f] = x(u), s = i ? r : v, p = B(() => {
-    if (e || l) return;
-    const h = !s;
-    i || f(h), c == null || c(h);
-  }, [s, e, l, i, c]), _ = s ? b ?? (n === "dark" ? "var(--bu-switch-dark-on)" : "var(--bu-switch-light-on)") : w ?? (n === "dark" ? "var(--bu-switch-dark-off)" : "var(--bu-switch-light-off)"), m = [
+  const isControlled = controlledChecked !== void 0;
+  const [internalChecked, setInternalChecked] = useState(defaultChecked);
+  const isChecked = isControlled ? controlledChecked : internalChecked;
+  const handleClick = useCallback(() => {
+    if (disabled || loading) return;
+    const next = !isChecked;
+    if (!isControlled) {
+      setInternalChecked(next);
+    }
+    onChange == null ? void 0 : onChange(next);
+  }, [isChecked, disabled, loading, isControlled, onChange]);
+  const resolvedActiveColor = activeColor ?? (theme === "dark" ? "var(--bu-switch-dark-on)" : "var(--bu-switch-light-on)");
+  const resolvedInactiveColor = inactiveColor ?? (theme === "dark" ? "var(--bu-switch-dark-off)" : "var(--bu-switch-light-off)");
+  const trackBg = isChecked ? resolvedActiveColor : resolvedInactiveColor;
+  const rootCls = [
     "bu-switch",
-    s && "bu-switch--checked",
-    e && "bu-switch--disabled",
-    l && "bu-switch--loading",
-    d
+    isChecked && "bu-switch--checked",
+    disabled && "bu-switch--disabled",
+    loading && "bu-switch--loading",
+    className
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ t(
+  return /* @__PURE__ */ jsx(
     "button",
     {
       type: "button",
       role: "switch",
-      "aria-checked": s,
-      "aria-disabled": e,
-      className: m,
+      "aria-checked": isChecked,
+      "aria-disabled": disabled,
+      className: rootCls,
       style: {
-        "--bu-switch-track-bg": _,
-        ...k
+        "--bu-switch-track-bg": trackBg,
+        ...style
       },
-      onClick: p,
-      children: /* @__PURE__ */ N("span", { className: "bu-switch__track", children: [
-        o != null && /* @__PURE__ */ t("span", { className: "bu-switch__label bu-switch__label--left", children: o }),
-        /* @__PURE__ */ t("span", { className: "bu-switch__thumb", children: l && /* @__PURE__ */ t("span", { className: "bu-switch__loading-icon", children: /* @__PURE__ */ t("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ t(
+      onClick: handleClick,
+      children: /* @__PURE__ */ jsxs("span", { className: "bu-switch__track", children: [
+        unCheckedChildren != null && /* @__PURE__ */ jsx("span", { className: "bu-switch__label bu-switch__label--left", children: unCheckedChildren }),
+        /* @__PURE__ */ jsx("span", { className: "bu-switch__thumb", children: loading && /* @__PURE__ */ jsx("span", { className: "bu-switch__loading-icon", children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
           "path",
           {
             d: "M8 1.5a6.5 6.5 0 0 1 6.5 6.5",
@@ -50,12 +60,12 @@ const C = ({
             strokeLinecap: "round"
           }
         ) }) }) }),
-        a != null && /* @__PURE__ */ t("span", { className: "bu-switch__label bu-switch__label--right", children: a })
+        checkedChildren != null && /* @__PURE__ */ jsx("span", { className: "bu-switch__label bu-switch__label--right", children: checkedChildren })
       ] })
     }
   );
 };
-C.displayName = "BuSwitch";
+BuSwitch.displayName = "BuSwitch";
 export {
-  C as default
+  BuSwitch as default
 };