aristid-ds 11.0.0 → 12.0.0-e651b01

package/dist/Kit/DataDisplay/ItemCard/index.js

@@ -1,20 +1,47 @@
-import "react/jsx-runtime";
-import "react";
-import "classnames";
-import { a as h } from "../../../chunks/index.2xXr1nME.js";
-import "../../General/Typography/index.js";
-import "../../General/Icon/index.js";
-import "../../DataEntry/Rate/index.js";
-import "../../DataEntry/Switch/index.js";
-import "../../DataEntry/Slider/index.js";
-import "../../Navigation/Breadcrumb/index.js";
-import "../../Navigation/DropDown/index.js";
-import "../../Navigation/Steps/index.js";
-import "antd";
-import "../../../chunks/useKitTheme.KSAU-Pdv.js";
-import "../../../chunks/styles.module.YmhPHVHy.js";
-import "@fortawesome/react-fontawesome";
-import "@fortawesome/free-solid-svg-icons";
+import "../../../assets/index29.css";
+import { jsx as i, jsxs as l } from "react/jsx-runtime";
+import { useState as B, useEffect as V, forwardRef as X } from "react";
+import Y from "classnames";
+import { KitTypography as w } from "../../General/Typography/index.js";
+import { KitCheckbox as Z } from "../../DataEntry/Checkbox/index.js";
+import { KitSwitch as G } from "../../DataEntry/Switch/index.js";
+import { KitBreadcrumb as ii } from "../../Navigation/Breadcrumb/index.js";
+import { u as ti } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import { KitTag as ei } from "../Tag/index.js";
+import { KitButton as A } from "../../General/Button/index.js";
+import { KitTooltip as oi } from "../Tooltip/index.js";
+import { FontAwesomeIcon as _ } from "@fortawesome/react-fontawesome";
+import { faEllipsis as si, faImage as ri } from "@fortawesome/free-solid-svg-icons";
+import { KitDropDown as ai } from "../../Navigation/DropDown/index.js";
+import { u as di } from "../../../chunks/useKitLocale.96CdK3og.js";
+import { useDebouncedCallback as ci } from "use-debounce";
+const ni = {
+  "kit-item-card": "_kit-item-card_308fs_2"
+}, z = () => {
+  const [d, a] = B(window.innerWidth), [o, r] = B(window.innerHeight), t = ci(() => {
+    a(window.innerWidth), r(window.innerHeight);
+  }, 100);
+  return V(() => (t(), window.addEventListener("resize", t), () => window.removeEventListener("resize", t)), [t]), { width: d, height: o };
+}, li = 1300, E = ({ display: d = "card", disabled: a = !1, actions: o }) => {
+  var r;
+  const { locale: t } = di(), { width: c } = z();
+  return i("div", { className: "kit-item-card-actions", children: d === "list" && c < li ? i(ai, { disabled: a, menu: { items: o }, children: i(A, { title: (r = t.General) === null || r === void 0 ? void 0 : r.more, icon: i(_, { icon: si }) }) }) : o == null ? void 0 : o.map((s) => i(oi, { title: s.label, children: i(A, { icon: s.icon, onClick: s.onClick, disabled: s.disabled || a }) }, s.key)) });
+}, R = 900, mi = X(({ className: d, style: a, imageSrc: o, icon: r, tagGroup: t, breadcrumbItems: c, title: s, description: m, draggableHandler: u, selected: D, onSelect: g, activateLabel: H, activated: L, onActivate: y, extra: C, actions: h, display: n = "card", disabled: e = !1, imageAlt: O = "", imageCover: W = !1 }, j) => {
+  const { appId: S } = ti(), { width: T } = z(), N = g !== void 0, x = u !== void 0, F = o !== void 0, P = r !== void 0, p = t !== void 0, K = c !== void 0, $ = s !== void 0 || m !== void 0, b = C !== void 0, q = y !== void 0, k = h !== void 0, I = [p, K, b].filter(Boolean).length, f = n === "list" && T > R, v = n === "card" || T <= R, J = Y(ni["kit-item-card"], d, S, {
+    "kit-item-card-display-list": f,
+    "kit-item-card-display-card": v,
+    [`kit-item-card-display-list-with-${I}-rows`]: f && I > 0,
+    "kit-item-card-display-card-checkbox-or-draggable-handler": v && (N || x),
+    "kit-item-card-disabled": e,
+    "kit-item-card-selected": D,
+    "kit-item-card-with-actions": k,
+    "kit-item-card-image-cover": W
+  });
+  e && p && (t.tags = t.tags.map((U) => ({ ...U, disabled: e })), t.othersTagDisabled = !0);
+  const M = i("div", { className: "kit-item-card-checkbox", children: i(Z, { onChange: g, checked: D, disabled: e }) }), Q = i("div", { className: "kit-item-card-draggable-handler", children: u });
+  return l("div", { tabIndex: e ? -1 : 0, className: J, style: a, ref: j, children: [N && M, x && Q, l("div", { className: "kit-item-card-image", children: [F ? i("img", { src: o, alt: O }) : i("div", { className: "kit-item-card-image-placeholder", children: P ? r : i(_, { icon: ri }) }), i("div", { className: "kit-item-card-actions-mask" }), k && v && i(E, { actions: h, disabled: e, display: "card" })] }), p && i("div", { className: "kit-item-card-tags", style: { width: n === "card" ? "inherit" : "auto" }, children: i(ei.Group, { tags: t.tags, othersTagType: t.othersTagType, othersTagDisabled: t.othersTagDisabled }) }), K && i("div", { className: "kit-item-card-breadcrumb", children: i(ii, { items: c }) }), $ && l("div", { className: "kit-item-card-content", children: [s && i(w.Title, { level: "h3", ellipsis: { tooltip: !0, rows: 2 }, disabled: e, children: s }), m && i(w.Paragraph, { ellipsis: { tooltip: !0, rows: 2 }, disabled: e, children: m })] }), b && i("div", { className: "kit-item-card-extra", children: C }), k && f && i(E, { actions: h, disabled: e, display: n }), q && l("div", { className: "kit-item-card-switch", children: [i(G, { onChange: y, checked: L, disabled: e }), i(w.Text, { disabled: e, ellipsis: { tooltip: !0 }, children: H })] })] });
+});
+mi.displayName = "KitItemCard";
 export {
-  h as KitItemCard
+  mi as KitItemCard
 };

