@sitecore/byoc - npm Package Compare versions

Comparing version 0.0.18-alpha.8 to 0.0.18-alpha.9

build/react.js

@@ -29,3 +29,3 @@ var __rest = (this && this.__rest) || function (s, e) {
     // See if component is registered in current context
-    const { componentName } = props, attributes = __rest(props, ["componentName"]);
+    const { componentName, clientFallback } = props, attributes = __rest(props, ["componentName", "clientFallback"]);
     const Component = (_a = getComponent(componentName)) === null || _a === void 0 ? void 0 : _a.component;
@@ -40,8 +40,5 @@ if (!NextComponents.get(componentName)) {
     }
-    // wrap clientFallback into a dynamic() call to make it render clientside hydration
-    const clientFallback = props.clientFallback;
-    if (clientFallback)
-        props = Object.assign(Object.assign({}, props), { clientFallback: React.createElement(NextDynamicFunction(() => Promise.resolve(() => clientFallback), { ssr: false }), { suppressHydrationWarning: true }) });
     const External = NextComponents.get(componentName);
-    return React.createElement(External, Object.assign({}, props, { fallback: Component ? React.createElement(Component, Object.assign({}, props)) : props.fallback }));
+    return (React.createElement(External, Object.assign({}, props, { fallback: Component ? (React.createElement(Component, Object.assign({}, props))) : // wrap clientFallback into a dynamic() call to make it render clientside hydration
+            clientFallback ? (React.createElement(NextDynamicFunction(() => Promise.resolve(() => clientFallback), { ssr: false }))) : (props.fallback) })));
 }
