quirk-ui 0.0.475 → 0.0.477
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),B=require("../../ui/PortableTextRenderer/index.cjs"),X=require("../../hooks/useStyleClasses.cjs"),J=require("../../contexts/LocaleBridge.cjs"),w=require("../../../index-DpYgzTme.cjs"),K=require("../../../core/components/Input/index.cjs"),Q=require("../../../core/components/Select/index.cjs"),V=require("../../cards/BlogArticleCard/index.cjs"),l=require("../../../CategoryFilters-CJsgwMGz.cjs"),Y=require("../../../x-Dft9NVe_.cjs"),F=[{label:"Newest",value:"date-desc"},{label:"Oldest",value:"date-asc"},{label:"Title A-Z",value:"title-asc"},{label:"Title Z-A",value:"title-desc"},{label:"Most Popular",value:"popular-desc"}];function ee({heading:o,layout:$="grid",includeFilters:y,excludeFilters:x,limit:_=3,categoryFilters:u,documentType:g,styleOptions:P}){const[N,
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),B=require("../../ui/PortableTextRenderer/index.cjs"),X=require("../../hooks/useStyleClasses.cjs"),J=require("../../contexts/LocaleBridge.cjs"),w=require("../../../index-DpYgzTme.cjs"),K=require("../../../core/components/Input/index.cjs"),Q=require("../../../core/components/Select/index.cjs"),V=require("../../cards/BlogArticleCard/index.cjs"),l=require("../../../CategoryFilters-CJsgwMGz.cjs"),Y=require("../../../x-Dft9NVe_.cjs"),F=[{label:"Newest",value:"date-desc"},{label:"Oldest",value:"date-asc"},{label:"Title A-Z",value:"title-asc"},{label:"Title Z-A",value:"title-desc"},{label:"Most Popular",value:"popular-desc"}];function ee({heading:o,layout:$="grid",includeFilters:y,excludeFilters:x,limit:_=3,categoryFilters:u,documentType:g,styleOptions:P}){const[N,r]=s.useState([]),[M,z]=s.useState(null),[T,D]=s.useState("date-desc"),[m,S]=s.useState([]),[v,I]=s.useState(null),[L,c]=s.useState(0),[i,k]=s.useState(!1),[h,p]=s.useState(!1),[q,a]=s.useState(!0),[f,j]=s.useState(""),[b,U]=s.useState(""),{locale:H}=J.useLocaleBridge(),O=X.useStyleClasses(P),W={list:l.styles.list}[$??"grid"];s.useEffect(()=>{if(typeof window>"u")return;const t=new URLSearchParams(window.location.search),n=t.getAll("categories");n.length>0&&S(n);const d=t.get("type");d&&I(d),r([]),c(0),a(!0)},[]);const Z=t=>{D(t.target.value),r([]),c(0),a(!0)},A=()=>{p(!h)},G=()=>{r([]),c(0),a(!0),S([]),j(""),p(!1)},E=async()=>{if(i||!q)return;k(!0);const t=new URLSearchParams({start:String(L),limit:String(_),sort:T,documentType:g,locale:H});v&&t.append("type",v),b&&t.append("search",b),m.forEach(n=>t.append("categories",n)),y==null||y.forEach(n=>t.append("include",n._id)),x==null||x.forEach(n=>t.append("exclude",n._id));try{const d=await(await fetch(`/api/articles?${t.toString()}`,{method:"GET"})).json();r(C=>[...C,...d.articles]),c(C=>C+_),z(d.totalCount),L+d.articles.length>=d.totalCount&&a(!1)}catch(n){console.error("Failed to load articles:",n),a(!1)}finally{k(!1)}},R=s.useCallback(()=>{typeof window<"u"&&window.innerWidth>768&&(p(!1),typeof document<"u"&&(document.body.style.overflow=""))},[]);return s.useEffect(()=>{const t=typeof window<"u";return t&&window.addEventListener("resize",R),()=>{t&&window.removeEventListener("resize",R)}},[]),s.useEffect(()=>{if(typeof document<"u")return document.body.style.overflow=h?"hidden":"",()=>{document.body.style.overflow=""}},[h]),s.useEffect(()=>{const t=setTimeout(()=>{U(f)},1e3);return()=>clearTimeout(t)},[f]),s.useEffect(()=>{E()},[b,T,m.join(","),v]),e.jsx("section",{className:`${l.styles.documentList} ${O}`,children:e.jsxs("article",{className:l.styles.container,children:[e.jsxs("div",{className:l.styles.heading,children:[(o==null?void 0:o.title)&&e.jsx(B.RichText,{blocks:o==null?void 0:o.title}),(o==null?void 0:o.description)&&e.jsx(B.RichText,{blocks:o==null?void 0:o.description})]}),e.jsxs("div",{className:l.styles.listContainer,children:[(u==null?void 0:u.length)&&e.jsxs("div",{className:l.styles.filterToggle,children:[e.jsx(w.CallToAction,{as:"button",variant:"secondary",onClick:A,disabled:i,icon:"settings",iconAlignment:"left",children:"Filters"}),e.jsx(w.CallToAction,{as:"button",variant:"link",onClick:G,disabled:i||m.length===0&&f.length===0,children:"Reset"})]}),u&&e.jsx(l.CategoryFilters,{categoryFilters:u,selectedCategories:m,setSelectedCategories:S,setArticles:r,setStart:c,setHasMore:a,showFilters:h,toggleFilters:A,isLoading:i}),e.jsxs("div",{className:l.styles.listWrapper,children:[e.jsxs("div",{className:l.styles.listHeader,children:[e.jsxs("div",{className:l.styles.listResults,children:["Results: ",e.jsx("span",{children:M})]}),e.jsxs("div",{className:l.styles.listHeaderFilters,children:[e.jsxs("div",{className:l.styles.listSearch,children:[e.jsx(K.Input,{type:"text",name:"list-search",placeholder:"Search articles",value:f,onChange:t=>{j(t.target.value),r([]),c(0),a(!0)}}),f&&e.jsx("button",{className:l.styles.clearSearch,onClick:()=>{j(""),r([]),c(0),a(!0)},children:e.jsx(Y.X,{size:21})})]}),e.jsx("div",{className:l.styles.listSort,children:e.jsx(Q.Select,{id:"list-sort",name:"list-sort",options:F,onChange:Z})})]})]}),e.jsx("div",{className:`${l.styles.list} ${W}`,children:N&&N.map(t=>g=="blog"&&e.jsx(V.BlogArticleCard,{article:t},t._id))}),q&&e.jsx("div",{className:l.styles.loadMore,children:e.jsx(w.CallToAction,{as:"button",variant:"primary",onClick:E,disabled:i,icon:"refresh",iconAlignment:"left",className:i?l.styles.buttonIsLoading:"",children:i?"Loading...":"Load more"})})]})]})]})})}exports.DocumentListBlock=ee;
|
|
@@ -27,7 +27,7 @@ function he({
|
|
|
27
27
|
// filterMode,
|
|
28
28
|
styleOptions: I
|
|
29
29
|
}) {
|
|
30
|
-
const [E,
|
|
30
|
+
const [E, i] = a([]), [W, _] = a(null), [R, x] = a("date-desc"), [h, S] = a([]), [y, D] = a(null), [$, c] = a(0), [d, j] = a(!1), [v, w] = a(!1), [z, n] = a(!0), [u, N] = a(""), [g, O] = a(""), { locale: Z } = V(), q = Q(I), G = {
|
|
31
31
|
//grid: styles.grid,
|
|
32
32
|
list: s.list
|
|
33
33
|
}[H ?? "grid"];
|
|
@@ -35,26 +35,26 @@ function he({
|
|
|
35
35
|
if (typeof window > "u") return;
|
|
36
36
|
const e = new URLSearchParams(window.location.search), l = e.getAll("categories");
|
|
37
37
|
l.length > 0 && S(l);
|
|
38
|
-
const
|
|
39
|
-
|
|
38
|
+
const m = e.get("type");
|
|
39
|
+
m && D(m), i([]), c(0), n(!0);
|
|
40
40
|
}, []);
|
|
41
41
|
const X = (e) => {
|
|
42
|
-
x(e.target.value),
|
|
43
|
-
},
|
|
42
|
+
x(e.target.value), i([]), c(0), n(!0);
|
|
43
|
+
}, M = () => {
|
|
44
44
|
w(!v);
|
|
45
45
|
}, J = () => {
|
|
46
|
-
|
|
47
|
-
},
|
|
48
|
-
if (
|
|
49
|
-
|
|
46
|
+
i([]), c(0), n(!0), S([]), N(""), w(!1);
|
|
47
|
+
}, P = async () => {
|
|
48
|
+
if (d || !z) return;
|
|
49
|
+
j(!0);
|
|
50
50
|
const e = new URLSearchParams({
|
|
51
|
-
start: String(
|
|
51
|
+
start: String($),
|
|
52
52
|
limit: String(k),
|
|
53
53
|
sort: R,
|
|
54
54
|
documentType: A,
|
|
55
55
|
locale: Z
|
|
56
56
|
});
|
|
57
|
-
|
|
57
|
+
y && e.append("type", y), g && e.append("search", g), h.forEach(
|
|
58
58
|
(l) => e.append("categories", l)
|
|
59
59
|
), b == null || b.forEach(
|
|
60
60
|
(l) => e.append("include", l._id)
|
|
@@ -62,14 +62,14 @@ function he({
|
|
|
62
62
|
(l) => e.append("exclude", l._id)
|
|
63
63
|
);
|
|
64
64
|
try {
|
|
65
|
-
const
|
|
65
|
+
const m = await (await fetch(`/api/articles?${e.toString()}`, {
|
|
66
66
|
method: "GET"
|
|
67
67
|
})).json();
|
|
68
|
-
|
|
68
|
+
i((L) => [...L, ...m.articles]), c((L) => L + k), _(m.totalCount), $ + m.articles.length >= m.totalCount && n(!1);
|
|
69
69
|
} catch (l) {
|
|
70
70
|
console.error("Failed to load articles:", l), n(!1);
|
|
71
71
|
} finally {
|
|
72
|
-
|
|
72
|
+
j(!1);
|
|
73
73
|
}
|
|
74
74
|
}, U = K(() => {
|
|
75
75
|
typeof window < "u" && window.innerWidth > 768 && (w(!1), typeof document < "u" && (document.body.style.overflow = ""));
|
|
@@ -90,8 +90,8 @@ function he({
|
|
|
90
90
|
}, 1e3);
|
|
91
91
|
return () => clearTimeout(e);
|
|
92
92
|
}, [u]), p(() => {
|
|
93
|
-
|
|
94
|
-
}, [
|
|
93
|
+
P();
|
|
94
|
+
}, [g, R, h.join(","), y]), /* @__PURE__ */ t("section", { className: `${s.documentList} ${q}`, children: /* @__PURE__ */ r("article", { className: s.container, children: [
|
|
95
95
|
/* @__PURE__ */ r("div", { className: s.heading, children: [
|
|
96
96
|
(o == null ? void 0 : o.title) && /* @__PURE__ */ t(B, { blocks: o == null ? void 0 : o.title }),
|
|
97
97
|
(o == null ? void 0 : o.description) && /* @__PURE__ */ t(B, { blocks: o == null ? void 0 : o.description })
|
|
@@ -103,8 +103,8 @@ function he({
|
|
|
103
103
|
{
|
|
104
104
|
as: "button",
|
|
105
105
|
variant: "secondary",
|
|
106
|
-
onClick:
|
|
107
|
-
disabled:
|
|
106
|
+
onClick: M,
|
|
107
|
+
disabled: d,
|
|
108
108
|
icon: "settings",
|
|
109
109
|
iconAlignment: "left",
|
|
110
110
|
children: "Filters"
|
|
@@ -116,7 +116,7 @@ function he({
|
|
|
116
116
|
as: "button",
|
|
117
117
|
variant: "link",
|
|
118
118
|
onClick: J,
|
|
119
|
-
disabled:
|
|
119
|
+
disabled: d || h.length === 0 && u.length === 0,
|
|
120
120
|
children: "Reset"
|
|
121
121
|
}
|
|
122
122
|
)
|
|
@@ -127,12 +127,12 @@ function he({
|
|
|
127
127
|
categoryFilters: f,
|
|
128
128
|
selectedCategories: h,
|
|
129
129
|
setSelectedCategories: S,
|
|
130
|
-
setArticles:
|
|
131
|
-
setStart:
|
|
130
|
+
setArticles: i,
|
|
131
|
+
setStart: c,
|
|
132
132
|
setHasMore: n,
|
|
133
133
|
showFilters: v,
|
|
134
|
-
toggleFilters:
|
|
135
|
-
isLoading:
|
|
134
|
+
toggleFilters: M,
|
|
135
|
+
isLoading: d
|
|
136
136
|
}
|
|
137
137
|
),
|
|
138
138
|
/* @__PURE__ */ r("div", { className: s.listWrapper, children: [
|
|
@@ -151,7 +151,7 @@ function he({
|
|
|
151
151
|
placeholder: "Search articles",
|
|
152
152
|
value: u,
|
|
153
153
|
onChange: (e) => {
|
|
154
|
-
|
|
154
|
+
N(e.target.value), i([]), c(0), n(!0);
|
|
155
155
|
}
|
|
156
156
|
}
|
|
157
157
|
),
|
|
@@ -160,7 +160,7 @@ function he({
|
|
|
160
160
|
{
|
|
161
161
|
className: s.clearSearch,
|
|
162
162
|
onClick: () => {
|
|
163
|
-
|
|
163
|
+
N(""), i([]), c(0), n(!0);
|
|
164
164
|
},
|
|
165
165
|
children: /* @__PURE__ */ t(se, { size: 21 })
|
|
166
166
|
}
|
|
@@ -180,17 +180,17 @@ function he({
|
|
|
180
180
|
/* @__PURE__ */ t("div", { className: `${s.list} ${G}`, children: E && E.map(
|
|
181
181
|
(e) => A == "blog" && /* @__PURE__ */ t(ee, { article: e }, e._id)
|
|
182
182
|
) }),
|
|
183
|
-
|
|
183
|
+
z && /* @__PURE__ */ t("div", { className: s.loadMore, children: /* @__PURE__ */ t(
|
|
184
184
|
T,
|
|
185
185
|
{
|
|
186
186
|
as: "button",
|
|
187
187
|
variant: "primary",
|
|
188
|
-
onClick:
|
|
189
|
-
disabled:
|
|
188
|
+
onClick: P,
|
|
189
|
+
disabled: d,
|
|
190
190
|
icon: "refresh",
|
|
191
191
|
iconAlignment: "left",
|
|
192
|
-
className:
|
|
193
|
-
children:
|
|
192
|
+
className: d ? s.buttonIsLoading : "",
|
|
193
|
+
children: d ? "Loading..." : "Load more"
|
|
194
194
|
}
|
|
195
195
|
) })
|
|
196
196
|
] })
|