@depict-ai/react-ui 1.0.12 → 1.0.15

package/dist-server/index.d.ts

@@ -1,54 +1,58 @@
-import { ReactElement } from "react";
-import { DPC } from "@depict-ai/dpc";
-import { fetchDepictRecommendations, ExclusiveId } from "@depict-ai/ui";
-import { Display } from "@depict-ai/utilishared";
-type OpenModal = () => void;
-interface UseSearchModalReturn {
-    open: OpenModal;
-}
-interface UseSearchFieldReturn {
-    /**
-     * A React component that renders the search field.
-     */
-    SearchField: () => ReactElement;
-}
-interface UsePerformanceClientReturn {
-    dpc: DPC;
-}
-type FetchRecsOptions = Omit<Parameters<typeof fetchDepictRecommendations>[0], "merchant" | "market" | "userId" | "sessionId"> & ExclusiveId;
-interface UseFetchRecommendationsReturn<T extends Display> {
-    /**
-     * Fetch recommendations from the Depict API.
-     * @example
-     * General recommendations for a landing page:
-     * ```tsx
-     * fetchRecommendations({ type: "landing_page" });
-     * ```
-     * @example
-     * Fetch targeted recommendations for a product details page (PDP):
-     * ```tsx
-     * fetchRecommendations({ type: "related", productId: "t-shirt-white" })
-     * ```
-     * @returns {Promise<T[]>}
-     */
-    fetchRecommendations: (opts: FetchRecsOptions) => Promise<T[]>;
-}
-export const version = "1.0.12";
-export function DepictProvider(props: any): any;
-export function SearchPage(): any;
-export function CategoryPage(): any;
-export function BreadCrumbs(): any;
-export function QuickLinks(): any;
-export function ComponentAligner(): import("react").DetailedReactHTMLElement<{
-    className: string;
-    style: {
-        height: string;
-    };
-}, HTMLElement>;
-export function ImagePlaceholder(): any;
-export function TextPlaceholder(): any;
-export function useSearchField(): UseSearchFieldReturn;
-export function openModal(): void;
-export function useSearchModal(): UseSearchModalReturn;
-export function usePerformanceClient(): UsePerformanceClientReturn;
-export function useFetchRecommendations<T extends Display>(): UseFetchRecommendationsReturn<T>;
+import { ReactElement } from "react";
+import { DPC } from "@depict-ai/dpc";
+import { fetchDepictRecommendations, ExclusiveId, TextPlaceholder as _TextPlaceholder1, ImagePlaceholder as _ImagePlaceholder1 } from "@depict-ai/ui";
+import { Display } from "@depict-ai/utilishared";
+type OpenModal = () => void;
+interface UseSearchModalReturn {
+    open: OpenModal;
+}
+interface UseSearchFieldReturn {
+    /**
+     * A React component that renders the search field.
+     */
+    SearchField: () => ReactElement;
+}
+interface UsePerformanceClientReturn {
+    dpc: DPC;
+}
+type FetchRecsOptions = Omit<Parameters<typeof fetchDepictRecommendations>[0], "merchant" | "market" | "userId" | "sessionId"> & ExclusiveId;
+interface UseFetchRecommendationsReturn<T extends Display> {
+    /**
+     * Fetch recommendations from the Depict API.
+     * @example
+     * General recommendations for a landing page:
+     * ```tsx
+     * fetchRecommendations({ type: "landing_page" });
+     * ```
+     * @example
+     * Fetch targeted recommendations for a product details page (PDP):
+     * ```tsx
+     * fetchRecommendations({ type: "related", productId: "t-shirt-white" })
+     * ```
+     * @returns {Promise<T[]>}
+     */
+    fetchRecommendations: (opts: FetchRecsOptions) => Promise<T[]>;
+}
+export const version = "1.0.15";
+export function DepictProvider(props: any): any;
+export function SearchPage(): any;
+export function CategoryPage(): any;
+export function BreadCrumbs(): any;
+export function QuickLinks(): any;
+export function ComponentAligner(): import("react").DetailedReactHTMLElement<{
+    className: string;
+    style: {
+        height: string;
+    };
+}, HTMLElement>;
+export function ImagePlaceholder(raw_react_props: Parameters<typeof _ImagePlaceholder1>[0] & {
+    className: string;
+}): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export function TextPlaceholder(raw_react_props: Omit<Parameters<typeof _TextPlaceholder1>[0], "class"> & {
+    className: string;
+}): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export function useSearchField(): UseSearchFieldReturn;
+export function openModal(): void;
+export function useSearchModal(): UseSearchModalReturn;
+export function usePerformanceClient(): UsePerformanceClientReturn;
+export function useFetchRecommendations<T extends Display>(): UseFetchRecommendationsReturn<T>;

