@blocklet/labels 1.5.132 → 1.5.133

package/dist/index.es.js

@@ -1,10 +1,10 @@
+import { jsx as n, jsxs as C, Fragment as P } from "react/jsx-runtime";
 import { createContext as q, useRef as D, useState as z, useCallback as k, useEffect as W, useMemo as T, useContext as H } from "react";
 import { ExpandMore as R, Translate as X, Add as ee, EditOutlined as te, DeleteOutlineOutlined as ne, Edit as re, LabelOutlined as oe } from "@mui/icons-material";
 import p from "@mui/material/Box";
 import { styled as J } from "@mui/material/styles";
 import { Tree as le } from "react-arborist";
 import { Icon as ie } from "@iconify/react";
-import { jsx as n, jsxs as C, Fragment as P } from "react/jsx-runtime";
 import ae from "lodash/omit";
 import se, { components as _ } from "react-select";
 import ce from "@mui/material/Typography";
@@ -19,25 +19,7 @@ import pe from "@mui/material/Popover";
 import { useLocaleContext as Q } from "@arcblock/ux/lib/Locale/context";
 import fe from "@mui/material/Alert";
 import me from "@mui/material/Chip";
-const ge = (e) => /* @__PURE__ */ n("svg", {
-  viewBox: "0 0 24 24",
-  width: "1.2em",
-  height: "1.2em",
-  ...e,
-  children: /* @__PURE__ */ n("path", {
-    fill: "currentColor",
-    d: "M5 19q-.825 0-1.413-.587Q3 17.825 3 17V7q0-.825.587-1.412Q4.175 5 5 5h10q.5 0 .938.225q.437.225.712.625l3.525 5q.375.525.375 1.15q0 .625-.375 1.15l-3.525 5q-.275.4-.712.625Q15.5 19 15 19Z"
-  })
-}), xe = (e) => /* @__PURE__ */ n("svg", {
-  viewBox: "0 0 24 24",
-  width: "1.2em",
-  height: "1.2em",
-  ...e,
-  children: /* @__PURE__ */ n("path", {
-    fill: "currentColor",
-    d: "m10 16.4l-4-4L7.4 11l2.6 2.6L16.6 7L18 8.4Z"
-  })
-}), Y = q({});
+const ge = (e) => /* @__PURE__ */ n("svg", { viewBox: "0 0 24 24", width: "1.2em", height: "1.2em", ...e, children: /* @__PURE__ */ n("path", { fill: "currentColor", d: "M5 19q-.825 0-1.413-.587Q3 17.825 3 17V7q0-.825.587-1.412Q4.175 5 5 5h10q.5 0 .938.225q.437.225.712.625l3.525 5q.375.525.375 1.15q0 .625-.375 1.15l-3.525 5q-.275.4-.712.625Q15.5 19 15 19Z" }) }), xe = (e) => /* @__PURE__ */ n("svg", { viewBox: "0 0 24 24", width: "1.2em", height: "1.2em", ...e, children: /* @__PURE__ */ n("path", { fill: "currentColor", d: "m10 16.4l-4-4L7.4 11l2.6 2.6L16.6 7L18 8.4Z" }) }), Y = q({});
 function ye({
   selectable: e = !1,
   selected: t = [],
@@ -55,102 +37,45 @@ function ye({
       select: i,
       renderItem: o
     }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     [t]
   );
-  return /* @__PURE__ */ n(Y.Provider, {
-    value: s,
-    children: l
-  });
+  return /* @__PURE__ */ n(Y.Provider, { value: s, children: l });
 }
 const Ce = (e) => {
   var t;
   return e.isLeaf || !((t = e.data.children) != null && t.length);
 };
-function ve({
-  node: e
-}) {
-  return Ce(e) ? /* @__PURE__ */ n("span", {}) : e.isOpen ? /* @__PURE__ */ n(R, {
-    style: {
-      fontSize: 20
-    }
-  }) : /* @__PURE__ */ n(R, {
-    style: {
-      fontSize: 20,
-      transform: "rotate(-90deg)"
-    }
-  });
+function ve({ node: e }) {
+  return Ce(e) ? /* @__PURE__ */ n("span", {}) : e.isOpen ? /* @__PURE__ */ n(R, { style: { fontSize: 20 } }) : /* @__PURE__ */ n(R, { style: { fontSize: 20, transform: "rotate(-90deg)" } });
 }
-function be({
-  node: e,
-  style: t,
-  dragHandle: a
-}) {
-  const {
-    selectable: o,
-    select: l,
-    isSelected: r,
-    renderItem: i
-  } = H(Y), {
-    data: s
-  } = e, h = s.icon ? /* @__PURE__ */ n(ie, {
-    icon: s.icon,
-    style: {
-      fontSize: 18
-    }
-  }) : /* @__PURE__ */ n(ge, {
-    style: {
-      fontSize: 18,
-      color: s.color || "#ddd"
-    }
-  }), g = (d) => {
+function be({ node: e, style: t, dragHandle: a }) {
+  const { selectable: o, select: l, isSelected: r, renderItem: i } = H(Y), { data: s } = e, h = s.icon ? /* @__PURE__ */ n(ie, { icon: s.icon, style: { fontSize: 18 } }) : /* @__PURE__ */ n(ge, { style: { fontSize: 18, color: s.color || "#ddd" } }), g = (d) => {
     d.stopPropagation(), e.isInternal && e.toggle();
   }, f = (d) => {
     d.stopPropagation(), o && l(e.id);
-  }, x = /* @__PURE__ */ C(P, {
-    children: [/* @__PURE__ */ C(p, {
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        flex: 1
-      },
-      children: [/* @__PURE__ */ n(p, {
-        sx: {
-          display: "flex",
-          cursor: "pointer"
-        },
-        onClick: g,
-        children: /* @__PURE__ */ n(ve, {
-          node: e
-        })
-      }), /* @__PURE__ */ n(p, {
-        sx: {
-          display: "flex",
-          alignItems: "center",
-          width: 22,
-          height: 22
-        },
-        children: h
-      }), /* @__PURE__ */ n(p, {
-        component: "span",
-        sx: {
-          color: "grey.700"
-        },
-        children: e.data.name
-      })]
-    }), o && r(e.id) && /* @__PURE__ */ n(xe, {})]
-  });
-  return /* @__PURE__ */ C(p, {
-    className: "label-tree-item",
-    style: t,
-    sx: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between"
-    },
-    ref: a,
-    onClick: f,
-    children: [!i && x, !!i && i(x, e.data)]
-  });
+  }, x = /* @__PURE__ */ C(P, { children: [
+    /* @__PURE__ */ C(p, { sx: { display: "flex", alignItems: "center", flex: 1 }, children: [
+      /* @__PURE__ */ n(p, { sx: { display: "flex", cursor: "pointer" }, onClick: g, children: /* @__PURE__ */ n(ve, { node: e }) }),
+      /* @__PURE__ */ n(p, { sx: { display: "flex", alignItems: "center", width: 22, height: 22 }, children: h }),
+      /* @__PURE__ */ n(p, { component: "span", sx: { color: "grey.700" }, children: e.data.name })
+    ] }),
+    o && r(e.id) && /* @__PURE__ */ n(xe, {})
+  ] });
+  return /* @__PURE__ */ C(
+    p,
+    {
+      className: "label-tree-item",
+      style: t,
+      sx: { display: "flex", alignItems: "center", justifyContent: "space-between" },
+      ref: a,
+      onClick: f,
+      children: [
+        !i && x,
+        !!i && i(x, e.data)
+      ]
+    }
+  );
 }
 const Se = J(p)`
   > div,
@@ -182,27 +107,9 @@ function F({
   }, [l]);
   return W(() => {
     d();
-  }, [e, d]), /* @__PURE__ */ n(ye, {
-    selectable: t,
-    selected: a,
-    onSelect: o,
-    renderItem: r,
-    children: /* @__PURE__ */ n(Se, {
-      ...s,
-      sx: g,
-      children: /* @__PURE__ */ n(le, {
-        data: e,
-        rowHeight: l,
-        height: f,
-        indent: 32,
-        ref: h,
-        onToggle: () => {
-          setTimeout(d);
-        },
-        children: be
-      })
-    })
-  });
+  }, [e, d]), /* @__PURE__ */ n(ye, { selectable: t, selected: a, onSelect: o, renderItem: r, children: /* @__PURE__ */ n(Se, { ...s, sx: g, children: /* @__PURE__ */ n(le, { data: e, rowHeight: l, height: f, indent: 32, ref: h, onToggle: () => {
+    setTimeout(d);
+  }, children: be }) }) });
 }
 const O = (e) => e.reduce((t, a) => {
   var o;
@@ -227,61 +134,45 @@ const O = (e) => e.reduce((t, a) => {
     r.parent && o[r.parent] && (l.parent = o[r.parent]), r.children && (l.children = r.children.map((i) => o[i]));
   }), a.filter((l) => !l.parent);
 }, ze = (e) => {
-  const {
-    options: t,
-    getValue: a,
-    selectProps: o,
-    selectOption: l
-  } = e, r = a(), i = (s) => {
+  const { options: t, getValue: a, selectProps: o, selectOption: l } = e, r = a(), i = (s) => {
     const h = t.find((g) => g.data.id === s);
     h && l(h);
   };
-  return /* @__PURE__ */ C(P, {
-    children: [/* @__PURE__ */ n(_.MenuList, {
-      ...ae(e, ["addon"]),
-      children: /* @__PURE__ */ n(p, {
+  return /* @__PURE__ */ C(P, { children: [
+    /* @__PURE__ */ n(_.MenuList, { ...ae(e, ["addon"]), children: /* @__PURE__ */ n(p, { sx: { px: 2, py: 1 }, children: /* @__PURE__ */ n(
+      F,
+      {
+        data: o.data,
+        selectable: !0,
+        onSelect: i,
+        selected: r.map((s) => s.data.id)
+      }
+    ) }) }),
+    e.addon
+  ] });
+}, Te = ({ children: e, ...t }) => {
+  const [a, o] = e, l = Array.isArray(a) ? a.length : 0;
+  return /* @__PURE__ */ C(_.ValueContainer, { ...t, children: [
+    /* @__PURE__ */ n(p, { component: "span", sx: { fontSize: 13, fontWeight: "bold" }, children: l ? "Labels" : "Filter by labels" }),
+    !!l && /* @__PURE__ */ n(
+      p,
+      {
         sx: {
-          px: 2,
-          py: 1
+          display: "inline-flex",
+          justifyContent: "center",
+          alignItems: "center",
+          width: 22,
+          height: 22,
+          ml: 1,
+          borderRadius: "100%",
+          fontSize: 12,
+          bgcolor: "grey.200"
         },
-        children: /* @__PURE__ */ n(F, {
-          data: o.data,
-          selectable: !0,
-          onSelect: i,
-          selected: r.map((s) => s.data.id)
-        })
-      })
-    }), e.addon]
-  });
-}, Te = ({
-  children: e,
-  ...t
-}) => {
-  const [a, o] = e, l = Array.isArray(a) ? a.length : 0;
-  return /* @__PURE__ */ C(_.ValueContainer, {
-    ...t,
-    children: [/* @__PURE__ */ n(p, {
-      component: "span",
-      sx: {
-        fontSize: 13,
-        fontWeight: "bold"
-      },
-      children: l ? "Labels" : "Filter by labels"
-    }), !!l && /* @__PURE__ */ n(p, {
-      sx: {
-        display: "inline-flex",
-        justifyContent: "center",
-        alignItems: "center",
-        width: 22,
-        height: 22,
-        ml: 1,
-        borderRadius: "100%",
-        fontSize: 12,
-        bgcolor: "grey.200"
-      },
-      children: l
-    }), o]
-  });
+        children: l
+      }
+    ),
+    o
+  ] });
 }, ke = {
   control: (e) => ({
     ...e,
@@ -311,14 +202,13 @@ function Ae({
   maxHeight: s = 264,
   ...h
 }) {
-  const g = D(null), f = T(() => O(e).map((m) => ({
-    data: m,
-    label: m.name,
-    value: m.id
-  })), [e]), x = f.reduce((m, I) => ({
-    ...m,
-    [I.data.id]: I
-  }), {}), d = Array.isArray(t) ? t : [t], b = d.map((m) => x[m]), u = D({
+  const g = D(null), f = T(
+    () => O(e).map((m) => ({ data: m, label: m.name, value: m.id })),
+    [e]
+  ), x = f.reduce(
+    (m, I) => ({ ...m, [I.data.id]: I }),
+    {}
+  ), d = Array.isArray(t) ? t : [t], b = d.map((m) => x[m]), u = D({
     prev: d.map((m) => {
       var I;
       return ((I = x[m]) == null ? void 0 : I.data) || "";
@@ -331,30 +221,25 @@ function Ae({
   }, M = () => {
     u.current.current && JSON.stringify(u.current.prev.map((I) => I.id)) !== JSON.stringify(u.current.current.map((I) => I.id)) && (l(u.current.current), u.current.prev = u.current.current);
   };
-  return /* @__PURE__ */ n(p, {
-    ...h,
-    children: /* @__PURE__ */ n(se, {
+  return /* @__PURE__ */ n(p, { ...h, children: /* @__PURE__ */ n(
+    se,
+    {
       ref: g,
       defaultValue: b,
       options: f,
       onChange: v,
       components: {
-        MenuList: (m) => /* @__PURE__ */ n(ze, {
-          ...m,
-          addon: o
-        }),
-        ...r && {
-          ValueContainer: Te
-        }
+        // @ts-ignore
+        MenuList: (m) => /* @__PURE__ */ n(ze, { ...m, addon: o }),
+        // eslint-disable-line react/no-unstable-nested-components
+        ...r && { ValueContainer: Te }
       },
       placeholder: "Select labels",
       styles: {
         ...r && ke,
         menu: (m) => ({
           ...m,
-          ...a && {
-            paddingBottom: "36px"
-          },
+          ...a && { paddingBottom: "36px" },
           zIndex: 99
         }),
         menuList: (m) => ({
@@ -378,8 +263,8 @@ function Ae({
       onMenuClose: M,
       isClearable: !0,
       data: e
-    })
-  });
+    }
+  ) });
 }
 var L = function() {
   return L = Object.assign || function(t) {
@@ -423,284 +308,172 @@ var Oe = function(e) {
   return [a, l];
 };
 const Be = Pe;
-function Ee({
-  I18NProps: e,
-  ...t
-}) {
-  const {
-    languages: a
-  } = Q(), {
-    translation: o,
-    onChange: l
-  } = e, [r, i] = z(null), s = (f) => {
+function Ee({ I18NProps: e, ...t }) {
+  const { languages: a } = Q(), { translation: o, onChange: l } = e, [r, i] = z(null), s = (f) => {
     const x = f.currentTarget.closest(".MuiInputBase-root");
     x && i(x);
   }, h = () => {
     i(null);
   }, g = a.filter((f) => f.code !== "en");
-  return /* @__PURE__ */ n(V, {
-    ...t,
-    InputProps: {
-      endAdornment: /* @__PURE__ */ C(ue, {
-        position: "end",
-        children: [/* @__PURE__ */ n(he, {
-          edge: "end",
-          onClick: s,
-          children: /* @__PURE__ */ n(X, {})
-        }), /* @__PURE__ */ n(pe, {
-          open: !!r,
-          anchorEl: r,
-          onClose: h,
-          transformOrigin: {
-            vertical: "top",
-            horizontal: "right"
-          },
-          anchorOrigin: {
-            vertical: "bottom",
-            horizontal: "right"
-          },
-          PaperProps: {
-            sx: {
-              width: r == null ? void 0 : r.clientWidth,
-              maxHeight: 200,
-              overflowY: "auto",
-              bgcolor: "grey.50"
-            }
-          },
-          elevation: 1,
-          sx: {
-            mt: 2
-          },
-          children: /* @__PURE__ */ n(B, {
-            sx: {
-              p: 2
-            },
-            children: g.map(({
-              code: f,
-              name: x
-            }) => /* @__PURE__ */ C(B, {
-              sx: {
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "space-between",
-                "& + &": {
-                  mt: 1
-                }
+  return /* @__PURE__ */ n(
+    V,
+    {
+      ...t,
+      InputProps: {
+        endAdornment: /* @__PURE__ */ C(ue, { position: "end", children: [
+          /* @__PURE__ */ n(he, { edge: "end", onClick: s, children: /* @__PURE__ */ n(X, {}) }),
+          /* @__PURE__ */ n(
+            pe,
+            {
+              open: !!r,
+              anchorEl: r,
+              onClose: h,
+              transformOrigin: {
+                vertical: "top",
+                horizontal: "right"
               },
-              children: [/* @__PURE__ */ n(B, {
-                sx: {
-                  flex: "0 0 120px"
-                },
-                children: x
-              }), /* @__PURE__ */ n(B, {
-                sx: {
-                  flex: 1
-                },
-                children: /* @__PURE__ */ n(V, {
-                  value: o[f] || "",
-                  size: "small",
+              anchorOrigin: {
+                vertical: "bottom",
+                horizontal: "right"
+              },
+              PaperProps: {
+                sx: { width: r == null ? void 0 : r.clientWidth, maxHeight: 200, overflowY: "auto", bgcolor: "grey.50" }
+              },
+              elevation: 1,
+              sx: { mt: 2 },
+              children: /* @__PURE__ */ n(B, { sx: { p: 2 }, children: g.map(({ code: f, name: x }) => /* @__PURE__ */ C(
+                B,
+                {
                   sx: {
-                    width: 1
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "space-between",
+                    "& + &": { mt: 1 }
                   },
-                  onChange: (d) => l({
-                    ...o,
-                    [f]: d.target.value
-                  })
-                })
-              })]
-            }, f))
-          })
-        })]
-      })
+                  children: [
+                    /* @__PURE__ */ n(B, { sx: { flex: "0 0 120px" }, children: x }),
+                    /* @__PURE__ */ n(B, { sx: { flex: 1 }, children: /* @__PURE__ */ n(
+                      V,
+                      {
+                        value: o[f] || "",
+                        size: "small",
+                        sx: { width: 1 },
+                        onChange: (d) => l({ ...o, [f]: d.target.value })
+                      }
+                    ) })
+                  ]
+                },
+                f
+              )) })
+            }
+          )
+        ] })
+      }
     }
-  });
+  );
 }
-function Le({
-  open: e,
-  initialLabel: t,
-  onSubmit: a,
-  onClose: o,
-  ...l
-}) {
+function Le({ open: e, initialLabel: t, onSubmit: a, onClose: o, ...l }) {
   const r = !(t != null && t.id), [i, s] = Be({
     name: (t == null ? void 0 : t.name) || "",
     color: (t == null ? void 0 : t.color) || "#ddd",
     slug: (t == null ? void 0 : t.id) || "",
     translation: (t == null ? void 0 : t.translation) || {}
   }), h = (v) => /^#([0-9A-F]{3}){1,2}$/i.test(v), g = T(() => r ? i.name && i.color && i.slug && h(i.color) : i.name && i.color && h(i.color), [i, r]), [f, x] = z(!1), d = () => {
-    a({
-      ...t,
-      name: i.name,
-      color: i.color,
-      id: i.slug,
-      translation: i.translation
-    });
+    a({ ...t, name: i.name, color: i.color, id: i.slug, translation: i.translation });
   }, b = (v) => {
-    s({
-      color: v.hex
-    }), setTimeout(() => x(!1));
+    s({ color: v.hex }), setTimeout(() => x(!1));
   }, u = (v) => {
-    s({
-      color: v.target.value
-    });
+    s({ color: v.target.value });
   };
-  return /* @__PURE__ */ n(K, {
-    open: e,
-    showCloseButton: !0,
-    maxWidth: "lg",
-    title: r ? "Create label" : "Edit label",
-    actions: /* @__PURE__ */ C(P, {
-      children: [/* @__PURE__ */ n(A, {
-        color: "inherit",
-        variant: "contained",
-        size: "small",
-        onClick: o,
-        children: "Cancel"
-      }), /* @__PURE__ */ n(A, {
-        color: "primary",
-        variant: "contained",
-        size: "small",
-        onClick: d,
-        disabled: !g,
-        children: r ? "Create" : "Save Changes"
-      })]
-    }),
-    onClose: o,
-    ...l,
-    children: /* @__PURE__ */ C(p, {
-      width: 600,
-      minHeight: 280,
-      children: [/* @__PURE__ */ n(Ee, {
-        label: "Name",
-        value: i.name,
-        placeholder: "New label",
-        size: "small",
-        fullWidth: !0,
-        onChange: (v) => s({
-          name: v.target.value
-        }),
-        I18NProps: {
-          translation: i.translation,
-          onChange: (v) => s({
-            translation: v
-          })
-        }
-      }), /* @__PURE__ */ n(j, {
-        label: "Slug",
-        value: i.slug,
-        size: "small",
-        fullWidth: !0,
-        disabled: !r,
-        onChange: (v) => s({
-          slug: v.target.value
-        }),
-        sx: {
-          mt: 2
-        }
-      }), (t == null ? void 0 : t.parent) && /* @__PURE__ */ n(j, {
-        label: "Parent",
-        value: t.parent.name,
-        size: "small",
-        fullWidth: !0,
-        disabled: !0,
-        sx: {
-          mt: 2
-        }
-      }), /* @__PURE__ */ n($, {
-        onClickAway: () => x(!1),
-        children: /* @__PURE__ */ C(p, {
-          sx: {
-            position: "relative",
-            mt: 2
-          },
-          children: [/* @__PURE__ */ C(p, {
-            sx: {
-              display: "flex",
-              alignItems: "center",
-              gap: 1
-            },
-            children: [/* @__PURE__ */ n(p, {
-              sx: {
-                width: 30,
-                height: 30,
-                bgcolor: i.color,
-                borderRadius: 1
-              },
-              onClick: () => x(!0)
-            }), /* @__PURE__ */ n(j, {
-              label: "",
-              value: i.color,
-              size: "small",
-              onChange: u,
-              inputProps: {
-                maxLength: 7
-              },
-              sx: {
-                width: 100,
-                ".MuiInputBase-root": {
-                  height: 32
-                }
+  return /* @__PURE__ */ n(
+    K,
+    {
+      open: e,
+      showCloseButton: !0,
+      maxWidth: "lg",
+      title: r ? "Create label" : "Edit label",
+      actions: /* @__PURE__ */ C(P, { children: [
+        /* @__PURE__ */ n(A, { color: "inherit", variant: "contained", size: "small", onClick: o, children: "Cancel" }),
+        /* @__PURE__ */ n(A, { color: "primary", variant: "contained", size: "small", onClick: d, disabled: !g, children: r ? "Create" : "Save Changes" })
+      ] }),
+      onClose: o,
+      ...l,
+      children: /* @__PURE__ */ C(p, { width: 600, minHeight: 280, children: [
+        /* @__PURE__ */ n(
+          Ee,
+          {
+            label: "Name",
+            value: i.name,
+            placeholder: "New label",
+            size: "small",
+            fullWidth: !0,
+            onChange: (v) => s({ name: v.target.value }),
+            I18NProps: {
+              translation: i.translation,
+              onChange: (v) => s({ translation: v })
+            }
+          }
+        ),
+        /* @__PURE__ */ n(
+          j,
+          {
+            label: "Slug",
+            value: i.slug,
+            size: "small",
+            fullWidth: !0,
+            disabled: !r,
+            onChange: (v) => s({ slug: v.target.value }),
+            sx: { mt: 2 }
+          }
+        ),
+        (t == null ? void 0 : t.parent) && /* @__PURE__ */ n(j, { label: "Parent", value: t.parent.name, size: "small", fullWidth: !0, disabled: !0, sx: { mt: 2 } }),
+        /* @__PURE__ */ n($, { onClickAway: () => x(!1), children: /* @__PURE__ */ C(p, { sx: { position: "relative", mt: 2 }, children: [
+          /* @__PURE__ */ C(p, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+            /* @__PURE__ */ n(
+              p,
+              {
+                sx: { width: 30, height: 30, bgcolor: i.color, borderRadius: 1 },
+                onClick: () => x(!0)
               }
-            })]
-          }), f && /* @__PURE__ */ n(p, {
-            sx: {
-              position: "absolute",
-              top: 48,
-              zIndex: 1
-            },
-            children: /* @__PURE__ */ n(de, {
-              color: i.color,
-              onChangeComplete: b
-            })
-          })]
-        })
-      })]
-    })
-  });
+            ),
+            /* @__PURE__ */ n(
+              j,
+              {
+                label: "",
+                value: i.color,
+                size: "small",
+                onChange: u,
+                inputProps: { maxLength: 7 },
+                sx: { width: 100, ".MuiInputBase-root": { height: 32 } }
+              }
+            )
+          ] }),
+          f && /* @__PURE__ */ n(p, { sx: { position: "absolute", top: 48, zIndex: 1 }, children: /* @__PURE__ */ n(de, { color: i.color, onChangeComplete: b }) })
+        ] }) })
+      ] })
+    }
+  );
 }
-function Me({
-  open: e,
-  label: t,
-  onSubmit: a,
-  onClose: o,
-  ...l
-}) {
-  return /* @__PURE__ */ n(K, {
-    open: e,
-    showCloseButton: !0,
-    maxWidth: "md",
-    title: "Delete",
-    actions: /* @__PURE__ */ C(P, {
-      children: [/* @__PURE__ */ n(A, {
-        color: "inherit",
-        variant: "contained",
-        size: "small",
-        onClick: o,
-        children: "Cancel"
-      }), /* @__PURE__ */ n(A, {
-        color: "primary",
-        variant: "contained",
-        size: "small",
-        onClick: a,
-        children: "Delete"
-      })]
-    }),
-    onClose: o,
-    ...l,
-    children: /* @__PURE__ */ C(p, {
-      width: 600,
-      minHeight: 280,
-      children: [/* @__PURE__ */ n(fe, {
-        severity: "info",
-        sx: {
-          mb: 2
-        },
-        children: "Are you sure you want to delete these labels ?"
-      }), /* @__PURE__ */ n(F, {
-        data: [t]
-      })]
-    })
-  });
+function Me({ open: e, label: t, onSubmit: a, onClose: o, ...l }) {
+  return /* @__PURE__ */ n(
+    K,
+    {
+      open: e,
+      showCloseButton: !0,
+      maxWidth: "md",
+      title: "Delete",
+      actions: /* @__PURE__ */ C(P, { children: [
+        /* @__PURE__ */ n(A, { color: "inherit", variant: "contained", size: "small", onClick: o, children: "Cancel" }),
+        /* @__PURE__ */ n(A, { color: "primary", variant: "contained", size: "small", onClick: a, children: "Delete" })
+      ] }),
+      onClose: o,
+      ...l,
+      children: /* @__PURE__ */ C(p, { width: 600, minHeight: 280, children: [
+        /* @__PURE__ */ n(fe, { severity: "info", sx: { mb: 2 }, children: "Are you sure you want to delete these labels ?" }),
+        /* @__PURE__ */ n(F, { data: [t] })
+      ] })
+    }
+  );
 }
 const je = J(F)`
   .label-tree-item {
@@ -723,52 +496,35 @@ const je = J(F)`
     padding: 0 16px;
   }
 `;
-function De({
-  locale: e,
-  value: t
-}) {
-  return /* @__PURE__ */ C(p, {
-    sx: {
-      display: "flex",
-      alignItems: "center",
-      flex: "0 0 auto",
-      px: 1,
-      py: 0.25,
-      fontSize: 12,
-      bgcolor: "grey.300",
-      borderRadius: 2
-    },
-    className: "label-translation-tag",
-    children: [/* @__PURE__ */ n(p, {
+function De({ locale: e, value: t }) {
+  return /* @__PURE__ */ C(
+    p,
+    {
       sx: {
-        pr: 0.5,
-        borderRight: 1,
-        borderColor: "grey.400"
-      },
-      children: e
-    }), /* @__PURE__ */ n(p, {
-      sx: {
-        pl: 0.5
+        display: "flex",
+        alignItems: "center",
+        flex: "0 0 auto",
+        px: 1,
+        py: 0.25,
+        fontSize: 12,
+        bgcolor: "grey.300",
+        borderRadius: 2
       },
-      children: t
-    })]
-  });
+      className: "label-translation-tag",
+      children: [
+        /* @__PURE__ */ n(p, { sx: { pr: 0.5, borderRight: 1, borderColor: "grey.400" }, children: e }),
+        /* @__PURE__ */ n(p, { sx: { pl: 0.5 }, children: t })
+      ]
+    }
+  );
 }
-function lt({
-  data: e,
-  api: t,
-  ...a
-}) {
+function lt({ data: e, api: t, ...a }) {
   const [o, l] = z(null), [r, i] = z(null), [s, h] = z(Z(e)), g = T(() => O(s), [s]), f = T(() => {
     const c = (y, w) => y.map((S) => (w && (S.parent = w), S.children && (S.children = c(S.children, S)), S));
     return c(s);
   }, [s]), x = (c) => {
     var y, w;
-    c.parent ? (c.parent.children = (w = (y = c.parent) == null ? void 0 : y.children) == null ? void 0 : w.map((S) => S.id === c.id ? {
-      ...c
-    } : S), x(c.parent)) : h(s.map((S) => S.id === c.id ? {
-      ...c
-    } : S));
+    c.parent ? (c.parent.children = (w = (y = c.parent) == null ? void 0 : y.children) == null ? void 0 : w.map((S) => S.id === c.id ? { ...c } : S), x(c.parent)) : h(s.map((S) => S.id === c.id ? { ...c } : S));
   }, d = (c) => {
     c.parent ? (c.parent.children = c.parent.children || [], c.parent.children.push(c), h([...s])) : h([...s, c]);
   }, b = (c) => {
@@ -777,186 +533,83 @@ function lt({
   }, u = (c) => {
     if (o)
       return;
-    l({
-      id: "",
-      name: "New label",
-      parent: c,
-      color: "#dddddd"
-    });
+    l({ id: "", name: "New label", parent: c, color: "#dddddd" });
   }, v = (c) => {
     o || l(c);
   }, M = async (c) => {
     if (!o)
       return;
-    const {
-      parent: y,
-      children: w,
-      translation: S,
-      ...N
-    } = c;
-    o.id ? (await t.updateLabel({
-      ...N,
-      translation: JSON.stringify(S),
-      parentId: y == null ? void 0 : y.id
-    }), x(c)) : (await t.createLabel({
-      ...N,
-      translation: JSON.stringify(S),
-      parentId: y == null ? void 0 : y.id
-    }), d(c)), l(null);
+    const { parent: y, children: w, translation: S, ...N } = c;
+    o.id ? (await t.updateLabel({ ...N, translation: JSON.stringify(S), parentId: y == null ? void 0 : y.id }), x(c)) : (await t.createLabel({ ...N, translation: JSON.stringify(S), parentId: y == null ? void 0 : y.id }), d(c)), l(null);
   }, m = async () => {
-    !r || (await t.deleteLabel(r.id), b(r), i(null));
-  }, I = (c, y) => /* @__PURE__ */ C(P, {
-    children: [/* @__PURE__ */ C(p, {
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        flexWrap: "wrap"
-      },
-      className: "label-name",
-      children: [/* @__PURE__ */ n(p, {
-        children: c
-      }), y.translation && /* @__PURE__ */ n(p, {
-        sx: {
-          display: "flex",
-          alignItems: "center",
-          gap: 0.5,
-          ml: 2
-        },
-        className: "label-translation",
-        children: Object.keys(y.translation).map((w) => {
-          var N;
-          const S = (N = y.translation) == null ? void 0 : N[w];
-          return S ? /* @__PURE__ */ n(De, {
-            locale: w,
-            value: S
-          }, w) : null;
-        })
-      })]
-    }), /* @__PURE__ */ C(p, {
-      sx: {
-        display: "flex",
-        gap: 1,
-        flex: "0 0 auto"
-      },
-      className: "label-action",
-      children: [/* @__PURE__ */ n(E, {
-        color: "inherit",
-        size: "small",
-        sx: {
-          color: "grey.500"
-        },
-        onClick: () => u(y),
-        children: /* @__PURE__ */ n(ee, {
-          sx: {
-            fontSize: 20
-          }
-        })
-      }), /* @__PURE__ */ n(E, {
-        color: "inherit",
-        size: "small",
-        sx: {
-          color: "grey.500"
-        },
-        onClick: () => v(y),
-        children: /* @__PURE__ */ n(te, {
-          sx: {
-            fontSize: 18
-          }
-        })
-      }), /* @__PURE__ */ n(E, {
-        color: "inherit",
-        size: "small",
-        sx: {
-          color: "grey.500"
-        },
-        onClick: () => i(y),
-        children: /* @__PURE__ */ n(ne, {
-          sx: {
-            fontSize: 20
-          }
-        })
-      })]
-    })]
-  });
-  return /* @__PURE__ */ C(p, {
-    ...a,
-    className: "label-container",
-    children: [/* @__PURE__ */ C(p, {
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "space-between"
+    r && (await t.deleteLabel(r.id), b(r), i(null));
+  }, I = (c, y) => /* @__PURE__ */ C(P, { children: [
+    /* @__PURE__ */ C(p, { sx: { display: "flex", alignItems: "center", flexWrap: "wrap" }, className: "label-name", children: [
+      /* @__PURE__ */ n(p, { children: c }),
+      y.translation && /* @__PURE__ */ n(p, { sx: { display: "flex", alignItems: "center", gap: 0.5, ml: 2 }, className: "label-translation", children: Object.keys(y.translation).map((w) => {
+        var N;
+        const S = (N = y.translation) == null ? void 0 : N[w];
+        return S ? /* @__PURE__ */ n(De, { locale: w, value: S }, w) : null;
+      }) })
+    ] }),
+    /* @__PURE__ */ C(p, { sx: { display: "flex", gap: 1, flex: "0 0 auto" }, className: "label-action", children: [
+      /* @__PURE__ */ n(E, { color: "inherit", size: "small", sx: { color: "grey.500" }, onClick: () => u(y), children: /* @__PURE__ */ n(ee, { sx: { fontSize: 20 } }) }),
+      /* @__PURE__ */ n(E, { color: "inherit", size: "small", sx: { color: "grey.500" }, onClick: () => v(y), children: /* @__PURE__ */ n(te, { sx: { fontSize: 18 } }) }),
+      /* @__PURE__ */ n(E, { color: "inherit", size: "small", sx: { color: "grey.500" }, onClick: () => i(y), children: /* @__PURE__ */ n(ne, { sx: { fontSize: 20 } }) })
+    ] })
+  ] });
+  return /* @__PURE__ */ C(p, { ...a, className: "label-container", children: [
+    /* @__PURE__ */ C(p, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+      /* @__PURE__ */ n(ce, { component: "h2", variant: "h6", children: "Manage labels" }),
+      /* @__PURE__ */ n(
+        A,
+        {
+          color: "primary",
+          variant: "contained",
+          size: "small",
+          sx: { textTransform: "none" },
+          onClick: () => u(),
+          children: "New label"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ C(p, { sx: { mt: 2, border: 1, borderColor: "grey.300", borderRadius: 1, overflow: "hidden" }, children: [
+      /* @__PURE__ */ C(p, { sx: { p: 2, fontSize: 14, fontWeight: "bold", bgcolor: "grey.200" }, className: "label-header", children: [
+        g.length,
+        " labels"
+      ] }),
+      /* @__PURE__ */ n(p, { sx: { pt: 0.5 }, children: /* @__PURE__ */ n(je, { data: f, selected: [], renderItem: I, rowHeight: 64 }) })
+    ] }),
+    /* @__PURE__ */ n(
+      Le,
+      {
+        open: !!o,
+        onClose: () => l(null),
+        initialLabel: o,
+        onSubmit: M
       },
-      children: [/* @__PURE__ */ n(ce, {
-        component: "h2",
-        variant: "h6",
-        children: "Manage labels"
-      }), /* @__PURE__ */ n(A, {
-        color: "primary",
-        variant: "contained",
-        size: "small",
-        sx: {
-          textTransform: "none"
-        },
-        onClick: () => u(),
-        children: "New label"
-      })]
-    }), /* @__PURE__ */ C(p, {
-      sx: {
-        mt: 2,
-        border: 1,
-        borderColor: "grey.300",
-        borderRadius: 1,
-        overflow: "hidden"
+      o == null ? void 0 : o.id
+    ),
+    /* @__PURE__ */ n(
+      Me,
+      {
+        open: !!r,
+        onClose: () => i(null),
+        label: r,
+        onSubmit: m
       },
-      children: [/* @__PURE__ */ C(p, {
-        sx: {
-          p: 2,
-          fontSize: 14,
-          fontWeight: "bold",
-          bgcolor: "grey.200"
-        },
-        className: "label-header",
-        children: [g.length, " labels"]
-      }), /* @__PURE__ */ n(p, {
-        sx: {
-          pt: 0.5
-        },
-        children: /* @__PURE__ */ n(je, {
-          data: f,
-          selected: [],
-          renderItem: I,
-          rowHeight: 64
-        })
-      })]
-    }), /* @__PURE__ */ n(Le, {
-      open: !!o,
-      onClose: () => l(null),
-      initialLabel: o,
-      onSubmit: M
-    }, o == null ? void 0 : o.id), /* @__PURE__ */ n(Me, {
-      open: !!r,
-      onClose: () => i(null),
-      label: r,
-      onSubmit: m
-    }, r == null ? void 0 : r.id)]
-  });
+      r == null ? void 0 : r.id
+    )
+  ] });
 }
 const G = q({}), U = () => H(G), it = () => {
-  const {
-    updateLabels: e
-  } = U();
+  const { updateLabels: e } = U();
   W(() => () => {
     e();
   }, []);
 };
-function at({
-  fetchLabels: e,
-  children: t
-}) {
-  const {
-    locale: a
-  } = Q(), [o, l] = z({
+function at({ fetchLabels: e, children: t }) {
+  const { locale: a } = Q(), [o, l] = z({
     loading: !0,
     labels: [],
     updateCounter: 1
@@ -964,70 +617,46 @@ function at({
   W(() => {
     (async () => {
       try {
-        l((u) => ({
-          ...u,
-          loading: !0
-        }));
+        l((u) => ({ ...u, loading: !0 }));
         const b = await e();
-        l((u) => ({
-          ...u,
-          loading: !1,
-          labels: Ie(b)
-        }));
+        l((u) => ({ ...u, loading: !1, labels: Ie(b) }));
       } catch (b) {
-        console.error(b), l((u) => ({
-          ...u,
-          loading: !1,
-          labels: []
-        }));
+        console.error(b), l((u) => ({ ...u, loading: !1, labels: [] }));
       }
     })();
   }, [o.updateCounter]);
   const r = T(() => {
     var b;
-    return (b = o.labels) != null && b.length ? O(o.labels).reduce((u, v) => ({
-      ...u,
-      [v.id]: v
-    }), {}) : {};
-  }, [o.labels]), i = k((d) => {
-    var b;
-    return {
-      ...d,
-      name: ((b = d.translation) == null ? void 0 : b[a]) || d.name
-    };
-  }, [a]), s = k((d) => d.filter(Boolean).map((b) => r[b]).map(i), [r, i]), h = k((d) => (d == null ? void 0 : d.split(",")) || [], []), g = k((d = []) => {
-    if (!!(d != null && d.length))
+    return (b = o.labels) != null && b.length ? O(o.labels).reduce((u, v) => ({ ...u, [v.id]: v }), {}) : {};
+  }, [o.labels]), i = k(
+    (d) => {
+      var b;
+      return {
+        ...d,
+        name: ((b = d.translation) == null ? void 0 : b[a]) || d.name
+      };
+    },
+    [a]
+  ), s = k(
+    (d) => d.filter(Boolean).map((b) => r[b]).map(i),
+    [r, i]
+  ), h = k((d) => (d == null ? void 0 : d.split(",")) || [], []), g = k((d = []) => {
+    if (d != null && d.length)
       return d.join(",");
   }, []), f = T(() => o.labels.map(i), [o.labels, i]), x = T(() => ({
     loading: o.loading,
     labels: o.labels || [],
-    updateLabels: () => l((d) => ({
-      ...d,
-      updateCounter: ++o.updateCounter
-    })),
+    updateLabels: () => l((d) => ({ ...d, updateCounter: ++o.updateCounter })),
     getLabelsById: s,
     parseLabelIds: h,
     stringifyLabelIds: g,
     localizedLabels: f,
     flattenedLabels: O(f || [])
   }), [o, s, h, g, f]);
-  return /* @__PURE__ */ n(G.Provider, {
-    value: x,
-    children: t
-  });
+  return /* @__PURE__ */ n(G.Provider, { value: x, children: t });
 }
-function st({
-  labels: e,
-  editable: t,
-  onChange: a,
-  sx: o,
-  renderLabel: l
-}) {
-  const r = !(e != null && e.length), {
-    labels: i,
-    loading: s,
-    getLabelsById: h
-  } = U(), [g, f] = z(!1);
+function st({ labels: e, editable: t, onChange: a, sx: o, renderLabel: l }) {
+  const r = !(e != null && e.length), { labels: i, loading: s, getLabelsById: h } = U(), [g, f] = z(!1);
   if (s || !t && r)
     return null;
   const x = (u) => {
@@ -1036,51 +665,16 @@ function st({
     }, 300);
   };
   if (g)
-    return /* @__PURE__ */ n($, {
-      onClickAway: () => g && f(!1),
-      children: /* @__PURE__ */ n("div", {
-        children: /* @__PURE__ */ n(Ae, {
-          data: i,
-          value: e || [],
-          onChange: x
-        })
-      })
-    });
-  const d = h(e || []), b = [{
-    display: "flex",
-    gap: 1,
-    alignItems: "center",
-    flexWrap: "wrap"
-  }, ...Array.isArray(o) ? o : [o]];
-  return /* @__PURE__ */ C(p, {
-    sx: b,
-    children: [d.map((u) => u ? l ? l(u) : /* @__PURE__ */ n(me, {
-      label: u.name,
-      variant: "filled",
-      size: "small",
-      sx: {
-        borderRadius: 1
-      }
-    }, u.id) : null), t && !r && /* @__PURE__ */ n(E, {
-      color: "inherit",
-      size: "small",
-      onClick: () => f(!0),
-      sx: {
-        color: "grey.400"
-      },
-      children: /* @__PURE__ */ n(re, {
-        sx: {
-          fontSize: 20
-        }
-      })
-    }), t && r && /* @__PURE__ */ n(A, {
-      color: "inherit",
-      variant: "outlined",
-      startIcon: /* @__PURE__ */ n(oe, {}),
-      onClick: () => f(!0),
-      children: "Edit labels"
-    })]
-  });
+    return /* @__PURE__ */ n($, { onClickAway: () => g && f(!1), children: /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n(Ae, { data: i, value: e || [], onChange: x }) }) });
+  const d = h(e || []), b = [
+    { display: "flex", gap: 1, alignItems: "center", flexWrap: "wrap" },
+    ...Array.isArray(o) ? o : [o]
+  ];
+  return /* @__PURE__ */ C(p, { sx: b, children: [
+    d.map((u) => u ? l ? l(u) : /* @__PURE__ */ n(me, { label: u.name, variant: "filled", size: "small", sx: { borderRadius: 1 } }, u.id) : null),
+    t && !r && /* @__PURE__ */ n(E, { color: "inherit", size: "small", onClick: () => f(!0), sx: { color: "grey.400" }, children: /* @__PURE__ */ n(re, { sx: { fontSize: 20 } }) }),
+    t && r && /* @__PURE__ */ n(A, { color: "inherit", variant: "outlined", startIcon: /* @__PURE__ */ n(oe, {}), onClick: () => f(!0), children: "Edit labels" })
+  ] });
 }
 export {
   lt as LabelManager,