@depict-ai/react-ui 4.9.1 → 4.9.3
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.
- package/ES10/index.cjs +1 -2
- package/ES10/index.d.ts +1 -1
- package/ES10/index.js +1 -2
- package/latest/index.cjs +1 -1
- package/latest/index.d.ts +1 -1
- package/latest/index.js +1 -1
- package/package.json +6 -6
- package/server/ES10/index.cjs +3 -2
- package/server/ES10/index.d.ts +1 -1
- package/server/ES10/index.js +1 -1
- package/server/latest/index.cjs +1 -1
- package/server/latest/index.d.ts +1 -1
- package/server/latest/index.js +1 -1
- package/dist/client/main_es10/index.js +0 -1387
- package/dist/client/module_es10/index.js +0 -1361
- package/dist/server/main_es10/index.js +0 -341
|
@@ -1,341 +0,0 @@
|
|
|
1
|
-
var $aNCHr$react = require("react");
|
|
2
|
-
var $aNCHr$depictaiui = require("@depict-ai/ui");
|
|
3
|
-
var $aNCHr$solidjsweb = require("solid-js/web");
|
|
4
|
-
var $aNCHr$depictaiutilishared = require("@depict-ai/utilishared");
|
|
5
|
-
var $aNCHr$reactdomserver = require("react-dom/server");
|
|
6
|
-
var $aNCHr$solidjs = require("solid-js");
|
|
7
|
-
var $aNCHr$reactjsxruntime = require("react/jsx-runtime");
|
|
8
|
-
var $aNCHr$reactdom = require("react-dom");
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
function $parcel$export(e, n, v, s) {
|
|
12
|
-
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
$parcel$export(module.exports, "DepictProvider", () => $202459d454907b31$export$9fac37a9c21c2f3b);
|
|
16
|
-
$parcel$export(module.exports, "useCategoryFilterHelpers", () => $202459d454907b31$export$72616730c1fad2f4);
|
|
17
|
-
$parcel$export(module.exports, "SearchPage", () => $202459d454907b31$export$a54ec244c8863715);
|
|
18
|
-
$parcel$export(module.exports, "CategoryPage", () => $202459d454907b31$export$f7d2f673fc2f091d);
|
|
19
|
-
$parcel$export(module.exports, "BreadCrumbs", () => $202459d454907b31$export$5646050d516e06bc);
|
|
20
|
-
$parcel$export(module.exports, "LooksSliderOrGrid", () => $202459d454907b31$export$ee471bde82ce7cf7);
|
|
21
|
-
$parcel$export(module.exports, "QuickLinks", () => $202459d454907b31$export$466cdc317043f6cb);
|
|
22
|
-
$parcel$export(module.exports, "RecommendationSlider", () => $202459d454907b31$export$82cfdc85a4d15688);
|
|
23
|
-
$parcel$export(module.exports, "ComponentAligner", () => $202459d454907b31$export$80e99ee6b29cadd2);
|
|
24
|
-
$parcel$export(module.exports, "ImagePlaceholder", () => $202459d454907b31$export$3f37af283f8fb843);
|
|
25
|
-
$parcel$export(module.exports, "RecommendationGrid", () => $202459d454907b31$export$b0a773486c1c2312);
|
|
26
|
-
$parcel$export(module.exports, "TextPlaceholder", () => $202459d454907b31$export$89c6019e4baa40b1);
|
|
27
|
-
$parcel$export(module.exports, "useSearchField", () => $202459d454907b31$export$9bb30bbe003b82e0);
|
|
28
|
-
$parcel$export(module.exports, "openModal", () => $202459d454907b31$export$a7f6cffb6b8ba11c);
|
|
29
|
-
$parcel$export(module.exports, "useSearchModal", () => $202459d454907b31$export$912994940e660d32);
|
|
30
|
-
$parcel$export(module.exports, "usePerformanceClient", () => $202459d454907b31$export$38b98fae14bd1f64);
|
|
31
|
-
$parcel$export(module.exports, "useFetchRecommendations", () => $202459d454907b31$export$6501da23a2770fc);
|
|
32
|
-
$parcel$export(module.exports, "CategoryTitle", () => $202459d454907b31$re_export$CategoryTitle);
|
|
33
|
-
$parcel$export(module.exports, "EmbeddedNumProducts", () => $202459d454907b31$re_export$EmbeddedNumProducts);
|
|
34
|
-
$parcel$export(module.exports, "version", () => $efbdd2dab4314170$export$83d89fbfd8236492);
|
|
35
|
-
//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
|
|
36
|
-
// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
|
|
37
|
-
// Doing that freaks react out, one can only have one use client statement: https://depictaiworkspace.slack.com/archives/C02BASM9X5J/p1699972968084709 but leaving it here commented out for you rinformation regardless
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
function $f144be06c518d0ac$export$4b564d7f5a1b1d43(_ref) {
|
|
43
|
-
let { solid_component: solid_component, props: props, wrapper_type: wrapper_type = "div", wrapper_style: wrapper_style = {} } = _ref;
|
|
44
|
-
const wrapper_element_ref = (0, $aNCHr$react.useRef)();
|
|
45
|
-
// The worst thing that can happen by multiple generateHydrationScript's is that events dispatched before the hydration are duplicated in solid's shared context which leads to them being deduplicated again here https://github.com/ryansolid/dom-expressions/blob/21fdba5bcab25986a2b93003aaace100b2231cdc/packages/dom-expressions/src/client.js#L280
|
|
46
|
-
const rendered_html = (0, $aNCHr$solidjsweb.generateHydrationScript)() + (0, $aNCHr$solidjsweb.renderToString)(()=>solid_component(props, ()=>{}));
|
|
47
|
-
return (0, $aNCHr$react.createElement)((0, $aNCHr$react.Fragment), null, (0, $aNCHr$react.createElement)(wrapper_type, {
|
|
48
|
-
ref: wrapper_element_ref,
|
|
49
|
-
style: wrapper_style,
|
|
50
|
-
dangerouslySetInnerHTML: {
|
|
51
|
-
__html: rendered_html
|
|
52
|
-
}
|
|
53
|
-
}));
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
// Triggered by synsam trying to put null here and typescript somehow not complaining
|
|
58
|
-
|
|
59
|
-
function $6e5ce22b65512b0a$export$4daadad26e48a2c7(props) {
|
|
60
|
-
var _props$recommendation;
|
|
61
|
-
const us = "RecommendationSlider/RecommendationGrid:";
|
|
62
|
-
if (typeof (props === null || props === void 0 ? void 0 : (_props$recommendation = props.recommendations) === null || _props$recommendation === void 0 ? void 0 : _props$recommendation.then) !== "function") {
|
|
63
|
-
(0, $aNCHr$depictaiutilishared.dwarn)(us, "Got", props.recommendations, "which is not thenable");
|
|
64
|
-
throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
class $e9048b15cf1e8792$export$d0f82e3ef89b1f22 extends (0, $aNCHr$react.Component) {
|
|
75
|
-
constructor(props){
|
|
76
|
-
super(props);
|
|
77
|
-
this.state = {
|
|
78
|
-
hasError: false
|
|
79
|
-
};
|
|
80
|
-
}
|
|
81
|
-
static getDerivedStateFromError() {
|
|
82
|
-
// Update state so the next render will show the fallback UI.
|
|
83
|
-
return {
|
|
84
|
-
hasError: true
|
|
85
|
-
};
|
|
86
|
-
}
|
|
87
|
-
componentDidCatch(error) {
|
|
88
|
-
this.props.on_error(error);
|
|
89
|
-
}
|
|
90
|
-
render() {
|
|
91
|
-
if (this.state.hasError) // You can render any custom fallback UI
|
|
92
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
93
|
-
children: "Component failed"
|
|
94
|
-
});
|
|
95
|
-
return this.props.children;
|
|
96
|
-
}
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
async function $3441d987b5ea85cb$export$32024253978abdc7(_ref) {
|
|
103
|
-
let { component_props: component_props, component_portals: component_portals, set_portals: set_portals, get_react_template: get_react_template, set_on_index_change_: set_on_index_change_ } = _ref;
|
|
104
|
-
let set_react_has_ran_hooks;
|
|
105
|
-
let was_cleaned_up = false;
|
|
106
|
-
const react_has_ran_hooks = new Promise((r)=>set_react_has_ran_hooks = r);
|
|
107
|
-
const solid_container = document.createElement("div");
|
|
108
|
-
const [setIndexFunctionAccessor, setIndexFunctionSetter] = (0, $aNCHr$solidjs.createSignal)();
|
|
109
|
-
let call_when_template_changes;
|
|
110
|
-
const owner = (0, $aNCHr$solidjs.getOwner)();
|
|
111
|
-
const reactProductCard = (0, $aNCHr$reactjsxruntime.jsx)((props)=>{
|
|
112
|
-
// Sneak in a hook into their product card component to know once react has finished rendering and running hooks
|
|
113
|
-
(0, $aNCHr$react.useEffect)(set_react_has_ran_hooks, []);
|
|
114
|
-
const [react_template, set_react_template] = (0, $aNCHr$react.useState)(()=>(0, $aNCHr$solidjs.untrack)(get_react_template));
|
|
115
|
-
const [index, setIndex] = (0, $aNCHr$react.useState)(0);
|
|
116
|
-
setIndexFunctionSetter(()=>setIndex);
|
|
117
|
-
call_when_template_changes = set_react_template;
|
|
118
|
-
return react_template(set_on_index_change_ ? {
|
|
119
|
-
...props,
|
|
120
|
-
index: index
|
|
121
|
-
} : props);
|
|
122
|
-
}, component_props);
|
|
123
|
-
const reactProductCardInErrorBoundary = (0, $aNCHr$reactjsxruntime.jsx)((0, $e9048b15cf1e8792$export$d0f82e3ef89b1f22), {
|
|
124
|
-
children: reactProductCard,
|
|
125
|
-
on_error: (error)=>(0, $aNCHr$solidjs.runWithOwner)(owner, ()=>{
|
|
126
|
-
if (was_cleaned_up) return; // Would infinite loop if we'd throw after we've already been cleaned up. That is because the `ErrorBoundary` won't be "registered" with the cleaned-up owner anymore so react would hear about the throw and attempt to re-render the error boundary or something which would throw again, etc.
|
|
127
|
-
throw new (0, $aNCHr$depictaiui.ProductCardError)(error);
|
|
128
|
-
})
|
|
129
|
-
});
|
|
130
|
-
const portal = $aNCHr$reactdom.createPortal(reactProductCardInErrorBoundary, solid_container);
|
|
131
|
-
component_portals.add(portal);
|
|
132
|
-
set_portals([
|
|
133
|
-
...component_portals
|
|
134
|
-
]);
|
|
135
|
-
set_on_index_change_ === null || set_on_index_change_ === void 0 || set_on_index_change_((newIndex)=>{
|
|
136
|
-
var _setIndexFunctionAcce;
|
|
137
|
-
return (_setIndexFunctionAcce = setIndexFunctionAccessor()) === null || _setIndexFunctionAcce === void 0 ? void 0 : _setIndexFunctionAcce(newIndex);
|
|
138
|
-
});
|
|
139
|
-
(0, $aNCHr$solidjs.createEffect)((0, $aNCHr$solidjs.on)(get_react_template, (new_template)=>queueMicrotask(()=>{
|
|
140
|
-
var _call_when_template_c;
|
|
141
|
-
return(// if we update the state inside the portal synchronously from the parent call react gets confused with "Warning: Cannot update a component (`Unknown`) while rendering a different component (`$48d7f568740a317d$export$f7d2f673fc2f091d`). To locate the bad setState() call inside `$48d7f568740a317d$export$f7d2f673fc2f091d`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render"
|
|
142
|
-
// Therefore do it after a microtask to evade detection
|
|
143
|
-
(_call_when_template_c = call_when_template_changes) === null || _call_when_template_c === void 0 ? void 0 : _call_when_template_c(()=>new_template));
|
|
144
|
-
}), {
|
|
145
|
-
defer: true
|
|
146
|
-
})); // If we get a new template. call the useState hook thing so we correctly re-execute with the new template
|
|
147
|
-
(0, $aNCHr$solidjs.onCleanup)(()=>{
|
|
148
|
-
was_cleaned_up = true;
|
|
149
|
-
// this will stop working after any await so be careful to not await before this, or you'll have to carry the owner over with getOwner and runWithOwner
|
|
150
|
-
component_portals.delete(portal);
|
|
151
|
-
// Updating i.e. the merchant will cause a setState call while rendering the DepictProvider component which is illegal because it usually infinite loops react apps. In our case it doesn't though, so we just evade detection by doing it a microtask later. See also https://github.com/facebook/react/issues/18178#issuecomment-595846312
|
|
152
|
-
queueMicrotask(()=>set_portals([
|
|
153
|
-
...component_portals
|
|
154
|
-
]));
|
|
155
|
-
});
|
|
156
|
-
await react_has_ran_hooks; // After React has created elements it still takes some time to actually connect the refs and run the hooks. We don't want to replace placeholders before then.
|
|
157
|
-
return [
|
|
158
|
-
solid_container
|
|
159
|
-
];
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
|
|
167
|
-
const component_portals = new Set();
|
|
168
|
-
return (0, $aNCHr$depictaiui.RecommendationGrid)({
|
|
169
|
-
get recommendations () {
|
|
170
|
-
return props.recommendations;
|
|
171
|
-
},
|
|
172
|
-
product_card_template: (display, info)=>{
|
|
173
|
-
if (0, $aNCHr$solidjsweb.isServer) {
|
|
174
|
-
// This function can't be async on the server
|
|
175
|
-
// @ts-ignore emulate the wrapper div that we need in prod here too for consistency
|
|
176
|
-
const reactRetVal = (0, $aNCHr$reactdomserver.renderToString)((0, $aNCHr$react.createElement)(()=>props.productCard({
|
|
177
|
-
display: display
|
|
178
|
-
})));
|
|
179
|
-
return (0, $aNCHr$solidjsweb.ssr)([
|
|
180
|
-
"<div",
|
|
181
|
-
">",
|
|
182
|
-
"</div>"
|
|
183
|
-
], (0, $aNCHr$solidjsweb.ssrHydrationKey)(), reactRetVal);
|
|
184
|
-
}
|
|
185
|
-
return (0, $3441d987b5ea85cb$export$32024253978abdc7)({
|
|
186
|
-
component_props: {
|
|
187
|
-
display: display
|
|
188
|
-
},
|
|
189
|
-
get_react_template: ()=>props.productCard,
|
|
190
|
-
component_portals: component_portals,
|
|
191
|
-
set_portals: set_portals,
|
|
192
|
-
set_on_index_change_: info === null || info === void 0 ? void 0 : info.set_on_index_change
|
|
193
|
-
});
|
|
194
|
-
},
|
|
195
|
-
get cols_at_size () {
|
|
196
|
-
return props.columnsAtSize || (0, $aNCHr$depictaiui.defaultColsAtSize);
|
|
197
|
-
},
|
|
198
|
-
get grid_spacing () {
|
|
199
|
-
var _props$gridSpacing;
|
|
200
|
-
return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $aNCHr$depictaiui.defaultGridSpacing);
|
|
201
|
-
},
|
|
202
|
-
get max_rows () {
|
|
203
|
-
return props.maxRows;
|
|
204
|
-
},
|
|
205
|
-
get title () {
|
|
206
|
-
return props.title;
|
|
207
|
-
},
|
|
208
|
-
get view_more_button () {
|
|
209
|
-
var _viewMoreButton$start;
|
|
210
|
-
const { viewMoreButton: viewMoreButton } = props;
|
|
211
|
-
return viewMoreButton ? {
|
|
212
|
-
text: viewMoreButton.text,
|
|
213
|
-
start_rows: (_viewMoreButton$start = viewMoreButton.startRows) !== null && _viewMoreButton$start !== void 0 ? _viewMoreButton$start : 2,
|
|
214
|
-
rows_per_click: viewMoreButton.rowsPerClick
|
|
215
|
-
} : undefined;
|
|
216
|
-
}
|
|
217
|
-
});
|
|
218
|
-
}
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
const $efbdd2dab4314170$export$83d89fbfd8236492 = "4.9.1";
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
function $202459d454907b31$export$9fac37a9c21c2f3b(props) {
|
|
225
|
-
return props.children;
|
|
226
|
-
}
|
|
227
|
-
function $202459d454907b31$export$72616730c1fad2f4() {
|
|
228
|
-
const noop = ()=>{};
|
|
229
|
-
return {
|
|
230
|
-
categorySetShouldShowFilters: noop,
|
|
231
|
-
categorySetFilter: noop,
|
|
232
|
-
categoryExpandFilterGroup: noop
|
|
233
|
-
};
|
|
234
|
-
}
|
|
235
|
-
function $202459d454907b31$export$a54ec244c8863715() {
|
|
236
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
237
|
-
children: []
|
|
238
|
-
});
|
|
239
|
-
}
|
|
240
|
-
function $202459d454907b31$export$f7d2f673fc2f091d() {
|
|
241
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
242
|
-
children: []
|
|
243
|
-
});
|
|
244
|
-
}
|
|
245
|
-
function $202459d454907b31$export$5646050d516e06bc() {
|
|
246
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
247
|
-
children: []
|
|
248
|
-
});
|
|
249
|
-
}
|
|
250
|
-
function $202459d454907b31$export$ee471bde82ce7cf7() {
|
|
251
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
252
|
-
children: []
|
|
253
|
-
});
|
|
254
|
-
}
|
|
255
|
-
function $202459d454907b31$export$466cdc317043f6cb() {
|
|
256
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
257
|
-
children: []
|
|
258
|
-
});
|
|
259
|
-
}
|
|
260
|
-
function $202459d454907b31$export$82cfdc85a4d15688(props) {
|
|
261
|
-
(0, $6e5ce22b65512b0a$export$4daadad26e48a2c7)(props);
|
|
262
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
263
|
-
children: []
|
|
264
|
-
});
|
|
265
|
-
}
|
|
266
|
-
function $202459d454907b31$export$80e99ee6b29cadd2() {
|
|
267
|
-
return (0, $aNCHr$react.createElement)("div", {
|
|
268
|
-
className: "depict aligner",
|
|
269
|
-
style: {
|
|
270
|
-
height: "100%"
|
|
271
|
-
}
|
|
272
|
-
});
|
|
273
|
-
}
|
|
274
|
-
function $202459d454907b31$export$3f37af283f8fb843(raw_react_props) {
|
|
275
|
-
const react_props = {
|
|
276
|
-
class: raw_react_props.className,
|
|
277
|
-
...raw_react_props
|
|
278
|
-
};
|
|
279
|
-
return (0, $f144be06c518d0ac$export$4b564d7f5a1b1d43)({
|
|
280
|
-
solid_component: (props_store)=>(0, $aNCHr$depictaiui.ImagePlaceholder)(props_store),
|
|
281
|
-
props: react_props,
|
|
282
|
-
wrapper_type: "span"
|
|
283
|
-
});
|
|
284
|
-
}
|
|
285
|
-
function $202459d454907b31$export$b0a773486c1c2312(props) {
|
|
286
|
-
(0, $6e5ce22b65512b0a$export$4daadad26e48a2c7)(props);
|
|
287
|
-
return (0, $f144be06c518d0ac$export$4b564d7f5a1b1d43)({
|
|
288
|
-
solid_component: (0, $3b36cc844440a979$export$e46079a2793e9ec7),
|
|
289
|
-
props: props,
|
|
290
|
-
wrapper_type: "section"
|
|
291
|
-
});
|
|
292
|
-
}
|
|
293
|
-
function $202459d454907b31$export$89c6019e4baa40b1(raw_react_props) {
|
|
294
|
-
const react_props = {
|
|
295
|
-
...raw_react_props,
|
|
296
|
-
class: raw_react_props.className
|
|
297
|
-
};
|
|
298
|
-
return (0, $f144be06c518d0ac$export$4b564d7f5a1b1d43)({
|
|
299
|
-
solid_component: (props_store)=>(0, $aNCHr$depictaiui.TextPlaceholder)(props_store),
|
|
300
|
-
props: react_props,
|
|
301
|
-
wrapper_type: "span",
|
|
302
|
-
wrapper_style: {
|
|
303
|
-
"height": "100%"
|
|
304
|
-
}
|
|
305
|
-
});
|
|
306
|
-
}
|
|
307
|
-
function $202459d454907b31$export$9bb30bbe003b82e0() {
|
|
308
|
-
return {
|
|
309
|
-
SearchField: ()=>(0, $aNCHr$react.createElement)("div", {
|
|
310
|
-
children: []
|
|
311
|
-
})
|
|
312
|
-
};
|
|
313
|
-
}
|
|
314
|
-
function $202459d454907b31$export$a7f6cffb6b8ba11c() {}
|
|
315
|
-
function $202459d454907b31$export$912994940e660d32() {
|
|
316
|
-
return {
|
|
317
|
-
open: ()=>{}
|
|
318
|
-
};
|
|
319
|
-
}
|
|
320
|
-
function $202459d454907b31$export$38b98fae14bd1f64() {
|
|
321
|
-
const mock = {
|
|
322
|
-
get: function(target, property) {
|
|
323
|
-
if (typeof target[property] === "undefined") return ()=>{
|
|
324
|
-
throw new Error("Depict Performance Client is currently not available on the server. Please wrap your call in a useEffect hook or user event handler.");
|
|
325
|
-
};
|
|
326
|
-
return target[property];
|
|
327
|
-
}
|
|
328
|
-
};
|
|
329
|
-
return {
|
|
330
|
-
dpc: new Proxy({}, mock)
|
|
331
|
-
};
|
|
332
|
-
}
|
|
333
|
-
function $202459d454907b31$export$6501da23a2770fc() {
|
|
334
|
-
return {
|
|
335
|
-
fetchRecommendations: ()=>{
|
|
336
|
-
throw new Error("fetchRecommendations is currently not available on the server due to personalisation/session_id related issues. Please only call it on the client.");
|
|
337
|
-
}
|
|
338
|
-
};
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
|