@club-employes/utopia 4.372.0 → 4.373.0

package/dist/components/molecules/MyUserGroups/MyUserGroups.d.ts

@@ -7,8 +7,11 @@ declare const _default: DefineComponent<MyUserGroupsProps, {}, {}, {}, {}, Compo
     onDelete?: (() => any) | undefined;
     onEdit?: (() => any) | undefined;
 }>, {
+    showMoreLabel: string;
     peopleLabel: string;
     criteria: UserGroupCriterion[];
     criteriaLabel: string;
+    maxVisibleCriteria: number;
+    showLessLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/molecules/MyUserGroups/types.d.ts

@@ -13,4 +13,7 @@ export interface MyUserGroupsProps {
     peopleLabel?: string;
     criteria?: UserGroupCriterion[];
     criteriaLabel?: string;
+    maxVisibleCriteria?: number;
+    showMoreLabel?: string;
+    showLessLabel?: string;
 }

package/dist/index.js

@@ -48867,12 +48867,20 @@ const IN = /* @__PURE__ */ re(L3, [["__scopeId", "data-v-4d16284f"]]), SF = "dat
     peopleCount: {},
     peopleLabel: { default: "personne(s)" },
     criteria: { default: () => [] },
-    criteriaLabel: { default: "CRITÈRES DE CIBLAGE" }
+    criteriaLabel: { default: "CRITÈRES DE CIBLAGE" },
+    maxVisibleCriteria: { default: 4 },
+    showMoreLabel: { default: "Voir plus ({count})" },
+    showLessLabel: { default: "Voir moins" }
   },
   emits: ["edit", "delete"],
   setup(e, { emit: t }) {
-    const n = t;
-    return (o, l) => (i(), B(h(il), {
+    const n = e, o = t, l = H(!1), a = M(() => (n.criteria?.length ?? 0) > n.maxVisibleCriteria), s = M(
+      () => l.value || !a.value ? n.criteria ?? [] : (n.criteria ?? []).slice(0, n.maxVisibleCriteria)
+    ), c = M(() => {
+      const r = (n.criteria?.length ?? 0) - n.maxVisibleCriteria;
+      return n.showMoreLabel.replace("{count}", String(r));
+    });
+    return (r, u) => (i(), B(h(il), {
       variant: "elevated",
       interactive: !1,
       class: "utopia-my-user-groups"
@@ -48919,7 +48927,7 @@ const IN = /* @__PURE__ */ re(L3, [["__scopeId", "data-v-4d16284f"]]), SF = "dat
               type: "button",
               class: "utopia-my-user-groups__edit-btn",
               "aria-label": `Modifier le groupe ${e.title}`,
-              onClick: l[0] || (l[0] = (a) => n("edit"))
+              onClick: u[0] || (u[0] = (A) => o("edit"))
             }, [
               w(h(W), {
                 name: "Pencil",
@@ -48931,7 +48939,7 @@ const IN = /* @__PURE__ */ re(L3, [["__scopeId", "data-v-4d16284f"]]), SF = "dat
               type: "button",
               class: "utopia-my-user-groups__delete-btn",
               "aria-label": `Supprimer le groupe ${e.title}`,
-              onClick: l[1] || (l[1] = (a) => n("delete"))
+              onClick: u[1] || (u[1] = (A) => o("delete"))
             }, [
               w(h(W), {
                 name: "Trash-2",
@@ -48956,19 +48964,19 @@ const IN = /* @__PURE__ */ re(L3, [["__scopeId", "data-v-4d16284f"]]), SF = "dat
             _: 1
           }),
           e.criteria && e.criteria.length ? (i(), d("div", LI, [
-            (i(!0), d(X, null, de(e.criteria, (a) => (i(), B(h(Gt), {
-              key: a.label,
-              variant: a.variant ?? "secondary",
+            (i(!0), d(X, null, de(s.value, (A) => (i(), B(h(Gt), {
+              key: A.label,
+              variant: A.variant ?? "secondary",
               size: "small",
-              ghost: a.ghost !== !1,
-              "left-icon": a.icon
+              ghost: A.ghost !== !1,
+              "left-icon": A.icon
             }, {
               default: O(() => [
-                a.label.includes(": ") ? (i(), d(X, { key: 0 }, [
-                  S(C(a.label.split(": ")[0]) + ": ", 1),
-                  v("strong", null, C(a.label.split(": ").slice(1).join(": ")), 1)
+                A.label.includes(": ") ? (i(), d(X, { key: 0 }, [
+                  S(C(A.label.split(": ")[0]) + ": ", 1),
+                  v("strong", null, C(A.label.split(": ").slice(1).join(": ")), 1)
                 ], 64)) : (i(), d(X, { key: 1 }, [
-                  S(C(a.label), 1)
+                  S(C(A.label), 1)
                 ], 64))
               ]),
               _: 2
@@ -48979,11 +48987,23 @@ const IN = /* @__PURE__ */ re(L3, [["__scopeId", "data-v-4d16284f"]]), SF = "dat
             size: "xs",
             color: "brand-secondary-200"
           }, {
-            default: O(() => [...l[2] || (l[2] = [
+            default: O(() => [...u[3] || (u[3] = [
               S("Aucun critère", -1)
             ])]),
             _: 1
-          }))
+          })),
+          a.value ? (i(), d("button", {
+            key: 2,
+            type: "button",
+            class: "utopia-my-user-groups__show-more-btn",
+            onClick: u[2] || (u[2] = (A) => l.value = !l.value)
+          }, [
+            v("span", null, C(l.value ? e.showLessLabel : c.value), 1),
+            w(h(W), {
+              name: l.value ? "Chevron-up" : "Chevron-down",
+              size: "small"
+            }, null, 8, ["name"])
+          ])) : P("", !0)
         ])
       ]),
       _: 1
@@ -48991,7 +49011,7 @@ const IN = /* @__PURE__ */ re(L3, [["__scopeId", "data-v-4d16284f"]]), SF = "dat
   }
 }), zd = {};
 typeof zd == "function" && zd(S3);
-const JN = /* @__PURE__ */ re(S3, [["__scopeId", "data-v-d424cf27"]]), j3 = /* @__PURE__ */ Symbol("utopia-tree-context"), SI = {
+const JN = /* @__PURE__ */ re(S3, [["__scopeId", "data-v-5a29b7af"]]), j3 = /* @__PURE__ */ Symbol("utopia-tree-context"), SI = {
   key: 1,
   class: "utopia-tree-node__toggle-placeholder"
 }, jI = {