@pnkx-lib/ui 1.0.0

package/dist/chunks/Badge-D0BZUAPX.js

@@ -0,0 +1,249 @@
+import { j as a, I, _ as w, u as $, c as k } from "./AntdIcon-BppsuyXF.js";
+import { Button as F, Cascader as M, Card as b, Empty as V, Table as _, Modal as L, Tooltip as D, Tabs as K, Space as S, Skeleton as f, Popover as H, Badge as R } from "antd";
+import * as g from "react";
+import y, { useEffect as G } from "react";
+const C = (e) => /* @__PURE__ */ a.jsx(F, { ...e }), ne = (e) => {
+  const {
+    customStyleContainer: t,
+    customStyleCascader: s,
+    options: n = [],
+    ...r
+  } = e;
+  return /* @__PURE__ */ a.jsx("div", { className: t, children: /* @__PURE__ */ a.jsx(
+    M,
+    {
+      options: n,
+      className: s,
+      ...r
+    }
+  ) });
+}, re = ({
+  data: e,
+  columns: t,
+  loading: s = !1,
+  totalItems: n,
+  filters: r,
+  onChangePage: d,
+  onChangePageSize: u,
+  onSort: c,
+  rowsSelected: m,
+  onSelect: o,
+  onRowClick: x,
+  ...l
+}) => {
+  const j = {
+    current: r.PageIndex,
+    pageSize: r.PageSize,
+    total: n,
+    showSizeChanger: !0,
+    onChange: (i, h) => {
+      i !== r.PageIndex && d(i), h !== r.PageSize && u(h);
+    }
+  }, v = {
+    selectedRowKeys: m,
+    onChange: o
+  }, P = (i) => {
+    i && i.field && c && c({}, i.field);
+  };
+  function B(i, h) {
+    return (E) => {
+      const p = E.target;
+      p.closest("input") || // ⛔ Checkbox
+      p.closest("button") || // ⛔ Button trong row
+      p.closest("svg") || // ⛔ Icon
+      p.closest(".ant-checkbox") || // ⛔ AntD checkbox
+      p.closest("a") || h == null || h(i);
+    };
+  }
+  return /* @__PURE__ */ a.jsx(a.Fragment, { children: e.length === 0 ? /* @__PURE__ */ a.jsx(b, { children: /* @__PURE__ */ a.jsx(V, {}) }) : /* @__PURE__ */ a.jsx(
+    _,
+    {
+      dataSource: e,
+      columns: t,
+      pagination: j,
+      loading: s,
+      rowSelection: v,
+      onChange: P,
+      onRow: (i) => ({
+        onClick: B(i, x)
+      }),
+      ...l
+    }
+  ) });
+}, oe = ({
+  children: e,
+  onOk: t,
+  onSubmit: s,
+  ...n
+}) => /* @__PURE__ */ a.jsx(L, { onOk: s || t, ...n, children: /* @__PURE__ */ a.jsx("div", { className: "max-h-[20rem] overflow-y-auto", children: s ? /* @__PURE__ */ a.jsx("form", { onSubmit: s, children: e }) : e }) }), ce = ({ children: e, ...t }) => /* @__PURE__ */ a.jsx(D, { ...t, children: e }), T = (e) => {
+  let t;
+  const s = /* @__PURE__ */ new Set(), n = (o, x) => {
+    const l = typeof o == "function" ? o(t) : o;
+    if (!Object.is(l, t)) {
+      const j = t;
+      t = x ?? (typeof l != "object" || l === null) ? l : Object.assign({}, t, l), s.forEach((v) => v(t, j));
+    }
+  }, r = () => t, c = { setState: n, getState: r, getInitialState: () => m, subscribe: (o) => (s.add(o), () => s.delete(o)) }, m = t = e(n, r, c);
+  return c;
+}, q = (e) => e ? T(e) : T, J = (e) => e;
+function Q(e, t = J) {
+  const s = y.useSyncExternalStore(
+    e.subscribe,
+    () => t(e.getState()),
+    () => t(e.getInitialState())
+  );
+  return y.useDebugValue(s), s;
+}
+const N = (e) => {
+  const t = q(e), s = (n) => Q(t, n);
+  return Object.assign(s, t), s;
+}, U = (e) => e ? N(e) : N, W = U((e) => ({
+  activeTabKey: void 0,
+  // giá trị mặc định
+  setActiveTabKey: (t) => e({ activeTabKey: t })
+})), ie = ({
+  items: e,
+  lazyRender: t = !1,
+  defaultActiveKey: s,
+  ...n
+}) => {
+  var c;
+  const { activeTabKey: r, setActiveTabKey: d } = W(), u = (s == null ? void 0 : s.toString()) || ((c = e[0]) == null ? void 0 : c.key);
+  return G(() => {
+    !r && u && d(u);
+  }, [r, u, d]), /* @__PURE__ */ a.jsx(
+    K,
+    {
+      items: e,
+      destroyInactiveTabPane: t,
+      activeKey: r,
+      defaultActiveKey: s,
+      onChange: (m) => d(m),
+      ...n
+    }
+  );
+}, le = ({ type: e }) => /* @__PURE__ */ a.jsx(a.Fragment, { children: e === "table" ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+  /* @__PURE__ */ a.jsx(S, { style: { width: "100%" }, children: /* @__PURE__ */ a.jsx(
+    f.Input,
+    {
+      size: "small",
+      block: !0,
+      active: !0,
+      style: { width: "15rem", marginBottom: "15px" }
+    }
+  ) }),
+  /* @__PURE__ */ a.jsx(b, { children: /* @__PURE__ */ a.jsx(S, { direction: "vertical", size: "middle", style: { width: "100%" }, children: Array.from({ length: 10 }).map((t, s) => /* @__PURE__ */ a.jsx(f.Input, { size: "small", block: !0, active: !0 }, s)) }) }),
+  /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      style: {
+        width: "100%",
+        display: "flex",
+        justifyContent: "flex-end",
+        marginTop: "20px"
+      },
+      children: /* @__PURE__ */ a.jsx(
+        f.Input,
+        {
+          size: "small",
+          active: !0,
+          style: { width: "20rem" }
+        }
+      )
+    }
+  )
+] }) : /* @__PURE__ */ a.jsx(b, { children: /* @__PURE__ */ a.jsx("div", { style: { display: "grid", rowGap: 8 }, children: Array.from({ length: 3 }).map((t, s) => /* @__PURE__ */ a.jsx(f.Input, { size: "small", block: !0, active: !0 }, s)) }) }) }), de = (e) => {
+  const { customStyleContainer: t, customStylePopover: s, ...n } = e;
+  return /* @__PURE__ */ a.jsx("div", { className: t, children: /* @__PURE__ */ a.jsx(H, { className: s, ...n }) });
+};
+var X = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M880.1 154H143.9c-24.5 0-39.8 26.7-27.5 48L349 597.4V838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3 31.8-32V597.4L907.7 202c12.2-21.3-3.1-48-27.6-48zM603.4 798H420.6V642h182.9v156zm9.6-236.6l-9.5 16.6h-183l-9.5-16.6L212.7 226h598.6L613 561.4z" } }] }, name: "filter", theme: "outlined" }, Y = function(t, s) {
+  return /* @__PURE__ */ g.createElement(I, w({}, t, {
+    ref: s,
+    icon: X
+  }));
+}, O = /* @__PURE__ */ g.forwardRef(Y);
+process.env.NODE_ENV !== "production" && (O.displayName = "FilterOutlined");
+var Z = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z" } }] }, name: "search", theme: "outlined" }, A = function(t, s) {
+  return /* @__PURE__ */ g.createElement(I, w({}, t, {
+    ref: s,
+    icon: Z
+  }));
+}, z = /* @__PURE__ */ g.forwardRef(A);
+process.env.NODE_ENV !== "production" && (z.displayName = "SearchOutlined");
+const ue = ({
+  initialValues: e,
+  renderFilterFields: t,
+  onSubmit: s,
+  onReset: n,
+  classNamesContainer: r,
+  classNameWrapperForm: d,
+  hideDefaultSubmit: u,
+  hideResetButton: c
+}) => {
+  const { control: m, handleSubmit: o, reset: x, setValue: l } = $({
+    defaultValues: e
+  });
+  return /* @__PURE__ */ a.jsxs("form", { className: d, onSubmit: o(s), children: [
+    /* @__PURE__ */ a.jsx("div", { className: r, children: t && t({
+      control: m,
+      setValue: l,
+      handleSubmit: o
+    }) }),
+    !u && /* @__PURE__ */ a.jsxs("div", { className: "flex justify-end gap-2 mb-3", children: [
+      /* @__PURE__ */ a.jsx(
+        C,
+        {
+          icon: /* @__PURE__ */ a.jsx(z, {}),
+          className: "px-3 py-1 ",
+          color: "blue",
+          variant: "solid",
+          htmlType: "submit",
+          children: "Tìm kiếm"
+        }
+      ),
+      !c && /* @__PURE__ */ a.jsx(
+        C,
+        {
+          icon: /* @__PURE__ */ a.jsx(O, {}),
+          className: "px-3 py-1",
+          onClick: () => {
+            x(), n == null || n();
+          },
+          children: "Đặt lại"
+        }
+      )
+    ] })
+  ] });
+}, me = ({
+  children: e,
+  className: t,
+  size: s
+}) => /* @__PURE__ */ a.jsx(
+  "div",
+  {
+    className: k(s, "mx-auto px-4 sm:px-6 lg:px-8", t),
+    children: e
+  }
+), ee = {
+  error: "red",
+  info: "blue",
+  success: "green",
+  warning: "yellow"
+}, xe = ({ type: e, ...t }) => {
+  const s = e ? ee[e] : void 0;
+  return /* @__PURE__ */ a.jsx(R, { color: s, ...t });
+};
+export {
+  C as B,
+  ne as C,
+  oe as M,
+  de as P,
+  le as S,
+  re as T,
+  ce as a,
+  ie as b,
+  ue as c,
+  me as d,
+  xe as e,
+  ee as t
+};