@fluid-app/portal-widgets 0.1.17

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.
Files changed (145) hide show
  1. package/dist/AlertWidget-AS_8Jjbd.cjs +39 -0
  2. package/dist/AlertWidget-AS_8Jjbd.cjs.map +1 -0
  3. package/dist/AlertWidget-Dy6pBmXm.mjs +22 -0
  4. package/dist/AlertWidget-Dy6pBmXm.mjs.map +1 -0
  5. package/dist/CalendarWidget-DAHnT9Wn.mjs +424 -0
  6. package/dist/CalendarWidget-DAHnT9Wn.mjs.map +1 -0
  7. package/dist/CalendarWidget-DW7q6Q7_.cjs +441 -0
  8. package/dist/CalendarWidget-DW7q6Q7_.cjs.map +1 -0
  9. package/dist/CarouselWidget-BJvLjY7H.mjs +436 -0
  10. package/dist/CarouselWidget-BJvLjY7H.mjs.map +1 -0
  11. package/dist/CarouselWidget-Bdn0LVXT.cjs +453 -0
  12. package/dist/CarouselWidget-Bdn0LVXT.cjs.map +1 -0
  13. package/dist/CatchUpWidget-CZMptzf8.cjs +264 -0
  14. package/dist/CatchUpWidget-CZMptzf8.cjs.map +1 -0
  15. package/dist/CatchUpWidget-vEP5scfy.mjs +247 -0
  16. package/dist/CatchUpWidget-vEP5scfy.mjs.map +1 -0
  17. package/dist/ChartWidget-B3GcdLqH.mjs +415 -0
  18. package/dist/ChartWidget-B3GcdLqH.mjs.map +1 -0
  19. package/dist/ChartWidget-DQB7K6S0.cjs +432 -0
  20. package/dist/ChartWidget-DQB7K6S0.cjs.map +1 -0
  21. package/dist/ContainerWidget-B-4hcPKJ.mjs +44 -0
  22. package/dist/ContainerWidget-B-4hcPKJ.mjs.map +1 -0
  23. package/dist/ContainerWidget-CHa4gVvV.cjs +2 -0
  24. package/dist/ContainerWidget-rGsakG66.cjs +51 -0
  25. package/dist/ContainerWidget-rGsakG66.cjs.map +1 -0
  26. package/dist/EmbedWidget-ChLVA_9a.mjs +156 -0
  27. package/dist/EmbedWidget-ChLVA_9a.mjs.map +1 -0
  28. package/dist/EmbedWidget-mv5ce32s.cjs +173 -0
  29. package/dist/EmbedWidget-mv5ce32s.cjs.map +1 -0
  30. package/dist/ImageWidget-DFt4mJJx.cjs +167 -0
  31. package/dist/ImageWidget-DFt4mJJx.cjs.map +1 -0
  32. package/dist/ImageWidget-DMubcgat.mjs +150 -0
  33. package/dist/ImageWidget-DMubcgat.mjs.map +1 -0
  34. package/dist/LayoutWidget-BEi0yFpz.mjs +107 -0
  35. package/dist/LayoutWidget-BEi0yFpz.mjs.map +1 -0
  36. package/dist/LayoutWidget-C4-ka0Ge.cjs +114 -0
  37. package/dist/LayoutWidget-C4-ka0Ge.cjs.map +1 -0
  38. package/dist/LayoutWidget-D4haEqTQ.cjs +2 -0
  39. package/dist/ListWidget-C-jcsCb4.mjs +901 -0
  40. package/dist/ListWidget-C-jcsCb4.mjs.map +1 -0
  41. package/dist/ListWidget-RHQ2fQXa.cjs +919 -0
  42. package/dist/ListWidget-RHQ2fQXa.cjs.map +1 -0
  43. package/dist/MediaRenderer-CcJvyOJ1.cjs +181 -0
  44. package/dist/MediaRenderer-CcJvyOJ1.cjs.map +1 -0
  45. package/dist/MediaRenderer-Uq90PZcY.mjs +163 -0
  46. package/dist/MediaRenderer-Uq90PZcY.mjs.map +1 -0
  47. package/dist/MySiteWidget-A_cYFgxJ.cjs +279 -0
  48. package/dist/MySiteWidget-A_cYFgxJ.cjs.map +1 -0
  49. package/dist/MySiteWidget-DariqlfU.mjs +262 -0
  50. package/dist/MySiteWidget-DariqlfU.mjs.map +1 -0
  51. package/dist/NestedWidget-CNkwGwhM.mjs +330 -0
  52. package/dist/NestedWidget-CNkwGwhM.mjs.map +1 -0
  53. package/dist/NestedWidget-ofk9O-t1.cjs +346 -0
  54. package/dist/NestedWidget-ofk9O-t1.cjs.map +1 -0
  55. package/dist/QuickShareWidget-DWvgEy74.cjs +262 -0
  56. package/dist/QuickShareWidget-DWvgEy74.cjs.map +1 -0
  57. package/dist/QuickShareWidget-DXq5lcDn.mjs +245 -0
  58. package/dist/QuickShareWidget-DXq5lcDn.mjs.map +1 -0
  59. package/dist/RecentActivityWidget-BvncOdax.mjs +391 -0
  60. package/dist/RecentActivityWidget-BvncOdax.mjs.map +1 -0
  61. package/dist/RecentActivityWidget-wODng8dt.cjs +408 -0
  62. package/dist/RecentActivityWidget-wODng8dt.cjs.map +1 -0
  63. package/dist/RegistryContext-CscXrsRa.mjs +36 -0
  64. package/dist/RegistryContext-CscXrsRa.mjs.map +1 -0
  65. package/dist/RegistryContext-xjea4xVV.cjs +55 -0
  66. package/dist/RegistryContext-xjea4xVV.cjs.map +1 -0
  67. package/dist/ScreenRenderer-D52h5VQr.mjs +76 -0
  68. package/dist/ScreenRenderer-D52h5VQr.mjs.map +1 -0
  69. package/dist/ScreenRenderer-DZAxcg7x.cjs +82 -0
  70. package/dist/ScreenRenderer-DZAxcg7x.cjs.map +1 -0
  71. package/dist/ScreenRendererContext-CK1IsFTn.cjs +36 -0
  72. package/dist/ScreenRendererContext-CK1IsFTn.cjs.map +1 -0
  73. package/dist/ScreenRendererContext-DKcdcmiT.mjs +23 -0
  74. package/dist/ScreenRendererContext-DKcdcmiT.mjs.map +1 -0
  75. package/dist/SpacerWidget-Bgz6701y.cjs +60 -0
  76. package/dist/SpacerWidget-Bgz6701y.cjs.map +1 -0
  77. package/dist/SpacerWidget-DHGoW6eu.mjs +43 -0
  78. package/dist/SpacerWidget-DHGoW6eu.mjs.map +1 -0
  79. package/dist/TableWidget--yLJTqoW.mjs +438 -0
  80. package/dist/TableWidget--yLJTqoW.mjs.map +1 -0
  81. package/dist/TableWidget-TfQfFHft.cjs +455 -0
  82. package/dist/TableWidget-TfQfFHft.cjs.map +1 -0
  83. package/dist/TextWidget-CL2H3vei.mjs +129 -0
  84. package/dist/TextWidget-CL2H3vei.mjs.map +1 -0
  85. package/dist/TextWidget-D6Ug_2Z1.cjs +146 -0
  86. package/dist/TextWidget-D6Ug_2Z1.cjs.map +1 -0
  87. package/dist/ToDoWidget-D8YIsl7y.mjs +274 -0
  88. package/dist/ToDoWidget-D8YIsl7y.mjs.map +1 -0
  89. package/dist/ToDoWidget-Dvs0GDkx.cjs +291 -0
  90. package/dist/ToDoWidget-Dvs0GDkx.cjs.map +1 -0
  91. package/dist/VideoWidget-D6C_jHOF.mjs +192 -0
  92. package/dist/VideoWidget-D6C_jHOF.mjs.map +1 -0
  93. package/dist/VideoWidget-SODAPZO4.cjs +209 -0
  94. package/dist/VideoWidget-SODAPZO4.cjs.map +1 -0
  95. package/dist/chunk-CZWwpsFl.cjs +43 -0
  96. package/dist/components/index.cjs +14 -0
  97. package/dist/components/index.cjs.map +1 -0
  98. package/dist/components/index.d.cts +11 -0
  99. package/dist/components/index.d.cts.map +1 -0
  100. package/dist/components/index.d.mts +11 -0
  101. package/dist/components/index.d.mts.map +1 -0
  102. package/dist/components/index.mjs +11 -0
  103. package/dist/components/index.mjs.map +1 -0
  104. package/dist/contexts/index.cjs +8 -0
  105. package/dist/contexts/index.d.cts +77 -0
  106. package/dist/contexts/index.d.cts.map +1 -0
  107. package/dist/contexts/index.d.mts +77 -0
  108. package/dist/contexts/index.d.mts.map +1 -0
  109. package/dist/contexts/index.mjs +3 -0
  110. package/dist/core/index.cjs +51 -0
  111. package/dist/core/index.d.cts +77 -0
  112. package/dist/core/index.d.cts.map +1 -0
  113. package/dist/core/index.d.mts +77 -0
  114. package/dist/core/index.d.mts.map +1 -0
  115. package/dist/core/index.mjs +4 -0
  116. package/dist/error-state-DErSxZwH.mjs +18 -0
  117. package/dist/error-state-DErSxZwH.mjs.map +1 -0
  118. package/dist/error-state-DSzVUtEl.cjs +24 -0
  119. package/dist/error-state-DSzVUtEl.cjs.map +1 -0
  120. package/dist/fields-4FC6JUNH.d.mts +2 -0
  121. package/dist/fields-DjLFJmz6.d.cts +2 -0
  122. package/dist/fields-wPOk-SmZ.mjs +2 -0
  123. package/dist/rolldown-runtime-wcPFST8Q.mjs +13 -0
  124. package/dist/scroll-arrows-BZIlsE_x.cjs +35 -0
  125. package/dist/scroll-arrows-BZIlsE_x.cjs.map +1 -0
  126. package/dist/scroll-arrows-BevCYRNT.mjs +29 -0
  127. package/dist/scroll-arrows-BevCYRNT.mjs.map +1 -0
  128. package/dist/ui/index.cjs +101 -0
  129. package/dist/ui/index.d.cts +15 -0
  130. package/dist/ui/index.d.cts.map +1 -0
  131. package/dist/ui/index.d.mts +15 -0
  132. package/dist/ui/index.d.mts.map +1 -0
  133. package/dist/ui/index.mjs +3 -0
  134. package/dist/widgets/index.cjs +92 -0
  135. package/dist/widgets/index.cjs.map +1 -0
  136. package/dist/widgets/index.d.cts +689 -0
  137. package/dist/widgets/index.d.cts.map +1 -0
  138. package/dist/widgets/index.d.mts +689 -0
  139. package/dist/widgets/index.d.mts.map +1 -0
  140. package/dist/widgets/index.mjs +46 -0
  141. package/dist/widgets/index.mjs.map +1 -0
  142. package/package.json +104 -0
  143. package/src/styles/globals.css +23 -0
  144. package/src/styles/index.ts +1 -0
  145. package/tailwind.config.ts +61 -0