package/dist/Kit/DataDisplay/ItemList/index.js

@@ -1,26 +1,55 @@
-import "react/jsx-runtime";
-import "react";
-import { e as u } from "../../../chunks/index.2xXr1nME.js";
-import "../../DataEntry/Rate/index.js";
-import "../../DataEntry/Switch/index.js";
-import "../../DataEntry/Slider/index.js";
-import "../../../chunks/index.bf78FwPu.js";
-import "../Badge/index.js";
-import "../Empty/index.js";
-import "../../../chunks/index.S1tc6cnV.js";
-import "../Tree/index.js";
-import "../Tooltip/index.js";
-import "antd";
-import "../../../chunks/useKitTheme.KSAU-Pdv.js";
-import "classnames";
-import "../../General/Typography/index.js";
-import "../../General/Icon/index.js";
-import "../../Navigation/Breadcrumb/index.js";
-import "../../Navigation/DropDown/index.js";
-import "../../Navigation/Steps/index.js";
-import "../../../chunks/styles.module.YmhPHVHy.js";
-import "@fortawesome/react-fontawesome";
-import "@fortawesome/free-solid-svg-icons";
+import "../../../assets/index4.css";
+import { jsxs as v, jsx as t, Fragment as C } from "react/jsx-runtime";
+import { forwardRef as J, useState as M } from "react";
+import { KitCheckbox as O } from "../../DataEntry/Checkbox/index.js";
+import { KitIdCard as Q } from "../IdCard/index.js";
+import { KitButton as d } from "../../General/Button/index.js";
+import { KitDropDown as x } from "../../Navigation/DropDown/index.js";
+import { u as W } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import { FontAwesomeIcon as w } from "@fortawesome/react-fontawesome";
+import { faEllipsis as N } from "@fortawesome/free-solid-svg-icons";
+import b from "classnames";
+import { u as X } from "../../../chunks/useKitLocale.96CdK3og.js";
+const m = {
+  "kit-item-list": "_kit-item-list_1rfhx_2",
+  "kit-item-list-buttons": "_kit-item-list-buttons_1rfhx_42",
+  "kit-item-list-selected": "_kit-item-list-selected_1rfhx_49",
+  "kit-item-list-id-card": "_kit-item-list-id-card_1rfhx_60",
+  "kit-item-list-clickable": "_kit-item-list-clickable_1rfhx_64"
+}, Y = J(({ idCardProps: o, idCardSubstitute: p, checkboxAriaLabel: h, draggableHandler: D, content: _, error: c, onSelect: a, onClick: f, className: E, showActionsOnHover: F, disabled: l = !1, actions: n = [], actionsInDropdown: L, ...j }, B) => {
+  const { appId: G } = W(), { locale: y } = X(), [k, g] = M(!1), K = a !== void 0, T = n.length < 4, U = o !== void 0 && p === void 0, V = p !== void 0, A = () => {
+    var i;
+    return K ? t(O, { danger: c, disabled: l, checked: k, onClick: (s) => s.stopPropagation(), onChange: () => {
+      const s = !k;
+      return g(s), a(s);
+    }, "aria-label": (i = h ?? (o == null ? void 0 : o.title)) !== null && i !== void 0 ? i : o == null ? void 0 : o.description }) : null;
+  }, R = () => {
+    var i, r;
+    const s = b(m["kit-item-list-buttons"], {
+      "kit-item-list-buttons-visible-on-hover": F
+    });
+    return n && n.length !== 0 && t("div", { className: s, onClick: (e) => e.stopPropagation(), children: L && n.length > 1 ? t(x, { disabled: l, menu: { items: n }, children: t(d, { danger: c, title: (i = y.General) === null || i === void 0 ? void 0 : i.more, type: "tertiary", icon: t(w, { icon: N }) }) }) : T ? t(C, { children: n.map((e) => t(d, { danger: c, disabled: e.disabled || l, type: "tertiary", icon: e.icon, onClick: e.onClick, title: e.title }, e.key)) }) : v(C, { children: [[0, 1].map((e) => t(d, { danger: c, disabled: l, type: "tertiary", icon: n[e].icon, onClick: n[e].onClick, title: n[e].title })), t(x, { disabled: l, menu: { items: n.slice(2) }, children: t(d, { danger: c, title: (r = y.General) === null || r === void 0 ? void 0 : r.more, type: "tertiary", icon: t(w, { icon: N }) }) })] }) });
+  }, q = () => v("div", { className: m["kit-item-list-id-card"], children: [U && t(Q, { ...o, disabled: l }), V && p] }), z = () => _ && t("div", { className: m["kit-item-list-content"], children: _ }), I = (i) => {
+    if (i.stopPropagation(), l)
+      return;
+    const r = (u) => "key" in u;
+    if (i.type === "click" || r(i) && ["Enter", " "].includes(i.key)) {
+      if (f != null)
+        return f();
+      if (a != null) {
+        const u = !k;
+        return g(u), a(u);
+      }
+    }
+  }, H = b(G, m["kit-item-list"], E, {
+    [m["kit-item-list-clickable"]]: K || f != null,
+    [m["kit-item-list-selected"]]: k,
+    "kit-item-list-disabled": l,
+    "kit-item-list-on-error": c
+  });
+  return v("div", { "aria-disabled": l, ref: B, tabIndex: l ? -1 : 0, className: H, onClick: I, onKeyUp: I, ...j, children: [D, A(), q(), z(), R()] });
+});
+Y.displayName = "KitItemList";
 export {
-  u as KitItemList
+  Y as KitItemList
 };