@@ -95,8 +92,7 @@ /**
 export function RegularComponent(props) {
-    const { componentName, fallback, clientFallback, suppressHydrationWarning, _dynamic } = props, attributes = __rest(props, ["componentName", "fallback", "clientFallback", "suppressHydrationWarning", "_dynamic"]);
+    const { componentName, fallback, suppressHydrationWarning, _dynamic } = props, attributes = __rest(props, ["componentName", "fallback", "suppressHydrationWarning", "_dynamic"]);
     const definition = getComponent(componentName);
     const Component = definition === null || definition === void 0 ? void 0 : definition.component;
-    const usedFallback = fallback || clientFallback;
-    if ((!Component && usedFallback) || !componentName)
-        return (React.createElement("feaas-external", { "data-external-id": componentName, suppressHydrationWarning: true, hydrate: 'false' }, usedFallback));
+    if ((!Component && fallback) || !componentName)
+        return (React.createElement("feaas-external", { "data-external-id": componentName, suppressHydrationWarning: true, hydrate: 'false' }, fallback));
     const parsed = getComponentProperties(componentName, attributes);
@@ -103,0 +99,0 @@ if (Component && isWebComponent(Component)) {

dist/browser/react.esm.js

@@ -1,2 +0,2 @@
-import n from"react";import{getComponent as y,getComponentProperties as x,isWebComponent as j,registered as E}from"@sitecore/byoc";import{objectKeysToKebabCase as g,toKebabCase as v}from"@sitecore/byoc";export*from"@sitecore/byoc";var p=function(e,t){var r={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var o=0,a=Object.getOwnPropertySymbols(e);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(r[a[o]]=e[a[o]]);return r},b=new Map,f=null,c=null;function C(e){var t;let{componentName:r}=e,a=p(e,["componentName"]),o=(t=y(r))===null||t===void 0?void 0:t.component;if(!b.get(r)){let l=c(()=>Promise.resolve(f),{ssr:!1,loading:()=>n.createElement(O,Object.assign({},a,{componentName:r}))});b.set(r,l)}let s=e.clientFallback;s&&(e=Object.assign(Object.assign({},e),{clientFallback:n.createElement(c(()=>Promise.resolve(()=>s),{ssr:!1}),{suppressHydrationWarning:!0})}));let m=b.get(r);return n.createElement(m,Object.assign({},e,{fallback:o?n.createElement(o,Object.assign({},e)):e.fallback}))}function W(e,t){return c=e,f=t,t}function _(e){if(Object.keys(e).length!=0)return c&&!e._dynamic?C(Object.assign({_dynamic:!0},e)):O(e)}function h(){return n.createElement(n.Fragment,null,n.createElement("byoc-registration",{components:JSON.stringify(Object.values(E)),suppressHydrationWarning:!0}),n.createElement(f,null))}function O(e){let{componentName:t,fallback:r,clientFallback:a,suppressHydrationWarning:o,_dynamic:s}=e,m=p(e,["componentName","fallback","clientFallback","suppressHydrationWarning","_dynamic"]),l=y(t),i=l==null?void 0:l.component,d=r||a;if(!i&&d||!t)return n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},d);let u=x(t,m);return i&&j(i)?n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},n.createElement("byoc-"+v(l.id),Object.assign(Object.assign({},g(u)),{suppressHydrationWarning:!0}))):n.createElement(n.Fragment,null,n.createElement("feaas-external",Object.assign({},g(u),{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"}),i==null?null:n.createElement(i,Object.assign({},u))))}export{h as Bundle,_ as Component,C as NextComponent,O as RegularComponent,W as enableNextClientsideComponents};
+import n from"react";import{getComponent as b,getComponentProperties as y,isWebComponent as x,registered as O}from"@sitecore/byoc";import{objectKeysToKebabCase as d,toKebabCase as j}from"@sitecore/byoc";export*from"@sitecore/byoc";var p=function(e,t){var a={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(a[r]=e[r]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var o=0,r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(a[r[o]]=e[r[o]]);return a},u=new Map,f=null,c=null;function E(e){var t;let{componentName:a,clientFallback:r}=e,o=p(e,["componentName","clientFallback"]),s=(t=b(a))===null||t===void 0?void 0:t.component;if(!u.get(a)){let l=c(()=>Promise.resolve(f),{ssr:!1,loading:()=>n.createElement(g,Object.assign({},o,{componentName:a}))});u.set(a,l)}let i=u.get(a);return n.createElement(i,Object.assign({},e,{fallback:s?n.createElement(s,Object.assign({},e)):r?n.createElement(c(()=>Promise.resolve(()=>r),{ssr:!1})):e.fallback}))}function _(e,t){return c=e,f=t,t}function h(e){if(Object.keys(e).length!=0)return c&&!e._dynamic?E(Object.assign({_dynamic:!0},e)):g(e)}function W(){return n.createElement(n.Fragment,null,n.createElement("byoc-registration",{components:JSON.stringify(Object.values(O)),suppressHydrationWarning:!0}),n.createElement(f,null))}function g(e){let{componentName:t,fallback:a,suppressHydrationWarning:r,_dynamic:o}=e,s=p(e,["componentName","fallback","suppressHydrationWarning","_dynamic"]),i=b(t),l=i==null?void 0:i.component;if(!l&&a||!t)return n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},a);let m=y(t,s);return l&&x(l)?n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},n.createElement("byoc-"+j(i.id),Object.assign(Object.assign({},d(m)),{suppressHydrationWarning:!0}))):n.createElement(n.Fragment,null,n.createElement("feaas-external",Object.assign({},d(m),{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"}),l==null?null:n.createElement(l,Object.assign({},m))))}export{W as Bundle,h as Component,E as NextComponent,g as RegularComponent,_ as enableNextClientsideComponents};
 //# sourceMappingURL=react.esm.js.map

dist/node/react.esm.js

@@ -1,2 +0,2 @@
-import n from"react";import{getComponent as y,getComponentProperties as x,isWebComponent as j,registered as E}from"@sitecore/byoc";import{objectKeysToKebabCase as g,toKebabCase as v}from"@sitecore/byoc";export*from"@sitecore/byoc";var p=function(e,t){var r={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var o=0,a=Object.getOwnPropertySymbols(e);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(r[a[o]]=e[a[o]]);return r},b=new Map,f=null,c=null;function C(e){var t;let{componentName:r}=e,a=p(e,["componentName"]),o=(t=y(r))===null||t===void 0?void 0:t.component;if(!b.get(r)){let l=c(()=>Promise.resolve(f),{ssr:!1,loading:()=>n.createElement(O,Object.assign({},a,{componentName:r}))});b.set(r,l)}let s=e.clientFallback;s&&(e=Object.assign(Object.assign({},e),{clientFallback:n.createElement(c(()=>Promise.resolve(()=>s),{ssr:!1}),{suppressHydrationWarning:!0})}));let m=b.get(r);return n.createElement(m,Object.assign({},e,{fallback:o?n.createElement(o,Object.assign({},e)):e.fallback}))}function W(e,t){return c=e,f=t,t}function _(e){if(Object.keys(e).length!=0)return c&&!e._dynamic?C(Object.assign({_dynamic:!0},e)):O(e)}function h(){return n.createElement(n.Fragment,null,n.createElement("byoc-registration",{components:JSON.stringify(Object.values(E)),suppressHydrationWarning:!0}),n.createElement(f,null))}function O(e){let{componentName:t,fallback:r,clientFallback:a,suppressHydrationWarning:o,_dynamic:s}=e,m=p(e,["componentName","fallback","clientFallback","suppressHydrationWarning","_dynamic"]),l=y(t),i=l==null?void 0:l.component,d=r||a;if(!i&&d||!t)return n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},d);let u=x(t,m);return i&&j(i)?n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},n.createElement("byoc-"+v(l.id),Object.assign(Object.assign({},g(u)),{suppressHydrationWarning:!0}))):n.createElement(n.Fragment,null,n.createElement("feaas-external",Object.assign({},g(u),{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"}),i==null?null:n.createElement(i,Object.assign({},u))))}export{h as Bundle,_ as Component,C as NextComponent,O as RegularComponent,W as enableNextClientsideComponents};
+import n from"react";import{getComponent as b,getComponentProperties as y,isWebComponent as x,registered as O}from"@sitecore/byoc";import{objectKeysToKebabCase as d,toKebabCase as j}from"@sitecore/byoc";export*from"@sitecore/byoc";var p=function(e,t){var a={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(a[r]=e[r]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var o=0,r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(a[r[o]]=e[r[o]]);return a},u=new Map,f=null,c=null;function E(e){var t;let{componentName:a,clientFallback:r}=e,o=p(e,["componentName","clientFallback"]),s=(t=b(a))===null||t===void 0?void 0:t.component;if(!u.get(a)){let l=c(()=>Promise.resolve(f),{ssr:!1,loading:()=>n.createElement(g,Object.assign({},o,{componentName:a}))});u.set(a,l)}let i=u.get(a);return n.createElement(i,Object.assign({},e,{fallback:s?n.createElement(s,Object.assign({},e)):r?n.createElement(c(()=>Promise.resolve(()=>r),{ssr:!1})):e.fallback}))}function _(e,t){return c=e,f=t,t}function h(e){if(Object.keys(e).length!=0)return c&&!e._dynamic?E(Object.assign({_dynamic:!0},e)):g(e)}function W(){return n.createElement(n.Fragment,null,n.createElement("byoc-registration",{components:JSON.stringify(Object.values(O)),suppressHydrationWarning:!0}),n.createElement(f,null))}function g(e){let{componentName:t,fallback:a,suppressHydrationWarning:r,_dynamic:o}=e,s=p(e,["componentName","fallback","suppressHydrationWarning","_dynamic"]),i=b(t),l=i==null?void 0:i.component;if(!l&&a||!t)return n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},a);let m=y(t,s);return l&&x(l)?n.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},n.createElement("byoc-"+j(i.id),Object.assign(Object.assign({},d(m)),{suppressHydrationWarning:!0}))):n.createElement(n.Fragment,null,n.createElement("feaas-external",Object.assign({},d(m),{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"}),l==null?null:n.createElement(l,Object.assign({},m))))}export{W as Bundle,h as Component,E as NextComponent,g as RegularComponent,_ as enableNextClientsideComponents};
 //# sourceMappingURL=react.esm.js.map

package.json

@@ -5,3 +5,3 @@ {
   "description": "Bring-Your-Own-Components runtime to register and retrieve react components",
-  "version": "0.0.18-alpha.8",
+  "version": "0.0.18-alpha.9",
   "scripts": {
@@ -8,0 +8,0 @@ "test": "npx vitest",

react.js

@@ -1,2 +0,2 @@
-"use strict";var k=Object.create;var f=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var F=Object.getOwnPropertyNames;var W=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var h=(e,t)=>{for(var n in t)f(e,n,{get:t[n],enumerable:!0})},b=(e,t,n,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of F(t))!_.call(e,r)&&r!==n&&f(e,r,{get:()=>t[r],enumerable:!(a=N(t,r))||a.enumerable});return e},i=(e,t,n)=>(b(e,t,"default"),n&&b(n,t,"default")),H=(e,t,n)=>(n=e!=null?k(W(e)):{},b(t||!e||!e.__esModule?f(n,"default",{value:e,enumerable:!0}):n,e)),P=e=>b(f({},"__esModule",{value:!0}),e);var l={};h(l,{Bundle:()=>R,Component:()=>K,NextComponent:()=>C,RegularComponent:()=>j,enableNextClientsideComponents:()=>w});module.exports=P(l);var o=H(require("react"),1),c=require("@sitecore/byoc"),u=require("@sitecore/byoc");i(l,require("@sitecore/byoc"),module.exports);var v=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var r=0,a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]]);return n},O=new Map,x=null,d=null;function C(e){var t;let{componentName:n}=e,a=v(e,["componentName"]),r=(t=(0,c.getComponent)(n))===null||t===void 0?void 0:t.component;if(!O.get(n)){let s=d(()=>Promise.resolve(x),{ssr:!1,loading:()=>o.default.createElement(j,Object.assign({},a,{componentName:n}))});O.set(n,s)}let g=e.clientFallback;g&&(e=Object.assign(Object.assign({},e),{clientFallback:o.default.createElement(d(()=>Promise.resolve(()=>g),{ssr:!1}),{suppressHydrationWarning:!0})}));let p=O.get(n);return o.default.createElement(p,Object.assign({},e,{fallback:r?o.default.createElement(r,Object.assign({},e)):e.fallback}))}function w(e,t){return d=e,x=t,t}function K(e){if(Object.keys(e).length!=0)return d&&!e._dynamic?C(Object.assign({_dynamic:!0},e)):j(e)}function R(){return o.default.createElement(o.default.Fragment,null,o.default.createElement("byoc-registration",{components:JSON.stringify(Object.values(c.registered)),suppressHydrationWarning:!0}),o.default.createElement(x,null))}function j(e){let{componentName:t,fallback:n,clientFallback:a,suppressHydrationWarning:r,_dynamic:g}=e,p=v(e,["componentName","fallback","clientFallback","suppressHydrationWarning","_dynamic"]),s=(0,c.getComponent)(t),m=s==null?void 0:s.component,E=n||a;if(!m&&E||!t)return o.default.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},E);let y=(0,c.getComponentProperties)(t,p);return m&&(0,c.isWebComponent)(m)?o.default.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},o.default.createElement("byoc-"+(0,u.toKebabCase)(s.id),Object.assign(Object.assign({},(0,u.objectKeysToKebabCase)(y)),{suppressHydrationWarning:!0}))):o.default.createElement(o.default.Fragment,null,o.default.createElement("feaas-external",Object.assign({},(0,u.objectKeysToKebabCase)(y),{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"}),m==null?null:o.default.createElement(m,Object.assign({},y))))}
+"use strict";var v=Object.create;var p=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var _=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty;var W=(e,t)=>{for(var n in t)p(e,n,{get:t[n],enumerable:!0})},d=(e,t,n,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of N(t))!h.call(e,l)&&l!==n&&p(e,l,{get:()=>t[l],enumerable:!(r=C(t,l))||r.enumerable});return e},i=(e,t,n)=>(d(e,t,"default"),n&&d(n,t,"default")),k=(e,t,n)=>(n=e!=null?v(_(e)):{},d(t||!e||!e.__esModule?p(n,"default",{value:e,enumerable:!0}):n,e)),H=e=>d(p({},"__esModule",{value:!0}),e);var o={};W(o,{Bundle:()=>w,Component:()=>F,NextComponent:()=>E,RegularComponent:()=>O,enableNextClientsideComponents:()=>P});module.exports=H(o);var a=k(require("react"),1),s=require("@sitecore/byoc"),u=require("@sitecore/byoc");i(o,require("@sitecore/byoc"),module.exports);var j=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var l=0,r=Object.getOwnPropertySymbols(e);l<r.length;l++)t.indexOf(r[l])<0&&Object.prototype.propertyIsEnumerable.call(e,r[l])&&(n[r[l]]=e[r[l]]);return n},y=new Map,x=null,b=null;function E(e){var t;let{componentName:n,clientFallback:r}=e,l=j(e,["componentName","clientFallback"]),f=(t=(0,s.getComponent)(n))===null||t===void 0?void 0:t.component;if(!y.get(n)){let c=b(()=>Promise.resolve(x),{ssr:!1,loading:()=>a.default.createElement(O,Object.assign({},l,{componentName:n}))});y.set(n,c)}let m=y.get(n);return a.default.createElement(m,Object.assign({},e,{fallback:f?a.default.createElement(f,Object.assign({},e)):r?a.default.createElement(b(()=>Promise.resolve(()=>r),{ssr:!1})):e.fallback}))}function P(e,t){return b=e,x=t,t}function F(e){if(Object.keys(e).length!=0)return b&&!e._dynamic?E(Object.assign({_dynamic:!0},e)):O(e)}function w(){return a.default.createElement(a.default.Fragment,null,a.default.createElement("byoc-registration",{components:JSON.stringify(Object.values(s.registered)),suppressHydrationWarning:!0}),a.default.createElement(x,null))}function O(e){let{componentName:t,fallback:n,suppressHydrationWarning:r,_dynamic:l}=e,f=j(e,["componentName","fallback","suppressHydrationWarning","_dynamic"]),m=(0,s.getComponent)(t),c=m==null?void 0:m.component;if(!c&&n||!t)return a.default.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},n);let g=(0,s.getComponentProperties)(t,f);return c&&(0,s.isWebComponent)(c)?a.default.createElement("feaas-external",{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"},a.default.createElement("byoc-"+(0,u.toKebabCase)(m.id),Object.assign(Object.assign({},(0,u.objectKeysToKebabCase)(g)),{suppressHydrationWarning:!0}))):a.default.createElement(a.default.Fragment,null,a.default.createElement("feaas-external",Object.assign({},(0,u.objectKeysToKebabCase)(g),{"data-external-id":t,suppressHydrationWarning:!0,hydrate:"false"}),c==null?null:a.default.createElement(c,Object.assign({},g))))}
 //# sourceMappingURL=react.js.map

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

350805

decreased by-0.77%

Lines of code

1813

decreased by-0.33%

No dependency changes