@logora/debate 0.3.81 → 0.3.82

package/dist/assets/components/list/paginated_list/action_bar/ActionBar.module-VuCq918p.css

@@ -0,0 +1 @@
+._listHeader_7x11f_3{display:flex;justify-content:space-between;align-items:center;position:relative;flex-wrap:wrap;gap:var(--space-unit, 1em)}@container (max-width: 575.98px){._listHeader_7x11f_3{flex-direction:column;align-items:flex-start}._listHeader_7x11f_3._listHeaderOneItem_7x11f_16{flex-direction:row;align-items:center;flex-wrap:nowrap!important}}._listTitle_7x11f_23{font-size:var(--font-size-extra-large, 22px);line-height:var(--line-height-tight, 1.08em);font-weight:var(--font-weight-bold, 700);font-family:var(--title-font-family, var(--font-family, "Montserrat"))}._listSubtitle_7x11f_30{color:var(--text-secondary, #5F5F5F);font-weight:var(--font-weight-normal, 400);font-size:var(--font-size-normal, 16px)}._rightBar_7x11f_36{display:flex;gap:var(--space-unit, 1em);flex-wrap:wrap}@container (max-width: 575.98px){._rightBar_7x11f_36{width:100%;justify-content:space-between}._rightBar_7x11f_36._rightBarOneItem_7x11f_46{justify-content:flex-end}}._rightBar_7x11f_36{flex:1 1 auto;justify-content:flex-end;align-items:center;flex-direction:row}._search_7x11f_57{flex:1;max-width:35%}@container (max-width: 575.98px){._search_7x11f_57{max-width:80%}}._tagList_7x11f_67{display:flex;flex-direction:row;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;gap:var(--spacer-md, calc(var(--space-unit, 1em) * .75));padding-bottom:var(--spacer-md, calc(var(--space-unit, 1em) * .75))}@container (max-width: 575.98px){._tagList_7x11f_67{gap:var(--spacer-sm, calc(var(--space-unit, 1em) * .5))}}._tagItem_7x11f_82{display:flex!important;color:var(--text-secondary, #5F5F5F);cursor:pointer;white-space:nowrap}._select_7x11f_89{max-width:300px}@container (max-width: 575.98px){._select_7x11f_89{max-width:300px}}

package/dist/components/list/paginated_list/PaginatedList.js

@@ -1,19 +1,19 @@
-import { jsxs as $, jsx as c, Fragment as je } from "react/jsx-runtime";
-import Be from "@rooks/use-previous";
-import Le from "classnames";
-import Qe, { useState as m, useEffect as h } from "react";
-import { useIntl as $e } from "react-intl";
-import { useLocation as Pe } from "react-router";
+import { jsxs as $, jsx as c, Fragment as Le } from "react/jsx-runtime";
+import Qe from "@rooks/use-previous";
+import $e from "classnames";
+import Pe, { useState as m, useEffect as h } from "react";
+import { useIntl as Ue } from "react-intl";
+import { useLocation as We } from "react-router";
 import a from "./PaginatedList.module.scss.js";
-import { ActionBar as Ue } from "./action_bar/ActionBar.js";
-import { useList as We } from "../list_provider/useList.js";
-import { useDataProvider as ze } from "../../data/data_provider/useDataProvider.js";
-import { useResponsive as Ge } from "../../hooks/use_responsive/useResponsive.js";
-import { useData as Ve } from "../../data/data_provider/useData.js";
+import { ActionBar as ze } from "./action_bar/ActionBar.js";
+import { useList as Ge } from "../list_provider/useList.js";
+import { useDataProvider as Ve } from "../../data/data_provider/useDataProvider.js";
+import { useResponsive as Xe } from "../../hooks/use_responsive/useResponsive.js";
+import { useData as Ye } from "../../data/data_provider/useData.js";
 import { uniqueBy as x } from "../../util/unique_by/uniqueBy.js";
-import { Pagination as Xe } from "../pagination/Pagination.js";
-import { StandardErrorBoundary as Ye } from "../../error/standard_error_boundary/StandardErrorBoundary.js";
-const dt = ({
+import { Pagination as Ze } from "../pagination/Pagination.js";
+import { StandardErrorBoundary as He } from "../../error/standard_error_boundary/StandardErrorBoundary.js";
+const ft = ({
   query: w,
   sortOptions: i,
   sort: N,
@@ -39,27 +39,29 @@ const dt = ({
   loadingComponent: W,
   searchBar: ce = !1,
   title: ue,
+  subtitle: Ee,
+  showSubtitle: ge = !1,
   emptyListComponent: z,
   emptyText: G,
   display: V,
   elementsPerLine: X,
-  indexLayout: Ee = !1,
-  gap: ge = "1em",
-  withPagination: he = !0,
+  indexLayout: he = !1,
+  gap: pe = "1em",
+  withPagination: ve = !0,
   numberElements: Y,
-  countless: pe,
-  onElementClick: ve,
-  withUrlParams: Se = !1,
+  countless: Se,
+  onElementClick: ye,
+  withUrlParams: we = !1,
   onLoadNewPage: Z
 }) => {
-  const J = $e(), t = We(), H = ze(), I = Pe(), { isMobile: K, isTablet: ye, isDesktop: j } = Ge(), [b, u] = m(!1), [we, Ne] = m(!1), [k, S] = Ve(n, []), [O, Me] = m(
+  const J = Ue(), t = Ge(), H = Ve(), I = We(), { isMobile: K, isTablet: Ne, isDesktop: j } = Xe(), [b, u] = m(!1), [Me, Re] = m(!1), [k, S] = Ye(n, []), [O, be] = m(
     k?.length || 0
-  ), [E, B] = m(M || 1), [y, L] = m(w || null), [C, q] = m(null), [Re, ee] = m(null), d = new URLSearchParams(
+  ), [E, B] = m(M || 1), [y, L] = m(w || null), [C, q] = m(null), [ke, ee] = m(null), d = new URLSearchParams(
     typeof window < "u" ? window.location.search : I.search
-  ), be = () => i && i[0].type === "sort" && i[0].value || N || "", ke = () => {
+  ), Ce = () => i && i[0].type === "sort" && i[0].value || N || "", Fe = () => {
     let e = {};
     return i && i[0].type === "filter" && (e[i[0].name] = i[0].value), o && (e = Object.assign({}, e, o)), e;
-  }, [F, T] = m(be()), [Q, _] = m(ke()), te = Be(o);
+  }, [F, T] = m(Ce()), [Q, _] = m(Fe()), te = Qe(o);
   M && M !== E && B(M), w !== void 0 && w !== y && L(w), N !== void 0 && N !== F && T(N), te && JSON.stringify(o) !== JSON.stringify(te) && JSON.stringify(o) !== JSON.stringify(Q) && _(o), h(() => {
     if (d.get("tagId") && q(Number.parseInt(d.get("tagId"))), d.get("search") && L(d.get("search")), d.get("sort")) {
       T(d.get("sort"));
@@ -92,29 +94,29 @@ const dt = ({
     E > 1 && (u(!0), se(E));
   }, [E]), h(() => {
     if (t.addElements && n in t.addElements && t.addElements[n].length > 0) {
-      Te(t.addElements[n]);
+      xe(t.addElements[n]);
       const e = t.addElements;
       delete e[n], t.setAddElements(e);
     }
   }, [t.addElements]), h(() => {
     if (t.updateElements && n in t.updateElements && (console.log("[PaginatedList] update received for listId:", n, t.updateElements[n]), t.updateElements[n].length > 0)) {
-      _e(t.updateElements[n]);
+      Ae(t.updateElements[n]);
       const e = t.updateElements;
       delete e[n], t.setUpdateElements(e);
     }
   }, [t.updateElements]), h(() => {
     if (t.removeElements && n in t.removeElements && t.removeElements[n].length > 0) {
-      xe(t.removeElements[n]);
+      De(t.removeElements[n]);
       const e = t.removeElements;
       delete e[n], t.setRemoveElements(e);
     }
   }, [t.removeElements]);
-  const Ce = (e) => {
+  const Te = (e) => {
     e.type === "filter" ? (T(""), _({
       ...o,
       [e.name]: e.value
     })) : (T(e.value), _(o ? { ...o } : {}));
-  }, Fe = () => {
+  }, _e = () => {
     typeof Z == "function" && Z() !== null || B(E + 1);
   }, se = (e) => {
     const s = ae ? H.getListWithToken : H.getList;
@@ -124,27 +126,27 @@ const dt = ({
         [le]: p,
         ...F && !y && { [oe]: F },
         ...y && { [me]: y },
-        ...pe === !0 && { countless: !0 },
+        ...Se === !0 && { countless: !0 },
         ...Q,
         ...C && { [de]: C }
       };
       s(A, r).then((l) => {
         const f = l.headers;
-        f && D in f && (Me(
+        f && D in f && (be(
           Number.parseInt(f[D || "total"], 10)
         ), P && P(f[D || "total"]));
         let g = l?.data?.data;
-        R && R(g), U && (g = g.filter(U)), t.addElements && n in t.addElements && t.addElements[n].length > 0 && (g = [...t.addElements[n], g]), Ae(g), u(!1);
+        R && R(g), U && (g = g.filter(U)), t.addElements && n in t.addElements && t.addElements[n].length > 0 && (g = [...t.addElements[n], g]), Je(g), u(!1);
       }).catch((l) => {
-        console.error(l), l?.response?.status !== 404 && Ne(!0), u(!1);
+        console.error(l), l?.response?.status !== 404 && Re(!0), u(!1);
       });
     } else
       u(!1);
-  }, Te = (e) => {
+  }, xe = (e) => {
     S(
       (s) => x([...e, ...s], v || "id")
     ), R && R(e);
-  }, _e = (e) => {
+  }, Ae = (e) => {
     S((s) => {
       let r = s;
       return e.forEach(
@@ -153,29 +155,29 @@ const dt = ({
         )
       ), x(r, v || "id");
     });
-  }, xe = (e) => {
+  }, De = (e) => {
     const s = e.map((l) => l.id), r = k.filter(
       (l) => s.indexOf(l.id) === -1
     );
     S(x(r, v || "id"));
-  }, Ae = (e) => {
+  }, Je = (e) => {
     S(
       (s) => x([...s, ...e], v || "id")
     );
-  }, De = (e, s) => e !== void 0 ? /* @__PURE__ */ c(
+  }, je = (e, s) => e !== void 0 ? /* @__PURE__ */ c(
     "li",
     {
       className: a.paginatedListItem,
       "data-testid": "list-item",
-      onClick: ve,
-      children: /* @__PURE__ */ c(Ye, { hideMessage: !0, children: Qe.cloneElement(re, {
+      onClick: ye,
+      children: /* @__PURE__ */ c(He, { hideMessage: !0, children: Pe.cloneElement(re, {
         index: s,
         [fe]: e
       }) })
     },
     `${e[v || "id"]}_${e.updated_at || e.content}`
-  ) : null, Je = (e) => W ? /* @__PURE__ */ c("li", { className: a.paginatedListItem, children: W }, e) : null;
-  if (we)
+  ) : null, Be = (e) => W ? /* @__PURE__ */ c("li", { className: a.paginatedListItem, children: W }, e) : null;
+  if (Me)
     throw new Error(
       J.formatMessage({
         id: "error.list",
@@ -184,47 +186,49 @@ const dt = ({
     );
   return /* @__PURE__ */ $("div", { className: a.listContainer, children: [
     /* @__PURE__ */ c(
-      Ue,
+      ze,
       {
         title: ue,
+        subtitle: Ee,
+        showSubtitle: ge,
         sortOptions: i,
-        defaultSelectOption: Re,
+        defaultSelectOption: ke,
         searchBar: ce,
         tagList: ne,
         activeTagId: C,
         onSearch: (e) => L(e),
-        onSortChange: Ce,
+        onSortChange: Te,
         onTagChange: (e) => q(e),
-        withUrlParams: Se
+        withUrlParams: we
       }
     ),
     !b && k.length === 0 ? z ? /* @__PURE__ */ c("div", { className: a.emptyListElement, children: z }) : /* @__PURE__ */ c("div", { className: a.emptyList, children: G || J.formatMessage({
       id: "info.emptyList",
       defaultMessage: "No items for now."
-    }) }) : /* @__PURE__ */ $(je, { children: [
+    }) }) : /* @__PURE__ */ $(Le, { children: [
       /* @__PURE__ */ $(
         "ul",
         {
-          className: Le(a.paginatedList, {
+          className: $e(a.paginatedList, {
             [a.paginatedListIsTablet]: !K && !j,
             [a.centeredList]: V === "column",
             [a.column]: V === "column",
             [a.twoElementsPerLine]: X === 2,
             [a.oneElementPerLine]: X === 1,
-            [a.indexLayoutList]: Ee,
+            [a.indexLayoutList]: he,
             [a.listIsDesktop]: j,
-            [a.listIsTablet]: ye && !j,
+            [a.listIsTablet]: Ne && !j,
             [a.listIsMobile]: K
           }),
-          style: { gap: ge },
+          style: { gap: pe },
           children: [
-            k.map(De),
-            b ? Array(p).fill().map((e, s) => s).map(Je) : null
+            k.map(je),
+            b ? Array(p).fill().map((e, s) => s).map(Be) : null
           ]
         }
       ),
-      !b && he !== !1 && /* @__PURE__ */ c(
-        Xe,
+      !b && ve !== !1 && /* @__PURE__ */ c(
+        Ze,
         {
           buttonText: J.formatMessage({
             id: "action.see_more",
@@ -233,7 +237,7 @@ const dt = ({
           currentPage: E,
           perPage: p,
           totalElements: Y || O,
-          onLoad: Fe,
+          onLoad: _e,
           isLoading: b,
           hideLoader: !0,
           "data-tid": "list_read_more"
@@ -243,5 +247,5 @@ const dt = ({
   ] });
 };
 export {
-  dt as PaginatedList
+  ft as PaginatedList
 };

package/dist/components/list/paginated_list/action_bar/ActionBar.js

@@ -1,98 +1,103 @@
-import { jsx as i, Fragment as f, jsxs as m } from "react/jsx-runtime";
-import h from "classnames";
-import { useState as C } from "react";
-import { useIntl as M } from "react-intl";
-import { useLocation as j } from "react-router";
+import { jsx as i, Fragment as h, jsxs as t } from "react/jsx-runtime";
+import u from "classnames";
+import { useState as j } from "react";
+import { useIntl as H } from "react-intl";
+import { useLocation as R } from "react-router";
 import l from "./ActionBar.module.scss.js";
-import { useResponsive as H } from "../../../hooks/use_responsive/useResponsive.js";
-import { SearchInput as R } from "../../../input/search_input/SearchInput.js";
-import { Select as T } from "../../../input/select/Select.js";
-import { Tag as _ } from "../../../tag/tag/Tag.js";
-import { Icon as z } from "../../../icons/icon/Icon.js";
-const X = ({
-  title: n,
-  sortOptions: s,
-  defaultSelectOption: u,
-  searchBar: a = !1,
-  tagList: c,
-  activeTagId: r,
-  withUrlParams: d = !1,
-  onSearch: p,
-  onSortChange: v,
-  onTagChange: S
+import { useResponsive as T } from "../../../hooks/use_responsive/useResponsive.js";
+import { SearchInput as _ } from "../../../input/search_input/SearchInput.js";
+import { Select as z } from "../../../input/select/Select.js";
+import { Tag as D } from "../../../tag/tag/Tag.js";
+import { Icon as F } from "../../../icons/icon/Icon.js";
+const Z = ({
+  title: c,
+  subtitle: f,
+  showSubtitle: p = !1,
+  sortOptions: a,
+  defaultSelectOption: v,
+  searchBar: n = !1,
+  tagList: r,
+  activeTagId: d,
+  withUrlParams: m = !1,
+  onSearch: S,
+  onSortChange: g,
+  onTagChange: I
 }) => {
-  const g = M(), I = j(), { isMobile: D } = H(), [N, x] = C(!1), o = new URLSearchParams(
-    typeof window < "u" ? window.location.search : I.search
-  ), y = (e) => {
-    if (d) {
-      for (const t of o.keys())
-        s.map((k) => {
-          k.name === t && o.delete(t);
+  const N = H(), x = R(), { isMobile: L } = T(), [y, A] = j(!1), s = new URLSearchParams(
+    typeof window < "u" ? window.location.search : x.search
+  ), b = (e) => {
+    if (m) {
+      for (const o of s.keys())
+        a.map((M) => {
+          M.name === o && s.delete(o);
         });
-      o.delete("sort"), o.set(
+      s.delete("sort"), s.set(
         e.type === "filter" ? e.name : "sort",
         e.value
       );
     }
-    v(e);
-  }, A = (e) => {
-    d && (e.id === r ? o.delete("tagId") : o.set("tagId", e.id)), S(e.id === r ? null : e.id);
-  }, b = (e) => {
-    d && (e ? o.set("search", e) : o.delete("search")), p(e), x(e !== "");
+    g(e);
   }, w = (e) => {
-    const t = r === e.id;
+    m && (e.id === d ? s.delete("tagId") : s.set("tagId", e.id)), I(e.id === d ? null : e.id);
+  }, k = (e) => {
+    m && (e ? s.set("search", e) : s.delete("search")), S(e), A(e !== "");
+  }, C = (e) => {
+    const o = d === e.id;
     return /* @__PURE__ */ i(
       "div",
       {
         className: l.tagItem,
-        onClick: () => A(e),
+        onClick: () => w(e),
         children: /* @__PURE__ */ i(
-          _,
+          D,
           {
             text: e.display_name,
-            active: t,
-            rightIcon: t && /* @__PURE__ */ i(z, { name: "close", height: 10, width: 10 })
+            active: o,
+            rightIcon: o && /* @__PURE__ */ i(F, { name: "close", height: 10, width: 10 })
           }
         )
       },
       e.id
     );
   };
-  return /* @__PURE__ */ i(f, { children: (n || s || a) && /* @__PURE__ */ m(f, { children: [
-    /* @__PURE__ */ m(
+  return /* @__PURE__ */ i(h, { children: (c || a || n) && /* @__PURE__ */ t(h, { children: [
+    /* @__PURE__ */ t(
       "div",
       {
-        className: h(l.listHeader, {
-          [l.listHeaderOneItem]: !a || !s
+        className: u(l.listHeader, {
+          [l.listHeaderOneItem]: !n || !a
         }),
         children: [
-          n && /* @__PURE__ */ i("div", { className: l.listTitle, children: n }),
-          (s || a) && /* @__PURE__ */ m(
+          /* @__PURE__ */ t("div", { children: [
+            c && /* @__PURE__ */ i("div", { className: l.listTitle, children: c }),
+            p && f && /* @__PURE__ */ i("div", { className: l.listSubtitle, children: f })
+          ] }),
+          (a || n) && /* @__PURE__ */ t(
             "div",
             {
-              className: h(l.rightBar, {
-                [l.rightBarOneItem]: !a || !s
+              className: u(l.rightBar, {
+                [l.rightBarOneItem]: !n || !a
               }),
               children: [
-                a ? /* @__PURE__ */ i("div", { className: l.search, children: /* @__PURE__ */ i(
-                  R,
+                n ? /* @__PURE__ */ i("div", { className: l.search, children: /* @__PURE__ */ i(
+                  _,
                   {
-                    onSearchSubmit: b,
-                    placeholder: g.formatMessage({
+                    onSearchSubmit: k,
+                    placeholder: N.formatMessage({
                       id: "info.search_mobile",
                       defaultMessage: "Search"
                     }),
                     reducedByDefault: !1
                   }
                 ) }) : null,
-                s ? /* @__PURE__ */ i(
-                  T,
+                a ? /* @__PURE__ */ i(
+                  z,
                   {
-                    onChange: y,
-                    options: s,
-                    defaultOption: u,
+                    onChange: b,
+                    options: a,
+                    defaultOption: v,
                     horizontalPosition: "right",
-                    disabled: N,
+                    disabled: y,
                     className: l.select
                   }
                 ) : null
@@ -102,9 +107,9 @@ const X = ({
         ]
       }
     ),
-    c && c.length > 0 && /* @__PURE__ */ i("div", { className: l.tagList, children: c.map(w) })
+    r && r.length > 0 && /* @__PURE__ */ i("div", { className: l.tagList, children: r.map(C) })
   ] }) });
 };
 export {
-  X as ActionBar
+  Z as ActionBar
 };

package/dist/components/list/paginated_list/action_bar/ActionBar.module.scss.js

@@ -1,23 +1,25 @@
-import '../../../../assets/components/list/paginated_list/action_bar/ActionBar.module-pxwFC_Y2.css';const t = "_listHeader_fbaxc_3", e = "_listHeaderOneItem_fbaxc_16", a = "_listTitle_fbaxc_23", s = "_rightBar_fbaxc_30", _ = "_rightBarOneItem_fbaxc_40", c = "_search_fbaxc_51", r = "_tagList_fbaxc_61", i = "_tagItem_fbaxc_76", l = "_select_fbaxc_83", n = {
+import '../../../../assets/components/list/paginated_list/action_bar/ActionBar.module-VuCq918p.css';const t = "_listHeader_7x11f_3", e = "_listHeaderOneItem_7x11f_16", s = "_listTitle_7x11f_23", _ = "_listSubtitle_7x11f_30", i = "_rightBar_7x11f_36", a = "_rightBarOneItem_7x11f_46", l = "_search_7x11f_57", r = "_tagList_7x11f_67", c = "_tagItem_7x11f_82", n = "_select_7x11f_89", g = {
   listHeader: t,
   listHeaderOneItem: e,
-  listTitle: a,
-  rightBar: s,
-  rightBarOneItem: _,
-  search: c,
+  listTitle: s,
+  listSubtitle: _,
+  rightBar: i,
+  rightBarOneItem: a,
+  search: l,
   tagList: r,
-  tagItem: i,
-  select: l
+  tagItem: c,
+  select: n
 };
 export {
-  n as default,
+  g as default,
   t as listHeader,
   e as listHeaderOneItem,
-  a as listTitle,
-  s as rightBar,
-  _ as rightBarOneItem,
-  c as search,
-  l as select,
-  i as tagItem,
+  _ as listSubtitle,
+  s as listTitle,
+  i as rightBar,
+  a as rightBarOneItem,
+  l as search,
+  n as select,
+  c as tagItem,
   r as tagList
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logora/debate",
-  "version": "0.3.81",
+  "version": "0.3.82",
   "type": "module",
   "license": "AGPL-3.0",
   "description": "Design system of @Logora made with React",

package/dist/assets/components/list/paginated_list/action_bar/ActionBar.module-pxwFC_Y2.css

@@ -1 +0,0 @@
-._listHeader_fbaxc_3{display:flex;justify-content:space-between;align-items:center;position:relative;flex-wrap:wrap;gap:var(--space-unit, 1em)}@container (max-width: 575.98px){._listHeader_fbaxc_3{flex-direction:column;align-items:flex-start}._listHeader_fbaxc_3._listHeaderOneItem_fbaxc_16{flex-direction:row;align-items:center;flex-wrap:nowrap!important}}._listTitle_fbaxc_23{font-size:var(--font-size-extra-large, 22px);line-height:var(--line-height-tight, 1.08em);font-weight:var(--font-weight-bold, 700);font-family:var(--title-font-family, var(--font-family, "Montserrat"))}._rightBar_fbaxc_30{display:flex;gap:var(--space-unit, 1em);flex-wrap:wrap}@container (max-width: 575.98px){._rightBar_fbaxc_30{width:100%;justify-content:space-between}._rightBar_fbaxc_30._rightBarOneItem_fbaxc_40{justify-content:flex-end}}._rightBar_fbaxc_30{flex:1 1 auto;justify-content:flex-end;align-items:center;flex-direction:row}._search_fbaxc_51{flex:1;max-width:35%}@container (max-width: 575.98px){._search_fbaxc_51{max-width:80%}}._tagList_fbaxc_61{display:flex;flex-direction:row;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;gap:var(--spacer-md, calc(var(--space-unit, 1em) * .75));padding-bottom:var(--spacer-md, calc(var(--space-unit, 1em) * .75))}@container (max-width: 575.98px){._tagList_fbaxc_61{gap:var(--spacer-sm, calc(var(--space-unit, 1em) * .5))}}._tagItem_fbaxc_76{display:flex!important;color:var(--text-secondary, #5F5F5F);cursor:pointer;white-space:nowrap}._select_fbaxc_83{max-width:300px}@container (max-width: 575.98px){._select_fbaxc_83{max-width:300px}}