package/dist/Kit/DataDisplay/RedirectCard/index.js

@@ -1,18 +1,52 @@
-import "react/jsx-runtime";
-import "classnames";
-import { f as b } from "../../../chunks/index.2xXr1nME.js";
-import "react";
-import "../../../chunks/useKitTheme.KSAU-Pdv.js";
-import "@fortawesome/react-fontawesome";
-import "@fortawesome/free-solid-svg-icons";
-import "../../General/Typography/index.js";
-import "../../General/Icon/index.js";
-import "../../Layout/Divider/index.js";
+import "../../../assets/index25.css";
+import { jsx as i, jsxs as d, Fragment as x } from "react/jsx-runtime";
+import T from "classnames";
+import { forwardRef as _ } from "react";
+import { u as B } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import { FontAwesomeIcon as f } from "@fortawesome/react-fontawesome";
+import { faEllipsis as g, faArrowRight as P } from "@fortawesome/free-solid-svg-icons";
+import { KitIcon as C } from "../../General/Icon/index.js";
+import { KitTypography as K } from "../../General/Typography/index.js";
+import { KitDivider as F } from "../../Layout/Divider/index.js";
 import "../../Layout/Space/index.js";
 import "color-convert";
 import "color-string";
 import "lodash/isEmpty";
-import "../../../chunks/styles.module.Q_QQjQdX.js";
+import "../../../chunks/styles.module.4eW8VunD.js";
+import "../../Layout/PageLayout/index.js";
+import { KitButton as k } from "../../General/Button/index.js";
+import { KitTooltip as L } from "../Tooltip/index.js";
+import { KitDropDown as A } from "../../Navigation/DropDown/index.js";
+import { u as j } from "../../../chunks/useKitLocale.96CdK3og.js";
+const G = {
+  "kit-redirect-card": "_kit-redirect-card_poxps_2"
+}, w = ({ actions: r, actionsInDropdown: m = !1, disabled: t = !1 }) => {
+  var n, s;
+  const { locale: l } = j();
+  if (!r)
+    return null;
+  const o = r.length < 4;
+  let c;
+  if (m && r.length > 1)
+    c = i(A, { disabled: t, menu: { items: r }, children: i(k, { title: (n = l.General) === null || n === void 0 ? void 0 : n.more, type: "secondary", icon: i(f, { icon: g }), disableSecureClick: !0, onClick: (e) => e.stopPropagation() }) });
+  else if (o)
+    c = r.map((e) => i(N, { action: e, disabled: t }, e.key));
+  else {
+    const [e, p, ...h] = r;
+    c = d(x, { children: [[e, p].map((a) => i(N, { action: a, disabled: t }, a.key)), i(A, { disabled: t, menu: { items: h }, children: i(k, { title: (s = l.General) === null || s === void 0 ? void 0 : s.more, type: "secondary", icon: i(f, { icon: g }), disableSecureClick: !0, onClick: (a) => a.stopPropagation() }) })] });
+  }
+  return i("div", { className: "kit-redirect-card-actions", children: c });
+}, N = ({ action: r, disabled: m }) => i(L, { title: r.label, children: i(k, { type: "secondary", icon: r.icon, onClick: (t) => {
+  t.stopPropagation(), r.onClick(t);
+}, disabled: r.disabled || m, disableSecureClick: !0 }) }), M = _(({ className: r, style: m, title: t, description: n, icon: s, coverSrc: l, disabled: o, actions: c, actionsInDropdown: e, onClick: p, coverAlt: h = "" }, a) => {
+  const v = s !== void 0 && l === void 0, y = l !== void 0, u = c !== void 0, D = 2, { appId: I } = B(), R = T(G["kit-redirect-card"], r, I, {
+    "kit-redirect-card-disabled": o,
+    "kit-redirect-card-with-cover": y,
+    "kit-redirect-card-with-actions": u
+  });
+  return d("div", { className: R, tabIndex: o ? -1 : 0, style: m, onClick: p, ref: a, children: [u && v && i(w, { actions: c, disabled: o, actionsInDropdown: !!e }), v && i(C, { className: "kit-redirect-card-icon", icon: s }), y && d(x, { children: [d("div", { className: "kit-redirect-card-cover", children: [i("img", { alt: h, src: l }), i("div", { className: "kit-redirect-card-actions-mask" }), u && i(w, { actions: c, actionsInDropdown: !!e, disabled: o })] }), i(F, { noMargin: !0 })] }), d("div", { className: "kit-redirect-card-content", children: [d("section", { children: [i(K.Title, { ellipsis: { tooltip: !0 }, level: "h3", disabled: o, children: t }), n && i(K.Paragraph, { ellipsis: { rows: D, tooltip: n }, disabled: o, children: n })] }), i(C, { className: "kit-redirect-card-redirect-icon", icon: i(f, { icon: P }) })] })] });
+});
+M.displayName = "KitRedirectCard";
 export {
-  b as KitRedirectCard
+  M as KitRedirectCard
 };

