@blocklet/pages-kit-inner-components 0.4.108 → 0.4.110

package/lib/es/chunks/config-color-B-ax03qd.js

@@ -1,328 +0,0 @@
-import { jsx as o, jsxs as f, Fragment as W } from "react/jsx-runtime";
-import j from "@arcblock/ux/lib/Empty";
-import { useLocaleContext as G } from "@arcblock/ux/lib/Locale/context";
-import { styled as R } from "@arcblock/ux/lib/Theme";
-import { useMuiColorPalette as E } from "@blocklet/pages-kit/contexts/color";
-import { isGradient as B, getSafeGradient as S, isColorString as H } from "@blocklet/pages-kit/utils/style";
-import "@emotion/css";
-import { TextField as L, Stack as P, FormControlLabel as _, Switch as U, Box as a, InputAdornment as X, Dialog as N, DialogTitle as O, Typography as I, ButtonGroup as Y, Button as K, DialogContent as $, Tooltip as q, Skeleton as J, DialogActions as Q } from "@mui/material";
-import { useReactive as Z, useLocalStorageState as ee, useBoolean as oe } from "ahooks";
-import "lodash/without";
-import { forwardRef as A, useState as ie, useEffect as re, useImperativeHandle as V, lazy as te, useCallback as le, Suspense as ne } from "react";
-import ae from "tinycolor2";
-import { red as ce, pink as se, purple as ue, indigo as de, blue as me, cyan as pe, teal as fe, green as ge, lime as he, yellow as ye, amber as be, orange as xe, brown as Ce, grey as ve, blueGrey as ke } from "@mui/material/colors";
-import { getImageSize as z, getVideoSize as D, UploaderButton as Ke } from "../uploader.js";
-import { Icon as we } from "@iconify-icon/react";
-import { useDebounce as Ie } from "react-use";
-import { b as F } from "./state-DsXKwImw.js";
-ce[300], se[300], ue[300], // deepPurple['300'],
-de[300], me[300], // lightBlue['300'],
-pe[300], fe[300], ge[300], // lightGreen['300'],
-he[300], ye[300], be[300], xe[300], // deepOrange['300'],
-Ce[300], ve[300], ke[300];
-const Ue = A(function({ showMarkdown: g, markdown: c, onMarkdownChange: s, showUploader: e, value: t, meta: w, onChange: u, ...d }, y) {
-  const [l, b] = ie("");
-  re(() => {
-    b(t || "");
-  }, [t, b]);
-  const k = async () => {
-    if (l !== t) {
-      const i = F(l);
-      if (!i) {
-        u(l, void 0);
-        return;
-      }
-      const p = await z(i).catch(() => D(i)).catch(() => {
-      });
-      u(l, { ...p, filename: l });
-    }
-  };
-  Ie(
-    () => {
-      l !== t && u(l);
-    },
-    300,
-    [l]
-  ), V(y, () => ({
-    submit: k
-  }));
-  const m = {};
-  return e && (m.InputProps = {
-    sx: { pr: 0 },
-    endAdornment: /* @__PURE__ */ o(X, { position: "end", sx: { mx: 0.5 }, children: /* @__PURE__ */ o(
-      Ke,
-      {
-        onChange: async ({ response: i }) => {
-          var x;
-          const p = (x = i == null ? void 0 : i.data) == null ? void 0 : x.filename, C = F(p) || "";
-          let r = {};
-          C && (r = await z(C).catch(() => D(C)).catch(() => {
-          })), u(p, {
-            ...r,
-            filename: p
-          });
-        }
-      }
-    ) })
-  }), /* @__PURE__ */ o(
-    L,
-    {
-      size: "small",
-      fullWidth: !0,
-      ...d,
-      label: /* @__PURE__ */ f(P, { direction: "row", spacing: 1, alignItems: "center", children: [
-        d.label,
-        g && /* @__PURE__ */ f(W, { children: [
-          " (",
-          /* @__PURE__ */ o(
-            _,
-            {
-              checked: c,
-              label: /* @__PURE__ */ o(a, { component: we, icon: "tabler:markdown", sx: { verticalAlign: "middle" } }),
-              labelPlacement: "start",
-              control: /* @__PURE__ */ o(U, { size: "small" }),
-              sx: { ml: 0.25, pr: 1 },
-              onChange: (i, p) => s == null ? void 0 : s(p)
-            }
-          ),
-          ")"
-        ] })
-      ] }),
-      InputLabelProps: { shrink: !0, ...d.InputLabelProps },
-      value: l,
-      onChange: (i) => b(i.target.value),
-      ...m,
-      onKeyDown: (i) => {
-        i.keyCode !== 229 && i.key === "Enter" && k();
-      }
-    }
-  );
-}), Te = te(() => import("react-best-gradient-color-picker")), M = 400, T = 270;
-function Xe({ color: h, sx: g = {}, ...c }) {
-  H(h);
-  const s = {};
-  return B(h) ? s.backgroundImage = h : s.backgroundColor = h, /* @__PURE__ */ o(
-    a,
-    {
-      sx: {
-        ...g,
-        width: "100%",
-        paddingBottom: "100%",
-        cursor: "pointer",
-        transition: "opacity 0.2s",
-        border: "1px solid #ccc",
-        borderRadius: 0.5,
-        "&:hover": {
-          opacity: 0.75
-        },
-        ...s
-      },
-      ...c
-    }
-  );
-}
-const Ne = A(function({ onSave: g, enableMuiPalette: c = !0 }, s) {
-  const e = Z({
-    value: "",
-    originalMuiKey: null
-  }), { t } = G(), [w, u] = ee("pages-kit:color-picker-active-tab", {
-    defaultValue: 0
-  }), d = E(), y = {};
-  e.value ? B(e.value) ? y.backgroundImage = e.value : y.backgroundColor = e.value : y.border = "1px solid #ccc";
-  const [l, { setFalse: b, setTrue: k }] = oe(!1), m = le(() => {
-    b();
-  }, [b]), i = c && w === 0;
-  V(s, () => ({
-    open({ value: r } = { value: "" }) {
-      if (c && d.isMuiColorKey(r)) {
-        e.originalMuiKey = r;
-        const x = d.getColorByMuiKey(r);
-        e.value = S(x || r), u(0);
-      } else
-        e.originalMuiKey = null, e.value = S(r), c || u(1);
-      k();
-    },
-    close() {
-      m();
-    }
-  }));
-  const p = () => {
-    if (c && d)
-      if (i) {
-        const r = d.getMuiKeyByColor(e.value);
-        g({ value: r || e.value }, m);
-      } else
-        g({ value: e.value }, m);
-    else
-      g({ value: e.value }, m);
-  }, { groupedMuiColors: C } = d;
-  return /* @__PURE__ */ f(N, { disableEnforceFocus: !0, open: l, onClose: m, hideBackdrop: !0, children: [
-    /* @__PURE__ */ f(O, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-      /* @__PURE__ */ o(I, { variant: "inherit", component: "div", children: t("maker.configColor") }),
-      c && /* @__PURE__ */ f(Y, { size: "small", "aria-label": "color mode selector", children: [
-        /* @__PURE__ */ o(
-          K,
-          {
-            variant: i ? "contained" : "outlined",
-            onClick: () => u(0),
-            sx: {
-              fontWeight: 500,
-              textTransform: "none",
-              minWidth: "unset"
-            },
-            children: t("maker.configColorMuiTheme") || "Theme Color"
-          }
-        ),
-        /* @__PURE__ */ o(
-          K,
-          {
-            variant: w === 1 ? "contained" : "outlined",
-            onClick: () => u(1),
-            sx: {
-              fontWeight: 500,
-              textTransform: "none",
-              minWidth: "unset"
-            },
-            children: t("maker.configColorCustomColor") || "Custom Color"
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ f($, { sx: { width: 600, display: "flex", flexDirection: "row", gap: 2, overflowX: "hidden" }, children: [
-      /* @__PURE__ */ f(
-        a,
-        {
-          sx: {
-            ...y,
-            flex: "0 0 270px",
-            borderRadius: 1,
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            position: "sticky",
-            top: 0
-          },
-          children: [
-            !e.value && /* @__PURE__ */ o(j, { children: t("error.notConfig") }),
-            e.originalMuiKey && i && /* @__PURE__ */ o(
-              I,
-              {
-                variant: "body2",
-                sx: {
-                  bgcolor: "rgba(255,255,255,0.7)",
-                  px: 2,
-                  py: 1,
-                  borderRadius: 1,
-                  color: "#000",
-                  maxWidth: "90%",
-                  textAlign: "center"
-                },
-                children: e.originalMuiKey
-              }
-            )
-          ]
-        },
-        "color-preview"
-      ),
-      /* @__PURE__ */ o(a, { sx: { flex: 1 }, children: i ? (
-        // MUI 主题色面板
-        /* @__PURE__ */ o(a, { sx: { height: M }, children: Object.entries(C).map(([r, x]) => /* @__PURE__ */ f(a, { sx: { pb: 1.5 }, children: [
-          /* @__PURE__ */ o(
-            I,
-            {
-              variant: "subtitle2",
-              gutterBottom: !0,
-              sx: { textTransform: "capitalize", mb: 0.5, lineHeight: 1 },
-              children: r
-            }
-          ),
-          /* @__PURE__ */ o(a, { sx: { display: "flex", flexWrap: "wrap", gap: 1 }, children: x.map((n) => {
-            let v = "";
-            return e.originalMuiKey === n.colorKey && (n.colorValue === "transparent" ? v = "rgba(0,0,0,0.7)" : ae(n.colorValue).isDark() ? v = "rgba(255,255,255,0.8)" : v = "rgba(0,0,0,0.7)"), /* @__PURE__ */ o(q, { title: n.colorKey, children: /* @__PURE__ */ o(
-              a,
-              {
-                onClick: () => {
-                  e.value = n.colorValue, e.originalMuiKey = n.colorKey;
-                },
-                sx: {
-                  width: 28,
-                  height: 28,
-                  bgcolor: n.colorValue,
-                  border: e.originalMuiKey === n.colorKey ? `2px solid ${v}` : "1px solid #ccc",
-                  borderRadius: 0.5,
-                  cursor: "pointer",
-                  "&:hover": { opacity: 0.8 },
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  // 透明色时显示棋盘背景
-                  ...n.colorValue === "transparent" ? {
-                    background: "repeating-conic-gradient(#CCCCCC 0% 25%, #FFFFFF 0% 50%) 50% / 10px 10px"
-                  } : {}
-                },
-                children: e.originalMuiKey === n.colorKey && /* @__PURE__ */ o(
-                  "i",
-                  {
-                    className: "i-mdi:check",
-                    style: {
-                      color: v,
-                      fontSize: "1.2rem"
-                    }
-                  }
-                )
-              }
-            ) }, n.colorKey);
-          }) })
-        ] }, r)) })
-      ) : (
-        // 自定义颜色选择器
-        /* @__PURE__ */ o(a, { sx: { overflowY: "auto", overflowX: "hidden" }, children: /* @__PURE__ */ o(ne, { fallback: /* @__PURE__ */ o(J, { variant: "rectangular", width: T, height: M }), children: /* @__PURE__ */ o(
-          Te,
-          {
-            disableDarkMode: !0,
-            width: T,
-            height: T,
-            value: e.value,
-            onChange: (r) => {
-              e.value = r, e.originalMuiKey = null;
-            },
-            hidePresets: !0,
-            hideAdvancedSliders: !0,
-            hideColorGuide: !0,
-            hideInputType: !0
-          }
-        ) }) })
-      ) })
-    ] }),
-    /* @__PURE__ */ f(Q, { children: [
-      /* @__PURE__ */ o(K, { variant: "outlined", size: "small", onClick: m, children: t("common.cancel") }),
-      /* @__PURE__ */ o(K, { variant: "contained", size: "small", onClick: p, children: t("maker.save") })
-    ] })
-  ] });
-});
-R(a)`
-  .color-item {
-    position: relative;
-  }
-  .color-item__checked {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: rgba(255, 255, 255, 0.85);
-  }
-  .color-item__delete {
-    position: absolute;
-    top: 0;
-    right: 0;
-  }
-`;
-export {
-  Ue as C,
-  Xe as a,
-  Ne as b
-};