web-component-wrapper 0.0.610 → 0.0.612
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ReactWeb.js +26 -57
- package/dist/Web.js +14 -33
- package/dist/bundle/ReactWeb.js +9162 -6481
- package/dist/bundle/Web.js +741 -723
- package/dist/bundle/compatible/ReactWeb.js +9149 -6464
- package/dist/bundle/compatible/Web.js +742 -724
- package/dist/bundle/compatible/decorator.js +713 -695
- package/dist/bundle/compatible/index.js +9965 -7268
- package/dist/bundle/decorator.js +712 -694
- package/dist/bundle/index.js +9975 -7270
- package/dist/compatible/ReactWeb.js +26 -57
- package/dist/compatible/Web.js +14 -33
- package/dist/compatible/decorator.js +8 -27
- package/dist/compatible/index.js +27 -57
- package/dist/decorator.js +8 -27
- package/dist/index.d.ts +2 -2
- package/dist/index.js +36 -56
- package/package.json +45 -45
- package/dist/bundle/compatible/test.js +0 -23123
- package/dist/bundle/compatible/type.js +0 -16
- package/dist/bundle/test.js +0 -23147
- package/dist/bundle/type.js +0 -16
- package/dist/compatible/test.js +0 -941
- package/dist/compatible/type.js +0 -16
- package/dist/test.js +0 -961
- package/dist/type.js +0 -16
package/dist/compatible/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
if(typeof window==='undefined'||window===null)var window=(typeof globalThis==='undefined'||globalThis===null)?{}:globalThis;import {
|
|
1
|
+
if(typeof window==='undefined'||window===null)var window=(typeof globalThis==='undefined'||globalThis===null)?{}:globalThis;import { Fragment as __WEBPACK_EXTERNAL_MODULE_react_Fragment__, createElement as __WEBPACK_EXTERNAL_MODULE_react_createElement__, createRef as __WEBPACK_EXTERNAL_MODULE_react_createRef__, default as __WEBPACK_EXTERNAL_MODULE_react_default__, forwardRef as __WEBPACK_EXTERNAL_MODULE_react_forwardRef__, memo as __WEBPACK_EXTERNAL_MODULE_react_memo__, useImperativeHandle as __WEBPACK_EXTERNAL_MODULE_react_useImperativeHandle__ } from "react";
|
|
2
|
+
import { flushSync as __WEBPACK_EXTERNAL_MODULE_react_dom_c0b5c364_flushSync__ } from "react-dom";
|
|
2
3
|
import { createRoot as __WEBPACK_EXTERNAL_MODULE_react_dom_client_82ef521c_createRoot__ } from "react-dom/client";
|
|
3
4
|
import * as __WEBPACK_EXTERNAL_MODULE_clientnode__ from "clientnode";
|
|
4
5
|
import * as __WEBPACK_EXTERNAL_MODULE_clientnode_property_types_4789ebe2__ from "clientnode/property-types";
|
|
5
|
-
import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
|
|
6
6
|
/******/ var __webpack_modules__ = ([
|
|
7
7
|
/* 0 */
|
|
8
8
|
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
|
@@ -276,14 +276,14 @@ try{this.isConnected=false}catch(_unused2){// Ignore error.
|
|
|
276
276
|
* @param domNode - Node to start traversing from.
|
|
277
277
|
* @param scope - Scope to render property value again.
|
|
278
278
|
*/},{key:"applyBinding",value:function applyBinding(domNode,scope){var _this6=this;if(!domNode.getAttributeNames)return;var _iterator4=_createForOfIteratorHelper(domNode.getAttributeNames()),_step4;try{var _loop2=function _loop2(){var attributeName=_step4.value;var name;if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name){var value=domNode.getAttribute(attributeName);if(value===null)return 0;// continue
|
|
279
|
-
if(name.startsWith("attribute-")||name.startsWith("property-")){var evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,scope,
|
|
279
|
+
if(name.startsWith("attribute-")||name.startsWith("property-")){var evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{scope:scope,binding:domNode});if(evaluated.error){log.warn("Error occurred during processing given","attribute binding \"".concat(attributeName,"\" on node:"),domNode,evaluated.error);return 0;// continue
|
|
280
280
|
}if(name.startsWith("attribute-"))domNode.setAttribute(name.substring("attribute-".length),evaluated.result);else/*
|
|
281
281
|
NOTE: Cast to "textContent" to have a writable
|
|
282
282
|
property here.
|
|
283
283
|
*/domNode[(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(name.substring("property-".length))]=evaluated.result}else if(name.startsWith("on-")){name=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(name.substring("on-".length));scope=_objectSpread({log:log,event:undefined,parameters:undefined},scope);/*
|
|
284
284
|
NOTE: We pre-compile event listener since they should
|
|
285
285
|
usually be called more often than binded.
|
|
286
|
-
*/var compilation=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(value,scope,true,
|
|
286
|
+
*/var compilation=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(value,{scope:scope,execute:true,binding:domNode});if(compilation.error)log.warn("Error occurred during compiling given event","binding \"".concat(attributeName,"\" on node:"),domNode,compilation.error);else _this6.addSecureEventListener(domNode,name,function(){for(var _len=arguments.length,parameters=new Array(_len),_key=0;_key<_len;_key++){parameters[_key]=arguments[_key]}scope.event=parameters[0];scope.parameters=parameters;try{compilation.templateFunction.apply(compilation,_toConsumableArray(compilation.originalScopeNames.map(function(name){return scope[name]})))}catch(error){log.warn("Error occurred during processing","given event binding","\"".concat(attributeName,"\" on node:"),domNode,"Given expression \"".concat(value,"\" could"),"not be evaluated with given scope","names \""+compilation.scopeNames.join("\", \"")+"\": ".concat((0,clientnode__WEBPACK_IMPORTED_MODULE_0__.represent)(error)))}})}}},_ret;for(_iterator4.s();!(_step4=_iterator4.n()).done;){_ret=_loop2();if(_ret===0)continue}}catch(err){_iterator4.e(err)}finally{_iterator4.f()}}/**
|
|
287
287
|
* Binds properties and event handler to given, sibling, and nested nodes.
|
|
288
288
|
* @param domNode - Node to start traversing from.
|
|
289
289
|
* @param scope - Scope to render property value again.
|
|
@@ -311,7 +311,7 @@ if(name.startsWith("attribute-")||name.startsWith("property-")){var evaluated=(0
|
|
|
311
311
|
*/},{key:"compileDomNodeTemplate",value:function compileDomNodeTemplate(domNode,scope,options){if(scope===void 0){scope=[]}if(options===void 0){options={}}options=_objectSpread({ignoreComponents:true,ignoreNestedComponents:true,unsafe:this.self.renderUnsafe},options);var nodeName=domNode.nodeName.toLowerCase();/*
|
|
312
312
|
NOTE: Slots of nested custom components (recognized by their dash
|
|
313
313
|
in name) should be rendered / controlled by them on their own.
|
|
314
|
-
*/if(options.ignoreComponents&&nodeName.includes("-"))return null;if(options.unsafe){var _template=domNode.innerHTML;if(!_template&&domNode.template)_template=domNode.template;if(this.self.hasCode(_template)){var _result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)("`".concat(_template,"`"),scope);return{domNode:domNode,children:[],error:_result.error,scopeNames:_result.scopeNames,template:_template,templateFunction:_result.templateFunction}}return null}var template=null;if(nodeName==="#text"){var content=domNode.textContent;if(content&&this.self.hasCode(content))template=content.replace(/ /g," ").trim()}var children=[];var result={children:children,domNode:domNode};if(template){var compilationResult=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)("`".concat(template,"`"),scope);result.error=compilationResult.error;result.scopeNames=compilationResult.scopeNames;result.template=template;result.templateFunction=compilationResult.templateFunction}// Compile content of each nested node.
|
|
314
|
+
*/if(options.ignoreComponents&&nodeName.includes("-"))return null;if(options.unsafe){var _template=domNode.innerHTML;if(!_template&&domNode.template)_template=domNode.template;if(this.self.hasCode(_template)){var _result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)("`".concat(_template,"`"),{scope:scope});return{domNode:domNode,children:[],error:_result.error,scopeNames:_result.scopeNames,template:_template,templateFunction:_result.templateFunction}}return null}var template=null;if(nodeName==="#text"){var content=domNode.textContent;if(content&&this.self.hasCode(content))template=content.replace(/ /g," ").trim()}var children=[];var result={children:children,domNode:domNode};if(template){var compilationResult=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)("`".concat(template,"`"),{scope:scope});result.error=compilationResult.error;result.scopeNames=compilationResult.scopeNames;result.template=template;result.templateFunction=compilationResult.templateFunction}// Compile content of each nested node.
|
|
315
315
|
var currentDomNode=domNode.firstChild;while(currentDomNode){if(!options.filter||options.filter(currentDomNode)){var _result2=this.compileDomNodeTemplate(currentDomNode,scope,_objectSpread(_objectSpread({},options),{},{ignoreComponents:options.ignoreNestedComponents}));if(_result2)children.push(_result2)}currentDomNode=currentDomNode.nextSibling}return result}/**
|
|
316
316
|
* @param options - Evaluation options.
|
|
317
317
|
* @param scope - Scope to evaluate against.
|
|
@@ -477,12 +477,12 @@ if(!handled&¶meters.length>0&&(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.isO
|
|
|
477
477
|
* and registers in a property mapping object.
|
|
478
478
|
* @param attributeName - Name of given value.
|
|
479
479
|
* @param value - Value to evaluate.
|
|
480
|
-
*/)},{key:"evaluateStringOrNullAndSetAsProperty",value:function evaluateStringOrNullAndSetAsProperty(attributeName,value){var _this11=this;var preEvaluate=attributeName.startsWith("-");var effectiveAttributeName=preEvaluate?attributeName.substring(1):attributeName;var name=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(effectiveAttributeName);var alias=this.getPropertyAlias(name);if(alias&&Object.prototype.hasOwnProperty.call(this.self.propertyTypes,alias))name=alias;if(Object.prototype.hasOwnProperty.call(this.self.propertyTypes,name)){var type=this.self.propertyTypes[name];if(preEvaluate){if(value){var result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,_objectSpread({},clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE),
|
|
480
|
+
*/)},{key:"evaluateStringOrNullAndSetAsProperty",value:function evaluateStringOrNullAndSetAsProperty(attributeName,value){var _this11=this;var preEvaluate=attributeName.startsWith("-");var effectiveAttributeName=preEvaluate?attributeName.substring(1):attributeName;var name=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(effectiveAttributeName);var alias=this.getPropertyAlias(name);if(alias&&Object.prototype.hasOwnProperty.call(this.self.propertyTypes,alias))name=alias;if(Object.prototype.hasOwnProperty.call(this.self.propertyTypes,name)){var type=this.self.propertyTypes[name];if(preEvaluate){if(value){var result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{scope:_objectSpread({},clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE),binding:this});if(result.error){log.warn("Failed to process pre-evaluation attribute","\"".concat(attributeName,"\": ").concat(result.error,". Will be"),"set to \"undefined\".");this.setInternalPropertyValue(name,undefined)}else{this.setInternalPropertyValue(name,result.result);this.setExternalPropertyValue(name,result.result)}}}else switch(type){case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.boolean:case"boolean":{var booleanValue=![null,"false"].includes(value);this.setInternalPropertyValue(name,booleanValue);this.setExternalPropertyValue(name,booleanValue);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.func:case"function":{var error=null;var templateFunction;var scopeNames=["data","event","firstArgument","firstParameter","options"];if(value){var _result3=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(value,{scope:scopeNames.concat("parameters","scope",clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE_NAMES),execute:true,binding:this});error=_result3.error;templateFunction=_result3.templateFunction;if(error)log.warn("Failed to compile given handler","\"".concat(attributeName,"\": ").concat(error,"."))}this.setInternalPropertyValue(name,function(){for(var _len4=arguments.length,parameters=new Array(_len4),_key4=0;_key4<_len4;_key4++){parameters[_key4]=arguments[_key4]}if(_this11.outputEventNames.has(name))void _this11.reflectEventToProperties(name,parameters);var result=undefined;if(!error){var scope=_objectSpread({parameters:parameters},clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE);for(var _i8=0,_scopeNames=scopeNames;_i8<_scopeNames.length;_i8++){var _name4=_scopeNames[_i8];scope[_name4]=parameters[0]}try{var _templateFunction;result=(_templateFunction=templateFunction)===null||_templateFunction===void 0?void 0:_templateFunction.apply(void 0,_toConsumableArray(scopeNames.map(function(name){return scope[name]})).concat([parameters,scope],_toConsumableArray(clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE_NAMES.map(function(name){return clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE[name]}))))}catch(error){log.warn("Failed to evaluate function","\"".concat(attributeName,"\" with expression"),"\"".concat(value,"\" and scope"),"variables","\"".concat(scopeNames.join("\", \""),"\" set to"),"\"".concat((0,clientnode__WEBPACK_IMPORTED_MODULE_0__.represent)(parameters),"\":"),"".concat(error,". Set property"),"to \"undefined\".")}}if(!_this11.self.renderProperties.includes(name))_this11.forwardEvent(name,parameters);return result});if(!error)this.setExternalPropertyValue(name,templateFunction);break}case"json":{if(value){var evaluated;try{evaluated=JSON.parse(value)}catch(error){log.warn("Error occurred during parsing given json","attribute \"".concat(attributeName,"\":"),(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.represent)(error));break}// NOTE: That both values do have to be avoided.
|
|
481
481
|
this.setInternalPropertyValue(name,evaluated);this.setExternalPropertyValue(name,(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.copy)(evaluated,false,1))}else{this.setInternalPropertyValue(name,null);this.setExternalPropertyValue(name,null)}break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.number:case"number":{if(value===null){this.setInternalPropertyValue(name,value);this.setExternalPropertyValue(name,value);break}/*
|
|
482
482
|
NOTE: You should not name this variable "number" since
|
|
483
483
|
babel gets confused caused by existing module wide
|
|
484
484
|
property type variable "number".
|
|
485
|
-
*/var numberValue=parseFloat(value);if(isNaN(numberValue))numberValue=undefined;this.setInternalPropertyValue(name,numberValue);this.setExternalPropertyValue(name,numberValue);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.string:case"string":{this.setInternalPropertyValue(name,value);this.setExternalPropertyValue(name,value);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.any:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.array:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.arrayOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.element:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.elementType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.instanceOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.node:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.object:case"object":case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.objectOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOfType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.shape:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.exact:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.symbol:default:{if(value){var _evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{}
|
|
485
|
+
*/var numberValue=parseFloat(value);if(isNaN(numberValue))numberValue=undefined;this.setInternalPropertyValue(name,numberValue);this.setExternalPropertyValue(name,numberValue);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.string:case"string":{this.setInternalPropertyValue(name,value);this.setExternalPropertyValue(name,value);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.any:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.array:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.arrayOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.element:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.elementType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.instanceOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.node:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.object:case"object":case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.objectOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOfType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.shape:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.exact:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.symbol:default:{if(value){var _evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{binding:this});if(_evaluated.error){log.warn("Error occurred during processing given","attribute configuration \"".concat(attributeName,"\":"),_evaluated.error);break}// NOTE: That both values do have to be avoided.
|
|
486
486
|
this.setInternalPropertyValue(name,_evaluated.result);this.setExternalPropertyValue(name,(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.copy)(_evaluated.result,false,1))}else if(this.hasAttribute(attributeName)){this.setInternalPropertyValue(name,true);this.setExternalPropertyValue(name,true)}else{this.setInternalPropertyValue(name,null);this.setExternalPropertyValue(name,null)}break}}}}/// endregion
|
|
487
487
|
/// region render
|
|
488
488
|
/**
|
|
@@ -520,7 +520,7 @@ this.setInternalPropertyValue(name,_evaluated.result);this.setExternalPropertyVa
|
|
|
520
520
|
* rendering process by their own.
|
|
521
521
|
* @returns A promise resolving when rendering has been finished. A promise
|
|
522
522
|
* may be needed for classes inheriting from this class.
|
|
523
|
-
*/},{key:"render",value:(function(){var _render=_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee5(reason,resolveRendering){var _this14=this;var evaluated,renderTargetDomNode;return _regenerator().w(function(_context5){while(1)switch(_context5.n){case 0:if(reason===void 0){reason="unknown"}if(resolveRendering===void 0){resolveRendering=true}this.unRender("reRender",reason);this.childComponentInstances=[];this.renderState.pending=true;if(!this.isRoot){_context5.n=3;break}_context5.n=1;return this.resolveRenderingPromiseIfSet(reason,resolveRendering);case 1:if(!resolveRendering){_context5.n=3;break}_context5.n=2;return Promise.all(this.self.pendingRenderPromises);case 2:this.self.pendingRenderPromises=[];case 3:this.self.pendingRenderPromises.push(this.renderState.promise);this.determineRenderScope();if(this.self.doRender&&this.dispatchEvent(new CustomEvent("render",{detail:{reason:reason,scope:this.scope}}))){_context5.n=5;break}_context5.n=4;return this.resolveRenderingPromiseIfSet(reason,resolveRendering);case 4:return _context5.a(2);case 5:evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)("`".concat(this.self.content,"`"),this.scope);if(!evaluated.error){_context5.n=7;break}log.warn("Failed to process template: ".concat(evaluated.error));this.renderState.resolve(reason);_context5.n=6;return Promise.all(this.self.pendingRenderPromises);case 6:return _context5.a(2);case 7:this.applyShadowRootIfNotExisting();/*
|
|
523
|
+
*/},{key:"render",value:(function(){var _render=_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee5(reason,resolveRendering){var _this14=this;var evaluated,renderTargetDomNode;return _regenerator().w(function(_context5){while(1)switch(_context5.n){case 0:if(reason===void 0){reason="unknown"}if(resolveRendering===void 0){resolveRendering=true}this.unRender("reRender",reason);this.childComponentInstances=[];this.renderState.pending=true;if(!this.isRoot){_context5.n=3;break}_context5.n=1;return this.resolveRenderingPromiseIfSet(reason,resolveRendering);case 1:if(!resolveRendering){_context5.n=3;break}_context5.n=2;return Promise.all(this.self.pendingRenderPromises);case 2:this.self.pendingRenderPromises=[];case 3:this.self.pendingRenderPromises.push(this.renderState.promise);this.determineRenderScope();if(this.self.doRender&&this.dispatchEvent(new CustomEvent("render",{detail:{reason:reason,scope:this.scope}}))){_context5.n=5;break}_context5.n=4;return this.resolveRenderingPromiseIfSet(reason,resolveRendering);case 4:return _context5.a(2);case 5:evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)("`".concat(this.self.content,"`"),{scope:this.scope});if(!evaluated.error){_context5.n=7;break}log.warn("Failed to process template: ".concat(evaluated.error));this.renderState.resolve(reason);_context5.n=6;return Promise.all(this.self.pendingRenderPromises);case 6:return _context5.a(2);case 7:this.applyShadowRootIfNotExisting();/*
|
|
524
524
|
NOTE: We first render into an intermediate render target and apply
|
|
525
525
|
slot content until we finally publish everything to the document.
|
|
526
526
|
This avoids painting twice and internetexplorer bugs with an empty
|
|
@@ -558,8 +558,8 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
558
558
|
var external_clientnode_ = __webpack_require__(0);
|
|
559
559
|
// EXTERNAL MODULE: external "clientnode/property-types"
|
|
560
560
|
var property_types_ = __webpack_require__(1);
|
|
561
|
-
|
|
562
|
-
|
|
561
|
+
;// external "react"
|
|
562
|
+
|
|
563
563
|
;// external "react-dom"
|
|
564
564
|
|
|
565
565
|
;// external "react-dom/client"
|
|
@@ -643,7 +643,7 @@ this.rootReactInstance=this;/*
|
|
|
643
643
|
render result (only necessary when having a dedicated rendering
|
|
644
644
|
target like shadow root and only on first render before React
|
|
645
645
|
takes over DOM management).
|
|
646
|
-
*/domNode=this.firstChild;while(domNode){nextDomNode=domNode.nextSibling;this.removeChild(domNode);domNode=nextDomNode}}if(!this.reactRoot){identifierPrefixCandidate=this.id||this.internalProperties.id||this.externalProperties.id||this.name||this.internalProperties.name||this.externalProperties.name;identifierPrefix="";if(typeof identifierPrefixCandidate==="string")identifierPrefix=identifierPrefixCandidate;this.reactRoot=__WEBPACK_EXTERNAL_MODULE_react_dom_client_82ef521c_createRoot__(this.hostDomNode,{identifierPrefix:identifierPrefix})}__WEBPACK_EXTERNAL_MODULE_react_dom_c0b5c364_flushSync__(function(){var _this2$reactRoot;(_this2$reactRoot=_this2.reactRoot)===null||_this2$reactRoot===void 0||_this2$reactRoot.render((
|
|
646
|
+
*/domNode=this.firstChild;while(domNode){nextDomNode=domNode.nextSibling;this.removeChild(domNode);domNode=nextDomNode}}if(!this.reactRoot){identifierPrefixCandidate=this.id||this.internalProperties.id||this.externalProperties.id||this.name||this.internalProperties.name||this.externalProperties.name;identifierPrefix="";if(typeof identifierPrefixCandidate==="string")identifierPrefix=identifierPrefixCandidate;this.reactRoot=__WEBPACK_EXTERNAL_MODULE_react_dom_client_82ef521c_createRoot__(this.hostDomNode,{identifierPrefix:identifierPrefix})}__WEBPACK_EXTERNAL_MODULE_react_dom_c0b5c364_flushSync__(function(){var _this2$reactRoot;(_this2$reactRoot=_this2.reactRoot)===null||_this2$reactRoot===void 0||_this2$reactRoot.render(__WEBPACK_EXTERNAL_MODULE_react_createElement__(_this2.self.content,_this2.internalProperties));void _this2.resolveRenderingPromiseIfSet(reason,resolveRendering)});if(!resolveRendering){_context.n=2;break}_context.n=2;return this.renderState.promise;case 2:return _context.a(2)}},_callee,this)}));function render(_x,_x2){return _render.apply(this,arguments)}return render}()// endregion
|
|
647
647
|
// region property handling
|
|
648
648
|
/**
|
|
649
649
|
* Generic property setter. Forwards field writes into internal and
|
|
@@ -686,7 +686,7 @@ this.rootReactInstance=this;/*
|
|
|
686
686
|
* variable name.
|
|
687
687
|
* @returns Transformed react elements.
|
|
688
688
|
*/},{key:"preCompileDomNodes",value:function preCompileDomNodes(domNodes,scope,isFunction){if(scope===void 0){scope={}}if(isFunction===void 0){isFunction=false}// NOTE: We ignore empty text nodes (like React's jsx does).
|
|
689
|
-
domNodes=domNodes.filter(function(domNode){return domNode.nodeType!==Node.TEXT_NODE||typeof domNode.nodeValue==="string"&&domNode.nodeValue.trim()!==""});if(domNodes.length===1)return this.preCompileDomNode(domNodes[0],scope,isFunction);var index=1;var result=[];var _iterator=_createForOfIteratorHelper(domNodes),_step;try{for(_iterator.s();!(_step=_iterator.n()).done;){var node=_step.value;var element=this.preCompileDomNode(node,scope,isFunction,index.toString());result.push(element);index+=1}}catch(err){_iterator.e(err)}finally{_iterator.f()}if(isFunction)return function(scope){return function(){var renderResult=[];var _iterator2=_createForOfIteratorHelper(result),_step2;try{for(_iterator2.s();!(_step2=_iterator2.n()).done;){var factory=_step2.value;var renderItem=factory(scope);if(typeof renderItem==="function")renderResult.push(renderItem.apply(void 0,arguments))}}catch(err){_iterator2.e(err)}finally{_iterator2.f()}return (
|
|
689
|
+
domNodes=domNodes.filter(function(domNode){return domNode.nodeType!==Node.TEXT_NODE||typeof domNode.nodeValue==="string"&&domNode.nodeValue.trim()!==""});if(domNodes.length===1)return this.preCompileDomNode(domNodes[0],scope,isFunction);var index=1;var result=[];var _iterator=_createForOfIteratorHelper(domNodes),_step;try{for(_iterator.s();!(_step=_iterator.n()).done;){var node=_step.value;var element=this.preCompileDomNode(node,scope,isFunction,index.toString());result.push(element);index+=1}}catch(err){_iterator.e(err)}finally{_iterator.f()}if(isFunction)return function(scope){return function(){var renderResult=[];var _iterator2=_createForOfIteratorHelper(result),_step2;try{for(_iterator2.s();!(_step2=_iterator2.n()).done;){var factory=_step2.value;var renderItem=factory(scope);if(typeof renderItem==="function")renderResult.push(renderItem.apply(void 0,arguments))}}catch(err){_iterator2.e(err)}finally{_iterator2.f()}return __WEBPACK_EXTERNAL_MODULE_react_createElement__(__WEBPACK_EXTERNAL_MODULE_react_Fragment__,{children:renderResult})}};return result}/**
|
|
690
690
|
* Converts a given html dom node into a react-element.
|
|
691
691
|
* @param domNode - Node to convert.
|
|
692
692
|
* @param scope - Additional scope to render subcomponents against.
|
|
@@ -697,7 +697,7 @@ domNodes=domNodes.filter(function(domNode){return domNode.nodeType!==Node.TEXT_N
|
|
|
697
697
|
*/},{key:"preCompileDomNode",value:function preCompileDomNode(domNode,scope,isFunction,key){var _this3=this;if(scope===void 0){scope={}}if(isFunction===void 0){isFunction=false}// region render property
|
|
698
698
|
if(isFunction){var node=this.preCompileDomNode(domNode,_objectSpread(_objectSpread({},scope),{},{data:undefined,firstArgument:undefined,firstParameter:undefined,options:undefined,scope:undefined,parameters:undefined}),false,key);return function(scope){return function(){for(var _len2=arguments.length,parameters=new Array(_len2),_key2=0;_key2<_len2;_key2++){parameters[_key2]=arguments[_key2]}var firstArgument=parameters.length>0?parameters[0]:null;return node(_objectSpread(_objectSpread({},scope),{},{data:firstArgument,firstArgument:firstArgument,firstParameter:firstArgument,options:firstArgument,scope:firstArgument,parameters:parameters}))}}}// endregion
|
|
699
699
|
// region text node
|
|
700
|
-
if(domNode.nodeType===Node.TEXT_NODE){var value=typeof domNode.nodeValue==="string"?domNode.nodeValue.trim():"";var result=key&&value?(
|
|
700
|
+
if(domNode.nodeType===Node.TEXT_NODE){var value=typeof domNode.nodeValue==="string"?domNode.nodeValue.trim():"";var result=key&&value?__WEBPACK_EXTERNAL_MODULE_react_createElement__(__WEBPACK_EXTERNAL_MODULE_react_Fragment__,{children:value,key:key}):value?value:null;return function(){return result}}// endregion
|
|
701
701
|
if(!domNode.getAttributeNames)return function(){return null};// region native elements and wrapped react components
|
|
702
702
|
/// region prepare type and static properties
|
|
703
703
|
var staticProperties={};var target;var isComponent=this.self.isReactComponent(domNode);if(isComponent){// region pre-compile nested render context
|
|
@@ -709,11 +709,11 @@ domNode.determineRenderScope();if(Object.keys(this.compiledSlots).length===0)dom
|
|
|
709
709
|
*/if(key&&!Object.prototype.hasOwnProperty.call(staticProperties,"key"))staticProperties.key=key;target=domNode.constructor.content}else{staticProperties.key=key;target=domNode.tagName.toLowerCase()}/// endregion
|
|
710
710
|
/// region pre-compile dynamic properties
|
|
711
711
|
var knownScopeNames=Object.keys(scope);var compiledProperties={};var _iterator3=_createForOfIteratorHelper(domNode.getAttributeNames()),_step3;try{var _loop=function _loop(){var _value3;var attributeName=_step3.value;var _value2=domNode.getAttribute(attributeName);if(_value2===null)return 0;// continue
|
|
712
|
-
var extend=false;var name="";if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name.startsWith("attribute-")||name==="attributes"||name.startsWith("property-")||name==="properties"){var _compile=(0,external_clientnode_.compile)(_value2,knownScopeNames),error=_compile.error,originalScopeNames=_compile.originalScopeNames,templateFunction=_compile.templateFunction;if(error){log.warn("Error occurred during compiling given attribute","binding \"".concat(attributeName,"\" on node:"),domNode,error);return 0;// continue
|
|
712
|
+
var extend=false;var name="";if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name.startsWith("attribute-")||name==="attributes"||name.startsWith("property-")||name==="properties"){var _compile=(0,external_clientnode_.compile)(_value2,{scope:knownScopeNames}),error=_compile.error,originalScopeNames=_compile.originalScopeNames,templateFunction=_compile.templateFunction;if(error){log.warn("Error occurred during compiling given attribute","binding \"".concat(attributeName,"\" on node:"),domNode,error);return 0;// continue
|
|
713
713
|
}if(name==="attributes"||name==="properties")extend=true;else name=name.startsWith("attribute-")?name.substring("attribute-".length):name.substring("property-".length);_value2={originalScopeNames:originalScopeNames,templateFunction:templateFunction.bind(_this3)}}else if(name.startsWith("on-")){name=(0,external_clientnode_.delimitedToCamelCase)(name);if(!Object.prototype.hasOwnProperty.call(scope,"event"))knownScopeNames=[].concat(_toConsumableArray(knownScopeNames),["event"]);if(!Object.prototype.hasOwnProperty.call(scope,"parameters"))knownScopeNames=[].concat(_toConsumableArray(knownScopeNames),["parameters"]);/*
|
|
714
714
|
NOTE: We pre-compile event listener since they should
|
|
715
715
|
usually be called more than it would be re-rendered.
|
|
716
|
-
*/var _compile2=(0,external_clientnode_.compile)(_value2,knownScopeNames,true),_error=_compile2.error,_originalScopeNames=_compile2.originalScopeNames,scopeNames=_compile2.scopeNames,_templateFunction=_compile2.templateFunction;if(_error){log.warn("Error occurred during compiling given event","binding \"".concat(attributeName,"\" on node:"),domNode,_error);return 0;// continue
|
|
716
|
+
*/var _compile2=(0,external_clientnode_.compile)(_value2,{scope:knownScopeNames,execute:true}),_error=_compile2.error,_originalScopeNames=_compile2.originalScopeNames,scopeNames=_compile2.scopeNames,_templateFunction=_compile2.templateFunction;if(_error){log.warn("Error occurred during compiling given event","binding \"".concat(attributeName,"\" on node:"),domNode,_error);return 0;// continue
|
|
717
717
|
}var eventHandler=_templateFunction.bind(_this3);_value2=function value(){for(var _len3=arguments.length,parameters=new Array(_len3),_key3=0;_key3<_len3;_key3++){parameters[_key3]=arguments[_key3]}scope.event=parameters[0];scope.parameters=parameters;try{eventHandler.apply(void 0,_toConsumableArray(_originalScopeNames.map(function(name){return scope[name]})))}catch(error){log.warn("Error occurred during processing given","event binding \"".concat(attributeName,"\" on node: "),domNode,"Given expression \"".concat(_value2,"\" could"),"not be evaluated with given scope names","\"".concat(scopeNames.join("\", \""),"\":"),(0,external_clientnode_.represent)(error))}}}else name=attributeName;var mapping={class:"className",for:"htmlFor"};if(Object.prototype.hasOwnProperty.call(mapping,name))name=mapping[name];name=(0,external_clientnode_.delimitedToCamelCase)(name);if((_value3=_value2)!==null&&_value3!==void 0&&_value3.originalScopeNames)// NOTE: "''" marks a property set like in JSX "{...props}".
|
|
718
718
|
compiledProperties[extend?"":name]=_value2;else if(!isComponent)/*
|
|
719
719
|
NOTE: Properties of components are evaluated already by
|
|
@@ -738,7 +738,7 @@ if(Object.prototype.hasOwnProperty.call(properties,"innerHTML")){properties.dang
|
|
|
738
738
|
scope, should be marked via the "bind-property-" prefix.
|
|
739
739
|
*/properties=_objectSpread(_objectSpread({},domNode.internalProperties),properties);runtimeScope=_objectSpread(_objectSpread(_objectSpread({},properties),runtimeScope),{},{parentInstance:domNode});domNode.evaluateSlots(runtimeScope);domNode.prepareProperties(properties);// endregion
|
|
740
740
|
}else if(properties.children)properties.children=_this3.evaluatePreCompiledDomNodes(properties.children,runtimeScope);// endregion
|
|
741
|
-
return (
|
|
741
|
+
return __WEBPACK_EXTERNAL_MODULE_react_createElement__(target,properties)};/// endregion
|
|
742
742
|
// endregion
|
|
743
743
|
}/**
|
|
744
744
|
* Evaluates given pre-compiled nodes into a single react element or a
|
|
@@ -763,7 +763,7 @@ return (0,external_react_.createElement)(target,properties)};/// endregion
|
|
|
763
763
|
*/function determineRootBinding(){_superPropGet(ReactWeb,"determineRootBinding",this,3)([]);var currentElement=this.parentNode;while(currentElement){if(this.self.isReactComponent(currentElement)){this.rootReactInstance=currentElement;break}currentElement=currentElement.parentNode}}/**
|
|
764
764
|
* Applies missing forward ref and or memorizing wrapper to a current react
|
|
765
765
|
* component.
|
|
766
|
-
*/},{key:"applyComponentWrapper",value:function applyComponentWrapper(){if(typeof this.self.content==="string"||this.isWrapped)return;this.isWrapped=true;var wrapped=this.self.content.wrapped||this.self.content;if(this.self.content.webComponentAdapterWrapped){if(this.wrapMemorizingWrapper){this.self.content=(
|
|
766
|
+
*/},{key:"applyComponentWrapper",value:function applyComponentWrapper(){if(typeof this.self.content==="string"||this.isWrapped)return;this.isWrapped=true;var wrapped=this.self.content.wrapped||this.self.content;if(this.self.content.webComponentAdapterWrapped){if(this.wrapMemorizingWrapper){this.self.content=__WEBPACK_EXTERNAL_MODULE_react_memo__(this.self.content);this.self.content.wrapped=wrapped}}else if(this.self.attachWebComponentAdapterIfNotExists){if(!this.self.content.displayName)this.self.content.displayName=this.self._name;this.self.content=__WEBPACK_EXTERNAL_MODULE_react_forwardRef__(function(properties,reference){__WEBPACK_EXTERNAL_MODULE_react_useImperativeHandle__(reference,function(){return{properties:properties}},[properties]);return __WEBPACK_EXTERNAL_MODULE_react_createElement__(wrapped,properties)});if(this.wrapMemorizingWrapper||this.wrapMemorizingWrapper===null)this.self.content=__WEBPACK_EXTERNAL_MODULE_react_memo__(this.self.content);this.self.content.wrapped=wrapped;this.self.content.webComponentAdapterWrapped="react"}else if(this.wrapMemorizingWrapper){this.self.content=__WEBPACK_EXTERNAL_MODULE_react_memo__(this.self.content);this.self.content.wrapped=wrapped}}/**
|
|
767
767
|
* Prepares a given properties object to render against the current
|
|
768
768
|
* component. Creates a reference for being recognized of reacts internal
|
|
769
769
|
* state updates.
|
|
@@ -771,25 +771,14 @@ return (0,external_react_.createElement)(target,properties)};/// endregion
|
|
|
771
771
|
*/},{key:"prepareProperties",value:function prepareProperties(properties){var _this4=this;(0,external_clientnode_.extend)(properties,this.preparedSlots);this.self.removeKnownUnwantedPropertyKeys(this.self,properties);/*
|
|
772
772
|
NOTE: Provide instance if and only if not explicitly requested from
|
|
773
773
|
parent via properties.
|
|
774
|
-
*/if(!properties.ref){this.instance=(
|
|
774
|
+
*/if(!properties.ref){this.instance=__WEBPACK_EXTERNAL_MODULE_react_createRef__();properties.ref=function(reference){if(_this4.instance)_this4.instance.current=reference;else _this4.instance={current:reference};_this4.reflectInstanceProperties()}}}}],[{key:"isReactComponent",value:function isReactComponent(domNode){var type=domNode.constructor;return _typeof(type.content)==="object"&&(!type.attachWebComponentAdapterIfNotExists||type.content.webComponentAdapterWrapped==="react")}},{key:"removeKnownUnwantedPropertyKeys",value:/**
|
|
775
775
|
* Removes unwanted known and not specified properties from a given
|
|
776
776
|
* properties object (usually added by dev-tools).
|
|
777
777
|
* @param target - ReactElement where properties belong to.
|
|
778
778
|
* @param properties - Properties object to trim.
|
|
779
779
|
*/function removeKnownUnwantedPropertyKeys(target,properties){if(typeof target.content==="string")return;// NOTE: Known root of errors caused by browser dev-tools.
|
|
780
780
|
var _iterator5=_createForOfIteratorHelper(["isRoot","isTrusted","__composed"]),_step5;try{for(_iterator5.s();!(_step5=_iterator5.n()).done;){var name=_step5.value;if(Object.prototype.hasOwnProperty.call(properties,name)&&(Object.prototype.hasOwnProperty.call(target.content,"propTypes")&&!Object.prototype.hasOwnProperty.call(target.content.propTypes,name)||Object.prototype.hasOwnProperty.call(target.content,"wrapped")&&Object.prototype.hasOwnProperty.call(target.content.wrapped,"propTypes")&&!Object.prototype.hasOwnProperty.call(target.content.wrapped.propTypes,name)))delete properties[name]}}catch(err){_iterator5.e(err)}finally{_iterator5.f()}}// endregion
|
|
781
|
-
}])}(Web/* default */.Ay);_defineProperty(ReactWeb,"attachWebComponentAdapterIfNotExists",true);_defineProperty(ReactWeb,"content","div");_defineProperty(ReactWeb,"react",
|
|
782
|
-
|
|
783
|
-
/***/ }),
|
|
784
|
-
/* 5 */,
|
|
785
|
-
/* 6 */
|
|
786
|
-
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
|
787
|
-
|
|
788
|
-
var x = function(y) {
|
|
789
|
-
var x = {}; __webpack_require__.d(x, y); return x
|
|
790
|
-
}
|
|
791
|
-
var y = function(x) { return function() { return x; }; }
|
|
792
|
-
module.exports = x({ ["Fragment"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__.Fragment; }, ["createElement"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__.createElement; }, ["createRef"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__.createRef; }, ["default"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__["default"]; }, ["forwardRef"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__.forwardRef; }, ["memo"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__.memo; }, ["useImperativeHandle"]: function() { return __WEBPACK_EXTERNAL_MODULE_react__.useImperativeHandle; } });
|
|
781
|
+
}])}(Web/* default */.Ay);_defineProperty(ReactWeb,"attachWebComponentAdapterIfNotExists",true);_defineProperty(ReactWeb,"content","div");_defineProperty(ReactWeb,"react",__WEBPACK_EXTERNAL_MODULE_react_default__);_defineProperty(ReactWeb,"_name","ReactWebComponent");var api={component:ReactWeb,register:function register(tagName){if(tagName===void 0){tagName=(0,external_clientnode_.camelCaseToDelimited)(ReactWeb._name)}customElements.define(tagName,ReactWeb)}};/* harmony default export */ var src_ReactWeb = (ReactWeb);
|
|
793
782
|
|
|
794
783
|
/***/ })
|
|
795
784
|
/******/ ]);
|
|
@@ -820,36 +809,17 @@ module.exports = x({ ["Fragment"]: function() { return __WEBPACK_EXTERNAL_MODULE
|
|
|
820
809
|
/******/
|
|
821
810
|
/************************************************************************/
|
|
822
811
|
/******/ /* webpack/runtime/define property getters */
|
|
823
|
-
/******/
|
|
824
|
-
/******/
|
|
825
|
-
/******/
|
|
826
|
-
/******/ if(
|
|
827
|
-
/******/
|
|
828
|
-
/******/ while(i < definition.length) {
|
|
829
|
-
/******/ var key = definition[i++];
|
|
830
|
-
/******/ var binding = definition[i++];
|
|
831
|
-
/******/ if(!__webpack_require__.o(exports, key)) {
|
|
832
|
-
/******/ if(binding === 0) {
|
|
833
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, value: definition[i++] });
|
|
834
|
-
/******/ } else {
|
|
835
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, get: binding });
|
|
836
|
-
/******/ }
|
|
837
|
-
/******/ } else if(binding === 0) { i++; }
|
|
838
|
-
/******/ }
|
|
839
|
-
/******/ } else {
|
|
840
|
-
/******/ for(var key in definition) {
|
|
841
|
-
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
842
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
843
|
-
/******/ }
|
|
844
|
-
/******/ }
|
|
812
|
+
/******/ // define getter/value functions for harmony exports
|
|
813
|
+
/******/ __webpack_require__.d = function(exports, definition) {
|
|
814
|
+
/******/ for(var key in definition) {
|
|
815
|
+
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
816
|
+
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
845
817
|
/******/ }
|
|
846
|
-
/******/ }
|
|
847
|
-
/******/ }
|
|
818
|
+
/******/ }
|
|
819
|
+
/******/ };
|
|
848
820
|
/******/
|
|
849
821
|
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
850
|
-
/******/
|
|
851
|
-
/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
|
|
852
|
-
/******/ }();
|
|
822
|
+
/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); };
|
|
853
823
|
/******/
|
|
854
824
|
/************************************************************************/
|
|
855
825
|
var __webpack_exports__ = {};
|
package/dist/decorator.js
CHANGED
|
@@ -49,36 +49,17 @@ module.exports = x({ ["string"]: () => (__WEBPACK_EXTERNAL_MODULE_clientnode_pro
|
|
|
49
49
|
/******/
|
|
50
50
|
/************************************************************************/
|
|
51
51
|
/******/ /* webpack/runtime/define property getters */
|
|
52
|
-
/******/
|
|
53
|
-
/******/
|
|
54
|
-
/******/
|
|
55
|
-
/******/ if(
|
|
56
|
-
/******/
|
|
57
|
-
/******/ while(i < definition.length) {
|
|
58
|
-
/******/ var key = definition[i++];
|
|
59
|
-
/******/ var binding = definition[i++];
|
|
60
|
-
/******/ if(!__webpack_require__.o(exports, key)) {
|
|
61
|
-
/******/ if(binding === 0) {
|
|
62
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, value: definition[i++] });
|
|
63
|
-
/******/ } else {
|
|
64
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, get: binding });
|
|
65
|
-
/******/ }
|
|
66
|
-
/******/ } else if(binding === 0) { i++; }
|
|
67
|
-
/******/ }
|
|
68
|
-
/******/ } else {
|
|
69
|
-
/******/ for(var key in definition) {
|
|
70
|
-
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
71
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
72
|
-
/******/ }
|
|
73
|
-
/******/ }
|
|
52
|
+
/******/ // define getter/value functions for harmony exports
|
|
53
|
+
/******/ __webpack_require__.d = (exports, definition) => {
|
|
54
|
+
/******/ for(var key in definition) {
|
|
55
|
+
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
56
|
+
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
74
57
|
/******/ }
|
|
75
|
-
/******/ }
|
|
76
|
-
/******/ }
|
|
58
|
+
/******/ }
|
|
59
|
+
/******/ };
|
|
77
60
|
/******/
|
|
78
61
|
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
79
|
-
/******/ (
|
|
80
|
-
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
|
|
81
|
-
/******/ })();
|
|
62
|
+
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop));
|
|
82
63
|
/******/
|
|
83
64
|
/************************************************************************/
|
|
84
65
|
let __webpack_exports__ = {};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { Mapping } from 'clientnode';
|
|
1
|
+
import type { Mapping } from 'clientnode';
|
|
2
|
+
import type { ComponentType, WebComponentAPI, WebComponentConfiguration } from './type';
|
|
2
3
|
import propertyImport from './decorator';
|
|
3
4
|
import ReactWebImport from './ReactWeb';
|
|
4
5
|
import WebImport from './Web';
|
|
5
|
-
import { ComponentType, WebComponentAPI, WebComponentConfiguration } from './type';
|
|
6
6
|
export declare const property: typeof propertyImport;
|
|
7
7
|
export declare const ReactWeb: typeof ReactWebImport;
|
|
8
8
|
export declare const reactWebAPI: WebComponentAPI<HTMLElement, Mapping<unknown>, import("./type").ReactComponentBaseProperties, typeof ReactWebImport>;
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
if(typeof window==='undefined'||window===null)var window=(typeof globalThis==='undefined'||globalThis===null)?{}:globalThis;import {
|
|
1
|
+
if(typeof window==='undefined'||window===null)var window=(typeof globalThis==='undefined'||globalThis===null)?{}:globalThis;import { Fragment as __WEBPACK_EXTERNAL_MODULE_react_Fragment__, createElement as __WEBPACK_EXTERNAL_MODULE_react_createElement__, createRef as __WEBPACK_EXTERNAL_MODULE_react_createRef__, default as __WEBPACK_EXTERNAL_MODULE_react_default__, forwardRef as __WEBPACK_EXTERNAL_MODULE_react_forwardRef__, memo as __WEBPACK_EXTERNAL_MODULE_react_memo__, useImperativeHandle as __WEBPACK_EXTERNAL_MODULE_react_useImperativeHandle__ } from "react";
|
|
2
|
+
import { flushSync as __WEBPACK_EXTERNAL_MODULE_react_dom_c0b5c364_flushSync__ } from "react-dom";
|
|
2
3
|
import { createRoot as __WEBPACK_EXTERNAL_MODULE_react_dom_client_82ef521c_createRoot__ } from "react-dom/client";
|
|
3
4
|
import * as __WEBPACK_EXTERNAL_MODULE_clientnode__ from "clientnode";
|
|
4
5
|
import * as __WEBPACK_EXTERNAL_MODULE_clientnode_property_types_4789ebe2__ from "clientnode/property-types";
|
|
5
|
-
import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
|
|
6
6
|
/******/ var __webpack_modules__ = ([
|
|
7
7
|
/* 0 */
|
|
8
8
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
@@ -279,13 +279,13 @@ try{this.isConnected=false}catch{// Ignore error.
|
|
|
279
279
|
* Binds properties and event handler to the given dom node.
|
|
280
280
|
* @param domNode - Node to start traversing from.
|
|
281
281
|
* @param scope - Scope to render property value again.
|
|
282
|
-
*/applyBinding(domNode,scope){if(!domNode.getAttributeNames)return;for(const attributeName of domNode.getAttributeNames()){let name;if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name){const value=domNode.getAttribute(attributeName);if(value===null)continue;if(name.startsWith("attribute-")||name.startsWith("property-")){const evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,scope,
|
|
282
|
+
*/applyBinding(domNode,scope){if(!domNode.getAttributeNames)return;for(const attributeName of domNode.getAttributeNames()){let name;if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name){const value=domNode.getAttribute(attributeName);if(value===null)continue;if(name.startsWith("attribute-")||name.startsWith("property-")){const evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{scope,binding:domNode});if(evaluated.error){log.warn("Error occurred during processing given",`attribute binding "${attributeName}" on node:`,domNode,evaluated.error);continue}if(name.startsWith("attribute-"))domNode.setAttribute(name.substring("attribute-".length),evaluated.result);else/*
|
|
283
283
|
NOTE: Cast to "textContent" to have a writable
|
|
284
284
|
property here.
|
|
285
285
|
*/domNode[(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(name.substring("property-".length))]=evaluated.result}else if(name.startsWith("on-")){name=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(name.substring("on-".length));scope={log,event:undefined,parameters:undefined,...scope};/*
|
|
286
286
|
NOTE: We pre-compile event listener since they should
|
|
287
287
|
usually be called more often than binded.
|
|
288
|
-
*/const compilation=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(value,scope,true,
|
|
288
|
+
*/const compilation=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(value,{scope,execute:true,binding:domNode});if(compilation.error)log.warn("Error occurred during compiling given event",`binding "${attributeName}" on node:`,domNode,compilation.error);else this.addSecureEventListener(domNode,name,(...parameters)=>{scope.event=parameters[0];scope.parameters=parameters;try{compilation.templateFunction(/*
|
|
289
289
|
NOTE: We want to be sure to have
|
|
290
290
|
the same ordering as we have for
|
|
291
291
|
the scope names and to call
|
|
@@ -321,7 +321,7 @@ try{this.isConnected=false}catch{// Ignore error.
|
|
|
321
321
|
*/compileDomNodeTemplate(domNode,scope=[],options={}){options={ignoreComponents:true,ignoreNestedComponents:true,unsafe:this.self.renderUnsafe,...options};const nodeName=domNode.nodeName.toLowerCase();/*
|
|
322
322
|
NOTE: Slots of nested custom components (recognized by their dash
|
|
323
323
|
in name) should be rendered / controlled by them on their own.
|
|
324
|
-
*/if(options.ignoreComponents&&nodeName.includes("-"))return null;if(options.unsafe){let template=domNode.innerHTML;if(!template&&domNode.template)template=domNode.template;if(this.self.hasCode(template)){const result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(`\`${template}\``,scope);return{domNode,children:[],error:result.error,scopeNames:result.scopeNames,template,templateFunction:result.templateFunction}}return null}let template=null;if(nodeName==="#text"){const content=domNode.textContent;if(content&&this.self.hasCode(content))template=content.replace(/ /g," ").trim()}const children=[];const result={children,domNode};if(template){const compilationResult=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(`\`${template}\``,scope);result.error=compilationResult.error;result.scopeNames=compilationResult.scopeNames;result.template=template;result.templateFunction=compilationResult.templateFunction}// Compile content of each nested node.
|
|
324
|
+
*/if(options.ignoreComponents&&nodeName.includes("-"))return null;if(options.unsafe){let template=domNode.innerHTML;if(!template&&domNode.template)template=domNode.template;if(this.self.hasCode(template)){const result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(`\`${template}\``,{scope});return{domNode,children:[],error:result.error,scopeNames:result.scopeNames,template,templateFunction:result.templateFunction}}return null}let template=null;if(nodeName==="#text"){const content=domNode.textContent;if(content&&this.self.hasCode(content))template=content.replace(/ /g," ").trim()}const children=[];const result={children,domNode};if(template){const compilationResult=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(`\`${template}\``,{scope});result.error=compilationResult.error;result.scopeNames=compilationResult.scopeNames;result.template=template;result.templateFunction=compilationResult.templateFunction}// Compile content of each nested node.
|
|
325
325
|
let currentDomNode=domNode.firstChild;while(currentDomNode){if(!options.filter||options.filter(currentDomNode)){const result=this.compileDomNodeTemplate(currentDomNode,scope,{...options,ignoreComponents:options.ignoreNestedComponents});if(result)children.push(result)}currentDomNode=currentDomNode.nextSibling}return result}/**
|
|
326
326
|
* @param options - Evaluation options.
|
|
327
327
|
* @param scope - Scope to evaluate against.
|
|
@@ -492,12 +492,12 @@ if(!handled&¶meters.length>0&&(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.isO
|
|
|
492
492
|
* and registers in a property mapping object.
|
|
493
493
|
* @param attributeName - Name of given value.
|
|
494
494
|
* @param value - Value to evaluate.
|
|
495
|
-
*/evaluateStringOrNullAndSetAsProperty(attributeName,value){const preEvaluate=attributeName.startsWith("-");const effectiveAttributeName=preEvaluate?attributeName.substring(1):attributeName;let name=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(effectiveAttributeName);const alias=this.getPropertyAlias(name);if(alias&&Object.prototype.hasOwnProperty.call(this.self.propertyTypes,alias))name=alias;if(Object.prototype.hasOwnProperty.call(this.self.propertyTypes,name)){const type=this.self.propertyTypes[name];if(preEvaluate){if(value){const result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{...clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE},
|
|
495
|
+
*/evaluateStringOrNullAndSetAsProperty(attributeName,value){const preEvaluate=attributeName.startsWith("-");const effectiveAttributeName=preEvaluate?attributeName.substring(1):attributeName;let name=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.delimitedToCamelCase)(effectiveAttributeName);const alias=this.getPropertyAlias(name);if(alias&&Object.prototype.hasOwnProperty.call(this.self.propertyTypes,alias))name=alias;if(Object.prototype.hasOwnProperty.call(this.self.propertyTypes,name)){const type=this.self.propertyTypes[name];if(preEvaluate){if(value){const result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{scope:{...clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE},binding:this});if(result.error){log.warn(`Failed to process pre-evaluation attribute`,`"${attributeName}": ${result.error}. Will be`,"set to \"undefined\".");this.setInternalPropertyValue(name,undefined)}else{this.setInternalPropertyValue(name,result.result);this.setExternalPropertyValue(name,result.result)}}}else switch(type){case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.boolean:case"boolean":{const booleanValue=![null,"false"].includes(value);this.setInternalPropertyValue(name,booleanValue);this.setExternalPropertyValue(name,booleanValue);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.func:case"function":{let error=null;let templateFunction;const scopeNames=["data","event","firstArgument","firstParameter","options"];if(value){const result=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.compile)(value,{scope:scopeNames.concat("parameters","scope",clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE_NAMES),execute:true,binding:this});error=result.error;templateFunction=result.templateFunction;if(error)log.warn("Failed to compile given handler",`"${attributeName}": ${error}.`)}this.setInternalPropertyValue(name,(...parameters)=>{if(this.outputEventNames.has(name))void this.reflectEventToProperties(name,parameters);let result=undefined;if(!error){const scope={parameters,...clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE};for(const name of scopeNames)scope[name]=parameters[0];try{result=templateFunction?.(...scopeNames.map(name=>scope[name]),parameters,scope,...clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE_NAMES.map(name=>clientnode__WEBPACK_IMPORTED_MODULE_0__.UTILITY_SCOPE[name]))}catch(error){log.warn("Failed to evaluate function",`"${attributeName}" with expression`,`"${value}" and scope`,"variables",`"${scopeNames.join("\", \"")}" set to`,`"${(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.represent)(parameters)}":`,`${error}. Set property`,`to "undefined".`)}}if(!this.self.renderProperties.includes(name))this.forwardEvent(name,parameters);return result});if(!error)this.setExternalPropertyValue(name,templateFunction);break}case"json":{if(value){let evaluated;try{evaluated=JSON.parse(value)}catch(error){log.warn("Error occurred during parsing given json",`attribute "${attributeName}":`,(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.represent)(error));break}// NOTE: That both values do have to be avoided.
|
|
496
496
|
this.setInternalPropertyValue(name,evaluated);this.setExternalPropertyValue(name,(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.copy)(evaluated,false,1))}else{this.setInternalPropertyValue(name,null);this.setExternalPropertyValue(name,null)}break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.number:case"number":{if(value===null){this.setInternalPropertyValue(name,value);this.setExternalPropertyValue(name,value);break}/*
|
|
497
497
|
NOTE: You should not name this variable "number" since
|
|
498
498
|
babel gets confused caused by existing module wide
|
|
499
499
|
property type variable "number".
|
|
500
|
-
*/let numberValue=parseFloat(value);if(isNaN(numberValue))numberValue=undefined;this.setInternalPropertyValue(name,numberValue);this.setExternalPropertyValue(name,numberValue);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.string:case"string":{this.setInternalPropertyValue(name,value);this.setExternalPropertyValue(name,value);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.any:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.array:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.arrayOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.element:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.elementType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.instanceOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.node:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.object:case"object":case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.objectOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOfType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.shape:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.exact:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.symbol:default:{if(value){const evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{}
|
|
500
|
+
*/let numberValue=parseFloat(value);if(isNaN(numberValue))numberValue=undefined;this.setInternalPropertyValue(name,numberValue);this.setExternalPropertyValue(name,numberValue);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.string:case"string":{this.setInternalPropertyValue(name,value);this.setExternalPropertyValue(name,value);break}case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.any:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.array:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.arrayOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.element:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.elementType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.instanceOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.node:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.object:case"object":case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.objectOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOf:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.oneOfType:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.shape:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.exact:case clientnode_property_types__WEBPACK_IMPORTED_MODULE_1__.symbol:default:{if(value){const evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(value,{binding:this});if(evaluated.error){log.warn("Error occurred during processing given",`attribute configuration "${attributeName}":`,evaluated.error);break}// NOTE: That both values do have to be avoided.
|
|
501
501
|
this.setInternalPropertyValue(name,evaluated.result);this.setExternalPropertyValue(name,(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.copy)(evaluated.result,false,1))}else if(this.hasAttribute(attributeName)){this.setInternalPropertyValue(name,true);this.setExternalPropertyValue(name,true)}else{this.setInternalPropertyValue(name,null);this.setExternalPropertyValue(name,null)}break}}}}/// endregion
|
|
502
502
|
/// region render
|
|
503
503
|
/**
|
|
@@ -535,7 +535,7 @@ this.setInternalPropertyValue(name,evaluated.result);this.setExternalPropertyVal
|
|
|
535
535
|
* rendering process by their own.
|
|
536
536
|
* @returns A promise resolving when rendering has been finished. A promise
|
|
537
537
|
* may be needed for classes inheriting from this class.
|
|
538
|
-
*/async render(reason="unknown",resolveRendering=true){this.unRender("reRender",reason);this.childComponentInstances=[];this.renderState.pending=true;if(this.isRoot){await this.resolveRenderingPromiseIfSet(reason,resolveRendering);if(resolveRendering){await Promise.all(this.self.pendingRenderPromises);this.self.pendingRenderPromises=[]}}this.self.pendingRenderPromises.push(this.renderState.promise);this.determineRenderScope();if(!(this.self.doRender&&this.dispatchEvent(new CustomEvent("render",{detail:{reason,scope:this.scope}})))){await this.resolveRenderingPromiseIfSet(reason,resolveRendering);return}const evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(`\`${this.self.content}\``,this.scope);if(evaluated.error){log.warn(`Failed to process template: ${evaluated.error}`);this.renderState.resolve(reason);await Promise.all(this.self.pendingRenderPromises);return}this.applyShadowRootIfNotExisting();/*
|
|
538
|
+
*/async render(reason="unknown",resolveRendering=true){this.unRender("reRender",reason);this.childComponentInstances=[];this.renderState.pending=true;if(this.isRoot){await this.resolveRenderingPromiseIfSet(reason,resolveRendering);if(resolveRendering){await Promise.all(this.self.pendingRenderPromises);this.self.pendingRenderPromises=[]}}this.self.pendingRenderPromises.push(this.renderState.promise);this.determineRenderScope();if(!(this.self.doRender&&this.dispatchEvent(new CustomEvent("render",{detail:{reason,scope:this.scope}})))){await this.resolveRenderingPromiseIfSet(reason,resolveRendering);return}const evaluated=(0,clientnode__WEBPACK_IMPORTED_MODULE_0__.evaluate)(`\`${this.self.content}\``,{scope:this.scope});if(evaluated.error){log.warn(`Failed to process template: ${evaluated.error}`);this.renderState.resolve(reason);await Promise.all(this.self.pendingRenderPromises);return}this.applyShadowRootIfNotExisting();/*
|
|
539
539
|
NOTE: We first render into an intermediate render target and apply
|
|
540
540
|
slot content until we finally publish everything to the document.
|
|
541
541
|
This avoids painting twice and internetexplorer bugs with an empty
|
|
@@ -568,8 +568,8 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
568
568
|
var external_clientnode_ = __webpack_require__(0);
|
|
569
569
|
// EXTERNAL MODULE: external "clientnode/property-types"
|
|
570
570
|
var property_types_ = __webpack_require__(1);
|
|
571
|
-
|
|
572
|
-
|
|
571
|
+
;// external "react"
|
|
572
|
+
|
|
573
573
|
;// external "react-dom"
|
|
574
574
|
|
|
575
575
|
;// external "react-dom/client"
|
|
@@ -653,7 +653,7 @@ this.rootReactInstance=this;/*
|
|
|
653
653
|
render result (only necessary when having a dedicated rendering
|
|
654
654
|
target like shadow root and only on first render before React
|
|
655
655
|
takes over DOM management).
|
|
656
|
-
*/let domNode=this.firstChild;while(domNode){const nextDomNode=domNode.nextSibling;this.removeChild(domNode);domNode=nextDomNode}}if(!this.reactRoot){const identifierPrefixCandidate=this.id||this.internalProperties.id||this.externalProperties.id||this.name||this.internalProperties.name||this.externalProperties.name;let identifierPrefix="";if(typeof identifierPrefixCandidate==="string")identifierPrefix=identifierPrefixCandidate;this.reactRoot=__WEBPACK_EXTERNAL_MODULE_react_dom_client_82ef521c_createRoot__(this.hostDomNode,{identifierPrefix})}__WEBPACK_EXTERNAL_MODULE_react_dom_c0b5c364_flushSync__(()=>{this.reactRoot?.render((
|
|
656
|
+
*/let domNode=this.firstChild;while(domNode){const nextDomNode=domNode.nextSibling;this.removeChild(domNode);domNode=nextDomNode}}if(!this.reactRoot){const identifierPrefixCandidate=this.id||this.internalProperties.id||this.externalProperties.id||this.name||this.internalProperties.name||this.externalProperties.name;let identifierPrefix="";if(typeof identifierPrefixCandidate==="string")identifierPrefix=identifierPrefixCandidate;this.reactRoot=__WEBPACK_EXTERNAL_MODULE_react_dom_client_82ef521c_createRoot__(this.hostDomNode,{identifierPrefix})}__WEBPACK_EXTERNAL_MODULE_react_dom_c0b5c364_flushSync__(()=>{this.reactRoot?.render(__WEBPACK_EXTERNAL_MODULE_react_createElement__(this.self.content,this.internalProperties));void this.resolveRenderingPromiseIfSet(reason,resolveRendering)});if(resolveRendering)await this.renderState.promise}// endregion
|
|
657
657
|
// region property handling
|
|
658
658
|
/**
|
|
659
659
|
* Generic property setter. Forwards field writes into internal and
|
|
@@ -696,7 +696,7 @@ this.rootReactInstance=this;/*
|
|
|
696
696
|
* variable name.
|
|
697
697
|
* @returns Transformed react elements.
|
|
698
698
|
*/preCompileDomNodes(domNodes,scope={},isFunction=false){// NOTE: We ignore empty text nodes (like React's jsx does).
|
|
699
|
-
domNodes=domNodes.filter(domNode=>domNode.nodeType!==Node.TEXT_NODE||typeof domNode.nodeValue==="string"&&domNode.nodeValue.trim()!=="");if(domNodes.length===1)return this.preCompileDomNode(domNodes[0],scope,isFunction);let index=1;const result=[];for(const node of domNodes){const element=this.preCompileDomNode(node,scope,isFunction,index.toString());result.push(element);index+=1}if(isFunction)return scope=>(...parameters)=>{const renderResult=[];for(const factory of result){const renderItem=factory(scope);if(typeof renderItem==="function")renderResult.push(renderItem(...parameters))}return (
|
|
699
|
+
domNodes=domNodes.filter(domNode=>domNode.nodeType!==Node.TEXT_NODE||typeof domNode.nodeValue==="string"&&domNode.nodeValue.trim()!=="");if(domNodes.length===1)return this.preCompileDomNode(domNodes[0],scope,isFunction);let index=1;const result=[];for(const node of domNodes){const element=this.preCompileDomNode(node,scope,isFunction,index.toString());result.push(element);index+=1}if(isFunction)return scope=>(...parameters)=>{const renderResult=[];for(const factory of result){const renderItem=factory(scope);if(typeof renderItem==="function")renderResult.push(renderItem(...parameters))}return __WEBPACK_EXTERNAL_MODULE_react_createElement__(__WEBPACK_EXTERNAL_MODULE_react_Fragment__,{children:renderResult})};return result}/**
|
|
700
700
|
* Converts a given html dom node into a react-element.
|
|
701
701
|
* @param domNode - Node to convert.
|
|
702
702
|
* @param scope - Additional scope to render subcomponents against.
|
|
@@ -707,7 +707,7 @@ domNodes=domNodes.filter(domNode=>domNode.nodeType!==Node.TEXT_NODE||typeof domN
|
|
|
707
707
|
*/preCompileDomNode(domNode,scope={},isFunction=false,key){// region render property
|
|
708
708
|
if(isFunction){const node=this.preCompileDomNode(domNode,{...scope,data:undefined,firstArgument:undefined,firstParameter:undefined,options:undefined,scope:undefined,parameters:undefined},false,key);return scope=>(...parameters)=>{const firstArgument=parameters.length>0?parameters[0]:null;return node({...scope,data:firstArgument,firstArgument,firstParameter:firstArgument,options:firstArgument,scope:firstArgument,parameters})}}// endregion
|
|
709
709
|
// region text node
|
|
710
|
-
if(domNode.nodeType===Node.TEXT_NODE){const value=typeof domNode.nodeValue==="string"?domNode.nodeValue.trim():"";const result=key&&value?(
|
|
710
|
+
if(domNode.nodeType===Node.TEXT_NODE){const value=typeof domNode.nodeValue==="string"?domNode.nodeValue.trim():"";const result=key&&value?__WEBPACK_EXTERNAL_MODULE_react_createElement__(__WEBPACK_EXTERNAL_MODULE_react_Fragment__,{children:value,key}):value?value:null;return()=>result}// endregion
|
|
711
711
|
if(!domNode.getAttributeNames)return()=>null;// region native elements and wrapped react components
|
|
712
712
|
/// region prepare type and static properties
|
|
713
713
|
const staticProperties={};let target;const isComponent=this.self.isReactComponent(domNode);if(isComponent){// region pre-compile nested render context
|
|
@@ -718,10 +718,10 @@ domNode.determineRenderScope();if(Object.keys(this.compiledSlots).length===0)dom
|
|
|
718
718
|
actually rendering the nested component.
|
|
719
719
|
*/if(key&&!Object.prototype.hasOwnProperty.call(staticProperties,"key"))staticProperties.key=key;target=domNode.constructor.content}else{staticProperties.key=key;target=domNode.tagName.toLowerCase()}/// endregion
|
|
720
720
|
/// region pre-compile dynamic properties
|
|
721
|
-
let knownScopeNames=Object.keys(scope);const compiledProperties={};for(const attributeName of domNode.getAttributeNames()){let value=domNode.getAttribute(attributeName);if(value===null)continue;let extend=false;let name="";if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name.startsWith("attribute-")||name==="attributes"||name.startsWith("property-")||name==="properties"){const{error,originalScopeNames,templateFunction}=(0,external_clientnode_.compile)(value,knownScopeNames);if(error){log.warn("Error occurred during compiling given attribute",`binding "${attributeName}" on node:`,domNode,error);continue}if(name==="attributes"||name==="properties")extend=true;else name=name.startsWith("attribute-")?name.substring("attribute-".length):name.substring("property-".length);value={originalScopeNames,templateFunction:templateFunction.bind(this)}}else if(name.startsWith("on-")){name=(0,external_clientnode_.delimitedToCamelCase)(name);if(!Object.prototype.hasOwnProperty.call(scope,"event"))knownScopeNames=[...knownScopeNames,"event"];if(!Object.prototype.hasOwnProperty.call(scope,"parameters"))knownScopeNames=[...knownScopeNames,"parameters"];/*
|
|
721
|
+
let knownScopeNames=Object.keys(scope);const compiledProperties={};for(const attributeName of domNode.getAttributeNames()){let value=domNode.getAttribute(attributeName);if(value===null)continue;let extend=false;let name="";if(attributeName.startsWith("data-bind-"))name=attributeName.substring("data-bind-".length);else if(attributeName.startsWith("bind-"))name=attributeName.substring("bind-".length);if(name.startsWith("attribute-")||name==="attributes"||name.startsWith("property-")||name==="properties"){const{error,originalScopeNames,templateFunction}=(0,external_clientnode_.compile)(value,{scope:knownScopeNames});if(error){log.warn("Error occurred during compiling given attribute",`binding "${attributeName}" on node:`,domNode,error);continue}if(name==="attributes"||name==="properties")extend=true;else name=name.startsWith("attribute-")?name.substring("attribute-".length):name.substring("property-".length);value={originalScopeNames,templateFunction:templateFunction.bind(this)}}else if(name.startsWith("on-")){name=(0,external_clientnode_.delimitedToCamelCase)(name);if(!Object.prototype.hasOwnProperty.call(scope,"event"))knownScopeNames=[...knownScopeNames,"event"];if(!Object.prototype.hasOwnProperty.call(scope,"parameters"))knownScopeNames=[...knownScopeNames,"parameters"];/*
|
|
722
722
|
NOTE: We pre-compile event listener since they should
|
|
723
723
|
usually be called more than it would be re-rendered.
|
|
724
|
-
*/const{error,originalScopeNames,scopeNames,templateFunction}=(0,external_clientnode_.compile)(value,knownScopeNames,true);if(error){log.warn("Error occurred during compiling given event",`binding "${attributeName}" on node:`,domNode,error);continue}const eventHandler=templateFunction.bind(this);value=(...parameters)=>{scope.event=parameters[0];scope.parameters=parameters;try{eventHandler(/*
|
|
724
|
+
*/const{error,originalScopeNames,scopeNames,templateFunction}=(0,external_clientnode_.compile)(value,{scope:knownScopeNames,execute:true});if(error){log.warn("Error occurred during compiling given event",`binding "${attributeName}" on node:`,domNode,error);continue}const eventHandler=templateFunction.bind(this);value=(...parameters)=>{scope.event=parameters[0];scope.parameters=parameters;try{eventHandler(/*
|
|
725
725
|
NOTE: We want to be ensured to have the same
|
|
726
726
|
ordering as we have for the scope names and to
|
|
727
727
|
call internal registered getter by retrieving
|
|
@@ -752,7 +752,7 @@ if(Object.prototype.hasOwnProperty.call(properties,"innerHTML")){properties.dang
|
|
|
752
752
|
scope, should be marked via the "bind-property-" prefix.
|
|
753
753
|
*/properties={...domNode.internalProperties,...properties};runtimeScope={...properties,...runtimeScope,parentInstance:domNode};domNode.evaluateSlots(runtimeScope);domNode.prepareProperties(properties);// endregion
|
|
754
754
|
}else if(properties.children)properties.children=this.evaluatePreCompiledDomNodes(properties.children,runtimeScope);// endregion
|
|
755
|
-
return (
|
|
755
|
+
return __WEBPACK_EXTERNAL_MODULE_react_createElement__(target,properties)};/// endregion
|
|
756
756
|
// endregion
|
|
757
757
|
}/**
|
|
758
758
|
* Evaluates given pre-compiled nodes into a single react element or a
|
|
@@ -777,7 +777,7 @@ return (0,external_react_.createElement)(target,properties)};/// endregion
|
|
|
777
777
|
*/determineRootBinding(){super.determineRootBinding();let currentElement=this.parentNode;while(currentElement){if(this.self.isReactComponent(currentElement)){this.rootReactInstance=currentElement;break}currentElement=currentElement.parentNode}}/**
|
|
778
778
|
* Applies missing forward ref and or memorizing wrapper to a current react
|
|
779
779
|
* component.
|
|
780
|
-
*/applyComponentWrapper(){if(typeof this.self.content==="string"||this.isWrapped)return;this.isWrapped=true;const wrapped=this.self.content.wrapped||this.self.content;if(this.self.content.webComponentAdapterWrapped){if(this.wrapMemorizingWrapper){this.self.content=(
|
|
780
|
+
*/applyComponentWrapper(){if(typeof this.self.content==="string"||this.isWrapped)return;this.isWrapped=true;const wrapped=this.self.content.wrapped||this.self.content;if(this.self.content.webComponentAdapterWrapped){if(this.wrapMemorizingWrapper){this.self.content=__WEBPACK_EXTERNAL_MODULE_react_memo__(this.self.content);this.self.content.wrapped=wrapped}}else if(this.self.attachWebComponentAdapterIfNotExists){if(!this.self.content.displayName)this.self.content.displayName=this.self._name;this.self.content=__WEBPACK_EXTERNAL_MODULE_react_forwardRef__((properties,reference)=>{__WEBPACK_EXTERNAL_MODULE_react_useImperativeHandle__(reference,()=>({properties}),[properties]);return __WEBPACK_EXTERNAL_MODULE_react_createElement__(wrapped,properties)});if(this.wrapMemorizingWrapper||this.wrapMemorizingWrapper===null)this.self.content=__WEBPACK_EXTERNAL_MODULE_react_memo__(this.self.content);this.self.content.wrapped=wrapped;this.self.content.webComponentAdapterWrapped="react"}else if(this.wrapMemorizingWrapper){this.self.content=__WEBPACK_EXTERNAL_MODULE_react_memo__(this.self.content);this.self.content.wrapped=wrapped}}/**
|
|
781
781
|
* Prepares a given properties object to render against the current
|
|
782
782
|
* component. Creates a reference for being recognized of reacts internal
|
|
783
783
|
* state updates.
|
|
@@ -785,25 +785,14 @@ return (0,external_react_.createElement)(target,properties)};/// endregion
|
|
|
785
785
|
*/prepareProperties(properties){;(0,external_clientnode_.extend)(properties,this.preparedSlots);this.self.removeKnownUnwantedPropertyKeys(this.self,properties);/*
|
|
786
786
|
NOTE: Provide instance if and only if not explicitly requested from
|
|
787
787
|
parent via properties.
|
|
788
|
-
*/if(!properties.ref){this.instance=(
|
|
788
|
+
*/if(!properties.ref){this.instance=__WEBPACK_EXTERNAL_MODULE_react_createRef__();properties.ref=reference=>{if(this.instance)this.instance.current=reference;else this.instance={current:reference};this.reflectInstanceProperties()}}}/**
|
|
789
789
|
* Removes unwanted known and not specified properties from a given
|
|
790
790
|
* properties object (usually added by dev-tools).
|
|
791
791
|
* @param target - ReactElement where properties belong to.
|
|
792
792
|
* @param properties - Properties object to trim.
|
|
793
793
|
*/static removeKnownUnwantedPropertyKeys(target,properties){if(typeof target.content==="string")return;// NOTE: Known root of errors caused by browser dev-tools.
|
|
794
794
|
for(const name of["isRoot","isTrusted","__composed"])if(Object.prototype.hasOwnProperty.call(properties,name)&&(Object.prototype.hasOwnProperty.call(target.content,"propTypes")&&!Object.prototype.hasOwnProperty.call(target.content.propTypes,name)||Object.prototype.hasOwnProperty.call(target.content,"wrapped")&&Object.prototype.hasOwnProperty.call(target.content.wrapped,"propTypes")&&!Object.prototype.hasOwnProperty.call(target.content.wrapped.propTypes,name)))delete properties[name]}// endregion
|
|
795
|
-
}_defineProperty(ReactWeb,"attachWebComponentAdapterIfNotExists",true);_defineProperty(ReactWeb,"content","div");_defineProperty(ReactWeb,"react",
|
|
796
|
-
|
|
797
|
-
/***/ }),
|
|
798
|
-
/* 5 */,
|
|
799
|
-
/* 6 */
|
|
800
|
-
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
801
|
-
|
|
802
|
-
const x = (y) => {
|
|
803
|
-
const x = {}; __webpack_require__.d(x, y); return x
|
|
804
|
-
}
|
|
805
|
-
const y = (x) => (() => (x))
|
|
806
|
-
module.exports = x({ ["Fragment"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.Fragment), ["createElement"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.createElement), ["createRef"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.createRef), ["default"]: () => (__WEBPACK_EXTERNAL_MODULE_react__["default"]), ["forwardRef"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.forwardRef), ["memo"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.memo), ["useImperativeHandle"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.useImperativeHandle) });
|
|
795
|
+
}_defineProperty(ReactWeb,"attachWebComponentAdapterIfNotExists",true);_defineProperty(ReactWeb,"content","div");_defineProperty(ReactWeb,"react",__WEBPACK_EXTERNAL_MODULE_react_default__);_defineProperty(ReactWeb,"_name","ReactWebComponent");const api={component:ReactWeb,register:(tagName=(0,external_clientnode_.camelCaseToDelimited)(ReactWeb._name))=>{customElements.define(tagName,ReactWeb)}};/* harmony default export */ const src_ReactWeb = (ReactWeb);
|
|
807
796
|
|
|
808
797
|
/***/ })
|
|
809
798
|
/******/ ]);
|
|
@@ -834,36 +823,27 @@ module.exports = x({ ["Fragment"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.Frag
|
|
|
834
823
|
/******/
|
|
835
824
|
/************************************************************************/
|
|
836
825
|
/******/ /* webpack/runtime/define property getters */
|
|
837
|
-
/******/
|
|
838
|
-
/******/
|
|
839
|
-
/******/
|
|
840
|
-
/******/
|
|
841
|
-
/******/
|
|
842
|
-
/******/
|
|
843
|
-
/******/
|
|
844
|
-
/******/
|
|
845
|
-
/******/
|
|
846
|
-
/******/
|
|
847
|
-
/******/
|
|
848
|
-
/******/
|
|
849
|
-
/******/
|
|
850
|
-
/******/
|
|
851
|
-
/******/ } else if(binding === 0) { i++; }
|
|
852
|
-
/******/ }
|
|
853
|
-
/******/ } else {
|
|
854
|
-
/******/ for(var key in definition) {
|
|
855
|
-
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
856
|
-
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
857
|
-
/******/ }
|
|
826
|
+
/******/ // define getter/value functions for harmony exports
|
|
827
|
+
/******/ __webpack_require__.d = (exports, definition) => {
|
|
828
|
+
/******/ if(Array.isArray(definition)) {
|
|
829
|
+
/******/ var i = 0;
|
|
830
|
+
/******/ while(i < definition.length) {
|
|
831
|
+
/******/ var key = definition[i++];
|
|
832
|
+
/******/ var binding = definition[i++];
|
|
833
|
+
/******/ var descriptor = binding === 0 ? { enumerable: true, value: definition[i++] } : { enumerable: true, get: binding };
|
|
834
|
+
/******/ if(!__webpack_require__.o(exports, key)) Object.defineProperty(exports, key, descriptor);
|
|
835
|
+
/******/ }
|
|
836
|
+
/******/ } else {
|
|
837
|
+
/******/ for(var key in definition) {
|
|
838
|
+
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
839
|
+
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
858
840
|
/******/ }
|
|
859
841
|
/******/ }
|
|
860
|
-
/******/ }
|
|
861
|
-
/******/ }
|
|
842
|
+
/******/ }
|
|
843
|
+
/******/ };
|
|
862
844
|
/******/
|
|
863
845
|
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
864
|
-
/******/ (
|
|
865
|
-
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
|
|
866
|
-
/******/ })();
|
|
846
|
+
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop));
|
|
867
847
|
/******/
|
|
868
848
|
/************************************************************************/
|
|
869
849
|
let __webpack_exports__ = {};
|