package/dist/Kit/DataDisplay/Table/index.js

@@ -1,4 +1,106 @@
-import { g as o } from "../../../chunks/index.2xXr1nME.js";
+import "../../../assets/index45.css";
+import { jsx as o } from "react/jsx-runtime";
+import { forwardRef as z, useMemo as _ } from "react";
+import { Table as w } from "antd";
+import g from "classnames";
+import { u as O } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import { KitIcon as U } from "../../General/Icon/index.js";
+import { FontAwesomeIcon as p } from "@fortawesome/react-fontawesome";
+import { faUpDown as W, faArrowDown as M, faArrowUp as B, faGripLines as F, faCaretDown as G, faCaretRight as $ } from "@fortawesome/free-solid-svg-icons";
+import { KitButton as I } from "../../General/Button/index.js";
+const y = {
+  "kit-table": "_kit-table_1ks06_2",
+  "expand-button": "_expand-button_1ks06_649"
+}, x = (i) => {
+  const l = i == null ? void 0 : i.split(" "), t = l == null ? void 0 : l.filter((a) => a !== "ant-table-cell").join(" "), r = l == null ? void 0 : l.filter((a) => ["ant-table-cell", "ant-table-cell-ellipsis", "ant-table-selection-column"].includes(a)).join(" ");
+  return {
+    antCell: t,
+    internalCell: r
+  };
+}, q = (i) => ({
+  header: {
+    cell: ({ children: l, className: t, style: r, title: a, rowSpan: f, colSpan: v, ...b }) => {
+      const s = x(t);
+      return o("th", { className: s.antCell, style: r, title: a, rowSpan: f, colSpan: v, ...b, children: o("div", { className: s.internalCell, children: l }) });
+    }
+  },
+  body: {
+    cell: ({ children: l, className: t, style: r, title: a, rowSpan: f, colSpan: v, ...b }) => {
+      var s, c;
+      const h = (s = i == null ? void 0 : i.body) === null || s === void 0 ? void 0 : s.cell, n = x(t);
+      let C = "";
+      return !((c = n.antCell) === null || c === void 0) && c.includes("ant-table-cell-ellipsis") && (C = a), o("td", { className: n.antCell, style: r, title: C, rowSpan: f, colSpan: v, children: o("div", { className: n.internalCell, children: h ? o(h, { title: a, ...b, children: l }) : l }) });
+    },
+    row: ({ children: l, ...t }) => {
+      var r;
+      const a = (r = i == null ? void 0 : i.body) === null || r === void 0 ? void 0 : r.row;
+      return a ? o(a, { ...t, tabIndex: 0, children: l }) : o("tr", { ...t, tabIndex: 0, children: l });
+    }
+  }
+}), E = ({ sortOrder: i }) => {
+  let l, t;
+  switch (i) {
+    case "ascend":
+      l = B, t = "blue";
+      break;
+    case "descend":
+      l = M, t = "blue";
+      break;
+    default:
+      l = W;
+      break;
+  }
+  return o(U, { color: t, icon: o(p, { icon: l }) });
+}, N = z(({ className: i, isDragging: l, ...t }, r) => {
+  const a = g("kit-table-drag-handle", i, { "kit-table-drag-handle--dragging": l });
+  return o(I, { ...t, iconSize: "l", type: "tertiary", className: a, icon: o(p, { icon: F }), ref: r });
+}), J = ({ className: i, style: l, cellsBackgroundColor: t, backgroundColor: r, borderedRows: a, columns: f, onChange: v, components: b, showDragHandle: s, dragHandleElement: c, lineSize: h = "l", ...n }) => {
+  const { appId: C, theme: T } = O(), A = g(C, y["kit-table"], i, {
+    "kit-table-line-size-m": h === "m",
+    "kit-table-bordered-rows": a
+  }), k = _(() => n != null && n.rowSelection ? { ...n == null ? void 0 : n.rowSelection, columnWidth: "var(--kit-table-checkbox-width)" } : n == null ? void 0 : n.rowSelection, [n == null ? void 0 : n.rowSelection]), K = _(() => {
+    const e = [...f].map((u) => s ? {
+      ...u,
+      sorter: void 0
+    } : (u.sorter && (u.sortIcon = ({ sortOrder: m }) => o(E, { sortOrder: m })), u));
+    return s && (k && e.unshift(w.SELECTION_COLUMN), e.unshift({
+      key: "drag-handle",
+      align: "center",
+      render: () => c ?? o(N, {})
+    })), e;
+  }, [f, k, s, c]), R = (e, u, m, d) => {
+    v == null || v(e, m, d);
+  }, D = ({ record: e, expanded: u, onExpand: m }) => {
+    var d;
+    if (!(!Array.isArray(e == null ? void 0 : e.children) || !(!((d = e == null ? void 0 : e.children) === null || d === void 0) && d.length)))
+      return o(I, { className: y["expand-button"], type: "tertiary", onClick: (j) => m(e, j), children: o(p, { icon: u ? G : $ }) });
+  }, L = (e, u, m) => {
+    var d;
+    return m > 0 && (!Array.isArray(e == null ? void 0 : e.children) || !(!((d = e == null ? void 0 : e.children) === null || d === void 0) && d.length)) ? "last-expandable-level" : "";
+  };
+  return o(w, {
+    className: A,
+    style: {
+      "--kit-table-cells-background-color": t,
+      "--kit-table-background": r,
+      ...l
+    },
+    columns: K,
+    components: q(b),
+    onChange: R,
+    // Pour l'instant on garde expandable dans les props à Omit<>
+    // A voir si on permet de custom uniquement certaines propriété
+    expandable: {
+      expandedRowClassName: L,
+      expandIcon: D,
+      indentSize: T.spacing.m
+    },
+    ...n,
+    rowSelection: k
+  });
+}, S = J;
+S.displayName = "KitTable";
+S.DragHandle = N;
 export {
-  o as KitTable
+  S as KitTable
 };