package/dist-server/main.js

@@ -1,5 +1,7 @@
 var $5efvh$react = require("react");
 var $5efvh$reactjsxruntime = require("react/jsx-runtime");
+var $5efvh$depictaiui = require("@depict-ai/ui");
+var $5efvh$solidjsweb = require("solid-js/web");
 
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
@@ -21,7 +23,25 @@ $parcel$export(module.exports, "useFetchRecommendations", () => $41e7e5d85b5e0d4
 $parcel$export(module.exports, "version", () => $db7b67857900028b$export$83d89fbfd8236492);
 
 
-const $db7b67857900028b$export$83d89fbfd8236492 = "1.0.12";
+
+
+
+function $35dfe83eec81954c$export$4b564d7f5a1b1d43({ solid_component: solid_component , props: props , wrapper_type: wrapper_type = "div" , wrapper_style: wrapper_style = {}  }) {
+    const wrapper_element_ref = (0, $5efvh$react.useRef)();
+    // 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
+    const rendered_html = (0, $5efvh$solidjsweb.renderToString)(()=>solid_component(props, ()=>{})) + (0, $5efvh$solidjsweb.generateHydrationScript)();
+    return (0, $5efvh$react.createElement)((0, $5efvh$react.Fragment), null, (0, $5efvh$react.createElement)(wrapper_type, {
+        ref: wrapper_element_ref,
+        style: wrapper_style,
+        dangerouslySetInnerHTML: {
+            __html: rendered_html
+        }
+    }));
+}
+
+
+
+const $db7b67857900028b$export$83d89fbfd8236492 = "1.0.15";
 
 
 function $41e7e5d85b5e0d49$export$9fac37a9c21c2f3b(props) {
@@ -55,14 +75,29 @@ function $41e7e5d85b5e0d49$export$80e99ee6b29cadd2() {
         }
     });
 }
