@sitecore/byoc - npm Package Compare versions

Comparing version 0.1.10 to 0.1.11-alpha.1

build/react.js

@@ -105,3 +105,13 @@ var __rest = (this && this.__rest) || function (s, e) {
     if (Component && isWebComponent(Component)) {
-        return React.createElement('byoc-' + toKebabCase(definition.id), componentProperties);
+        const webComponentName = 'byoc-' + toKebabCase(definition.id);
+        return React.createElement(webComponentName, Object.assign(Object.assign({}, componentProperties), { ref: (el) => {
+                var _a;
+                if (el && typeof window != 'undefined') {
+                    // web components can define sitecoreContextCallback defined that recieves props directly
+                    (_a = window.customElements) === null || _a === void 0 ? void 0 : _a.whenDefined(webComponentName).then(() => {
+                        var _a;
+                        (_a = el.sitecoreContextCallback) === null || _a === void 0 ? void 0 : _a.call(el, parsed);
+                    });
+                }
+            } }));
     }
@@ -108,0 +118,0 @@ return (React.createElement(React.Fragment, null,

dist/browser/react.esm.js

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

dist/node/react.esm.js

@@ -1,2 +0,2 @@
-import t from"react";import{getComponent as y,getComponentProperties as x,isWebComponent as E,registered as v}from"@sitecore/byoc";import{objectKeysToKebabCase as C,toKebabCase as N}from"@sitecore/byoc";export*from"@sitecore/byoc";var g=function(e,n){var o={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&n.indexOf(a)<0&&(o[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var r=0,a=Object.getOwnPropertySymbols(e);r<a.length;r++)n.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(o[a[r]]=e[a[r]]);return o},f=null,m=null;function h(e){var n;let{componentName:o,clientFallback:a}=e,r=g(e,["componentName","clientFallback"]),u=(n=y(o))===null||n===void 0?void 0:n.component,p=t.useMemo(()=>m(()=>Promise.resolve(f),{ssr:!1,loading:()=>t.createElement(O,Object.assign({},r,{componentName:o}))}),[]);return t.createElement(p,Object.assign({},e,{fallback:u?t.createElement(u,Object.assign({},e)):a?t.createElement(m(()=>Promise.resolve(()=>a),{ssr:!1})):e.fallback}))}function W(e,n){return m=e,f=n,n}function H(e){return Object.keys(e).length==0?t.createElement(t.Fragment,null):m&&!e._dynamic?h(Object.assign({_dynamic:!0},e)):O(e)}function S(){return t.createElement(t.Fragment,null,t.createElement("byoc-registration",{components:JSON.stringify(Object.values(v)),suppressHydrationWarning:!0}),t.createElement(f,null))}function O(e){let{componentName:n,className:o,clientFallback:a,fallback:r,suppressHydrationWarning:u,_dynamic:p}=e,j=g(e,["componentName","className","clientFallback","fallback","suppressHydrationWarning","_dynamic"]),i=y(n),c=i==null?void 0:i.component,d=x(n,j),l=Object.assign(Object.assign({"data-external-id":n},C(d)),{suppressHydrationWarning:!0,class:o});return Object.keys(l).forEach(s=>{let b=l[s];if(b&&typeof b=="object"&&s!="class"&&s!="children")try{Object.assign(l,{[s]:JSON.stringify(b)})}catch(_){delete l[s]}}),!c&&r||!n?t.createElement("feaas-external",Object.assign({},l,{hydrate:"false"}),r):c&&E(c)?t.createElement("byoc-"+N(i.id),l):t.createElement(t.Fragment,null,t.createElement("feaas-external",Object.assign({},l,{hydrate:"false"}),c==null?null:t.createElement(c,Object.assign({},d))))}export{S as Bundle,H as Component,h as NextComponent,O as RegularComponent,W as enableNextClientsideComponents};
+import t from"react";import{getComponent as j,getComponentProperties as E,isWebComponent as C,registered as N}from"@sitecore/byoc";import{objectKeysToKebabCase as h,toKebabCase as _}from"@sitecore/byoc";export*from"@sitecore/byoc";var O=function(e,n){var o={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&n.indexOf(a)<0&&(o[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var r=0,a=Object.getOwnPropertySymbols(e);r<a.length;r++)n.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(o[a[r]]=e[a[r]]);return o},g=null,b=null;function w(e){var n;let{componentName:o,clientFallback:a}=e,r=O(e,["componentName","clientFallback"]),f=(n=j(o))===null||n===void 0?void 0:n.component,y=t.useMemo(()=>b(()=>Promise.resolve(g),{ssr:!1,loading:()=>t.createElement(v,Object.assign({},r,{componentName:o}))}),[]);return t.createElement(y,Object.assign({},e,{fallback:f?t.createElement(f,Object.assign({},e)):a?t.createElement(b(()=>Promise.resolve(()=>a),{ssr:!1})):e.fallback}))}function W(e,n){return b=e,g=n,n}function H(e){return Object.keys(e).length==0?t.createElement(t.Fragment,null):b&&!e._dynamic?w(Object.assign({_dynamic:!0},e)):v(e)}function S(){return t.createElement(t.Fragment,null,t.createElement("byoc-registration",{components:JSON.stringify(Object.values(N)),suppressHydrationWarning:!0}),t.createElement(g,null))}function v(e){let{componentName:n,className:o,clientFallback:a,fallback:r,suppressHydrationWarning:f,_dynamic:y}=e,x=O(e,["componentName","className","clientFallback","fallback","suppressHydrationWarning","_dynamic"]),m=j(n),s=m==null?void 0:m.component,d=E(n,x),c=Object.assign(Object.assign({"data-external-id":n},h(d)),{suppressHydrationWarning:!0,class:o});if(Object.keys(c).forEach(l=>{let i=c[l];if(i&&typeof i=="object"&&l!="class"&&l!="children")try{Object.assign(c,{[l]:JSON.stringify(i)})}catch(u){delete c[l]}}),!s&&r||!n)return t.createElement("feaas-external",Object.assign({},c,{hydrate:"false"}),r);if(s&&C(s)){let l="byoc-"+_(m.id);return t.createElement(l,Object.assign(Object.assign({},c),{ref:i=>{var u;i&&typeof window!="undefined"&&((u=window.customElements)===null||u===void 0||u.whenDefined(l).then(()=>{var p;(p=i.sitecoreContextCallback)===null||p===void 0||p.call(i,d)}))}}))}return t.createElement(t.Fragment,null,t.createElement("feaas-external",Object.assign({},c,{hydrate:"false"}),s==null?null:t.createElement(s,Object.assign({},d))))}export{S as Bundle,H as Component,w as NextComponent,v as RegularComponent,W 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.1.10",
+  "version": "0.1.11-alpha.1",
   "scripts": {
@@ -30,3 +30,3 @@ "test": "npx vitest",
   "module": "./dist/node/index.esm.js",
-  "types": "./types/react.d.ts",
+  "types": "./types/index.d.ts",
   "exports": {
@@ -33,0 +33,0 @@ ".": {

react.js

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

src/api.ts

@@ -25,3 +25,3 @@ import {
 
-export interface SitecoreProperites {
+export interface SitecoreContext {
   sitecoreEdgeContextId?: string,
@@ -376,4 +376,4 @@ sitecoreEdgeUrl?: string,
 
-export var contextProperties : SitecoreProperites = {};
-export function setContextProperties<T extends SitecoreProperites = SitecoreProperites>(props: T) {
+export var contextProperties : SitecoreContext = {};
+export function setContextProperties<T extends SitecoreContext = SitecoreContext>(props: T) {
   contextProperties = props;
@@ -380,0 +380,0 @@ }

types/api.d.ts

@@ -15,3 +15,3 @@ /// <reference types="@types/react" />
 }
-export interface SitecoreProperites {
+export interface SitecoreContext {
     sitecoreEdgeContextId?: string;
@@ -194,4 +194,4 @@ sitecoreEdgeUrl?: string;
 }
-export declare var contextProperties: SitecoreProperites;
-export declare function setContextProperties<T extends SitecoreProperites = SitecoreProperites>(props: T): void;
+export declare var contextProperties: SitecoreContext;
+export declare function setContextProperties<T extends SitecoreContext = SitecoreContext>(props: T): void;
 declare global {
@@ -198,0 +198,0 @@ namespace JSX {

types/react.d.ts

 /// <reference types="@types/react" />
 import React from 'react';
 export * from '@sitecore/byoc';
-export type ComponentProps = {
+export interface ComponentProps {
     componentName: string;
@@ -9,3 +9,3 @@ fallback?: any;
     [prop: string]: any;
-};
+}
 /**
@@ -12,0 +12,0 @@ * A special case of Component designed for Next.js.

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

Improved metrics

Total package byte prevSize

379426

increased by2.03%

Lines of code

1882

increased by1.29%

No dependency changes