package/dist/Kit/DataDisplay/Table/types.d.ts

@@ -42,7 +42,8 @@ type AntdTableTypesToOmit =
     | 'summary'
     | 'responsive'
     | 'getPopupContainer'
-    | 'columns';
+    | 'columns'
+    | 'rowHoverable';
 
 export type onChangePagination = Parameters<TableProps<RecordType>['onChange']>[0];
 export type onChangeSorter = Parameters<TableProps<RecordType>['onChange']>[2];

package/dist/Kit/DataDisplay/Tabs/index.js

@@ -1,19 +1,43 @@
-import "react/jsx-runtime";
-import "react";
-import "../../../chunks/useKitTheme.KSAU-Pdv.js";
-import "classnames";
-import { h as g } from "../../../chunks/index.2xXr1nME.js";
-import "../../General/Typography/index.js";
-import "../../General/Icon/index.js";
-import "../../../chunks/index.bf78FwPu.js";
-import "../Badge/index.js";
+import "../../../assets/index5.css";
+import { jsxs as c, Fragment as j, jsx as r } from "react/jsx-runtime";
+import { useState as B } from "react";
+import { u as D } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import h from "classnames";
+import { KitButton as F } from "../../General/Button/index.js";
+import { KitTypography as z } from "../../General/Typography/index.js";
+import "../Avatar/index.js";
+import { KitBadge as C } from "../Badge/index.js";
+import "../ItemCard/index.js";
+import "../Collapse/index.js";
 import "../Empty/index.js";
-import "../../../chunks/index.S1tc6cnV.js";
+import "../Error/index.js";
+import "../IdCard/index.js";
+import "../Image/index.js";
+import "../ItemList/index.js";
+import "../Table/index.js";
+import "../Tag/index.js";
 import "../Tree/index.js";
 import "../Tooltip/index.js";
 import "antd";
