@descope/web-components-ui 1.100.0 → 1.101.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +1913 -1637
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1863 -1586
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1995.js +22 -7
- package/dist/umd/1995.js.LICENSE.txt +6 -0
- package/dist/umd/1995.js.map +1 -1
- package/dist/umd/6063.js +18 -0
- package/dist/umd/6063.js.map +1 -0
- package/dist/umd/6818.js +3 -0
- package/dist/umd/6818.js.map +1 -0
- package/dist/umd/{189.js → 8248.js} +4 -4
- package/dist/umd/8248.js.map +1 -0
- package/dist/umd/8961.js +1 -1
- package/dist/umd/8961.js.map +1 -1
- package/dist/umd/8968.js +432 -0
- package/dist/umd/8968.js.map +1 -0
- package/dist/umd/8983.js +324 -7
- package/dist/umd/8983.js.map +1 -1
- package/dist/umd/{384.js → 9117.js} +9 -121
- package/dist/umd/9117.js.map +1 -0
- package/dist/umd/9275.js +18 -0
- package/dist/umd/9275.js.LICENSE.txt +23 -0
- package/dist/umd/9275.js.map +1 -0
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/DescopeDev.js.map +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-index-js.js.map +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-index-js.js.map +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js +338 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js.LICENSE.txt +5 -0
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js.map +1 -1
- package/dist/umd/descope-apps-list-index-js.js +1 -1
- package/dist/umd/descope-apps-list-index-js.js.map +1 -1
- package/dist/umd/descope-button.js +4 -4
- package/dist/umd/descope-button.js.LICENSE.txt +0 -6
- package/dist/umd/descope-button.js.map +1 -1
- package/dist/umd/descope-collapsible-container.js +1 -1
- package/dist/umd/descope-collapsible-container.js.map +1 -1
- package/dist/umd/descope-divider-index-js.js +1 -1
- package/dist/umd/descope-divider-index-js.js.map +1 -1
- package/dist/umd/descope-grid-descope-grid-custom-column-index-js.js +321 -4
- package/dist/umd/descope-grid-descope-grid-custom-column-index-js.js.LICENSE.txt +6 -0
- package/dist/umd/descope-grid-descope-grid-custom-column-index-js.js.map +1 -1
- package/dist/umd/descope-grid-descope-grid-item-details-column-index-js.js +322 -5
- package/dist/umd/descope-grid-descope-grid-item-details-column-index-js.js.map +1 -1
- package/dist/umd/descope-grid-descope-grid-text-column-index-js.js +321 -4
- package/dist/umd/descope-grid-descope-grid-text-column-index-js.js.LICENSE.txt +6 -0
- package/dist/umd/descope-grid-descope-grid-text-column-index-js.js.map +1 -1
- package/dist/umd/descope-link-index-js.js +1 -1
- package/dist/umd/descope-link-index-js.js.map +1 -1
- package/dist/umd/descope-recovery-codes.js +2 -0
- package/dist/umd/descope-recovery-codes.js.map +1 -0
- package/dist/umd/descope-security-questions-verify-index-js.js +1 -1
- package/dist/umd/descope-security-questions-verify-index-js.js.map +1 -1
- package/dist/umd/descope-text.js +1 -1
- package/dist/umd/descope-text.js.map +1 -1
- package/dist/umd/descope-timer-button.js +338 -1
- package/dist/umd/descope-timer-button.js.LICENSE.txt +5 -0
- package/dist/umd/descope-timer-button.js.map +1 -1
- package/dist/umd/descope-upload-file-index-js.js +338 -1
- package/dist/umd/descope-upload-file-index-js.js.LICENSE.txt +5 -0
- package/dist/umd/descope-upload-file-index-js.js.map +1 -1
- package/dist/umd/descope-user-attribute-index-js.js +338 -1
- package/dist/umd/descope-user-attribute-index-js.js.map +1 -1
- package/dist/umd/descope-user-auth-method-index-js.js +338 -1
- package/dist/umd/descope-user-auth-method-index-js.js.map +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/index.js.map +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js.map +1 -1
- package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js.map +1 -1
- package/package.json +15 -14
- package/src/theme/components/index.js +2 -0
- package/dist/umd/189.js.map +0 -1
- package/dist/umd/2894.js +0 -339
- package/dist/umd/2894.js.map +0 -1
- package/dist/umd/3792.js +0 -339
- package/dist/umd/3792.js.map +0 -1
- package/dist/umd/384.js.map +0 -1
- package/dist/umd/513.js +0 -339
- package/dist/umd/513.js.map +0 -1
- package/dist/umd/6227.js +0 -320
- package/dist/umd/6227.js.map +0 -1
- package/dist/umd/6649.js +0 -339
- package/dist/umd/6649.js.LICENSE.txt +0 -11
- package/dist/umd/6649.js.map +0 -1
- package/dist/umd/9030.js +0 -339
- package/dist/umd/9030.js.LICENSE.txt +0 -11
- package/dist/umd/9030.js.map +0 -1
- package/dist/umd/9380.js +0 -130
- package/dist/umd/9380.js.map +0 -1
- /package/dist/umd/{189.js.LICENSE.txt → 6063.js.LICENSE.txt} +0 -0
- /package/dist/umd/{6227.js.LICENSE.txt → 6818.js.LICENSE.txt} +0 -0
- /package/dist/umd/{9380.js.LICENSE.txt → 8248.js.LICENSE.txt} +0 -0
- /package/dist/umd/{2894.js.LICENSE.txt → 8968.js.LICENSE.txt} +0 -0
- /package/dist/umd/{3792.js.LICENSE.txt → 9117.js.LICENSE.txt} +0 -0
- /package/dist/umd/{384.js.LICENSE.txt → descope-user-attribute-index-js.js.LICENSE.txt} +0 -0
- /package/dist/umd/{513.js.LICENSE.txt → descope-user-auth-method-index-js.js.LICENSE.txt} +0 -0
@@ -1,2 +1,339 @@
|
|
1
|
-
|
1
|
+
/*! For license information please see descope-upload-file-index-js.js.LICENSE.txt */
|
2
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5087,9636],{3393:(t,e,o)=>{o.d(e,{y:()=>a});var r=o(9696),i=o(79365),n=o(81365);const a=(...t)=>(0,r.Zz)(i.XX,i._$,i.yF,i.jd)((0,n.q)(...t))},10767:(t,e,o)=>{o.d(e,{G:()=>r});const r=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},19624:(t,e,o)=>{o.d(e,{J:()=>h,T:()=>l});var r=o(63200),i=o(25964),n=o(88961),a=o(98538),s=o(10767);const l=(0,i.xE)("button"),{host:d,label:c,slottedIcon:u}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let p;const h=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...u,property:"width"},{...u,property:"height"}]}}),s.G,n.VO,n.tQ)((0,n.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${p}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${h.cssVarList.outlineWidth}) + var(${h.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${h.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${h.cssVarList.hostHeight}) - var(${h.cssVarList.outlineWidth}) - var(${h.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${h.cssVarList.hostWidth}) - var(${h.cssVarList.outlineWidth}) - var(${h.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l})),{color:b,fontSize:m}=h.cssVarList;p=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${b});\n\t\ttop: calc(50% - (var(${m}) / 2));\n\t\tleft: calc(50% - (var(${m}) / 2));\n\t\tborder-width: calc(var(${m}) / 10);\n\t\twidth: var(${m});\n\t\theight: var(${m});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},30576:(t,e,o)=>{o.r(e),o.d(e,{ButtonClass:()=>r.J,componentName:()=>r.T});var r=o(19624);o(83799),customElements.define(r.T,r.J)},70139:(t,e,o)=>{o.r(e),o.d(e,{UploadFileClass:()=>y,componentName:()=>d});var r=o(79365),i=o(9696),n=o(97810),a=o(3393),s=o(19624),l=o(25964);const d=(0,n.xE)("upload-file"),c=["title","description","button-label","accept","readonly","button-mode","button-variant","required","size","icon"],u=(0,a.y)({componentName:d,baseSelector:":host > div"}),p=s.J.cssVarList,{host:h,wrapper:b,icon:m,title:v,description:g,requiredIndicator:f}={host:{selector:()=>":host"},wrapper:{selector:()=>":host > div"},icon:{selector:()=>"::slotted(*)"},title:{selector:()=>".title"},description:{selector:()=>".description"},requiredIndicator:{selector:()=>".title::after"}},y=(0,i.Zz)((0,r.RF)({componentNameOverride:(0,n.xE)("input-wrapper")}),(0,r.RF)({mappings:{fontSize:{},fontFamily:{},borderColor:{},borderWidth:{},borderStyle:{},borderRadius:{},hostHeight:{...h,property:"height"},hostWidth:{...h,property:"width"},hostPadding:{property:"padding"},hostDirection:[{...h,property:"direction"},{selector:()=>s.J.componentName,property:p.hostDirection}],gap:{...b},lineHeight:{...b,property:"line-height"},titleFontSize:{...v,property:"font-size"},titleFontWeight:{...v,property:"font-weight"},descriptionFontSize:{...g,property:"font-size"},labelTextColor:[{...v,property:"color"},{...g,property:"color"}],iconSize:{...m,property:"width"},requiredIndicator:{...f,property:"content"}}}),r.VO,r.tQ)(class extends u{static get observedAttributes(){return c.concat(u.observedAttributes||[])}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\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" aria-labelledby="button"/>\n\t\t\t\t\t<descope-button id="button"></descope-button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t',(0,l.fz)("\n :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 ",this),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 o;e.length&&(this.value=await(o=e[0],new Promise((t=>{const e=new FileReader;e.onload=e=>t(e.target.result),e.readAsDataURL(o)}))),this.updateDescription((t=>t.name.replace(/^.*\\/,""))(e[0])))},this.oninvalid=()=>{this.setAttribute("invalid","true")}}getValidity(){return this.isRequired&&!this.input.value?{valueMissing:!0}:(this.removeAttribute("invalid"),{})}initInputs(){this.rootElement.querySelector("descope-button").onclick=()=>this.inputElement.click()}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&("title"===t?this.updateTitle(o):"description"===t?this.updateDescription(o):"button-label"===t?this.updateButtonLabel(o):"button-mode"===t?this.updateButtonMode(o):"button-variant"===t?this.updateButtonVariant(o):"size"===t?this.updateButtonSize(o):"accept"===t?this.updateInputAccept(o):"readonly"===t&&this.updateReadOnly(o))}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.textContent=t}updateDescription(t){this.description.textContent=t}updateButtonLabel(t){this.button.textContent=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")}});o(30576),customElements.define(d,y)},83799:(t,e,o)=>{o(93555),o(89389)},89389:(t,e,o)=>{o.d(e,{$:()=>b});var r=o(13256),i=o(55774),n=o(82901),a=o(90676),s=o(81488),l=o(87550);const d=o(51450).AH`
|
3
|
+
:host {
|
4
|
+
display: inline-block;
|
5
|
+
position: relative;
|
6
|
+
outline: none;
|
7
|
+
white-space: nowrap;
|
8
|
+
-webkit-user-select: none;
|
9
|
+
-moz-user-select: none;
|
10
|
+
user-select: none;
|
11
|
+
}
|
12
|
+
|
13
|
+
:host([hidden]) {
|
14
|
+
display: none !important;
|
15
|
+
}
|
16
|
+
|
17
|
+
/* Aligns the button with form fields when placed on the same line.
|
18
|
+
Note, to make it work, the form fields should have the same "::before" pseudo-element. */
|
19
|
+
.vaadin-button-container::before {
|
20
|
+
content: '\\2003';
|
21
|
+
display: inline-block;
|
22
|
+
width: 0;
|
23
|
+
max-height: 100%;
|
24
|
+
}
|
25
|
+
|
26
|
+
.vaadin-button-container {
|
27
|
+
display: inline-flex;
|
28
|
+
align-items: center;
|
29
|
+
justify-content: center;
|
30
|
+
text-align: center;
|
31
|
+
width: 100%;
|
32
|
+
height: 100%;
|
33
|
+
min-height: inherit;
|
34
|
+
text-shadow: inherit;
|
35
|
+
}
|
36
|
+
|
37
|
+
[part='prefix'],
|
38
|
+
[part='suffix'] {
|
39
|
+
flex: none;
|
40
|
+
}
|
41
|
+
|
42
|
+
[part='label'] {
|
43
|
+
white-space: nowrap;
|
44
|
+
overflow: hidden;
|
45
|
+
text-overflow: ellipsis;
|
46
|
+
}
|
47
|
+
|
48
|
+
@media (forced-colors: active) {
|
49
|
+
:host {
|
50
|
+
outline: 1px solid;
|
51
|
+
outline-offset: -1px;
|
52
|
+
}
|
53
|
+
|
54
|
+
:host([focused]) {
|
55
|
+
outline-width: 2px;
|
56
|
+
}
|
57
|
+
|
58
|
+
:host([disabled]) {
|
59
|
+
outline-color: GrayText;
|
60
|
+
}
|
61
|
+
}
|
62
|
+
`;var c=o(84467),u=o(53149),p=o(36176);const h=t=>class extends((0,c.e)((0,p.l)((0,u.y)(t)))){static get properties(){return{tabindex:{type:Number,value:0,reflectToAttribute:!0}}}get _activeKeys(){return["Enter"," "]}ready(){super.ready(),this.hasAttribute("role")||this.setAttribute("role","button")}_onKeyDown(t){super._onKeyDown(t),t.altKey||t.shiftKey||t.ctrlKey||t.metaKey||this._activeKeys.includes(t.key)&&(t.preventDefault(),this.click())}};(0,l.SF)("vaadin-button",d,{moduleId:"vaadin-button-styles"});class b extends(h((0,a.q)((0,l.cp)((0,i.w)(r.Pu))))){static get is(){return"vaadin-button"}static get template(){return r.qy`
|
63
|
+
<div class="vaadin-button-container">
|
64
|
+
<span part="prefix" aria-hidden="true">
|
65
|
+
<slot name="prefix"></slot>
|
66
|
+
</span>
|
67
|
+
<span part="label">
|
68
|
+
<slot></slot>
|
69
|
+
</span>
|
70
|
+
<span part="suffix" aria-hidden="true">
|
71
|
+
<slot name="suffix"></slot>
|
72
|
+
</span>
|
73
|
+
</div>
|
74
|
+
<slot name="tooltip"></slot>
|
75
|
+
`}ready(){super.ready(),this._tooltipController=new s.I(this),this.addController(this._tooltipController)}}(0,n.X)(b)},93555:(t,e,o)=>{o.d(e,{x:()=>i}),o(64511),o(42068),o(9433),o(3241),o(83315);var r=o(87550);const i=r.AH`
|
76
|
+
:host {
|
77
|
+
/* Sizing */
|
78
|
+
--lumo-button-size: var(--lumo-size-m);
|
79
|
+
min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));
|
80
|
+
height: var(--_button-size);
|
81
|
+
padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));
|
82
|
+
margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);
|
83
|
+
box-sizing: border-box;
|
84
|
+
/* Style */
|
85
|
+
font-family: var(--lumo-font-family);
|
86
|
+
font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));
|
87
|
+
font-weight: var(--vaadin-button-font-weight, 500);
|
88
|
+
color: var(--_lumo-button-text-color);
|
89
|
+
background: var(--_lumo-button-background);
|
90
|
+
border: var(--vaadin-button-border, none);
|
91
|
+
border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));
|
92
|
+
cursor: var(--lumo-clickable-cursor);
|
93
|
+
-webkit-tap-highlight-color: transparent;
|
94
|
+
-webkit-font-smoothing: antialiased;
|
95
|
+
-moz-osx-font-smoothing: grayscale;
|
96
|
+
flex-shrink: 0;
|
97
|
+
--_button-size: var(--vaadin-button-height, var(--lumo-button-size));
|
98
|
+
--_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
|
99
|
+
--_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
|
100
|
+
/* Used by notification */
|
101
|
+
--_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));
|
102
|
+
--_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));
|
103
|
+
--_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));
|
104
|
+
--_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));
|
105
|
+
}
|
106
|
+
|
107
|
+
/* Set only for the internal parts so we don't affect the host vertical alignment */
|
108
|
+
[part='label'],
|
109
|
+
[part='prefix'],
|
110
|
+
[part='suffix'] {
|
111
|
+
line-height: var(--lumo-line-height-xs);
|
112
|
+
}
|
113
|
+
|
114
|
+
[part='label'] {
|
115
|
+
padding: calc(var(--lumo-button-size) / 6) 0;
|
116
|
+
}
|
117
|
+
|
118
|
+
:host([theme~='small']) {
|
119
|
+
font-size: var(--lumo-font-size-s);
|
120
|
+
--lumo-button-size: var(--lumo-size-s);
|
121
|
+
}
|
122
|
+
|
123
|
+
:host([theme~='large']) {
|
124
|
+
font-size: var(--lumo-font-size-l);
|
125
|
+
--lumo-button-size: var(--lumo-size-l);
|
126
|
+
}
|
127
|
+
|
128
|
+
/* For interaction states */
|
129
|
+
:host::before,
|
130
|
+
:host::after {
|
131
|
+
content: '';
|
132
|
+
/* We rely on the host always being relative */
|
133
|
+
position: absolute;
|
134
|
+
z-index: 1;
|
135
|
+
inset: 0;
|
136
|
+
background-color: currentColor;
|
137
|
+
border-radius: inherit;
|
138
|
+
opacity: 0;
|
139
|
+
pointer-events: none;
|
140
|
+
}
|
141
|
+
|
142
|
+
/* Hover */
|
143
|
+
|
144
|
+
@media (any-hover: hover) {
|
145
|
+
:host(:hover)::before {
|
146
|
+
opacity: 0.02;
|
147
|
+
}
|
148
|
+
}
|
149
|
+
|
150
|
+
/* Active */
|
151
|
+
|
152
|
+
:host::after {
|
153
|
+
transition: opacity 1.4s, transform 0.1s;
|
154
|
+
filter: blur(8px);
|
155
|
+
}
|
156
|
+
|
157
|
+
:host([active])::before {
|
158
|
+
opacity: 0.05;
|
159
|
+
transition-duration: 0s;
|
160
|
+
}
|
161
|
+
|
162
|
+
:host([active])::after {
|
163
|
+
opacity: 0.1;
|
164
|
+
transition-duration: 0s, 0s;
|
165
|
+
transform: scale(0);
|
166
|
+
}
|
167
|
+
|
168
|
+
/* Keyboard focus */
|
169
|
+
|
170
|
+
:host([focus-ring]) {
|
171
|
+
box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
|
172
|
+
}
|
173
|
+
|
174
|
+
:host([theme~='primary'][focus-ring]) {
|
175
|
+
box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);
|
176
|
+
}
|
177
|
+
|
178
|
+
/* Types (primary, tertiary, tertiary-inline */
|
179
|
+
|
180
|
+
:host([theme~='tertiary']),
|
181
|
+
:host([theme~='tertiary-inline']) {
|
182
|
+
--_background: transparent !important;
|
183
|
+
background: var(--vaadin-button-tertiary-background, var(--_background));
|
184
|
+
min-width: 0;
|
185
|
+
}
|
186
|
+
|
187
|
+
:host([theme~='tertiary']) {
|
188
|
+
border: var(--vaadin-button-tertiary-border, none);
|
189
|
+
color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));
|
190
|
+
font-weight: var(--vaadin-button-tertiary-font-weight, 500);
|
191
|
+
padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));
|
192
|
+
}
|
193
|
+
|
194
|
+
:host([theme~='tertiary-inline'])::before {
|
195
|
+
display: none;
|
196
|
+
}
|
197
|
+
|
198
|
+
:host([theme~='tertiary-inline']) {
|
199
|
+
margin: 0;
|
200
|
+
height: auto;
|
201
|
+
padding: 0;
|
202
|
+
line-height: inherit;
|
203
|
+
font-size: inherit;
|
204
|
+
}
|
205
|
+
|
206
|
+
:host([theme~='tertiary-inline']) [part='label'] {
|
207
|
+
padding: 0;
|
208
|
+
overflow: visible;
|
209
|
+
line-height: inherit;
|
210
|
+
}
|
211
|
+
|
212
|
+
:host([theme~='primary']) {
|
213
|
+
background: var(--_lumo-button-primary-background);
|
214
|
+
border: var(--vaadin-button-primary-border, none);
|
215
|
+
color: var(--_lumo-button-primary-text-color);
|
216
|
+
font-weight: var(--vaadin-button-primary-font-weight, 600);
|
217
|
+
min-width: calc(var(--lumo-button-size) * 2.5);
|
218
|
+
}
|
219
|
+
|
220
|
+
:host([theme~='primary'])::before {
|
221
|
+
background-color: black;
|
222
|
+
}
|
223
|
+
|
224
|
+
@media (any-hover: hover) {
|
225
|
+
:host([theme~='primary']:hover)::before {
|
226
|
+
opacity: 0.05;
|
227
|
+
}
|
228
|
+
}
|
229
|
+
|
230
|
+
:host([theme~='primary'][active])::before {
|
231
|
+
opacity: 0.1;
|
232
|
+
}
|
233
|
+
|
234
|
+
:host([theme~='primary'][active])::after {
|
235
|
+
opacity: 0.2;
|
236
|
+
}
|
237
|
+
|
238
|
+
/* Colors (success, error, contrast) */
|
239
|
+
|
240
|
+
:host([theme~='success']) {
|
241
|
+
color: var(--lumo-success-text-color);
|
242
|
+
}
|
243
|
+
|
244
|
+
:host([theme~='success'][theme~='primary']) {
|
245
|
+
background-color: var(--lumo-success-color);
|
246
|
+
color: var(--lumo-success-contrast-color);
|
247
|
+
}
|
248
|
+
|
249
|
+
:host([theme~='error']) {
|
250
|
+
color: var(--lumo-error-text-color);
|
251
|
+
}
|
252
|
+
|
253
|
+
:host([theme~='error'][theme~='primary']) {
|
254
|
+
background-color: var(--lumo-error-color);
|
255
|
+
color: var(--lumo-error-contrast-color);
|
256
|
+
}
|
257
|
+
|
258
|
+
:host([theme~='contrast']) {
|
259
|
+
color: var(--lumo-contrast);
|
260
|
+
}
|
261
|
+
|
262
|
+
:host([theme~='contrast'][theme~='primary']) {
|
263
|
+
background-color: var(--lumo-contrast);
|
264
|
+
color: var(--lumo-base-color);
|
265
|
+
}
|
266
|
+
|
267
|
+
/* Disabled state. Keep selectors after other color variants. */
|
268
|
+
|
269
|
+
:host([disabled]) {
|
270
|
+
pointer-events: none;
|
271
|
+
color: var(--lumo-disabled-text-color);
|
272
|
+
}
|
273
|
+
|
274
|
+
:host([theme~='primary'][disabled]) {
|
275
|
+
background-color: var(--lumo-contrast-30pct);
|
276
|
+
color: var(--lumo-base-color);
|
277
|
+
}
|
278
|
+
|
279
|
+
:host([theme~='primary'][disabled]) [part] {
|
280
|
+
opacity: 0.7;
|
281
|
+
}
|
282
|
+
|
283
|
+
/* Icons */
|
284
|
+
|
285
|
+
[part] ::slotted(vaadin-icon) {
|
286
|
+
display: inline-block;
|
287
|
+
width: var(--lumo-icon-size-m);
|
288
|
+
height: var(--lumo-icon-size-m);
|
289
|
+
}
|
290
|
+
|
291
|
+
/* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */
|
292
|
+
[part] ::slotted(vaadin-icon[icon^='vaadin:']) {
|
293
|
+
padding: 0.25em;
|
294
|
+
box-sizing: border-box !important;
|
295
|
+
}
|
296
|
+
|
297
|
+
[part='prefix'] {
|
298
|
+
margin-left: -0.25em;
|
299
|
+
margin-right: 0.25em;
|
300
|
+
}
|
301
|
+
|
302
|
+
[part='suffix'] {
|
303
|
+
margin-left: 0.25em;
|
304
|
+
margin-right: -0.25em;
|
305
|
+
}
|
306
|
+
|
307
|
+
/* Icon-only */
|
308
|
+
|
309
|
+
:host([theme~='icon']:not([theme~='tertiary-inline'])) {
|
310
|
+
min-width: var(--lumo-button-size);
|
311
|
+
padding-left: calc(var(--lumo-button-size) / 4);
|
312
|
+
padding-right: calc(var(--lumo-button-size) / 4);
|
313
|
+
}
|
314
|
+
|
315
|
+
:host([theme~='icon']) [part='prefix'],
|
316
|
+
:host([theme~='icon']) [part='suffix'] {
|
317
|
+
margin-left: 0;
|
318
|
+
margin-right: 0;
|
319
|
+
}
|
320
|
+
|
321
|
+
/* RTL specific styles */
|
322
|
+
|
323
|
+
:host([dir='rtl']) [part='prefix'] {
|
324
|
+
margin-left: 0.25em;
|
325
|
+
margin-right: -0.25em;
|
326
|
+
}
|
327
|
+
|
328
|
+
:host([dir='rtl']) [part='suffix'] {
|
329
|
+
margin-left: -0.25em;
|
330
|
+
margin-right: 0.25em;
|
331
|
+
}
|
332
|
+
|
333
|
+
:host([dir='rtl'][theme~='icon']) [part='prefix'],
|
334
|
+
:host([dir='rtl'][theme~='icon']) [part='suffix'] {
|
335
|
+
margin-left: 0;
|
336
|
+
margin-right: 0;
|
337
|
+
}
|
338
|
+
`;(0,r.SF)("vaadin-button",i,{moduleId:"lumo-button"})},98538:(t,e,o)=>{o.d(e,{S:()=>s,T:()=>a});var r=o(88961),i=o(25964),n=o(63200);const a=(0,i.xE)("icon"),s=(0,n.Zz)((0,r.RF)({mappings:{fill:{}}}),r.VO,r.tQ)((0,r.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n }\n ",excludeAttrsSync:["tabindex","class"],componentName:a}))}}]);
|
2
339
|
//# sourceMappingURL=descope-upload-file-index-js.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"descope-upload-file-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/./src/baseClasses/createBaseInputClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/./src/components/descope-upload-file/UploadFileClass.js","webpack://@descope/web-components-ui/./src/components/descope-upload-file/helpers.js","webpack://@descope/web-components-ui/./src/components/descope-upload-file/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["import { compose } from '../helpers';\nimport {\n changeMixin,\n inputEventsDispatchingMixin,\n inputValidationMixin,\n normalizeBooleanAttributesMixin,\n} from '../mixins';\nimport { createBaseClass } from './createBaseClass';\n\nexport const createBaseInputClass = (...args) =>\n compose(\n inputValidationMixin,\n changeMixin,\n normalizeBooleanAttributesMixin,\n inputEventsDispatchingMixin\n )(createBaseClass(...args));\n","export const clickableMixin = (superclass) =>\n class ClickableMixinClass extends superclass {\n get isLoading() {\n return this.getAttribute('loading') === 'true';\n }\n\n click() {\n this.isLoading || super.click();\n }\n };\n","import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { IconClass } from '@descope-ui/descope-icon/class';\nimport { clickableMixin } from './clickableMixin';\n\nexport const componentName = getComponentName('button');\n\nconst resetStyles = `\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n`;\n\nconst iconStyles = `\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n`;\n\nconst editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;\n\nconst { host, label, slottedIcon } = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n slottedIcon: { selector: () => '::slotted(descope-icon)' },\n};\n\nlet loadingIndicatorStyles;\n\nexport const ButtonClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\n\n cursor: {},\n backgroundColor: {},\n\n outlineOffset: {},\n outlineColor: {},\n outlineStyle: {},\n outlineWidth: {},\n\n borderRadius: {},\n borderColor: {},\n borderStyle: {},\n borderWidth: {},\n\n verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\n horizontalPadding: [\n { property: 'padding-right', fallback: '0.875em' },\n { property: 'padding-left', fallback: '0.875em' },\n ],\n\n labelTextColor: { property: 'color' },\n iconColor: {\n selector: () => `::slotted(*)`,\n property: IconClass.cssVarList.fill,\n },\n labelTextDecoration: { ...label, property: 'text-decoration' },\n labelSpacing: { ...label, property: 'gap' },\n textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n iconSize: [\n { ...slottedIcon, property: 'width' },\n { ...slottedIcon, property: 'height' },\n ],\n },\n }),\n clickableMixin,\n draggableMixin,\n componentNameValidationMixin\n)(\n createProxy({\n slots: ['', 'prefix', 'label', 'suffix'],\n wrappedEleName: 'vaadin-button',\n style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width=\"true\"]) {\n width: var(${ButtonClass.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,\n excludeAttrsSync: ['tabindex'],\n componentName,\n })\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport { createBaseInputClass } from '../../baseClasses/createBaseInputClass';\nimport { ButtonClass } from '@descope-ui/descope-button/class';\nimport { getFileBase64, getFilename } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('upload-file');\n\nconst observedAttributes = [\n 'title',\n 'description',\n 'button-label',\n 'accept',\n 'readonly',\n 'button-mode',\n 'button-variant',\n 'required',\n 'size',\n 'icon',\n];\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: ':host > div' });\n\nclass RawUploadFile extends BaseInputClass {\n static get observedAttributes() {\n return observedAttributes.concat(BaseInputClass.observedAttributes || []);\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\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\" aria-labelledby=\"button\"/>\n\t\t\t\t\t<descope-button id=\"button\"></descope-button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`;\n\n injectStyle(\n `\n :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 `,\n this\n );\n\n this.wrapperEle = this.shadowRoot.querySelector('.wrapper');\n this.inputElement = this.shadowRoot.querySelector('input');\n\n this.button.onclick = () => this.inputElement.click();\n\n this.inputElement.onchange = async (e) => {\n const receivedFileList = e.target.files;\n\n if (!receivedFileList.length) {\n return;\n }\n\n this.value = await getFileBase64(receivedFileList[0]);\n\n this.updateDescription(getFilename(receivedFileList[0]));\n };\n\n this.oninvalid = () => {\n this.setAttribute('invalid', 'true');\n };\n }\n\n // this is a temp solution,\n // we should show the input error message like we have in all other inputs\n /*\n reportValidity() {\n this.defaultReportValidity();\n }\n */\n\n getValidity() {\n if (this.isRequired && !this.input.value) {\n return { valueMissing: true };\n }\n this.removeAttribute('invalid');\n return {};\n }\n\n initInputs() {\n const button = this.rootElement.querySelector('descope-button');\n button.onclick = () => this.inputElement.click();\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (oldValue !== newValue) {\n if (attrName === 'title') {\n this.updateTitle(newValue);\n } else if (attrName === 'description') {\n this.updateDescription(newValue);\n } else if (attrName === 'button-label') {\n this.updateButtonLabel(newValue);\n } else if (attrName === 'button-mode') {\n this.updateButtonMode(newValue);\n } else if (attrName === 'button-variant') {\n this.updateButtonVariant(newValue);\n } else if (attrName === 'size') {\n this.updateButtonSize(newValue);\n } else if (attrName === 'accept') {\n this.updateInputAccept(newValue);\n } else if (attrName === 'readonly') {\n this.updateReadOnly(newValue);\n }\n }\n }\n\n get button() {\n return this.shadowRoot.querySelector('descope-button');\n }\n\n get input() {\n return this.shadowRoot.querySelector('input');\n }\n\n get title() {\n return this.shadowRoot.querySelector('.title-text');\n }\n\n get description() {\n return this.shadowRoot.querySelector('.description');\n }\n\n get icon() {\n return this.shadowRoot.querySelector('.icon');\n }\n\n updateTitle(val) {\n this.title.textContent = val;\n }\n\n updateDescription(val) {\n this.description.textContent = val;\n }\n\n updateButtonLabel(val) {\n this.button.textContent = val;\n }\n\n updateButtonSize(val) {\n this.button.setAttribute('size', val);\n }\n\n updateButtonMode(val) {\n this.button.setAttribute('mode', val);\n }\n\n updateButtonVariant(val) {\n this.button.setAttribute('variant', val);\n }\n\n updateInputAccept(val) {\n this.input.setAttribute('accept', val);\n }\n\n updateReadOnly(val) {\n if (val === 'true') {\n this.input.setAttribute('disabled', 'true');\n } else {\n this.input.removeAttribute('disabled');\n }\n }\n}\n\nconst buttonVars = ButtonClass.cssVarList;\nconst { host, wrapper, icon, title, description, requiredIndicator } = {\n host: { selector: () => ':host' },\n wrapper: { selector: () => ':host > div' },\n icon: { selector: () => '::slotted(*)' },\n title: { selector: () => '.title' },\n description: { selector: () => '.description' },\n requiredIndicator: { selector: () => '.title::after' },\n};\n\nexport const UploadFileClass = compose(\n createStyleMixin({ componentNameOverride: getComponentName('input-wrapper') }),\n createStyleMixin({\n mappings: {\n fontSize: {},\n fontFamily: {},\n borderColor: {},\n borderWidth: {},\n borderStyle: {},\n borderRadius: {},\n hostHeight: { ...host, property: 'height' },\n hostWidth: { ...host, property: 'width' },\n hostPadding: { property: 'padding' },\n hostDirection: [\n { ...host, property: 'direction' },\n { selector: () => ButtonClass.componentName, property: buttonVars.hostDirection },\n ],\n gap: { ...wrapper },\n lineHeight: { ...wrapper, property: 'line-height' },\n titleFontSize: { ...title, property: 'font-size' },\n titleFontWeight: { ...title, property: 'font-weight' },\n descriptionFontSize: { ...description, property: 'font-size' },\n labelTextColor: [\n { ...title, property: 'color' },\n { ...description, property: 'color' },\n ],\n iconSize: { ...icon, property: 'width' },\n requiredIndicator: { ...requiredIndicator, property: 'content' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin\n)(RawUploadFile);\n","export const getFileBase64 = (fileObj) => {\n return new Promise((resolve) => {\n const reader = new FileReader();\n reader.onload = (e) => resolve(e.target.result);\n reader.readAsDataURL(fileObj);\n });\n};\n\nexport const getFilename = (fileObj) => {\n return fileObj.name.replace(/^.*\\\\/, '');\n};\n","import { componentName, UploadFileClass } from './UploadFileClass';\nimport '@descope-ui/descope-button';\n\ncustomElements.define(componentName, UploadFileClass);\n\nexport { UploadFileClass, componentName };\n","import {\n componentNameValidationMixin,\n createProxy,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n createStyleMixin({\n mappings: {\n fill: {},\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class'],\n componentName,\n }),\n);\n"],"names":["createBaseInputClass","args","clickableMixin","superclass","isLoading","this","getAttribute","click","super","componentName","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","mappings","hostWidth","property","hostHeight","hostDirection","fontSize","fontFamily","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","style","excludeAttrsSync","color","customElements","define","observedAttributes","BaseInputClass","baseSelector","buttonVars","wrapper","icon","title","description","requiredIndicator","UploadFileClass","componentNameOverride","hostPadding","gap","lineHeight","titleFontSize","titleFontWeight","descriptionFontSize","concat","constructor","attachShadow","mode","innerHTML","wrapperEle","shadowRoot","querySelector","inputElement","button","onclick","onchange","async","e","receivedFileList","target","files","fileObj","length","value","Promise","resolve","reader","FileReader","onload","result","readAsDataURL","updateDescription","name","replace","getFilename","oninvalid","setAttribute","getValidity","isRequired","input","valueMissing","removeAttribute","initInputs","rootElement","attributeChangedCallback","attrName","oldValue","newValue","updateTitle","updateButtonLabel","updateButtonMode","updateButtonVariant","updateButtonSize","updateInputAccept","updateReadOnly","val","textContent","IconClass"],"sourceRoot":""}
|
1
|
+
{"version":3,"file":"descope-upload-file-index-js.js","mappings":";kMASO,MAAMA,EAAuB,IAAIC,KACtC,QACE,KACA,KACA,KACA,KAJF,EAKE,UAAmBA,sCCfhB,MAAMC,EAAkBC,GAC7B,cAAkCA,EAChC,aAAIC,GACF,MAAwC,SAAjCC,KAAKC,aAAa,UAC3B,CAEA,KAAAC,GACEF,KAAKD,WAAaI,MAAMD,OAC1B,wGCGG,MAAME,GAAgB,QAAiB,WAsCxC,KAAEC,EAAI,MAAEC,EAAK,YAAEC,GAAgB,CACnCF,KAAM,CAAEG,SAAU,IAAM,SACxBF,MAAO,CAAEE,SAAU,iBACnBD,YAAa,CAAEC,SAAU,IAAM,4BAGjC,IAAIC,EAEG,MAAMC,GAAc,SACzB,QAAiB,CACfC,SAAU,CACRC,UAAW,CAAEC,SAAU,SACvBC,WAAY,CAAED,SAAU,UACxBE,cAAe,IAAKV,EAAMQ,SAAU,aACpCG,SAAU,CAAC,EACXC,WAAY,CAAC,EAEbC,OAAQ,CAAC,EACTC,gBAAiB,CAAC,EAElBC,cAAe,CAAC,EAChBC,aAAc,CAAC,EACfC,aAAc,CAAC,EACfC,aAAc,CAAC,EAEfC,aAAc,CAAC,EACfC,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,YAAa,CAAC,EAEdC,gBAAiB,CAAC,CAAEf,SAAU,eAAiB,CAAEA,SAAU,mBAC3DgB,kBAAmB,CACjB,CAAEhB,SAAU,gBAAiBiB,SAAU,WACvC,CAAEjB,SAAU,eAAgBiB,SAAU,YAGxCC,eAAgB,CAAElB,SAAU,SAC5BmB,UAAW,CACTxB,SAAU,IAAM,eAChBK,SAAU,IAAUoB,WAAWC,MAEjCC,oBAAqB,IAAK7B,EAAOO,SAAU,mBAC3CuB,aAAc,IAAK9B,EAAOO,SAAU,OACpCwB,UAAW,IAAK/B,EAAOO,SAAU,kBAAmBiB,SAAU,UAE9DQ,SAAU,CACR,IAAK/B,EAAaM,SAAU,SAC5B,IAAKN,EAAaM,SAAU,cAIlC,IACA,KACA,KA7CyB,EA+CzB,QAAY,CACV0B,MAAO,CAAC,GAAI,SAAU,QAAS,UAC/BC,eAAgB,gBAChBC,MAAO,IAAM,qjBAGZhC,2GAGmBC,EAAYuB,WAAWV,uBAAuBb,EAAYuB,WAAWb,qFAGxEV,EAAYuB,WAAWrB,yEAGrBF,EAAYuB,WAAWnB,qBAAqBJ,EAAYuB,WAAWV,uBAAuBb,EAAYuB,WAAWb,wGAGlHV,EAAYuB,WAAWrB,oBAAoBF,EAAYuB,WAAWV,uBAAuBb,EAAYuB,WAAWb,uDAIlIsB,iBAAkB,CAAC,YACnBtC,oBAIE,MAAEuC,EAAK,SAAE3B,GAAaN,EAAYuB,WACxCxB,EAAyB,mbAeVkC,iCACU3B,wCACCA,yCACCA,6BACZA,wBACCA,8TCrJhB4B,eAAeC,OAAO,IAAe,oJCK9B,MAAMzC,GAAgB,QAAiB,eAExC0C,EAAqB,CACzB,QACA,cACA,eACA,SACA,WACA,cACA,iBACA,WACA,OACA,QAGIC,GAAiB,EAAApD,EAAA,GAAqB,CAAES,gBAAe4C,aAAc,gBA+KrEC,EAAavC,EAAA,EAAYuB,YACzB,KAAE5B,EAAI,QAAE6C,EAAO,KAAEC,EAAI,MAAEC,EAAK,YAAEC,EAAW,kBAAEC,GAAsB,CACrEjD,KAAM,CAAEG,SAAU,IAAM,SACxB0C,QAAS,CAAE1C,SAAU,IAAM,eAC3B2C,KAAM,CAAE3C,SAAU,IAAM,gBACxB4C,MAAO,CAAE5C,SAAU,IAAM,UACzB6C,YAAa,CAAE7C,SAAU,IAAM,gBAC/B8C,kBAAmB,CAAE9C,SAAU,IAAM,kBAG1B+C,GAAkB,SAC7B,QAAiB,CAAEC,uBAAuB,QAAiB,oBAC3D,QAAiB,CACf7C,SAAU,CACRK,SAAU,CAAC,EACXC,WAAY,CAAC,EACbQ,YAAa,CAAC,EACdE,YAAa,CAAC,EACdD,YAAa,CAAC,EACdF,aAAc,CAAC,EACfV,WAAY,IAAKT,EAAMQ,SAAU,UACjCD,UAAW,IAAKP,EAAMQ,SAAU,SAChC4C,YAAa,CAAE5C,SAAU,WACzBE,cAAe,CACb,IAAKV,EAAMQ,SAAU,aACrB,CAAEL,SAAU,IAAME,EAAA,EAAYN,cAAeS,SAAUoC,EAAWlC,gBAEpE2C,IAAK,IAAKR,GACVS,WAAY,IAAKT,EAASrC,SAAU,eACpC+C,cAAe,IAAKR,EAAOvC,SAAU,aACrCgD,gBAAiB,IAAKT,EAAOvC,SAAU,eACvCiD,oBAAqB,IAAKT,EAAaxC,SAAU,aACjDkB,eAAgB,CACd,IAAKqB,EAAOvC,SAAU,SACtB,IAAKwC,EAAaxC,SAAU,UAE9ByB,SAAU,IAAKa,EAAMtC,SAAU,SAC/ByC,kBAAmB,IAAKA,EAAmBzC,SAAU,cAGzD,KACA,KA/B6B,CAvL/B,cAA4BkC,EAC1B,6BAAWD,GACT,OAAOA,EAAmBiB,OAAOhB,EAAeD,oBAAsB,GACxE,CAEA,WAAAkB,GACE7D,QAEAH,KAAKiE,aAAa,CAAEC,KAAM,SAAUC,UAAY,gYAchD,QACE,0dAuBAnE,MAGFA,KAAKoE,WAAapE,KAAKqE,WAAWC,cAAc,YAChDtE,KAAKuE,aAAevE,KAAKqE,WAAWC,cAAc,SAElDtE,KAAKwE,OAAOC,QAAU,IAAMzE,KAAKuE,aAAarE,QAE9CF,KAAKuE,aAAaG,SAAWC,MAAOC,IAClC,MAAMC,EAAmBD,EAAEE,OAAOC,MChFX,IAACC,EDkFnBH,EAAiBI,SAItBjF,KAAKkF,YCtFmBF,EDsFSH,EAAiB,GCrF/C,IAAIM,SAASC,IAClB,MAAMC,EAAS,IAAIC,WACnBD,EAAOE,OAAUX,GAAMQ,EAAQR,EAAEE,OAAOU,QACxCH,EAAOI,cAAcT,EAAQ,KDoF3BhF,KAAK0F,kBChFgB,CAACV,GACnBA,EAAQW,KAAKC,QAAQ,QAAS,ID+EVC,CAAYhB,EAAiB,KAAI,EAG1D7E,KAAK8F,UAAY,KACf9F,KAAK+F,aAAa,UAAW,OAAO,CAExC,CAUA,WAAAC,GACE,OAAIhG,KAAKiG,aAAejG,KAAKkG,MAAMhB,MAC1B,CAAEiB,cAAc,IAEzBnG,KAAKoG,gBAAgB,WACd,CAAC,EACV,CAEA,UAAAC,GACiBrG,KAAKsG,YAAYhC,cAAc,kBACvCG,QAAU,IAAMzE,KAAKuE,aAAarE,OAC3C,CAEA,wBAAAqG,CAAyBC,EAAUC,EAAUC,GAC3CvG,MAAMoG,2BAA2BC,EAAUC,EAAUC,GAEjDD,IAAaC,IACE,UAAbF,EACFxG,KAAK2G,YAAYD,GACK,gBAAbF,EACTxG,KAAK0F,kBAAkBgB,GACD,iBAAbF,EACTxG,KAAK4G,kBAAkBF,GACD,gBAAbF,EACTxG,KAAK6G,iBAAiBH,GACA,mBAAbF,EACTxG,KAAK8G,oBAAoBJ,GACH,SAAbF,EACTxG,KAAK+G,iBAAiBL,GACA,WAAbF,EACTxG,KAAKgH,kBAAkBN,GACD,aAAbF,GACTxG,KAAKiH,eAAeP,GAG1B,CAEA,UAAIlC,GACF,OAAOxE,KAAKqE,WAAWC,cAAc,iBACvC,CAEA,SAAI4B,GACF,OAAOlG,KAAKqE,WAAWC,cAAc,QACvC,CAEA,SAAIlB,GACF,OAAOpD,KAAKqE,WAAWC,cAAc,cACvC,CAEA,eAAIjB,GACF,OAAOrD,KAAKqE,WAAWC,cAAc,eACvC,CAEA,QAAInB,GACF,OAAOnD,KAAKqE,WAAWC,cAAc,QACvC,CAEA,WAAAqC,CAAYO,GACVlH,KAAKoD,MAAM+D,YAAcD,CAC3B,CAEA,iBAAAxB,CAAkBwB,GAChBlH,KAAKqD,YAAY8D,YAAcD,CACjC,CAEA,iBAAAN,CAAkBM,GAChBlH,KAAKwE,OAAO2C,YAAcD,CAC5B,CAEA,gBAAAH,CAAiBG,GACflH,KAAKwE,OAAOuB,aAAa,OAAQmB,EACnC,CAEA,gBAAAL,CAAiBK,GACflH,KAAKwE,OAAOuB,aAAa,OAAQmB,EACnC,CAEA,mBAAAJ,CAAoBI,GAClBlH,KAAKwE,OAAOuB,aAAa,UAAWmB,EACtC,CAEA,iBAAAF,CAAkBE,GAChBlH,KAAKkG,MAAMH,aAAa,SAAUmB,EACpC,CAEA,cAAAD,CAAeC,GACD,SAARA,EACFlH,KAAKkG,MAAMH,aAAa,WAAY,QAEpC/F,KAAKkG,MAAME,gBAAgB,WAE/B,aEhMFxD,eAAeC,OAAOzC,EAAemD,8ICI9B,MAAM6D,WAAe,EAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCCUxB,MAAMC,EAAeC,GAC1B,eAA+B,QAAY,QAAc,OAAWA,MAClE,qBAAWC,GACT,MAAO,CAOLC,SAAU,CACRC,KAAMC,OACNxC,MAAO,EACPyC,oBAAoB,GAG1B,CAUA,eAAIC,GACF,MAAO,CAAC,QAAS,IACnB,CAGA,KAAAC,GACE1H,MAAM0H,QAID7H,KAAK8H,aAAa,SACrB9H,KAAK+F,aAAa,OAAQ,SAE9B,CAiBA,UAAAgC,CAAWC,GACT7H,MAAM4H,WAAWC,GAEbA,EAAMC,QAAUD,EAAME,UAAYF,EAAMG,SAAWH,EAAMI,SAIzDpI,KAAK4H,YAAYS,SAASL,EAAMM,OAClCN,EAAMO,iBAINvI,KAAKE,QAET,ICzEJ,QAAe,gBAAiBkH,EAAc,CAAEoB,SAAU,yBAqC1D,MAAMC,UAAepB,GAAY,QAAa,SAAc,OAAgB,UAC1E,aAAWqB,GACT,MAAO,eACT,CAEA,mBAAWC,GACT,OAAsB,IFYkB;;;;;;;;;;;;;CEX1C,CAGA,KAAAd,GACE1H,MAAM0H,QAEN7H,KAAK4I,mBAAqB,IAAI,IAAkB5I,MAChDA,KAAK6I,cAAc7I,KAAK4I,mBAC1B,GAGF,OAAoBH,+FC9DpB,MAAMjE,EAAS,IAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyQlB,QAAe,gBAAiBA,EAAQ,CAAEgE,SAAU,+FCvQ7C,MAAMpI,GAAgB,QAAiB,QAEjC0I,GAAY,SACvB,QAAiB,CACfnI,SAAU,CACRuB,KAAM,CAAC,KAGX,KACA,KAPuB,EASvB,QAAY,CACVK,MAAO,GACPC,eAAgB,gBAChBC,MAAO,IAAM,kEAKbC,iBAAkB,CAAC,WAAY,SAC/BtC","sources":["webpack://@descope/web-components-ui/./src/baseClasses/createBaseInputClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/./src/components/descope-upload-file/UploadFileClass.js","webpack://@descope/web-components-ui/./src/components/descope-upload-file/helpers.js","webpack://@descope/web-components-ui/./src/components/descope-upload-file/index.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["import { compose } from '../helpers';\nimport {\n changeMixin,\n inputEventsDispatchingMixin,\n inputValidationMixin,\n normalizeBooleanAttributesMixin,\n} from '../mixins';\nimport { createBaseClass } from './createBaseClass';\n\nexport const createBaseInputClass = (...args) =>\n compose(\n inputValidationMixin,\n changeMixin,\n normalizeBooleanAttributesMixin,\n inputEventsDispatchingMixin\n )(createBaseClass(...args));\n","export const clickableMixin = (superclass) =>\n class ClickableMixinClass extends superclass {\n get isLoading() {\n return this.getAttribute('loading') === 'true';\n }\n\n click() {\n this.isLoading || super.click();\n }\n };\n","import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { IconClass } from '@descope-ui/descope-icon/class';\nimport { clickableMixin } from './clickableMixin';\n\nexport const componentName = getComponentName('button');\n\nconst resetStyles = `\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n`;\n\nconst iconStyles = `\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n`;\n\nconst editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;\n\nconst { host, label, slottedIcon } = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n slottedIcon: { selector: () => '::slotted(descope-icon)' },\n};\n\nlet loadingIndicatorStyles;\n\nexport const ButtonClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\n\n cursor: {},\n backgroundColor: {},\n\n outlineOffset: {},\n outlineColor: {},\n outlineStyle: {},\n outlineWidth: {},\n\n borderRadius: {},\n borderColor: {},\n borderStyle: {},\n borderWidth: {},\n\n verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\n horizontalPadding: [\n { property: 'padding-right', fallback: '0.875em' },\n { property: 'padding-left', fallback: '0.875em' },\n ],\n\n labelTextColor: { property: 'color' },\n iconColor: {\n selector: () => `::slotted(*)`,\n property: IconClass.cssVarList.fill,\n },\n labelTextDecoration: { ...label, property: 'text-decoration' },\n labelSpacing: { ...label, property: 'gap' },\n textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n iconSize: [\n { ...slottedIcon, property: 'width' },\n { ...slottedIcon, property: 'height' },\n ],\n },\n }),\n clickableMixin,\n draggableMixin,\n componentNameValidationMixin\n)(\n createProxy({\n slots: ['', 'prefix', 'label', 'suffix'],\n wrappedEleName: 'vaadin-button',\n style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width=\"true\"]) {\n width: var(${ButtonClass.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,\n excludeAttrsSync: ['tabindex'],\n componentName,\n })\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport { createBaseInputClass } from '../../baseClasses/createBaseInputClass';\nimport { ButtonClass } from '@descope-ui/descope-button/class';\nimport { getFileBase64, getFilename } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('upload-file');\n\nconst observedAttributes = [\n 'title',\n 'description',\n 'button-label',\n 'accept',\n 'readonly',\n 'button-mode',\n 'button-variant',\n 'required',\n 'size',\n 'icon',\n];\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: ':host > div' });\n\nclass RawUploadFile extends BaseInputClass {\n static get observedAttributes() {\n return observedAttributes.concat(BaseInputClass.observedAttributes || []);\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\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\" aria-labelledby=\"button\"/>\n\t\t\t\t\t<descope-button id=\"button\"></descope-button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`;\n\n injectStyle(\n `\n :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 `,\n this\n );\n\n this.wrapperEle = this.shadowRoot.querySelector('.wrapper');\n this.inputElement = this.shadowRoot.querySelector('input');\n\n this.button.onclick = () => this.inputElement.click();\n\n this.inputElement.onchange = async (e) => {\n const receivedFileList = e.target.files;\n\n if (!receivedFileList.length) {\n return;\n }\n\n this.value = await getFileBase64(receivedFileList[0]);\n\n this.updateDescription(getFilename(receivedFileList[0]));\n };\n\n this.oninvalid = () => {\n this.setAttribute('invalid', 'true');\n };\n }\n\n // this is a temp solution,\n // we should show the input error message like we have in all other inputs\n /*\n reportValidity() {\n this.defaultReportValidity();\n }\n */\n\n getValidity() {\n if (this.isRequired && !this.input.value) {\n return { valueMissing: true };\n }\n this.removeAttribute('invalid');\n return {};\n }\n\n initInputs() {\n const button = this.rootElement.querySelector('descope-button');\n button.onclick = () => this.inputElement.click();\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (oldValue !== newValue) {\n if (attrName === 'title') {\n this.updateTitle(newValue);\n } else if (attrName === 'description') {\n this.updateDescription(newValue);\n } else if (attrName === 'button-label') {\n this.updateButtonLabel(newValue);\n } else if (attrName === 'button-mode') {\n this.updateButtonMode(newValue);\n } else if (attrName === 'button-variant') {\n this.updateButtonVariant(newValue);\n } else if (attrName === 'size') {\n this.updateButtonSize(newValue);\n } else if (attrName === 'accept') {\n this.updateInputAccept(newValue);\n } else if (attrName === 'readonly') {\n this.updateReadOnly(newValue);\n }\n }\n }\n\n get button() {\n return this.shadowRoot.querySelector('descope-button');\n }\n\n get input() {\n return this.shadowRoot.querySelector('input');\n }\n\n get title() {\n return this.shadowRoot.querySelector('.title-text');\n }\n\n get description() {\n return this.shadowRoot.querySelector('.description');\n }\n\n get icon() {\n return this.shadowRoot.querySelector('.icon');\n }\n\n updateTitle(val) {\n this.title.textContent = val;\n }\n\n updateDescription(val) {\n this.description.textContent = val;\n }\n\n updateButtonLabel(val) {\n this.button.textContent = val;\n }\n\n updateButtonSize(val) {\n this.button.setAttribute('size', val);\n }\n\n updateButtonMode(val) {\n this.button.setAttribute('mode', val);\n }\n\n updateButtonVariant(val) {\n this.button.setAttribute('variant', val);\n }\n\n updateInputAccept(val) {\n this.input.setAttribute('accept', val);\n }\n\n updateReadOnly(val) {\n if (val === 'true') {\n this.input.setAttribute('disabled', 'true');\n } else {\n this.input.removeAttribute('disabled');\n }\n }\n}\n\nconst buttonVars = ButtonClass.cssVarList;\nconst { host, wrapper, icon, title, description, requiredIndicator } = {\n host: { selector: () => ':host' },\n wrapper: { selector: () => ':host > div' },\n icon: { selector: () => '::slotted(*)' },\n title: { selector: () => '.title' },\n description: { selector: () => '.description' },\n requiredIndicator: { selector: () => '.title::after' },\n};\n\nexport const UploadFileClass = compose(\n createStyleMixin({ componentNameOverride: getComponentName('input-wrapper') }),\n createStyleMixin({\n mappings: {\n fontSize: {},\n fontFamily: {},\n borderColor: {},\n borderWidth: {},\n borderStyle: {},\n borderRadius: {},\n hostHeight: { ...host, property: 'height' },\n hostWidth: { ...host, property: 'width' },\n hostPadding: { property: 'padding' },\n hostDirection: [\n { ...host, property: 'direction' },\n { selector: () => ButtonClass.componentName, property: buttonVars.hostDirection },\n ],\n gap: { ...wrapper },\n lineHeight: { ...wrapper, property: 'line-height' },\n titleFontSize: { ...title, property: 'font-size' },\n titleFontWeight: { ...title, property: 'font-weight' },\n descriptionFontSize: { ...description, property: 'font-size' },\n labelTextColor: [\n { ...title, property: 'color' },\n { ...description, property: 'color' },\n ],\n iconSize: { ...icon, property: 'width' },\n requiredIndicator: { ...requiredIndicator, property: 'content' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin\n)(RawUploadFile);\n","export const getFileBase64 = (fileObj) => {\n return new Promise((resolve) => {\n const reader = new FileReader();\n reader.onload = (e) => resolve(e.target.result);\n reader.readAsDataURL(fileObj);\n });\n};\n\nexport const getFilename = (fileObj) => {\n return fileObj.name.replace(/^.*\\\\/, '');\n};\n","import { componentName, UploadFileClass } from './UploadFileClass';\nimport '@descope-ui/descope-button';\n\ncustomElements.define(componentName, UploadFileClass);\n\nexport { UploadFileClass, componentName };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n :host {\n display: inline-block;\n position: relative;\n outline: none;\n white-space: nowrap;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n /* Aligns the button with form fields when placed on the same line.\n Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n .vaadin-button-container::before {\n content: '\\\\2003';\n display: inline-block;\n width: 0;\n max-height: 100%;\n }\n\n .vaadin-button-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n width: 100%;\n height: 100%;\n min-height: inherit;\n text-shadow: inherit;\n }\n\n [part='prefix'],\n [part='suffix'] {\n flex: none;\n }\n\n [part='label'] {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n @media (forced-colors: active) {\n :host {\n outline: 1px solid;\n outline-offset: -1px;\n }\n\n :host([focused]) {\n outline-width: 2px;\n }\n\n :host([disabled]) {\n outline-color: GrayText;\n }\n }\n`;\n\nexport const buttonTemplate = (html) => html`\n <div class=\"vaadin-button-container\">\n <span part=\"prefix\" aria-hidden=\"true\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" aria-hidden=\"true\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n static get properties() {\n return {\n /**\n * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n *\n * @override\n * @protected\n */\n tabindex: {\n type: Number,\n value: 0,\n reflectToAttribute: true,\n },\n };\n }\n\n /**\n * By default, `Space` is the only possible activation key for a focusable HTML element.\n * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n *\n * @protected\n * @override\n */\n get _activeKeys() {\n return ['Enter', ' '];\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n // By default, if the user hasn't provided a custom role,\n // the role attribute is set to \"button\".\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n /**\n * Since the button component is designed on the base of the `[role=button]` attribute,\n * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n * it should manually fire the `click` event once an activation key is pressed,\n * as it follows from the WAI-ARIA specifications:\n * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n *\n * According to the UI Events specifications,\n * the `click` event should be fired exactly on `keydown`:\n * https://www.w3.org/TR/uievents/#event-type-keydown\n *\n * @param {KeyboardEvent} event\n * @protected\n * @override\n */\n _onKeyDown(event) {\n super._onKeyDown(event);\n\n if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n return;\n }\n\n if (this._activeKeys.includes(event.key)) {\n event.preventDefault();\n\n // `DisabledMixin` overrides the standard `click()` method\n // so that it doesn't fire the `click` event when the element is disabled.\n this.click();\n }\n }\n };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label` | The label (text) inside the button.\n * `prefix` | A slot for content before the label (e.g. an icon).\n * `suffix` | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `active` | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled` | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused` | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-button';\n }\n\n static get template() {\n return buttonTemplate(html);\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n :host {\n /* Sizing */\n --lumo-button-size: var(--lumo-size-m);\n min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n height: var(--_button-size);\n padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n box-sizing: border-box;\n /* Style */\n font-family: var(--lumo-font-family);\n font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n font-weight: var(--vaadin-button-font-weight, 500);\n color: var(--_lumo-button-text-color);\n background: var(--_lumo-button-background);\n border: var(--vaadin-button-border, none);\n border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n cursor: var(--lumo-clickable-cursor);\n -webkit-tap-highlight-color: transparent;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n flex-shrink: 0;\n --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n /* Used by notification */\n --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n }\n\n /* Set only for the internal parts so we don't affect the host vertical alignment */\n [part='label'],\n [part='prefix'],\n [part='suffix'] {\n line-height: var(--lumo-line-height-xs);\n }\n\n [part='label'] {\n padding: calc(var(--lumo-button-size) / 6) 0;\n }\n\n :host([theme~='small']) {\n font-size: var(--lumo-font-size-s);\n --lumo-button-size: var(--lumo-size-s);\n }\n\n :host([theme~='large']) {\n font-size: var(--lumo-font-size-l);\n --lumo-button-size: var(--lumo-size-l);\n }\n\n /* For interaction states */\n :host::before,\n :host::after {\n content: '';\n /* We rely on the host always being relative */\n position: absolute;\n z-index: 1;\n inset: 0;\n background-color: currentColor;\n border-radius: inherit;\n opacity: 0;\n pointer-events: none;\n }\n\n /* Hover */\n\n @media (any-hover: hover) {\n :host(:hover)::before {\n opacity: 0.02;\n }\n }\n\n /* Active */\n\n :host::after {\n transition: opacity 1.4s, transform 0.1s;\n filter: blur(8px);\n }\n\n :host([active])::before {\n opacity: 0.05;\n transition-duration: 0s;\n }\n\n :host([active])::after {\n opacity: 0.1;\n transition-duration: 0s, 0s;\n transform: scale(0);\n }\n\n /* Keyboard focus */\n\n :host([focus-ring]) {\n box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n }\n\n :host([theme~='primary'][focus-ring]) {\n box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n }\n\n /* Types (primary, tertiary, tertiary-inline */\n\n :host([theme~='tertiary']),\n :host([theme~='tertiary-inline']) {\n --_background: transparent !important;\n background: var(--vaadin-button-tertiary-background, var(--_background));\n min-width: 0;\n }\n\n :host([theme~='tertiary']) {\n border: var(--vaadin-button-tertiary-border, none);\n color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n }\n\n :host([theme~='tertiary-inline'])::before {\n display: none;\n }\n\n :host([theme~='tertiary-inline']) {\n margin: 0;\n height: auto;\n padding: 0;\n line-height: inherit;\n font-size: inherit;\n }\n\n :host([theme~='tertiary-inline']) [part='label'] {\n padding: 0;\n overflow: visible;\n line-height: inherit;\n }\n\n :host([theme~='primary']) {\n background: var(--_lumo-button-primary-background);\n border: var(--vaadin-button-primary-border, none);\n color: var(--_lumo-button-primary-text-color);\n font-weight: var(--vaadin-button-primary-font-weight, 600);\n min-width: calc(var(--lumo-button-size) * 2.5);\n }\n\n :host([theme~='primary'])::before {\n background-color: black;\n }\n\n @media (any-hover: hover) {\n :host([theme~='primary']:hover)::before {\n opacity: 0.05;\n }\n }\n\n :host([theme~='primary'][active])::before {\n opacity: 0.1;\n }\n\n :host([theme~='primary'][active])::after {\n opacity: 0.2;\n }\n\n /* Colors (success, error, contrast) */\n\n :host([theme~='success']) {\n color: var(--lumo-success-text-color);\n }\n\n :host([theme~='success'][theme~='primary']) {\n background-color: var(--lumo-success-color);\n color: var(--lumo-success-contrast-color);\n }\n\n :host([theme~='error']) {\n color: var(--lumo-error-text-color);\n }\n\n :host([theme~='error'][theme~='primary']) {\n background-color: var(--lumo-error-color);\n color: var(--lumo-error-contrast-color);\n }\n\n :host([theme~='contrast']) {\n color: var(--lumo-contrast);\n }\n\n :host([theme~='contrast'][theme~='primary']) {\n background-color: var(--lumo-contrast);\n color: var(--lumo-base-color);\n }\n\n /* Disabled state. Keep selectors after other color variants. */\n\n :host([disabled]) {\n pointer-events: none;\n color: var(--lumo-disabled-text-color);\n }\n\n :host([theme~='primary'][disabled]) {\n background-color: var(--lumo-contrast-30pct);\n color: var(--lumo-base-color);\n }\n\n :host([theme~='primary'][disabled]) [part] {\n opacity: 0.7;\n }\n\n /* Icons */\n\n [part] ::slotted(vaadin-icon) {\n display: inline-block;\n width: var(--lumo-icon-size-m);\n height: var(--lumo-icon-size-m);\n }\n\n /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n padding: 0.25em;\n box-sizing: border-box !important;\n }\n\n [part='prefix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n [part='suffix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n /* Icon-only */\n\n :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n min-width: var(--lumo-button-size);\n padding-left: calc(var(--lumo-button-size) / 4);\n padding-right: calc(var(--lumo-button-size) / 4);\n }\n\n :host([theme~='icon']) [part='prefix'],\n :host([theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* RTL specific styles */\n\n :host([dir='rtl']) [part='prefix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n :host([dir='rtl']) [part='suffix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n :host([dir='rtl'][theme~='icon']) [part='prefix'],\n :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\n","import {\n componentNameValidationMixin,\n createProxy,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n createStyleMixin({\n mappings: {\n fill: {},\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class'],\n componentName,\n }),\n);\n"],"names":["createBaseInputClass","args","clickableMixin","superclass","isLoading","this","getAttribute","click","super","componentName","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","mappings","hostWidth","property","hostHeight","hostDirection","fontSize","fontFamily","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","style","excludeAttrsSync","color","customElements","define","observedAttributes","BaseInputClass","baseSelector","buttonVars","wrapper","icon","title","description","requiredIndicator","UploadFileClass","componentNameOverride","hostPadding","gap","lineHeight","titleFontSize","titleFontWeight","descriptionFontSize","concat","constructor","attachShadow","mode","innerHTML","wrapperEle","shadowRoot","querySelector","inputElement","button","onclick","onchange","async","e","receivedFileList","target","files","fileObj","length","value","Promise","resolve","reader","FileReader","onload","result","readAsDataURL","updateDescription","name","replace","getFilename","oninvalid","setAttribute","getValidity","isRequired","input","valueMissing","removeAttribute","initInputs","rootElement","attributeChangedCallback","attrName","oldValue","newValue","updateTitle","updateButtonLabel","updateButtonMode","updateButtonVariant","updateButtonSize","updateInputAccept","updateReadOnly","val","textContent","buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","reflectToAttribute","_activeKeys","ready","hasAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","moduleId","Button","is","template","_tooltipController","addController","IconClass"],"sourceRoot":""}
|