-function $41e7e5d85b5e0d49$export$3f37af283f8fb843() {
-    return (0, $5efvh$reactjsxruntime.jsx)("div", {
-        children: []
+function $41e7e5d85b5e0d49$export$3f37af283f8fb843(raw_react_props) {
+    const react_props = {
+        class: raw_react_props.className,
+        ...raw_react_props
+    };
+    return (0, $35dfe83eec81954c$export$4b564d7f5a1b1d43)({
+        solid_component: (props_store)=>(0, $5efvh$depictaiui.ImagePlaceholder)(props_store),
+        props: react_props,
+        wrapper_type: "span"
     });
 }
-function $41e7e5d85b5e0d49$export$89c6019e4baa40b1() {
-    return (0, $5efvh$reactjsxruntime.jsx)("div", {
-        children: []
+function $41e7e5d85b5e0d49$export$89c6019e4baa40b1(raw_react_props) {
+    const react_props = {
+        ...raw_react_props,
+        class: raw_react_props.className
+    };
+    return (0, $35dfe83eec81954c$export$4b564d7f5a1b1d43)({
+        solid_component: (props_store)=>(0, $5efvh$depictaiui.TextPlaceholder)(props_store),
+        props: react_props,
+        wrapper_type: "span",
+        wrapper_style: {
+            "height": "100%"
+        }
     });
 }
 function $41e7e5d85b5e0d49$export$9bb30bbe003b82e0() {

package/dist-server/module.js

@@ -1,9 +1,29 @@
-import {createElement as $1RlIW$createElement} from "react";
+import {createElement as $1RlIW$createElement, useRef as $1RlIW$useRef, Fragment as $1RlIW$Fragment} from "react";
 import {jsx as $1RlIW$jsx} from "react/jsx-runtime";
+import {ImagePlaceholder as $1RlIW$ImagePlaceholder, TextPlaceholder as $1RlIW$TextPlaceholder} from "@depict-ai/ui";
+import {renderToString as $1RlIW$renderToString, generateHydrationScript as $1RlIW$generateHydrationScript} from "solid-js/web";
 
 
 
-const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "1.0.12";
+
+
+
+function $4568c09979447ab1$export$4b564d7f5a1b1d43({ solid_component: solid_component , props: props , wrapper_type: wrapper_type = "div" , wrapper_style: wrapper_style = {}  }) {
+    const wrapper_element_ref = (0, $1RlIW$useRef)();
+    // 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
+    const rendered_html = (0, $1RlIW$renderToString)(()=>solid_component(props, ()=>{})) + (0, $1RlIW$generateHydrationScript)();
+    return (0, $1RlIW$createElement)((0, $1RlIW$Fragment), null, (0, $1RlIW$createElement)(wrapper_type, {
+        ref: wrapper_element_ref,
+        style: wrapper_style,
+        dangerouslySetInnerHTML: {
+            __html: rendered_html
+        }
+    }));
+}
+
+
+
+const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "1.0.15";
 
 
 function $2b1fdeb83610500f$export$9fac37a9c21c2f3b(props) {
@@ -37,14 +57,29 @@ function $2b1fdeb83610500f$export$80e99ee6b29cadd2() {
         }
     });
 }
-function $2b1fdeb83610500f$export$3f37af283f8fb843() {
-    return (0, $1RlIW$jsx)("div", {
-        children: []
+function $2b1fdeb83610500f$export$3f37af283f8fb843(raw_react_props) {
+    const react_props = {
+        class: raw_react_props.className,
+        ...raw_react_props
+    };
+    return (0, $4568c09979447ab1$export$4b564d7f5a1b1d43)({
+        solid_component: (props_store)=>(0, $1RlIW$ImagePlaceholder)(props_store),
+        props: react_props,
+        wrapper_type: "span"
     });
 }
-function $2b1fdeb83610500f$export$89c6019e4baa40b1() {
-    return (0, $1RlIW$jsx)("div", {
-        children: []
+function $2b1fdeb83610500f$export$89c6019e4baa40b1(raw_react_props) {
+    const react_props = {
+        ...raw_react_props,
+        class: raw_react_props.className
+    };
+    return (0, $4568c09979447ab1$export$4b564d7f5a1b1d43)({
+        solid_component: (props_store)=>(0, $1RlIW$TextPlaceholder)(props_store),
+        props: react_props,
+        wrapper_type: "span",
+        wrapper_style: {
+            "height": "100%"
+        }
     });
 }
 function $2b1fdeb83610500f$export$9bb30bbe003b82e0() {

package/locales/index.d.ts

@@ -1,2 +1,2 @@
-export type { plp_shared_i18n, search_i18n, category_i18n, Locale } from "@depict-ai/ui/locales";
-export { cz, de, en, da, fi, pl, fr, sv, pt, no, nl, es, it } from "@depict-ai/ui/locales";
+export type { plp_shared_i18n, search_i18n, category_i18n, Locale } from "@depict-ai/ui/locales";
+export { cz, de, en, da, fi, pl, fr, sv, pt, no, nl, es, it } from "@depict-ai/ui/locales";

package/locales/index.js

@@ -1 +1 @@
-export * from "@depict-ai/ui/locales";
+export * from "@depict-ai/ui/locales";

package/locales/require.js

@@ -1 +1 @@
-module.exports = require("@depict-ai/ui/locales");
+module.exports = require("@depict-ai/ui/locales");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/react-ui",
-  "version": "1.0.12",
+  "version": "1.0.15",
   "packageManager": "yarn@3.2.2",
   "source": "src/index.ts",
   "main": "dist/main.js",
@@ -97,10 +97,10 @@
     "README.md"
   ],
   "dependencies": {
-    "@depict-ai/dpc": "^1.0.12",
-    "@depict-ai/plp-styling": "^1.0.13",
-    "@depict-ai/ui": "^1.0.15",
-    "@depict-ai/utilishared": "^1.0.12",
+    "@depict-ai/dpc": "^1.0.15",
+    "@depict-ai/plp-styling": "^1.0.16",
+    "@depict-ai/ui": "^1.0.18",
+    "@depict-ai/utilishared": "^1.0.15",
     "solid-js": "^1.7.3"
   },
   "peerDependencies": {
@@ -114,7 +114,7 @@
     "@babel/preset-typescript": "latest",
     "@babel/runtime": "latest",
     "@babel/runtime-corejs3": "latest",
-    "@depict-ai/plp-styling": "^1.0.13",
+    "@depict-ai/plp-styling": "^1.0.16",
     "@jest/globals": "^29.3.1",
     "@parcel/babel-preset-env": "latest",
     "@parcel/resolver-default": "^2.8.0",