-import "@fortawesome/react-fontawesome";
-import "@fortawesome/free-solid-svg-icons";
+import "../RedirectCard/index.js";
+import { FontAwesomeIcon as E } from "@fortawesome/react-fontawesome";
+import { faPlus as O } from "@fortawesome/free-solid-svg-icons";
+const P = {
+  "kit-tabs": "_kit-tabs_1i9lf_2"
+}, U = ({ addTab: v, centered: w, className: x, activeKey: e, defaultKey: n, items: o, onChange: i, fullwidthTab: u, size: b = "small", variant: l = "classic" }) => {
+  var a, p;
+  const { appId: y } = D(), [_, f] = B(n ?? ((a = o[0]) === null || a === void 0 ? void 0 : a.key)), k = e ?? _, N = (p = o.find((t) => t.key === k)) === null || p === void 0 ? void 0 : p.tabContent, T = h(y, x, P["kit-tabs"], w ? "centered" : "", b === "small" ? "small" : "medium", l, u ? "fullwidth" : "", N && l === "pill" ? "tabs-bottom-spacing" : ""), A = (t) => {
+    f(t), i == null || i(t);
+  }, I = (t, s) => {
+    t.code === "Enter" && (f(s), i == null || i(s));
+  };
+  return c(j, { children: [c("div", { className: T, role: "tablist", children: [o == null ? void 0 : o.map(({ icon: t, label: s, badgeCount: K, key: m, disabled: d }) => c("div", { className: h("kit-tab", l, {
+    disabled: d,
+    active: k === m,
+    fullwidth: u
+  }), role: "tab", tabIndex: 0, onClick: d ? void 0 : () => A(m), onKeyDown: d ? void 0 : (S) => I(S, m), children: [t && r("div", { className: "kit-tab-icon", children: t }), c("div", { className: "kit-tab-label-wrapper", children: [r(z.Text, { className: "kit-tab-label", size: b === "medium" ? "fontSize4" : void 0, children: s }), !!K && r(C, { className: "kit-tab-count", count: K })] })] }, m)), v && l === "classic" && r(F, { disableSecureClick: !0, type: "tertiary", icon: r(E, { icon: O }), onClick: v })] }), N] });
+};
+U.displayName = "KitTabs";
 export {
-  g as KitTabs
+  U as KitTabs
 };

package/dist/Kit/DataDisplay/Tabs/types.d.ts