@@ -0,0 +1,901 @@
1
+ import { t as __exportAll } from "./rolldown-runtime-wcPFST8Q.mjs";
2
+ import { a as getFontSizeField, c as getPaddingField, i as getColorField, n as getBorderRadiusField, o as getGapField, t as gapValues } from "./fields-wPOk-SmZ.mjs";
3
+ import { t as ScrollArrows } from "./scroll-arrows-BevCYRNT.mjs";
4
+ import { t as MediaRenderer } from "./MediaRenderer-Uq90PZcY.mjs";
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
+ import { useRef } from "react";
7
+ import DOMPurify from "dompurify";
8
+ //#region src/widgets/list-widget/FeaturedSection.tsx
9
+ function FeaturedSection({ borderRadius, titleSize, featuredTitle, featuredSubtitle, featuredButtonText, featuredButtonUrl, featuredSubtitleColor, featuredSubtitleSize, asset }) {
10
+ return /* @__PURE__ */ jsxs("div", {
11
+ className: `relative h-full min-h-[300px] w-full overflow-hidden rounded-${borderRadius}`,
12
+ children: [
13
+ /* @__PURE__ */ jsx("div", {
14
+ className: "absolute inset-0 h-full w-full",
15
+ children: /* @__PURE__ */ jsx(MediaRenderer, {
16
+ src: asset.url,
17
+ mediaType: asset.isVideo ? "video" : "image",
18
+ alt: featuredTitle || "Featured",
19
+ objectFit: "cover",
20
+ autoplay: asset.isVideo,
21
+ loop: asset.isVideo,
22
+ muted: asset.isVideo,
23
+ controls: false
24
+ })
25
+ }),
26
+ /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/40" }),
27
+ /* @__PURE__ */ jsxs("div", {
28
+ className: "absolute inset-0 flex flex-col items-start justify-end p-8",
29
+ children: [
30
+ featuredTitle && /* @__PURE__ */ jsx("h3", {
31
+ className: `mb-2 font-bold text-white text-${titleSize === "md" ? "base" : titleSize}`,
32
+ children: featuredTitle
33
+ }),
34
+ featuredSubtitle && /* @__PURE__ */ jsx("p", {
35
+ className: `mb-4 text-${featuredSubtitleColor} text-${featuredSubtitleSize === "md" ? "base" : featuredSubtitleSize}`,
36
+ children: featuredSubtitle
37
+ }),
38
+ featuredButtonText && /* @__PURE__ */ jsx("a", {
39
+ href: featuredButtonUrl || "#",
40
+ className: `text-foreground bg-white px-6 py-2 font-medium transition-opacity hover:opacity-90 rounded-${borderRadius}`,
41
+ children: featuredButtonText
42
+ })
43
+ ]
44
+ })
45
+ ]
46
+ });
47
+ }
48
+ //#endregion
49
+ //#region src/widgets/list-widget/ListItemCard.tsx
50
+ function getStringValue(value) {
51
+ if (!value) return "";
52
+ if (typeof value === "string") return value;
53
+ if (typeof value === "number") return String(value);
54
+ if (typeof value === "object" && value !== null) {
55
+ if ("body" in value) {
56
+ const body = value.body;
57
+ if (typeof body === "string") return body;
58
+ }
59
+ if ("text" in value) {
60
+ const text = value.text;
61
+ if (typeof text === "string") return text;
62
+ }
63
+ if ("value" in value) {
64
+ const val = value.value;
65
+ if (typeof val === "string") return val;
66
+ if (typeof val === "number") return String(val);
67
+ }
68
+ }
69
+ return "";
70
+ }
71
+ /**
72
+ * Strips parenthetical text like "(USD)" from price strings.
73
+ * Matches the shop page's stripParentheticalText pattern.
74
+ */
75
+ function stripParentheticalText(text) {
76
+ return text.replace(/\s*\([^)]*\)/g, "").trim();
77
+ }
78
+ /**
79
+ * Formats a price for display. Follows the shop page pattern:
80
+ * prices arrive pre-formatted from the API via display_price
81
+ * (e.g. "$19.99", "€15.00 (EUR)") so we just extract the string
82
+ * and strip parenthetical suffixes.
83
+ */
84
+ function formatPrice(value) {
85
+ const str = getStringValue(value);
86
+ if (!str) return "";
87
+ return stripParentheticalText(str);
88
+ }
89
+ function ListItemCardContent({ item, padding, itemTitleColor, itemTitleSize, descriptionColor, descriptionSize, priceColor, priceSize, originalPriceColor, metaTextColor, metaTextSize, showMetaText }) {
90
+ return /* @__PURE__ */ jsxs("div", {
91
+ className: `p-${padding}`,
92
+ children: [
93
+ item.title && /* @__PURE__ */ jsx("h3", {
94
+ className: `text-${itemTitleColor} text-${itemTitleSize === "md" ? "base" : itemTitleSize} mb-1 font-semibold`,
95
+ children: getStringValue(item.title)
96
+ }),
97
+ item.description && /* @__PURE__ */ jsx("div", {
98
+ className: `text-${descriptionColor} text-${descriptionSize === "md" ? "base" : descriptionSize} mb-2 line-clamp-2 overflow-hidden`,
99
+ dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(item.description ?? "", {
100
+ ALLOWED_TAGS: [
101
+ "br",
102
+ "strong",
103
+ "em",
104
+ "b",
105
+ "i",
106
+ "ul",
107
+ "ol",
108
+ "li",
109
+ "p"
110
+ ],
111
+ ALLOWED_ATTR: []
112
+ }) }
113
+ }),
114
+ /* @__PURE__ */ jsxs("div", {
115
+ className: "flex items-center gap-2",
116
+ children: [(item.display_price || item.price) && /* @__PURE__ */ jsx("span", {
117
+ className: `text-${priceColor} text-${priceSize === "md" ? "base" : priceSize} font-bold`,
118
+ children: formatPrice(item.display_price || item.price)
119
+ }), item.originalPrice && /* @__PURE__ */ jsx("span", {
120
+ className: `text-${originalPriceColor} text-${descriptionSize === "md" ? "base" : descriptionSize} line-through`,
121
+ children: formatPrice(item.originalPrice)
122
+ })]
123
+ }),
124
+ showMetaText && (item.qv || item.cv) && /* @__PURE__ */ jsxs("div", {
125
+ className: `mt-2 flex gap-3 text-${metaTextColor} text-${metaTextSize === "md" ? "base" : metaTextSize}`,
126
+ children: [item.qv && /* @__PURE__ */ jsxs("span", { children: ["QV: ", getStringValue(item.qv)] }), item.cv && /* @__PURE__ */ jsxs("span", { children: ["CV: ", getStringValue(item.cv)] })]
127
+ })
128
+ ]
129
+ });
130
+ }
131
+ function DiscountBadge({ discount }) {
132
+ return /* @__PURE__ */ jsx("div", {
133
+ className: "bg-destructive text-destructive-foreground absolute top-2 right-2 z-10 rounded-md px-2 py-1 text-xs font-bold",
134
+ children: getStringValue(discount)
135
+ });
136
+ }
137
+ function FavoriteButton({ className }) {
138
+ return /* @__PURE__ */ jsx("button", {
139
+ className: className || "bg-background/80 hover:bg-background absolute top-2 left-2 z-10 rounded-full p-2 backdrop-blur-sm transition-colors",
140
+ children: /* @__PURE__ */ jsx("svg", {
141
+ className: "text-muted-foreground h-5 w-5",
142
+ fill: "none",
143
+ stroke: "currentColor",
144
+ viewBox: "0 0 24 24",
145
+ children: /* @__PURE__ */ jsx("path", {
146
+ strokeLinecap: "round",
147
+ strokeLinejoin: "round",
148
+ strokeWidth: 2,
149
+ d: "M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"
150
+ })
151
+ })
152
+ });
153
+ }
154
+ //#endregion
155
+ //#region src/widgets/list-widget/UnorderedList.tsx
156
+ const getImageUrl$1 = (item) => {
157
+ return item.imageUrl || item.image;
158
+ };
159
+ const getAspectRatioClass$1 = (ratio) => {
160
+ return {
161
+ square: "aspect-square",
162
+ landscape: "aspect-video",
163
+ portrait: "aspect-[3/4]"
164
+ }[ratio];
165
+ };
166
+ const getResponsiveGridClass = (columns) => {
167
+ return {
168
+ 1: "grid-cols-2 @lg:grid-cols-1",
169
+ 2: "grid-cols-2 @lg:grid-cols-2",
170
+ 3: "grid-cols-2 @lg:grid-cols-3",
171
+ 4: "grid-cols-2 @lg:grid-cols-4",
172
+ 5: "grid-cols-2 @lg:grid-cols-5",
173
+ 6: "grid-cols-2 @lg:grid-cols-6"
174
+ }[columns] || "grid-cols-2 @lg:grid-cols-3";
175
+ };
176
+ function UnorderedList({ items, columns, gap, borderRadius, imageAspectRatio, showBadge, showFavorite, padding, itemTitleColor, itemTitleSize, descriptionColor, descriptionSize, priceColor, priceSize, originalPriceColor, metaTextColor, metaTextSize, showMetaText }) {
177
+ return /* @__PURE__ */ jsx("div", {
178
+ className: `grid ${getResponsiveGridClass(columns)} gap-${gapValues[gap]}`,
179
+ children: items.map((item) => {
180
+ const imageUrl = getImageUrl$1(item);
181
+ const aspectRatioClass = getAspectRatioClass$1(imageAspectRatio);
182
+ return /* @__PURE__ */ jsxs("div", {
183
+ className: `relative rounded-${borderRadius} bg-background overflow-hidden shadow-sm transition-shadow hover:shadow-md`,
184
+ children: [
185
+ showBadge && item.discount && /* @__PURE__ */ jsx(DiscountBadge, { discount: item.discount }),
186
+ showFavorite && /* @__PURE__ */ jsx(FavoriteButton, {}),
187
+ imageUrl && /* @__PURE__ */ jsx("div", {
188
+ className: `w-full ${aspectRatioClass} overflow-hidden`,
189
+ children: /* @__PURE__ */ jsx("img", {
190
+ src: imageUrl,
191
+ alt: item.title || "Product",
192
+ className: "h-full w-full object-cover"
193
+ })
194
+ }),
195
+ /* @__PURE__ */ jsx(ListItemCardContent, {
196
+ item,
197
+ padding,
198
+ itemTitleColor,
199
+ itemTitleSize,
200
+ descriptionColor,
201
+ descriptionSize,
202
+ priceColor,
203
+ priceSize,
204
+ originalPriceColor,
205
+ metaTextColor,
206
+ metaTextSize,
207
+ showMetaText
208
+ })
209
+ ]
210
+ }, item.id);
211
+ })
212
+ });
213
+ }
214
+ //#endregion
215
+ //#region src/widgets/list-widget/OrderedList.tsx
216
+ const SCROLL_ITEM_WIDTH = 300;
217
+ const getImageUrl = (item) => {
218
+ return item.imageUrl || item.image;
219
+ };
220
+ const getAspectRatioClass = (ratio) => {
221
+ return {
222
+ square: "aspect-square",
223
+ landscape: "aspect-video",
224
+ portrait: "aspect-[3/4]"
225
+ }[ratio];
226
+ };
227
+ const largeNumberSizes = {
228
+ xs: "8rem",
229
+ sm: "10rem",
230
+ md: "12rem",
231
+ lg: "14rem",
232
+ xl: "16rem",
233
+ "2xl": "20rem"
234
+ };
235
+ function OrderedList({ items, scrollAxis, gap, borderRadius, imageAspectRatio, showBadge, showFavorite, padding, itemTitleColor, itemTitleSize, descriptionColor, descriptionSize, priceColor, priceSize, originalPriceColor, metaTextColor, metaTextSize, numberColor, numberSize, showMetaText }) {
236
+ const scrollContainerRef = useRef(null);
237
+ const scrollByAmount = (direction) => {
238
+ const container = scrollContainerRef.current;
239
+ if (!container) return;
240
+ const scrollAmount = SCROLL_ITEM_WIDTH + (parseFloat(getComputedStyle(container).gap) || 0);
241
+ container.scrollTo({
242
+ left: container.scrollLeft + (direction === "next" ? scrollAmount : -scrollAmount),
243
+ behavior: "smooth"
244
+ });
245
+ };
246
+ const contentProps = {
247
+ padding,
248
+ itemTitleColor,
249
+ itemTitleSize,
250
+ descriptionColor,
251
+ descriptionSize,
252
+ priceColor,
253
+ priceSize,
254
+ originalPriceColor,
255
+ metaTextColor,
256
+ metaTextSize,
257
+ showMetaText
258
+ };
259
+ if (scrollAxis === "horizontal") return /* @__PURE__ */ jsxs("div", {
260
+ className: "relative",
261
+ children: [/* @__PURE__ */ jsx("div", {
262
+ ref: scrollContainerRef,
263
+ className: `flex gap-${gapValues[gap]} scrollbar-hide overflow-x-auto overflow-y-hidden scroll-smooth`,
264
+ children: items.map((item, index) => {
265
+ const imageUrl = getImageUrl(item);
266
+ const aspectRatioClass = getAspectRatioClass(imageAspectRatio);
267
+ return /* @__PURE__ */ jsxs("div", {
268
+ className: "relative w-[300px] flex-shrink-0",
269
+ children: [/* @__PURE__ */ jsx("div", {
270
+ className: `absolute top-0 left-0 text-${numberColor} z-0 leading-none font-bold opacity-20`,
271
+ style: { fontSize: largeNumberSizes[numberSize] },
272
+ children: index + 1
273
+ }), /* @__PURE__ */ jsxs("div", {
274
+ className: `relative z-10 ml-20 rounded-${borderRadius} bg-background overflow-hidden shadow-sm transition-shadow hover:shadow-md`,
275
+ children: [
276
+ showBadge && item.discount && /* @__PURE__ */ jsx(DiscountBadge, { discount: item.discount }),
277
+ showFavorite && /* @__PURE__ */ jsx(FavoriteButton, {}),
278
+ imageUrl && /* @__PURE__ */ jsx("div", {
279
+ className: `w-full ${aspectRatioClass} overflow-hidden`,
280
+ children: /* @__PURE__ */ jsx("img", {
281
+ src: imageUrl,
282
+ alt: item.title || "Product",
283
+ className: "h-full w-full object-cover"
284
+ })
285
+ }),
286
+ /* @__PURE__ */ jsx(ListItemCardContent, {
287
+ item,
288
+ ...contentProps
289
+ })
290
+ ]
291
+ })]
292
+ }, item.id);
293
+ })
294
+ }), /* @__PURE__ */ jsx("div", {
295
+ className: "absolute inset-x-0 top-1/2 z-20 flex w-full -translate-y-1/2 items-center justify-between px-8",
296
+ children: /* @__PURE__ */ jsx(ScrollArrows, {
297
+ onPrevious: () => scrollByAmount("prev"),
298
+ onNext: () => scrollByAmount("next")
299
+ })
300
+ })]
301
+ });
302
+ if (scrollAxis === "vertical") return /* @__PURE__ */ jsx("div", {
303
+ className: `flex flex-col gap-${gapValues[gap]}`,
304
+ children: items.map((item, index) => {
305
+ const imageUrl = getImageUrl(item);
306
+ return /* @__PURE__ */ jsxs("div", {
307
+ className: `relative flex gap-${gapValues[gap]} rounded-${borderRadius} bg-background overflow-hidden shadow-sm transition-shadow hover:shadow-md ${`p-${padding}`}`,
308
+ children: [
309
+ /* @__PURE__ */ jsx("div", {
310
+ className: `flex-shrink-0 text-${numberColor} text-${numberSize === "md" ? "base" : numberSize} flex w-16 items-center justify-center font-bold`,
311
+ children: index + 1
312
+ }),
313
+ imageUrl && /* @__PURE__ */ jsx("div", {
314
+ className: "h-24 w-24 flex-shrink-0 overflow-hidden rounded-md",
315
+ children: /* @__PURE__ */ jsx("img", {
316
+ src: imageUrl,
317
+ alt: item.title || "Product",
318
+ className: "h-full w-full object-cover"
319
+ })
320
+ }),
321
+ /* @__PURE__ */ jsx("div", {
322
+ className: "flex-1",
323
+ children: /* @__PURE__ */ jsx(ListItemCardContent, {
324
+ item,
325
+ ...contentProps
326
+ })
327
+ }),
328
+ showBadge && item.discount && /* @__PURE__ */ jsx("div", {
329
+ className: "bg-destructive text-destructive-foreground absolute top-2 right-2 rounded-md px-2 py-1 text-xs font-bold",
330
+ children: getStringValue(item.discount)
331
+ }),
332
+ showFavorite && /* @__PURE__ */ jsx(FavoriteButton, { className: "bg-background/80 hover:bg-background absolute top-2 right-12 rounded-full p-2 backdrop-blur-sm transition-colors" })
333
+ ]
334
+ }, item.id);
335
+ })
336
+ });
337
+ return null;
338
+ }
339
+ //#endregion
340
+ //#region src/widgets/ListWidget.tsx
341
+ var ListWidget_exports = /* @__PURE__ */ __exportAll({
342
+ ListWidget: () => ListWidget,
343
+ listWidgetPropertySchema: () => listWidgetPropertySchema
344
+ });
345
+ const DEFAULT_ITEMS = [];
346
+ function getFeaturedAssetUrl(value) {
347
+ if (!value) return void 0;
348
+ if (typeof value === "string") return {
349
+ url: value,
350
+ isVideo: /\.(mp4|webm|ogg|mov)$/i.test(value)
351
+ };
352
+ if (typeof value === "object") {
353
+ const videoUrl = value.videoUrl || value.video_url || value.url;
354
+ if (videoUrl && /\.(mp4|webm|ogg|mov)$/i.test(videoUrl)) return {
355
+ url: videoUrl,
356
+ isVideo: true
357
+ };
358
+ const imageUrl = value.imageUrl || value.image_url || value.url;
359
+ if (imageUrl) return {
360
+ url: imageUrl,
361
+ isVideo: false
362
+ };
363
+ }
364
+ }
365
+ function ListWidget({ listType = "unordered", scrollAxis = "horizontal", titleEnabled = true, title, items = DEFAULT_ITEMS, titleColor = "foreground", titleSize = "lg", itemTitleColor = "foreground", itemTitleSize = "sm", descriptionColor = "foreground", descriptionSize = "sm", priceColor = "foreground", priceSize = "md", originalPriceColor = "muted", metaTextColor = "muted", metaTextSize = "xs", numberColor = "primary", numberSize = "2xl", borderRadius = "md", padding = 4, gap = "md", columns = 3, imageAspectRatio = "square", background = {
366
+ type: "solid",
367
+ color: "background"
368
+ }, showBadge = true, showFavorite = true, showMetaText = true, maxItems = 12, showFeaturedSection = false, featuredAsset, featuredTitle, featuredSubtitle, featuredButtonText, featuredButtonUrl, featuredSubtitleColor = "background", featuredSubtitleSize = "md", className, ...props }) {
369
+ const displayItems = maxItems ? items.slice(0, maxItems) : items;
370
+ const hasItems = displayItems.length > 0;
371
+ const itemStyleProps = {
372
+ padding,
373
+ itemTitleColor,
374
+ itemTitleSize,
375
+ descriptionColor,
376
+ descriptionSize,
377
+ priceColor,
378
+ priceSize,
379
+ originalPriceColor,
380
+ metaTextColor,
381
+ metaTextSize,
382
+ showMetaText,
383
+ showBadge,
384
+ showFavorite,
385
+ borderRadius,
386
+ imageAspectRatio,
387
+ gap
388
+ };
389
+ const hasFeaturedAsset = getFeaturedAssetUrl(featuredAsset);
390
+ const shouldShowFeaturedSection = showFeaturedSection && hasFeaturedAsset;
391
+ const backgroundColor = background.color || "background";
392
+ const backgroundImage = (background.resource?.image_url || background.resource?.imageUrl) && background.type === "image" ? `url(${background.resource.image_url || background.resource.imageUrl})` : "none";
393
+ return /* @__PURE__ */ jsxs("div", {
394
+ className: `@container bg-${backgroundColor} ${className}`,
395
+ style: { backgroundImage },
396
+ ...props,
397
+ children: [titleEnabled && title && /* @__PURE__ */ jsx("h2", {
398
+ className: `text-${titleColor} text-${titleSize === "md" ? "base" : titleSize} mb-6 font-bold`,
399
+ children: title
400
+ }), !hasItems ? /* @__PURE__ */ jsx("div", {
401
+ className: "border-border bg-muted flex items-center justify-center rounded-md border-2 border-dashed py-12 text-center",
402
+ children: /* @__PURE__ */ jsx("p", {
403
+ className: "text-muted",
404
+ children: "No items to display"
405
+ })
406
+ }) : shouldShowFeaturedSection ? /* @__PURE__ */ jsxs("div", {
407
+ className: "flex flex-col gap-4 @lg:flex-row @lg:gap-6",
408
+ children: [/* @__PURE__ */ jsx("div", {
409
+ className: "w-full @lg:w-[45%]",
410
+ children: /* @__PURE__ */ jsx(FeaturedSection, {
411
+ borderRadius,
412
+ titleSize,
413
+ featuredTitle,
414
+ featuredSubtitle,
415
+ featuredButtonText,
416
+ featuredButtonUrl,
417
+ featuredSubtitleColor,
418
+ featuredSubtitleSize,
419
+ asset: hasFeaturedAsset
420
+ })
421
+ }), /* @__PURE__ */ jsx("div", {
422
+ className: "w-full @lg:w-[55%]",
423
+ children: listType === "unordered" ? /* @__PURE__ */ jsx(UnorderedList, {
424
+ items: displayItems,
425
+ columns,
426
+ ...itemStyleProps
427
+ }) : /* @__PURE__ */ jsx(OrderedList, {
428
+ items: displayItems,
429
+ scrollAxis,
430
+ numberColor,
431
+ numberSize,
432
+ ...itemStyleProps
433
+ })
434
+ })]
435
+ }) : listType === "unordered" ? /* @__PURE__ */ jsx(UnorderedList, {
436
+ items: displayItems,
437
+ columns,
438
+ ...itemStyleProps
439
+ }) : /* @__PURE__ */ jsx(OrderedList, {
440
+ items: displayItems,
441
+ scrollAxis,
442
+ numberColor,
443
+ numberSize,
444
+ ...itemStyleProps
445
+ })]
446
+ });
447
+ }
448
+ const listWidgetPropertySchema = {
449
+ widgetType: "ListWidget",
450
+ displayName: "List",
451
+ tabsConfig: [{
452
+ id: "styling",
453
+ label: "Styling"
454
+ }, {
455
+ id: "data",
456
+ label: "Data"
457
+ }],
458
+ dataSourceTargetProps: ["items"],
459
+ fields: [
460
+ {
461
+ key: "titleEnabled",
462
+ label: "Widget Title",
463
+ type: "boolean",
464
+ description: "Enable the title displayed above the list",
465
+ defaultValue: true,
466
+ tab: "styling",
467
+ group: "Title"
468
+ },
469
+ {
470
+ key: "title",
471
+ label: "Title",
472
+ type: "text",
473
+ description: "Header text for the list",
474
+ defaultValue: "List",
475
+ tab: "styling",
476
+ group: "Title",
477
+ requiresKeyToBeTrue: "titleEnabled"
478
+ },
479
+ getFontSizeField({
480
+ key: "titleSize",
481
+ label: "Title Font Size",
482
+ description: "Size of the list title",
483
+ defaultValue: "xl",
484
+ tab: "styling",
485
+ group: "Title",
486
+ requiresKeyToBeTrue: "titleEnabled"
487
+ }),
488
+ getColorField({
489
+ key: "titleColor",
490
+ label: "Title Color",
491
+ description: "Color for the list title",
492
+ defaultValue: "foreground",
493
+ tab: "styling",
494
+ group: "Title",
495
+ requiresKeyToBeTrue: "titleEnabled"
496
+ }),
497
+ getPaddingField({
498
+ key: "padding",
499
+ label: "Padding",
500
+ description: "Padding inside the container",
501
+ defaultValue: 4,
502
+ tab: "styling",
503
+ group: "Design"
504
+ }),
505
+ getBorderRadiusField({
506
+ key: "borderRadius",
507
+ label: "Border Radius",
508
+ description: "Rounded corners for the container and images",
509
+ defaultValue: "md",
510
+ tab: "styling",
511
+ group: "Design"
512
+ }),
513
+ getGapField({
514
+ key: "gap",
515
+ label: "Gap",
516
+ description: "Spacing between items",
517
+ defaultValue: "md",
518
+ tab: "styling",
519
+ group: "Design"
520
+ }),
521
+ {
522
+ type: "background",
523
+ defaultValue: "background",
524
+ key: "background",
525
+ label: "Background",
526
+ description: "Background color or image for the widget",
527
+ tab: "styling",
528
+ group: "Design"
529
+ },
530
+ {
531
+ key: "listType",
532
+ label: "List Type",
533
+ type: "select",
534
+ description: "Type of list layout",
535
+ defaultValue: "unordered",
536
+ options: [{
537
+ label: "Unordered (Grid)",
538
+ value: "unordered"
539
+ }, {
540
+ label: "Ordered (Numbered)",
541
+ value: "ordered"
542
+ }],
543
+ tab: "styling",
544
+ group: "List Configuration"
545
+ },
546
+ {
547
+ key: "maxItems",
548
+ label: "Max Items",
549
+ type: "number",
550
+ description: "Maximum number of items to display",
551
+ min: 1,
552
+ max: 100,
553
+ step: 1,
554
+ defaultValue: 12,
555
+ tab: "styling",
556
+ group: "List Configuration"
557
+ },
558
+ {
559
+ key: "imageAspectRatio",
560
+ label: "Image Aspect Ratio",
561
+ type: "buttonGroup",
562
+ description: "Aspect ratio for item images",
563
+ defaultValue: "square",
564
+ options: [
565
+ {
566
+ label: "Square",
567
+ value: "square"
568
+ },
569
+ {
570
+ label: "Landscape",
571
+ value: "landscape"
572
+ },
573
+ {
574
+ label: "Portrait",
575
+ value: "portrait"
576
+ }
577
+ ],
578
+ tab: "styling",
579
+ group: "List Configuration"
580
+ },
581
+ {
582
+ key: "showBadge",
583
+ label: "Show Discount Badge",
584
+ type: "boolean",
585
+ description: "Display discount badge on images",
586
+ defaultValue: true,
587
+ tab: "styling",
588
+ group: "List Configuration"
589
+ },
590
+ {
591
+ key: "showFavorite",
592
+ label: "Show Favorite Icon",
593
+ type: "boolean",
594
+ description: "Display favorite/heart icon on images",
595
+ defaultValue: true,
596
+ tab: "styling",
597
+ group: "List Configuration"
598
+ },
599
+ {
600
+ key: "showMetaText",
601
+ label: "Show QV/CV Text",
602
+ type: "boolean",
603
+ description: "Display QV and CV values",
604
+ defaultValue: true,
605
+ tab: "styling",
606
+ group: "List Configuration"
607
+ },
608
+ {
609
+ key: "columns",
610
+ label: "Grid Columns",
611
+ type: "number",
612
+ description: "Number of columns in the grid (unordered list only)",
613
+ min: 1,
614
+ max: 6,
615
+ step: 1,
616
+ defaultValue: 3,
617
+ tab: "styling",
618
+ group: "Unordered List Configuration",
619
+ requiresKeyValue: {
620
+ key: "listType",
621
+ value: "unordered"
622
+ }
623
+ },
624
+ {
625
+ key: "scrollAxis",
626
+ label: "Scroll Direction",
627
+ type: "select",
628
+ description: "Direction for ordered list scrolling",
629
+ defaultValue: "horizontal",
630
+ options: [{
631
+ label: "Horizontal",
632
+ value: "horizontal"
633
+ }, {
634
+ label: "Vertical",
635
+ value: "vertical"
636
+ }],
637
+ tab: "styling",
638
+ group: "Ordered List Configuration",
639
+ requiresKeyValue: {
640
+ key: "listType",
641
+ value: "ordered"
642
+ }
643
+ },
644
+ getColorField({
645
+ key: "numberColor",
646
+ label: "Number Color",
647
+ description: "Color for ordered list numbers",
648
+ defaultValue: "primary",
649
+ tab: "styling",
650
+ group: "Ordered List Configuration",
651
+ requiresKeyValue: {
652
+ key: "listType",
653
+ value: "ordered"
654
+ }
655
+ }),
656
+ getFontSizeField({
657
+ key: "numberSize",
658
+ label: "Number Font Size",
659
+ description: "Size of ordered list numbers",
660
+ defaultValue: "2xl",
661
+ tab: "styling",
662
+ group: "Ordered List Configuration",
663
+ requiresKeyValue: {
664
+ key: "listType",
665
+ value: "ordered"
666
+ }
667
+ }),
668
+ getColorField({
669
+ key: "itemTitleColor",
670
+ label: "Item Title Color",
671
+ description: "Color for item titles",
672
+ defaultValue: "foreground",
673
+ tab: "styling",
674
+ group: "Item Styling"
675
+ }),
676
+ getFontSizeField({
677
+ key: "itemTitleSize",
678
+ label: "Item Title Font Size",
679
+ description: "Size of item titles",
680
+ defaultValue: "sm",
681
+ tab: "styling",
682
+ group: "Item Styling"
683
+ }),
684
+ {
685
+ key: "separator2",
686
+ type: "separator",
687
+ label: "Separator",
688
+ tab: "styling",
689
+ group: "Item Styling"
690
+ },
691
+ getColorField({
692
+ key: "descriptionColor",
693
+ label: "Description Color",
694
+ description: "Color for descriptions",
695
+ defaultValue: "foreground",
696
+ tab: "styling",
697
+ group: "Item Styling"
698
+ }),
699
+ getFontSizeField({
700
+ key: "descriptionSize",
701
+ label: "Description Font Size",
702
+ description: "Size of descriptions",
703
+ defaultValue: "sm",
704
+ tab: "styling",
705
+ group: "Item Styling"
706
+ }),
707
+ {
708
+ key: "separator3",
709
+ type: "separator",
710
+ label: "Separator",
711
+ tab: "styling",
712
+ group: "Item Styling"
713
+ },
714
+ getColorField({
715
+ key: "priceColor",
716
+ label: "Price Color",
717
+ description: "Color for prices",
718
+ defaultValue: "foreground",
719
+ tab: "styling",
720
+ group: "Item Styling"
721
+ }),
722
+ getFontSizeField({
723
+ key: "priceSize",
724
+ label: "Price Font Size",
725
+ description: "Size of prices",
726
+ defaultValue: "md",
727
+ tab: "styling",
728
+ group: "Item Styling"
729
+ }),
730
+ getColorField({
731
+ key: "originalPriceColor",
732
+ label: "Original Price Color",
733
+ description: "Color for crossed-out original prices",
734
+ defaultValue: "foreground",
735
+ tab: "styling",
736
+ group: "Item Styling"
737
+ }),
738
+ {
739
+ key: "separator4",
740
+ type: "separator",
741
+ label: "Separator",
742
+ tab: "styling",
743
+ group: "Item Styling"
744
+ },
745
+ getColorField({
746
+ key: "metaTextColor",
747
+ label: "Meta Text Color",
748
+ description: "Color for QV/CV text",
749
+ defaultValue: "foreground",
750
+ tab: "styling",
751
+ group: "Item Styling"
752
+ }),
753
+ getFontSizeField({
754
+ key: "metaTextSize",
755
+ label: "Meta Text Font Size",
756
+ description: "Size of QV/CV text",
757
+ defaultValue: "xs",
758
+ tab: "styling",
759
+ group: "Item Styling"
760
+ }),
761
+ {
762
+ key: "showFeaturedSection",
763
+ label: "Show Featured Section",
764
+ type: "boolean",
765
+ description: "Display a featured content section",
766
+ defaultValue: false,
767
+ tab: "styling",
768
+ group: "Featured Section"
769
+ },
770
+ {
771
+ key: "featuredAsset",
772
+ label: "Featured Asset",
773
+ type: "resource",
774
+ description: "Select a single image or video resource for the featured section",
775
+ tab: "styling",
776
+ group: "Featured Section",
777
+ allowedTypes: ["Medium"],
778
+ requiresKeyToBeTrue: "showFeaturedSection"
779
+ },
780
+ {
781
+ key: "featuredTitle",
782
+ label: "Featured Title",
783
+ type: "text",
784
+ description: "Title for featured section",
785
+ tab: "styling",
786
+ group: "Featured Section",
787
+ requiresKeyToBeTrue: "showFeaturedSection"
788
+ },
789
+ {
790
+ key: "featuredSubtitle",
791
+ label: "Featured Subtitle",
792
+ type: "text",
793
+ description: "Subtitle for featured section",
794
+ tab: "styling",
795
+ group: "Featured Section",
796
+ requiresKeyToBeTrue: "showFeaturedSection"
797
+ },
798
+ {
799
+ key: "featuredButtonText",
800
+ label: "Featured Button Text",
801
+ type: "text",
802
+ description: "Text for featured section button",
803
+ tab: "styling",
804
+ group: "Featured Section",
805
+ requiresKeyToBeTrue: "showFeaturedSection"
806
+ },
807
+ {
808
+ key: "featuredButtonUrl",
809
+ label: "Featured Button URL",
810
+ type: "text",
811
+ description: "URL for featured section button",
812
+ tab: "styling",
813
+ group: "Featured Section",
814
+ requiresKeyToBeTrue: "showFeaturedSection"
815
+ },
816
+ getColorField({
817
+ key: "featuredSubtitleColor",
818
+ label: "Featured Subtitle Color",
819
+ description: "Color for featured subtitle",
820
+ defaultValue: "background",
821
+ tab: "styling",
822
+ group: "Featured Section",
823
+ requiresKeyToBeTrue: "showFeaturedSection"
824
+ }),
825
+ getFontSizeField({
826
+ key: "featuredSubtitleSize",
827
+ label: "Featured Subtitle Font Size",
828
+ description: "Size of featured subtitle",
829
+ defaultValue: "md",
830
+ tab: "styling",
831
+ group: "Featured Section",
832
+ requiresKeyToBeTrue: "showFeaturedSection"
833
+ }),
834
+ {
835
+ key: "dataSource",
836
+ label: "Data Source",
837
+ type: "dataSource",
838
+ description: "",
839
+ tab: "data",
840
+ group: "Data Configuration"
841
+ }
842
+ ],
843
+ itemConfigSchema: {
844
+ description: "Configure settings for this list item",
845
+ fields: [
846
+ {
847
+ key: "title",
848
+ label: "Custom Title",
849
+ type: "text",
850
+ description: "Override the item's title"
851
+ },
852
+ {
853
+ key: "description",
854
+ label: "Custom Description",
855
+ type: "textarea",
856
+ description: "Override the item's description",
857
+ rows: 3
858
+ },
859
+ {
860
+ key: "price",
861
+ label: "Price",
862
+ type: "text",
863
+ description: "Current price"
864
+ },
865
+ {
866
+ key: "originalPrice",
867
+ label: "Original Price",
868
+ type: "text",
869
+ description: "Original price (will be crossed out)"
870
+ },
871
+ {
872
+ key: "discount",
873
+ label: "Discount Badge",
874
+ type: "text",
875
+ description: "Discount text (e.g., '40% Off')"
876
+ },
877
+ {
878
+ key: "qv",
879
+ label: "QV Value",
880
+ type: "text",
881
+ description: "Qualifying Volume value"
882
+ },
883
+ {
884
+ key: "cv",
885
+ label: "CV Value",
886
+ type: "text",
887
+ description: "Commission Volume value"
888
+ },
889
+ {
890
+ key: "image",
891
+ label: "Image URL",
892
+ type: "text",
893
+ description: "Custom image URL for this item"
894
+ }
895
+ ]
896
+ }
897
+ };
898
+ //#endregion
899
+ export { ListWidget_exports as n, listWidgetPropertySchema as r, ListWidget as t };
900
+
901
+ //# sourceMappingURL=ListWidget-C-jcsCb4.mjs.map