@builder.io/sdk-react-nextjs 0.6.2-0 → 0.6.3

package/lib/node/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./bundle-c3b66b2f.js"),t=require("./USE_CLIENT_BUNDLE-778eeeb3.js");require("lru-cache");require("react/jsx-runtime");require("react");require("next/navigation");require("./USE_SERVER_BUNDLE-e7c2df57.js");exports.Blocks=e.Blocks;exports.Columns=e.Columns;exports.Content=e.ContentVariants;exports.RenderBlocks=e.RenderBlocks;exports.RenderContent=e.RenderContent;exports.Symbol=e.Symbol;exports.Text=e.Text;exports._processContentResult=e._processContentResult;exports.createRegisterComponentMessage=e.createRegisterComponentMessage;exports.fetchBuilderProps=e.fetchBuilderProps;exports.fetchEntries=e.fetchEntries;exports.fetchOneEntry=e.fetchOneEntry;exports.getAllContent=e.getAllContent;exports.getBuilderSearchParams=e.getBuilderSearchParams;exports.getContent=e.getContent;exports.isEditing=e.isEditing;exports.isPreviewing=e.isPreviewing;exports.register=e.register;exports.setEditorSettings=e.setEditorSettings;exports.track=e.track;exports.Button=t.Button;exports.Fragment=t.FragmentComponent;exports.Image=t.Image;exports.Section=t.SectionComponent;exports.Video=t.Video;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./bundle-a1b650c9.js"),t=require("./USE_CLIENT_BUNDLE-ba140db3.js");require("lru-cache");require("react/jsx-runtime");require("react");require("next/navigation");require("./USE_SERVER_BUNDLE-7d2b1f4f.js");exports.Blocks=e.Blocks;exports.Columns=e.Columns;exports.Content=e.ContentVariants;exports.RenderBlocks=e.RenderBlocks;exports.RenderContent=e.RenderContent;exports.Symbol=e.Symbol;exports.Text=e.Text;exports._processContentResult=e._processContentResult;exports.createRegisterComponentMessage=e.createRegisterComponentMessage;exports.fetchBuilderProps=e.fetchBuilderProps;exports.fetchEntries=e.fetchEntries;exports.fetchOneEntry=e.fetchOneEntry;exports.getAllContent=e.getAllContent;exports.getBuilderSearchParams=e.getBuilderSearchParams;exports.getContent=e.getContent;exports.isEditing=e.isEditing;exports.isPreviewing=e.isPreviewing;exports.register=e.register;exports.setEditorSettings=e.setEditorSettings;exports.track=e.track;exports.Button=t.Button;exports.Fragment=t.FragmentComponent;exports.Image=t.Image;exports.Section=t.SectionComponent;exports.Video=t.Video;

package/lib/node/index.mjs

@@ -1,34 +1,34 @@
-import { B as i, v as m, C as c, R as g, u as p, S as l, T as d, F as C, m as u, J as B, z as S, A as f, D as E, G as R, E as h, i as x, w as k, x as y, y as F, H as P } from "./bundle-b0c14a2f.mjs";
-import { c as w, F as A, d as T, S as V, V as b } from "./USE_CLIENT_BUNDLE-a73198a1.mjs";
+import { B as i, p as m, C as c, R as g, o as p, S as l, T as C, z as d, f, E as u, v as B, w as S, x as E, A as R, y as h, i as x, q as k, t as y, u as P, D as b } from "./bundle-c727cf36.mjs";
+import { b as w, F as A, c as F, S as T, V } from "./USE_CLIENT_BUNDLE-7df521d2.mjs";
 import "lru-cache";
 import "react/jsx-runtime";
 import "react";
 import "next/navigation";