@@ -4,6 +4,8 @@ type IKitTabs = {
     items: IKitTabItem[];
     addTab?: () => void;
     centered?: boolean;
+    className?: string;
+    activeKey?: string;
     defaultKey?: string;
     onChange?: (tabKey: string) => void;
     size?: 'small' | 'medium';

package/dist/Kit/DataDisplay/Tag/index.js

@@ -1,4 +1,76 @@
-import { i as o } from "../../../chunks/index.2xXr1nME.js";
+import "../../../assets/index38.css";
+import { jsx as i, Fragment as C, jsxs as x } from "react/jsx-runtime";
+import { forwardRef as D, useState as W, useRef as N, useLayoutEffect as E } from "react";
+import O from "classnames";
+import { Tag as F } from "antd";
+import { u as z } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import { FontAwesomeIcon as L } from "@fortawesome/react-fontawesome";
+import { faXmark as M } from "@fortawesome/free-solid-svg-icons";
+import { KitIdCard as R } from "../IdCard/index.js";
+import { KitModal as V } from "../../Feedback/Modal/index.js";
+import { KitTooltip as H } from "../Tooltip/index.js";
+import { u as P } from "../../../chunks/useKitLocale.96CdK3og.js";
+const I = {
+  "kit-tag": "_kit-tag_6ocqb_2",
+  "kit-tag-group": "_kit-tag-group_6ocqb_111",
+  "kit-tag-group-measure": "_kit-tag-group-measure_6ocqb_117",
+  "kit-tag-group-container": "_kit-tag-group-container_6ocqb_124"
+}, b = D(({ className: t, closeIcon: s, type: u = "neutral", disabled: e, onClick: c, idCardProps: r, ...d }, a) => {
+  const { appId: p } = z(), h = O(p, I["kit-tag"], t, {
+    [`kit-tag-${u}`]: u,
+    "kit-tag-disabled": e,
+    "kit-tag-clickable": c
+  });
+  return i(F, { tabIndex: e ? -1 : 0, ref: a, ...d, className: h, closeIcon: s ?? i(L, { icon: M }), onClick: c, closable: !!d.onClose, children: i(R, { disabled: e, avatarProps: r != null && r.avatarProps ? { ...r == null ? void 0 : r.avatarProps, size: "small" } : void 0, description: r == null ? void 0 : r.description }) });
+}), X = ({ tags: t, containerRef: s, measureRef: u, handleCloseTag: e }) => {
+  var c;
+  const [r, d] = W([]), [a, p] = W(0), [h, $] = W(i(C, {})), v = N(null), { locale: _ } = P();
+  return E(() => {
+    const T = () => {
+      var k, y, o;
+      const n = s.current, f = u.current;
+      if (!n || !f)
+        return;
+      $(x(C, { children: [t.map((l, g) => i(b, { type: l == null ? void 0 : l.type, disabled: l == null ? void 0 : l.disabled, idCardProps: l.idCardProps, onClose: () => {
+        e == null || e(g);
+      } }, g)), i(b, { idCardProps: { description: `+${a} ${(k = _.General) === null || k === void 0 ? void 0 : k.others}` } })] }));
+      const j = n == null ? void 0 : n.clientWidth, w = Array.from(f.children), A = (y = w[w.length - 1]) === null || y === void 0 ? void 0 : y.clientWidth;
+      let q = 0, G = 0;
+      for (let l = 0; l < w.length - 1; l++) {
+        const g = ((o = w[l]) === null || o === void 0 ? void 0 : o.clientWidth) + 8;
+        if (q + g + 8 + (l < t.length - 1 ? A : 0) <= j)
+          q += g, G++;
+        else
+          break;
+      }
+      G < t.length ? (d(t.slice(0, G)), p(t.length - G)) : (d(t), p(0));
+    };
+    let m;
+    const K = () => {
+      clearTimeout(m), m = setTimeout(T, 100);
+    };
+    return T(), v.current = new ResizeObserver(K), s.current && v.current.observe(s.current), () => {
+      v.current && v.current.disconnect(), clearTimeout(m);
+    };
+  }, [s, e, a, (c = _.General) === null || c === void 0 ? void 0 : c.others, u, t]), {
+    measureTags: h,
+    visibleTags: r,
+    hiddenCount: a
+  };
+}, B = ({ tags: t, style: s, className: u, handleCloseTag: e, othersTagType: c = "neutral", othersTagDisabled: r }) => {
+  var d;
+  const a = N(null), p = N(null), { locale: h } = P(), { appId: $ } = z(), [v, _] = W(!1), { measureTags: T, visibleTags: m, hiddenCount: K } = X({ tags: t, containerRef: a, measureRef: p, handleCloseTag: e }), k = () => t.slice(m.length).map((o, n) => {
+    var f;
+    return i("div", { children: (f = o.idCardProps) === null || f === void 0 ? void 0 : f.description }, n);
+  }), y = O($, I["kit-tag-group"], u);
+  return x("div", { className: I["kit-tag-group-container"], children: [x("div", { ref: a, style: s, className: y, children: [m.map((o, n) => i(b, { type: o == null ? void 0 : o.type, disabled: o == null ? void 0 : o.disabled, idCardProps: o.idCardProps, onClose: () => {
+    e == null || e(n);
+  } }, n)), K > 0 && i(H, { overlay: k(), children: i(b, { type: c, disabled: r, idCardProps: { description: `+${K} ${(d = h.General) === null || d === void 0 ? void 0 : d.others}` }, onClick: () => _(!0) }) }), i(V, { isOpen: v, close: () => _(!1), showCloseIcon: !0, title: "Tags", appElement: document.body, children: i("div", { style: { display: "flex", flexWrap: "wrap", rowGap: "8px" }, children: t.map((o, n) => i(b, { id: `tag-${n}`, type: o == null ? void 0 : o.type, disabled: o == null ? void 0 : o.disabled, idCardProps: o.idCardProps, onClose: () => {
+    e == null || e(n);
+  } }, n)) }) })] }), i("div", { ref: p, className: I["kit-tag-group-measure"], "aria-hidden": "true", children: T })] });
+}, J = B, S = b;
+S.displayName = "KitTag";
+S.Group = J;
 export {
-  o as KitTag
+  S as KitTag
 };

package/dist/Kit/DataDisplay/Tag/types.d.ts

@@ -36,6 +36,7 @@ export interface IKitTagGroup {
     style?: CSSProperties;
     othersTagType?: KitTagType;
     othersTagDisabled?: boolean;
+    handleCloseTag?: (index: number) => void;
 }
 
 export interface IUseTagGroup {

package/dist/Kit/DataDisplay/Tag/useTagGroup.d.ts

@@ -1,4 +1,14 @@
 import { RefObject } from 'react';
-import { IKitTagConfig, IUseTagGroup } from './types';
-declare const useTagGroup: (tags: IKitTagConfig[], containerRef: RefObject<HTMLDivElement>, otherRef: RefObject<HTMLElement>) => IUseTagGroup;
-export default useTagGroup;
+import { IKitTagConfig } from './types';
+type TagGroupProps = {
+    tags: IKitTagConfig[];
+    containerRef: RefObject<HTMLDivElement>;
+    measureRef: RefObject<HTMLDivElement>;
+    handleCloseTag?: (index: number) => void;
+};
+export declare const useTagGroup: ({ tags, containerRef, measureRef, handleCloseTag }: TagGroupProps) => {
+    measureTags: import("react/jsx-runtime").JSX.Element;
+    visibleTags: IKitTagConfig[];
+    hiddenCount: number;
+};
+export {};

package/dist/Kit/DataDisplay/Tree/index.js

@@ -1,15 +1,17 @@
-import "../../../assets/index2.css";
-import { jsx as i } from "react/jsx-runtime";
-import { Tree as a } from "antd";
-import { u as n } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
+import "../../../assets/index6.css";
+import { jsx as r } from "react/jsx-runtime";
+import { Tree as n } from "antd";
+import { u as a } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
 import s from "classnames";
-const m = {
-  "kit-tree": "_kit-tree_bkzte_2"
-}, d = ({ className: e, ...o }) => {
-  const { appId: r } = n(), t = s(r, m["kit-tree"], e);
-  return i(a, { ...o, className: t, blockNode: !0, draggable: !1, onDragEnd: void 0, onDragEnter: void 0, onDragLeave: void 0, onDragOver: void 0, onDragStart: void 0, onDrop: void 0 });
+import { FontAwesomeIcon as p } from "@fortawesome/react-fontawesome";
+import { faCircleNotch as d } from "@fortawesome/free-solid-svg-icons";
+const c = {
+  "kit-tree": "_kit-tree_8rr59_2"
+}, l = ({ className: e, switcherLoadingIcon: o, ...t }) => {
+  const { appId: i } = a(), m = s(i, c["kit-tree"], e);
+  return r(n, { ...t, switcherLoadingIcon: o ?? r(p, { icon: d, spin: !0 }), className: m, blockNode: !0, draggable: !1, onDragEnd: void 0, onDragEnter: void 0, onDragLeave: void 0, onDragOver: void 0, onDragStart: void 0, onDrop: void 0 });
 };
-d.displayName = "KitTree";
+l.displayName = "KitTree";
 export {
-  d as KitTree
+  l as KitTree
 };

package/dist/Kit/DataDisplay/index.js

@@ -1,26 +1,34 @@
-import { K as a } from "../../chunks/index.bf78FwPu.js";
-import { KitBadge as i } from "./Badge/index.js";
-import { b as K, c as s, d as m, a as p, e as f, f as x, g as d, h as T, i as g } from "../../chunks/index.2xXr1nME.js";
-import { KitEmpty as C } from "./Empty/index.js";
-import { K as b } from "../../chunks/index.S1tc6cnV.js";
-import { KitTree as E } from "./Tree/index.js";
-import { KitTooltip as u } from "./Tooltip/index.js";
-import { KitTour as y } from "./Tour/index.js";
+import { KitAvatar as o } from "./Avatar/index.js";
+import { KitBadge as m } from "./Badge/index.js";
+import { KitItemCard as p } from "./ItemCard/index.js";
+import { KitCollapse as x } from "./Collapse/index.js";
+import { KitEmpty as a } from "./Empty/index.js";
+import { KitError as T } from "./Error/index.js";
+import { KitIdCard as C } from "./IdCard/index.js";
+import { KitImage as g } from "./Image/index.js";
+import { KitItemList as b } from "./ItemList/index.js";
+import { KitTable as c } from "./Table/index.js";
+import { KitTag as v } from "./Tag/index.js";
+import { KitTabs as A } from "./Tabs/index.js";
+import { KitTree as L } from "./Tree/index.js";
+import { KitTooltip as h } from "./Tooltip/index.js";
+import { KitTour as k } from "./Tour/index.js";
+import { KitRedirectCard as q } from "./RedirectCard/index.js";
 export {
-  a as KitAvatar,
-  i as KitBadge,
-  K as KitCollapse,
-  C as KitEmpty,
-  s as KitError,
-  m as KitIdCard,
-  b as KitImage,
+  o as KitAvatar,
+  m as KitBadge,
+  x as KitCollapse,
+  a as KitEmpty,
+  T as KitError,
+  C as KitIdCard,
+  g as KitImage,
   p as KitItemCard,
-  f as KitItemList,
-  x as KitRedirectCard,
-  d as KitTable,
-  T as KitTabs,
-  g as KitTag,
-  u as KitTooltip,
-  y as KitTour,
-  E as KitTree
+  b as KitItemList,
+  q as KitRedirectCard,
+  c as KitTable,
+  A as KitTabs,
+  v as KitTag,
+  h as KitTooltip,
+  k as KitTour,
+  L as KitTree
 };

package/dist/Kit/DataDisplay/types.d.ts

@@ -1,10 +1,11 @@
 import {ReactNode} from 'react';
 
 export interface IKitActionButton {
-    key: string;
+    key: string | number;
     label: string;
-    icon: ReactNode;
     onClick: (e: unknown) => void;
+    icon?: ReactNode;
     disabled?: boolean;
     title?: string;
+    className?: string;
 }