@dnncommunity/dnn-elements 0.13.1 → 0.14.0-beta.1
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 +2 -2
- package/dist/cjs/dnn-button.cjs.entry.js +1 -1
- package/dist/cjs/{dnn-button_14.cjs.entry.js → dnn-button_16.cjs.entry.js} +274 -38
- package/dist/cjs/dnn-button_16.cjs.entry.js.map +1 -0
- package/dist/cjs/dnn-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/dnn-chevron.cjs.entry.js +1 -1
- package/dist/cjs/dnn-collapsible.cjs.entry.js +1 -1
- package/dist/cjs/dnn-color-picker.cjs.entry.js +1 -1
- package/dist/cjs/dnn-dropzone.cjs.entry.js +1 -1
- package/dist/cjs/dnn-image-cropper.cjs.entry.js +7 -23
- package/dist/cjs/dnn-image-cropper.cjs.entry.js.map +1 -1
- package/dist/cjs/dnn-modal.cjs.entry.js +1 -1
- package/dist/cjs/dnn-searchbox.cjs.entry.js +1 -1
- package/dist/cjs/dnn-sort-icon.cjs.entry.js +1 -1
- package/dist/cjs/dnn-tab.cjs.entry.js +1 -1
- package/dist/cjs/dnn-tabs.cjs.entry.js +5 -3
- package/dist/cjs/dnn-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/dnn-toggle.cjs.entry.js +1 -1
- package/dist/cjs/dnn-treeview-item.cjs.entry.js +15 -13
- package/dist/cjs/dnn-treeview-item.cjs.entry.js.map +1 -1
- package/dist/cjs/dnn-vertical-overflow-menu.cjs.entry.js +123 -0
- package/dist/cjs/dnn-vertical-overflow-menu.cjs.entry.js.map +1 -0
- package/dist/cjs/dnn-vertical-splitview.cjs.entry.js +123 -0
- package/dist/cjs/dnn-vertical-splitview.cjs.entry.js.map +1 -0
- package/dist/cjs/dnn.cjs.js +2 -2
- package/dist/cjs/{index-e85ec026.js → index-6a6ac523.js} +4 -1
- package/dist/cjs/index-6a6ac523.js.map +1 -0
- package/dist/cjs/{index-eede7745.js → index-ba8b86b1.js} +2 -2
- package/dist/cjs/index-ba8b86b1.js.map +1 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/mouseUtilities-75be531a.js +25 -0
- package/dist/cjs/mouseUtilities-75be531a.js.map +1 -0
- package/dist/collection/collection-manifest.json +3 -1
- package/dist/collection/components/dnn-image-cropper/dnn-image-cropper.js +6 -22
- package/dist/collection/components/dnn-image-cropper/dnn-image-cropper.js.map +1 -1
- package/dist/collection/components/dnn-tabs/dnn-tabs.js +4 -2
- package/dist/collection/components/dnn-tabs/dnn-tabs.js.map +1 -1
- package/dist/collection/components/dnn-treeview-item/dnn-treeview-item.js +14 -12
- package/dist/collection/components/dnn-treeview-item/dnn-treeview-item.js.map +1 -1
- package/dist/collection/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.css +77 -0
- package/dist/collection/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.js +132 -0
- package/dist/collection/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.js.map +1 -0
- package/dist/collection/components/dnn-vertical-splitview/dnn-vertical-splitview.css +21 -0
- package/dist/collection/components/dnn-vertical-splitview/dnn-vertical-splitview.js +219 -0
- package/dist/collection/components/dnn-vertical-splitview/dnn-vertical-splitview.js.map +1 -0
- package/dist/collection/utilities/mouseUtilities.js +20 -0
- package/dist/collection/utilities/mouseUtilities.js.map +1 -0
- package/dist/dnn/dnn-button.entry.js +1 -1
- package/dist/dnn/dnn-checkbox.entry.js +1 -1
- package/dist/dnn/dnn-chevron.entry.js +1 -1
- package/dist/dnn/dnn-collapsible.entry.js +1 -1
- package/dist/dnn/dnn-color-picker.entry.js +1 -1
- package/dist/dnn/dnn-dropzone.entry.js +1 -1
- package/dist/dnn/dnn-image-cropper.entry.js +7 -23
- package/dist/dnn/dnn-image-cropper.entry.js.map +1 -1
- package/dist/dnn/dnn-modal.entry.js +1 -1
- package/dist/dnn/dnn-searchbox.entry.js +1 -1
- package/dist/dnn/dnn-sort-icon.entry.js +1 -1
- package/dist/dnn/dnn-tab.entry.js +1 -1
- package/dist/dnn/dnn-tabs.entry.js +5 -3
- package/dist/dnn/dnn-tabs.entry.js.map +1 -1
- package/dist/dnn/dnn-toggle.entry.js +1 -1
- package/dist/dnn/dnn-treeview-item.entry.js +15 -13
- package/dist/dnn/dnn-treeview-item.entry.js.map +1 -1
- package/dist/dnn/dnn-vertical-overflow-menu.entry.js +119 -0
- package/dist/dnn/dnn-vertical-overflow-menu.entry.js.map +1 -0
- package/dist/dnn/dnn-vertical-splitview.entry.js +119 -0
- package/dist/dnn/dnn-vertical-splitview.entry.js.map +1 -0
- package/dist/dnn/dnn.esm.js +2 -2
- package/dist/dnn/{index-6c0764e5.js → index-3e56049b.js} +2 -2
- package/dist/dnn/index-3e56049b.js.map +1 -0
- package/dist/dnn/mouseUtilities-817973b4.js +23 -0
- package/dist/dnn/mouseUtilities-817973b4.js.map +1 -0
- package/dist/dnn/p-d10994a3.js +2 -0
- package/dist/dnn/p-d10994a3.js.map +1 -0
- package/dist/dnn/{p-7acf3104.entry.js → p-fef1bc51.entry.js} +4 -4
- package/dist/dnn/p-fef1bc51.entry.js.map +1 -0
- package/dist/esm/dnn-button.entry.js +1 -1
- package/dist/esm/{dnn-button_14.entry.js → dnn-button_16.entry.js} +273 -39
- package/dist/esm/dnn-button_16.entry.js.map +1 -0
- package/dist/esm/dnn-checkbox.entry.js +1 -1
- package/dist/esm/dnn-chevron.entry.js +1 -1
- package/dist/esm/dnn-collapsible.entry.js +1 -1
- package/dist/esm/dnn-color-picker.entry.js +1 -1
- package/dist/esm/dnn-dropzone.entry.js +1 -1
- package/dist/esm/dnn-image-cropper.entry.js +7 -23
- package/dist/esm/dnn-image-cropper.entry.js.map +1 -1
- package/dist/esm/dnn-modal.entry.js +1 -1
- package/dist/esm/dnn-searchbox.entry.js +1 -1
- package/dist/esm/dnn-sort-icon.entry.js +1 -1
- package/dist/esm/dnn-tab.entry.js +1 -1
- package/dist/esm/dnn-tabs.entry.js +5 -3
- package/dist/esm/dnn-tabs.entry.js.map +1 -1
- package/dist/esm/dnn-toggle.entry.js +1 -1
- package/dist/esm/dnn-treeview-item.entry.js +15 -13
- package/dist/esm/dnn-treeview-item.entry.js.map +1 -1
- package/dist/esm/dnn-vertical-overflow-menu.entry.js +119 -0
- package/dist/esm/dnn-vertical-overflow-menu.entry.js.map +1 -0
- package/dist/esm/dnn-vertical-splitview.entry.js +119 -0
- package/dist/esm/dnn-vertical-splitview.entry.js.map +1 -0
- package/dist/esm/dnn.js +2 -2
- package/dist/esm/{index-f79d9e82.js → index-212d30ec.js} +4 -1
- package/dist/esm/index-212d30ec.js.map +1 -0
- package/dist/esm/{index-6c0764e5.js → index-3e56049b.js} +2 -2
- package/dist/esm/index-3e56049b.js.map +1 -0
- package/dist/esm/loader.js +2 -2
- package/dist/esm/mouseUtilities-817973b4.js +23 -0
- package/dist/esm/mouseUtilities-817973b4.js.map +1 -0
- package/dist/types/components/dnn-image-cropper/dnn-image-cropper.d.ts +0 -1
- package/dist/types/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.d.ts +17 -0
- package/dist/types/components/dnn-vertical-splitview/dnn-vertical-splitview.d.ts +21 -0
- package/dist/types/components.d.ts +54 -0
- package/dist/types/utilities/mouseUtilities.d.ts +4 -0
- package/package.json +1 -1
- package/dist/cjs/dnn-button_14.cjs.entry.js.map +0 -1
- package/dist/cjs/index-e85ec026.js.map +0 -1
- package/dist/cjs/index-eede7745.js.map +0 -1
- package/dist/dnn/index-6c0764e5.js.map +0 -1
- package/dist/dnn/p-7acf3104.entry.js.map +0 -1
- package/dist/dnn/p-bd3d3361.js +0 -2
- package/dist/dnn/p-bd3d3361.js.map +0 -1
- package/dist/esm/dnn-button_14.entry.js.map +0 -1
- package/dist/esm/index-6c0764e5.js.map +0 -1
- package/dist/esm/index-f79d9e82.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["src/components/dnn-button/dnn-button.scss?tag=dnn-button&encapsulation=shadow","src/components/dnn-button/dnn-button.tsx","src/components/dnn-checkbox/dnn-checkbox.scss?tag=dnn-checkbox&encapsulation=shadow","src/components/dnn-checkbox/dnn-checkbox.tsx","src/components/dnn-chevron/dnn-chevron.scss?tag=dnn-chevron&encapsulation=shadow","src/components/dnn-chevron/dnn-chevron.tsx","src/components/dnn-collapsible/dnn-collapsible.scss?tag=dnn-collapsible&encapsulation=shadow","src/components/dnn-collapsible/dnn-collapsible.tsx","src/utilities/colorInfo.ts","src/components/dnn-color-picker/dnn-color-picker.scss?tag=dnn-color-picker&encapsulation=shadow","src/components/dnn-color-picker/dnn-color-picker.tsx","src/components/dnn-dropzone/dnn-dropzone.scss?tag=dnn-dropzone&encapsulation=shadow","src/components/dnn-dropzone/dnn-dropzone.tsx","src/components/dnn-image-cropper/CornerType.ts","src/components/dnn-image-cropper/dnn-image-cropper.scss?tag=dnn-image-cropper&encapsulation=shadow","src/components/dnn-image-cropper/dnn-image-cropper.tsx","src/components/dnn-modal/dnn-modal.scss?tag=dnn-modal&encapsulation=shadow","src/components/dnn-modal/dnn-modal.tsx","src/components/dnn-searchbox/dnn-searchbox.scss?tag=dnn-searchbox&encapsulation=shadow","src/components/dnn-searchbox/dnn-searchbox.tsx","src/components/dnn-sort-icon/dnn-sort-icon.scss?tag=dnn-sort-icon&encapsulation=shadow","src/components/dnn-sort-icon/dnn-sort-icon.tsx","src/components/dnn-tab/dnn-tab.scss?tag=dnn-tab&encapsulation=shadow","src/components/dnn-tab/dnn-tab.tsx","src/components/dnn-tabs/dnn-tabs.scss?tag=dnn-tabs&encapsulation=shadow","src/components/dnn-tabs/dnn-tabs.tsx","src/components/dnn-toggle/dnn-toggle.scss?tag=dnn-toggle&encapsulation=shadow","src/components/dnn-toggle/dnn-toggle.tsx","src/components/dnn-treeview-item/dnn-treeview-item.scss?tag=dnn-treeview-item&encapsulation=shadow","src/components/dnn-treeview-item/dnn-treeview-item.tsx"],"names":["dnnButtonCss","DnnButton","[object Object]","hostRef","this","type","reversed","size","confirm","confirmYesText","confirmNoText","confirmMessage","disabled","modalVisible","el","classList","add","modal","shadowRoot","querySelector","hide","confirmed","emit","canceled","show","h","Host","style","pointer-events","class","onClick","handleClick","showCloseButton","backdropDismiss","display","justifyContent","margin","handleConfirm","handleCancel","dnnCheckboxCss","DnnCheckbox","checked","useIntermediate","emitEvents","button","remove","undefined","checkedchange","changeState","ref","xmlns","height","viewBox","width","fill","d","enable-background","htmlFor","id","dnnChevronCss","DnnChevron","expandText","collapseText","expanded","newValue","changed","aria-label","dnnCollapsibleCss","DnnCollapsible","transitionDuration","animating","requestAnimationFrame","container","scrollHeight","dnnCollapsibleHeightChanged","updateComponentSize","newHeight","assignedElements","forEach","node","setTimeout","mutationList","mutation","target","closest","updateSize","mutationObserver","MutationObserver","handleMutation","childNodes","element","observe","attributes","characterData","childList","subtree","slot","addEventListener","disconnect","Debounce","ColorInfo","_hue","_saturation","_lightness","hue","value","saturation","lightness","red","getRGB","setHSL","green","blue","hex","r","getHex","g","b","parseInt","substr","contrastColor","brightness","chroma","Math","abs","quadrant","offset","bias","round","min","max","diff","s","l","toString","length","dnnColorPickerCss","DnnColorPicker","color","colorBoxHeight","rgbDisplay","hslDisplay","hexDisplay","handleSaturationLightnessMouseDown","e","preventDefault","handleDragLightnessSaturation","window","handleSaturationLightnessMouseUp","rect","saturationLightnessBox","getBoundingClientRect","x","clientX","left","y","clientY","top","newColor","currentColor","removeEventListener","handleHueMouseDown","handleDragHue","handleHueMouseUp","hueRange","handleComponentValueChange","channel","isNaN","handleHSLChange","component","handleSaturationLightnessKeyDown","shiftKey","key","handleHueKeyDown","colorChanged","colorChangedHandler","handleHexChange","setProperty","getDoublet","valueString","toUpperCase","match","backgroundColor","onMouseDown","bind","role","aria-valuemin","aria-valuemax","aria-valuetext","bottom","onKeyDown","boxShadow","getContrast","aria-valuenow","step","onChange","switchColorMode","__decorate","dnnDropzoneCss","DnnDropzone","resx","dragAndDropFile","capture","or","takePicture","uploadFile","allowCameraMode","captureQuality","canTakeSnapshots","takingPicture","handleDragOver","event","stopPropagation","dataTransfer","dropEffect","dropzone","handleDrop","dropEvent","files","hasInvalidExtensions","fileList","getFilesFromFileList","filesSelected","checkIfBrowserCanTakeSnapshots","then","result","allowedExtensions","extensionsWithDots","map","extensionsList","join","fileInput","accept","Promise","resolve","mediaDevices","navigator","enumerateDevices","devices","some","device","kind","index","file","push","hasInvalid","fileIndex","regex","fileExtension","exec","name","includes","getUserMedia","video","audio","stream","videoPreview","srcObject","play","videoSettings","getVideoTracks","getSettings","catch","error","alert","canvas","document","createElement","context","getContext","drawImage","toBlob","blob","File","onDragOver","onDrop","onDragLeave","_a","_b","handleUploadButton","_c","_d","takeSnapshot","cx","cy","_e","applySnapshot","_f","CornerType","dnnImageCropperCss","DnnImageCropper","imageTooSmall","modalCloseText","quality","preventUndersized","handleCropMouseDown","className","handleImageCropFinished","handleCropDrag","handleNwMouseMove","handleNeMouseMove","handleSeMouseMove","handleSwMouseMove","_ev","emitImage","previousTouch","handleCornerDrag","nw","ne","se","sw","corner","isMouseStillInTarget","getCornerLeftTop","newWidth","orientation","wantedRatio","cropRect","crop","imageRect","image","movementX","movementY","getMouvementFromEvent","topOffset","offsetTop","leftOffset","offsetLeft","zoomRatio","naturalWidth","ev","newLeft","newTop","setView","newView","views","host","querySelectorAll","v","noPictureView","hasPictureView","view","imageRatio","wantedHeight","wantedWidth","initCrop","src","toDataURL","split","reader","FileReader","onload","readerLoadEvent","img","Image","imageTooSmallModal","ctx","setImage","readAsDataURL","naturalHeight","dataUrl","generateCroppedImage","imageCropChanged","desiredWidth","desiredHeight","clearRect","MouseEvent","TouchEvent","touch","touches","pageX","pageY","inside","mouseX","mouseY","corners","cornerRect","onTouchStart","onFilesSelected","handleNewFile","detail","close-text","replace","dnnModalCss","DnnModal","closeText","visible","dismissed","handleDismiss","handleBackdropClick","dnnSearchboxCss","DnnSearchbox","placeholder","debounced","query","debouncedHandleQueryChanged","handleQueryChanged","queryChanged","onInput","dnnSortIconCss","DnnSortIcon","sortDirection","sortChanged","active","changeSort","dnnTabCss","DnnTab","dnnTabsCss","DnnTabs","tabTitles","selectedTabTitle","updateTitles","showFirstTab","tabs","getTabs","tab","tabTitle","showTab","dnnToggleCss","DnnToggle","isChecked","checkChanged","dnnTreeviewItemCss","DnnTreeviewItem","hasChildren","children","childrenElement","count","expander","collapsible","toggleCollapse"],"mappings":"oGAAA,MAAMA,EAAe,o9DCURC,EAAS,MALtBC,YAAAC,qFAWUC,KAAAC,KAA6C,UAK7CD,KAAAE,SAAoB,MAKpBF,KAAAG,KAAsC,SAKtCH,KAAAI,QAAoB,MAKpBJ,KAAAK,eAA0B,MAK1BL,KAAAM,cAAyB,KAKzBN,KAAAO,eAA0B,iBAK1BP,KAAAQ,SAAoB,MAEnBR,KAAAS,aAAwB,MAqBjCX,mBACEE,KAAKU,GAAGC,UAAUC,IAAIZ,KAAKC,MAE3B,GAAID,KAAKE,SAAS,CAChBF,KAAKU,GAAGC,UAAUC,IAAI,YAGxB,GAAIZ,KAAKG,OAAS,SAAS,CACzBH,KAAKU,GAAGC,UAAUC,IAAIZ,KAAKG,MAG7BH,KAAKa,MAAQb,KAAKU,GAAGI,WAAWC,cAAc,aAGxCjB,gBACNE,KAAKa,MAAMG,OACXhB,KAAKS,aAAe,MACpBT,KAAKiB,UAAUC,OAGTpB,eACNE,KAAKa,MAAMG,OACXhB,KAAKS,aAAe,MACpBT,KAAKmB,SAASD,OAGRpB,cACN,GAAIE,KAAKI,UAAYJ,KAAKS,aAAa,CACrCT,KAAKa,MAAMO,OACXpB,KAAKS,aAAe,MAIxBX,SACE,OACEuB,EAACC,EAAI,CAACd,SAAUR,KAAKQ,SAAUe,MAAO,CAACC,iBAAkBxB,KAAKQ,SAAW,OAAS,QAChFa,EAAA,SAAA,CAAQI,MAAM,SAASC,QAAS,IAAM1B,KAAK2B,cAAenB,SAAUR,KAAKQ,UACvEa,EAAA,OAAA,OAEDrB,KAAKI,SACFiB,EAAA,YAAA,CAAWO,gBAAiB,MAAOC,gBAAiB,OAClDR,EAAA,IAAA,KAAIrB,KAAKO,gBACTc,EAAA,MAAA,CAAKE,MACH,CACEO,QAAS,OACTC,eAAgB,aAGlBV,EAAA,aAAA,CAAYpB,KAAK,UAAUsB,MAAO,CAACS,OAAQ,OAAQN,QAAS,IAAM1B,KAAKiC,iBAAkBjC,KAAKK,gBAC9FgB,EAAA,aAAA,CAAYpB,KAAK,YAAYsB,MAAO,CAACS,OAAQ,OAAQN,QAAS,IAAM1B,KAAKkC,gBAAiBlC,KAAKM,sDC3H/G,MAAM6B,EAAiB,wVCOVC,EAAW,MALxBtC,YAAAC,0DASyBC,KAAAqC,QAA+B,MAG9CrC,KAAAsC,gBAA2B,MAU3BxC,cACN,IAAKE,KAAKsC,gBAAgB,CACxBtC,KAAKqC,SAAWrC,KAAKqC,QACrBrC,KAAKuC,aACL,OAEF,GAAIvC,KAAKqC,UAAY,KAAK,CACxBrC,KAAKqC,QAAU,MACfrC,KAAKwC,OAAO7B,UAAU8B,OAAO,aAC7BzC,KAAKuC,aACL,OAEF,GAAIvC,KAAKqC,UAAYK,UAAU,CAC7B1C,KAAKqC,QAAU,KACfrC,KAAKwC,OAAO7B,UAAU8B,OAAO,aAC7BzC,KAAKuC,aACL,OAEF,GAAIvC,KAAKqC,UAAY,MAAM,CACzBrC,KAAKqC,QAAUK,UACf1C,KAAKwC,OAAO7B,UAAUC,IAAI,aAC1BZ,KAAKuC,aACL,QAIIzC,aACNE,KAAK2C,cAAczB,KAAKlB,KAAKqC,SAG/BvC,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,SAAA,CAAQI,MAAM,OAAOC,QAAS,IAAM1B,KAAK4C,cAAeC,IAAKnC,GAAMV,KAAKwC,OAAS9B,GAC9EV,KAAKqC,UAAY,OAChBhB,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,gGAEpJnD,KAAKqC,UAAY,MAChBhB,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,yIAEpJnD,KAAKqC,UAAYK,WAChBrB,EAAA,MAAA,CAAKI,MAAM,YAAYqB,MAAM,6BAA4BM,oBAAmB,gBAAgBL,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,IAAA,KAAGA,EAAA,OAAA,CAAM6B,KAAK,OAAOH,OAAO,KAAKE,MAAM,QAAU5B,EAAA,IAAA,KAAGA,EAAA,IAAA,KAAGA,EAAA,IAAA,KAAGA,EAAA,OAAA,CAAM8B,EAAE,gHAGhO9B,EAAA,QAAA,CAAOgC,QAASrD,KAAKU,GAAG4C,GAAI5B,QAAS,IAAM1B,KAAK4C,eAAevB,EAAA,OAAA,4CCpEvE,MAAMkC,EAAgB,qXCSTC,EAAU,MALvB1D,YAAAC,8CAQUC,KAAAyD,WAAsB,SAGtBzD,KAAA0D,aAAwB,WAGM1D,KAAA2D,SAAqB,MAM3D7D,sBAAsB8D,GACpB5D,KAAK6D,QAAQ3C,KAAK0C,GAGpB9D,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,SAAA,CAAAyC,aAAoB9D,KAAK2D,SAAW3D,KAAK0D,aAAe1D,KAAKyD,WAC3D/B,QAAS,IAAM1B,KAAK2D,UAAY3D,KAAK2D,UAErCtC,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,mIClC7J,MAAMY,EAAoB,odCQbC,EAAc,MAL3BlE,YAAAC,sFAUyBC,KAAA2D,SAAoB,MAGnC3D,KAAAiE,mBAA8B,IAE7BjE,KAAAkE,UAAqB,MAG9BpE,sBAAsB8D,GACpB5D,KAAKkE,UAAY,KACjBC,uBAAsB,KACpB,MAAMC,EAAYpE,KAAKU,GAAGI,WAAWC,cAAc,cACnD,GAAI6C,EAAS,CACXQ,EAAU7C,MAAMwB,OAASqB,EAAUC,aAAe,SAEhD,CACFD,EAAU7C,MAAMwB,OAAS,UAI7BoB,uBAAsB,KACpBnE,KAAKkE,UAAY,MACjBlE,KAAKsE,4BAA4BpD,UAOrCpB,mBACEE,KAAKuE,sBAGCzE,sBACN,GAAIE,KAAK2D,SAAS,CAChB3D,KAAKkE,UAAY,KACjBC,uBAAsB,KACpB,MAAMC,EAAYpE,KAAKU,GAAGI,WAAWC,cAAc,cACnD,IAAIyD,EAAY,EAChBJ,EAAUrD,cAAc,QAAQ0D,mBAAmBC,SAAQC,IACzDH,GAAaG,EAAKN,gBAEpBD,EAAU7C,MAAMwB,OAASyB,EAAY,SAS3C1E,sCACE8E,YAAW,KACT5E,KAAKuE,wBACJvE,KAAKiE,oBAKFnE,eAAe+E,GACrBA,EAAaH,SAAQI,IACnBX,uBAAsB,KACpBW,EAASC,OAAOC,QAAQ,mBAAmBC,mBAKjDnF,oBACEE,KAAKkF,iBAAmB,IAAIC,kBAAkBN,IAC5C7E,KAAKoF,eAAeP,MAIxB/E,mBACE,MAAMsE,EAAYpE,KAAKU,GAAGI,WAAWC,cAAc,cACnDqD,EAAU7C,MAAM0C,mBAAqBjE,KAAKiE,mBAAqB,KAG/D,MAAMoB,EAAa,CAACrF,KAAKU,IACzB2E,EAAWX,SAAQY,IACjBtF,KAAKkF,iBAAiBK,QAAQD,EAAS,CAACE,WAAY,KAAMC,cAAe,KAAMC,UAAW,KAAMC,QAAS,UAG3G,MAAMC,EAAO5F,KAAKU,GAAGI,WAAWC,cAAc,QAC9C6E,EAAKC,iBAAiB,cAAc,KAClC7F,KAAKiF,gBAITnF,uBACEE,KAAKkF,iBAAiBY,aAIxBhG,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKiC,GAAG,aACJjC,EAAA,OAAA,sGAvET0E;;;;;SClCUC,EAAblG,cAEYE,KAAAiG,KAAe,EAWfjG,KAAAkG,YAAsB,EAWtBlG,KAAAmG,WAAqB,EAlB7BC,UAAY,OAAOpG,KAAKiG,KACxBG,QAAQC,GACJ,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,IAAK,CAAEA,EAAQ,IAC3BrG,KAAKiG,KAAOI,EAOhBC,iBAAmB,OAAOtG,KAAKkG,YAC/BI,eAAeD,GACX,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzBrG,KAAKkG,YAAcG,EAOvBE,gBAAkB,OAAOvG,KAAKmG,WAC9BI,cAAcF,GACV,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzBrG,KAAKmG,WAAaE,EAMtBG,UACI,OAAOxG,KAAKyG,SAASD,IAEzBA,QAAQH,GACJrG,KAAK0G,OAAOL,EAAOrG,KAAK2G,MAAO3G,KAAK4G,MAMxCD,YACI,OAAO3G,KAAKyG,SAASE,MAEzBA,UAAUN,GACNrG,KAAK0G,OAAO1G,KAAKwG,IAAKH,EAAOrG,KAAK4G,MAMtCA,WACI,OAAO5G,KAAKyG,SAASG,KAEzBA,SAASP,GACLrG,KAAK0G,OAAO1G,KAAKwG,IAAKxG,KAAK2G,MAAON,GAMtCQ,UACI,IAAIC,EAAI9G,KAAK+G,OAAO/G,KAAKwG,KACzB,IAAIQ,EAAIhH,KAAK+G,OAAO/G,KAAK2G,OACzB,IAAIM,EAAIjH,KAAK+G,OAAO/G,KAAK4G,MACzB,OAAOE,EAAIE,EAAIC,EAEnBJ,QAAQR,GACJrG,KAAKwG,IAAMU,SAASb,EAAMc,OAAO,EAAE,IACnCnH,KAAK2G,MAAQO,SAASb,EAAMc,OAAO,EAAE,IACrCnH,KAAK4G,KAAOM,SAASb,EAAMc,OAAO,EAAE,IAMxCC,oBACI,MAAMC,GAAcrH,KAAKwG,IAAI,IAAMxG,KAAK2G,MAAM,IAAM3G,KAAK4G,KAAK,KAAO,IACrE,GAAIS,EAAa,IAAI,CACjB,MAAO,SAEX,MAAO,SAGHvH,SACJ,MAAMwH,GAAU,EAAIC,KAAKC,IAAK,EAAIxH,KAAKmG,WAAc,IAAMnG,KAAKsG,WAEhE,MAAMmB,EAAWzH,KAAKiG,KAAO,GAE7B,MAAMyB,EAASJ,GAAU,EAAIC,KAAKC,IAAIC,EAAW,EAAI,IAGrD,IAAIX,EAAI,EAAGE,EAAI,EAAGC,EAAI,EACtB,GAAI,GAAKQ,GAAYA,GAAY,EAAG,CAChCX,EAAIQ,EAAQN,EAAIU,OACb,GAAI,GAAKD,GAAYA,GAAY,EAAG,CACvCT,EAAIM,EAAQR,EAAIY,OACb,GAAI,GAAKD,GAAYA,GAAY,EAAG,CACvCT,EAAIM,EAAQL,EAAIS,OACb,GAAI,GAAKD,GAAYA,GAAY,EAAG,CACvCR,EAAIK,EAAQN,EAAIU,OACb,GAAI,GAAKD,GAAYA,GAAY,EAAG,CACvCR,EAAIK,EAAQR,EAAIY,OACb,GAAI,GAAKD,GAAYA,GAAY,EAAG,CACvCX,EAAIQ,EAAQL,EAAIS,EAGpB,MAAMC,EAAO3H,KAAKmG,WAAcmB,EAAS,EAEzC,MAAO,CACHd,IAAKe,KAAKK,OAAOd,EAAIa,GAAQ,KAC7BhB,MAAOY,KAAKK,OAAOZ,EAAIW,GAAQ,KAC/Bf,KAAMW,KAAKK,OAAOX,EAAIU,GAAQ,MAI9B7H,OAAO0G,EAAaG,EAAeC,GAGvC,MAAME,EAAIN,EAAI,IAAKQ,EAAIL,EAAM,IAAKM,EAAIL,EAAK,IAE3C,MAAMiB,EAAMN,KAAKM,IAAIf,EAAGE,EAAGC,GAC3B,MAAMa,EAAMP,KAAKO,IAAIhB,EAAGE,EAAGC,GAC3B,MAAMc,EAAOD,EAAMD,EACnB,IAAIxG,EAAI,EAAG2G,EAAI,EAAGC,EAAI,EAGtB,GAAIF,IAAS,EAAG,CACZ1G,EAAI,OACD,GAAIyG,IAAQhB,EAAG,CAClBzF,EAAI,KAAO2F,EAAIC,GAAKc,QACjB,GAAID,IAAQd,EAAG,CAClB3F,EAAI,IAAM,GAAM4F,EAAIH,GAAKiB,QACtB,GAAID,IAAQb,EAAG,CAClB5F,EAAI,IAAM,GAAMyF,EAAIE,GAAKe,GAE7B,GAAI1G,EAAI,EAAG,CAAEA,EAAIA,EAAI,IACrB,GAAIA,EAAI,IAAK,CAAEA,EAAI,IAGnB4G,GAAKH,EAAMD,GAAO,EAGlB,GAAIC,IAAQ,GAAKD,IAAQ,EAAG,CACxBG,EAAI,MACD,CACHA,GAAKF,EAAMG,GAAMV,KAAKM,IAAII,EAAG,EAAIA,GAGrCjI,KAAKiG,KAAO5E,EACZrB,KAAKkG,YAAc8B,EACnBhI,KAAKmG,WAAa8B,EAGdnI,OAAOuG,GACX,IAAIQ,EAAMR,EAAM6B,SAAS,IACzB,GAAIrB,EAAIsB,OAAS,EAAE,CACftB,EAAM,IAAMA,EAEhB,OAAOA,GC5Kf,MAAMuB,EAAoB;;;;kXCebC,EAAc,MAL3BvI,YAAAC,wDAUYC,KAAAsI,MAAgB,SAKhBtI,KAAAuI,eAAyB,MAGxBvI,KAAAwI,WAAqB,OACrBxI,KAAAyI,WAAqB,OACrBzI,KAAA0I,WAAqB,OA6CtB1I,KAAA2I,mCAAsCC,IAC1CA,EAAEC,iBACF7I,KAAK8I,8BAA8BF,GACnCG,OAAOlD,iBAAiB,YAAa7F,KAAK8I,+BAC1CC,OAAOlD,iBAAiB,UAAW7F,KAAKgJ,mCAGpChJ,KAAA8I,8BAAiCF,IACrC,MAAMK,EAAOjJ,KAAKkJ,uBAAuBC,wBAEzC,IAAIC,EAAIR,EAAES,QAAUJ,EAAKK,KACzB,GAAIF,EAAI,EAAG,CAAEA,EAAI,EACjB,GAAIA,EAAIH,EAAKhG,MAAO,CAAEmG,EAAIH,EAAKhG,MAC/BmG,EAAIA,EAAEH,EAAKhG,MAEX,IAAIsG,EAAIX,EAAEY,QAAUP,EAAKQ,IACzB,GAAIF,EAAI,EAAG,CAAEA,EAAI,EACjB,GAAIA,EAAIN,EAAKlG,OAAQ,CAAEwG,EAAIN,EAAKlG,OAChCwG,EAAI,EAAKA,EAAEN,EAAKlG,OAEhB,MAAM2G,EAAW,IAAI1D,EACrB0D,EAAStD,IAAMpG,KAAK2J,aAAavD,IACjCsD,EAASpD,WAAa8C,EACtBM,EAASnD,UAAYgD,EACrBvJ,KAAK2J,aAAeD,GAGhB1J,KAAAgJ,iCAAmC,KACvCD,OAAOa,oBAAoB,YAAa5J,KAAK8I,+BAC7CC,OAAOa,oBAAoB,UAAW5J,KAAKgJ,mCAGvChJ,KAAA6J,mBAAsBjB,IAC1BA,EAAEC,iBACF7I,KAAK8J,cAAclB,GACnBG,OAAOlD,iBAAiB,YAAa7F,KAAK8J,eAC1Cf,OAAOlD,iBAAiB,UAAW7F,KAAK+J,mBAGpC/J,KAAA+J,iBAAmB,KACvBhB,OAAOa,oBAAoB,YAAa5J,KAAK8J,eAC7Cf,OAAOa,oBAAoB,UAAW5J,KAAK+J,mBAGvC/J,KAAA8J,cAAiBlB,IACrB,MAAMK,EAAOjJ,KAAKgK,SAASb,wBAE3B,IAAIC,EAAIR,EAAES,QAAUJ,EAAKK,KACzB,GAAIF,EAAI,EAAG,CAAEA,EAAI,EACjB,GAAIA,EAAIH,EAAKhG,MAAO,CAAEmG,EAAIH,EAAKhG,MAC/BmG,EAAIA,EAAEH,EAAKhG,MAAM,IAEjB,MAAMyG,EAAW,IAAI1D,EACrB0D,EAAStD,IAAMgD,EACfM,EAASpD,WAAatG,KAAK2J,aAAarD,WACxCoD,EAASnD,UAAYvG,KAAK2J,aAAapD,UACvCvG,KAAK2J,aAAeD,GAGhB1J,KAAAiK,2BAA6B,CAACrB,EAAGsB,KACrC,IAAI7D,EAAQa,SAAS0B,EAAE7D,OAAOsB,OAC9B,GAAI8D,MAAM9D,GAAQ,CAAE,OACpB,MAAMqD,EAAW,IAAI1D,EACrB,GAAIK,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,IAAK,CAAEA,EAAQ,IAC3B,IAAIS,EAAI9G,KAAK2J,aAAanD,IAC1B,IAAIQ,EAAIhH,KAAK2J,aAAahD,MAC1B,IAAIM,EAAIjH,KAAK2J,aAAa/C,KAC1B,OAAQsD,GACJ,IAAK,MACDpD,EAAIT,EACJ,MACJ,IAAK,QACDW,EAAIX,EACJ,MACJ,IAAK,OACDY,EAAIZ,EACJ,MAIRqD,EAAS/C,MAAQK,EACjB0C,EAASlD,IAAMM,EACf4C,EAAS9C,KAAOK,EAChBjH,KAAK2J,aAAeD,GAGhB1J,KAAAoK,gBAAkB,CAACxB,EAAGyB,KAC1B,IAAIhE,EAAQa,SAAS0B,EAAE7D,OAAOsB,OAC9B,GAAI8D,MAAM9D,GAAQ,CAAC,OACnB,MAAMqD,EAAW,IAAI1D,EACrB,GAAIK,GAAS,KAAM,CACf,IAAIhF,EAAIrB,KAAK2J,aAAavD,IAC1B,IAAI4B,EAAIhI,KAAK2J,aAAarD,WAC1B,IAAI2B,EAAIjI,KAAK2J,aAAapD,UAC1B,OAAQ8D,GACJ,IAAK,MACD,GAAIhE,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,IAAK,CAAEA,EAAQ,EAC3BhF,EAAIgF,EACJ,MACJ,IAAK,aACD,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,IAAK,CAAEA,EAAQ,IAC3B2B,EAAI3B,EAAQ,IACZ,MACJ,IAAK,YACD,GAAIA,EAAQ,EAAG,CAAEA,EAAQ,EACzB,GAAIA,EAAQ,IAAK,CAAEA,EAAQ,IAC3B4B,EAAI5B,EAAQ,IACZ,MAIRqD,EAAStD,IAAM/E,EACfqI,EAASpD,WAAa0B,EACtB0B,EAASnD,UAAY0B,EACrBjI,KAAK2J,aAAeD,IA+CpB1J,KAAAsK,iCAAoC1B,IACxC,IAAIc,EAAW,IAAI1D,EACnB0D,EAAStD,IAAMpG,KAAK2J,aAAavD,IACjCsD,EAASpD,WAAatG,KAAK2J,aAAarD,WACxCoD,EAASnD,UAAYvG,KAAK2J,aAAapD,UAEvC,IAAIF,EAAQ,IACZ,GAAIuC,EAAE2B,SAAU,CAAElE,EAAQ,GAE1B,OAAQuC,EAAE4B,KACN,IAAK,UACDd,EAASnD,WAAaF,EACtB,MACJ,IAAK,YACDqD,EAASnD,WAAaF,EACtB,MACJ,IAAK,YACDqD,EAASpD,YAAcD,EACvB,MACJ,IAAK,aACDqD,EAASpD,YAAcD,EAI/BrG,KAAK2J,aAAeD,GAGhB1J,KAAAyK,iBAAoB7B,IACxB,IAAIc,EAAW,IAAI1D,EACnB0D,EAAStD,IAAMpG,KAAK2J,aAAavD,IACjCsD,EAASpD,WAAatG,KAAK2J,aAAarD,WACxCoD,EAASnD,UAAYvG,KAAK2J,aAAapD,UAEvC,IAAIF,EAAQ,EACZ,GAAIuC,EAAE2B,SAAU,CAAElE,EAAQ,GAE1B,OAAQuC,EAAE4B,KACN,IAAK,YACDd,EAAStD,KAAOC,EAChB,MACJ,IAAK,aACDqD,EAAStD,KAAOC,EAIxBrG,KAAK2J,aAAeD,GAtPhB5J,oBAAoBwI,GACxBtI,KAAK0K,aAAaxJ,KAAKoH,GAI3BxI,yBAAyB8D,GACrB5D,KAAK2K,oBAAoB/G,GAO7B9D,oBACIE,KAAK4K,gBAAgB5K,KAAKsI,OAG9BxI,mBACKE,KAAKU,GAA8Ba,MAAMsJ,YAAY,qBAAsB7K,KAAKuI,eAAeL,YAG5FpI,SACL,OAAOE,KAAK8K,WAAW9K,KAAK2J,aAAanD,KAAOxG,KAAK8K,WAAW9K,KAAK2J,aAAahD,OAAS3G,KAAK8K,WAAW9K,KAAK2J,aAAa/C,MAGxH9G,cACJ,OAAOE,KAAK2J,aAAavC,cAGrBtH,WAAWuG,GACf,MAAM0E,EAAc1E,EAAM6B,SAAS,IAAI8C,cACvC,GAAID,EAAY5C,SAAW,EAAE,CACzB,MAAO,IAAM4C,EAEjB,OAAOA,EA4HHjL,gBAAgBuG,GACpB,MAAMqD,EAAW,IAAI1D,EACrB,GAAIK,EAAM4E,MAAM,gCAAgC9C,OAAS,EAAG,CACxD,GAAI9B,EAAM8B,SAAW,EAAE,CACnB,IAAIxE,EAAW0C,EAAM,GAAKA,EAAM,GAAKA,EAAM,GAAKA,EAAM,GAAKA,EAAM,GAAKA,EAAO,GAC7EA,EAAQ1C,EAEZ+F,EAASlD,IAAMU,SAASb,EAAMc,OAAO,EAAE,GAAI,IAC3CuC,EAAS/C,MAAQO,SAASb,EAAMc,OAAO,EAAE,GAAI,IAC7CuC,EAAS9C,KAAOM,SAASb,EAAMc,OAAO,EAAE,GAAI,QAE5C,CACAuC,EAASlD,IAAMxG,KAAK2J,aAAanD,IACjCkD,EAAS/C,MAAQ3G,KAAK2J,aAAahD,MACnC+C,EAAS9C,KAAO5G,KAAK2J,aAAa/C,KAEtC5G,KAAK2J,aAAeD,EAGhB5J,gBAAgB8I,GACpB,OAAOA,EAAE7D,OAAOzB,IACZ,IAAK,aACDtD,KAAKwI,WAAa,OAClBxI,KAAKyI,WAAa,OAClBzI,KAAK0I,WAAa,OAClB,MACJ,IAAK,aACD1I,KAAKwI,WAAa,OAClBxI,KAAKyI,WAAa,OAClBzI,KAAK0I,WAAa,OAClB,MACJ,IAAK,aACD1I,KAAKwI,WAAa,OAClBxI,KAAKyI,WAAa,OAClBzI,KAAK0I,WAAa,OAClB,MACJ,QACI1I,KAAKwI,WAAa,OAClBxI,KAAKyI,WAAa,OAClBzI,KAAK0I,WAAa,QAoD9B5I,SACI,MAAMsG,EAAMpG,KAAK2J,aAAavD,IAC9B,MAAME,EAAatG,KAAK2J,aAAarD,WACrC,MAAMC,EAAYvG,KAAK2J,aAAapD,UACpC,MAAMC,EAAMxG,KAAK2J,aAAanD,IAC9B,MAAMG,EAAQ3G,KAAK2J,aAAahD,MAChC,MAAMC,EAAO5G,KAAK2J,aAAa/C,KAE/B,OACIvF,EAAA,MAAA,CAAKI,MAAM,oBACPJ,EAAA,MAAA,CAAKI,MAAM,qBACPJ,EAAA,MAAA,CAAKI,MAAM,gBAAgBoB,IAAMyC,GAAYtF,KAAKkJ,uBAAyB5D,EACvE/D,MAAO,CAAC2J,gBAAiB,OAAO9E,eAChC+E,YAAanL,KAAK2I,mCAAmCyC,KAAKpL,OAE1DqB,EAAA,SAAA,CAAQI,MAAM,iBAAgBqC,aACf,sGACXuH,KAAK,SAAQC,gBACC,IAAGC,gBACH,MAAKC,iBACH,eAAejE,KAAKK,MAAM5H,KAAK2J,aAAarD,WAAW,qBAAqBiB,KAAKK,MAAM5H,KAAK2J,aAAapD,UAAU,QACnIhF,MAAO,CACH+H,KAAM/B,KAAKK,MAAMtB,EAAa,KAAQ,IACtCmF,OAAQlE,KAAKK,MAAMrB,EAAY,KAAQ,KAE3CmF,UAAY9C,GAAM5I,KAAKsK,iCAAiC1B,MAGhEvH,EAAA,MAAA,CAAKI,MAAM,iBACPJ,EAAA,MAAA,CAAKI,MAAM,mBAAmBF,MAAO,CACjC2J,gBAAiB,IAAMlL,KAAK+G,SAC5B4E,UAAW,eAAiB,IAAM3L,KAAK4L,iBAG3CvK,EAAA,MAAA,CAAKI,MAAM,gBACPoB,IAAMyC,GAAYtF,KAAKgK,SAAW1E,EAClC6F,YAAanL,KAAK6J,mBAAmBuB,KAAKpL,OAE1CqB,EAAA,SAAA,CAAQI,MAAM,iBAAgBqC,aACf,sEACXuH,KAAK,SAAQC,gBACC,IAAGC,gBACH,MAAKM,gBACJtE,KAAKK,MAAMxB,GAC1B7E,MAAO,CAAC+H,MAAOlD,EAAI,IAAI,KAAK8B,WAAa,KACzCwD,UAAY9C,GAAM5I,KAAKyK,iBAAiB7B,QAKxDvH,EAAA,MAAA,CAAKI,MAAM,oBACPJ,EAAA,MAAA,CAAKI,MAAM,uBAAuBF,MAAO,CAACO,QAAS9B,KAAKwI,aACpDnH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,KACAA,EAAA,QAAA,CAAOpB,KAAK,SAAS4H,IAAI,IAAIC,IAAI,MAAMgE,KAAK,IAAIrK,MAAM,MAAM4E,MAAOG,EAAG1C,aAAa,YAC/EiI,SAAWnD,GAAM5I,KAAKiK,2BAA2BrB,EAAG,UAG5DvH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,KACAA,EAAA,QAAA,CAAOpB,KAAK,SAAS4H,IAAI,IAAIC,IAAI,MAAMrG,MAAM,QAAQ4E,MAAOM,EAAK7C,aAAa,cAC1EiI,SAAWnD,GAAM5I,KAAKiK,2BAA2BrB,EAAG,YAG5DvH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,KACAA,EAAA,QAAA,CAAOpB,KAAK,SAAS4H,IAAI,IAAIC,IAAI,MAAMrG,MAAM,OAAO4E,MAAOO,EAAI9C,aAAa,aACxEiI,SAAWnD,GAAM5I,KAAKiK,2BAA2BrB,EAAG,WAG5DvH,EAAA,MAAA,CAAKI,MAAM,yBACPJ,EAAA,SAAA,CACIiC,GAAG,aACH5B,QAAS1B,KAAKgM,gBAAgBZ,KAAKpL,MAAK8D,aAC7B,qCAEXzC,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,wEAI/J9B,EAAA,MAAA,CAAKI,MAAM,uBAAuBF,MAAO,CAACO,QAAS9B,KAAKyI,aACpDpH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,KACAA,EAAA,QAAA,CAAOpB,KAAK,SAAS4H,IAAI,IAAIC,IAAI,MAAMgE,KAAM,EAAGzF,MAAOkB,KAAKK,MAAMxB,GAAItC,aAAa,MAC/EiI,SAAWnD,GAAM5I,KAAKoK,gBAAgBxB,EAAG,UAGjDvH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,KACAA,EAAA,QAAA,CAAOpB,KAAK,SAAS4H,IAAI,IAAIC,IAAI,MAAMgE,KAAM,EAAGzF,MAAOkB,KAAKK,MAAMtB,EAAW,KAAIxC,aAAa,aAC1FiI,SAAWnD,GAAM5I,KAAKoK,gBAAgBxB,EAAG,iBAGjDvH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,KACAA,EAAA,QAAA,CAAOpB,KAAK,SAAS4H,IAAI,IAAIC,IAAI,MAAMgE,KAAM,EAAGzF,MAAOkB,KAAKK,MAAMrB,EAAU,KAAIzC,aAAa,YACzFiI,SAAWnD,GAAM5I,KAAKoK,gBAAgBxB,EAAG,gBAGjDvH,EAAA,MAAA,CAAKI,MAAM,yBACPJ,EAAA,SAAA,CACIiC,GAAG,aACH5B,QAAS1B,KAAKgM,gBAAgBZ,KAAKpL,MAAK8D,aAC7B,yCAEXzC,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,wEAI/J9B,EAAA,MAAA,CAAKI,MAAM,uBAAuBF,MAAO,CAACO,QAAS9B,KAAK0I,aACpDrH,EAAA,MAAA,CAAKI,MAAM,uBACPJ,EAAA,QAAA,KAAA,OACAA,EAAA,MAAA,CAAKI,MAAM,aACPJ,EAAA,QAAA,CAAOpB,KAAK,OAAM6D,aAAY,oBAC1BuC,MAAOrG,KAAK+G,SACZgF,SAAUnD,GAAK5I,KAAK4K,gBAAiBhC,EAAE7D,OAA4BsB,SAEvEhF,EAAA,SAAA,CACII,MAAM,OAAMqC,aACD,cAEXzC,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,wIAI/J9B,EAAA,MAAA,CAAKI,MAAM,yBACPJ,EAAA,SAAA,CACIiC,GAAG,aACH5B,QAAS1B,KAAKgM,gBAAgBZ,KAAKpL,MAAK8D,aAC7B,6CAEXzC,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,4KA5X/K8I,EAAAA,CADClG,EAAS,wDCrCd,MAAMmG,EAAiB,w1BCOVC,EAAW,MALxBrM,YAAAC,0DAOUC,KAAAoM,KAMJ,CACFC,gBAAiB,uBACjBC,QAAS,UACTC,GAAI,KACJC,YAAa,iBACbC,WAAY,iBAaNzM,KAAA0M,gBAA2B,MAO3B1M,KAAA2M,eAAyB,GAKxB3M,KAAA4M,iBAA4B,MAE5B5M,KAAA6M,cAAyB,MAkD1B7M,KAAA8M,eAAkBC,IAExBA,EAAMC,kBACND,EAAMlE,iBACNkE,EAAME,aAAaC,WAAa,OAChClN,KAAKmN,SAASxM,UAAUC,IAAI,aAqBtBZ,KAAAoN,WAAcC,IACpBA,EAAUL,kBACVK,EAAUxE,iBACV,MAAMyE,EAAQD,EAAUJ,aAAaK,MAErC,GAAItN,KAAKuN,qBAAqBD,GAAO,CACnC,OAEF,IAAIE,EAAWxN,KAAKyN,qBAAqBH,GACzCtN,KAAK0N,cAAcxM,KAAKsM,IA7E1B1N,mBACE,GAAIE,KAAK0M,gBAAgB,CACvB1M,KAAK2N,iCACJC,MAAKC,GAAU7N,KAAK4M,iBAAmBiB,IAE1C,GAAI7N,KAAK8N,mBAAqBpL,WAAa1C,KAAK8N,kBAAkB3F,OAAS,EAAE,CAC3E,IAAI4F,EAAqB/N,KAAK8N,kBAAkBE,KAAIpF,GAAK,IAAIA,MAC7D,IAAIqF,EAAiBF,EAAmBG,KAAK,KAC7ClO,KAAKmO,UAAUC,OAASH,GAIpBnO,iCACN,OAAO,IAAIuO,SAASC,IAClB,MAAMC,EAAeC,UAAUD,aAC/B,GAAIA,GAAgB7L,WAAa6L,EAAaE,kBAAoB/L,UAAW,CAC3E4L,EAAQ,OAEVC,EAAaE,mBACVb,MAAKc,IACJ,IAAIb,EAASa,EAAQC,MAAKC,GAAUA,EAAOC,MAAQ,eACnDP,EAAQT,SAKR/N,qBAAqBwN,GAC3B,IAAIE,EAAmB,GACvB,IAAK,IAAIsB,EAAQ,EAAGA,EAAQxB,EAAMnF,OAAQ2G,IAAS,CACjD,MAAMC,EAAOzB,EAAMwB,GACnBtB,EAASwB,KAAKD,GAGhB,OAAOvB,EAGD1N,mBAAmBwF,GACzB,IAAIgI,EAAQtN,KAAKyN,qBAAqBnI,EAAQgI,OAE9CtN,KAAK0N,cAAcxM,KAAKoM,GAWlBxN,qBAAqBwN,GAC3B,IAAI2B,EAAa,MACjB,IAAK,IAAIC,EAAY,EAAGA,EAAY5B,EAAMnF,OAAQ+G,IAAa,CAC7D,MAAMH,EAAOzB,EAAM4B,GACnB,IAAIC,EAAQ,kBACZ,MAAMC,EAAgBD,EAAME,KAAKN,EAAKO,MAAM,GAC5C,GAAIF,GAAiB1M,UAAU,CAC7BuM,EAAa,KAGf,GAAIjP,KAAK8N,mBAAqBpL,YAAc1C,KAAK8N,kBAAkByB,SAASH,GAAe,CACzFH,EAAa,KAGf,OAAOA,GAgBHnP,eACNE,KAAK6M,cAAgB,KACrB2B,UAAUD,aAAaiB,aAAa,CAACC,MAAO,KAAMC,MAAO,QACxD9B,MAAK+B,IAEJ3P,KAAK4P,aAAaC,UAAYF,EAC9B3P,KAAK4P,aAAaE,OACjBlC,MAAK,KACJ5N,KAAK+P,cAAgBJ,EAAOK,iBAAiB,GAAGC,oBAGnDC,OAAMC,GAASC,MAAMD,KAGhBrQ,gBACN,IAAIuQ,EAASC,SAASC,cAAc,UACpC,MAAMC,EAAUH,EAAOI,WAAW,MAClCJ,EAAOpN,MAAQjD,KAAK+P,cAAc9M,MAClCoN,EAAOtN,OAAS/C,KAAK+P,cAAchN,OACnCyN,EAAQE,UAAU1Q,KAAK4P,aAAc,EAAG,GACxCS,EAAOM,QAAOC,IACZ,IAAI7B,EAAO,IAAI8B,KAAK,CAACD,GAAO,aAAc,CAAC3Q,KAAK,eAChDD,KAAK6M,cAAgB,MAErB,IAAIW,EAAW,CAACuB,GAChB/O,KAAK0N,cAAcxM,KAAKsM,KACvB,aAAcxN,KAAK2M,gBAGxB7M,yBACE,OACEuB,EAACC,EAAI,CACHuB,IAAK+F,GAAK5I,KAAKmN,SAAWvE,EAC1BnH,MAAM,WACNqP,WAAY9Q,KAAK8M,eACjBiE,OAAQ/Q,KAAKoN,WACb4D,YAAa,IAAMhR,KAAKmN,SAASxM,UAAU8B,OAAO,cAEhDzC,KAAK6M,eACL,CACExL,EAAA,IAAA,MAAI4P,EAAAjR,KAAKoM,QAAI,MAAA6E,SAAA,OAAA,EAAAA,EAAE5E,iBAEfhL,EAAA,IAAA,KAAA,MAAM6P,EAAAlR,KAAKoM,QAAI,MAAA8E,SAAA,OAAA,IAAE3E,GAAE,MAEnBlL,EAAA,QAAA,CAAOI,MAAM,eACXJ,EAAA,QAAA,CACEpB,KAAK,OACL4C,IAAKnC,GAAMV,KAAKmO,UAAYzN,EAC5BqL,SAAUnD,GAAK5I,KAAKmR,mBAAmBvI,EAAE7D,UAG3C1D,EAAA,OAAA,KACEA,EAAA,MAAA,CAAKyB,MAAM,6BAA4BM,oBAAmB,gBAAgBL,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,IAAA,KAAGA,EAAA,OAAA,CAAM6B,KAAK,OAAOH,OAAO,KAAKE,MAAM,QAAU5B,EAAA,IAAA,KAAGA,EAAA,OAAA,CAAM8B,EAAE,qDAC/L,KAENiO,EAAApR,KAAKoM,QAAI,MAAAgF,SAAA,OAAA,IAAE3E,YAGdzM,KAAK4M,kBACH,CACEvL,EAAA,IAAA,KAAA,MAAMgQ,EAAArR,KAAKoM,QAAI,MAAAiF,SAAA,OAAA,IAAE9E,GAAE,MAEnBlL,EAAA,SAAA,CACEK,QAAS,IAAM1B,KAAKsR,gBAEpBjQ,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,SAAA,CAAQkQ,GAAG,KAAKC,GAAG,KAAK1K,EAAE,QAAOzF,EAAA,OAAA,CAAM8B,EAAE,gKACnLsO,EAAAzR,KAAKoM,QAAI,MAAAqF,SAAA,OAAA,IAAEjF,eAKrBxM,KAAK6M,eACJxL,EAAA,MAAA,CAAKI,MAAM,iBACTJ,EAAA,QAAA,CAAOwB,IAAK+F,GAAK5I,KAAK4P,aAAehH,IACrCvH,EAAA,SAAA,CACEK,QAAS,IAAM1B,KAAK0R,iBAEpBrQ,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,SAAA,CAAQkQ,GAAG,KAAKC,GAAG,KAAK1K,EAAE,QAAOzF,EAAA,OAAA,CAAM8B,EAAE,+JAAmK,KACtVwO,EAAA3R,KAAKoM,QAAI,MAAAuF,SAAA,OAAA,IAAErF,uBCrN1B,IAAYsF,GAAZ,SAAYA,GACRA,EAAAA,EAAA,MAAA,GAAA,KACAA,EAAAA,EAAA,MAAA,GAAA,KACAA,EAAAA,EAAA,MAAA,GAAA,KACAA,EAAAA,EAAA,MAAA,GAAA,MAJJ,CAAYA,IAAAA,EAAU,KCAtB,MAAMC,EAAqB,6sCCadC,EAAe,MAL5BhS,YAAAC,gEAOUC,KAAAiD,MAAgB,IAGhBjD,KAAA+C,OAAiB,IAKjB/C,KAAAoM,KAQJ,CACFE,QAAS,UACTD,gBAAiB,yBACjBE,GAAI,KACJC,YAAa,iBACbC,WAAY,kBACZsF,cAAe,wJACfC,eAAgB,SAIVhS,KAAAiS,QAAkB,GAGlBjS,KAAAkS,kBAA6B,MAyF7BlS,KAAAmS,oBAAuBpF,IAC7BA,EAAMC,kBACND,EAAMlE,iBACN,MAAMvD,EAAUyH,EAAMhI,OACtB,MAAMqN,EAAY9M,EAAQ3E,UAAU,GAEpC2P,SAASzK,iBAAiB,UAAW7F,KAAKqS,wBAAyB,OACnE/B,SAASzK,iBAAiB,WAAY7F,KAAKqS,wBAAyB,OACpE,OAAQD,GACN,IAAK,OACH9B,SAASzK,iBAAiB,YAAa7F,KAAKsS,eAAgB,OAC5DhC,SAASzK,iBAAiB,YAAa7F,KAAKsS,eAAgB,OAC5DhC,SAASzK,iBAAiB,WAAW,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKsS,kBAC1FhC,SAASzK,iBAAiB,YAAY,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKsS,kBAC3F,MACF,IAAK,KACHhC,SAASzK,iBAAiB,YAAa7F,KAAKuS,kBAAmB,OAC/DjC,SAASzK,iBAAiB,YAAa7F,KAAKuS,kBAAmB,OAC/DjC,SAASzK,iBAAiB,WAAW,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKuS,qBAC1FjC,SAASzK,iBAAiB,YAAY,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKuS,qBAC3F,MACF,IAAK,KACHjC,SAASzK,iBAAiB,YAAa7F,KAAKwS,kBAAmB,OAC/DlC,SAASzK,iBAAiB,YAAa7F,KAAKwS,kBAAmB,OAC/DlC,SAASzK,iBAAiB,WAAW,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKwS,qBAC1FlC,SAASzK,iBAAiB,YAAY,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKwS,qBAC3F,MACF,IAAK,KACHlC,SAASzK,iBAAiB,YAAa7F,KAAKyS,kBAAmB,OAC/DnC,SAASzK,iBAAiB,YAAa7F,KAAKyS,kBAAmB,OAC/DnC,SAASzK,iBAAiB,WAAW,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKyS,qBAC1FnC,SAASzK,iBAAiB,YAAY,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAKyS,qBAC3F,MACF,IAAK,KACHnC,SAASzK,iBAAiB,YAAa7F,KAAK0S,kBAAmB,OAC/DpC,SAASzK,iBAAiB,YAAa7F,KAAK0S,kBAAmB,OAC/DpC,SAASzK,iBAAiB,WAAW,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAK0S,qBAC1FpC,SAASzK,iBAAiB,YAAY,IAAMyK,SAAS1G,oBAAoB,YAAa5J,KAAK0S,qBAC3F,QAME1S,KAAAqS,wBAA2BM,IACjC3S,KAAK4S,YACLtC,SAAS1G,oBAAoB,UAAW5J,KAAKqS,yBAC7CrS,KAAK6S,cAAgBnQ,WAsCf1C,KAAAuS,kBAAqBxF,IAC3B/M,KAAK8S,iBAAiB/F,EAAO6E,EAAWmB,KAGlC/S,KAAAwS,kBAAqBzF,IAC3B/M,KAAK8S,iBAAiB/F,EAAO6E,EAAWoB,KAGlChT,KAAAyS,kBAAqB1F,IAC3B/M,KAAK8S,iBAAiB/F,EAAO6E,EAAWqB,KAGlCjT,KAAA0S,kBAAqB3F,IAC3B/M,KAAK8S,iBAAiB/F,EAAO6E,EAAWsB,KAGlClT,KAAA8S,iBAAmB,CAAC/F,EAAgCoG,KAC1D,IAAKnT,KAAKoT,qBAAqBrG,GAAO,CACpC,OAGF,IAAIzD,KAACA,EAAIG,IAAEA,GAAOzJ,KAAKqT,iBAAiBF,GACxC,IAAIG,EAAW,EACf,IAAI9O,EAAY,EAChB,IAAI+O,EAAyC,aAC7C,MAAMC,EAAcxT,KAAKiD,MAAQjD,KAAK+C,OACtC,MAAM0Q,EAAWzT,KAAK0T,KAAKvK,wBAC3B,MAAMwK,EAAY3T,KAAK4T,MAAMzK,wBAC7B,IAAI0K,UAAEA,EAASC,UAAEA,GAAc9T,KAAK+T,sBAAsBhH,GAC1D,GAAIxF,KAAKC,IAAIqM,GAAatM,KAAKC,IAAIsM,GAAW,CAC5CP,EAAc,WAGhB,GAAIA,GAAe,aAAa,CAC9B,OAAQJ,GACN,KAAKvB,EAAWmB,GAChB,KAAKnB,EAAWsB,GACdI,EAAWG,EAASxQ,MAAQ4Q,EAC5BrP,EAAY8O,EAAWE,EACvB,MACF,KAAK5B,EAAWoB,GAChB,KAAKpB,EAAWqB,GACdK,EAAWG,EAASxQ,MAAQ4Q,EAC5BrP,EAAY8O,EAAWE,EACvB,WAIA,CACJ,OAAQL,GACN,KAAKvB,EAAWmB,GAChB,KAAKnB,EAAWoB,GACdxO,EAAYiP,EAAS1Q,OAAS+Q,EAC9BR,EAAW9O,EAAYgP,EACvB,MACF,KAAK5B,EAAWqB,GAChB,KAAKrB,EAAWsB,GACd1O,EAAYiP,EAAS1Q,OAAS+Q,EAC9BR,EAAW9O,EAAYgP,EACvB,OAMN,OAAQL,GACN,KAAKvB,EAAWoB,GAChB,KAAKpB,EAAWmB,GACd,MAAMiB,EAAYP,EAAS1Q,OAASyB,EACpCiF,EAAMzJ,KAAK0T,KAAKO,UAAYD,EAKhC,OAAQb,GACN,KAAKvB,EAAWmB,GAChB,KAAKnB,EAAWsB,GACd,MAAMgB,EAAaT,EAASxQ,MAAQqQ,EACpChK,EAAOtJ,KAAK0T,KAAKS,WAAaD,EAC9B,GAAI5K,EAAO,EAAGA,EAAO,EACrB,GAAIA,EAAOqK,EAAU1Q,MAAOqG,EAAOqK,EAAU1Q,MAC7C,GAAIwG,EAAM,EAAGA,EAAM,EACnB,GAAIA,EAAMkK,EAAU5Q,OAAQ0G,EAAMkK,EAAU5Q,OAC5C,GAAIuG,EAAOgK,EAAWK,EAAU1Q,MAAOqQ,EAAWK,EAAU1Q,MAAQqG,EACpE,GAAIG,EAAMjF,EAAYmP,EAAU5Q,OAAQyB,EAAYmP,EAAU5Q,OAAS0G,EACvE,MACF,KAAKmI,EAAWoB,GAChB,KAAKpB,EAAWqB,GACd,GAAIxJ,EAAM,EAAGA,EAAM,EACnB,GAAIA,EAAMkK,EAAU5Q,OAAQ0G,EAAMkK,EAAU5Q,OAC5C,GAAIuG,EAAOgK,EAAWK,EAAU1Q,MAAOqQ,EAAWK,EAAU1Q,MAAQqG,EACpE,GAAIG,EAAMjF,EAAYmP,EAAU5Q,OAAQyB,EAAYmP,EAAU5Q,OAAS0G,EACvE,MAKJ,GAAI6J,EAAW9O,GAAagP,EAAY,CACtC,OAGF,GAAIxT,KAAKkS,kBAAkB,CACzB,MAAMkC,EAAYpU,KAAK4T,MAAM3Q,MAAQjD,KAAK4T,MAAMS,aAChD,GAAIf,EAAWc,EAAYpU,KAAKiD,OAASuB,EAAY4P,EAAYpU,KAAK+C,OAAO,CAC3E,QAIJ,OAAQoQ,GACN,KAAKvB,EAAWoB,GACdhT,KAAK0T,KAAKnS,MAAMkI,IAAM,GAAGA,MACzBzJ,KAAK0T,KAAKnS,MAAM0B,MAAQ,GAAGqQ,MAC3BtT,KAAK0T,KAAKnS,MAAMwB,OAAS,GAAGyB,MAC5B,MACF,KAAKoN,EAAWmB,GACd/S,KAAK0T,KAAKnS,MAAM+H,KAAO,GAAGA,MAC1BtJ,KAAK0T,KAAKnS,MAAMkI,IAAM,GAAGA,MACzBzJ,KAAK0T,KAAKnS,MAAM0B,MAAQ,GAAGqQ,MAC3BtT,KAAK0T,KAAKnS,MAAMwB,OAAS,GAAGyB,MAC5B,MACF,KAAKoN,EAAWqB,GACdjT,KAAK0T,KAAKnS,MAAM0B,MAAQ,GAAGqQ,MAC3BtT,KAAK0T,KAAKnS,MAAMwB,OAAS,GAAGyB,MAC5B,MACF,KAAKoN,EAAWsB,GACdlT,KAAK0T,KAAKnS,MAAM+H,KAAO,GAAGA,MAC1BtJ,KAAK0T,KAAKnS,MAAM0B,MAAQ,GAAGqQ,MAC3BtT,KAAK0T,KAAKnS,MAAMwB,OAAS,GAAGyB,MAC5B,QAuBExE,KAAAsS,eAAkBgC,IACxB,IAAKtU,KAAKoT,qBAAqBkB,GAAI,CACjC,OAEF,IAAIT,UAACA,EAASC,UAAEA,GAAa9T,KAAK+T,sBAAsBO,GACxD,IAAIC,EAAUvU,KAAK0T,KAAKS,WAAaN,EACrC,IAAIW,EAASxU,KAAK0T,KAAKO,UAAYH,EACnC,IAAIH,EAAY3T,KAAK4T,MAAMzK,wBAC3B,IAAIsK,EAAWzT,KAAK0T,KAAKvK,wBACzB,GAAIoL,EAAU,EAAE,CACdA,EAAU,EAEZ,GAAIC,EAAS,EAAE,CACbA,EAAS,EAEX,GAAID,EAAUd,EAASxQ,MAAQ0Q,EAAU1Q,MAAM,CAC7CsR,EAAUvU,KAAK0T,KAAKS,WAEtB,GAAIK,EAASf,EAAS1Q,OAAS4Q,EAAU5Q,OAAO,CAC9CyR,EAASxU,KAAK0T,KAAKO,UAErBjU,KAAK0T,KAAKnS,MAAM+H,KAAOiL,EAAU,KACjCvU,KAAK0T,KAAKnS,MAAMkI,IAAM+K,EAAS,MA3UjC1U,mBACEE,KAAKyU,QAAQ,iBAGP3U,QAAQ4U,GACd,MAAMC,EAAQ3U,KAAK4U,KAAK9T,WAAW+T,iBAAiB,SACpDF,EAAMjQ,SAAQoQ,GACZA,EAAEnU,UAAU8B,OAAO,aACrB,OAAQiS,GACN,IAAK,gBACH1U,KAAK+U,cAAcpU,UAAUC,IAAI,WACjC,MACF,IAAK,iBACHZ,KAAKgV,eAAerU,UAAUC,IAAI,WAClC,MAIJZ,KAAKiV,KAAOP,EAGN5U,WACN,IAAI0T,EAAcxT,KAAKiD,MAAQjD,KAAK+C,OACpC,IAAI4Q,EAAY3T,KAAK4T,MAAMzK,wBAC3B,IAAI+L,EAAavB,EAAU1Q,MAAQ0Q,EAAU5Q,OAE7C,GAAIyQ,EAAc0B,EAAW,CACzB,IAAIC,EAAexB,EAAU1Q,MAAQuQ,EACrC,IAAIzL,EAAO4L,EAAU5Q,OAASoS,EAC9BnV,KAAK0T,KAAKnS,MAAMkI,IAAMlC,KAAKK,MAAMG,EAAK,GAAGG,WAAa,KACtDlI,KAAK0T,KAAKnS,MAAMwB,OAASwE,KAAKK,MAAMuN,GAAcjN,WAAa,SAE/D,CACF,IAAIkN,EAAczB,EAAU5Q,OAASyQ,EACrC,IAAIzL,EAAO4L,EAAU1Q,MAAQmS,EAC3BpV,KAAK0T,KAAKnS,MAAM+H,KAAO/B,KAAKK,MAAMG,EAAK,GAAGG,WAAa,KACvDlI,KAAK0T,KAAKnS,MAAM0B,MAAQsE,KAAKK,MAAMwN,GAAalN,WAAa,MAI3DpI,WACNE,KAAK4T,MAAM/N,iBAAiB,QAAQ,KAClC7F,KAAKqV,WACLrV,KAAK4S,eAEP5S,KAAK4T,MAAM0B,IAAMtV,KAAKqQ,OAAOkF,YAGvBzV,cAAciP,GACpB,GAAIA,EAAK9O,KAAKuV,MAAM,KAAK,IAAM,QAAQ,CACrC,OAGF,IAAIC,EAAS,IAAIC,WACjBD,EAAOE,OAASC,IACd,IAAIC,EAAM,IAAIC,MACdD,EAAIF,OAAS,KACX3V,KAAKqQ,OAAOpN,MAAQ4S,EAAI5S,MACxBjD,KAAKqQ,OAAOtN,OAAS8S,EAAI9S,OACzB,GAAI/C,KAAKkS,oBAAsB2D,EAAI5S,MAAQjD,KAAKiD,OAAS4S,EAAI9S,OAAQ/C,KAAK+C,QAAQ,CAChF/C,KAAK+V,mBAAmB3U,OACxB,OAEF,IAAI4U,EAAMhW,KAAKqQ,OAAOI,WAAW,MACjCuF,EAAItF,UAAUmF,EAAI,EAAE,GACpB7V,KAAKyU,QAAQ,kBACbzU,KAAKiW,YAEPJ,EAAIP,IAAMM,EAAgB7Q,OAAO8I,OAAO3F,YAE1CuN,EAAOS,cAAcnH,GAqDfjP,YACN,IAAIsJ,EAAIpJ,KAAK0T,KAAKS,WAAanU,KAAK4T,MAAM3Q,MAAQjD,KAAK4T,MAAMS,aAC7D,IAAI9K,EAAIvJ,KAAK0T,KAAKO,UAAYjU,KAAK4T,MAAM7Q,OAAS/C,KAAK4T,MAAMuC,cAE7D,IAAI1C,EAAWzT,KAAK0T,KAAKvK,wBACzB,IAAIlG,EAAQwQ,EAASxQ,MAAQjD,KAAK4T,MAAM3Q,MAAQjD,KAAK4T,MAAMS,aAC3D,IAAItR,EAAS0Q,EAAS1Q,OAAS/C,KAAK4T,MAAM7Q,OAAS/C,KAAK4T,MAAMuC,cAE9D,GAAI/M,EAAI,EACNA,EAAI,EACN,GAAIA,EAAIpJ,KAAK4T,MAAMS,aACjBjL,EAAIpJ,KAAK4T,MAAMS,aACjB,GAAI9K,EAAI,EACNA,EAAI,EACN,GAAIA,EAAIvJ,KAAK4T,MAAMS,aACjB9K,EAAIvJ,KAAK4T,MAAMS,aACjB,GAAIpR,EAAQjD,KAAK4T,MAAMS,aACrBpR,EAAQjD,KAAK4T,MAAMS,aACrB,GAAItR,EAAS/C,KAAK4T,MAAMuC,cACtBpT,EAAS/C,KAAK4T,MAAMuC,cAEtB,IAAIC,EAAUpW,KAAKqW,qBAAqBjN,EAAGG,EAAGtG,EAAOF,EAAQ/C,KAAKiD,MAAOjD,KAAK+C,QAC9E/C,KAAKsW,iBAAiBpV,KAAKkV,GAGrBtW,qBAAqBsJ,EAAWG,EAAWtG,EAAeF,EAAgBwT,EAAsBC,GACtGxW,KAAKqQ,OAAOpN,MAAQsT,EACpBvW,KAAKqQ,OAAOtN,OAASyT,EACrB,MAAMhG,EAAUxQ,KAAKqQ,OAAOI,WAAW,MACvCD,EAAQiG,UAAU,EAAG,EAAGF,EAAcC,GACtChG,EAAQE,UAAU1Q,KAAK4T,MAAOxK,EAAGG,EAAGtG,EAAOF,EAAQ,EAAG,EAAGwT,EAAcC,GAEvE,OAAOxW,KAAKqQ,OAAOkF,UAAU,aAAcvV,KAAKiS,SAyI1CnS,iBAAiBqT,GACvB,IAAI7J,EAAO,EACX,IAAIG,EAAM,EACV,OAAQ0J,GACN,KAAKvB,EAAWqB,GACd3J,EAAOtJ,KAAK0T,KAAKS,WACjB1K,EAAMzJ,KAAK0T,KAAKO,UAChB,MACF,KAAKrC,EAAWsB,GACdzJ,EAAMzJ,KAAK0T,KAAKO,UAChB,MAIJ,MAAO,CAACxK,IAAAA,EAAKH,KAAAA,GA4BPxJ,sBAAsBiN,GAC5B,IAAI8G,EAAY,EAChB,IAAIC,EAAY,EAChB,GAAI/G,aAAiB2J,WAAY,CAC/B7C,EAAY9G,EAAM8G,UAClBC,EAAY/G,EAAM+G,UAEpB,UAAW6C,aAAe,YAAY,CACpC,GAAI5J,aAAiB4J,WAAY,CAC/B,IAAIC,EAAQ7J,EAAM8J,QAAQ,GAC1B,GAAI7W,KAAK6S,eAAiBnQ,UAAW,CACnCmR,EAAY+C,EAAME,MAAQ9W,KAAK6S,cAAciE,MAC7ChD,EAAY8C,EAAMG,MAAQ/W,KAAK6S,cAAckE,MAE/C/W,KAAK6S,cAAgB+D,GAGzB,MAAO,CAAE/C,UAAAA,EAAWC,UAAAA,GAGdhU,qBAAqBiN,GAC3B,IAAIiK,EAAS,MACb,IAAIC,EACJ,IAAIC,EACJ,MAAMvD,EAAY3T,KAAK4T,MAAMzK,wBAE7B,GAAI4D,aAAiB2J,WAAW,CAC9BO,EAASlK,EAAM1D,QACf6N,EAASnK,EAAMvD,QAGjB,UAAWmN,aAAe,YAAY,CACpC,GAAI5J,aAAiB4J,WAAW,CAC9B,IAAIC,EAAQ7J,EAAM8J,QAAQ,GAC1BI,EAASL,EAAMvN,QACf6N,EAASN,EAAMpN,SAInB,GACEyN,GAAUtD,EAAUvK,GACpB8N,GAAUvD,EAAUpK,GACpB0N,GAAUtD,EAAUrK,KAAOqK,EAAU1Q,OACrCiU,GAAUvD,EAAUlK,IAAMkK,EAAU5Q,OACtC,CACEiU,EAAS,KAGX,IAAIG,EAAUnX,KAAK0T,KAAKmB,iBAAiB,OACzCsC,EAAQzS,SAAQyO,IACd,IAAIiE,EAAajE,EAAOhK,wBACxB,GACE8N,GAAUG,EAAWhO,GACrB8N,GAAUE,EAAW7N,GACrB0N,GAAUG,EAAW9N,KAAO8N,EAAWnU,OACvCiU,GAAUE,EAAW3N,IAAM2N,EAAWrU,OACtC,CACEiU,EAAS,SAIf,OAAOA,EAGTlX,SACE,OACEuB,EAACC,EAAI,CAACuB,IAAKnC,GAAMV,KAAK4U,KAAOlU,GAC3BW,EAAA,SAAA,CAAQwB,IAAKnC,GAAMV,KAAKqQ,OAAS3P,IACjCW,EAAA,MAAA,CACEI,MAAM,OACNoB,IAAKnC,GAAMV,KAAKgV,eAAiBtU,GAEjCW,EAAA,MAAA,CAAKI,MAAM,WACTJ,EAAA,MAAA,CAAKwB,IAAKnC,GAAMV,KAAK4T,MAAQlT,IAC7BW,EAAA,MAAA,CAAKI,MAAM,aACXJ,EAAA,MAAA,CACEI,MAAM,OACNoB,IAAK+F,GAAK5I,KAAK0T,KAAO9K,EACtBuC,YAAanL,KAAKmS,oBAClBkF,aAAcrX,KAAKmS,qBAEnB9Q,EAAA,MAAA,CAAKI,MAAM,OACXJ,EAAA,MAAA,CAAKI,MAAM,OACXJ,EAAA,MAAA,CAAKI,MAAM,OACXJ,EAAA,MAAA,CAAKI,MAAM,UAIjBJ,EAAA,MAAA,CACEI,MAAM,OACNoB,IAAKnC,GAAMV,KAAK+U,cAAgBrU,GAC9BW,EAAA,eAAA,CACEqL,gBAAe,KACf4K,gBAAiB1O,GAAK5I,KAAKuX,cAAc3O,EAAE4O,OAAO,IAClDpL,KACE,CACEE,QAAStM,KAAKoM,KAAKE,QACnBD,gBAAiBrM,KAAKoM,KAAKC,gBAC3BE,GAAIvM,KAAKoM,KAAKG,GACdC,YAAaxM,KAAKoM,KAAKI,YACvBC,WAAYzM,KAAKoM,KAAKK,eAKhCpL,EAAA,YAAA,CAAWwB,IAAKnC,GAAMV,KAAK+V,mBAAqBrV,EAAE+W,aAAczX,KAAKoM,KAAK4F,gBACxE3Q,EAAA,IAAA,KAAIrB,KAAKoM,KAAK2F,cAAc2F,QAAQ,UAAW1X,KAAKiD,MAAMiF,YAAYwP,QAAQ,WAAY1X,KAAK+C,OAAOmF,2BCrfhH,MAAMyP,EAAc,woCCOPC,EAAQ,MALrB9X,YAAAC,kDAYUC,KAAA6B,gBAA2B,KAM3B7B,KAAA6X,UAAqB,cAOrB7X,KAAA4B,gBAA4B,KAE3B5B,KAAA8X,QAAmB,MAM5BhY,aACEE,KAAK8X,QAAU,KAOjBhY,aACEE,KAAK8X,QAAU,MAQThY,gBACNE,KAAK8X,QAAU,MACf9X,KAAK+X,UAAU7W,OAGTpB,oBAAoB8I,GAC1B,MAAMtD,EAAWsD,EAAE7D,OACnB,GAAIO,EAAQhC,KAAO,YAActD,KAAK6B,gBAAgB,CACpD7B,KAAKgY,iBAITlY,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKiC,GAAG,WACN7B,MAAOzB,KAAK8X,QAAU,kBAAoB,UAC1CpW,QAASkH,GAAK5I,KAAKiY,oBAAoBrP,IAEvCvH,EAAA,MAAA,CAAKI,MAAM,SACRzB,KAAK4B,iBACJP,EAAA,SAAA,CACEI,MAAM,QAAOqC,aACD9D,KAAK6X,UACjBnW,QAAS,IAAM1B,KAAKgY,iBAEpB3W,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,sLAGvJ9B,EAAA,OAAA,6CCjFZ,MAAM6W,EAAkB,4yCCOXC,EAAY,MALzBrY,YAAAC,wDAUUC,KAAAoY,YAAuB,GAKvBpY,KAAAqY,UAAqB,KAGNrY,KAAAsY,MAAgB,GASvCxY,mBACE,GAAIE,KAAKqY,UAAU,CACjBrY,KAAKuY,kCAEH,CACFvY,KAAKwY,sBAID1Y,qBACNE,KAAKyY,aAAavX,KAAKlB,KAAKsY,OAItBxY,8BACNE,KAAKwY,qBAIP1Y,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,QAAA,CAAOpB,KAAK,OAAOoG,MAAOrG,KAAKsY,MAC7BF,YAAapY,KAAKoY,YAClBM,QAAS9P,GAAK5I,KAAKsY,MAAS1P,EAAE7D,OAA4BsB,QAE3DrG,KAAKsY,QAAU,GACdjX,EAAA,SAAA,CAAQI,MAAM,YACZC,QAAS,IAAM1B,KAAKsY,MAAQ,IAE5BjX,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,sLAGvJ9B,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,gBAAgBD,KAAK,SAAQ7B,EAAA,OAAA,CAAM8B,EAAE,4SAnBzJ8I,EAAA,CADClG,EAAS,gEC1CZ,MAAM4S,EAAiB,6aCOVC,EAAW,MALxB9Y,YAAAC,sDAOUC,KAAA6Y,cAAyC,OAKzC/Y,aACN,OAAQE,KAAK6Y,eACX,IAAK,MACH7Y,KAAK6Y,cAAgB,OACrB,MACF,IAAK,OACH7Y,KAAK6Y,cAAgB,MACrB,MACF,IAAK,OACH7Y,KAAK6Y,cAAgB,MACrB,MAKJ7Y,KAAK8Y,YAAY5X,KAAKlB,KAAK6Y,eAG7B/Y,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,SAAA,CACEI,MAAO,CAACsX,OAAU/Y,KAAK6Y,eAAiB,QACxCnX,QAAS,IAAM1B,KAAKgZ,cAEnBhZ,KAAK6Y,eAAiB,QACrBxX,EAAA,MAAA,CAAKyB,MAAM,6BAA6BE,QAAQ,aAAY3B,EAAA,OAAA,CAAM8B,EAAE,4CAErEnD,KAAK6Y,eAAiB,OACrBxX,EAAA,MAAA,CAAKyB,MAAM,6BAA6BE,QAAQ,aAAY3B,EAAA,OAAA,CAAM8B,EAAE,wBAErEnD,KAAK6Y,eAAiB,QACrBxX,EAAA,MAAA,CAAKyB,MAAM,6BAA6BE,QAAQ,aAAY3B,EAAA,OAAA,CAAM8B,EAAE,uCC9ChF,MAAM8V,EAAY,OCQLC,EAAM,MALnBpZ,YAAAC,aASaC,KAAA8X,QAAmB,MAI5BhY,aACIE,KAAK8X,QAAU,KAKnBhY,aACIE,KAAK8X,QAAU,MAGnBhY,SACI,OACIuB,EAACC,EAAI,KACAtB,KAAK8X,SACFzW,EAAA,OAAA,mBC9BpB,MAAM8X,EAAa,suBCONC,EAAO,MALpBtZ,YAAAC,aAQaC,KAAAqZ,UAAsB,GACtBrZ,KAAAsZ,iBAA2B,GAEpCxZ,mBACIE,KAAKuZ,eACLvZ,KAAKwZ,eAGD1Z,UACJ,OAAOE,KAAKqK,UAAUvJ,WAAWC,cAAc,QAAQ0D,mBAGnD3E,eACJ,MAAM2Z,EAAOzZ,KAAK0Z,UAClBD,EAAK/U,SAAQiV,GAAO3Z,KAAKqZ,UAAY,IAAIrZ,KAAKqZ,UAAWM,EAAIC,YAGzD9Z,eACJ,MAAM6Z,EAAM3Z,KAAK0Z,UAAU,GAC3BC,EAAIvY,OACJpB,KAAKsZ,iBAAmBK,EAAIC,SAGxB9Z,QAAQ8Z,GACZ,MAAMH,EAAOzZ,KAAK0Z,UAClBD,EAAK/U,SAAQiV,IACT,GAAIA,EAAIC,UAAYA,EAAS,CACzBD,EAAIvY,OACJ,OAGJuY,EAAI3Y,UAERhB,KAAKsZ,iBAAmBM,EAG5B9Z,SACI,OACIuB,EAACC,EAAI,CAACuB,IAAKnC,GAAMV,KAAKqK,UAAY3J,GAC9BW,EAAA,MAAA,CAAKI,MAAM,aACNzB,KAAKqZ,UAAUrL,KAAI4L,GAChBvY,EAAA,SAAA,CACII,MAAOzB,KAAKsZ,kBAAoBM,EAAW,UAAW,GACtDlY,QAAS,IAAM1B,KAAK6Z,QAAQD,IAE3BA,MAIbvY,EAAA,MAAA,CAAKI,MAAM,cACPJ,EAAA,OAAA,oBC5DpB,MAAMyY,EAAe,syBCSRC,EAAS,MALtBja,YAAAC,wDAU2BC,KAAAqC,QAAU,MAGzBrC,KAAAQ,SAAW,MAMnBV,eAAeka,GACXha,KAAKia,aAAa/Y,KAAK,CAACmB,QAAS2X,IAGrCla,SACI,OACIuB,EAACC,EAAI,KACDD,EAAA,SAAA,CAAQb,SAAUR,KAAKQ,SAAUiB,MAAO,CAACY,QAAWrC,KAAKqC,SACrDX,QAAS,KACL,IAAK1B,KAAKQ,SAAU,CAChBR,KAAKqC,SAAWrC,KAAKqC,WAI7BhB,EAAA,MAAA,CAAKI,MAAM,+GCrC/B,MAAMyY,EAAqB,gpBCOdC,EAAe,MAL5Bra,YAAAC,aAYyBC,KAAA2D,SAAoB,MAElC3D,KAAAoa,YAAuB,MAKhCta,mBACE,MAAMua,EAAWra,KAAKsa,gBAAgBD,SAAS,GAC/C,MAAME,EAAQF,EAAS5V,mBAAmB0D,OAC1C,GAAIoS,EAAQ,EAAE,CACZva,KAAKoa,YAAc,KAErB,GAAIpa,KAAK2D,SAAS,CAChB3D,KAAKwa,SAAS7Z,UAAUC,IAAI,YAC5BZ,KAAKya,YAAY9W,SAAW,MAC5BiB,YAAW,KACT5E,KAAKya,YAAY9W,SAAW,OAC3B,MAIC7D,iBACNE,KAAK2D,UAAY3D,KAAK2D,SACtB,GAAI3D,KAAK2D,SAAS,CAChB3D,KAAKwa,SAAS7Z,UAAUC,IAAI,YAC5B,OAGFZ,KAAKwa,SAAS7Z,UAAU8B,OAAO,YAGjC3C,SACE,OACEuB,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKI,MAAM,WAAWoB,IAAKnC,GAAMV,KAAKwa,SAAW9Z,GAC9CV,KAAKoa,aACJ/Y,EAAA,SAAA,CACEK,QAAS,IAAM1B,KAAK0a,kBACpBrZ,EAAA,MAAA,CAAKyB,MAAM,6BAA6BC,OAAO,OAAOC,QAAQ,YAAYC,MAAM,OAAOC,KAAK,WAAU7B,EAAA,OAAA,CAAM8B,EAAE,uBAAsB9B,EAAA,OAAA,CAAM8B,EAAE,mBAAmBD,KAAK,YAI1K7B,EAAA,MAAA,CAAKI,MAAM,QACTJ,EAAA,MAAA,CAAKI,MAAM,aACTJ,EAAA,OAAA,OAEFA,EAAA,kBAAA,CAAiBwB,IAAKnC,GAAMV,KAAKya,YAAc/Z,EAAIiD,SAAU3D,KAAK2D,UAChEtC,EAAA,MAAA,CAAKwB,IAAKnC,GAAMV,KAAKsa,gBAAkB5Z,GACrCW,EAAA,OAAA,CAAMiO,KAAK","sourcesContent":[":host {\r\n --background-color: transparent;\r\n --color: #333;\r\n --border-size: 1px;\r\n --border-color: var(--backround-color);\r\n --border-radius: var(--dnn-controls-radius, 5px);\r\n --padding: var(--dnn-controls-padding, 5px);\r\n display: inline-block;\r\n width: auto;\r\n}\r\n\r\n:host(.disabled){\r\n pointer-events: none;\r\n}\r\n\r\n:host(.primary){\r\n --background-color: var(--dnn-color-primary, blue);\r\n --color: var(--dnn-color-primary-contrast, white);\r\n --focus-color: var(--background-color);\r\n}\r\n\r\n:host(.primary.reversed){\r\n --background-color: var(--dnn-color-primary-contrast, white);\r\n --color: var(--dnn-color-primary, blue);\r\n --border-color: var(--dnn-color-primary, blue);\r\n --focus-color: var(--color);\r\n}\r\n\r\n:host(.secondary){\r\n --background-color: var(--dnn-color-secondary, green);\r\n --color: var(--dnn-color-secondary-contrast, white);\r\n --focus-color: var(--background-color);\r\n}\r\n\r\n:host(.secondary.reversed){\r\n --background-color: var(--dnn-color-secondary-contrast, white);\r\n --color: var(--dnn-color-secondary, blue);\r\n --border-color: var(--dnn-color-secondary, blue);\r\n --focus-color: var(--color);\r\n}\r\n\r\n:host(.tertiary){\r\n --background-color: var(--dnn-color-tertiary, yellow);\r\n --color: var(--dnn-color-tertiary-contrast, black);\r\n --focus-color: var(--background-color);\r\n}\r\n\r\n:host(.tertiary.reversed){\r\n --background-color: var(--dnn-color-tertiary-contrast, white);\r\n --color: var(--dnn-color-tertiary, blue);\r\n --border-color: var(--dnn-color-tertiary, blue);\r\n --focus-color: var(--color);\r\n}\r\n\r\n:host(.hydrated){\r\n button{\r\n border: var(--border-size) solid var(--border-color);\r\n border-radius: var(--border-radius);\r\n padding: var(--padding) calc(var(--padding) * 2);\r\n background-color: transparent;\r\n background-color: var(--background-color);\r\n color: var(--color);\r\n outline: none;\r\n &:focus, &:hover{\r\n box-shadow: 0 0 2px 2px var(--focus-color);\r\n }\r\n }\r\n}\r\n\r\n:host(:disabled, [disabled]){\r\n button{\r\n pointer-events: none;\r\n opacity: 0.5;\r\n }\r\n}\r\n\r\n:host(.small){\r\n button{\r\n padding: calc(var(--padding) / 2) var(--padding);\r\n font-size: 0.7em;\r\n }\r\n}\r\n\r\n:host(.large){\r\n button{\r\n padding: calc(var(--padding) * 1.5) calc(var(--padding) * 3);\r\n font-size: 1.2em;\r\n }\r\n}\r\n\r\nbutton{\r\n height: 100%;\r\n width: 100%;\r\n cursor: pointer;\r\n}","import { Component, Element, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\r\n\r\n/**\r\n * @slot Content of the button\r\n */\r\n@Component({\r\n tag: 'dnn-button',\r\n styleUrl: 'dnn-button.scss',\r\n shadow: true\r\n})\r\nexport class DnnButton {\r\n\r\n /**\r\n * Optional button style,\r\n * can be either primary, secondary or tertiary and defaults to primary if not specified\r\n */\r\n @Prop() type: 'primary' | 'secondary' | 'tertiary' = 'primary';\r\n\r\n /**\r\n * Optionally reverses the button style.\r\n */\r\n @Prop() reversed: boolean = false;\r\n\r\n /**\r\n * Optionally sets the button size, small normal or large, defaults to normal\r\n */\r\n @Prop() size?: 'small' | 'normal' | 'large' = 'normal';\r\n\r\n /**\r\n * Optionally add a confirmation dialog before firing the action.\r\n */\r\n @Prop() confirm?: boolean = false;\r\n\r\n /**\r\n * The text of the yes button for confirmation.\r\n */\r\n @Prop() confirmYesText?: string = \"Yes\";\r\n\r\n /**\r\n * The text of the no button for confirmation.\r\n */\r\n @Prop() confirmNoText?: string = \"No\";\r\n\r\n /**\r\n * The text of the confirmation message;\r\n */\r\n @Prop() confirmMessage?: string = \"Are you sure ?\";\r\n \r\n /**\r\n * Disables the button\r\n */\r\n @Prop() disabled: boolean = false;\r\n\r\n @State() modalVisible: boolean = false;\r\n\r\n @Element() el!: HTMLDnnButtonElement;\r\n\r\n private modal!: HTMLDnnModalElement;\r\n\r\n /** \r\n * Fires when confirm is true and the user confirms the action.\r\n */\r\n @Event({\r\n eventName: 'confirmed',\r\n bubbles: false,\r\n cancelable: true,\r\n composed: true\r\n }) confirmed: EventEmitter;\r\n\r\n /**\r\n * Fires when confirm is true and the user cancels the action.\r\n */\r\n @Event({bubbles: false}) canceled: EventEmitter;\r\n\r\n componentDidLoad(){\r\n this.el.classList.add(this.type);\r\n \r\n if (this.reversed){\r\n this.el.classList.add('reversed');\r\n }\r\n\r\n if (this.size !== 'normal'){\r\n this.el.classList.add(this.size);\r\n }\r\n\r\n this.modal = this.el.shadowRoot.querySelector('dnn-modal');\r\n }\r\n\r\n private handleConfirm(){\r\n this.modal.hide();\r\n this.modalVisible = false;\r\n this.confirmed.emit();\r\n }\r\n\r\n private handleCancel(){\r\n this.modal.hide();\r\n this.modalVisible = false;\r\n this.canceled.emit();\r\n }\r\n \r\n private handleClick(): void {\r\n if (this.confirm && !this.modalVisible){\r\n this.modal.show();\r\n this.modalVisible = true;\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <Host disabled={this.disabled} style={{'pointer-events': this.disabled ? 'none' : 'all'}}>\r\n <button class=\"button\" onClick={() => this.handleClick()} disabled={this.disabled}>\r\n <slot></slot>\r\n </button>\r\n {this.confirm &&\r\n <dnn-modal showCloseButton={false} backdropDismiss={false}>\r\n <p>{this.confirmMessage}</p>\r\n <div style={\r\n {\r\n display: 'flex',\r\n justifyContent: 'flex-end'\r\n }\r\n }>\r\n <dnn-button type='primary' style={{margin: '5px'}} onClick={() => this.handleConfirm()}>{this.confirmYesText}</dnn-button>\r\n <dnn-button type='secondary' style={{margin: '5px'}} onClick={() => this.handleCancel()}>{this.confirmNoText}</dnn-button>\r\n </div>\r\n </dnn-modal>\r\n }\r\n </Host>\r\n );\r\n }\r\n \r\n\r\n}\r\n",":host {\r\n /**\r\n * @prop --focus-color: The color to outline the checkbox when hovered or focused, default to the dnn primary color.\r\n */\r\n --focus-color: var(--dnn-color-primary, #3792ED);\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.25rem;\r\n margin: 3px;\r\n}\r\nbutton{\r\n background-color: transparent;\r\n border: 0;\r\n padding: 0;\r\n margin: 0;\r\n outline: none;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n svg.undefined{\r\n opacity: 0.45;\r\n }\r\n &:focus{\r\n box-shadow: 0 0 2px 2px var(--focus-color);\r\n }\r\n}","import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dnn-checkbox',\r\n styleUrl: 'dnn-checkbox.scss',\r\n shadow: true,\r\n})\r\nexport class DnnCheckbox {\r\n @Element() el: HTMLDnnCheckboxElement;\r\n\r\n /** Defines if the checkbox is checked (true) or unchecked (false) or in an intermediate state (undefined) */\r\n @Prop({mutable: true}) checked: boolean | undefined = false;\r\n\r\n /** Defines if clicking the checkbox will go through the intermediate state between checked and unchecked (tri-state) */\r\n @Prop() useIntermediate: boolean = false;\r\n\r\n /** The value for this checkbox (not to be confused with its checked state). */\r\n @Prop() value: string;\r\n\r\n /** Fires up when the checkbox checked property changes. */\r\n @Event() checkedchange: EventEmitter<boolean | undefined>;\r\n \r\n private button: HTMLButtonElement;\r\n\r\n private changeState(): void {\r\n if (!this.useIntermediate){\r\n this.checked = !this.checked;\r\n this.emitEvents();\r\n return;\r\n }\r\n if (this.checked === true){\r\n this.checked = false;\r\n this.button.classList.remove(\"undefined\");\r\n this.emitEvents();\r\n return;\r\n }\r\n if (this.checked === undefined){\r\n this.checked = true;\r\n this.button.classList.remove(\"undefined\");\r\n this.emitEvents();\r\n return;\r\n }\r\n if (this.checked === false){\r\n this.checked = undefined;\r\n this.button.classList.add(\"undefined\");\r\n this.emitEvents();\r\n return;\r\n }\r\n }\r\n\r\n private emitEvents() {\r\n this.checkedchange.emit(this.checked);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <button class=\"icon\" onClick={() => this.changeState()} ref={el => this.button = el}>\r\n {this.checked === false &&\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\"/></svg>\r\n }\r\n {this.checked === true &&\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/></svg>\r\n }\r\n {this.checked === undefined &&\r\n <svg class=\"undefined\" xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><g><rect fill=\"none\" height=\"24\" width=\"24\"/></g><g><g><g><path d=\"M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3z M17,13H7v-2h10V13z\"/></g></g></g></svg>\r\n }\r\n </button>\r\n <label htmlFor={this.el.id} onClick={() => this.changeState()}><slot></slot></label>\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n display: inline-block;\r\n}\r\nbutton{\r\n border: none;\r\n padding: 0px;\r\n margin: 0px;\r\n min-width: 15px;\r\n min-height: 15px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n background-color: transparent;\r\n outline: none;\r\n}\r\nsvg{\r\n height:2em;\r\n width:2em;\r\n transition: all 300ms ease-in-out;\r\n}\r\n\r\n// FOCUS\r\nbutton:focus, button:hover{\r\n svg{\r\n color: var(--dnn-color-primary);\r\n }\r\n}\r\n\r\n// EXPANDED\r\n:host([expanded]){\r\n svg{\r\n transform: rotate(90deg);\r\n }\r\n}","import { Component, Host, h, Prop, Event } from '@stencil/core';\r\nimport { EventEmitter } from '@stencil/core';\r\nimport { Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dnn-chevron',\r\n styleUrl: 'dnn-chevron.scss',\r\n shadow: true\r\n})\r\nexport class DnnChevron {\r\n\r\n /** Expand text for screen readers */\r\n @Prop() expandText?: string = \"expand\";\r\n\r\n /** Collapse text for screen readers */\r\n @Prop() collapseText?: string = \"collapse\";\r\n\r\n /** Is the chevron expanded */\r\n @Prop({mutable: true, reflect: true}) expanded?: boolean = false;\r\n\r\n /** Fires up when the expanded status changes */\r\n @Event() changed: EventEmitter;\r\n\r\n @Watch('expanded')\r\n handleExpandedChanged(newValue: boolean) {\r\n this.changed.emit(newValue);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <button aria-label={this.expanded ? this.collapseText : this.expandText}\r\n onClick={() => this.expanded = !this.expanded}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"/></svg>\r\n </button>\r\n </Host>\r\n );\r\n }\r\n\r\n}\r\n",":host {\r\n display: block;\r\n #container{\r\n height:0;\r\n overflow: hidden;\r\n transition: height 300ms ease-in-out;\r\n }\r\n}","import { Component, Host, h, Prop, Element, Watch, State, Method, Event, EventEmitter, Listen } from '@stencil/core';\r\nimport { Debounce } from '../../utilities/debounce';\r\n\r\n@Component({\r\n tag: \"dnn-collapsible\",\r\n styleUrl: \"dnn-collapsible.scss\",\r\n shadow: true\r\n})\r\nexport class DnnCollapsible {\r\n\r\n @Element() el: HTMLDnnCollapsibleElement;\r\n\r\n /** Defines if the panel is expanded or not. */\r\n @Prop({reflect: true}) expanded: boolean = false;\r\n\r\n /** Defines the transition time in ms, defaults to 100ms */\r\n @Prop() transitionDuration?: number = 150;\r\n\r\n @State() animating: boolean = false;\r\n\r\n @Watch(\"expanded\")\r\n handleExpandedChanged(newValue: boolean){\r\n this.animating = true;\r\n requestAnimationFrame(() => {\r\n const container = this.el.shadowRoot.querySelector(\"#container\") as HTMLDivElement;\r\n if (newValue){\r\n container.style.height = container.scrollHeight + \"px\";\r\n }\r\n else{\r\n container.style.height = \"0px\";\r\n }\r\n });\r\n \r\n requestAnimationFrame(() => {\r\n this.animating = false;\r\n this.dnnCollapsibleHeightChanged.emit();\r\n });\r\n }\r\n\r\n /** Updates the component height, use to update after a slot content changes. */\r\n @Debounce()\r\n @Method()\r\n async updateSize() {\r\n this.updateComponentSize();\r\n }\r\n\r\n private updateComponentSize(){\r\n if (this.expanded){\r\n this.animating = true;\r\n requestAnimationFrame(() => {\r\n const container = this.el.shadowRoot.querySelector(\"#container\") as HTMLDivElement;\r\n let newHeight = 0;\r\n container.querySelector('slot').assignedElements().forEach(node => {\r\n newHeight += node.scrollHeight;\r\n });\r\n container.style.height = newHeight + \"px\";\r\n });\r\n }\r\n }\r\n\r\n /** Fires whenever the collapsible height has changed */\r\n @Event() dnnCollapsibleHeightChanged: EventEmitter<void>;\r\n\r\n @Listen('dnnCollapsibleHeightChanged')\r\n handleOtherCollapsibleHeightChanged(){\r\n setTimeout(() => {\r\n this.updateComponentSize();\r\n }, this.transitionDuration);\r\n }\r\n\r\n private mutationObserver: MutationObserver;\r\n\r\n private handleMutation(mutationList){\r\n mutationList.forEach(mutation => {\r\n requestAnimationFrame(() => {\r\n mutation.target.closest('dnn-collapsible').updateSize();\r\n });\r\n });\r\n }\r\n\r\n componentWillLoad() {\r\n this.mutationObserver = new MutationObserver((mutationList) => {\r\n this.handleMutation(mutationList);\r\n });\r\n }\r\n\r\n componentDidLoad(){\r\n const container = this.el.shadowRoot.querySelector('#container') as HTMLDivElement;\r\n container.style.transitionDuration = this.transitionDuration + 'ms';\r\n\r\n // Monitor for content changes and update own height\r\n const childNodes = [this.el];\r\n childNodes.forEach(element => {\r\n this.mutationObserver.observe(element, {attributes: true, characterData: true, childList: true, subtree: true});\r\n });\r\n\r\n const slot = this.el.shadowRoot.querySelector('slot');\r\n slot.addEventListener(\"slotchange\", () => {\r\n this.updateSize();\r\n });\r\n }\r\n\r\n disconnectedCallback(){\r\n this.mutationObserver.disconnect();\r\n }\r\n /*eslint-enable @stencil/own-methods-must-be-private */\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div id=\"container\">\r\n <slot></slot>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n\r\n}\r\n","/** Color utility class with hsl and rgb converters\r\n * based on math at https://en.wikipedia.org/wiki/HSL_and_HSV\r\n * @copyright Copyright (c) .NET Foundation. All rights reserved.\r\n * @license MIT \r\n */\r\n\r\nexport class ColorInfo{\r\n\r\n private _hue: number = 0;\r\n /** gets the color hue\r\n * @returns a number between 0 and 359, could contain decimals\r\n */\r\n get hue() { return this._hue; }\r\n set hue(value: number){\r\n if (value < 0) { value = 0; }\r\n if (value > 359) { value = 359; }\r\n this._hue = value;\r\n }\r\n\r\n private _saturation: number = 0;\r\n /** gets the color saturation\r\n * @returns a number between 0 and 1, could contain decimals\r\n */\r\n get saturation() { return this._saturation; }\r\n set saturation(value: number) {\r\n if (value < 0) { value = 0; }\r\n if (value > 1) { value = 1; }\r\n this._saturation = value;\r\n }\r\n\r\n private _lightness: number = 0;\r\n /** gets the color lightness\r\n * @returns a number between 0 and 1, could contain decimals\r\n */\r\n get lightness() { return this._lightness; }\r\n set lightness(value: number) {\r\n if (value < 0) { value = 0; }\r\n if (value > 1) { value = 1; }\r\n this._lightness = value;\r\n }\r\n\r\n /** gets or sets the red component \r\n * @returns an integer between 0 and 255\r\n */\r\n get red() {\r\n return this.getRGB().red;\r\n }\r\n set red(value) {\r\n this.setHSL(value, this.green, this.blue);\r\n }\r\n\r\n /** gets or sets the green component\r\n * @returns an integer between 0 and 255\r\n */\r\n get green() {\r\n return this.getRGB().green;\r\n }\r\n set green(value: number) {\r\n this.setHSL(this.red, value, this.blue);\r\n }\r\n\r\n /** gets or sets the blue component\r\n * @returns an integer between 0 and 255\r\n */\r\n get blue() {\r\n return this.getRGB().blue;\r\n }\r\n set blue(value: number) {\r\n this.setHSL(this.red, this.green, value);\r\n }\r\n\r\n /** gets or sets the hex color value, expresses as 6 hexadecimal characters.\r\n * @returns hex representation of the color\r\n */\r\n get hex() {\r\n var r = this.getHex(this.red);\r\n var g = this.getHex(this.green);\r\n var b = this.getHex(this.blue);\r\n return r + g + b;\r\n }\r\n set hex(value: string){\r\n this.red = parseInt(value.substr(0,2));\r\n this.green = parseInt(value.substr(2,2));\r\n this.blue = parseInt(value.substr(4,2));\r\n }\r\n\r\n /** gets white or black color that is a good oposite to the current color\r\n * @returns - \"000000\" or \"FFFFFF\"\r\n */\r\n get contrastColor() {\r\n const brightness = (this.red*299 + this.green*587 + this.blue*114) / 1000\r\n if (brightness > 127){\r\n return \"000000\";\r\n }\r\n return \"FFFFFF\";\r\n }\r\n\r\n private getRGB() {\r\n const chroma = (1 - Math.abs((2 * this._lightness) - 1)) * this.saturation;\r\n // find the quandrant of the hue\r\n const quadrant = this._hue / 60;\r\n // calculate the offset from the quandrant center\r\n const offset = chroma * (1 - Math.abs(quadrant % 2 - 1));\r\n\r\n // Apply the chroma to the primary component and the offset to the 2nd most important component\r\n let r = 0, g = 0, b = 0;\r\n if (0 <= quadrant && quadrant <= 1) {\r\n r = chroma; g = offset; // red to yellow\r\n } else if (1 <= quadrant && quadrant <= 2) {\r\n g = chroma; r = offset; // yellow to green\r\n } else if (2 <= quadrant && quadrant <= 3) {\r\n g = chroma; b = offset; // green to cyan\r\n } else if (3 <= quadrant && quadrant <= 4) {\r\n b = chroma; g = offset; // cyan to blue\r\n } else if (4 <= quadrant && quadrant <= 5) {\r\n b = chroma; r = offset; // blue to magenta\r\n } else if (5 <= quadrant && quadrant <= 6) {\r\n r = chroma; b = offset; // magenta to red\r\n }\r\n // calculate the bias to add to all channels to match the lightness\r\n const bias = this._lightness - (chroma / 2);\r\n\r\n return {\r\n red: Math.round((r + bias) * 255),\r\n green: Math.round((g + bias) * 255),\r\n blue: Math.round((b + bias) * 255)\r\n }\r\n }\r\n\r\n private setHSL(red: number, green: number, blue: number) {\r\n // GENERAL DATA\r\n // all math is based on values from 0 to 1\r\n const r = red/255, g = green/255, b = blue/255;\r\n // we need to max, min and the difference between them to derive hsl\r\n const min = Math.min(r, g, b);\r\n const max = Math.max(r, g, b);\r\n const diff = max - min;\r\n let h = 0, s = 0, l = 0;\r\n\r\n // HUE\r\n if (diff === 0) { // neutral\r\n h = 0;\r\n } else if (max === r) { // red (magenta to yellow range)\r\n h = 60 * ((g - b) / diff);\r\n } else if (max === g) { // green (yellow to cyan range)\r\n h = 60 * (2 + ((b - r) / diff));\r\n } else if (max === b) { // blue (cyan to magenta range)\r\n h = 60 * (4 + ((r - g) / diff));\r\n }\r\n if (h < 0) { h = h + 360} // ensures positive hues only\r\n if (h > 359) { h = 359} // ensures we never return 360 for simplicity since it is the same as 0\r\n\r\n // LIGHTNESS\r\n l = (max + min) / 2;\r\n\r\n // SATURATION\r\n if (max === 0 || min === 1) { // pure black or white have no saturation\r\n s = 0;\r\n } else {\r\n s = (max - l) / (Math.min(l, 1 - l));\r\n }\r\n\r\n this._hue = h;\r\n this._saturation = s;\r\n this._lightness = l;\r\n }\r\n\r\n private getHex(value: number){\r\n var hex = value.toString(16);\r\n if (hex.length < 2){\r\n hex = \"0\" + hex;\r\n }\r\n return hex;\r\n }\r\n} ",".dnn-color-picker{\r\n padding: 15px;\r\n max-width: 400px;\r\n .dnn-color-sliders{\r\n display:flex;\r\n flex-direction: column;\r\n min-width: 200px;\r\n .dnn-color-s-b{\r\n border: 1px solid #ccc;\r\n padding-bottom: var(--color-box-height, 50%);\r\n position: relative;\r\n background-color: red;\r\n &:before{\r\n content: '';\r\n position: absolute;\r\n top:0;\r\n left:0;\r\n width: 100%;\r\n height:100%;\r\n z-index:1;\r\n background: linear-gradient(to right, white, red);\r\n mix-blend-mode: saturation;\r\n }\r\n &:after{\r\n content: '';\r\n position: absolute;\r\n top:0;\r\n left:0;\r\n width: 100%;\r\n height:100%;\r\n z-index:2;\r\n background: linear-gradient(to bottom, white, black);\r\n mix-blend-mode: luminosity;\r\n }\r\n button{\r\n position: absolute;\r\n bottom: calc(50% - 4px);\r\n left: calc(50% - 4px);\r\n width: 8px;\r\n height: 8px;\r\n z-index: 3;\r\n display: block;\r\n background: none;\r\n border: none;\r\n margin-left: -4px;\r\n margin-bottom: -4px;\r\n padding: 7px;\r\n background-color: #fff;\r\n border-radius: 50%;\r\n &:before{\r\n content:'';\r\n position: absolute;\r\n top: -1px;\r\n left: -1px;\r\n border-radius: 50%;\r\n }\r\n &:after{\r\n content:'';\r\n position: absolute;\r\n top: 0px;\r\n left: 0px;\r\n border-radius: 50%;\r\n width: 10px;\r\n height: 10px;\r\n border: 2px solid #ccc;\r\n }\r\n } \r\n }\r\n .dnn-color-bar {\r\n display: flex;\r\n align-items: center;\r\n margin-top: 15px;\r\n .dnn-color-result {\r\n flex-direction: column;\r\n width: 50px;\r\n height: 50px;\r\n border-radius: 50%;\r\n background: red;\r\n }\r\n .dnn-color-hue{\r\n flex: auto;\r\n margin-left: 10px;\r\n height: 16px;\r\n border: 1px solid #ccc;\r\n position: relative;\r\n background: linear-gradient(\r\n to right, \r\n #f00 0, \r\n #ff0 17%,\r\n #0f0 33%,\r\n #0ff 50%,\r\n #00f 67%,\r\n #f0f 84%,\r\n #f00 100%\r\n );\r\n button{\r\n width: 10px;\r\n height: 20px;\r\n position: absolute;\r\n top: -2px;\r\n left: calc(50% - 4px);\r\n border: 0;\r\n padding: 0;\r\n background-color: transparent;\r\n padding-left: -8px;\r\n &:before{\r\n content:'';\r\n position: absolute;\r\n top: -2px;\r\n left: 0px;\r\n border-radius: 3px;\r\n width: 100%;\r\n height: 100%;\r\n border: 1px solid #ccc;\r\n background-color: #fff;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n .dnn-color-fields{\r\n display:flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n .dnn-color-mode-switch {\r\n display: flex;\r\n align-items: flex-end;\r\n padding: .5em;\r\n button {\r\n background-color: transparent;\r\n border: none;\r\n svg {\r\n width: 3em;\r\n height: 3em;\r\n pointer-events: none;\r\n outline: none;\r\n }\r\n }\r\n }\r\n .dnn-rgb-color-fields {\r\n display: flex;\r\n justify-content: space-evenly;\r\n .dnn-rgb-color-field {\r\n display: flex;\r\n flex-direction: column;\r\n flex: auto;\r\n text-align: center;\r\n padding: .5em;\r\n label {\r\n padding-bottom: .25em;\r\n }\r\n input{\r\n border-radius: var(--dnn-button-radius, 3px);\r\n border: 1px solid #ccc;\r\n padding: 0.5em;\r\n padding-left: 1.3em;\r\n text-align: center;\r\n &.red{\r\n border-color: red;\r\n }\r\n &.green{\r\n border-color: green; \r\n }\r\n &.blue{\r\n border-color: blue;\r\n } \r\n }\r\n }\r\n }\r\n .dnn-hsl-color-fields {\r\n display: flex;\r\n justify-content: space-evenly;\r\n .dnn-hsl-color-field {\r\n display: flex;\r\n flex-direction: column;\r\n flex: auto;\r\n text-align: center;\r\n padding: .5em;\r\n label {\r\n padding-bottom: .25em;\r\n }\r\n input{\r\n border-radius: var(--dnn-button-radius, 3px);\r\n border: 1px solid #ccc;\r\n padding: 0.5em;\r\n padding-left: 1.3em;\r\n text-align: center;\r\n }\r\n }\r\n }\r\n .dnn-hex-color-fields {\r\n display: flex;\r\n justify-content: space-evenly;\r\n .dnn-hex-color-field {\r\n display: flex;\r\n flex-direction: column;\r\n flex: auto;\r\n text-align: center;\r\n padding: .5em;\r\n label {\r\n padding-bottom: .25em;\r\n }\r\n .hex-input{\r\n position: relative;\r\n border-radius: var(--dnn-button-radius, 3px);\r\n border: 1px solid #ccc;\r\n padding: 0.323em;\r\n text-align: center;\r\n input{\r\n border:0;\r\n padding:0;\r\n margin:0;\r\n width:100%;\r\n height:100%;\r\n text-align:center;\r\n }\r\n button{\r\n position: absolute;\r\n height: 100%;\r\n top: 0;\r\n right: 1em;\r\n background-color: transparent;\r\n border:0;\r\n padding:0;\r\n margin:0;\r\n svg{\r\n min-width: 1em;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n} ","/** Reusable DNN UI component to pick a color\r\n * @copyright Copyright (c) .NET Foundation. All rights reserved.\r\n * @license MIT \r\n */\r\n\r\nimport { Component, h, State, Element, Prop, EventEmitter, Event, Watch } from \"@stencil/core\";\r\nimport { ColorInfo } from '../../utilities/colorInfo';\r\nimport { Debounce } from \"../../utilities/debounce\";\r\n\r\n/** Color Picker for Dnn */\r\n@Component({\r\n tag: 'dnn-color-picker',\r\n styleUrl: 'dnn-color-picker.scss',\r\n shadow: true\r\n})\r\nexport class DnnColorPicker {\r\n\r\n @Element() el: HTMLDnnColorPickerElement;\r\n\r\n /** Sets the initial color, must be a valid 8 character hexadecimal string without the # sign. */\r\n @Prop() color: string = \"FFFFFF\";\r\n\r\n /** Sets the width-height ratio of the color picker saturation-lightness box.\r\n * @example 100% renders a perfect square\r\n */\r\n @Prop() colorBoxHeight: string = \"50%\";\r\n \r\n @State() currentColor: ColorInfo;\r\n @State() rgbDisplay: string = \"flex\";\r\n @State() hslDisplay: string = \"none\";\r\n @State() hexDisplay: string = \"none\";\r\n\r\n /** Fires up when the color is changed and emits a ColorInfo object\r\n * @see ../../utilities/colorInfo.ts\r\n */\r\n @Event() colorChanged: EventEmitter<ColorInfo>;\r\n\r\n @Debounce(100)\r\n private colorChangedHandler(color: ColorInfo) {\r\n this.colorChanged.emit(color);\r\n }\r\n\r\n @Watch(\"currentColor\")\r\n handeCurrentColorChanged(newValue: ColorInfo){\r\n this.colorChangedHandler(newValue);\r\n }\r\n \r\n private saturationLightnessBox?: HTMLDivElement;\r\n private hueRange?: HTMLDivElement;\r\n\r\n\r\n componentWillLoad() {\r\n this.handleHexChange(this.color);\r\n }\r\n\r\n componentDidLoad() {\r\n (this.el as unknown as HTMLElement).style.setProperty(\"--color-box-height\", this.colorBoxHeight.toString());\r\n }\r\n \r\n private getHex() {\r\n return this.getDoublet(this.currentColor.red) + this.getDoublet(this.currentColor.green) + this.getDoublet(this.currentColor.blue);\r\n }\r\n\r\n private getContrast() {\r\n return this.currentColor.contrastColor;\r\n }\r\n\r\n private getDoublet(value: number){\r\n const valueString = value.toString(16).toUpperCase();\r\n if (valueString.length === 1){\r\n return '0' + valueString;\r\n }\r\n return valueString;\r\n }\r\n\r\n private handleSaturationLightnessMouseDown = (e) => {\r\n e.preventDefault();\r\n this.handleDragLightnessSaturation(e);\r\n window.addEventListener('mousemove', this.handleDragLightnessSaturation);\r\n window.addEventListener('mouseup', this.handleSaturationLightnessMouseUp);\r\n }\r\n\r\n private handleDragLightnessSaturation = (e) => {\r\n const rect = this.saturationLightnessBox.getBoundingClientRect(); \r\n\r\n let x = e.clientX - rect.left; \r\n if (x < 0) { x = 0}\r\n if (x > rect.width) { x = rect.width}\r\n x = x/rect.width;\r\n\r\n let y = e.clientY - rect.top;\r\n if (y < 0) { y = 0}\r\n if (y > rect.height) { y = rect.height}\r\n y = 1 - (y/rect.height);\r\n\r\n const newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = x;\r\n newColor.lightness = y;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleSaturationLightnessMouseUp = () => {\r\n window.removeEventListener('mousemove', this.handleDragLightnessSaturation);\r\n window.removeEventListener('mouseup', this.handleSaturationLightnessMouseUp);\r\n }\r\n\r\n private handleHueMouseDown = (e) => {\r\n e.preventDefault();\r\n this.handleDragHue(e);\r\n window.addEventListener('mousemove', this.handleDragHue);\r\n window.addEventListener('mouseup', this.handleHueMouseUp); \r\n }\r\n\r\n private handleHueMouseUp = () => {\r\n window.removeEventListener('mousemove', this.handleDragHue);\r\n window.removeEventListener('mouseup', this.handleHueMouseUp); \r\n }\r\n\r\n private handleDragHue = (e) => {\r\n const rect = this.hueRange.getBoundingClientRect(); \r\n\r\n let x = e.clientX - rect.left;\r\n if (x < 0) { x = 0}\r\n if (x > rect.width) { x = rect.width}\r\n x = x/rect.width*360; \r\n\r\n const newColor = new ColorInfo();\r\n newColor.hue = x;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleComponentValueChange = (e, channel) => {\r\n let value = parseInt(e.target.value);\r\n if (isNaN(value)) { return }\r\n const newColor = new ColorInfo();\r\n if (value < 0) { value = 0; }\r\n if (value > 255) { value = 255; }\r\n let r = this.currentColor.red;\r\n let g = this.currentColor.green;\r\n let b = this.currentColor.blue;\r\n switch (channel) {\r\n case 'red':\r\n r = value;\r\n break;\r\n case 'green':\r\n g = value;\r\n break;\r\n case 'blue':\r\n b = value;\r\n break;\r\n default:\r\n break;\r\n }\r\n newColor.green = g;\r\n newColor.red = r;\r\n newColor.blue = b;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleHSLChange = (e, component) => { \r\n let value = parseInt(e.target.value);\r\n if (isNaN(value)) {return}\r\n const newColor = new ColorInfo();\r\n if (value != null) { \r\n let h = this.currentColor.hue;\r\n let s = this.currentColor.saturation;\r\n let l = this.currentColor.lightness;\r\n switch (component) {\r\n case \"hue\":\r\n if (value < 0) { value = 0}\r\n if (value > 359) { value = 0}\r\n h = value;\r\n break;\r\n case \"saturation\":\r\n if (value < 0) { value = 0}\r\n if (value > 100) { value = 100}\r\n s = value / 100;\r\n break;\r\n case \"lightness\":\r\n if (value < 0) { value = 0}\r\n if (value > 100) { value = 100}\r\n l = value / 100;\r\n break; \r\n default:\r\n break; \r\n }\r\n newColor.hue = h;\r\n newColor.saturation = s;\r\n newColor.lightness = l;\r\n this.currentColor = newColor;\r\n }\r\n }\r\n\r\n private handleHexChange(value: string){\r\n const newColor = new ColorInfo();\r\n if (value.match(/^(?:[\\da-f]{3}|[\\da-f]{6})$/i).length > 0) {\r\n if (value.length === 3){\r\n let expanded = value[0] + value[0] + value[1] + value[1] + value[2] + value [2];\r\n value = expanded;\r\n }\r\n newColor.red = parseInt(value.substr(0,2), 16);\r\n newColor.green = parseInt(value.substr(2,2), 16);\r\n newColor.blue = parseInt(value.substr(4,2), 16);\r\n }\r\n else{\r\n newColor.red = this.currentColor.red;\r\n newColor.green = this.currentColor.green;\r\n newColor.blue = this.currentColor.blue;\r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n private switchColorMode(e) {\r\n switch(e.target.id) {\r\n case \"rgb-switch\":\r\n this.rgbDisplay = \"none\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"flex\";\r\n break;\r\n case \"hex-switch\":\r\n this.rgbDisplay = \"none\";\r\n this.hslDisplay = \"flex\";\r\n this.hexDisplay = \"none\";\r\n break;\r\n case \"hsl-switch\":\r\n this.rgbDisplay = \"flex\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"none\";\r\n break;\r\n default:\r\n this.rgbDisplay = \"flex\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"none\";\r\n }\r\n }\r\n\r\n private handleSaturationLightnessKeyDown = (e) => { \r\n let newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n\r\n let value = 0.01;\r\n if (e.shiftKey) { value = 0.1 ;}\r\n\r\n switch (e.key) {\r\n case \"ArrowUp\":\r\n newColor.lightness += value;\r\n break;\r\n case \"ArrowDown\":\r\n newColor.lightness -= value;\r\n break;\r\n case \"ArrowLeft\":\r\n newColor.saturation -= value;\r\n break;\r\n case \"ArrowRight\":\r\n newColor.saturation += value;\r\n default:\r\n break; \r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleHueKeyDown = (e) => {\r\n let newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n\r\n let value = 1;\r\n if (e.shiftKey) { value = 10}\r\n\r\n switch (e.key) {\r\n case \"ArrowLeft\":\r\n newColor.hue -= value;\r\n break;\r\n case \"ArrowRight\":\r\n newColor.hue += value;\r\n default:\r\n break;\r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n render() {\r\n const hue = this.currentColor.hue;\r\n const saturation = this.currentColor.saturation;\r\n const lightness = this.currentColor.lightness;\r\n const red = this.currentColor.red;\r\n const green = this.currentColor.green;\r\n const blue = this.currentColor.blue;\r\n\r\n return (\r\n <div class=\"dnn-color-picker\">\r\n <div class=\"dnn-color-sliders\">\r\n <div class=\"dnn-color-s-b\" ref={(element) => this.saturationLightnessBox = element as HTMLDivElement}\r\n style={{backgroundColor: `hsl(${hue},100%,50%)`}}\r\n onMouseDown={this.handleSaturationLightnessMouseDown.bind(this)}\r\n >\r\n <button class=\"dnn-s-b-picker\"\r\n aria-label=\"Press up or down to adjust lightness, left or right to adjust saturation, hold shift to move by 10%\"\r\n role=\"slider\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n aria-valuetext={`Saturation: ${Math.round(this.currentColor.saturation*100)}%, Lightness: ${Math.round(this.currentColor.lightness*100)}%`}\r\n style={{\r\n left: Math.round(saturation * 100) + \"%\",\r\n bottom: Math.round(lightness * 100) + \"%\"\r\n }}\r\n onKeyDown={(e) => this.handleSaturationLightnessKeyDown(e)}\r\n />\r\n </div>\r\n <div class=\"dnn-color-bar\">\r\n <div class=\"dnn-color-result\" style={{\r\n backgroundColor: '#' + this.getHex(),\r\n boxShadow: \"0 0 2px 1px \" + \"#\" + this.getContrast()\r\n }} \r\n />\r\n <div class=\"dnn-color-hue\"\r\n ref={(element) => this.hueRange = element as HTMLDivElement}\r\n onMouseDown={this.handleHueMouseDown.bind(this)}\r\n >\r\n <button class=\"dnn-hue-picker\"\r\n aria-label=\"Press left or right to adjust hue, hold shift to move by 10 degrees\"\r\n role=\"slider\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"359\"\r\n aria-valuenow={Math.round(hue)}\r\n style={{left: (hue/359*100).toString() + \"%\"}}\r\n onKeyDown={(e) => this.handleHueKeyDown(e)}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"dnn-color-fields\">\r\n <div class=\"dnn-rgb-color-fields\" style={{display: this.rgbDisplay}}>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>R</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" step=\"1\" class=\"red\" value={red} aria-label=\"red value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'red')}\r\n />\r\n </div>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>G</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" class=\"green\" value={green} aria-label=\"green value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'green')}\r\n />\r\n </div>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>B</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" class=\"blue\" value={blue} aria-label=\"blue value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'blue')}\r\n />\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"rgb-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"switch to hexadecimal value entry\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-hsl-color-fields\" style={{display: this.hslDisplay}}>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>H</label>\r\n <input type=\"number\" min=\"0\" max=\"359\" step={1} value={Math.round(hue)} aria-label=\"Hue\"\r\n onChange={(e) => this.handleHSLChange(e, 'hue')}\r\n />\r\n </div>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>S</label>\r\n <input type=\"number\" min=\"0\" max=\"100\" step={1} value={Math.round(saturation*100)} aria-label=\"Saturation\"\r\n onChange={(e) => this.handleHSLChange(e, 'saturation')}\r\n />\r\n </div>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>L</label>\r\n <input type=\"number\" min=\"0\" max=\"100\" step={1} value={Math.round(lightness*100)} aria-label=\"Lightness\"\r\n onChange={(e) => this.handleHSLChange(e, 'lightness')}\r\n />\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"hsl-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"Switch to red, green, blue entry mode\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-hex-color-fields\" style={{display: this.hexDisplay}}>\r\n <div class=\"dnn-hex-color-field\">\r\n <label>HEX</label>\r\n <div class=\"hex-input\">\r\n <input type=\"text\" aria-label=\"Hexadecimal value\"\r\n value={this.getHex()}\r\n onChange={e => this.handleHexChange((e.target as HTMLInputElement).value)}\r\n />\r\n <button\r\n class=\"copy\"\r\n aria-label=\"copy value\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"hex-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"Switch to hue saturation lightness values\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}","\r\n:host {\r\n /** \r\n * @prop --border-color: The color of the border.\r\n * @prop --border-radius: The radius of the controls borders.\r\n * @prop --drop-background-color: The color of the background when a file is dropping.\r\n */\r\n --border-color: var(--dnn-color-tertiary-contrast, lightgray);\r\n --border-radius: var(--dnn-controls-radius, 5px);\r\n --drop-background-color: var(--dnn-color-tertiary, lightblue);\r\n\r\n display: flex;\r\n flex-direction: column;\r\n gap: 1rem;\r\n text-align: center;\r\n border: 2px dashed var(--border-color);\r\n border-radius: var(--border-radius);\r\n padding: 1rem;\r\n transition: all 300ms ease-in-out;\r\n}\r\n\r\n:host(.dropping){\r\n background-color: var(--drop-background-color);\r\n}\r\np{\r\n margin: 0;\r\n padding: 0;\r\n}\r\nbutton{\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n border: 0px;\r\n margin: 0;\r\n padding: 0;\r\n background-color: transparent;\r\n &:hover{\r\n cursor: pointer;\r\n }\r\n svg{\r\n margin-right: 0.5rem;\r\n }\r\n}\r\nlabel.upload-file{\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n cursor: pointer;\r\n input{\r\n display: none;\r\n }\r\n}\r\n.video-preview{\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n button{\r\n margin: 1rem;\r\n }\r\n}\r\n","import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dnn-dropzone',\r\n styleUrl: 'dnn-dropzone.scss',\r\n shadow: true,\r\n})\r\nexport class DnnDropzone {\r\n /** Localization strings */\r\n @Prop() resx:{\r\n dragAndDropFile: string;\r\n capture: string;\r\n or: string;\r\n takePicture: string;\r\n uploadFile: string;\r\n } = {\r\n dragAndDropFile: \"Drag and drop a file\",\r\n capture: \"Capture\",\r\n or: \"or\",\r\n takePicture: \"Take a picture\",\r\n uploadFile: \"Upload a file\",\r\n }\r\n\r\n /** A list of allowed file extensions.\r\n * If not specified, any file is allowed.\r\n * Ex: [\"jpg\", \"jped\", \"gif\", \"png\"]\r\n */\r\n @Prop() allowedExtensions: string[];\r\n\r\n /**\r\n * If true, will allow the user to take a snapshot\r\n * using the device camera. (only works over https).\r\n */\r\n @Prop() allowCameraMode: boolean = false;\r\n\r\n /**\r\n * Specifies the jpeg quality for when the device\r\n * camera is used to generate a picture.\r\n * Needs to be a number between 0 and 1 and defaults to 0.8\r\n */\r\n @Prop() captureQuality: number = 0.8;\r\n\r\n /** Fires when file were selected. */\r\n @Event() filesSelected: EventEmitter<File[]>;\r\n \r\n @State() canTakeSnapshots: boolean = false;\r\n\r\n @State() takingPicture: boolean = false;\r\n \r\n private dropzone: HTMLElement;\r\n private fileInput: HTMLInputElement;\r\n private videoPreview: HTMLVideoElement;\r\n private videoSettings!: MediaTrackSettings;\r\n\r\n\r\n componentDidLoad() {\r\n if (this.allowCameraMode){\r\n this.checkIfBrowserCanTakeSnapshots()\r\n .then(result => this.canTakeSnapshots = result);\r\n }\r\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\r\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\r\n var extensionsList = extensionsWithDots.join(\",\");\r\n this.fileInput.accept = extensionsList;\r\n }\r\n }\r\n\r\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\r\n return new Promise((resolve) => {\r\n const mediaDevices = navigator.mediaDevices;\r\n if (mediaDevices == undefined || mediaDevices.enumerateDevices == undefined) {\r\n resolve(false);\r\n }\r\n mediaDevices.enumerateDevices()\r\n .then(devices => {\r\n var result = devices.some(device => device.kind == \"videoinput\");\r\n resolve(result);\r\n });\r\n });\r\n }\r\n\r\n private getFilesFromFileList(files: FileList) : File[] {\r\n var fileList: File[] = [];\r\n for (let index = 0; index < files.length; index++) {\r\n const file = files[index];\r\n fileList.push(file);\r\n }\r\n\r\n return fileList;\r\n }\r\n\r\n private handleUploadButton(element: HTMLInputElement): void {\r\n let files = this.getFilesFromFileList(element.files);\r\n\r\n this.filesSelected.emit(files);\r\n }\r\n\r\n private handleDragOver = (event: DragEvent) => \r\n {\r\n event.stopPropagation();\r\n event.preventDefault();\r\n event.dataTransfer.dropEffect = \"copy\";\r\n this.dropzone.classList.add(\"dropping\");\r\n };\r\n\r\n private hasInvalidExtensions(files: FileList): boolean{\r\n var hasInvalid = false;\r\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\r\n const file = files[fileIndex];\r\n var regex = /(?:\\.([^.]+))?$/;\r\n const fileExtension = regex.exec(file.name)[1];\r\n if (fileExtension == undefined){\r\n hasInvalid = true;\r\n }\r\n\r\n if (this.allowedExtensions != undefined && !this.allowedExtensions.includes(fileExtension)){\r\n hasInvalid = true;\r\n }\r\n\r\n return hasInvalid;\r\n }\r\n }\r\n\r\n private handleDrop = (dropEvent: DragEvent) => {\r\n dropEvent.stopPropagation();\r\n dropEvent.preventDefault();\r\n const files = dropEvent.dataTransfer.files;\r\n\r\n if (this.hasInvalidExtensions(files)){\r\n return;\r\n }\r\n var fileList = this.getFilesFromFileList(files);\r\n this.filesSelected.emit(fileList);\r\n };\r\n\r\n private takeSnapshot(): void {\r\n this.takingPicture = true;\r\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\r\n .then(stream => {\r\n stream\r\n this.videoPreview.srcObject = stream;\r\n this.videoPreview.play()\r\n .then(() => {\r\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\r\n });\r\n })\r\n .catch(error => alert(error));\r\n }\r\n\r\n private applySnapshot(): void {\r\n var canvas = document.createElement(\"canvas\");\r\n const context = canvas.getContext(\"2d\");\r\n canvas.width = this.videoSettings.width;\r\n canvas.height = this.videoSettings.height;\r\n context.drawImage(this.videoPreview, 0, 0);\r\n canvas.toBlob(blob => {\r\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\r\n this.takingPicture = false;\r\n \r\n var fileList = [file];\r\n this.filesSelected.emit(fileList)\r\n }, \"image/jpeg\", this.captureQuality);\r\n }\r\n \r\n render() {\r\n return (\r\n <Host\r\n ref={e => this.dropzone = e}\r\n class=\"dropzone\"\r\n onDragOver={this.handleDragOver}\r\n onDrop={this.handleDrop}\r\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\r\n >\r\n {!this.takingPicture &&\r\n [\r\n <p>{this.resx?.dragAndDropFile}</p>\r\n ,\r\n <p>- {this.resx?.or} -</p>\r\n ,\r\n <label class=\"upload-file\">\r\n <input\r\n type=\"file\"\r\n ref={el => this.fileInput = el}\r\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\r\n >\r\n </input>\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><g><rect fill=\"none\" height=\"24\" width=\"24\"/></g><g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g></svg>\r\n </span>\r\n \r\n {this.resx?.uploadFile}\r\n </label>\r\n ,\r\n this.canTakeSnapshots &&\r\n [\r\n <p>- {this.resx?.or} -</p>\r\n ,\r\n <button\r\n onClick={() => this.takeSnapshot()}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\r\n {this.resx?.takePicture}\r\n </button>\r\n ]\r\n ]\r\n }\r\n {this.takingPicture &&\r\n <div class=\"video-preview\">\r\n <video ref={e => this.videoPreview = e} />\r\n <button\r\n onClick={() => this.applySnapshot()}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \r\n {this.resx?.capture}\r\n </button>\r\n </div>\r\n }\r\n </Host>\r\n );\r\n }\r\n\r\n}\r\n","export enum CornerType {\r\n \"nw\",\r\n \"ne\",\r\n \"se\",\r\n \"sw\",\r\n};",":host {\r\n display: block;\r\n}\r\ncanvas {\r\n display: none;\r\n}\r\n.view{\r\n visibility: hidden;\r\n opacity: 0;\r\n height: 0;\r\n overflow: hidden;\r\n transition: all 300ms ease-in-out;\r\n &.visible{\r\n visibility: visible;\r\n opacity: 1;\r\n height: initial;\r\n overflow: visible;\r\n }\r\n .cropper{\r\n position: relative;\r\n width: 100%;\r\n img{\r\n width: 100%;\r\n display: block;\r\n margin: 0 auto;\r\n }\r\n .backdrop{\r\n backdrop-filter: saturate(0.5);\r\n backdrop-filter: brightness(0.5);\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n .crop{\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n outline: 2px dashed white;\r\n box-shadow: black 0 0 0px 2px;\r\n backdrop-filter: saturate(2);\r\n backdrop-filter: brightness(2);\r\n cursor: move;\r\n >div{\r\n width: 20px;\r\n height: 20px;\r\n background-color: white;\r\n border: 2px solid rgba(0,0,0,0.5);\r\n position: absolute;\r\n &.nw, &.ne{\r\n top: -17px;\r\n }\r\n &.ne, &.se{\r\n right: -17px;\r\n }\r\n &.se, &.sw{\r\n bottom: -17px;\r\n }\r\n &.sw, &.nw{\r\n left: -17px;\r\n }\r\n &.nw, &.se{\r\n cursor: nwse-resize;\r\n }\r\n &.ne, &.sw{\r\n cursor: nesw-resize;\r\n }\r\n }\r\n }\r\n }\r\n}\r\ndnn-modal{\r\n --max-width: 512px;\r\n}","import { Component, Host, h, State, Prop, Event, EventEmitter } from '@stencil/core';\r\nimport { CornerType } from './CornerType';\r\n\r\n/**\r\n * Allows cropping an image in-browser with the option to enforce a specific final size.\r\n * All computation happens in the browser and the final image is emmited\r\n * in an event that has a data-url of the image.\r\n */\r\n@Component({\r\n tag: 'dnn-image-cropper',\r\n styleUrl: 'dnn-image-cropper.scss',\r\n shadow: true,\r\n})\r\nexport class DnnImageCropper {\r\n /** Sets the desired final image width. */\r\n @Prop() width: number = 600;\r\n\r\n /** Sets the desired final image height. */\r\n @Prop() height: number = 600;\r\n\r\n /** Can be used to customize controls text.\r\n * Some values support tokens, see default values for examples.\r\n */\r\n @Prop() resx: {\r\n capture: string;\r\n dragAndDropFile: string;\r\n or: string;\r\n takePicture: string;\r\n uploadFile: string;\r\n imageTooSmall: string;\r\n modalCloseText: string;\r\n } = {\r\n capture: \"Capture\",\r\n dragAndDropFile: \"Drag and drop an image\",\r\n or: \"or\",\r\n takePicture: \"Take a picture\",\r\n uploadFile: \"Upload an image\",\r\n imageTooSmall: \"The image you are attempting to upload does not meet the minimum size requirement of {width} pixels by {height} pixels. Please upload a larger image.\",\r\n modalCloseText: \"Close\",\r\n }\r\n\r\n /** Sets the output quality of the corpped image (number between 0 and 1). */\r\n @Prop() quality: number = 0.8;\r\n\r\n /** When set to true, prevents cropping an image smaller than the required size, which would blow pixel and make the final picture look blurry. */\r\n @Prop() preventUndersized: boolean = false;\r\n\r\n /** When the image crop changes, emits the dataurl for the new cropped image. */\r\n @Event() imageCropChanged: EventEmitter<string>;\r\n\r\n @State() view: IComponentInterfaces[\"View\"];\r\n \r\n private host: HTMLElement;\r\n private hasPictureView: HTMLDivElement;\r\n private noPictureView: HTMLDivElement;\r\n private canvas: HTMLCanvasElement;\r\n private image: HTMLImageElement;\r\n private crop: HTMLDivElement;\r\n private previousTouch: Touch;\r\n private imageTooSmallModal!: HTMLDnnModalElement;\r\n\r\n componentDidLoad() {\r\n this.setView(\"noPictureView\");\r\n }\r\n\r\n private setView(newView: IComponentInterfaces[\"View\"]){\r\n const views = this.host.shadowRoot.querySelectorAll(\".view\");\r\n views.forEach(v =>\r\n v.classList.remove(\"visible\"));\r\n switch (newView) {\r\n case \"noPictureView\":\r\n this.noPictureView.classList.add(\"visible\");\r\n break;\r\n case \"hasPictureView\":\r\n this.hasPictureView.classList.add(\"visible\");\r\n break;\r\n default:\r\n break;\r\n }\r\n this.view = newView;\r\n }\r\n\r\n private initCrop(){\r\n var wantedRatio = this.width / this.height;\r\n var imageRect = this.image.getBoundingClientRect();\r\n var imageRatio = imageRect.width / imageRect.height;\r\n \r\n if (wantedRatio > imageRatio){\r\n var wantedHeight = imageRect.width / wantedRatio;\r\n var diff = imageRect.height - wantedHeight;\r\n this.crop.style.top = Math.round(diff/2).toString() + \"px\";\r\n this.crop.style.height = Math.round(wantedHeight).toString() + \"px\";\r\n }\r\n else{\r\n var wantedWidth = imageRect.height * wantedRatio;\r\n var diff = imageRect.width - wantedWidth;\r\n this.crop.style.left = Math.round(diff/2).toString() + \"px\";\r\n this.crop.style.width = Math.round(wantedWidth).toString() + \"px\";\r\n }\r\n }\r\n\r\n private setImage(){\r\n this.image.addEventListener('load', () => {\r\n this.initCrop();\r\n this.emitImage();\r\n })\r\n this.image.src = this.canvas.toDataURL();\r\n }\r\n\r\n private handleNewFile(file: File): void {\r\n if (file.type.split('/')[0] != \"image\"){\r\n return;\r\n }\r\n \r\n var reader = new FileReader();\r\n reader.onload = readerLoadEvent => {\r\n var img = new Image();\r\n img.onload = () => {\r\n this.canvas.width = img.width;\r\n this.canvas.height = img.height;\r\n if (this.preventUndersized && (img.width < this.width || img.height< this.height)){\r\n this.imageTooSmallModal.show();\r\n return;\r\n }\r\n var ctx = this.canvas.getContext(\"2d\");\r\n ctx.drawImage(img,0,0);\r\n this.setView(\"hasPictureView\");\r\n this.setImage();\r\n }\r\n img.src = readerLoadEvent.target.result.toString();\r\n }\r\n reader.readAsDataURL(file);\r\n }\r\n\r\n private handleCropMouseDown = (event: MouseEvent | TouchEvent) => {\r\n event.stopPropagation();\r\n event.preventDefault();\r\n const element = event.target as HTMLElement;\r\n const className = element.classList[0];\r\n\r\n document.addEventListener(\"mouseup\", this.handleImageCropFinished, false);\r\n document.addEventListener(\"touchend\", this.handleImageCropFinished, false);\r\n switch (className) {\r\n case \"crop\":\r\n document.addEventListener(\"mousemove\", this.handleCropDrag, false);\r\n document.addEventListener(\"touchmove\", this.handleCropDrag, false)\r\n document.addEventListener(\"mouseup\", () => document.removeEventListener(\"mousemove\", this.handleCropDrag));\r\n document.addEventListener(\"touchend\", () => document.removeEventListener(\"touchmove\", this.handleCropDrag));\r\n break;\r\n case \"nw\":\r\n document.addEventListener(\"mousemove\", this.handleNwMouseMove, false);\r\n document.addEventListener(\"touchmove\", this.handleNwMouseMove, false)\r\n document.addEventListener(\"mouseup\", () => document.removeEventListener(\"mousemove\", this.handleNwMouseMove));\r\n document.addEventListener(\"touchend\", () => document.removeEventListener(\"touchmove\", this.handleNwMouseMove));\r\n break;\r\n case \"ne\":\r\n document.addEventListener(\"mousemove\", this.handleNeMouseMove, false);\r\n document.addEventListener(\"touchmove\", this.handleNeMouseMove, false)\r\n document.addEventListener(\"mouseup\", () => document.removeEventListener(\"mousemove\", this.handleNeMouseMove));\r\n document.addEventListener(\"touchend\", () => document.removeEventListener(\"touchmove\", this.handleNeMouseMove));\r\n break\r\n case \"se\":\r\n document.addEventListener(\"mousemove\", this.handleSeMouseMove, false);\r\n document.addEventListener(\"touchmove\", this.handleSeMouseMove, false)\r\n document.addEventListener(\"mouseup\", () => document.removeEventListener(\"mousemove\", this.handleSeMouseMove));\r\n document.addEventListener(\"touchend\", () => document.removeEventListener(\"touchmove\", this.handleSeMouseMove));\r\n break;\r\n case \"sw\":\r\n document.addEventListener(\"mousemove\", this.handleSwMouseMove, false);\r\n document.addEventListener(\"touchmove\", this.handleSwMouseMove, false)\r\n document.addEventListener(\"mouseup\", () => document.removeEventListener(\"mousemove\", this.handleSwMouseMove));\r\n document.addEventListener(\"touchend\", () => document.removeEventListener(\"touchmove\", this.handleSwMouseMove));\r\n break;\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n private handleImageCropFinished = (_ev: MouseEvent) => {\r\n this.emitImage();\r\n document.removeEventListener(\"mouseup\", this.handleImageCropFinished);\r\n this.previousTouch = undefined;\r\n }\r\n\r\n private emitImage() {\r\n var x = this.crop.offsetLeft / this.image.width * this.image.naturalWidth;\r\n var y = this.crop.offsetTop / this.image.height * this.image.naturalHeight;\r\n\r\n var cropRect = this.crop.getBoundingClientRect();\r\n var width = cropRect.width / this.image.width * this.image.naturalWidth;\r\n var height = cropRect.height / this.image.height * this.image.naturalHeight;\r\n\r\n if (x < 0)\r\n x = 0;\r\n if (x > this.image.naturalWidth)\r\n x = this.image.naturalWidth;\r\n if (y < 0)\r\n y = 0;\r\n if (y > this.image.naturalWidth)\r\n y = this.image.naturalWidth;\r\n if (width > this.image.naturalWidth)\r\n width = this.image.naturalWidth;\r\n if (height > this.image.naturalHeight)\r\n height = this.image.naturalHeight;\r\n\r\n var dataUrl = this.generateCroppedImage(x, y, width, height, this.width, this.height);\r\n this.imageCropChanged.emit(dataUrl);\r\n }\r\n\r\n private generateCroppedImage(x: number, y: number, width: number, height: number, desiredWidth: number, desiredHeight: number) {\r\n this.canvas.width = desiredWidth;\r\n this.canvas.height = desiredHeight;\r\n const context = this.canvas.getContext(\"2d\");\r\n context.clearRect(0, 0, desiredWidth, desiredHeight);\r\n context.drawImage(this.image, x, y, width, height, 0, 0, desiredWidth, desiredHeight);\r\n\r\n return this.canvas.toDataURL(\"image/jpeg\", this.quality);\r\n }\r\n\r\n private handleNwMouseMove = (event: MouseEvent | TouchEvent) => {\r\n this.handleCornerDrag(event, CornerType.nw);\r\n }\r\n\r\n private handleNeMouseMove = (event: MouseEvent | TouchEvent) => {\r\n this.handleCornerDrag(event, CornerType.ne);\r\n }\r\n\r\n private handleSeMouseMove = (event: MouseEvent | TouchEvent) => {\r\n this.handleCornerDrag(event, CornerType.se);\r\n }\r\n\r\n private handleSwMouseMove = (event: MouseEvent | TouchEvent) => {\r\n this.handleCornerDrag(event, CornerType.sw);\r\n }\r\n\r\n private handleCornerDrag = (event: MouseEvent | TouchEvent, corner: CornerType) => {\r\n if (!this.isMouseStillInTarget(event)){\r\n return;\r\n }\r\n \r\n let {left, top} = this.getCornerLeftTop(corner);\r\n let newWidth = 0;\r\n let newHeight = 0;\r\n let orientation: \"horizontal\" | \"vertical\" = \"horizontal\";\r\n const wantedRatio = this.width / this.height;\r\n const cropRect = this.crop.getBoundingClientRect();\r\n const imageRect = this.image.getBoundingClientRect();\r\n let { movementX, movementY } = this.getMouvementFromEvent(event);\r\n if (Math.abs(movementX) < Math.abs(movementY)){\r\n orientation = \"vertical\";\r\n }\r\n\r\n if (orientation == \"horizontal\"){\r\n switch (corner) {\r\n case CornerType.nw:\r\n case CornerType.sw:\r\n newWidth = cropRect.width - movementX;\r\n newHeight = newWidth / wantedRatio;\r\n break;\r\n case CornerType.ne:\r\n case CornerType.se:\r\n newWidth = cropRect.width + movementX;\r\n newHeight = newWidth / wantedRatio;\r\n break;\r\n default:\r\n break;\r\n }\r\n } else{\r\n switch (corner) {\r\n case CornerType.nw:\r\n case CornerType.ne:\r\n newHeight = cropRect.height - movementY;\r\n newWidth = newHeight * wantedRatio;\r\n break;\r\n case CornerType.se:\r\n case CornerType.sw:\r\n newHeight = cropRect.height + movementY;\r\n newWidth = newHeight * wantedRatio;\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n\r\n switch (corner) {\r\n case CornerType.ne:\r\n case CornerType.nw:\r\n const topOffset = cropRect.height - newHeight;\r\n top = this.crop.offsetTop + topOffset;\r\n default:\r\n break;\r\n }\r\n\r\n switch (corner) {\r\n case CornerType.nw:\r\n case CornerType.sw:\r\n const leftOffset = cropRect.width - newWidth;\r\n left = this.crop.offsetLeft + leftOffset;\r\n if (left < 0) left = 0;\r\n if (left > imageRect.width) left = imageRect.width;\r\n if (top < 0) top = 0;\r\n if (top > imageRect.height) top = imageRect.height;\r\n if (left + newWidth > imageRect.width) newWidth = imageRect.width - left;\r\n if (top + newHeight > imageRect.height) newHeight = imageRect.height - top;\r\n break;\r\n case CornerType.ne:\r\n case CornerType.se:\r\n if (top < 0) top = 0;\r\n if (top > imageRect.height) top = imageRect.height;\r\n if (left + newWidth > imageRect.width) newWidth = imageRect.width - left;\r\n if (top + newHeight > imageRect.height) newHeight = imageRect.height - top;\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n if (newWidth / newHeight != wantedRatio){\r\n return;\r\n }\r\n\r\n if (this.preventUndersized){\r\n const zoomRatio = this.image.width / this.image.naturalWidth;\r\n if (newWidth / zoomRatio < this.width || newHeight / zoomRatio < this.height){\r\n return;\r\n }\r\n }\r\n\r\n switch (corner) {\r\n case CornerType.ne:\r\n this.crop.style.top = `${top}px`;\r\n this.crop.style.width = `${newWidth}px`;\r\n this.crop.style.height = `${newHeight}px`;\r\n break;\r\n case CornerType.nw:\r\n this.crop.style.left = `${left}px`;\r\n this.crop.style.top = `${top}px`;\r\n this.crop.style.width = `${newWidth}px`;\r\n this.crop.style.height = `${newHeight}px`;\r\n break;\r\n case CornerType.se:\r\n this.crop.style.width = `${newWidth}px`;\r\n this.crop.style.height = `${newHeight}px`;\r\n break;\r\n case CornerType.sw:\r\n this.crop.style.left = `${left}px`;\r\n this.crop.style.width = `${newWidth}px`;\r\n this.crop.style.height = `${newHeight}px`;\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n\r\n private getCornerLeftTop(corner: CornerType): { left: number; top: number; } {\r\n let left = 0;\r\n let top = 0;\r\n switch (corner) {\r\n case CornerType.se:\r\n left = this.crop.offsetLeft;\r\n top = this.crop.offsetTop;\r\n break;\r\n case CornerType.sw:\r\n top = this.crop.offsetTop;\r\n break;\r\n default:\r\n break;\r\n }\r\n return {top, left};\r\n }\r\n\r\n private handleCropDrag = (ev: MouseEvent | TouchEvent) => {\r\n if (!this.isMouseStillInTarget(ev)){\r\n return;\r\n }\r\n let {movementX, movementY} = this.getMouvementFromEvent(ev);\r\n let newLeft = this.crop.offsetLeft + movementX;\r\n let newTop = this.crop.offsetTop + movementY;\r\n var imageRect = this.image.getBoundingClientRect();\r\n var cropRect = this.crop.getBoundingClientRect();\r\n if (newLeft < 0){\r\n newLeft = 0;\r\n }\r\n if (newTop < 0){\r\n newTop = 0;\r\n }\r\n if (newLeft + cropRect.width > imageRect.width){\r\n newLeft = this.crop.offsetLeft;\r\n }\r\n if (newTop + cropRect.height > imageRect.height){\r\n newTop = this.crop.offsetTop;\r\n }\r\n this.crop.style.left = newLeft + \"px\";\r\n this.crop.style.top = newTop + \"px\";\r\n };\r\n \r\n private getMouvementFromEvent(event: MouseEvent | TouchEvent) {\r\n let movementX = 0;\r\n let movementY = 0;\r\n if (event instanceof MouseEvent) {\r\n movementX = event.movementX;\r\n movementY = event.movementY;\r\n }\r\n if (typeof TouchEvent !== \"undefined\"){\r\n if (event instanceof TouchEvent) {\r\n let touch = event.touches[0];\r\n if (this.previousTouch != undefined) {\r\n movementX = touch.pageX - this.previousTouch.pageX;\r\n movementY = touch.pageY - this.previousTouch.pageY;\r\n }\r\n this.previousTouch = touch;\r\n }\r\n }\r\n return { movementX, movementY };\r\n }\r\n\r\n private isMouseStillInTarget(event: MouseEvent | TouchEvent) {\r\n var inside = false;\r\n let mouseX: number;\r\n let mouseY: number;\r\n const imageRect = this.image.getBoundingClientRect();\r\n \r\n if (event instanceof MouseEvent){\r\n mouseX = event.clientX;\r\n mouseY = event.clientY;\r\n }\r\n\r\n if (typeof TouchEvent !== \"undefined\"){\r\n if (event instanceof TouchEvent){\r\n var touch = event.touches[0];\r\n mouseX = touch.clientX;\r\n mouseY = touch.clientY;\r\n }\r\n }\r\n \r\n if (\r\n mouseX >= imageRect.x &&\r\n mouseY >= imageRect.y &&\r\n mouseX <= imageRect.left + imageRect.width &&\r\n mouseY <= imageRect.top + imageRect.height)\r\n {\r\n inside = true;\r\n }\r\n\r\n var corners = this.crop.querySelectorAll(\"div\");\r\n corners.forEach(corner =>{\r\n var cornerRect = corner.getBoundingClientRect();\r\n if (\r\n mouseX >= cornerRect.x &&\r\n mouseY >= cornerRect.y &&\r\n mouseX <= cornerRect.left + cornerRect.width &&\r\n mouseY <= cornerRect.top + cornerRect.height)\r\n {\r\n inside = true;\r\n }\r\n })\r\n\r\n return inside;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host ref={el => this.host = el}>\r\n <canvas ref={el => this.canvas = el} />\r\n <div\r\n class=\"view\"\r\n ref={el => this.hasPictureView = el}\r\n >\r\n <div class=\"cropper\">\r\n <img ref={el => this.image = el} />\r\n <div class=\"backdrop\" />\r\n <div\r\n class=\"crop\"\r\n ref={e => this.crop = e}\r\n onMouseDown={this.handleCropMouseDown}\r\n onTouchStart={this.handleCropMouseDown}\r\n >\r\n <div class=\"nw\" />\r\n <div class=\"ne\" />\r\n <div class=\"se\" />\r\n <div class=\"sw\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"view\"\r\n ref={el => this.noPictureView = el}>\r\n <dnn-dropzone\r\n allowCameraMode\r\n onFilesSelected={e => this.handleNewFile(e.detail[0])}\r\n resx={\r\n {\r\n capture: this.resx.capture,\r\n dragAndDropFile: this.resx.dragAndDropFile,\r\n or: this.resx.or,\r\n takePicture: this.resx.takePicture,\r\n uploadFile: this.resx.uploadFile,\r\n }\r\n }\r\n />\r\n </div>\r\n <dnn-modal ref={el => this.imageTooSmallModal = el} close-text={this.resx.modalCloseText}>\r\n <p>{this.resx.imageTooSmall.replace(\"{width}\", this.width.toString()).replace(\"{height}\", this.height.toString())}</p>\r\n </dnn-modal>\r\n </Host>\r\n );\r\n }\r\n}\r\n\r\ninterface IComponentInterfaces\r\n{\r\n View: \"noPictureView\" | \"takingPictureView\" | \"hasPictureView\" | \"hasCroppedPictureView\";\r\n}",":host {\r\n /**\r\n * @prop --max-width: The maximum width of the module.\r\n */\r\n display: block;\r\n .overlay{\r\n background-color: rgba(0,0,0,0.5);\r\n position: fixed;\r\n top:0;\r\n left:0;\r\n width: 100%;\r\n height: 100%;\r\n z-index: 1;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n backdrop-filter: blur(2px);\r\n transition: all 300ms ease-in-out;\r\n visibility: hidden;\r\n opacity: 0;\r\n .modal{\r\n max-width: var(--max-width, 1200px);\r\n background-color: white;\r\n padding: 30px;\r\n transform: scale(2);\r\n transition: all 300ms ease-in-out;\r\n z-index: 2;\r\n position: relative;\r\n margin: 10%;\r\n max-height: 80%;\r\n border-radius: var(--dnn-controls-radius, 5px);\r\n box-shadow: 10px 10px 20px 0 rgba(0,0,0,0.5);\r\n display: block;\r\n .close{\r\n position: absolute;\r\n background-color:white;\r\n border: 2px solid white;\r\n border-radius: 50%;\r\n padding: 0;\r\n margin: 0;\r\n top: -12px;\r\n right: -12px;\r\n outline: none;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n &:focus, &:hover{\r\n box-shadow: 0 0 2px 2px var(--dnn-color-primary, blue);\r\n }\r\n svg{\r\n width: 24px;\r\n height: 24px;\r\n color: grey;\r\n }\r\n }\r\n }\r\n &.visible{\r\n visibility: visible;\r\n opacity: 1;\r\n .modal{\r\n transform: scale(1);\r\n box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.5);\r\n display: block;\r\n }\r\n }\r\n }\r\n}","import { Component, Element, Host, h, Prop, Event, EventEmitter, Method, State } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dnn-modal',\r\n styleUrl: 'dnn-modal.scss',\r\n shadow: true\r\n})\r\nexport class DnnModal {\r\n \r\n @Element() el!: HTMLDnnModalElement;\r\n \r\n /**\r\n * Pass false to remove the backdrop click auto-dismiss feature.\r\n */\r\n @Prop() backdropDismiss: boolean = true;\r\n\r\n /**\r\n * Optionally pass the aria-label text for the close button.\r\n * Defaults to \"Close modal\" if not provided.\r\n */\r\n @Prop() closeText?: string = \"Close modal\";\r\n\r\n /**\r\n * Optionally you can pass false to not show the close button.\r\n * If you decide to do so, you should either not also prevent dismissal by clicking the backdrop\r\n * or provide your own dismissal logic in the modal content.\r\n */\r\n @Prop() showCloseButton?: boolean = true;\r\n\r\n @State() visible: boolean = false;\r\n\r\n /**\r\n * Shows the modal\r\n */\r\n @Method()\r\n async show() {\r\n this.visible = true;\r\n }\r\n\r\n /**\r\n * Hides the modal\r\n */\r\n @Method()\r\n async hide() {\r\n this.visible = false;\r\n }\r\n\r\n /**\r\n * Fires when the modal is dismissed.\r\n */\r\n @Event() dismissed!: EventEmitter;\r\n\r\n private handleDismiss(){\r\n this.visible = false;\r\n this.dismissed.emit();\r\n }\r\n\r\n private handleBackdropClick(e: MouseEvent): void {\r\n const element = (e.target as HTMLElement);\r\n if (element.id === \"backdrop\" && this.backdropDismiss){\r\n this.handleDismiss();\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div id=\"backdrop\"\r\n class={this.visible ? 'overlay visible' : 'overlay'}\r\n onClick={e => this.handleBackdropClick(e)}\r\n >\r\n <div class=\"modal\">\r\n {this.showCloseButton &&\r\n <button\r\n class=\"close\"\r\n aria-label={this.closeText}\r\n onClick={() => this.handleDismiss()}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z\"/></svg>\r\n </button>\r\n }\r\n <slot></slot>\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n position: relative;\r\n display: flex;\r\n justify-content: space-between;\r\n --background-color: transparent;\r\n --color: #333;\r\n --border-size: 1px;\r\n --border-color: grey;\r\n --border-active-color: black;\r\n --border-radius: var(--dnn-controls-radius, 5px);\r\n --padding: var(--dnn-controls-padding, 5px);\r\n --focus-color: var(--dnn-color-primary, blue);\r\n input {\r\n width:100%;\r\n border: var(--border-size) solid var(--border-color);\r\n outline: none;\r\n border-radius: var(--border-radius);\r\n padding: var(--padding);\r\n padding-right: 32px;\r\n transition: all 300ms ease-in-out;\r\n &:focus, &:hover{\r\n outline: none;\r\n box-shadow: 0 0 2px 2px var(--focus-color);\r\n }\r\n }\r\n svg{\r\n position: absolute;\r\n top:0;\r\n right:0;\r\n height: 100%;\r\n transform: scale(0.7);\r\n fill: var(--color);\r\n outline: var(--color);\r\n color: var(--color);\r\n transition: all 300ms ease-in-out;\r\n }\r\n button{\r\n background: transparent;\r\n border: 0;\r\n margin: 0;\r\n padding: 0;\r\n &:focus, &:hover{\r\n svg{\r\n fill: var(--focus-color);\r\n outline: var(--focus-color);\r\n color: var(--focus-color);\r\n }\r\n }\r\n }\r\n}\r\n","import { Component, Host, h, Event, EventEmitter, Watch, Prop } from '@stencil/core';\r\nimport { Debounce } from '../../utilities/debounce';\r\n@Component({\r\n tag: 'dnn-searchbox',\r\n styleUrl: 'dnn-searchbox.scss',\r\n shadow: true\r\n})\r\nexport class DnnSearchbox {\r\n\r\n /**\r\n * Sets the field placeholder text.\r\n */\r\n @Prop() placeholder?: string = \"\";\r\n\r\n /**\r\n * Debounces the queryChanged by 500ms.\r\n */\r\n @Prop() debounced: boolean = true;\r\n\r\n /** Sets the query */\r\n @Prop({mutable: true}) query: string = \"\";\r\n\r\n /**\r\n * Fires up each time the search query changes.\r\n * The data passed is the new query.\r\n */\r\n @Event() queryChanged: EventEmitter;\r\n\r\n @Watch('query')\r\n fireQueryChanged(){\r\n if (this.debounced){\r\n this.debouncedHandleQueryChanged();\r\n }\r\n else{\r\n this.handleQueryChanged();\r\n }\r\n }\r\n \r\n private handleQueryChanged(){\r\n this.queryChanged.emit(this.query);\r\n }\r\n\r\n @Debounce(500)\r\n private debouncedHandleQueryChanged(){\r\n this.handleQueryChanged();\r\n }\r\n \r\n\r\n render() {\r\n return (\r\n <Host>\r\n <input type=\"text\" value={this.query}\r\n placeholder={this.placeholder}\r\n onInput={e => this.query = (e.target as HTMLInputElement).value}\r\n />\r\n {this.query !== \"\" ?\r\n <button class=\"svg clear\"\r\n onClick={() => this.query = \"\"}\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z\"/></svg>\r\n </button>\r\n :\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\"/></svg>\r\n }\r\n </Host>\r\n );\r\n }\r\n\r\n}\r\n",":host {\r\n /**\r\n * @prop --color: Normal Color of the inactive sort icon.\r\n * @prop --color-sorted: Color of the sorted sort icon.\r\n * @prop --color-hover: Color of the icons when hovered.\r\n */\r\n display: inline-block;\r\n}\r\n\r\nbutton {\r\n outline: none;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n background-color: transparent;\r\n outline: none;\r\n display: inline-block;\r\n line-height: 1em;\r\n position: relative;\r\n top: 0.25em;\r\n svg{\r\n height: 1.5em;\r\n width: auto;\r\n fill: var(--color, #888);\r\n }\r\n &.active{\r\n svg{\r\n fill: var(--color-sorted, var(--dnn-color-primary, rgb(2,139,255)));\r\n }\r\n }\r\n &:hover, &:focus{\r\n svg{\r\n fill: var(--color-hover, var(--dnn-color-primary-light, #36a1ff));\r\n }\r\n }\r\n}","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dnn-sort-icon',\r\n styleUrl: 'dnn-sort-icon.scss',\r\n shadow: true\r\n})\r\nexport class DnnSortIcon {\r\n /** Defines the current sort direction */\r\n @Prop() sortDirection: \"asc\" | \"desc\" | \"none\" = \"none\";\r\n\r\n /** Emitted when the sort is changed. */\r\n @Event() sortChanged!: EventEmitter<\"asc\"|\"desc\"|\"none\">;\r\n \r\n private changeSort(): void {\r\n switch (this.sortDirection) {\r\n case \"asc\":\r\n this.sortDirection = \"desc\";\r\n break;\r\n case \"desc\":\r\n this.sortDirection = \"asc\";\r\n break;\r\n case \"none\":\r\n this.sortDirection = \"asc\";\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n this.sortChanged.emit(this.sortDirection);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <button\r\n class={{\"active\": this.sortDirection != \"none\"}}\r\n onClick={() => this.changeSort()}\r\n >\r\n {this.sortDirection == \"none\" &&\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 16\"><path d=\"M 0 7 H 12 L 6 0 Z M 0 9 H 12 L 6 16 Z\"></path></svg>\r\n }\r\n {this.sortDirection == \"asc\" &&\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 16\"><path d=\"M 0 7 H 12 L 6 0 Z\"></path></svg>\r\n }\r\n {this.sortDirection == \"desc\" &&\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 16\"><path d=\"M 0 9 H 12 L 6 16 Z\"></path></svg>\r\n }\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n",null,"import { Component, Host, h, Prop, State, Method } from \"@stencil/core\";\r\n\r\n/** Represents a single tab and must be used inside a dnn-tabs element. */\r\n@Component({\r\n tag: 'dnn-tab',\r\n styleUrl: 'dnn-tab.scss',\r\n shadow: true,\r\n})\r\nexport class DnnTab {\r\n /** Defines the tab title. */\r\n @Prop() tabTitle!: string;\r\n\r\n @State() visible: boolean = false;\r\n\r\n /** Shows the tab. */\r\n @Method()\r\n async show(){\r\n this.visible = true;\r\n }\r\n\r\n /** Hides the modal */\r\n @Method()\r\n async hide(){\r\n this.visible = false;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n {this.visible &&\r\n <slot></slot>\r\n }\r\n </Host>\r\n );\r\n }\r\n}",":host {\r\n /**\r\n * @prop --color-background: The color of the inactive tabs.\r\n * @prop --color-text: The color of the text for inactive tabs.\r\n * @prop --color-visible: The color of the active tab.\r\n * @prop --color-visible-text: The color of the text for the active tab.\r\n * @prop --color-focus: outline color when hovering or pre-selecting a tab.\r\n */\r\n display: block;\r\n --color-background: var(--dnn-color-secondary-dark, lightgray);\r\n --color-text: var(--dnn-color-secondary-contrast, #333);\r\n --color-visible: var(--dnn-color-primary, #3792ED);\r\n --color-visible-text: var(--dnn-color-primary-contrast, #FFF);\r\n --color-focus: var(--dnn-color-primary, #3792ed);\r\n }\r\n\r\n .tabTitles{\r\n display: flex;\r\n background-color: var(--color-background);\r\n color: var(--color-text);\r\n button{\r\n padding: 0.5rem 1rem;\r\n border: 0;\r\n margin: 0;\r\n background-color: transparent;\r\n &.visible{\r\n background-color: var(--color-visible);\r\n color: var(--color-bisible-text);\r\n }\r\n &:focus, &:hover{\r\n outline: none;\r\n box-shadow: 0 0 2px 2px var(--color-focus);\r\n }\r\n }\r\n }\r\n\r\n .currentTab{\r\n border: 1px solid var(--color-background);\r\n padding: 1rem;\r\n }","import { Component, Host, h, State } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: 'dnn-tabs',\r\n styleUrl: 'dnn-tabs.scss',\r\n shadow: true,\r\n})\r\nexport class DnnTabs {\r\n private component: HTMLElement;\r\n\r\n @State() tabTitles: string[] = [];\r\n @State() selectedTabTitle: string = \"\";\r\n\r\n componentDidLoad(){\r\n this.updateTitles();\r\n this.showFirstTab();\r\n }\r\n\r\n private getTabs() {\r\n return this.component.shadowRoot.querySelector(\"slot\").assignedElements() as HTMLDnnTabElement[];\r\n }\r\n\r\n private updateTitles(){\r\n const tabs = this.getTabs();\r\n tabs.forEach(tab => this.tabTitles = [...this.tabTitles, tab.tabTitle]);\r\n }\r\n\r\n private showFirstTab(){\r\n const tab = this.getTabs()[0];\r\n tab.show();\r\n this.selectedTabTitle = tab.tabTitle;\r\n }\r\n\r\n private showTab(tabTitle: string) {\r\n const tabs = this.getTabs();\r\n tabs.forEach(tab => {\r\n if (tab.tabTitle == tabTitle){\r\n tab.show();\r\n return;\r\n }\r\n\r\n tab.hide();\r\n });\r\n this.selectedTabTitle = tabTitle;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host ref={el => this.component = el}>\r\n <div class=\"tabTitles\">\r\n {this.tabTitles.map(tabTitle =>\r\n <button\r\n class={this.selectedTabTitle == tabTitle ? \"visible\": \"\"}\r\n onClick={() => this.showTab(tabTitle)}\r\n >\r\n {tabTitle}\r\n </button>\r\n )}\r\n </div>\r\n <div class=\"currentTab\">\r\n <slot></slot>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}",":host {\r\n /**\r\n * @prop --background: Background of the toggle.\r\n * @prop --background-checked: Background of the toggle when checked.\r\n * @prop --handle-background: Background of the handle.\r\n * @prop --handle-background-checked: Background of the handle when checked.\r\n * @prop --border-radius: The radius of the background borders.\r\n * @prop --handle-border-radius: The radius of the handle.\r\n */\r\n\r\n display: inline-block;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton {\r\n height: 1.5em;\r\n width: 2.5em;\r\n outline: none;\r\n background-color: var(--background, #888);\r\n border: 0;\r\n border-radius: var(--border-radius, var(--dnn-controls-radius, 0.75em));\r\n padding: 0.1em;\r\n position: relative;\r\n margin: 0;\r\n transition: background-color 300ms ease-in-out;\r\n position: relative;\r\n cursor: pointer;\r\n &:hover, &:focus{\r\n box-shadow: 0 0 2px 2px var(--dnn-color-primary);\r\n }\r\n &.checked{\r\n background-color: var(--background-checked, var(--dnn-color-primary, blue));\r\n .handle{\r\n left: calc(1em + 4px);\r\n }\r\n }\r\n &:disabled{\r\n opacity: 0.5;\r\n cursor: not-allowed;\r\n box-shadow: none;\r\n }\r\n .handle{\r\n transition: all 300ms ease-in-out;\r\n background-color:white;\r\n width: 1em;\r\n height: 1em;\r\n border-radius: var(--dnn-controls-radius, 50%);\r\n position: absolute;\r\n top: calc(50% - 0.5em);\r\n left: 2px;\r\n }\r\n}","import { Component, h, Element, Prop, Event, EventEmitter, Watch, Host } from \"@stencil/core\";\r\nimport { DnnToggleChangeEventDetail } from \"./toggle-interface\";\r\n\r\n\r\n@Component({\r\n tag: \"dnn-toggle\",\r\n styleUrl: \"dnn-toggle.scss\",\r\n shadow: true\r\n})\r\nexport class DnnToggle {\r\n\r\n @Element() element: HTMLDnnToggleElement;\r\n\r\n /** If 'true' the toggle is checked (on). */\r\n @Prop({mutable: true}) checked = false;\r\n\r\n /** If 'true' the toggle is not be interacted with. */\r\n @Prop() disabled = false;\r\n\r\n /** Fires when the toggle changed */\r\n @Event() checkChanged!: EventEmitter<DnnToggleChangeEventDetail>;\r\n\r\n @Watch(\"checked\")\r\n checkedChanged(isChecked: boolean){\r\n this.checkChanged.emit({checked: isChecked});\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <button disabled={this.disabled} class={{'checked': this.checked}}\r\n onClick={() => {\r\n if (!this.disabled) {\r\n this.checked = !this.checked;\r\n }\r\n }}\r\n >\r\n <div class=\"handle\"></div>\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n display: flex;\r\n overflow: hidden;\r\n}\r\n.expander{\r\n width: 24px;\r\n height: 24px;\r\n button{\r\n transition: all 150ms ease-in-out;\r\n background-color:transparent;\r\n border: none;\r\n padding: 0;\r\n margin: 0;\r\n outline: none;\r\n height: 1em;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n cursor: pointer;\r\n position: relative;\r\n top: 2px;\r\n svg{\r\n :first-child{\r\n transition: all 150ms ease-in-out;\r\n fill: white;\r\n stroke: black\r\n }\r\n }\r\n }\r\n &.expanded{\r\n button{\r\n transform: rotate(45deg);\r\n svg{\r\n :first-child{\r\n fill: black;\r\n stroke: black;\r\n }\r\n }\r\n }\r\n }\r\n}\r\ndiv.item{\r\n .item-slot{\r\n display: flex;\r\n align-items: center;\r\n gap: 0.25em;\r\n }\r\n div.children{\r\n overflow: hidden;\r\n height:0;\r\n transition: all 150ms ease-in-out;\r\n }\r\n}","import { Component, Host, h, Prop, State, Element } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dnn-treeview-item',\r\n styleUrl: 'dnn-treeview-item.scss',\r\n shadow: true,\r\n})\r\nexport class DnnTreeviewItem {\r\n \r\n private expander!: HTMLDivElement;\r\n\r\n @Element() el!: HTMLDnnTreeviewItemElement;\r\n \r\n /** Defines if the current node is expanded */\r\n @Prop({mutable: true}) expanded: boolean = false;\r\n\r\n @State() hasChildren: boolean = false;\r\n \r\n private childrenElement!: HTMLDivElement;\r\n private collapsible!: HTMLDnnCollapsibleElement;\r\n\r\n componentDidLoad() {\r\n const children = this.childrenElement.children[0] as HTMLSlotElement;\r\n const count = children.assignedElements().length\r\n if (count > 0){\r\n this.hasChildren = true;\r\n }\r\n if (this.expanded){\r\n this.expander.classList.add(\"expanded\");\r\n this.collapsible.expanded = false;\r\n setTimeout(() => {\r\n this.collapsible.expanded = true;\r\n }, 300);\r\n }\r\n }\r\n\r\n private toggleCollapse(): void {\r\n this.expanded = !this.expanded;\r\n if (this.expanded){\r\n this.expander.classList.add(\"expanded\");\r\n return;\r\n }\r\n\r\n this.expander.classList.remove(\"expanded\");\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div class=\"expander\" ref={el => this.expander = el}>\r\n {this.hasChildren &&\r\n <button\r\n onClick={() => this.toggleCollapse()}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M10 17l5-5-5-5v10z\"/><path d=\"M0 24V0h24v24H0z\" fill=\"none\"/></svg>\r\n </button>\r\n }\r\n </div>\r\n <div class=\"item\">\r\n <div class=\"item-slot\">\r\n <slot></slot>\r\n </div>\r\n <dnn-collapsible ref={el => this.collapsible = el} expanded={this.expanded}>\r\n <div ref={el => this.childrenElement = el}>\r\n <slot name=\"children\"></slot>\r\n </div>\r\n </dnn-collapsible>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n\r\nexport interface ExpandedToggledEvent{\r\n state: \"expanded\" | \"collapsed\";\r\n height: number;\r\n}"]}
|
package/dist/dnn/p-bd3d3361.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
const t="dnn";let e;let n;let s=false;let l=false;const o=typeof window!=="undefined"?window:{};const c=o.document||{head:{}};const i={t:0,l:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,s)=>t.addEventListener(e,n,s),rel:(t,e,n,s)=>t.removeEventListener(e,n,s),ce:(t,e)=>new CustomEvent(t,e)};const f=t=>Promise.resolve(t);const r=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replace==="function"}catch(t){}return false})();const u=(t,e,n,s)=>{if(n){n.map((([n,s,l])=>{const o=t;const c=a(e,l);const f=d(n);i.ael(o,s,c,f);(e.o=e.o||[]).push((()=>i.rel(o,s,c,f)))}))}};const a=(t,e)=>n=>{try{{if(t.t&256){t.i[e](n)}else{(t.u=t.u||[]).push([e,n])}}}catch(t){pt(t)}};const d=t=>(t&2)!==0;const h="{visibility:hidden}.hydrated{visibility:inherit}";const p=(t,e="")=>{{return()=>{}}};const y=(t,e)=>{{return()=>{}}};const $=new WeakMap;const m=(t,e,n)=>{let s=mt.get(t);if(r&&n){s=s||new CSSStyleSheet;s.replace(e)}else{s=e}mt.set(t,s)};const w=(t,e,n,s)=>{let l=g(e);let o=mt.get(l);t=t.nodeType===11?t:c;if(o){if(typeof o==="string"){t=t.head||t;let e=$.get(t);let n;if(!e){$.set(t,e=new Set)}if(!e.has(l)){{{n=c.createElement("style");n.innerHTML=o}t.insertBefore(n,t.querySelector("link"))}if(e){e.add(l)}}}else if(!t.adoptedStyleSheets.includes(o)){t.adoptedStyleSheets=[...t.adoptedStyleSheets,o]}}return l};const b=t=>{const e=t.h;const n=t.p;const s=e.t;const l=p("attachStyles",e.$);const o=w(n.shadowRoot?n.shadowRoot:n.getRootNode(),e);if(s&10){n["s-sc"]=o;n.classList.add(o+"-h")}l()};const g=(t,e)=>"sc-"+t.$;const S={};const j="http://www.w3.org/2000/svg";const O="http://www.w3.org/1999/xhtml";const v=t=>t!=null;const k=t=>{t=typeof t;return t==="object"||t==="function"};const C=(t,e,...n)=>{let s=null;let l=false;let o=false;let c=[];const i=e=>{for(let n=0;n<e.length;n++){s=e[n];if(Array.isArray(s)){i(s)}else if(s!=null&&typeof s!=="boolean"){if(l=typeof t!=="function"&&!k(s)){s=String(s)}if(l&&o){c[c.length-1].m+=s}else{c.push(l?M(null,s):s)}o=l}}};i(n);if(e){{const t=e.className||e.class;if(t){e.class=typeof t!=="object"?t:Object.keys(t).filter((e=>t[e])).join(" ")}}}const f=M(t,null);f.g=e;if(c.length>0){f.S=c}return f};const M=(t,e)=>{const n={t:0,j:t,m:e,O:null,S:null};{n.g=null}return n};const P={};const x=t=>t&&t.j===P;const L=(t,e,n,s,l,c)=>{if(n!==s){let f=ht(t,e);let r=e.toLowerCase();if(e==="class"){const e=t.classList;const l=E(n);const o=E(s);e.remove(...l.filter((t=>t&&!o.includes(t))));e.add(...o.filter((t=>t&&!l.includes(t))))}else if(e==="style"){{for(const e in n){if(!s||s[e]==null){if(e.includes("-")){t.style.removeProperty(e)}else{t.style[e]=""}}}}for(const e in s){if(!n||s[e]!==n[e]){if(e.includes("-")){t.style.setProperty(e,s[e])}else{t.style[e]=s[e]}}}}else if(e==="ref"){if(s){s(t)}}else if(!f&&e[0]==="o"&&e[1]==="n"){if(e[2]==="-"){e=e.slice(3)}else if(ht(o,r)){e=r.slice(2)}else{e=r[2]+e.slice(3)}if(n){i.rel(t,e,n,false)}if(s){i.ael(t,e,s,false)}}else{const o=k(s);if((f||o&&s!==null)&&!l){try{if(!t.tagName.includes("-")){let l=s==null?"":s;if(e==="list"){f=false}else if(n==null||t[e]!=l){t[e]=l}}else{t[e]=s}}catch(t){}}if(s==null||s===false){if(s!==false||t.getAttribute(e)===""){{t.removeAttribute(e)}}}else if((!f||c&4||l)&&!o){s=s===true?"":s;{t.setAttribute(e,s)}}}}};const U=/\s/;const E=t=>!t?[]:t.split(U);const T=(t,e,n,s)=>{const l=e.O.nodeType===11&&e.O.host?e.O.host:e.O;const o=t&&t.g||S;const c=e.g||S;{for(s in o){if(!(s in c)){L(l,s,o[s],undefined,n,e.t)}}}for(s in c){L(l,s,o[s],c[s],n,e.t)}};const W=(t,n,l,o)=>{let i=n.S[l];let f=0;let r;let u;if(i.m!==null){r=i.O=c.createTextNode(i.m)}else{if(!s){s=i.j==="svg"}r=i.O=c.createElementNS(s?j:O,i.j);if(s&&i.j==="foreignObject"){s=false}{T(null,i,s)}if(v(e)&&r["s-si"]!==e){r.classList.add(r["s-si"]=e)}if(i.S){for(f=0;f<i.S.length;++f){u=W(t,i,f);if(u){r.appendChild(u)}}}{if(i.j==="svg"){s=false}else if(r.tagName==="foreignObject"){s=true}}}return r};const A=(t,e,s,l,o,c)=>{let i=t;let f;if(i.shadowRoot&&i.tagName===n){i=i.shadowRoot}for(;o<=c;++o){if(l[o]){f=W(null,s,o);if(f){l[o].O=f;i.insertBefore(f,e)}}}};const F=(t,e,n,s,l)=>{for(;e<=n;++e){if(s=t[e]){l=s.O;D(s);l.remove()}}};const H=(t,e,n,s)=>{let l=0;let o=0;let c=e.length-1;let i=e[0];let f=e[c];let r=s.length-1;let u=s[0];let a=s[r];let d;while(l<=c&&o<=r){if(i==null){i=e[++l]}else if(f==null){f=e[--c]}else if(u==null){u=s[++o]}else if(a==null){a=s[--r]}else if(R(i,u)){q(i,u);i=e[++l];u=s[++o]}else if(R(f,a)){q(f,a);f=e[--c];a=s[--r]}else if(R(i,a)){q(i,a);t.insertBefore(i.O,f.O.nextSibling);i=e[++l];a=s[--r]}else if(R(f,u)){q(f,u);t.insertBefore(f.O,i.O);f=e[--c];u=s[++o]}else{{d=W(e&&e[o],n,o);u=s[++o]}if(d){{i.O.parentNode.insertBefore(d,i.O)}}}}if(l>c){A(t,s[r+1]==null?null:s[r+1].O,n,s,o,r)}else if(o>r){F(e,l,c)}};const R=(t,e)=>{if(t.j===e.j){return true}return false};const q=(t,e)=>{const n=e.O=t.O;const l=t.S;const o=e.S;const c=e.j;const i=e.m;if(i===null){{s=c==="svg"?true:c==="foreignObject"?false:s}{if(c==="slot");else{T(t,e,s)}}if(l!==null&&o!==null){H(n,l,e,o)}else if(o!==null){if(t.m!==null){n.textContent=""}A(n,null,e,o,0,o.length-1)}else if(l!==null){F(l,0,l.length-1)}if(s&&c==="svg"){s=false}}else if(t.m!==i){n.data=i}};const D=t=>{{t.g&&t.g.ref&&t.g.ref(null);t.S&&t.S.map(D)}};const I=(t,s)=>{const l=t.p;const o=t.h;const c=t.v||M(null,null);const i=x(s)?s:C(null,null,s);n=l.tagName;if(o.k){i.g=i.g||{};o.k.map((([t,e])=>i.g[e]=l[t]))}i.j=null;i.t|=4;t.v=i;i.O=c.O=l.shadowRoot||l;{e=l["s-sc"]}q(c,i)};const N=t=>ut(t).p;const V=(t,e,n)=>{const s=N(t);return{emit:t=>_(s,e,{bubbles:!!(n&4),composed:!!(n&2),cancelable:!!(n&1),detail:t})}};const _=(t,e,n)=>{const s=i.ce(e,n);t.dispatchEvent(s);return s};const z=(t,e)=>{if(e&&!t.C&&e["s-p"]){e["s-p"].push(new Promise((e=>t.C=e)))}};const B=(t,e)=>{{t.t|=16}if(t.t&4){t.t|=512;return}z(t,t.M);const n=()=>G(t,e);return vt(n)};const G=(t,e)=>{const n=p("scheduleUpdate",t.h.$);const s=t.i;let l;if(e){{t.t|=256;if(t.u){t.u.map((([t,e])=>Y(s,t,e)));t.u=null}}{l=Y(s,"componentWillLoad")}}n();return Z(l,(()=>J(t,s,e)))};const J=async(t,e,n)=>{const s=t.p;const l=p("update",t.h.$);const o=s["s-rc"];if(n){b(t)}const c=p("render",t.h.$);{K(t,e)}if(o){o.map((t=>t()));s["s-rc"]=undefined}c();l();{const e=s["s-p"];const n=()=>Q(t);if(e.length===0){n()}else{Promise.all(e).then(n);t.t|=4;e.length=0}}};const K=(t,e,n)=>{try{e=e.render();{t.t&=~16}{t.t|=2}{{{I(t,e)}}}}catch(e){pt(e,t.p)}return null};const Q=t=>{const e=t.h.$;const n=t.p;const s=p("postUpdate",e);const l=t.i;const o=t.M;if(!(t.t&64)){t.t|=64;{tt(n)}{Y(l,"componentDidLoad")}s();{t.P(n);if(!o){X()}}}else{s()}{t.L(n)}{if(t.C){t.C();t.C=undefined}if(t.t&512){Ot((()=>B(t,false)))}t.t&=~(4|512)}};const X=e=>{{tt(c.documentElement)}Ot((()=>_(o,"appload",{detail:{namespace:t}})))};const Y=(t,e,n)=>{if(t&&t[e]){try{return t[e](n)}catch(t){pt(t)}}return undefined};const Z=(t,e)=>t&&t.then?t.then(e):e();const tt=t=>t.classList.add("hydrated");const et=(t,e)=>{if(t!=null&&!k(t)){if(e&4){return t==="false"?false:t===""||!!t}if(e&2){return parseFloat(t)}if(e&1){return String(t)}return t}return t};const nt=(t,e)=>ut(t).U.get(e);const st=(t,e,n,s)=>{const l=ut(t);const o=l.p;const c=l.U.get(e);const i=l.t;const f=l.i;n=et(n,s.T[e][0]);if((!(i&8)||c===undefined)&&n!==c){l.U.set(e,n);if(f){if(s.W&&i&128){const t=s.W[e];if(t){t.map((t=>{try{f[t](n,c,e)}catch(t){pt(t,o)}}))}}if((i&(2|16))===2){B(l,false)}}}};const lt=(t,e,n)=>{if(e.T){if(t.watchers){e.W=t.watchers}const s=Object.entries(e.T);const l=t.prototype;s.map((([t,[s]])=>{if(s&31||n&2&&s&32){Object.defineProperty(l,t,{get(){return nt(this,t)},set(n){st(this,t,n,e)},configurable:true,enumerable:true})}else if(n&1&&s&64){Object.defineProperty(l,t,{value(...e){const n=ut(this);return n.A.then((()=>n.i[t](...e)))}})}}));if(n&1){const n=new Map;l.attributeChangedCallback=function(t,e,s){i.jmp((()=>{const e=n.get(t);if(this.hasOwnProperty(e)){s=this[e];delete this[e]}else if(l.hasOwnProperty(e)&&typeof this[e]==="number"&&this[e]==s){return}this[e]=s===null&&typeof this[e]==="boolean"?false:s}))};t.observedAttributes=s.filter((([t,e])=>e[0]&15)).map((([t,s])=>{const l=s[1]||t;n.set(l,t);if(s[0]&512){e.k.push([t,l])}return l}))}}return t};const ot=async(t,e,n,s,l)=>{if((e.t&32)===0){{e.t|=32;l=$t(n);if(l.then){const t=y();l=await l;t()}if(!l.isProxied){{n.W=l.watchers}lt(l,n,2);l.isProxied=true}const t=p("createInstance",n.$);{e.t|=8}try{new l(e)}catch(t){pt(t)}{e.t&=~8}{e.t|=128}t()}if(l.style){let t=l.style;const e=g(n);if(!mt.has(e)){const s=p("registerStyles",n.$);m(e,t,!!(n.t&1));s()}}}const o=e.M;const c=()=>B(e,true);if(o&&o["s-rc"]){o["s-rc"].push(c)}else{c()}};const ct=t=>{if((i.t&1)===0){const e=ut(t);const n=e.h;const s=p("connectedCallback",n.$);if(!(e.t&1)){e.t|=1;{let n=t;while(n=n.parentNode||n.host){if(n["s-p"]){z(e,e.M=n);break}}}if(n.T){Object.entries(n.T).map((([e,[n]])=>{if(n&31&&t.hasOwnProperty(e)){const n=t[e];delete t[e];t[e]=n}}))}{ot(t,e,n)}}else{u(t,e,n.F)}s()}};const it=t=>{if((i.t&1)===0){const e=ut(t);const n=e.i;{if(e.o){e.o.map((t=>t()));e.o=undefined}}{Y(n,"disconnectedCallback")}}};const ft=(t,e={})=>{const n=p();const s=[];const l=e.exclude||[];const f=o.customElements;const r=c.head;const u=r.querySelector("meta[charset]");const a=c.createElement("style");const d=[];let y;let $=true;Object.assign(i,e);i.l=new URL(e.resourcesUrl||"./",c.baseURI).href;t.map((t=>{t[1].map((e=>{const n={t:e[0],$:e[1],T:e[2],F:e[3]};{n.T=e[2]}{n.F=e[3]}{n.k=[]}{n.W={}}const o=n.$;const c=class extends HTMLElement{constructor(t){super(t);t=this;dt(t,n);if(n.t&1){{{t.attachShadow({mode:"open"})}}}}connectedCallback(){if(y){clearTimeout(y);y=null}if($){d.push(this)}else{i.jmp((()=>ct(this)))}}disconnectedCallback(){i.jmp((()=>it(this)))}componentOnReady(){return ut(this).H}};n.R=t[0];if(!l.includes(o)&&!f.get(o)){s.push(o);f.define(o,lt(c,n,1))}}))}));{a.innerHTML=s+h;a.setAttribute("data-styles","");r.insertBefore(a,u?u.nextSibling:r.firstChild)}$=false;if(d.length){d.map((t=>t.connectedCallback()))}else{{i.jmp((()=>y=setTimeout(X,30)))}}n()};const rt=new WeakMap;const ut=t=>rt.get(t);const at=(t,e)=>rt.set(e.i=t,e);const dt=(t,e)=>{const n={t:0,p:t,h:e,U:new Map};{n.A=new Promise((t=>n.L=t))}{n.H=new Promise((t=>n.P=t));t["s-p"]=[];t["s-rc"]=[]}u(t,n,e.F);return rt.set(t,n)};const ht=(t,e)=>e in t;const pt=(t,e)=>(0,console.error)(t,e);const yt=new Map;const $t=(t,e,n)=>{const s=t.$.replace(/-/g,"_");const l=t.R;const o=yt.get(l);if(o){return o[s]}return import(`./${l}.entry.js${""}`).then((t=>{{yt.set(l,t)}return t[s]}),pt)};const mt=new Map;const wt=[];const bt=[];const gt=(t,e)=>n=>{t.push(n);if(!l){l=true;if(e&&i.t&4){Ot(jt)}else{i.raf(jt)}}};const St=t=>{for(let e=0;e<t.length;e++){try{t[e](performance.now())}catch(t){pt(t)}}t.length=0};const jt=()=>{St(wt);{St(bt);if(l=wt.length>0){i.raf(jt)}}};const Ot=t=>f().then(t);const vt=gt(bt,true);export{P as H,ft as b,V as c,N as g,C as h,f as p,at as r};
|
|
2
|
-
//# sourceMappingURL=p-bd3d3361.js.map
|