@descope/web-components-ui 1.0.184 → 1.0.185
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[5874],{6667:(t,e,i)=>{i.r(e),i.d(e,{UploadFileClass:()=>g});var n=i(1e3),o=i(2061),r=i(4567),s=i(3878);const a=(0,r.iY)("upload-file"),p=["title","description","button-label","accept","readonly","button-mode","button-variant","required","size","icon"],u=(0,s.P)({componentName:a,baseSelector:":host > div"}),{host:d,wrapper:l,icon:c,title:h,description:b,requiredIndicator:y}={host:{selector:()=>":host"},wrapper:{selector:()=>":host > div"},icon:{selector:()=>"
|
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[5874],{6667:(t,e,i)=>{i.r(e),i.d(e,{UploadFileClass:()=>g});var n=i(1e3),o=i(2061),r=i(4567),s=i(3878);const a=(0,r.iY)("upload-file"),p=["title","description","button-label","accept","readonly","button-mode","button-variant","required","size","icon"],u=(0,s.P)({componentName:a,baseSelector:":host > div"}),{host:d,wrapper:l,icon:c,title:h,description:b,requiredIndicator:y}={host:{selector:()=>":host"},wrapper:{selector:()=>":host > div"},icon:{selector:()=>"::slotted(*)"},title:{selector:()=>".title"},description:{selector:()=>".description"},requiredIndicator:{selector:()=>".title::after"}},g=(0,o.qC)((0,n.yk)({componentNameOverride:(0,r.iY)("input-wrapper")}),(0,n.yk)({mappings:{fontSize:{},fontFamily:{},borderColor:{},borderWidth:{},borderStyle:{},borderRadius:{},hostHeight:{...d,property:"height"},hostWidth:{...d,property:"width"},hostPadding:{property:"padding"},gap:{...l},lineHeight:{...l,property:"line-height"},titleFontSize:{...h,property:"font-size"},titleFontWeight:{...h,property:"font-weight"},descriptionFontSize:{...b,property:"font-size"},labelTextColor:[{...h,property:"color"},{...b,property:"color"}],iconSize:{...c,property:"width"},requiredIndicator:{...y,property:"content"}}}),n.e4,n.Ae)(class extends u{static get observedAttributes(){return p.concat(u.observedAttributes||[])}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n\t\t\t<style>\n\t\t\t:host {\n\t\t\t\tdisplay: flex;\n\t\t\t}\n\t\t\t:host > div {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\ttext-align: center;\n\t\t\t\tflex-direction: column;\n\t\t\t\twidth: 100%;\n\t\t\t}\n\t\t\t.button-wrapper {\n\t\t\t\tposition: relative;\n\t\t\t\twidth: fit-content;\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tposition: absolute;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t</style>\n\t\t\t<div>\n <slot name="icon"></slot>\n\t\t\t\t<div class="title">\n\t\t\t\t\t<span class="title-text"></span>\n\t\t\t\t</div>\n\t\t\t\t<div class="description"></div>\n\t\t\t\t<div class="button-wrapper">\n\t\t\t\t\t<input type="file" tabindex="-1" />\n\t\t\t\t\t<descope-button></descope-button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t',this.wrapperEle=this.shadowRoot.querySelector(".wrapper"),this.inputElement=this.shadowRoot.querySelector("input"),this.button.onclick=()=>this.inputElement.click(),this.inputElement.onchange=async t=>{const e=t.target.files;var i;e.length&&(this.value=await(i=e[0],new Promise((t=>{const e=new FileReader;e.onload=e=>t(e.target.result),e.readAsDataURL(i)}))),this.updateDescription((t=>t.name.replace(/^.*\\/,""))(e[0])))},this.oninvalid=()=>{this.setAttribute("invalid","true")}}getValidity(){return this.isRequired&&!this.value?{valueMissing:!0}:{}}initInputs(){this.rootElement.querySelector("descope-button").onclick=()=>this.inputElement.click()}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("title"===t?this.updateTitle(i):"description"===t?this.updateDescription(i):"button-label"===t?this.updateButtonLabel(i):"button-mode"===t?this.updateButtonMode(i):"button-variant"===t?this.updateButtonVariant(i):"size"===t?this.updateButtonSize(i):"accept"===t?this.updateInputAccept(i):"readonly"===t&&this.updateReadOnly(i))}get button(){return this.shadowRoot.querySelector("descope-button")}get input(){return this.shadowRoot.querySelector("input")}get title(){return this.shadowRoot.querySelector(".title-text")}get description(){return this.shadowRoot.querySelector(".description")}get icon(){return this.shadowRoot.querySelector(".icon")}updateTitle(t){this.title.innerHTML=t}updateDescription(t){this.description.innerHTML=t}updateButtonLabel(t){this.button.innerHTML=t}updateButtonSize(t){this.button.setAttribute("size",t)}updateButtonMode(t){this.button.setAttribute("mode",t)}updateButtonVariant(t){this.button.setAttribute("variant",t)}updateInputAccept(t){this.input.setAttribute("accept",t)}updateReadOnly(t){"true"===t?this.input.setAttribute("disabled","true"):this.input.removeAttribute("disabled")}});i(2018),customElements.define(a,g)}}]);
|
package/package.json
CHANGED
|
@@ -184,7 +184,7 @@ class RawUploadFile extends BaseInputClass {
|
|
|
184
184
|
const { host, wrapper, icon, title, description, requiredIndicator } = {
|
|
185
185
|
host: { selector: () => ':host' },
|
|
186
186
|
wrapper: { selector: () => ':host > div' },
|
|
187
|
-
icon: { selector: () => '
|
|
187
|
+
icon: { selector: () => '::slotted(*)' },
|
|
188
188
|
title: { selector: () => '.title' },
|
|
189
189
|
description: { selector: () => '.description' },
|
|
190
190
|
requiredIndicator: { selector: () => '.title::after' },
|