@dooboostore/simple-web-component 1.0.17 → 1.0.19
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/README.md +130 -143
- package/dist/cjs/config/config.js +2 -0
- package/dist/cjs/config/config.js.map +2 -2
- package/dist/cjs/decorators/addEventListener.js +4 -4
- package/dist/cjs/decorators/addEventListener.js.map +2 -2
- package/dist/cjs/decorators/appendChild.js +92 -0
- package/dist/cjs/decorators/appendChild.js.map +7 -0
- package/dist/cjs/decorators/classList.js +104 -0
- package/dist/cjs/decorators/classList.js.map +7 -0
- package/dist/cjs/decorators/elementDefine.js +309 -349
- package/dist/cjs/decorators/elementDefine.js.map +3 -3
- package/dist/cjs/decorators/emitCustomEvent.js +61 -9
- package/dist/cjs/decorators/emitCustomEvent.js.map +2 -2
- package/dist/cjs/decorators/index.js +5 -1
- package/dist/cjs/decorators/index.js.map +2 -2
- package/dist/cjs/decorators/{innerHtml.js → onConnectedInnerHtml.js} +8 -8
- package/dist/cjs/decorators/onConnectedInnerHtml.js.map +7 -0
- package/dist/cjs/decorators/query.js +61 -21
- package/dist/cjs/decorators/query.js.map +2 -2
- package/dist/cjs/decorators/queryAll.js +61 -19
- package/dist/cjs/decorators/queryAll.js.map +2 -2
- package/dist/cjs/decorators/replaceChildren.js +79 -0
- package/dist/cjs/decorators/replaceChildren.js.map +7 -0
- package/dist/cjs/decorators/setAttribute.js +35 -7
- package/dist/cjs/decorators/setAttribute.js.map +2 -2
- package/dist/cjs/decorators/style.js +88 -0
- package/dist/cjs/decorators/style.js.map +7 -0
- package/dist/cjs/elements/SwcAppEngine.js +23 -8
- package/dist/cjs/elements/SwcAppEngine.js.map +2 -2
- package/dist/cjs/elements/SwcAppMixin.js +52 -0
- package/dist/cjs/elements/SwcAppMixin.js.map +7 -0
- package/dist/cjs/elements/SwcAsync.js +57 -122
- package/dist/cjs/elements/SwcAsync.js.map +3 -3
- package/dist/cjs/elements/SwcChoose.js +51 -75
- package/dist/cjs/elements/SwcChoose.js.map +3 -3
- package/dist/cjs/elements/SwcIf.js +65 -93
- package/dist/cjs/elements/SwcIf.js.map +3 -3
- package/dist/cjs/elements/SwcLoop.js +72 -173
- package/dist/cjs/elements/SwcLoop.js.map +3 -3
- package/dist/cjs/elements/SwcSubTemplates.js +12 -37
- package/dist/cjs/elements/SwcSubTemplates.js.map +3 -3
- package/dist/cjs/elements/index.js +1 -8
- package/dist/cjs/elements/index.js.map +2 -2
- package/dist/cjs/elements/register.js +831 -0
- package/dist/cjs/elements/register.js.map +7 -0
- package/dist/cjs/index.js +22 -2
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/utils/TemplateUtils.js +103 -0
- package/dist/cjs/utils/TemplateUtils.js.map +7 -0
- package/dist/cjs/utils/Utils.js +10 -7
- package/dist/cjs/utils/Utils.js.map +2 -2
- package/dist/esm/config/config.js +2 -0
- package/dist/esm/config/config.js.map +2 -2
- package/dist/esm/decorators/addEventListener.js +4 -4
- package/dist/esm/decorators/addEventListener.js.map +2 -2
- package/dist/esm/decorators/appendChild.js +73 -0
- package/dist/esm/decorators/appendChild.js.map +7 -0
- package/dist/esm/decorators/classList.js +85 -0
- package/dist/esm/decorators/classList.js.map +7 -0
- package/dist/esm/decorators/elementDefine.js +309 -349
- package/dist/esm/decorators/elementDefine.js.map +3 -3
- package/dist/esm/decorators/emitCustomEvent.js +61 -9
- package/dist/esm/decorators/emitCustomEvent.js.map +2 -2
- package/dist/esm/decorators/index.js +5 -1
- package/dist/esm/decorators/index.js.map +2 -2
- package/dist/esm/decorators/{innerHtml.js → onConnectedInnerHtml.js} +5 -5
- package/dist/esm/decorators/onConnectedInnerHtml.js.map +7 -0
- package/dist/esm/decorators/query.js +62 -22
- package/dist/esm/decorators/query.js.map +2 -2
- package/dist/esm/decorators/queryAll.js +62 -20
- package/dist/esm/decorators/queryAll.js.map +2 -2
- package/dist/esm/decorators/replaceChildren.js +60 -0
- package/dist/esm/decorators/replaceChildren.js.map +7 -0
- package/dist/esm/decorators/setAttribute.js +35 -7
- package/dist/esm/decorators/setAttribute.js.map +2 -2
- package/dist/esm/decorators/style.js +69 -0
- package/dist/esm/decorators/style.js.map +7 -0
- package/dist/esm/elements/SwcAppEngine.js +23 -8
- package/dist/esm/elements/SwcAppEngine.js.map +2 -2
- package/dist/esm/elements/SwcAppMixin.js +33 -0
- package/dist/esm/elements/SwcAppMixin.js.map +7 -0
- package/dist/esm/elements/SwcAsync.js +57 -122
- package/dist/esm/elements/SwcAsync.js.map +3 -3
- package/dist/esm/elements/SwcChoose.js +51 -75
- package/dist/esm/elements/SwcChoose.js.map +3 -3
- package/dist/esm/elements/SwcIf.js +65 -93
- package/dist/esm/elements/SwcIf.js.map +3 -3
- package/dist/esm/elements/SwcLoop.js +71 -172
- package/dist/esm/elements/SwcLoop.js.map +3 -3
- package/dist/esm/elements/SwcSubTemplates.js +12 -37
- package/dist/esm/elements/SwcSubTemplates.js.map +3 -3
- package/dist/esm/elements/index.js +1 -8
- package/dist/esm/elements/index.js.map +2 -2
- package/dist/esm/elements/register.js +812 -0
- package/dist/esm/elements/register.js.map +7 -0
- package/dist/esm/index.js +18 -2
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/types.js.map +1 -1
- package/dist/esm/utils/TemplateUtils.js +84 -0
- package/dist/esm/utils/TemplateUtils.js.map +7 -0
- package/dist/esm/utils/Utils.js +6 -3
- package/dist/esm/utils/Utils.js.map +2 -2
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +1091 -5545
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +4 -4
- package/dist/types/config/config.d.ts +1 -0
- package/dist/types/config/config.d.ts.map +1 -1
- package/dist/types/decorators/addEventListener.d.ts +11 -11
- package/dist/types/decorators/addEventListener.d.ts.map +1 -1
- package/dist/types/decorators/appendChild.d.ts +17 -0
- package/dist/types/decorators/appendChild.d.ts.map +1 -0
- package/dist/types/decorators/classList.d.ts +34 -0
- package/dist/types/decorators/classList.d.ts.map +1 -0
- package/dist/types/decorators/elementDefine.d.ts +9 -5
- package/dist/types/decorators/elementDefine.d.ts.map +1 -1
- package/dist/types/decorators/emitCustomEvent.d.ts +7 -4
- package/dist/types/decorators/emitCustomEvent.d.ts.map +1 -1
- package/dist/types/decorators/index.d.ts +5 -1
- package/dist/types/decorators/index.d.ts.map +1 -1
- package/dist/types/decorators/onConnectedInnerHtml.d.ts +15 -0
- package/dist/types/decorators/onConnectedInnerHtml.d.ts.map +1 -0
- package/dist/types/decorators/query.d.ts +7 -8
- package/dist/types/decorators/query.d.ts.map +1 -1
- package/dist/types/decorators/queryAll.d.ts +5 -9
- package/dist/types/decorators/queryAll.d.ts.map +1 -1
- package/dist/types/decorators/replaceChildren.d.ts +9 -0
- package/dist/types/decorators/replaceChildren.d.ts.map +1 -0
- package/dist/types/decorators/setAttribute.d.ts +13 -3
- package/dist/types/decorators/setAttribute.d.ts.map +1 -1
- package/dist/types/decorators/style.d.ts +24 -0
- package/dist/types/decorators/style.d.ts.map +1 -0
- package/dist/types/elements/SwcAppEngine.d.ts +2 -2
- package/dist/types/elements/SwcAppEngine.d.ts.map +1 -1
- package/dist/types/elements/SwcAppMixin.d.ts +364 -0
- package/dist/types/elements/SwcAppMixin.d.ts.map +1 -0
- package/dist/types/elements/SwcAsync.d.ts +2 -6
- package/dist/types/elements/SwcAsync.d.ts.map +1 -1
- package/dist/types/elements/SwcChoose.d.ts +2 -1
- package/dist/types/elements/SwcChoose.d.ts.map +1 -1
- package/dist/types/elements/SwcIf.d.ts +5 -6
- package/dist/types/elements/SwcIf.d.ts.map +1 -1
- package/dist/types/elements/SwcLoop.d.ts +4 -10
- package/dist/types/elements/SwcLoop.d.ts.map +1 -1
- package/dist/types/elements/SwcSubTemplates.d.ts.map +1 -1
- package/dist/types/elements/index.d.ts +1 -8
- package/dist/types/elements/index.d.ts.map +1 -1
- package/dist/types/elements/register.d.ts +2 -0
- package/dist/types/elements/register.d.ts.map +1 -0
- package/dist/types/index.d.ts +9 -2
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/types.d.ts +6 -1
- package/dist/types/types.d.ts.map +1 -1
- package/dist/types/utils/TemplateUtils.d.ts +54 -0
- package/dist/types/utils/TemplateUtils.d.ts.map +1 -0
- package/dist/types/utils/Utils.d.ts.map +1 -1
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js +1091 -5545
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +4 -4
- package/package.json +2 -2
- package/src/config/config.ts +2 -0
- package/src/decorators/addEventListener.ts +12 -11
- package/src/decorators/appendChild.ts +86 -0
- package/src/decorators/classList.ts +117 -0
- package/src/decorators/elementDefine.ts +345 -349
- package/src/decorators/emitCustomEvent.ts +76 -12
- package/src/decorators/index.ts +5 -1
- package/src/decorators/{innerHtml.ts → onConnectedInnerHtml.ts} +7 -6
- package/src/decorators/query.ts +63 -31
- package/src/decorators/queryAll.ts +60 -28
- package/src/decorators/replaceChildren.ts +64 -0
- package/src/decorators/setAttribute.ts +53 -11
- package/src/decorators/style.ts +89 -0
- package/src/elements/SwcAppEngine.ts +26 -11
- package/src/elements/SwcAppMixin.ts +34 -0
- package/src/elements/SwcAsync.ts +57 -127
- package/src/elements/SwcChoose.ts +50 -76
- package/src/elements/SwcIf.ts +63 -85
- package/src/elements/SwcLoop.ts +70 -167
- package/src/elements/SwcSubTemplates.ts +0 -13
- package/src/elements/index.ts +1 -8
- package/src/elements/register.ts +735 -0
- package/src/index.ts +18 -4
- package/src/types.ts +13 -5
- package/src/utils/TemplateUtils.ts +83 -0
- package/src/utils/Utils.ts +6 -3
- package/dist/cjs/decorators/innerHtml.js.map +0 -7
- package/dist/cjs/elements/SwcApp.js +0 -55
- package/dist/cjs/elements/SwcApp.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppAnchor.js +0 -55
- package/dist/cjs/elements/is/SwcAppAnchor.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppArea.js +0 -55
- package/dist/cjs/elements/is/SwcAppArea.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppAudio.js +0 -55
- package/dist/cjs/elements/is/SwcAppAudio.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppBase.js +0 -55
- package/dist/cjs/elements/is/SwcAppBase.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppBody.js +0 -55
- package/dist/cjs/elements/is/SwcAppBody.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppButton.js +0 -55
- package/dist/cjs/elements/is/SwcAppButton.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppCanvas.js +0 -55
- package/dist/cjs/elements/is/SwcAppCanvas.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppData.js +0 -55
- package/dist/cjs/elements/is/SwcAppData.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppDataList.js +0 -55
- package/dist/cjs/elements/is/SwcAppDataList.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppDetails.js +0 -55
- package/dist/cjs/elements/is/SwcAppDetails.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppDialog.js +0 -55
- package/dist/cjs/elements/is/SwcAppDialog.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppDiv.js +0 -55
- package/dist/cjs/elements/is/SwcAppDiv.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppDl.js +0 -55
- package/dist/cjs/elements/is/SwcAppDl.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppEmbed.js +0 -55
- package/dist/cjs/elements/is/SwcAppEmbed.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppFieldSet.js +0 -55
- package/dist/cjs/elements/is/SwcAppFieldSet.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppForm.js +0 -55
- package/dist/cjs/elements/is/SwcAppForm.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppHeading.js +0 -55
- package/dist/cjs/elements/is/SwcAppHeading.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppHr.js +0 -55
- package/dist/cjs/elements/is/SwcAppHr.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppIFrame.js +0 -55
- package/dist/cjs/elements/is/SwcAppIFrame.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppImage.js +0 -55
- package/dist/cjs/elements/is/SwcAppImage.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppInput.js +0 -55
- package/dist/cjs/elements/is/SwcAppInput.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppLabel.js +0 -55
- package/dist/cjs/elements/is/SwcAppLabel.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppLegend.js +0 -55
- package/dist/cjs/elements/is/SwcAppLegend.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppLi.js +0 -55
- package/dist/cjs/elements/is/SwcAppLi.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppLink.js +0 -55
- package/dist/cjs/elements/is/SwcAppLink.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppMap.js +0 -55
- package/dist/cjs/elements/is/SwcAppMap.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppMeta.js +0 -55
- package/dist/cjs/elements/is/SwcAppMeta.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppMeter.js +0 -55
- package/dist/cjs/elements/is/SwcAppMeter.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppMod.js +0 -55
- package/dist/cjs/elements/is/SwcAppMod.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppObject.js +0 -55
- package/dist/cjs/elements/is/SwcAppObject.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppOl.js +0 -55
- package/dist/cjs/elements/is/SwcAppOl.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppOptGroup.js +0 -55
- package/dist/cjs/elements/is/SwcAppOptGroup.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppOption.js +0 -55
- package/dist/cjs/elements/is/SwcAppOption.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppOutput.js +0 -55
- package/dist/cjs/elements/is/SwcAppOutput.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppParagraph.js +0 -55
- package/dist/cjs/elements/is/SwcAppParagraph.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppParam.js +0 -55
- package/dist/cjs/elements/is/SwcAppParam.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppPicture.js +0 -55
- package/dist/cjs/elements/is/SwcAppPicture.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppPre.js +0 -55
- package/dist/cjs/elements/is/SwcAppPre.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppProgress.js +0 -55
- package/dist/cjs/elements/is/SwcAppProgress.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppQuote.js +0 -55
- package/dist/cjs/elements/is/SwcAppQuote.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppScript.js +0 -55
- package/dist/cjs/elements/is/SwcAppScript.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppSelect.js +0 -55
- package/dist/cjs/elements/is/SwcAppSelect.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppSlot.js +0 -55
- package/dist/cjs/elements/is/SwcAppSlot.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppSource.js +0 -55
- package/dist/cjs/elements/is/SwcAppSource.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppSpan.js +0 -55
- package/dist/cjs/elements/is/SwcAppSpan.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppStyle.js +0 -55
- package/dist/cjs/elements/is/SwcAppStyle.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTable.js +0 -55
- package/dist/cjs/elements/is/SwcAppTable.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTableCell.js +0 -55
- package/dist/cjs/elements/is/SwcAppTableCell.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTableRow.js +0 -55
- package/dist/cjs/elements/is/SwcAppTableRow.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTableSection.js +0 -55
- package/dist/cjs/elements/is/SwcAppTableSection.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTemplate.js +0 -55
- package/dist/cjs/elements/is/SwcAppTemplate.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTextArea.js +0 -55
- package/dist/cjs/elements/is/SwcAppTextArea.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTime.js +0 -55
- package/dist/cjs/elements/is/SwcAppTime.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTitle.js +0 -55
- package/dist/cjs/elements/is/SwcAppTitle.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppTrack.js +0 -55
- package/dist/cjs/elements/is/SwcAppTrack.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppUl.js +0 -55
- package/dist/cjs/elements/is/SwcAppUl.js.map +0 -7
- package/dist/cjs/elements/is/SwcAppVideo.js +0 -55
- package/dist/cjs/elements/is/SwcAppVideo.js.map +0 -7
- package/dist/cjs/elements/is/index.js +0 -74
- package/dist/cjs/elements/is/index.js.map +0 -7
- package/dist/esm/decorators/innerHtml.js.map +0 -7
- package/dist/esm/elements/SwcApp.js +0 -36
- package/dist/esm/elements/SwcApp.js.map +0 -7
- package/dist/esm/elements/is/SwcAppAnchor.js +0 -36
- package/dist/esm/elements/is/SwcAppAnchor.js.map +0 -7
- package/dist/esm/elements/is/SwcAppArea.js +0 -36
- package/dist/esm/elements/is/SwcAppArea.js.map +0 -7
- package/dist/esm/elements/is/SwcAppAudio.js +0 -36
- package/dist/esm/elements/is/SwcAppAudio.js.map +0 -7
- package/dist/esm/elements/is/SwcAppBase.js +0 -36
- package/dist/esm/elements/is/SwcAppBase.js.map +0 -7
- package/dist/esm/elements/is/SwcAppBody.js +0 -36
- package/dist/esm/elements/is/SwcAppBody.js.map +0 -7
- package/dist/esm/elements/is/SwcAppButton.js +0 -36
- package/dist/esm/elements/is/SwcAppButton.js.map +0 -7
- package/dist/esm/elements/is/SwcAppCanvas.js +0 -36
- package/dist/esm/elements/is/SwcAppCanvas.js.map +0 -7
- package/dist/esm/elements/is/SwcAppData.js +0 -36
- package/dist/esm/elements/is/SwcAppData.js.map +0 -7
- package/dist/esm/elements/is/SwcAppDataList.js +0 -36
- package/dist/esm/elements/is/SwcAppDataList.js.map +0 -7
- package/dist/esm/elements/is/SwcAppDetails.js +0 -36
- package/dist/esm/elements/is/SwcAppDetails.js.map +0 -7
- package/dist/esm/elements/is/SwcAppDialog.js +0 -36
- package/dist/esm/elements/is/SwcAppDialog.js.map +0 -7
- package/dist/esm/elements/is/SwcAppDiv.js +0 -36
- package/dist/esm/elements/is/SwcAppDiv.js.map +0 -7
- package/dist/esm/elements/is/SwcAppDl.js +0 -36
- package/dist/esm/elements/is/SwcAppDl.js.map +0 -7
- package/dist/esm/elements/is/SwcAppEmbed.js +0 -36
- package/dist/esm/elements/is/SwcAppEmbed.js.map +0 -7
- package/dist/esm/elements/is/SwcAppFieldSet.js +0 -36
- package/dist/esm/elements/is/SwcAppFieldSet.js.map +0 -7
- package/dist/esm/elements/is/SwcAppForm.js +0 -36
- package/dist/esm/elements/is/SwcAppForm.js.map +0 -7
- package/dist/esm/elements/is/SwcAppHeading.js +0 -36
- package/dist/esm/elements/is/SwcAppHeading.js.map +0 -7
- package/dist/esm/elements/is/SwcAppHr.js +0 -36
- package/dist/esm/elements/is/SwcAppHr.js.map +0 -7
- package/dist/esm/elements/is/SwcAppIFrame.js +0 -36
- package/dist/esm/elements/is/SwcAppIFrame.js.map +0 -7
- package/dist/esm/elements/is/SwcAppImage.js +0 -36
- package/dist/esm/elements/is/SwcAppImage.js.map +0 -7
- package/dist/esm/elements/is/SwcAppInput.js +0 -36
- package/dist/esm/elements/is/SwcAppInput.js.map +0 -7
- package/dist/esm/elements/is/SwcAppLabel.js +0 -36
- package/dist/esm/elements/is/SwcAppLabel.js.map +0 -7
- package/dist/esm/elements/is/SwcAppLegend.js +0 -36
- package/dist/esm/elements/is/SwcAppLegend.js.map +0 -7
- package/dist/esm/elements/is/SwcAppLi.js +0 -36
- package/dist/esm/elements/is/SwcAppLi.js.map +0 -7
- package/dist/esm/elements/is/SwcAppLink.js +0 -36
- package/dist/esm/elements/is/SwcAppLink.js.map +0 -7
- package/dist/esm/elements/is/SwcAppMap.js +0 -36
- package/dist/esm/elements/is/SwcAppMap.js.map +0 -7
- package/dist/esm/elements/is/SwcAppMeta.js +0 -36
- package/dist/esm/elements/is/SwcAppMeta.js.map +0 -7
- package/dist/esm/elements/is/SwcAppMeter.js +0 -36
- package/dist/esm/elements/is/SwcAppMeter.js.map +0 -7
- package/dist/esm/elements/is/SwcAppMod.js +0 -36
- package/dist/esm/elements/is/SwcAppMod.js.map +0 -7
- package/dist/esm/elements/is/SwcAppObject.js +0 -36
- package/dist/esm/elements/is/SwcAppObject.js.map +0 -7
- package/dist/esm/elements/is/SwcAppOl.js +0 -36
- package/dist/esm/elements/is/SwcAppOl.js.map +0 -7
- package/dist/esm/elements/is/SwcAppOptGroup.js +0 -36
- package/dist/esm/elements/is/SwcAppOptGroup.js.map +0 -7
- package/dist/esm/elements/is/SwcAppOption.js +0 -36
- package/dist/esm/elements/is/SwcAppOption.js.map +0 -7
- package/dist/esm/elements/is/SwcAppOutput.js +0 -36
- package/dist/esm/elements/is/SwcAppOutput.js.map +0 -7
- package/dist/esm/elements/is/SwcAppParagraph.js +0 -36
- package/dist/esm/elements/is/SwcAppParagraph.js.map +0 -7
- package/dist/esm/elements/is/SwcAppParam.js +0 -36
- package/dist/esm/elements/is/SwcAppParam.js.map +0 -7
- package/dist/esm/elements/is/SwcAppPicture.js +0 -36
- package/dist/esm/elements/is/SwcAppPicture.js.map +0 -7
- package/dist/esm/elements/is/SwcAppPre.js +0 -36
- package/dist/esm/elements/is/SwcAppPre.js.map +0 -7
- package/dist/esm/elements/is/SwcAppProgress.js +0 -36
- package/dist/esm/elements/is/SwcAppProgress.js.map +0 -7
- package/dist/esm/elements/is/SwcAppQuote.js +0 -36
- package/dist/esm/elements/is/SwcAppQuote.js.map +0 -7
- package/dist/esm/elements/is/SwcAppScript.js +0 -36
- package/dist/esm/elements/is/SwcAppScript.js.map +0 -7
- package/dist/esm/elements/is/SwcAppSelect.js +0 -36
- package/dist/esm/elements/is/SwcAppSelect.js.map +0 -7
- package/dist/esm/elements/is/SwcAppSlot.js +0 -36
- package/dist/esm/elements/is/SwcAppSlot.js.map +0 -7
- package/dist/esm/elements/is/SwcAppSource.js +0 -36
- package/dist/esm/elements/is/SwcAppSource.js.map +0 -7
- package/dist/esm/elements/is/SwcAppSpan.js +0 -36
- package/dist/esm/elements/is/SwcAppSpan.js.map +0 -7
- package/dist/esm/elements/is/SwcAppStyle.js +0 -36
- package/dist/esm/elements/is/SwcAppStyle.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTable.js +0 -36
- package/dist/esm/elements/is/SwcAppTable.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTableCell.js +0 -36
- package/dist/esm/elements/is/SwcAppTableCell.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTableRow.js +0 -36
- package/dist/esm/elements/is/SwcAppTableRow.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTableSection.js +0 -36
- package/dist/esm/elements/is/SwcAppTableSection.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTemplate.js +0 -36
- package/dist/esm/elements/is/SwcAppTemplate.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTextArea.js +0 -36
- package/dist/esm/elements/is/SwcAppTextArea.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTime.js +0 -36
- package/dist/esm/elements/is/SwcAppTime.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTitle.js +0 -36
- package/dist/esm/elements/is/SwcAppTitle.js.map +0 -7
- package/dist/esm/elements/is/SwcAppTrack.js +0 -36
- package/dist/esm/elements/is/SwcAppTrack.js.map +0 -7
- package/dist/esm/elements/is/SwcAppUl.js +0 -36
- package/dist/esm/elements/is/SwcAppUl.js.map +0 -7
- package/dist/esm/elements/is/SwcAppVideo.js +0 -36
- package/dist/esm/elements/is/SwcAppVideo.js.map +0 -7
- package/dist/esm/elements/is/index.js +0 -58
- package/dist/esm/elements/is/index.js.map +0 -7
- package/dist/types/decorators/innerHtml.d.ts +0 -12
- package/dist/types/decorators/innerHtml.d.ts.map +0 -1
- package/dist/types/elements/SwcApp.d.ts +0 -9
- package/dist/types/elements/SwcApp.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppAnchor.d.ts +0 -9
- package/dist/types/elements/is/SwcAppAnchor.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppArea.d.ts +0 -9
- package/dist/types/elements/is/SwcAppArea.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppAudio.d.ts +0 -9
- package/dist/types/elements/is/SwcAppAudio.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppBase.d.ts +0 -9
- package/dist/types/elements/is/SwcAppBase.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppBody.d.ts +0 -9
- package/dist/types/elements/is/SwcAppBody.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppButton.d.ts +0 -9
- package/dist/types/elements/is/SwcAppButton.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppCanvas.d.ts +0 -9
- package/dist/types/elements/is/SwcAppCanvas.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppData.d.ts +0 -9
- package/dist/types/elements/is/SwcAppData.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppDataList.d.ts +0 -9
- package/dist/types/elements/is/SwcAppDataList.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppDetails.d.ts +0 -9
- package/dist/types/elements/is/SwcAppDetails.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppDialog.d.ts +0 -9
- package/dist/types/elements/is/SwcAppDialog.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppDiv.d.ts +0 -9
- package/dist/types/elements/is/SwcAppDiv.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppDl.d.ts +0 -9
- package/dist/types/elements/is/SwcAppDl.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppEmbed.d.ts +0 -9
- package/dist/types/elements/is/SwcAppEmbed.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppFieldSet.d.ts +0 -9
- package/dist/types/elements/is/SwcAppFieldSet.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppForm.d.ts +0 -9
- package/dist/types/elements/is/SwcAppForm.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppHeading.d.ts +0 -9
- package/dist/types/elements/is/SwcAppHeading.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppHr.d.ts +0 -9
- package/dist/types/elements/is/SwcAppHr.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppIFrame.d.ts +0 -9
- package/dist/types/elements/is/SwcAppIFrame.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppImage.d.ts +0 -9
- package/dist/types/elements/is/SwcAppImage.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppInput.d.ts +0 -9
- package/dist/types/elements/is/SwcAppInput.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppLabel.d.ts +0 -9
- package/dist/types/elements/is/SwcAppLabel.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppLegend.d.ts +0 -9
- package/dist/types/elements/is/SwcAppLegend.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppLi.d.ts +0 -9
- package/dist/types/elements/is/SwcAppLi.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppLink.d.ts +0 -9
- package/dist/types/elements/is/SwcAppLink.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppMap.d.ts +0 -9
- package/dist/types/elements/is/SwcAppMap.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppMeta.d.ts +0 -9
- package/dist/types/elements/is/SwcAppMeta.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppMeter.d.ts +0 -9
- package/dist/types/elements/is/SwcAppMeter.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppMod.d.ts +0 -9
- package/dist/types/elements/is/SwcAppMod.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppObject.d.ts +0 -9
- package/dist/types/elements/is/SwcAppObject.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppOl.d.ts +0 -9
- package/dist/types/elements/is/SwcAppOl.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppOptGroup.d.ts +0 -9
- package/dist/types/elements/is/SwcAppOptGroup.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppOption.d.ts +0 -9
- package/dist/types/elements/is/SwcAppOption.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppOutput.d.ts +0 -9
- package/dist/types/elements/is/SwcAppOutput.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppParagraph.d.ts +0 -9
- package/dist/types/elements/is/SwcAppParagraph.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppParam.d.ts +0 -9
- package/dist/types/elements/is/SwcAppParam.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppPicture.d.ts +0 -9
- package/dist/types/elements/is/SwcAppPicture.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppPre.d.ts +0 -9
- package/dist/types/elements/is/SwcAppPre.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppProgress.d.ts +0 -9
- package/dist/types/elements/is/SwcAppProgress.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppQuote.d.ts +0 -9
- package/dist/types/elements/is/SwcAppQuote.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppScript.d.ts +0 -9
- package/dist/types/elements/is/SwcAppScript.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppSelect.d.ts +0 -9
- package/dist/types/elements/is/SwcAppSelect.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppSlot.d.ts +0 -9
- package/dist/types/elements/is/SwcAppSlot.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppSource.d.ts +0 -9
- package/dist/types/elements/is/SwcAppSource.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppSpan.d.ts +0 -9
- package/dist/types/elements/is/SwcAppSpan.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppStyle.d.ts +0 -9
- package/dist/types/elements/is/SwcAppStyle.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTable.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTable.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTableCell.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTableCell.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTableRow.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTableRow.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTableSection.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTableSection.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTemplate.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTemplate.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTextArea.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTextArea.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTime.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTime.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTitle.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTitle.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppTrack.d.ts +0 -9
- package/dist/types/elements/is/SwcAppTrack.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppUl.d.ts +0 -9
- package/dist/types/elements/is/SwcAppUl.d.ts.map +0 -1
- package/dist/types/elements/is/SwcAppVideo.d.ts +0 -9
- package/dist/types/elements/is/SwcAppVideo.d.ts.map +0 -1
- package/dist/types/elements/is/index.d.ts +0 -58
- package/dist/types/elements/is/index.d.ts.map +0 -1
- package/src/elements/SwcApp.ts +0 -26
- package/src/elements/is/SwcAppAnchor.ts +0 -26
- package/src/elements/is/SwcAppArea.ts +0 -26
- package/src/elements/is/SwcAppAudio.ts +0 -26
- package/src/elements/is/SwcAppBase.ts +0 -26
- package/src/elements/is/SwcAppBody.ts +0 -26
- package/src/elements/is/SwcAppButton.ts +0 -26
- package/src/elements/is/SwcAppCanvas.ts +0 -26
- package/src/elements/is/SwcAppData.ts +0 -26
- package/src/elements/is/SwcAppDataList.ts +0 -26
- package/src/elements/is/SwcAppDetails.ts +0 -26
- package/src/elements/is/SwcAppDialog.ts +0 -26
- package/src/elements/is/SwcAppDiv.ts +0 -26
- package/src/elements/is/SwcAppDl.ts +0 -26
- package/src/elements/is/SwcAppEmbed.ts +0 -26
- package/src/elements/is/SwcAppFieldSet.ts +0 -26
- package/src/elements/is/SwcAppForm.ts +0 -26
- package/src/elements/is/SwcAppHeading.ts +0 -26
- package/src/elements/is/SwcAppHr.ts +0 -26
- package/src/elements/is/SwcAppIFrame.ts +0 -26
- package/src/elements/is/SwcAppImage.ts +0 -26
- package/src/elements/is/SwcAppInput.ts +0 -26
- package/src/elements/is/SwcAppLabel.ts +0 -26
- package/src/elements/is/SwcAppLegend.ts +0 -26
- package/src/elements/is/SwcAppLi.ts +0 -26
- package/src/elements/is/SwcAppLink.ts +0 -26
- package/src/elements/is/SwcAppMap.ts +0 -26
- package/src/elements/is/SwcAppMeta.ts +0 -26
- package/src/elements/is/SwcAppMeter.ts +0 -26
- package/src/elements/is/SwcAppMod.ts +0 -26
- package/src/elements/is/SwcAppObject.ts +0 -26
- package/src/elements/is/SwcAppOl.ts +0 -26
- package/src/elements/is/SwcAppOptGroup.ts +0 -26
- package/src/elements/is/SwcAppOption.ts +0 -26
- package/src/elements/is/SwcAppOutput.ts +0 -26
- package/src/elements/is/SwcAppParagraph.ts +0 -26
- package/src/elements/is/SwcAppParam.ts +0 -26
- package/src/elements/is/SwcAppPicture.ts +0 -26
- package/src/elements/is/SwcAppPre.ts +0 -26
- package/src/elements/is/SwcAppProgress.ts +0 -26
- package/src/elements/is/SwcAppQuote.ts +0 -26
- package/src/elements/is/SwcAppScript.ts +0 -26
- package/src/elements/is/SwcAppSelect.ts +0 -26
- package/src/elements/is/SwcAppSlot.ts +0 -26
- package/src/elements/is/SwcAppSource.ts +0 -26
- package/src/elements/is/SwcAppSpan.ts +0 -26
- package/src/elements/is/SwcAppStyle.ts +0 -26
- package/src/elements/is/SwcAppTable.ts +0 -26
- package/src/elements/is/SwcAppTableCell.ts +0 -26
- package/src/elements/is/SwcAppTableRow.ts +0 -26
- package/src/elements/is/SwcAppTableSection.ts +0 -26
- package/src/elements/is/SwcAppTemplate.ts +0 -26
- package/src/elements/is/SwcAppTextArea.ts +0 -26
- package/src/elements/is/SwcAppTime.ts +0 -26
- package/src/elements/is/SwcAppTitle.ts +0 -26
- package/src/elements/is/SwcAppTrack.ts +0 -26
- package/src/elements/is/SwcAppUl.ts +0 -26
- package/src/elements/is/SwcAppVideo.ts +0 -26
- package/src/elements/is/index.ts +0 -57
package/README.md
CHANGED
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
|
|
3
3
|
> **"Pure, Standards-Compliant, and Blazing Fast Web Components Framework."**
|
|
4
4
|
|
|
5
|
-
`simple-web-component` (SWC) is a minimalist library designed for building high-performance Web Components and Single Page Applications (SPA). It strips away heavy "magic" features like Proxy-based reactivity and continuous `MutationObserver` scans in favor of a **Pure Architecture** that
|
|
5
|
+
`simple-web-component` (SWC) is a minimalist library designed for building high-performance Web Components and Single Page Applications (SPA). It strips away heavy "magic" features like Proxy-based reactivity and continuous `MutationObserver` scans in favor of a **Pure Architecture** that adheres strictly to browser standards.
|
|
6
6
|
|
|
7
7
|
---
|
|
8
8
|
|
|
9
9
|
## 🚀 Why SWC?
|
|
10
10
|
|
|
11
11
|
- **Zero Magic**: No Proxy traps, no Virtual DOM diffing. Predictive and standard-compliant.
|
|
12
|
-
- **Native Inheritance**: Inherit directly from `HTMLElement`, `HTMLDivElement`,
|
|
12
|
+
- **Native Inheritance**: Inherit directly from `HTMLElement`, `HTMLDivElement`, or `HTMLTemplateElement`.
|
|
13
13
|
- **Extreme Performance**: Ideal for high-load UIs (1,000+ nodes) with minimal memory overhead.
|
|
14
14
|
- **Micro-Frontend Ready**: Independent routing and DI containers for every component scope.
|
|
15
15
|
- **Standard-First**: Works directly with native Custom Elements, Shadow DOM, and Slots.
|
|
@@ -42,13 +42,13 @@ Registers the class as a custom element.
|
|
|
42
42
|
| `observedAttributes` | `string[]` | (Optional) Extra attributes to observe. |
|
|
43
43
|
| `window` | `Window` | (Optional) Custom window object (useful for SSR). |
|
|
44
44
|
|
|
45
|
-
### 2. `@
|
|
46
|
-
Defines the template for the component.
|
|
45
|
+
### 2. `@onConnectedInnerHtml(options?)`
|
|
46
|
+
Defines the template for the component. Executed when the component is connected to the DOM.
|
|
47
47
|
|
|
48
48
|
```typescript
|
|
49
49
|
@elementDefine('my-el')
|
|
50
50
|
class MyEl extends HTMLElement {
|
|
51
|
-
@
|
|
51
|
+
@onConnectedInnerHtml({ useShadow: true })
|
|
52
52
|
render() {
|
|
53
53
|
return `<style>:host { color: blue; }</style><div>Hello World</div>`;
|
|
54
54
|
}
|
|
@@ -80,33 +80,28 @@ class MyCounter extends HTMLElement {
|
|
|
80
80
|
```
|
|
81
81
|
|
|
82
82
|
### 4. Powerful Queries (`@query`, `@queryAll`)
|
|
83
|
-
Inject internal elements directly into properties.
|
|
83
|
+
Inject internal elements or host instances directly into properties. Assigning `null` or `[]` to these properties will surgically remove the target elements from the DOM.
|
|
84
84
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
85
|
+
#### Usage with Special Targets:
|
|
86
|
+
Special targets (starting with `:`) navigate the hierarchy and environment.
|
|
87
|
+
```typescript
|
|
88
|
+
@query(':host') self!: HTMLElement;
|
|
89
|
+
@query(':parentHost') parent!: HTMLElement;
|
|
90
|
+
@query(':appHost') app!: SwcAppInterface;
|
|
91
|
+
@query(':window') win!: Window;
|
|
92
|
+
@query(':document') doc!: Document;
|
|
93
|
+
@queryAll(':hosts') ancestors!: HTMLElement[];
|
|
94
|
+
```
|
|
93
95
|
|
|
96
|
+
#### Usage with Selectors & Root Options:
|
|
97
|
+
Standard CSS selectors support precise root control.
|
|
94
98
|
```typescript
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
@query('.title') titleEl!: HTMLElement;
|
|
98
|
-
@queryAll('.items') list!: NodeListOf<HTMLElement>;
|
|
99
|
-
|
|
100
|
-
// Reference the component itself
|
|
101
|
-
@query(':host') self!: HTMLElement;
|
|
102
|
-
|
|
103
|
-
// Root options: 'light' | 'shadow' | 'all' | 'auto' (default)
|
|
104
|
-
@query('.btn', { root: 'shadow' }) shadowBtn!: HTMLButtonElement;
|
|
105
|
-
}
|
|
99
|
+
// root options: 'light' | 'shadow' | 'all' | 'auto' (default)
|
|
100
|
+
@query('.btn', { root: 'shadow' }) shadowBtn!: HTMLButtonElement;
|
|
106
101
|
```
|
|
107
102
|
|
|
108
103
|
### 5. Smart Event Binding (`@addEventListener`)
|
|
109
|
-
Bind events declaratively with support for **Event Delegation
|
|
104
|
+
Bind events declaratively with support for **Event Delegation** and special targets.
|
|
110
105
|
|
|
111
106
|
```typescript
|
|
112
107
|
@elementDefine('event-demo')
|
|
@@ -115,22 +110,83 @@ class EventDemo extends HTMLElement {
|
|
|
115
110
|
@addEventListener('.static-btn', 'click')
|
|
116
111
|
onStaticClick(event: MouseEvent) { ... }
|
|
117
112
|
|
|
118
|
-
// 2. Event Delegation (
|
|
119
|
-
@addEventListener('.item', 'click', { delegate: true })
|
|
113
|
+
// 2. Event Delegation (Handles dynamic nodes)
|
|
114
|
+
@addEventListener('.dynamic-item', 'click', { delegate: true })
|
|
120
115
|
onItemClick(event: MouseEvent, { $host }: HostSet, target: HTMLElement) {
|
|
121
|
-
console.log('Clicked
|
|
116
|
+
console.log('Clicked in:', $host.tagName);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
// 3. Global Events with Auto-Cleanup
|
|
120
|
+
@addEventListener(':window', 'resize', { removeOnDisconnected: true })
|
|
121
|
+
onResize() { ... }
|
|
122
|
+
}
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
### 6. `@replaceChildren(selector)`
|
|
126
|
+
Surgically replaces the children of a target element with the method's return value (`string`, `Node`, or `Array<Node|string>`).
|
|
127
|
+
|
|
128
|
+
```typescript
|
|
129
|
+
@elementDefine('surgical-demo')
|
|
130
|
+
class SurgicalDemo extends HTMLElement {
|
|
131
|
+
// Replaces all children of #display-area with a new HTML fragment
|
|
132
|
+
@replaceChildren('#display-area')
|
|
133
|
+
updateView(title: string) {
|
|
134
|
+
return htmlFragment`<h2>${title}</h2><p>Updated successfully.</p>`;
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
```
|
|
138
|
+
|
|
139
|
+
### 7. `@appendChild(selector, options?)`
|
|
140
|
+
Appends or inserts the method's return value relative to a target element.
|
|
141
|
+
- **position**: `'firstChild'`, `'lastChild'` (default), `'nextSibling'`, `'previousSibling'`.
|
|
142
|
+
|
|
143
|
+
```typescript
|
|
144
|
+
@elementDefine('list-manager')
|
|
145
|
+
class ListManager extends HTMLElement {
|
|
146
|
+
// Prepends a new item to the top of the #my-list element
|
|
147
|
+
@appendChild('#my-list', { position: 'firstChild' })
|
|
148
|
+
addNewItem(text: string) {
|
|
149
|
+
return htmlDivElement`<li>${text}</li>`;
|
|
122
150
|
}
|
|
123
151
|
}
|
|
124
152
|
```
|
|
125
153
|
|
|
126
154
|
---
|
|
127
155
|
|
|
156
|
+
## 🛠 Template Utilities
|
|
157
|
+
|
|
158
|
+
SWC provides powerful utilities to create DOM nodes using Tagged Template Literals. These are perfect for use with surgical decorators like `@replaceChildren`.
|
|
159
|
+
|
|
160
|
+
### 1. `htmlFragment` & `textNode`
|
|
161
|
+
- **`htmlFragment\`...\``**: Returns a `DocumentFragment` from an HTML string.
|
|
162
|
+
- **`textNode\`...\``**: Returns a pure `Text` node.
|
|
163
|
+
|
|
164
|
+
### 2. Element Factories (`html***Element`)
|
|
165
|
+
Specific factories for common tags like `htmlDivElement`, `htmlSpanElement`, `htmlButtonElement`, etc.
|
|
166
|
+
|
|
167
|
+
```typescript
|
|
168
|
+
import { htmlDivElement, htmlSpanElement } from '@dooboostore/simple-web-component';
|
|
169
|
+
|
|
170
|
+
const el = htmlDivElement`<span>Hello ${name}</span>`; // Returns HTMLDivElement
|
|
171
|
+
```
|
|
172
|
+
|
|
173
|
+
### 3. `createElement(info, attributes)`
|
|
174
|
+
Structured element creation.
|
|
175
|
+
```typescript
|
|
176
|
+
const el = createElement(
|
|
177
|
+
{ tagName: 'div', innerHtml: '<b>Bold</b>' },
|
|
178
|
+
{ class: 'my-class', 'data-id': '123' }
|
|
179
|
+
);
|
|
180
|
+
```
|
|
181
|
+
|
|
182
|
+
---
|
|
183
|
+
|
|
128
184
|
## 🌐 Powerful SPA & Routing
|
|
129
185
|
|
|
130
186
|
SWC provides a revolutionary way to build SPAs where **each component scope is an independent application**.
|
|
131
187
|
|
|
132
188
|
### 1. Isolated App Scopes (Micro-Frontends)
|
|
133
|
-
Use the `<swc-app>` tag to create an isolated universe. Each instance has its own **DI Container** and **Router**.
|
|
189
|
+
Use the `<swc-app>` tag to create an isolated universe. Each instance has its own **DI Container** and **Router**.
|
|
134
190
|
|
|
135
191
|
```html
|
|
136
192
|
<!-- index.html -->
|
|
@@ -147,35 +203,24 @@ Use the `<swc-app>` tag to create an isolated universe. Each instance has its ow
|
|
|
147
203
|
};
|
|
148
204
|
};
|
|
149
205
|
|
|
150
|
-
//
|
|
206
|
+
// External Control
|
|
151
207
|
function navigateFromOutside() {
|
|
152
208
|
const app = document.querySelector('swc-app');
|
|
153
|
-
// Programmatically trigger routing from outside the component
|
|
154
209
|
app.routing('/users/detail/2');
|
|
155
210
|
}
|
|
156
211
|
</script>
|
|
157
|
-
|
|
158
|
-
<button onclick="navigateFromOutside()">External Link to User 2</button>
|
|
159
212
|
```
|
|
160
213
|
|
|
161
214
|
### 2. DI-Powered Routing
|
|
162
|
-
Define routes using decorators. Components are automatically instantiated and managed by the DI container.
|
|
163
|
-
|
|
164
215
|
```typescript
|
|
165
|
-
import { Router } from '@dooboostore/simple-boot/decorators/route/Router';
|
|
166
|
-
import { Sim } from '@dooboostore/simple-boot/decorators/SimDecorator';
|
|
167
|
-
|
|
168
216
|
@Sim
|
|
169
217
|
@Router({
|
|
170
218
|
path: '/users',
|
|
171
|
-
route: {
|
|
172
|
-
'/list': UserList,
|
|
173
|
-
'/detail/:id': UserDetail
|
|
174
|
-
}
|
|
219
|
+
route: { '/list': UserList, '/detail/:id': UserDetail }
|
|
175
220
|
})
|
|
176
221
|
@elementDefine('user-router')
|
|
177
222
|
class UserRouter extends HTMLElement implements RouterAction.CanActivate {
|
|
178
|
-
@
|
|
223
|
+
@onConnectedInnerHtml({ useShadow: true })
|
|
179
224
|
render() {
|
|
180
225
|
return `<header>User System</header><main><slot></slot></main>`;
|
|
181
226
|
}
|
|
@@ -185,21 +230,17 @@ class UserRouter extends HTMLElement implements RouterAction.CanActivate {
|
|
|
185
230
|
}
|
|
186
231
|
}
|
|
187
232
|
|
|
188
|
-
// Pure Service (Business Logic)
|
|
189
233
|
@Sim
|
|
190
234
|
class UserService {
|
|
191
|
-
async getProfile(id: string) {
|
|
192
|
-
return { id, name: 'Standard User' };
|
|
193
|
-
}
|
|
235
|
+
async getProfile(id: string) { return { id, name: 'Standard User' }; }
|
|
194
236
|
}
|
|
195
237
|
|
|
196
|
-
// Example Page Components
|
|
197
238
|
@Sim
|
|
198
239
|
@elementDefine('user-list')
|
|
199
240
|
class UserList extends HTMLElement {
|
|
200
241
|
constructor(private router: Router, private userService: UserService) { super(); }
|
|
201
242
|
|
|
202
|
-
@
|
|
243
|
+
@onConnectedInnerHtml
|
|
203
244
|
render() {
|
|
204
245
|
return `
|
|
205
246
|
<ul><li>User A</li><li>User B</li></ul>
|
|
@@ -220,63 +261,62 @@ class UserDetail extends HTMLElement {
|
|
|
220
261
|
console.log('Viewing User:', profile.name);
|
|
221
262
|
}
|
|
222
263
|
|
|
223
|
-
@
|
|
264
|
+
@onConnectedInnerHtml
|
|
224
265
|
render() { return `<div>User Detail View <button swc-on-click="$host.router.back()">Back</button></div>`; }
|
|
225
266
|
}
|
|
226
267
|
```
|
|
227
268
|
|
|
228
|
-
|
|
229
|
-
Inject services or component context directly into lifecycle methods. This is the ultimate way to handle side effects cleanly.
|
|
269
|
+
---
|
|
230
270
|
|
|
231
|
-
|
|
232
|
-
import { Inject } from '@dooboostore/simple-boot/decorators/inject/Inject';
|
|
233
|
-
import { InjectSituationType, onConnected, HostSet } from '@dooboostore/simple-web-component';
|
|
234
|
-
import { Router } from '@dooboostore/core-web/routers/Router';
|
|
271
|
+
## ✉️ Integrated Messaging System
|
|
235
272
|
|
|
236
|
-
|
|
237
|
-
class ProfilePage extends HTMLElement {
|
|
273
|
+
SWC leverages its **Special Selectors** to provide a powerful, scoped messaging system using native browser events without any external manager.
|
|
238
274
|
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
275
|
+
### Scoped Messaging Example
|
|
276
|
+
- **`:appHost`**: Communicate within the same Micro-App (Isolated scope).
|
|
277
|
+
- **`:window` / `:document`**: Broadcast to the entire page (Global scope).
|
|
278
|
+
- **`:parentHost`**: Send a direct message to the immediate parent host.
|
|
279
|
+
- **`:firstHost` / `:firstAppHost`**: Target the absolute root component or the top-level SPA.
|
|
280
|
+
|
|
281
|
+
```typescript
|
|
282
|
+
@elementDefine('message-sender')
|
|
283
|
+
class Sender extends HTMLElement {
|
|
284
|
+
// Dispatches a message to the nearest parent <swc-app>
|
|
285
|
+
@emitCustomEvent(':appHost', 'user-login')
|
|
286
|
+
login() { return { id: 1, name: 'John' }; }
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
@elementDefine('message-receiver')
|
|
290
|
+
class Receiver extends HTMLElement {
|
|
291
|
+
// Listens for messages from the parent <swc-app>
|
|
292
|
+
@addEventListener(':appHost', 'user-login')
|
|
293
|
+
onLogin(e: CustomEvent) {
|
|
294
|
+
console.log('User logged in within my app:', e.detail.name);
|
|
249
295
|
}
|
|
250
296
|
}
|
|
251
297
|
```
|
|
252
298
|
|
|
253
299
|
---
|
|
254
300
|
|
|
255
|
-
## 🏰 Host Hierarchy & Context
|
|
301
|
+
## 🏰 Host Hierarchy & Context Hierarchy & Declarative Events
|
|
256
302
|
SWC automatically traverses the DOM to provide meaningful context to your scripts and listeners:
|
|
257
303
|
|
|
258
304
|
- **`$host`**: The current component Handling the event (**Self**).
|
|
259
305
|
- **`$parentHost`**: The direct parent SWC component.
|
|
260
|
-
- **`$appHost`**: The nearest parent
|
|
306
|
+
- **`$appHost`**: The nearest parent SPA boundary.
|
|
261
307
|
- **`$hosts`**: Array of all SWC ancestors `[Root, ..., Parent, Self]`.
|
|
262
308
|
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
## 🛠 Lifecycle Hooks
|
|
266
|
-
Executed in **Parent -> Child** order.
|
|
267
|
-
- `@onBeforeConnected` / `@onAfterConnected` (alias: `@onConnected`)
|
|
268
|
-
- `@onBeforeDisconnected` / `@onAfterDisconnected` (alias: `@onDisconnected`)
|
|
269
|
-
- `@onBeforeAdopted` / `@onAfterAdopted` (alias: `@onAdopted`)
|
|
270
|
-
- `@onAddEventListener`
|
|
271
|
-
|
|
272
|
-
---
|
|
309
|
+
### Declarative Inline Events (`swc-on-*`)
|
|
310
|
+
Bind events directly in HTML. These scripts have full access to the context above and the actual element via **`$el`**.
|
|
273
311
|
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
-
|
|
278
|
-
|
|
279
|
-
|
|
312
|
+
```html
|
|
313
|
+
<template is="swc-loop" on-get-value="users">
|
|
314
|
+
<!-- The script can access $item, $index, $host, and $el -->
|
|
315
|
+
<button swc-on-click="console.log('Clicked:', $el); $host.deleteUser($index)">
|
|
316
|
+
Delete Item
|
|
317
|
+
</button>
|
|
318
|
+
</template>
|
|
319
|
+
```
|
|
280
320
|
|
|
281
321
|
---
|
|
282
322
|
|
|
@@ -291,7 +331,6 @@ SWC provides 4 core templates that empower your HTML without wrapper elements: `
|
|
|
291
331
|
- **`on-get-portal`**: Script that returns an `Element` or selector string to render content in a different part of the DOM.
|
|
292
332
|
|
|
293
333
|
### 1. `swc-if` (Conditional Rendering)
|
|
294
|
-
Renders content only when the condition is truthy. Supports a fallback `swc-default` state.
|
|
295
334
|
```html
|
|
296
335
|
<template is="swc-if" on-get-value="isAdmin">
|
|
297
336
|
<template is="swc-default"><p>Please login as admin.</p></template>
|
|
@@ -300,7 +339,6 @@ Renders content only when the condition is truthy. Supports a fallback `swc-defa
|
|
|
300
339
|
```
|
|
301
340
|
|
|
302
341
|
### 2. `swc-loop` (High-Performance Iteration)
|
|
303
|
-
Efficiently renders lists with surgical updates and index preservation.
|
|
304
342
|
```html
|
|
305
343
|
<template is="swc-loop" on-get-value="users"
|
|
306
344
|
on-clone-node="if($isElement) $node.querySelector('.name').textContent = $item.name">
|
|
@@ -309,63 +347,12 @@ Efficiently renders lists with surgical updates and index preservation.
|
|
|
309
347
|
</template>
|
|
310
348
|
```
|
|
311
349
|
|
|
312
|
-
### 3. `swc-choose` (Switch-Case Logic)
|
|
313
|
-
Selects the first matching `swc-when` or falls back to `swc-otherwise`.
|
|
314
|
-
```html
|
|
315
|
-
<template is="swc-choose" on-get-value="user.role">
|
|
316
|
-
<template is="swc-default">Please select a role.</template>
|
|
317
|
-
<template is="swc-when" value="admin">Admin Dashboard</template>
|
|
318
|
-
<template is="swc-when" value="user">User Home</template>
|
|
319
|
-
<template is="swc-otherwise">Access Denied</template>
|
|
320
|
-
</template>
|
|
321
|
-
```
|
|
322
|
-
|
|
323
|
-
### 4. `swc-async` (Declarative Promises)
|
|
324
|
-
Handles Promise states (Loading, Error, Success) without manual state management.
|
|
325
|
-
```html
|
|
326
|
-
<template is="swc-async" on-get-value="fetchData()">
|
|
327
|
-
<template is="swc-loading">🌀 Loading...</template>
|
|
328
|
-
<template is="swc-error">❌ Error: {{$error.message}}</template>
|
|
329
|
-
<template is="swc-success">✅ Data: {{$value.title}}</template>
|
|
330
|
-
</template>
|
|
331
|
-
```
|
|
332
|
-
|
|
333
|
-
### Advanced: Integrated Portal Support
|
|
334
|
-
All directives above support the **`on-get-portal`** attribute to render content elsewhere.
|
|
335
|
-
```html
|
|
336
|
-
<template is="swc-if" on-get-value="showModal" on-get-portal="'body'">
|
|
337
|
-
<div class="modal-overlay">I am rendered at the end of <body>!</div>
|
|
338
|
-
</template>
|
|
339
|
-
```
|
|
340
|
-
|
|
341
350
|
---
|
|
342
351
|
|
|
343
|
-
## ⚡ Integrated Event & Query Selectors
|
|
344
|
-
|
|
345
|
-
Both `@addEventListener` and `@query` support special selectors to navigate the environment and component hierarchy seamlessly.
|
|
346
|
-
|
|
347
|
-
| Selector | Target Description |
|
|
348
|
-
|---|---|
|
|
349
|
-
| `:host` | The component itself (default for empty selector). |
|
|
350
|
-
| `:parentHost` | The immediate parent SWC component. |
|
|
351
|
-
| `:appHost` | The nearest parent `<swc-app>` instance. |
|
|
352
|
-
| `:window` | The environment-aware global `window` object. |
|
|
353
|
-
| `:document` | The environment-aware global `document` object. |
|
|
354
|
-
| `:hosts` | Array of all SWC ancestors (Root -> Self). |
|
|
355
|
-
|
|
356
|
-
### Global Event Example
|
|
357
|
-
```typescript
|
|
358
|
-
@elementDefine('auto-cleanup-demo')
|
|
359
|
-
class CleanupDemo extends HTMLElement {
|
|
360
|
-
// Automatically attaches to window and REMOVES on disconnectedCallback
|
|
361
|
-
@addEventListener(':window', 'resize', { removeOnDisconnected: true })
|
|
362
|
-
onResize(event: UIEvent) {
|
|
363
|
-
console.log('Window resized!', this.id);
|
|
364
|
-
}
|
|
365
|
-
}
|
|
366
|
-
```
|
|
367
|
-
|
|
368
352
|
## ⚡ Performance Features
|
|
353
|
+
- **Zero "Deep Scan"**: Listeners and queries are only bound to specific selectors.
|
|
354
|
+
- **Surgical Updates**: Manipulate DOM directly in `@changedAttribute` instead of full re-renders.
|
|
355
|
+
- **Zero Background Overhead**: No polling, no background observers.
|
|
369
356
|
- **Smart Delegation**: Host-level delegation with `__swc_handled` duplicate protection.
|
|
370
357
|
- **Index-Preserving Removal**: `SwcLoop` maintains stable indices during item removal for maximum UI consistency.
|
|
371
358
|
|
|
@@ -17,6 +17,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
18
|
var config_exports = {};
|
|
19
19
|
__export(config_exports, {
|
|
20
|
+
BROWSER_GLOBALS: () => BROWSER_GLOBALS,
|
|
20
21
|
DOM_EVENT_NAMES: () => DOM_EVENT_NAMES,
|
|
21
22
|
HTML_TAG_ENTRIES: () => HTML_TAG_ENTRIES
|
|
22
23
|
});
|
|
@@ -81,4 +82,5 @@ const HTML_TAG_ENTRIES = [
|
|
|
81
82
|
["HTMLBodyElement", "body"]
|
|
82
83
|
];
|
|
83
84
|
const DOM_EVENT_NAMES = ["click", "dblclick", "mousedown", "mouseenter", "mouseleave", "mousemove", "mouseout", "mouseover", "mouseup", "contextmenu", "keydown", "keypress", "keyup", "blur", "change", "focus", "focusin", "focusout", "input", "invalid", "reset", "search", "select", "submit", "drag", "dragend", "dragenter", "dragleave", "dragover", "dragstart", "drop", "copy", "cut", "paste", "abort", "canplay", "canplaythrough", "durationchange", "emptied", "ended", "error", "loadeddata", "loadedmetadata", "loadstart", "pause", "play", "playing", "progress", "ratechange", "seeked", "seeking", "stalled", "suspend", "timeupdate", "volumechange", "waiting", "scroll", "resize", "load", "unload", "hashchange", "connected"];
|
|
85
|
+
const BROWSER_GLOBALS = ["window", "document", "Node", "Element", "HTMLElement", "DocumentFragment", "CustomEvent", "customElements", "NodeFilter", ...HTML_TAG_ENTRIES.map(([className]) => className)];
|
|
84
86
|
//# sourceMappingURL=config.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/config.ts"],
|
|
4
|
-
"sourcesContent": ["export const HTML_TAG_ENTRIES: [string, string][] = [\n ['HTMLAnchorElement', 'a'],\n ['HTMLAreaElement', 'area'],\n ['HTMLAudioElement', 'audio'],\n ['HTMLBaseElement', 'base'],\n ['HTMLButtonElement', 'button'],\n ['HTMLCanvasElement', 'canvas'],\n ['HTMLDataElement', 'data'],\n ['HTMLDataListElement', 'datalist'],\n ['HTMLDetailsElement', 'details'],\n ['HTMLDialogElement', 'dialog'],\n ['HTMLDivElement', 'div'],\n ['HTMLDListElement', 'dl'],\n ['HTMLEmbedElement', 'embed'],\n ['HTMLFieldSetElement', 'fieldset'],\n ['HTMLFormElement', 'form'],\n ['HTMLHRElement', 'hr'],\n ['HTMLIFrameElement', 'iframe'],\n ['HTMLImageElement', 'img'],\n ['HTMLInputElement', 'input'],\n ['HTMLLabelElement', 'label'],\n ['HTMLLegendElement', 'legend'],\n ['HTMLLIElement', 'li'],\n ['HTMLLinkElement', 'link'],\n ['HTMLMapElement', 'map'],\n ['HTMLMetaElement', 'meta'],\n ['HTMLMeterElement', 'meter'],\n ['HTMLModElement', 'del'],\n ['HTMLObjectElement', 'object'],\n ['HTMLOListElement', 'ol'],\n ['HTMLOptGroupElement', 'optgroup'],\n ['HTMLOptionElement', 'option'],\n ['HTMLOutputElement', 'output'],\n ['HTMLParagraphElement', 'p'],\n ['HTMLParamElement', 'param'],\n ['HTMLPictureElement', 'picture'],\n ['HTMLPreElement', 'pre'],\n ['HTMLProgressElement', 'progress'],\n ['HTMLQuoteElement', 'blockquote'],\n ['HTMLScriptElement', 'script'],\n ['HTMLSelectElement', 'select'],\n ['HTMLSlotElement', 'slot'],\n ['HTMLSourceElement', 'source'],\n ['HTMLSpanElement', 'span'],\n ['HTMLStyleElement', 'style'],\n ['HTMLTableElement', 'table'],\n ['HTMLTableSectionElement', 'tbody'],\n ['HTMLTableCellElement', 'td'],\n ['HTMLTemplateElement', 'template'],\n ['HTMLTextAreaElement', 'textarea'],\n ['HTMLTimeElement', 'time'],\n ['HTMLTitleElement', 'title'],\n ['HTMLTableRowElement', 'tr'],\n ['HTMLTrackElement', 'track'],\n ['HTMLUListElement', 'ul'],\n ['HTMLVideoElement', 'video'],\n ['HTMLHeadingElement', 'h1'],\n ['HTMLBodyElement', 'body']\n];\n\nexport const DOM_EVENT_NAMES = ['click', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseout', 'mouseover', 'mouseup', 'contextmenu', 'keydown', 'keypress', 'keyup', 'blur', 'change', 'focus', 'focusin', 'focusout', 'input', 'invalid', 'reset', 'search', 'select', 'submit', 'drag', 'dragend', 'dragenter', 'dragleave', 'dragover', 'dragstart', 'drop', 'copy', 'cut', 'paste', 'abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting', 'scroll', 'resize', 'load', 'unload', 'hashchange', 'connected'];\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["export const HTML_TAG_ENTRIES: [string, string][] = [\n ['HTMLAnchorElement', 'a'],\n ['HTMLAreaElement', 'area'],\n ['HTMLAudioElement', 'audio'],\n ['HTMLBaseElement', 'base'],\n ['HTMLButtonElement', 'button'],\n ['HTMLCanvasElement', 'canvas'],\n ['HTMLDataElement', 'data'],\n ['HTMLDataListElement', 'datalist'],\n ['HTMLDetailsElement', 'details'],\n ['HTMLDialogElement', 'dialog'],\n ['HTMLDivElement', 'div'],\n ['HTMLDListElement', 'dl'],\n ['HTMLEmbedElement', 'embed'],\n ['HTMLFieldSetElement', 'fieldset'],\n ['HTMLFormElement', 'form'],\n ['HTMLHRElement', 'hr'],\n ['HTMLIFrameElement', 'iframe'],\n ['HTMLImageElement', 'img'],\n ['HTMLInputElement', 'input'],\n ['HTMLLabelElement', 'label'],\n ['HTMLLegendElement', 'legend'],\n ['HTMLLIElement', 'li'],\n ['HTMLLinkElement', 'link'],\n ['HTMLMapElement', 'map'],\n ['HTMLMetaElement', 'meta'],\n ['HTMLMeterElement', 'meter'],\n ['HTMLModElement', 'del'],\n ['HTMLObjectElement', 'object'],\n ['HTMLOListElement', 'ol'],\n ['HTMLOptGroupElement', 'optgroup'],\n ['HTMLOptionElement', 'option'],\n ['HTMLOutputElement', 'output'],\n ['HTMLParagraphElement', 'p'],\n ['HTMLParamElement', 'param'],\n ['HTMLPictureElement', 'picture'],\n ['HTMLPreElement', 'pre'],\n ['HTMLProgressElement', 'progress'],\n ['HTMLQuoteElement', 'blockquote'],\n ['HTMLScriptElement', 'script'],\n ['HTMLSelectElement', 'select'],\n ['HTMLSlotElement', 'slot'],\n ['HTMLSourceElement', 'source'],\n ['HTMLSpanElement', 'span'],\n ['HTMLStyleElement', 'style'],\n ['HTMLTableElement', 'table'],\n ['HTMLTableSectionElement', 'tbody'],\n ['HTMLTableCellElement', 'td'],\n ['HTMLTemplateElement', 'template'],\n ['HTMLTextAreaElement', 'textarea'],\n ['HTMLTimeElement', 'time'],\n ['HTMLTitleElement', 'title'],\n ['HTMLTableRowElement', 'tr'],\n ['HTMLTrackElement', 'track'],\n ['HTMLUListElement', 'ul'],\n ['HTMLVideoElement', 'video'],\n ['HTMLHeadingElement', 'h1'],\n ['HTMLBodyElement', 'body']\n];\n\nexport const DOM_EVENT_NAMES = ['click', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseout', 'mouseover', 'mouseup', 'contextmenu', 'keydown', 'keypress', 'keyup', 'blur', 'change', 'focus', 'focusin', 'focusout', 'input', 'invalid', 'reset', 'search', 'select', 'submit', 'drag', 'dragend', 'dragenter', 'dragleave', 'dragover', 'dragstart', 'drop', 'copy', 'cut', 'paste', 'abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting', 'scroll', 'resize', 'load', 'unload', 'hashchange', 'connected'];\n\nexport const BROWSER_GLOBALS = ['window', 'document', 'Node', 'Element', 'HTMLElement', 'DocumentFragment', 'CustomEvent', 'customElements', 'NodeFilter', ...HTML_TAG_ENTRIES.map(([className]) => className)];\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -24,15 +24,15 @@ __export(addEventListener_exports, {
|
|
|
24
24
|
module.exports = __toCommonJS(addEventListener_exports);
|
|
25
25
|
var import_ReflectUtils = require("@dooboostore/core/reflect/ReflectUtils");
|
|
26
26
|
const ADD_EVENT_LISTENER_METADATA_KEY = Symbol("simple-web-component:add-event-listener");
|
|
27
|
-
function addEventListener(
|
|
28
|
-
return (
|
|
29
|
-
const constructor =
|
|
27
|
+
function addEventListener(selectorOrTarget, type, options = {}) {
|
|
28
|
+
return (targetObj, propertyKey, descriptor) => {
|
|
29
|
+
const constructor = targetObj.constructor;
|
|
30
30
|
let listeners = import_ReflectUtils.ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
|
|
31
31
|
if (!listeners) {
|
|
32
32
|
listeners = [];
|
|
33
33
|
import_ReflectUtils.ReflectUtils.defineMetadata(ADD_EVENT_LISTENER_METADATA_KEY, listeners, constructor);
|
|
34
34
|
}
|
|
35
|
-
listeners.push({ selector, type, options
|
|
35
|
+
listeners.push({ propertyKey, selector: selectorOrTarget, type, options });
|
|
36
36
|
};
|
|
37
37
|
}
|
|
38
38
|
const getAddEventListenerMetadata = (target) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/addEventListener.ts"],
|
|
4
|
-
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core/reflect/ReflectUtils';\n\nexport interface
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA6B;AAqBtB,MAAM,kCAAkC,OAAO,yCAAyC;AAOxF,SAAS,iBAAiB,
|
|
4
|
+
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core/reflect/ReflectUtils';\nimport { SpecialSelector, SwcQueryOptions } from '../types';\n\nexport interface AddEventListenerBaseOptions extends EventListenerOptions {\n capture?: boolean;\n once?: boolean;\n passive?: boolean;\n stopPropagation?: boolean;\n stopImmediatePropagation?: boolean;\n preventDefault?: boolean;\n removeOnDisconnected?: boolean;\n delegate?: boolean;\n}\n\nexport interface AddEventListenerMetadata {\n propertyKey: string | symbol;\n selector: string;\n type: string;\n options: AddEventListenerBaseOptions & SwcQueryOptions & { delegate?: boolean };\n}\n\nexport const ADD_EVENT_LISTENER_METADATA_KEY = Symbol('simple-web-component:add-event-listener');\n\nexport function addEventListener(target: SpecialSelector, type: string, options?: AddEventListenerBaseOptions): MethodDecorator;\nexport function addEventListener(selector: string, type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions & { delegate?: boolean }): MethodDecorator;\n/**\n * @addEventListener decorator to bind events to elements.\n */\nexport function addEventListener(selectorOrTarget: string, type: string, options: any = {}): MethodDecorator {\n return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = targetObj.constructor;\n\n let listeners = ReflectUtils.getMetadata<AddEventListenerMetadata[]>(ADD_EVENT_LISTENER_METADATA_KEY, constructor);\n if (!listeners) {\n listeners = [];\n ReflectUtils.defineMetadata(ADD_EVENT_LISTENER_METADATA_KEY, listeners, constructor);\n }\n\n listeners.push({ propertyKey, selector: selectorOrTarget, type, options });\n };\n}\n\nexport const getAddEventListenerMetadata = (target: any): AddEventListenerMetadata[] | undefined => {\n const constructor = target instanceof Function ? target : target.constructor;\n return ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA6B;AAqBtB,MAAM,kCAAkC,OAAO,yCAAyC;AAOxF,SAAS,iBAAiB,kBAA0B,MAAc,UAAe,CAAC,GAAoB;AAC3G,SAAO,CAAC,WAAmB,aAA8B,eAAmC;AAC1F,UAAM,cAAc,UAAU;AAE9B,QAAI,YAAY,iCAAa,YAAwC,iCAAiC,WAAW;AACjH,QAAI,CAAC,WAAW;AACd,kBAAY,CAAC;AACb,uCAAa,eAAe,iCAAiC,WAAW,WAAW;AAAA,IACrF;AAEA,cAAU,KAAK,EAAE,aAAa,UAAU,kBAAkB,MAAM,QAAQ,CAAC;AAAA,EAC3E;AACF;AAEO,MAAM,8BAA8B,CAAC,WAAwD;AAClG,QAAM,cAAc,kBAAkB,WAAW,SAAS,OAAO;AACjE,SAAO,iCAAa,YAAY,iCAAiC,WAAW;AAC9E;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var appendChild_exports = {};
|
|
19
|
+
__export(appendChild_exports, {
|
|
20
|
+
APPEND_CHILD_METADATA_KEY: () => APPEND_CHILD_METADATA_KEY,
|
|
21
|
+
appendChild: () => appendChild,
|
|
22
|
+
findAllAppendChildMetadata: () => findAllAppendChildMetadata
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(appendChild_exports);
|
|
25
|
+
var import_ReflectUtils = require("@dooboostore/core/reflect/ReflectUtils");
|
|
26
|
+
var import_elementDefine = require("./elementDefine");
|
|
27
|
+
const APPEND_CHILD_METADATA_KEY = Symbol("simple-web-component:append-child");
|
|
28
|
+
const normalizeNodes = (res, doc) => {
|
|
29
|
+
const items = Array.isArray(res) ? res : [res];
|
|
30
|
+
return items.map((it) => {
|
|
31
|
+
if (it instanceof Node)
|
|
32
|
+
return it;
|
|
33
|
+
return doc.createTextNode(it !== void 0 && it !== null ? String(it) : "");
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
function appendChild(selector, options = { position: "beforeEnd" }) {
|
|
37
|
+
return (target, propertyKey, descriptor) => {
|
|
38
|
+
const constructor = target.constructor;
|
|
39
|
+
let metaList = import_ReflectUtils.ReflectUtils.getOwnMetadata(APPEND_CHILD_METADATA_KEY, constructor);
|
|
40
|
+
if (!metaList) {
|
|
41
|
+
metaList = /* @__PURE__ */ new Map();
|
|
42
|
+
import_ReflectUtils.ReflectUtils.defineMetadata(APPEND_CHILD_METADATA_KEY, metaList, constructor);
|
|
43
|
+
}
|
|
44
|
+
metaList.set(propertyKey, { propertyKey, selector, options });
|
|
45
|
+
const original = descriptor.value;
|
|
46
|
+
descriptor.value = async function(...args) {
|
|
47
|
+
(0, import_elementDefine.ensureInit)(this);
|
|
48
|
+
const res = await original.apply(this, args);
|
|
49
|
+
if (res !== void 0) {
|
|
50
|
+
const conf = (0, import_elementDefine.getElementConfig)(this);
|
|
51
|
+
const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
|
|
52
|
+
const currentDoc = currentWin.document;
|
|
53
|
+
let targetEl = null;
|
|
54
|
+
if (selector === ":host" || !selector) {
|
|
55
|
+
targetEl = this;
|
|
56
|
+
} else {
|
|
57
|
+
targetEl = (this.shadowRoot || this).querySelector(selector);
|
|
58
|
+
}
|
|
59
|
+
if (targetEl) {
|
|
60
|
+
const nodes = normalizeNodes(res, currentDoc);
|
|
61
|
+
const pos = options.position || "beforeEnd";
|
|
62
|
+
if (typeof res === "string") {
|
|
63
|
+
targetEl.insertAdjacentText(pos, res);
|
|
64
|
+
} else if (Array.isArray(res) && res.every((n) => typeof n === "string")) {
|
|
65
|
+
targetEl.insertAdjacentText(pos, res.join(""));
|
|
66
|
+
} else {
|
|
67
|
+
if (pos === "beforeEnd")
|
|
68
|
+
targetEl.append(...nodes);
|
|
69
|
+
else if (pos === "afterBegin")
|
|
70
|
+
targetEl.prepend(...nodes);
|
|
71
|
+
else if (pos === "beforeBegin")
|
|
72
|
+
targetEl.before(...nodes);
|
|
73
|
+
else if (pos === "afterEnd")
|
|
74
|
+
targetEl.after(...nodes);
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
return res;
|
|
79
|
+
};
|
|
80
|
+
};
|
|
81
|
+
}
|
|
82
|
+
const findAllAppendChildMetadata = (target) => {
|
|
83
|
+
const result = /* @__PURE__ */ new Map();
|
|
84
|
+
const maps = import_ReflectUtils.ReflectUtils.findAllMetadata(APPEND_CHILD_METADATA_KEY, target);
|
|
85
|
+
maps.forEach((map) => {
|
|
86
|
+
if (map instanceof Map) {
|
|
87
|
+
map.forEach((v, k) => result.set(k, v));
|
|
88
|
+
}
|
|
89
|
+
});
|
|
90
|
+
return result;
|
|
91
|
+
};
|
|
92
|
+
//# sourceMappingURL=appendChild.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/decorators/appendChild.ts"],
|
|
4
|
+
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core/reflect/ReflectUtils';\nimport { ensureInit, getElementConfig } from './elementDefine';\n\nexport type AppendChildPosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd';\n\nexport interface AppendChildOptions {\n position?: AppendChildPosition;\n}\n\nexport interface AppendChildMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: AppendChildOptions;\n}\n\nexport const APPEND_CHILD_METADATA_KEY = Symbol('simple-web-component:append-child');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n const items = Array.isArray(res) ? res : [res];\n return items.map(it => {\n if (it instanceof Node) return it;\n return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n });\n};\n\n/**\n * @appendChild decorator to surgically add nodes to a target element.\n * Usage: @appendChild('#list') addItem() { return '<li>New Item</li>'; }\n */\nexport function appendChild(selector: string, options: AppendChildOptions = { position: 'beforeEnd' }): MethodDecorator {\n return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = target.constructor;\n let metaList = ReflectUtils.getOwnMetadata(APPEND_CHILD_METADATA_KEY, constructor) as Map<string | symbol, AppendChildMetadata>;\n if (!metaList) {\n metaList = new Map<string | symbol, AppendChildMetadata>();\n ReflectUtils.defineMetadata(APPEND_CHILD_METADATA_KEY, metaList, constructor);\n }\n metaList.set(propertyKey, { propertyKey, selector, options });\n\n const original = descriptor.value;\n descriptor.value = async function (...args: any[]) {\n ensureInit(this);\n const res = await original.apply(this, args);\n if (res !== undefined) {\n const conf = getElementConfig(this);\n const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n const currentDoc = currentWin.document;\n\n let targetEl: HTMLElement | null = null;\n if (selector === ':host' || !selector) {\n targetEl = this as any;\n } else {\n targetEl = (this.shadowRoot || (this as any)).querySelector(selector);\n }\n\n if (targetEl) {\n const nodes = normalizeNodes(res, currentDoc);\n const pos = options.position || 'beforeEnd';\n\n if (typeof res === 'string') {\n targetEl.insertAdjacentText(pos as InsertPosition, res);\n } else if (Array.isArray(res) && res.every(n => typeof n === 'string')) {\n targetEl.insertAdjacentText(pos as InsertPosition, res.join(''));\n } else {\n if (pos === 'beforeEnd') targetEl.append(...nodes);\n else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n else if (pos === 'beforeBegin') targetEl.before(...nodes);\n else if (pos === 'afterEnd') targetEl.after(...nodes);\n }\n }\n }\n return res;\n };\n };\n}\n\nexport const findAllAppendChildMetadata = (target: any): Map<string | symbol, AppendChildMetadata> => {\n const result = new Map<string | symbol, AppendChildMetadata>();\n const maps = ReflectUtils.findAllMetadata<Map<string | symbol, AppendChildMetadata>>(APPEND_CHILD_METADATA_KEY, target);\n maps.forEach(map => {\n if (map instanceof Map) {\n map.forEach((v, k) => result.set(k, v));\n }\n });\n return result;\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;;;;;;;0BAA6B;AAC7B,2BAA6C;AActC,MAAM,4BAA4B,OAAO,mCAAmC;AAEnF,MAAM,iBAAiB,CAAC,KAAU,QAAyB;AACzD,QAAM,QAAQ,MAAM,QAAQ,GAAG,IAAI,MAAM,CAAC,GAAG;AAC7C,SAAO,MAAM,IAAI,QAAK;AACpB,QAAI,cAAc;AAAM,aAAO;AAC/B,WAAO,IAAI,eAAe,OAAO,UAAa,OAAO,OAAO,OAAO,EAAE,IAAI,EAAE;EAC7E,CAAC;AACH;AAMM,SAAU,YAAY,UAAkB,UAA8B,EAAE,UAAU,YAAW,GAAE;AACnG,SAAO,CAAC,QAAgB,aAA8B,eAAkC;AACtF,UAAM,cAAc,OAAO;AAC3B,QAAI,WAAW,iCAAa,eAAe,2BAA2B,WAAW;AACjF,QAAI,CAAC,UAAU;AACb,iBAAW,oBAAI,IAAG;AAClB,uCAAa,eAAe,2BAA2B,UAAU,WAAW;IAC9E;AACA,aAAS,IAAI,aAAa,EAAE,aAAa,UAAU,QAAO,CAAE;AAE5D,UAAM,WAAW,WAAW;AAC5B,eAAW,QAAQ,kBAAmB,MAAW;AAC/C,2CAAW,IAAI;AACf,YAAM,MAAM,MAAM,SAAS,MAAM,MAAM,IAAI;AAC3C,UAAI,QAAQ,QAAW;AACrB,cAAM,WAAO,uCAAiB,IAAI;AAClC,cAAM,aAAc,KAAa,iBAAiB,IAAI,MAAO,OAAO,WAAW,cAAc,SAAS;AACtG,cAAM,aAAa,WAAW;AAE9B,YAAI,WAA+B;AACnC,YAAI,aAAa,WAAW,CAAC,UAAU;AACrC,qBAAW;QACb,OAAO;AACL,sBAAY,KAAK,cAAe,MAAc,cAAc,QAAQ;QACtE;AAEA,YAAI,UAAU;AACZ,gBAAM,QAAQ,eAAe,KAAK,UAAU;AAC5C,gBAAM,MAAM,QAAQ,YAAY;AAEhC,cAAI,OAAO,QAAQ,UAAU;AAC3B,qBAAS,mBAAmB,KAAuB,GAAG;UACxD,WAAW,MAAM,QAAQ,GAAG,KAAK,IAAI,MAAM,OAAK,OAAO,MAAM,QAAQ,GAAG;AACtE,qBAAS,mBAAmB,KAAuB,IAAI,KAAK,EAAE,CAAC;UACjE,OAAO;AACL,gBAAI,QAAQ;AAAa,uBAAS,OAAO,GAAG,KAAK;qBACxC,QAAQ;AAAc,uBAAS,QAAQ,GAAG,KAAK;qBAC/C,QAAQ;AAAe,uBAAS,OAAO,GAAG,KAAK;qBAC/C,QAAQ;AAAY,uBAAS,MAAM,GAAG,KAAK;UACtD;QACF;MACF;AACA,aAAO;IACT;EACF;AACF;AAEO,MAAM,6BAA6B,CAAC,WAA0D;AACnG,QAAM,SAAS,oBAAI,IAAG;AACtB,QAAM,OAAO,iCAAa,gBAA2D,2BAA2B,MAAM;AACtH,OAAK,QAAQ,SAAM;AACjB,QAAI,eAAe,KAAK;AACtB,UAAI,QAAQ,CAAC,GAAG,MAAM,OAAO,IAAI,GAAG,CAAC,CAAC;IACxC;EACF,CAAC;AACD,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|