-import "./USE_SERVER_BUNDLE-80e10cfe.mjs";
+import "./USE_SERVER_BUNDLE-4eda8de6.mjs";
 export {
   i as Blocks,
   w as Button,
   m as Columns,
   c as Content,
   A as Fragment,
-  T as Image,
+  F as Image,
   g as RenderBlocks,
   p as RenderContent,
-  V as Section,
+  T as Section,
   l as Symbol,
-  d as Text,
-  b as Video,
-  C as _processContentResult,
-  u as createRegisterComponentMessage,
-  B as fetchBuilderProps,
-  S as fetchEntries,
-  f as fetchOneEntry,
+  C as Text,
+  V as Video,
+  d as _processContentResult,
+  f as createRegisterComponentMessage,
+  u as fetchBuilderProps,
+  B as fetchEntries,
+  S as fetchOneEntry,
   E as getAllContent,
   R as getBuilderSearchParams,
   h as getContent,
   x as isEditing,
   k as isPreviewing,
   y as register,
-  F as setEditorSettings,
-  P as track
+  P as setEditorSettings,
+  b as track
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-react-nextjs",
   "description": "Builder.io RSC SDK for NextJS App Directory",
-  "version": "0.6.2-0",
+  "version": "0.6.3",
   "files": [
     "lib",
     "types"

package/types/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "0.6.2-0";
+export declare const SDK_VERSION = "0.6.3";

package/types/functions/fetch-builder-props.d.ts

@@ -35,6 +35,19 @@ type GetBuilderPropsOptions = (Omit<GetContentOptions, 'model'> & {
 /**
  * Given an `apiKey` and `url` (or `path` + `searchParams`), provides all props that `Content` needs to render Builder Content.
  *
+ * @example
+ * ```jsx
+ * const builderProps = await fetchBuilderProps({
+ *    apiKey: 'API_KEY',
+ *    // provide `url`
+ *    url: yourPageUrl,
+ *    // OR provide `path` + `searchParams`
+ *    path: yourPath,
+ *    searchParams: yourSearchParams,
+ * });
+ *
+ * return <Content {...builderProps} />;
+ * ```
  */
 export declare const fetchBuilderProps: (_args: GetBuilderPropsOptions) => Promise<ContentVariantsPrps>;
 export {};

package/types/types/components.d.ts

@@ -97,7 +97,6 @@ export interface ComponentInfo {
          */
         query?: any;
     };
-    /** not yet implemented */
     friendlyName?: string;
     /**
      * Use to restrict access to your component based on a the current user permissions

package/lib/browser/USE_CLIENT_BUNDLE-778eeeb3.js

@@ -1,23 +0,0 @@
-"use client";"use strict";const t=require("react/jsx-runtime"),l=require("react"),n=require("./bundle-c3b66b2f.js"),z=require("./USE_SERVER_BUNDLE-e7c2df57.js"),M=require("next/navigation");function _(e){return t.jsxs(t.Fragment,{children:[e.link?t.jsx(t.Fragment,{children:t.jsx("a",{role:"button",...e.attributes,href:e.link,target:e.openLinkInNewTab?"_blank":void 0,children:e.text})}):t.jsx(t.Fragment,{children:t.jsx("button",{...e.attributes,style:e.attributes.style,className:e.attributes.className+" button-3e7bc8b2",children:e.text})}),t.jsx("style",{children:`.button-3e7bc8b2 {
-  all: unset;
-}`})]})}function A(e){const[i,S]=l.useState(()=>n.getProcessedBlock({block:e.block,localState:e.context.localState,rootState:e.context.rootState,rootSetState:e.context.rootSetState,context:e.context.context,shouldEvaluateBindings:!0}));function y(){return n.checkIsDefined(i.hide)?!i.hide:n.checkIsDefined(i.show)?i.show:!0}function a(){var E;const s=i.responsiveStyles,h=e.context.content,b=n.getSizesForBreakpoints(((E=h==null?void 0:h.meta)==null?void 0:E.breakpoints)||{}),x=s==null?void 0:s.large,o=s==null?void 0:s.medium,g=s==null?void 0:s.small,f=i.id;if(!f)return"";const v=x?n.createCssClass({className:f,styles:x}):"",C=o?n.createCssClass({className:f,styles:o,mediaQuery:n.getMaxWidthQueryForSize("medium",b)}):"",I=g?n.createCssClass({className:f,styles:g,mediaQuery:n.getMaxWidthQueryForSize("small",b)}):"";return[v,C,I].join(" ")}return t.jsx(t.Fragment,{children:a()&&y()?t.jsx(t.Fragment,{children:t.jsx(n.InlinedStyles,{styles:a()})}):null})}function U(e){return t.jsx(e.Wrapper,{...e.wrapperProps,attributes:{...n.getBlockProperties({block:e.block,context:e.context}),...n.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context})},children:e.children})}function D(e){return t.jsxs(t.Fragment,{children:[" ",e.hasChildren?t.jsx(t.Fragment,{children:t.jsxs(e.Wrapper,{...n.getBlockProperties({block:e.block,context:e.context}),...n.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context,stripPrefix:!0}),children:[" ",e.children," "]})}):t.jsx(t.Fragment,{children:t.jsx(e.Wrapper,{...n.getBlockProperties({block:e.block,context:e.context}),...n.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context,stripPrefix:!0})})})," "]})}function K(e){function i(){var a;return"builder-blocks"+((a=e.blocks)!=null&&a.length?"":" no-blocks")}function S(){var a,s;n.isEditing()&&!((a=e.blocks)!=null&&a.length)&&((s=window.parent)==null||s.postMessage({type:"builder.clickEmptyBlocks",data:{parentElementId:e.parent,dataPath:e.path}},"*"))}function y(){var a,s;n.isEditing()&&!((a=e.blocks)!=null&&a.length)&&((s=window.parent)==null||s.postMessage({type:"builder.hoverEmptyBlocks",data:{parentElementId:e.parent,dataPath:e.path}},"*"))}return t.jsxs(t.Fragment,{children:[t.jsx("div",{className:i()+" div-5821bd52","builder-path":e.path,"builder-parent-id":e.parent,style:e.styleProp,onClick:a=>S(),onMouseEnter:a=>y(),onKeyPress:a=>S(),children:e.children}),t.jsx("style",{children:`.div-5821bd52 {
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-}`})]})}function V(e){return t.jsx("span",{children:e.children})}function H(e){var a,s,h,b;function i(){var g;const o=e.image||e.src;if(!o||!(o.match(/builder\.io/)||o.match(/cdn\.shopify\.com/)))return e.srcset;if(e.srcset&&((g=e.image)!=null&&g.includes("builder.io/api/v1/image"))){if(!e.srcset.includes(e.image.split("?")[0]))return console.debug("Removed given srcset"),n.getSrcSet(o)}else if(e.image&&!e.srcset)return n.getSrcSet(o);return n.getSrcSet(o)}function S(){var x;return(x=i==null?void 0:i())!=null&&x.match(/builder\.io/)&&!e.noWebp?i().replace(/\?/g,"?format=webp&"):""}function y(){const x={position:"absolute",height:"100%",width:"100%",left:"0px",top:"0px"};return e.aspectRatio?x:void 0}return t.jsxs(t.Fragment,{children:[t.jsxs(t.Fragment,{children:[t.jsxs("picture",{children:[S()?t.jsx(t.Fragment,{children:t.jsx("source",{type:"image/webp",srcSet:S()})}):null,t.jsx("img",{loading:"lazy",alt:e.altText,role:e.altText?"presentation":void 0,style:{objectPosition:e.backgroundPosition||"center",objectFit:e.backgroundSize||"cover",...y()},className:"builder-image"+(e.className?" "+e.className:"")+" img-ef11a6be",src:e.image,srcSet:i(),sizes:e.sizes})]}),e.aspectRatio&&!((s=(a=e.builderBlock)==null?void 0:a.children)!=null&&s.length&&e.fitContent)?t.jsx(t.Fragment,{children:t.jsx("div",{className:"builder-image-sizer div-ef11a6be",style:{paddingTop:e.aspectRatio*100+"%"}})}):null,(b=(h=e.builderBlock)==null?void 0:h.children)!=null&&b.length&&e.fitContent?t.jsx(t.Fragment,{children:e.children}):null,!e.fitContent&&e.children?t.jsx(t.Fragment,{children:t.jsx("div",{className:"div-ef11a6be-2",children:e.children})}):null]}),t.jsx("style",{children:`.img-ef11a6be {
-  opacity: 1;
-  transition: opacity 0.2s ease-in-out;
-}.div-ef11a6be {
-  width: 100%;
-  pointer-events: none;
-  font-size: 0;
-}.div-ef11a6be-2 {
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}`})]})}function Q(e){return t.jsx("section",{...e.attributes,style:{width:"100%",alignSelf:"stretch",flexGrow:1,boxSizing:"border-box",maxWidth:e.maxWidth||1200,display:"flex",flexDirection:"column",alignItems:"stretch",marginLeft:"auto",marginRight:"auto"},children:e.children})}function J(e){var y;function i(){return{...e.autoPlay===!0?{autoPlay:!0}:{},...e.muted===!0?{muted:!0}:{},...e.controls===!0?{controls:!0}:{},...e.loop===!0?{loop:!0}:{},...e.playsInline===!0?{playsInline:!0}:{}}}function S(){return{...e.attributes,...i()}}return t.jsx("video",{...S(),preload:e.preload||"metadata",style:{width:"100%",height:"100%",...(y=e.attributes)==null?void 0:y.style,objectFit:e.fit,objectPosition:e.position,borderRadius:1},src:e.video||"no-src",poster:e.posterImage})}function O(e){const i=l.useRef(null),[S,y]=l.useState(()=>[]),[a,s]=l.useState(()=>[]),[h,b]=l.useState(()=>!1);function x(){if(!i.current||!i.current.getElementsByTagName)return;const o=i.current.getElementsByTagName("script");for(let g=0;g<o.length;g++){const f=o[g];if(f.src&&!S.includes(f.src)){S.push(f.src);const v=document.createElement("script");v.async=!0,v.src=f.src,document.head.appendChild(v)}else if(n.isJsScript(f)&&!a.includes(f.innerText))try{a.push(f.innerText),new Function(f.innerText)()}catch(v){console.warn("`Embed`: Error running script:",v)}}}return l.useEffect(()=>{i.current&&!h&&(b(!0),x())},[i.current,h]),t.jsx("div",{className:"builder-embed",ref:i,dangerouslySetInnerHTML:{__html:e.content}})}function G(e){return t.jsx("img",{style:{objectFit:e.backgroundSize||"cover",objectPosition:e.backgroundPosition||"center"},alt:e.altText,src:e.imgSrc||e.image,...e.attributes},n.isEditing()&&e.imgSrc||"default-key")}function X(e){const i=l.useRef(null),[S,y]=l.useState(()=>[]),[a,s]=l.useState(()=>[]);function h(){if(i.current&&i.current.getElementsByTagName&&typeof window<"u"){const b=i.current.getElementsByTagName("script");for(let x=0;x<b.length;x++){const o=b[x];if(o.src){if(S.includes(o.src))continue;S.push(o.src);const g=document.createElement("script");g.async=!0,g.src=o.src,document.head.appendChild(g)}else if(!o.type||["text/javascript","application/javascript","application/ecmascript"].includes(o.type)){if(a.includes(o.innerText))continue;try{a.push(o.innerText),new Function(o.innerText)()}catch(g){console.warn("`CustomCode`: Error running script:",g)}}}}}return l.useEffect(()=>{h()},[]),t.jsx("div",{ref:i,className:"builder-custom-code"+(e.replaceNodes?" replace-nodes":""),dangerouslySetInnerHTML:{__html:e.code}})}const Y=l.createContext({content:null,context:{},localState:void 0,rootSetState(){},rootState:{},apiKey:null,apiVersion:void 0,componentInfos:{},inheritedStyles:{}});function Z(e){var w,B,F,P,T;const i=l.useRef(null),[S,y]=l.useState(()=>n.checkIsDefined(e.canTrack)?e.canTrack:!0),[a,s]=l.useState(()=>0);function h(c){var r,u,m,k,N;const d={...e.builderContextSignal.content,...c,data:{...(r=e.builderContextSignal.content)==null?void 0:r.data,...c==null?void 0:c.data},meta:{...(u=e.builderContextSignal.content)==null?void 0:u.meta,...c==null?void 0:c.meta,breakpoints:((m=c==null?void 0:c.meta)==null?void 0:m.breakpoints)||((N=(k=e.builderContextSignal.content)==null?void 0:k.meta)==null?void 0:N.breakpoints)}};z.postPreviewContent({value:d,key:d.id}).then(()=>{W.refresh()})}l.useState(()=>0);const[b,x]=l.useState(()=>!1);function o(c){var r;const{data:d}=c;if(d)switch(d.type){case"builder.configureSdk":{const u=d.data,{breakpoints:m,contentId:k}=u;if(!k||k!==((r=e.builderContextSignal.content)==null?void 0:r.id))return;m&&h({meta:{breakpoints:m}}),s(a+1);break}case"builder.contentUpdate":{const u=d.data,m=u.key||u.alias||u.entry||u.modelName,k=u.data;m===e.model&&(h(k),s(a+1));break}}}function g(){var d,r;const c=(r=(d=e.builderContextSignal.content)==null?void 0:d.data)==null?void 0:r.jsCode;c&&n.evaluate({code:c,context:e.context||{},localState:void 0,rootState:e.builderContextSignal.rootState,rootSetState:e.builderContextSignal.rootSetState})}const[f,v]=l.useState(()=>({})),[C,I]=l.useState(()=>!1);function E(c){var d,r;if(e.builderContextSignal.content){const u=(d=e.builderContextSignal.content)==null?void 0:d.testVariationId,m=(r=e.builderContextSignal.content)==null?void 0:r.id;n._track({type:"click",canTrack:S,contentId:m,apiKey:e.apiKey,variationId:u!==m?u:void 0,...n.getInteractionPropertiesForEvent(c),unique:!C})}C||I(!0)}function q(c){return c.replace(/{{([^}]+)}}/g,(d,r)=>n.evaluate({code:r,context:e.context||{},localState:void 0,rootState:e.builderContextSignal.rootState,rootSetState:e.builderContextSignal.rootSetState}))}function L({url:c,key:d}){n.fetch(c).then(r=>r.json()).then(r=>{var m,k;const u={...e.builderContextSignal.rootState,[d]:r};(k=(m=e.builderContextSignal).rootSetState)==null||k.call(m,u),f[d]=!0}).catch(r=>{console.error("error fetching dynamic data",c,r)})}function R(){var d,r;const c=((r=(d=e.builderContextSignal.content)==null?void 0:d.data)==null?void 0:r.httpRequests)??{};Object.entries(c).forEach(([u,m])=>{if(m&&(!f[u]||n.isEditing())){const k=q(m);L({url:k,key:u})}})}function j(){n.isEditing()&&window.dispatchEvent(new CustomEvent("builder:component:stateChange",{detail:{state:n.fastClone(e.builderContextSignal.rootState),ref:{name:e.model}}}))}const W=M.useRouter();return l.useEffect(()=>{var c,d;if(e.apiKey||n.logger.error("No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."),n.isBrowser()){if(n.isEditing()&&(s(a+1),window.addEventListener("message",o),n.registerInsertMenu(),n.setupBrowserForEditing({...e.locale?{locale:e.locale}:{},...e.includeRefs?{includeRefs:e.includeRefs}:{},...e.enrich?{enrich:e.enrich}:{}}),Object.values(e.builderContextSignal.componentInfos).forEach(r=>{var m;const u=n.createRegisterComponentMessage(r);(m=window.parent)==null||m.postMessage(u,"*")}),window.addEventListener("builder:component:stateChangeListenerActivated",j)),e.builderContextSignal.content){const r=(c=e.builderContextSignal.content)==null?void 0:c.testVariationId,u=(d=e.builderContextSignal.content)==null?void 0:d.id;n._track({type:"impression",canTrack:S,contentId:u,apiKey:e.apiKey,variationId:r!==u?r:void 0})}g(),R(),j()}},[]),l.useEffect(()=>{},[e.content]),l.useEffect(()=>{n.isBrowser()&&(window.removeEventListener("message",o),window.addEventListener("message",o))},[b]),l.useEffect(()=>{g()},[(B=(w=e.builderContextSignal.content)==null?void 0:w.data)==null?void 0:B.jsCode,e.builderContextSignal.rootState]),l.useEffect(()=>{R()},[(P=(F=e.builderContextSignal.content)==null?void 0:F.data)==null?void 0:P.httpRequests]),l.useEffect(()=>{j()},[e.builderContextSignal.rootState]),l.useEffect(()=>()=>{n.isBrowser()&&(window.removeEventListener("message",o),window.removeEventListener("builder:component:stateChangeListenerActivated",j))},[]),t.jsx(Y.Provider,{value:e.builderContextSignal,children:e.builderContextSignal.content?t.jsx(t.Fragment,{children:t.jsx("div",{ref:i,onClick:c=>E(c),"builder-content-id":(T=e.builderContextSignal.content)==null?void 0:T.id,"builder-model":e.model,...e.showContent?{}:{hidden:!0,"aria-hidden":!0},className:e.classNameProp,children:e.children},a)}):null})}exports.BlockStyles=A;exports.BlockWrapper=D;exports.BlocksWrapper=K;exports.Button=_;exports.CustomCode=X;exports.Embed=O;exports.EnableEditor=Z;exports.FragmentComponent=V;exports.Image=H;exports.ImgComponent=G;exports.InteractiveElement=U;exports.SectionComponent=Q;exports.Video=J;