vite-plugin-react-shopify 2.2.0 → 2.2.1

package/dist/index.js

@@ -590,6 +590,21 @@ function pathToFileURL(filePath) {
   return "file://" + absPath;
 }
 var log6 = logger("ssg:renderer");
+var DEFAULT_LIQUID_FILTERS = {
+  textarea: " | newline_to_br",
+  image_picker: " | img_url: 'master'"
+};
+function buildLiquidFilterMap(settings, prefix) {
+  const map = {};
+  if (!settings) return map;
+  for (const s of settings) {
+    const filter = DEFAULT_LIQUID_FILTERS[s.type];
+    if (filter) {
+      map[`${prefix}${s.id}`] = filter;
+    }
+  }
+  return map;
+}
 function renderEntry(tmpFile, entry, projectRoot) {
   return import(pathToFileURL(tmpFile)).then((mod) => {
     const Component = mod.default;
@@ -612,11 +627,15 @@ function renderEntry(tmpFile, entry, projectRoot) {
       return null;
     }
     globalThis.__shopify_ssg_target = entry.targetType;
+    const prefix = entry.targetType === "block" ? "block.settings." : "section.settings.";
+    const filterMap = buildLiquidFilterMap(shopifyMeta?.settings, prefix);
+    globalThis.__shopify_ssg_liquid_filters = filterMap;
     const trackedExpressions = /* @__PURE__ */ new Set();
     globalThis.__shopify_ssg_liquid_track = trackedExpressions;
     const element = createElement(Component);
     let html = renderToStaticMarkup(element);
     delete globalThis.__shopify_ssg_liquid_track;
+    delete globalThis.__shopify_ssg_liquid_filters;
     html = normalizeVoidElements(html);
     html = normalizeStyleAttributes(html);
     html = unwrapHtmlEntities(html);

package/dist/runtime/index.js

@@ -7,12 +7,17 @@ var LiquidDataContext = createContext({});
 var LiquidDataProvider = LiquidDataContext.Provider;
 
 // src/runtime/hooks.ts
+function getLiquidFilter(expr) {
+  const filterMap = globalThis.__shopify_ssg_liquid_filters;
+  return filterMap?.[expr] ?? "";
+}
 function useLiquidRaw(expr) {
   const data = useContext(LiquidDataContext);
   if (typeof globalThis.document === "undefined") {
     const tracker = globalThis.__shopify_ssg_liquid_track;
     if (tracker) tracker.add(expr);
-    return `{{ ${expr} }}`;
+    const filter = getLiquidFilter(expr);
+    return `{{ ${expr}${filter} }}`;
   }
   if (Object.prototype.hasOwnProperty.call(data, expr)) {
     return data[expr];
@@ -26,7 +31,8 @@ function useLiquidRawValues(map) {
     const values2 = {};
     for (const [key, expr] of Object.entries(map)) {
       if (tracker) tracker.add(expr);
-      values2[key] = `{{ ${expr} }}`;
+      const filter = getLiquidFilter(expr);
+      values2[key] = `{{ ${expr}${filter} }}`;
     }
     return values2;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-react-shopify",
-  "version": "2.2.0",
+  "version": "2.2.1",
   "description": "Vite plugin for React Shopify themes",
   "files": [
     "dist"