@fluid-topics/ft-filterable-table 0.1.6 → 0.1.7
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/build/ft-filterable-table.light.js +1112 -0
- package/build/ft-filterable-table.min.js +484 -18
- package/package.json +6 -6
|
@@ -79,7 +79,21 @@ class Ot extends ht{constructor(t){if(super(t),this.it=U,t.type!==ut)throw Error
|
|
|
79
79
|
* @license
|
|
80
80
|
* Copyright 2021 Google LLC
|
|
81
81
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
82
|
-
*/class Nt extends(function(t){return class extends t{createRenderRoot(){const t=this.constructor,{registry:e,elementDefinitions:i,shadowRootOptions:r}=t;i&&!e&&(t.registry=new CustomElementRegistry,Object.entries(i).forEach((([e,i])=>t.registry.define(e,i))));const o=this.renderOptions.creationScope=this.attachShadow({...r,customElements:t.registry});return a(o,this.constructor.elementStyles),o}}}(et)){constructor(){super(),this.constructorName=this.constructor.name,this.proto=this.constructor.prototype}getStyles(){return[]}getTemplate(){return null}render(){let t=this.getStyles();return Array.isArray(t)||(t=[t]),j
|
|
82
|
+
*/class Nt extends(function(t){return class extends t{createRenderRoot(){const t=this.constructor,{registry:e,elementDefinitions:i,shadowRootOptions:r}=t;i&&!e&&(t.registry=new CustomElementRegistry,Object.entries(i).forEach((([e,i])=>t.registry.define(e,i))));const o=this.renderOptions.creationScope=this.attachShadow({...r,customElements:t.registry});return a(o,this.constructor.elementStyles),o}}}(et)){constructor(){super(),this.constructorName=this.constructor.name,this.proto=this.constructor.prototype}getStyles(){return[]}getTemplate(){return null}render(){let t=this.getStyles();return Array.isArray(t)||(t=[t]),j`
|
|
83
|
+
${t.map((t=>j`
|
|
84
|
+
<style>${t}</style>
|
|
85
|
+
`))}
|
|
86
|
+
${this.getTemplate()}
|
|
87
|
+
`}adoptedCallback(){Object.getPrototypeOf(this)!==this.constructorName&&Object.setPrototypeOf(this,this.proto)}updated(t){super.updated(t),setTimeout((()=>this.contentAvailableCallback(t)),0)}contentAvailableCallback(t){}}const Ft=s`
|
|
88
|
+
.ft-no-text-select {
|
|
89
|
+
-webkit-touch-callout: none;
|
|
90
|
+
-webkit-user-select: none;
|
|
91
|
+
-khtml-user-select: none;
|
|
92
|
+
-moz-user-select: none;
|
|
93
|
+
-ms-user-select: none;
|
|
94
|
+
user-select: none;
|
|
95
|
+
}
|
|
96
|
+
`;var At,Tt,Mt;const jt=navigator.vendor&&!!navigator.vendor.match(/apple/i)||"[object SafariRemoteNotification]"===(null!==(Mt=null===(Tt=null===(At=window.safari)||void 0===At?void 0:At.pushNotification)||void 0===Tt?void 0:Tt.toString())&&void 0!==Mt?Mt:""),Dt=ft(class extends ht{constructor(t){var e;if(super(t),t.type!==dt||"class"!==t.name||(null===(e=t.strings)||void 0===e?void 0:e.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter((e=>t[e])).join(" ")+" "}update(t,[e]){var i,r;if(void 0===this.st){this.st=new Set,void 0!==t.strings&&(this.et=new Set(t.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in e)e[t]&&!(null===(i=this.et)||void 0===i?void 0:i.has(t))&&this.st.add(t);return this.render(e)}const o=t.element.classList;this.st.forEach((t=>{t in e||(o.remove(t),this.st.delete(t))}));for(const t in e){const i=!!e[t];i===this.st.has(t)||(null===(r=this.et)||void 0===r?void 0:r.has(t))||(i?(o.add(t),this.st.add(t)):(o.remove(t),this.st.delete(t)))}return D}}),Ut=t=>({_$litStatic$:t}),Bt=new Map,_t=(t=>(e,...i)=>{var r;const o=i.length;let n,s;const a=[],l=[];let c,p=0,d=!1;for(;p<o;){for(c=e[p];p<o&&void 0!==(s=i[p],n=null===(r=s)||void 0===r?void 0:r._$litStatic$);)c+=n+e[++p],d=!0;l.push(s),a.push(c),p++}if(p===o&&a.push(e[o]),d){const t=a.join("$$lit$$");void 0===(e=Bt.get(t))&&(a.raw=a,Bt.set(t,e=a)),i=l}return t(e,...i)})(j);
|
|
83
97
|
/**
|
|
84
98
|
* @license
|
|
85
99
|
* Copyright 2018 Google LLC
|
|
@@ -182,7 +196,7 @@ class Ot extends ht{constructor(t){if(super(t),this.it=U,t.type!==ut)throw Error
|
|
|
182
196
|
</${Ut(this.element)}>
|
|
183
197
|
`:_t`
|
|
184
198
|
<slot class="ft-typography ft-typography--${this.variant}"></slot>
|
|
185
|
-
`}};Lt([nt()],Ze.prototype,"element",void 0),Lt([nt()],Ze.prototype,"variant",void 0),Ze=Lt([Ct("ft-typography")],Ze);var Ke=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const qe={fontSize:Et.create("--ft-input-label-font-size","SIZE","14px"),raisedFontSize:Et.create("--ft-input-label-raised-font-size","SIZE","11px"),verticalSpacing:Et.create("--ft-input-label-vertical-spacing","SIZE","4px"),horizontalSpacing:Et.create("--ft-input-label-horizontal-spacing","SIZE","12px"),borderColor:Et.extend("--ft-input-label-border-color",zt.colorOutline),textColor:Et.extend("--ft-input-label-text-color",zt.colorOnSurfaceMedium),disabledTextColor:Et.extend("--ft-input-label-disabled-text-color",zt.colorOnSurfaceDisabled),borderRadiusS:Et.external(zt.borderRadiusS,"Design system")};let Ge=class extends Nt{constructor(){super(...arguments),this.text="",this.raised=!1,this.outlined=!1,this.disabled=!1}getStyles(){return[Pe,s`
|
|
199
|
+
`}};Lt([nt()],Ze.prototype,"element",void 0),Lt([nt()],Ze.prototype,"variant",void 0),Ze=Lt([Ct("ft-typography")],Ze);var Ke=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const qe={fontSize:Et.create("--ft-input-label-font-size","SIZE","14px"),raisedFontSize:Et.create("--ft-input-label-raised-font-size","SIZE","11px"),raisedZIndex:Et.create("--ft-input-label-outlined-raised-z-index","NUMBER","2"),verticalSpacing:Et.create("--ft-input-label-vertical-spacing","SIZE","4px"),horizontalSpacing:Et.create("--ft-input-label-horizontal-spacing","SIZE","12px"),borderColor:Et.extend("--ft-input-label-border-color",zt.colorOutline),textColor:Et.extend("--ft-input-label-text-color",zt.colorOnSurfaceMedium),disabledTextColor:Et.extend("--ft-input-label-disabled-text-color",zt.colorOnSurfaceDisabled),colorSurface:Et.external(zt.colorSurface,"Design system"),borderRadiusS:Et.external(zt.borderRadiusS,"Design system")};let Ge=class extends Nt{constructor(){super(...arguments),this.text="",this.raised=!1,this.outlined=!1,this.disabled=!1}getStyles(){return[Pe,s`
|
|
186
200
|
.ft-input-label {
|
|
187
201
|
position: absolute;
|
|
188
202
|
inset: 0;
|
|
@@ -219,7 +233,6 @@ class Ot extends ht{constructor(t){if(super(t),this.it=U,t.type!==ut)throw Error
|
|
|
219
233
|
border-bottom-width: 1px;
|
|
220
234
|
border-bottom-style: solid;
|
|
221
235
|
border-color: inherit;
|
|
222
|
-
padding: 0 4px;
|
|
223
236
|
color: ${qe.textColor};
|
|
224
237
|
transition: font-size 250ms, line-height 250ms, color 250ms;
|
|
225
238
|
${Rt($e.fontSize,qe.fontSize)};
|
|
@@ -231,6 +244,7 @@ class Ot extends ht{constructor(t){if(super(t),this.it=U,t.type!==ut)throw Error
|
|
|
231
244
|
}
|
|
232
245
|
|
|
233
246
|
.ft-input-label--hidden-text {
|
|
247
|
+
padding: 0 4px;
|
|
234
248
|
opacity: 0;
|
|
235
249
|
}
|
|
236
250
|
|
|
@@ -242,7 +256,7 @@ class Ot extends ht{constructor(t){if(super(t),this.it=U,t.type!==ut)throw Error
|
|
|
242
256
|
overflow: hidden;
|
|
243
257
|
white-space: nowrap;
|
|
244
258
|
text-overflow: ellipsis;
|
|
245
|
-
padding: ${qe.verticalSpacing}
|
|
259
|
+
padding: ${qe.verticalSpacing} 4px;
|
|
246
260
|
margin: calc(${qe.verticalSpacing} * -1) 0;
|
|
247
261
|
}
|
|
248
262
|
|
|
@@ -275,6 +289,10 @@ class Ot extends ht{constructor(t){if(super(t),this.it=U,t.type!==ut)throw Error
|
|
|
275
289
|
}
|
|
276
290
|
|
|
277
291
|
.ft-input-label--outlined.ft-input-label--raised .ft-input-label--floating-text {
|
|
292
|
+
padding: 4px;
|
|
293
|
+
z-index: ${qe.raisedZIndex};
|
|
294
|
+
background-color: ${qe.colorSurface};
|
|
295
|
+
border-radius: ${qe.borderRadiusS};
|
|
278
296
|
top: calc(var(--ft-typography-caption-line-height) / -2);
|
|
279
297
|
}
|
|
280
298
|
|
|
@@ -417,13 +435,15 @@ const ui=ft(class extends ht{constructor(t){var e;if(super(t),t.type!==dt||"styl
|
|
|
417
435
|
* @license
|
|
418
436
|
* Copyright 2018 Google LLC
|
|
419
437
|
* SPDX-License-Identifier: Apache-2.0
|
|
420
|
-
*/class fi extends ii{constructor(){super(...arguments),this.primary=!1,this.accent=!1,this.unbounded=!1,this.disabled=!1,this.activated=!1,this.selected=!1,this.internalUseStateLayerCustomProperties=!1,this.hovering=!1,this.bgFocused=!1,this.fgActivation=!1,this.fgDeactivation=!1,this.fgScale="",this.fgSize="",this.translateStart="",this.translateEnd="",this.leftPos="",this.topPos="",this.mdcFoundationClass=di}get isActive(){return t=this.parentElement||this,e=":active",(t.matches||t.webkitMatchesSelector||t.msMatchesSelector).call(t,e);var t,e}createAdapter(){return{browserSupportsCssVars:()=>!0,isUnbounded:()=>this.unbounded,isSurfaceActive:()=>this.isActive,isSurfaceDisabled:()=>this.disabled,addClass:t=>{switch(t){case"mdc-ripple-upgraded--background-focused":this.bgFocused=!0;break;case"mdc-ripple-upgraded--foreground-activation":this.fgActivation=!0;break;case"mdc-ripple-upgraded--foreground-deactivation":this.fgDeactivation=!0}},removeClass:t=>{switch(t){case"mdc-ripple-upgraded--background-focused":this.bgFocused=!1;break;case"mdc-ripple-upgraded--foreground-activation":this.fgActivation=!1;break;case"mdc-ripple-upgraded--foreground-deactivation":this.fgDeactivation=!1}},containsEventTarget:()=>!0,registerInteractionHandler:()=>{},deregisterInteractionHandler:()=>{},registerDocumentInteractionHandler:()=>{},deregisterDocumentInteractionHandler:()=>{},registerResizeHandler:()=>{},deregisterResizeHandler:()=>{},updateCssVariable:(t,e)=>{switch(t){case"--mdc-ripple-fg-scale":this.fgScale=e;break;case"--mdc-ripple-fg-size":this.fgSize=e;break;case"--mdc-ripple-fg-translate-end":this.translateEnd=e;break;case"--mdc-ripple-fg-translate-start":this.translateStart=e;break;case"--mdc-ripple-left":this.leftPos=e;break;case"--mdc-ripple-top":this.topPos=e}},computeBoundingRect:()=>(this.parentElement||this).getBoundingClientRect(),getWindowPageOffset:()=>({x:window.pageXOffset,y:window.pageYOffset})}}startPress(t){this.waitForFoundation((()=>{this.mdcFoundation.activate(t)}))}endPress(){this.waitForFoundation((()=>{this.mdcFoundation.deactivate()}))}startFocus(){this.waitForFoundation((()=>{this.mdcFoundation.handleFocus()}))}endFocus(){this.waitForFoundation((()=>{this.mdcFoundation.handleBlur()}))}startHover(){this.hovering=!0}endHover(){this.hovering=!1}waitForFoundation(t){this.mdcFoundation?t():this.updateComplete.then(t)}update(t){t.has("disabled")&&this.disabled&&this.endHover(),super.update(t)}render(){const t=this.activated&&(this.primary||!this.accent),e=this.selected&&(this.primary||!this.accent),i={"mdc-ripple-surface--accent":this.accent,"mdc-ripple-surface--primary--activated":t,"mdc-ripple-surface--accent--activated":this.accent&&this.activated,"mdc-ripple-surface--primary--selected":e,"mdc-ripple-surface--accent--selected":this.accent&&this.selected,"mdc-ripple-surface--disabled":this.disabled,"mdc-ripple-surface--hover":this.hovering,"mdc-ripple-surface--primary":this.primary,"mdc-ripple-surface--selected":this.selected,"mdc-ripple-upgraded--background-focused":this.bgFocused,"mdc-ripple-upgraded--foreground-activation":this.fgActivation,"mdc-ripple-upgraded--foreground-deactivation":this.fgDeactivation,"mdc-ripple-upgraded--unbounded":this.unbounded,"mdc-ripple-surface--internal-use-state-layer-custom-properties":this.internalUseStateLayerCustomProperties};return j
|
|
438
|
+
*/class fi extends ii{constructor(){super(...arguments),this.primary=!1,this.accent=!1,this.unbounded=!1,this.disabled=!1,this.activated=!1,this.selected=!1,this.internalUseStateLayerCustomProperties=!1,this.hovering=!1,this.bgFocused=!1,this.fgActivation=!1,this.fgDeactivation=!1,this.fgScale="",this.fgSize="",this.translateStart="",this.translateEnd="",this.leftPos="",this.topPos="",this.mdcFoundationClass=di}get isActive(){return t=this.parentElement||this,e=":active",(t.matches||t.webkitMatchesSelector||t.msMatchesSelector).call(t,e);var t,e}createAdapter(){return{browserSupportsCssVars:()=>!0,isUnbounded:()=>this.unbounded,isSurfaceActive:()=>this.isActive,isSurfaceDisabled:()=>this.disabled,addClass:t=>{switch(t){case"mdc-ripple-upgraded--background-focused":this.bgFocused=!0;break;case"mdc-ripple-upgraded--foreground-activation":this.fgActivation=!0;break;case"mdc-ripple-upgraded--foreground-deactivation":this.fgDeactivation=!0}},removeClass:t=>{switch(t){case"mdc-ripple-upgraded--background-focused":this.bgFocused=!1;break;case"mdc-ripple-upgraded--foreground-activation":this.fgActivation=!1;break;case"mdc-ripple-upgraded--foreground-deactivation":this.fgDeactivation=!1}},containsEventTarget:()=>!0,registerInteractionHandler:()=>{},deregisterInteractionHandler:()=>{},registerDocumentInteractionHandler:()=>{},deregisterDocumentInteractionHandler:()=>{},registerResizeHandler:()=>{},deregisterResizeHandler:()=>{},updateCssVariable:(t,e)=>{switch(t){case"--mdc-ripple-fg-scale":this.fgScale=e;break;case"--mdc-ripple-fg-size":this.fgSize=e;break;case"--mdc-ripple-fg-translate-end":this.translateEnd=e;break;case"--mdc-ripple-fg-translate-start":this.translateStart=e;break;case"--mdc-ripple-left":this.leftPos=e;break;case"--mdc-ripple-top":this.topPos=e}},computeBoundingRect:()=>(this.parentElement||this).getBoundingClientRect(),getWindowPageOffset:()=>({x:window.pageXOffset,y:window.pageYOffset})}}startPress(t){this.waitForFoundation((()=>{this.mdcFoundation.activate(t)}))}endPress(){this.waitForFoundation((()=>{this.mdcFoundation.deactivate()}))}startFocus(){this.waitForFoundation((()=>{this.mdcFoundation.handleFocus()}))}endFocus(){this.waitForFoundation((()=>{this.mdcFoundation.handleBlur()}))}startHover(){this.hovering=!0}endHover(){this.hovering=!1}waitForFoundation(t){this.mdcFoundation?t():this.updateComplete.then(t)}update(t){t.has("disabled")&&this.disabled&&this.endHover(),super.update(t)}render(){const t=this.activated&&(this.primary||!this.accent),e=this.selected&&(this.primary||!this.accent),i={"mdc-ripple-surface--accent":this.accent,"mdc-ripple-surface--primary--activated":t,"mdc-ripple-surface--accent--activated":this.accent&&this.activated,"mdc-ripple-surface--primary--selected":e,"mdc-ripple-surface--accent--selected":this.accent&&this.selected,"mdc-ripple-surface--disabled":this.disabled,"mdc-ripple-surface--hover":this.hovering,"mdc-ripple-surface--primary":this.primary,"mdc-ripple-surface--selected":this.selected,"mdc-ripple-upgraded--background-focused":this.bgFocused,"mdc-ripple-upgraded--foreground-activation":this.fgActivation,"mdc-ripple-upgraded--foreground-deactivation":this.fgDeactivation,"mdc-ripple-upgraded--unbounded":this.unbounded,"mdc-ripple-surface--internal-use-state-layer-custom-properties":this.internalUseStateLayerCustomProperties};return j`
|
|
439
|
+
<div class="mdc-ripple-surface mdc-ripple-upgraded ${Dt(i)}"
|
|
440
|
+
style="${ui({"--mdc-ripple-fg-scale":this.fgScale,"--mdc-ripple-fg-size":this.fgSize,"--mdc-ripple-fg-translate-end":this.translateEnd,"--mdc-ripple-fg-translate-start":this.translateStart,"--mdc-ripple-left":this.leftPos,"--mdc-ripple-top":this.topPos})}"></div>`}}Ye([lt(".mdc-ripple-surface")],fi.prototype,"mdcRoot",void 0),Ye([nt({type:Boolean})],fi.prototype,"primary",void 0),Ye([nt({type:Boolean})],fi.prototype,"accent",void 0),Ye([nt({type:Boolean})],fi.prototype,"unbounded",void 0),Ye([nt({type:Boolean})],fi.prototype,"disabled",void 0),Ye([nt({type:Boolean})],fi.prototype,"activated",void 0),Ye([nt({type:Boolean})],fi.prototype,"selected",void 0),Ye([nt({type:Boolean})],fi.prototype,"internalUseStateLayerCustomProperties",void 0),Ye([st()],fi.prototype,"hovering",void 0),Ye([st()],fi.prototype,"bgFocused",void 0),Ye([st()],fi.prototype,"fgActivation",void 0),Ye([st()],fi.prototype,"fgDeactivation",void 0),Ye([st()],fi.prototype,"fgScale",void 0),Ye([st()],fi.prototype,"fgSize",void 0),Ye([st()],fi.prototype,"translateStart",void 0),Ye([st()],fi.prototype,"translateEnd",void 0),Ye([st()],fi.prototype,"leftPos",void 0),Ye([st()],fi.prototype,"topPos",void 0);
|
|
421
441
|
/**
|
|
422
442
|
* @license
|
|
423
443
|
* Copyright 2021 Google LLC
|
|
424
444
|
* SPDX-LIcense-Identifier: Apache-2.0
|
|
425
445
|
*/
|
|
426
|
-
const hi=s`.mdc-ripple-surface{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity;position:relative;outline:0;overflow:hidden}.mdc-ripple-surface::after,.mdc-ripple-surface::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-ripple-surface::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{transform:scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.mdc-ripple-surface::after,.mdc-ripple-surface::before{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-upgraded--unbounded::after,.mdc-ripple-upgraded--unbounded::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.mdc-ripple-surface::after,.mdc-ripple-surface::before{background-color:#000;background-color:var(--mdc-ripple-color,#000)}.mdc-ripple-surface.mdc-ripple-surface--hover::before,.mdc-ripple-surface:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity,.04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity,.12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity,.12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(.4,0,.2,1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity,0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity,0)}to{opacity:0}}:host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:block}:host .mdc-ripple-surface{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;will-change:unset}.mdc-ripple-surface--primary::after,.mdc-ripple-surface--primary::before{background-color:#6200ee;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#6200ee))}.mdc-ripple-surface--primary.mdc-ripple-surface--hover::before,.mdc-ripple-surface--primary:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity,.04)}.mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity,.12)}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity,.12)}.mdc-ripple-surface--primary.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--primary--activated::before{opacity:.12;opacity:var(--mdc-ripple-activated-opacity,.12)}.mdc-ripple-surface--primary--activated::after,.mdc-ripple-surface--primary--activated::before{background-color:#6200ee;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#6200ee))}.mdc-ripple-surface--primary--activated.mdc-ripple-surface--hover::before,.mdc-ripple-surface--primary--activated:hover::before{opacity:.16;opacity:var(--mdc-ripple-hover-opacity,.16)}.mdc-ripple-surface--primary--activated.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.24;opacity:var(--mdc-ripple-focus-opacity,.24)}.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.24;opacity:var(--mdc-ripple-press-opacity,.24)}.mdc-ripple-surface--primary--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--primary--selected::before{opacity:.08;opacity:var(--mdc-ripple-selected-opacity,.08)}.mdc-ripple-surface--primary--selected::after,.mdc-ripple-surface--primary--selected::before{background-color:#6200ee;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#6200ee))}.mdc-ripple-surface--primary--selected.mdc-ripple-surface--hover::before,.mdc-ripple-surface--primary--selected:hover::before{opacity:.12;opacity:var(--mdc-ripple-hover-opacity,.12)}.mdc-ripple-surface--primary--selected.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.2;opacity:var(--mdc-ripple-focus-opacity,.2)}.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.2;opacity:var(--mdc-ripple-press-opacity,.2)}.mdc-ripple-surface--primary--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--accent::after,.mdc-ripple-surface--accent::before{background-color:#018786;background-color:var(--mdc-ripple-color,var(--mdc-theme-secondary,#018786))}.mdc-ripple-surface--accent.mdc-ripple-surface--hover::before,.mdc-ripple-surface--accent:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity,.04)}.mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity,.12)}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity,.12)}.mdc-ripple-surface--accent.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--accent--activated::before{opacity:.12;opacity:var(--mdc-ripple-activated-opacity,.12)}.mdc-ripple-surface--accent--activated::after,.mdc-ripple-surface--accent--activated::before{background-color:#018786;background-color:var(--mdc-ripple-color,var(--mdc-theme-secondary,#018786))}.mdc-ripple-surface--accent--activated.mdc-ripple-surface--hover::before,.mdc-ripple-surface--accent--activated:hover::before{opacity:.16;opacity:var(--mdc-ripple-hover-opacity,.16)}.mdc-ripple-surface--accent--activated.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.24;opacity:var(--mdc-ripple-focus-opacity,.24)}.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.24;opacity:var(--mdc-ripple-press-opacity,.24)}.mdc-ripple-surface--accent--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--accent--selected::before{opacity:.08;opacity:var(--mdc-ripple-selected-opacity,.08)}.mdc-ripple-surface--accent--selected::after,.mdc-ripple-surface--accent--selected::before{background-color:#018786;background-color:var(--mdc-ripple-color,var(--mdc-theme-secondary,#018786))}.mdc-ripple-surface--accent--selected.mdc-ripple-surface--hover::before,.mdc-ripple-surface--accent--selected:hover::before{opacity:.12;opacity:var(--mdc-ripple-hover-opacity,.12)}.mdc-ripple-surface--accent--selected.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.2;opacity:var(--mdc-ripple-focus-opacity,.2)}.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.2;opacity:var(--mdc-ripple-press-opacity,.2)}.mdc-ripple-surface--accent--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--disabled{opacity:0}.mdc-ripple-surface--internal-use-state-layer-custom-properties::after,.mdc-ripple-surface--internal-use-state-layer-custom-properties::before{background-color:#000;background-color:var(--mdc-ripple-hover-state-layer-color,#000)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-surface--hover::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-state-layer-opacity,.04)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-state-layer-opacity,.12)}.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-pressed-state-layer-opacity,.12)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-pressed-state-layer-opacity, 0.12)}`
|
|
446
|
+
const hi=s`.mdc-ripple-surface{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity;position:relative;outline:none;overflow:hidden}.mdc-ripple-surface::before,.mdc-ripple-surface::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-ripple-surface::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-ripple-surface::before,.mdc-ripple-surface::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-upgraded--unbounded::before,.mdc-ripple-upgraded--unbounded::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface::before,.mdc-ripple-surface::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-ripple-surface:hover::before,.mdc-ripple-surface.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}:host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:block}:host .mdc-ripple-surface{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;will-change:unset}.mdc-ripple-surface--primary::before,.mdc-ripple-surface--primary::after{background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-ripple-surface--primary:hover::before,.mdc-ripple-surface--primary.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--primary.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--primary--activated::before{opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12)}.mdc-ripple-surface--primary--activated::before,.mdc-ripple-surface--primary--activated::after{background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-ripple-surface--primary--activated:hover::before,.mdc-ripple-surface--primary--activated.mdc-ripple-surface--hover::before{opacity:0.16;opacity:var(--mdc-ripple-hover-opacity, 0.16)}.mdc-ripple-surface--primary--activated.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--primary--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--primary--selected::before{opacity:0.08;opacity:var(--mdc-ripple-selected-opacity, 0.08)}.mdc-ripple-surface--primary--selected::before,.mdc-ripple-surface--primary--selected::after{background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-ripple-surface--primary--selected:hover::before,.mdc-ripple-surface--primary--selected.mdc-ripple-surface--hover::before{opacity:0.12;opacity:var(--mdc-ripple-hover-opacity, 0.12)}.mdc-ripple-surface--primary--selected.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-focus-opacity, 0.2)}.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--primary--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--accent::before,.mdc-ripple-surface--accent::after{background-color:#018786;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #018786))}.mdc-ripple-surface--accent:hover::before,.mdc-ripple-surface--accent.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--accent.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--accent--activated::before{opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12)}.mdc-ripple-surface--accent--activated::before,.mdc-ripple-surface--accent--activated::after{background-color:#018786;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #018786))}.mdc-ripple-surface--accent--activated:hover::before,.mdc-ripple-surface--accent--activated.mdc-ripple-surface--hover::before{opacity:0.16;opacity:var(--mdc-ripple-hover-opacity, 0.16)}.mdc-ripple-surface--accent--activated.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--accent--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--accent--selected::before{opacity:0.08;opacity:var(--mdc-ripple-selected-opacity, 0.08)}.mdc-ripple-surface--accent--selected::before,.mdc-ripple-surface--accent--selected::after{background-color:#018786;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #018786))}.mdc-ripple-surface--accent--selected:hover::before,.mdc-ripple-surface--accent--selected.mdc-ripple-surface--hover::before{opacity:0.12;opacity:var(--mdc-ripple-hover-opacity, 0.12)}.mdc-ripple-surface--accent--selected.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-focus-opacity, 0.2)}.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--accent--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--disabled{opacity:0}.mdc-ripple-surface--internal-use-state-layer-custom-properties::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties::after{background-color:#000;background-color:var(--mdc-ripple-hover-state-layer-color, #000)}.mdc-ripple-surface--internal-use-state-layer-custom-properties:hover::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-state-layer-opacity, 0.04)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-state-layer-opacity, 0.12)}.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-pressed-state-layer-opacity, 0.12)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-pressed-state-layer-opacity, 0.12)}`
|
|
427
447
|
/**
|
|
428
448
|
* @license
|
|
429
449
|
* Copyright 2018 Google LLC
|
|
@@ -434,18 +454,45 @@ const hi=s`.mdc-ripple-surface{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-
|
|
|
434
454
|
* Copyright 2020 Google LLC
|
|
435
455
|
* SPDX-License-Identifier: Apache-2.0
|
|
436
456
|
*/
|
|
437
|
-
class vi{constructor(t){this.startPress=e=>{t().then((t=>{t&&t.startPress(e)}))},this.endPress=()=>{t().then((t=>{t&&t.endPress()}))},this.startFocus=()=>{t().then((t=>{t&&t.startFocus()}))},this.endFocus=()=>{t().then((t=>{t&&t.endFocus()}))},this.startHover=()=>{t().then((t=>{t&&t.startHover()}))},this.endHover=()=>{t().then((t=>{t&&t.endHover()}))}}}var yi=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const bi={color:Et.extend("--ft-ripple-color",zt.colorContent),primaryColor:Et.extend("--ft-ripple-primary-color",Et.extend("--ft-ripple-color",zt.colorPrimary)),secondaryColor:Et.extend("--ft-ripple-secondary-color",Et.extend("--ft-ripple-color",zt.colorSecondary)),opacityContentOnSurfacePressed:Et.external(zt.opacityContentOnSurfacePressed,"Design system"),opacityContentOnSurfaceHover:Et.external(zt.opacityContentOnSurfaceHover,"Design system"),opacityContentOnSurfaceFocused:Et.external(zt.opacityContentOnSurfaceFocused,"Design system"),opacityContentOnSurfaceSelected:Et.external(zt.opacityContentOnSurfaceSelected,"Design system"),opacityContentOnSurfaceDragged:Et.external(zt.opacityContentOnSurfaceDragged,"Design system")};let gi=class extends Nt{constructor(){super(...arguments),this.primary=!1,this.secondary=!1,this.unbounded=!1,this.activated=!1,this.selected=!1,this.disabled=!1}getStyles(){return s
|
|
457
|
+
class vi{constructor(t){this.startPress=e=>{t().then((t=>{t&&t.startPress(e)}))},this.endPress=()=>{t().then((t=>{t&&t.endPress()}))},this.startFocus=()=>{t().then((t=>{t&&t.startFocus()}))},this.endFocus=()=>{t().then((t=>{t&&t.endFocus()}))},this.startHover=()=>{t().then((t=>{t&&t.startHover()}))},this.endHover=()=>{t().then((t=>{t&&t.endHover()}))}}}var yi=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const bi={color:Et.extend("--ft-ripple-color",zt.colorContent),primaryColor:Et.extend("--ft-ripple-primary-color",Et.extend("--ft-ripple-color",zt.colorPrimary)),secondaryColor:Et.extend("--ft-ripple-secondary-color",Et.extend("--ft-ripple-color",zt.colorSecondary)),opacityContentOnSurfacePressed:Et.external(zt.opacityContentOnSurfacePressed,"Design system"),opacityContentOnSurfaceHover:Et.external(zt.opacityContentOnSurfaceHover,"Design system"),opacityContentOnSurfaceFocused:Et.external(zt.opacityContentOnSurfaceFocused,"Design system"),opacityContentOnSurfaceSelected:Et.external(zt.opacityContentOnSurfaceSelected,"Design system"),opacityContentOnSurfaceDragged:Et.external(zt.opacityContentOnSurfaceDragged,"Design system")};let gi=class extends Nt{constructor(){super(...arguments),this.primary=!1,this.secondary=!1,this.unbounded=!1,this.activated=!1,this.selected=!1,this.disabled=!1}getStyles(){return s`
|
|
458
|
+
:host {
|
|
459
|
+
display: contents;
|
|
460
|
+
|
|
461
|
+
--mdc-ripple-color: ${bi.color};
|
|
462
|
+
--mdc-ripple-press-opacity: ${bi.opacityContentOnSurfacePressed};
|
|
463
|
+
--mdc-ripple-hover-opacity: ${bi.opacityContentOnSurfaceHover};
|
|
464
|
+
--mdc-ripple-focus-opacity: ${bi.opacityContentOnSurfaceFocused};
|
|
465
|
+
--mdc-ripple-selected-opacity: ${bi.opacityContentOnSurfaceSelected};
|
|
466
|
+
--mdc-ripple-activated-opacity: ${bi.opacityContentOnSurfaceDragged};
|
|
467
|
+
}
|
|
468
|
+
|
|
469
|
+
mwc-ripple.ft-ripple--secondary {
|
|
470
|
+
--mdc-ripple-color: ${bi.secondaryColor};
|
|
471
|
+
}
|
|
472
|
+
|
|
473
|
+
mwc-ripple.ft-ripple--primary {
|
|
474
|
+
--mdc-ripple-color: ${bi.primaryColor};
|
|
475
|
+
}
|
|
476
|
+
`}getTemplate(){return j`
|
|
477
|
+
<mwc-ripple
|
|
478
|
+
class="${this.primary?"ft-ripple--primary":this.secondary?"ft-ripple--secondary":""}"
|
|
479
|
+
?unbounded=${this.unbounded}
|
|
480
|
+
?activated=${this.activated}
|
|
481
|
+
?selected=${this.selected}
|
|
482
|
+
?disabled=${this.disabled}
|
|
483
|
+
></mwc-ripple>
|
|
484
|
+
`}updated(t){super.updated(t),t.has("disabled")&&this.disabled&&this.endRipple()}endRipple(){var t,e,i;null===(t=this.rippleHandlers)||void 0===t||t.endHover(),null===(e=this.rippleHandlers)||void 0===e||e.endFocus(),null===(i=this.rippleHandlers)||void 0===i||i.endPress()}connectedCallback(){var t;super.connectedCallback();const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentNode;if(e){const t=new vi((async()=>this.mwcRipple)),i=(...e)=>i=>{e.forEach((e=>window.addEventListener(e,t.endPress,{once:!0}))),t.startPress(i)},r=i("mouseup"),o=i("touchend","touchcancel"),n=t=>{["Enter"," "].includes(t.key)&&i("keyup")()};e.addEventListener("mouseenter",t.startHover),e.addEventListener("mouseleave",t.endHover),e.addEventListener("mousedown",r),e.addEventListener("touchstart",o),e.addEventListener("keydown",n),e.addEventListener("focus",t.startFocus),e.addEventListener("blur",t.endFocus),this.onDisconnect=()=>{e.removeEventListener("mouseenter",t.startHover),e.removeEventListener("mouseleave",t.endHover),e.removeEventListener("mousedown",r),e.removeEventListener("touchstart",o),e.removeEventListener("keydown",n),e.removeEventListener("focus",t.startFocus),e.removeEventListener("blur",t.endFocus)},this.rippleHandlers=t}}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.endRipple()}};gi.elementDefinitions={"mwc-ripple":mi},yi([nt({type:Boolean})],gi.prototype,"primary",void 0),yi([nt({type:Boolean})],gi.prototype,"secondary",void 0),yi([nt({type:Boolean})],gi.prototype,"unbounded",void 0),yi([nt({type:Boolean})],gi.prototype,"activated",void 0),yi([nt({type:Boolean})],gi.prototype,"selected",void 0),yi([nt({type:Boolean})],gi.prototype,"disabled",void 0),yi([lt("mwc-ripple")],gi.prototype,"mwcRipple",void 0),gi=yi([Ct("ft-ripple")],gi);
|
|
438
485
|
/**
|
|
439
486
|
* @license
|
|
440
487
|
* Copyright 2021 Google LLC
|
|
441
488
|
* SPDX-LIcense-Identifier: Apache-2.0
|
|
442
489
|
*/
|
|
443
|
-
const xi=s`:host{font-family:var(--mdc-icon-font, "Material Icons");font-weight:
|
|
490
|
+
const xi=s`:host{font-family:var(--mdc-icon-font, "Material Icons");font-weight:normal;font-style:normal;font-size:var(--mdc-icon-size, 24px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:"liga"}`
|
|
444
491
|
/**
|
|
445
492
|
* @license
|
|
446
493
|
* Copyright 2018 Google LLC
|
|
447
494
|
* SPDX-License-Identifier: Apache-2.0
|
|
448
|
-
*/;let wi=class extends et{render(){return j`<span><slot></slot></span>`}};wi.styles=[xi],wi=Ye([rt("mwc-icon")],wi);var $i=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};let Oi=class extends Nt{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1}getTemplate(){return j``}updated(t){super.updated(t),this.dispatchEvent(new CustomEvent("option-change",{detail:this,bubbles:!0}))}};Oi.elementDefinitions={},$i([nt({type:String})],Oi.prototype,"label",void 0),$i([nt({type:Object,converter:t=>t})],Oi.prototype,"value",void 0),$i([nt({type:Boolean,reflect:!0})],Oi.prototype,"selected",void 0),Oi=$i([Ct("ft-select-option")],Oi);const Si={labelSize:Et.create("--ft-select-label-size","SIZE","11px"),selectedOptionSize:Et.create("--ft-select-selected-option-size","SIZE","14px"),verticalSpacing:Et.create("--ft-select-vertical-spacing","SIZE","4px"),helperColor:Et.extend("--ft-select-helper-color",zt.colorOnSurfaceMedium),optionsZIndex:Et.create("--ft-select-options-z-index","NUMBER","2"),colorSurface:Et.external(zt.colorSurface,"Design system"),
|
|
495
|
+
*/;let wi=class extends et{render(){return j`<span><slot></slot></span>`}};wi.styles=[xi],wi=Ye([rt("mwc-icon")],wi);var $i=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};let Oi=class extends Nt{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1}getTemplate(){return j``}updated(t){super.updated(t),this.dispatchEvent(new CustomEvent("option-change",{detail:this,bubbles:!0}))}};Oi.elementDefinitions={},$i([nt({type:String})],Oi.prototype,"label",void 0),$i([nt({type:Object,converter:t=>t})],Oi.prototype,"value",void 0),$i([nt({type:Boolean,reflect:!0})],Oi.prototype,"selected",void 0),Oi=$i([Ct("ft-select-option")],Oi);const Si={labelSize:Et.create("--ft-select-label-size","SIZE","11px"),selectedOptionSize:Et.create("--ft-select-selected-option-size","SIZE","14px"),verticalSpacing:Et.create("--ft-select-vertical-spacing","SIZE","4px"),selectedOptionColor:Et.extend("--ft-select-selected-option-color",zt.colorOnSurface),helperColor:Et.extend("--ft-select-helper-color",zt.colorOnSurfaceMedium),optionsColor:Et.extend("--ft-select-options-color",zt.colorOnSurface),optionsZIndex:Et.create("--ft-select-options-z-index","NUMBER","2"),colorSurface:Et.external(zt.colorSurface,"Design system"),colorOnSurfaceDisabled:Et.external(zt.colorOnSurfaceDisabled,"Design system"),colorPrimary:Et.external(zt.colorPrimary,"Design system"),borderRadiusS:Et.external(zt.borderRadiusS,"Design system"),elevation02:Et.external(zt.elevation02,"Design system")};let ki=class extends Nt{constructor(){super(...arguments),this.label="",this.helper="",this.outlined=!1,this.disabled=!1,this.options=[],this.optionsDisplayed=!1,this.focusOptions=!1,this.hideOptions=t=>this.optionsDisplayed=this.optionsDisplayed&&t.composedPath().includes(this.container)}getStyles(){return[Le,Pe,s`
|
|
449
496
|
*:focus {
|
|
450
497
|
outline: none;
|
|
451
498
|
}
|
|
@@ -471,13 +518,14 @@ const xi=s`:host{font-family:var(--mdc-icon-font, "Material Icons");font-weight:
|
|
|
471
518
|
padding-left: 16px;
|
|
472
519
|
padding-right: 8px;
|
|
473
520
|
gap: 8px;
|
|
521
|
+
color: ${Si.selectedOptionColor};
|
|
522
|
+
${Rt(bi.color,Si.selectedOptionColor)};
|
|
474
523
|
}
|
|
475
524
|
|
|
476
525
|
.ft-select--input-panel,
|
|
477
526
|
.ft-select--option {
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
--ft-opacity-color-content-on-surface-dragged: 0.04;
|
|
527
|
+
${Rt(bi.opacityContentOnSurfaceHover,"0.08")};
|
|
528
|
+
${Rt(bi.opacityContentOnSurfaceDragged,"0.04")};
|
|
481
529
|
}
|
|
482
530
|
|
|
483
531
|
.ft-select--disabled .ft-select--input-panel,
|
|
@@ -542,6 +590,7 @@ const xi=s`:host{font-family:var(--mdc-icon-font, "Material Icons");font-weight:
|
|
|
542
590
|
top: 100%;
|
|
543
591
|
left: 0;
|
|
544
592
|
right: 0;
|
|
593
|
+
color: ${Si.optionsColor};
|
|
545
594
|
background: ${Si.colorSurface};
|
|
546
595
|
z-index: ${Si.optionsZIndex};
|
|
547
596
|
box-shadow: ${Si.elevation02};
|
|
@@ -575,14 +624,12 @@ const xi=s`:host{font-family:var(--mdc-icon-font, "Material Icons");font-weight:
|
|
|
575
624
|
<div class="ft-select--input-panel"
|
|
576
625
|
part="selected-value"
|
|
577
626
|
tabindex="${s?"-1":"0"}"
|
|
578
|
-
@click=${()=>this.optionsDisplayed=!this.optionsDisplayed}
|
|
627
|
+
@click=${()=>{this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=this.optionsDisplayed}}
|
|
579
628
|
@keydown=${this.onMainPanelKeyDown}
|
|
580
629
|
aria-label="${this.label}"
|
|
581
630
|
aria-haspopup="listbox"
|
|
582
631
|
aria-expanded="${n}">
|
|
583
|
-
|
|
584
|
-
<ft-ripple ?disabled=${s} activated></ft-ripple>
|
|
585
|
-
`}
|
|
632
|
+
<ft-ripple ?disabled=${s} ?activated=${!this.outlined}></ft-ripple>
|
|
586
633
|
<ft-typography variant="body1" class="ft-select--selected-option">
|
|
587
634
|
${null!=(null===(i=this.selectedOption)||void 0===i?void 0:i.value)&&null!==(o=null===(r=this.selectedOption)||void 0===r?void 0:r.label)&&void 0!==o?o:""}
|
|
588
635
|
</ft-typography>
|
|
@@ -736,10 +783,429 @@ const xi=s`:host{font-family:var(--mdc-icon-font, "Material Icons");font-weight:
|
|
|
736
783
|
<ft-typography class="ft-text-field--helper-text" variant="caption">${this.helper}
|
|
737
784
|
</ft-typography>`:void 0}
|
|
738
785
|
</div>
|
|
739
|
-
`}updated(t){super.updated(t),t.has("value")&&this.dispatchEvent(new CustomEvent("live-change",{detail:this.value}))}updateValueFromInputField(){var t;this.value=(null===(t=this.input)||void 0===t?void 0:t.value)||"",this.dispatchEvent(new CustomEvent("change",{detail:this.value}))}liveUpdateValueFromInputField(){var t;this.value=(null===(t=this.input)||void 0===t?void 0:t.value)||""}};Ri.elementDefinitions={"ft-input-label":Ge,"ft-ripple":gi,"ft-typography":Ze},Ci([nt({type:String})],Ri.prototype,"label",void 0),Ci([nt({reflect:!0})],Ri.prototype,"value",void 0),Ci([nt({type:String})],Ri.prototype,"helper",void 0),Ci([nt({type:Boolean})],Ri.prototype,"outlined",void 0),Ci([nt({type:Boolean})],Ri.prototype,"disabled",void 0),Ci([lt(".ft-text-field--input")],Ri.prototype,"input",void 0),Ci([nt({attribute:!1})],Ri.prototype,"dataList",void 0),Ci([st()],Ri.prototype,"focused",void 0),Ri=Ci([Ct("ft-text-field")],Ri);var zi=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const Ni=Et.create("--ft-tooltip-distance","SIZE","4px"),Fi=Et.create("--ft-tooltip-color","COLOR","#FFFFFF"),Ai=Et.create("--ft-tooltip-background-color","COLOR","#666666"),Ti=Et.create("--ft-tooltip-z-index","NUMBER","1"),Mi=Et.external(zt.borderRadiusS,"Design system");let ji=class extends Nt{constructor(){super(...arguments),this.text="",this.manual=!1,this.inline=!1,this.delay=500,this.position="bottom",this.visible=!1,this.hideDebounce=new kt,this.revealDebouncer=new kt}getStyles(){return s
|
|
786
|
+
`}updated(t){super.updated(t),t.has("value")&&this.dispatchEvent(new CustomEvent("live-change",{detail:this.value}))}updateValueFromInputField(){var t;this.value=(null===(t=this.input)||void 0===t?void 0:t.value)||"",this.dispatchEvent(new CustomEvent("change",{detail:this.value}))}liveUpdateValueFromInputField(){var t;this.value=(null===(t=this.input)||void 0===t?void 0:t.value)||""}};Ri.elementDefinitions={"ft-input-label":Ge,"ft-ripple":gi,"ft-typography":Ze},Ci([nt({type:String})],Ri.prototype,"label",void 0),Ci([nt({reflect:!0})],Ri.prototype,"value",void 0),Ci([nt({type:String})],Ri.prototype,"helper",void 0),Ci([nt({type:Boolean})],Ri.prototype,"outlined",void 0),Ci([nt({type:Boolean})],Ri.prototype,"disabled",void 0),Ci([lt(".ft-text-field--input")],Ri.prototype,"input",void 0),Ci([nt({attribute:!1})],Ri.prototype,"dataList",void 0),Ci([st()],Ri.prototype,"focused",void 0),Ri=Ci([Ct("ft-text-field")],Ri);var zi=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const Ni=Et.create("--ft-tooltip-distance","SIZE","4px"),Fi=Et.create("--ft-tooltip-color","COLOR","#FFFFFF"),Ai=Et.create("--ft-tooltip-background-color","COLOR","#666666"),Ti=Et.create("--ft-tooltip-z-index","NUMBER","1"),Mi=Et.external(zt.borderRadiusS,"Design system");let ji=class extends Nt{constructor(){super(...arguments),this.text="",this.manual=!1,this.inline=!1,this.delay=500,this.position="bottom",this.visible=!1,this.hideDebounce=new kt,this.revealDebouncer=new kt}getStyles(){return s`
|
|
787
|
+
.ft-tooltip--container {
|
|
788
|
+
display: block;
|
|
789
|
+
position: relative;
|
|
790
|
+
}
|
|
791
|
+
|
|
792
|
+
.ft-tooltip--inline {
|
|
793
|
+
display: inline-block;
|
|
794
|
+
max-width: 100%;
|
|
795
|
+
}
|
|
796
|
+
|
|
797
|
+
.ft-tooltip {
|
|
798
|
+
position: absolute;
|
|
799
|
+
box-sizing: border-box;
|
|
800
|
+
overflow: hidden;
|
|
801
|
+
width: max-content;
|
|
802
|
+
max-width: 150px;
|
|
803
|
+
text-align: center;
|
|
804
|
+
padding: ${Ni};
|
|
805
|
+
z-index: ${Ti};
|
|
806
|
+
}
|
|
807
|
+
|
|
808
|
+
.ft-tooltip--content {
|
|
809
|
+
padding: 4px 8px;
|
|
810
|
+
border-radius: ${Mi};
|
|
811
|
+
background-color: ${Ai};
|
|
812
|
+
color: ${Fi};
|
|
813
|
+
top: -500px;
|
|
814
|
+
left: -500px;
|
|
815
|
+
position: relative;
|
|
816
|
+
word-break: break-word;
|
|
817
|
+
}
|
|
818
|
+
`}getTemplate(){return j`
|
|
819
|
+
<div part="container"
|
|
820
|
+
class="ft-tooltip--container ${this.inline?"ft-tooltip--inline":""}"
|
|
821
|
+
@mouseenter=${this.onHover}
|
|
822
|
+
@mouseleave=${this.onOut}
|
|
823
|
+
@focusin=${this.onHover}
|
|
824
|
+
@focusout=${this.onOut}
|
|
825
|
+
@touchstart=${this.onTouch}>
|
|
826
|
+
<div part="tooltip" class="ft-tooltip ft-tooltip--${this.position}" ?hidden=${!this.visible}>
|
|
827
|
+
<div part="tooltip-content" class="ft-tooltip--content">
|
|
828
|
+
<ft-typography variant="caption">${this.text}</ft-typography>
|
|
829
|
+
</div>
|
|
830
|
+
</div>
|
|
831
|
+
<slot></slot>
|
|
832
|
+
</div>
|
|
833
|
+
`}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){t.has("visible")&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.position){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const e=t.getBoundingClientRect(),i=(e.height-this.tooltip.clientHeight)/2,r=(e.width-this.tooltip.clientWidth)/2,o=this.tooltip.style;switch(this.position){case"top":o.top=-this.tooltip.clientHeight+"px",o.left=r+"px";break;case"bottom":o.top=e.height+"px",o.left=r+"px";break;case"left":o.top=i+"px",o.left=-this.tooltip.clientWidth+"px";break;case"right":o.top=i+"px",o.left=e.width+"px"}o.maxWidth=Math.max(e.width,150)+"px"}this.revealDebouncer.run((()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")}),this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout((()=>window.addEventListener("touchstart",(t=>{t.composedPath().includes(this.container)||this.onOut()}),{once:!0})),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}};ji.elementDefinitions={"ft-typography":Ze},zi([nt()],ji.prototype,"text",void 0),zi([nt({type:Boolean})],ji.prototype,"manual",void 0),zi([nt({type:Boolean})],ji.prototype,"inline",void 0),zi([nt({type:Number})],ji.prototype,"delay",void 0),zi([nt()],ji.prototype,"position",void 0),zi([
|
|
740
834
|
/**
|
|
741
835
|
* @license
|
|
742
836
|
* Copyright 2017 Google LLC
|
|
743
837
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
744
838
|
*/
|
|
745
|
-
function(t,e,i){let r,o=t;return"object"==typeof t?(o=t.slot,r=t):r={flatten:e},i?function(t){const{slot:e,selector:i}=null!=t?t:{};return at({descriptor:r=>({get(){var r;const o="slot"+(e?`[name=${e}]`:":not([name])"),n=null===(r=this.renderRoot)||void 0===r?void 0:r.querySelector(o),s=null!=n?pt(n,t):[];return i?s.filter((t=>t.matches(i))):s},enumerable:!0,configurable:!0})})}({slot:o,flatten:e,selector:i}):at({descriptor:t=>({get(){var t,e;const i="slot"+(o?`[name=${o}]`:":not([name])"),n=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(i);return null!==(e=null==n?void 0:n.assignedNodes(r))&&void 0!==e?e:[]},enumerable:!0,configurable:!0})})}("",!0)],ji.prototype,"slotNodes",void 0),zi([lt(".ft-tooltip--container")],ji.prototype,"container",void 0),zi([lt("slot")],ji.prototype,"target",void 0),zi([lt(".ft-tooltip")],ji.prototype,"tooltip",void 0),zi([lt(".ft-tooltip--content")],ji.prototype,"tooltipContent",void 0),zi([st()],ji.prototype,"visible",void 0),ji=zi([Ct("ft-tooltip")],ji);var Di=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const Ui={color:Et.extend("--ft-loader-color",zt.colorPrimary),size:Et.create("--ft-loader-size","SIZE","80px")};let Bi=class extends Nt{getStyles(){return s`:host{line-height:0}.ft-loader{display:inline-block;position:relative;width:${Ui.size};height:${Ui.size}}.ft-loader div{position:absolute;top:37.5%;width:25%;height:25%;border-radius:50%;background:${Ui.color};animation-timing-function:cubic-bezier(0,1,1,0)}.ft-loader div:nth-child(1){left:2.5%;animation:appear .6s infinite}.ft-loader div:nth-child(2){left:2.5%;animation:move .6s infinite}.ft-loader div:nth-child(3){left:37.5%;animation:move .6s infinite}.ft-loader div:nth-child(4){left:72.5%;animation:disappear .6s infinite}@keyframes appear{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes disappear{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes move{0%{transform:translate(0,0)}100%{transform:translate(calc(.35 * ${Ui.size}),0)}}`}getTemplate(){return j`<div class="ft-loader"><div></div><div></div><div></div><div></div></div>`}};Bi=Di([Ct("ft-loader")],Bi);var _i=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const Ii=Et.extend("--ft-button-color",zt.colorPrimary),Li={backgroundColor:Et.extend("--ft-button-background-color",zt.colorSurface),borderRadius:Et.extend("--ft-button-border-radius",zt.borderRadiusL),color:Ii,fontSize:Et.extend("--ft-button-font-size",je.fontSize),iconSize:Et.create("--ft-button-icon-size","SIZE","24px"),rippleColor:Et.extend("--ft-button-ripple-color",Ii),opacityDisabled:Et.external(zt.colorOpacityDisabled,"Design system")},Pi=Et.extend("--ft-button-primary-color",Et.extend("--ft-button-color",zt.colorOnPrimary)),Hi=Et.extend("--ft-button-primary-background-color",Et.extend("--ft-button-background-color",zt.colorPrimary)),Vi=Pi,Wi=(Et.extend("--ft-button-primary-ripple-color",Pi),Et.extend("--ft-button-dense-border-radius",Et.extend("--ft-button-border-radius",zt.borderRadiusM)));let Zi=class extends Nt{constructor(){super(...arguments),this.primary=!1,this.outlined=!1,this.disabled=!1,this.dense=!1,this.round=!1,this.label="",this.icon=void 0,this.trailingIcon=!1,this.loading=!1,this.tooltipPosition="bottom",this.onclick=t=>{this.isDisabled()&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}}getStyles(){return[Ft,s`:host{display:inline-block;max-width:100%}button{box-shadow:0 0 0 transparent;border:0 solid transparent;text-shadow:0 0 0 transparent}button:hover{box-shadow:0 0 0 transparent;border:0 solid transparent;text-shadow:0 0 0 transparent}button:active{outline:0;border:none}button:focus{outline:0}.ft-button{position:relative;display:flex;justify-content:center;align-items:center;width:100%;overflow:hidden;box-sizing:border-box;border:none;--ft-button-internal-font-size:${Li.fontSize}--ft-button-internal-line-height:calc(var(--ft-button-internal-font-size) + 2px);--ft-button-internal-color:${Li.color}--mdc-icon-size:${Li.iconSize}--ft-button-internal-vertical-padding:6px;--ft-button-internal-horizontal-padding:8px;${Rt(bi.color,Li.rippleColor)}--ft-button-internal-content-height:max(var(--ft-button-internal-line-height), var(--mdc-icon-size));border-radius:${Li.borderRadius};padding:var(--ft-button-internal-vertical-padding) var(--ft-button-internal-horizontal-padding);background-color:${Li.backgroundColor};color:var(--ft-button-internal-color);-webkit-mask-image:radial-gradient(white,#000)}.ft-button:not([disabled]):hover{cursor:pointer}.ft-button--dense{--ft-button-internal-vertical-padding:2px;--ft-button-internal-horizontal-padding:4px;border-radius:${Wi}}.ft-button--round{border-radius:calc(var(--ft-button-internal-content-height)/ 2 + var(--ft-button-internal-vertical-padding))}.ft-button[disabled]{filter:grayscale(1);opacity:${Li.opacityDisabled}}.ft-button.ft-button--primary{background-color:${Hi};--ft-button-internal-color:${Vi}}.ft-button.ft-button--outlined{border:1px solid var(--ft-button-internal-color);padding:calc(var(--ft-button-internal-vertical-padding) - 1px) calc(var(--ft-button-internal-horizontal-padding) - 1px)}.ft-button:focus{outline:0}.ft-button--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;margin:0 var(--ft-button-internal-horizontal-padding);${Rt(je.fontSize,"var(--ft-button-internal-font-size)")}${Rt(je.lineHeight,"var(--ft-button-internal-content-height)")}}.ft-button--safari-fix .ft-button--label{margin-right:0}.ft-button--safari-fix .ft-button--label:after{content:"\\0000a0";display:inline-block;width:0}.ft-button--label[hidden]{display:none}mwc-icon{flex-shrink:0;width:var(--mdc-icon-size)}.ft-button--label[hidden]+mwc-icon{margin:0 calc(var(--ft-button-internal-horizontal-padding) * -1);padding:0 var(--ft-button-internal-vertical-padding)}.ft-button:not(.ft-button--trailing-icon) ft-loader,.ft-button:not(.ft-button--trailing-icon) mwc-icon{order:-1}ft-loader{${Rt(Ui.size,Li.iconSize)}${Rt(Ui.color,"var(--ft-button-internal-color)")}}`]}getTemplate(){const t={"ft-button":!0,"ft-button--primary":this.primary,"ft-button--outlined":this.outlined,"ft-button--dense":this.dense,"ft-button--round":this.round,"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-button--safari-fix":jt,"ft-no-text-select":!0};return this.addTooltip(j`<button class="${Dt(t)}" aria-label="${this.getLabel()}" ?disabled="${this.isDisabled()}"><ft-ripple ?disabled="${this.isDisabled()}"></ft-ripple><ft-typography variant="button" class="ft-button--label" ?hidden="${!this.hasTextContent()}"><slot @slotchange="${this.onSlotchange}"></slot></ft-typography>${this.resolveIcon()}</button>`)}addTooltip(t){return this.hasTextContent()||0===this.getLabel().trim().length?t:j`<ft-tooltip text="${this.getLabel()}" position="${this.tooltipPosition}">${t}</ft-tooltip>`}resolveIcon(){return this.loading?j`<ft-loader></ft-loader>`:this.icon?j`<mwc-icon>${this.icon}</mwc-icon>`:U}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){var t,e;return null!==(e=null===(t=this.slottedContent)||void 0===t?void 0:t.assignedNodes().map((t=>t.textContent)).join("").trim())&&void 0!==e?e:""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}};Zi.elementDefinitions={"ft-ripple":gi,"ft-tooltip":ji,"ft-typography":Ze,"mwc-icon":wi,"ft-loader":Bi},_i([nt({type:Boolean})],Zi.prototype,"primary",void 0),_i([nt({type:Boolean})],Zi.prototype,"outlined",void 0),_i([nt({type:Boolean})],Zi.prototype,"disabled",void 0),_i([nt({type:Boolean})],Zi.prototype,"dense",void 0),_i([nt({type:Boolean})],Zi.prototype,"round",void 0),_i([nt({type:String})],Zi.prototype,"label",void 0),_i([nt({type:String})],Zi.prototype,"icon",void 0),_i([nt({type:Boolean})],Zi.prototype,"trailingIcon",void 0),_i([nt({type:Boolean})],Zi.prototype,"loading",void 0),_i([nt({type:String})],Zi.prototype,"tooltipPosition",void 0),_i([lt(".ft-button")],Zi.prototype,"button",void 0),_i([lt(".ft-button--label slot")],Zi.prototype,"slottedContent",void 0),Zi=_i([Ct("ft-button")],Zi);var Ki=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};class qi extends CustomEvent{constructor(t){super("row-click",{detail:t})}}const Gi={headerBackground:Et.create("--ft-filterable-table-header-background","COLOR","whitesmoke"),oddRowBackground:Et.create("--ft-filterable-table-odd-row-background","COLOR","#FFFFFF"),evenRowBackground:Et.create("--ft-filterable-table-even-row-background","COLOR","#fdfdfd"),rowHoverBackground:Et.create("--ft-filterable-table-row-hover-background","COLOR","#fafafa"),colorOnSurfaceHigh:Et.external(zt.colorOnSurfaceHigh,"Design system"),titleFont:Et.external(zt.titleFont,"Design system"),contentFont:Et.external(zt.contentFont,"Design system")},Xi=t=>j`${t}`,Ji=(t,e)=>t-e;t.FtFilterableTable=class extends Nt{constructor(){super(...arguments),this.data=[],this.columns=[],this.filters=[],this.selectData=[]}getStyles(){return s`:host{display:block}.table{display:grid;grid-template-columns:repeat(${this.columns.length},minmax(min-content,auto))}.header,.row{display:contents}.header-cell{display:flex;flex-direction:column;background:${Gi.headerBackground};color:${Gi.colorOnSurfaceHigh};padding:.5rem 1rem;font-family:${Gi.titleFont}}.header-cell:first-of-type{border-radius:.5rem 0 0 0}.header-cell:last-of-type{border-radius:0 .5rem 0 0}.column-title-container{display:flex;align-items:center}.column-title-container ft-button{${Rt(Li.backgroundColor,Gi.headerBackground)}${Rt(Li.color,Gi.colorOnSurfaceHigh)}}.column-title{white-space:nowrap;text-transform:uppercase;margin-right:.5rem}.column-filter{flex-grow:1;flex-shrink:0}.column-filter:not(:empty){padding-top:.5rem}.column-filter ft-select,.column-filter ft-text-field{width:150px;min-width:100%}.cell{padding:1rem;border-left:1px solid ${Gi.headerBackground};border-bottom:1px solid ${Gi.headerBackground};overflow-x:auto;display:flex;align-items:center;font-family:${Gi.contentFont}}.row:nth-child(2n)>.cell{background:${Gi.oddRowBackground}}.row:nth-child(2n+1)>.cell{background:${Gi.evenRowBackground}}.row:hover>.cell{background:${Gi.rowHoverBackground}}.cell:last-of-type{border-right:1px solid ${Gi.headerBackground}}.row:last-of-type .cell:first-of-type{border-radius:0 0 0 .5rem}.row:last-of-type .cell:last-of-type{border-radius:0 0 .5rem 0}.hidden{visibility:hidden}`}init(t,e,i){this.data=t,this.columns=e,this.sort=i}getTemplate(){let t=this.sortData(this.filterData());return j`<div class="table"><div class="header">${$t(this.columns,((t,e)=>"header-cell-"+e),((t,e)=>this.renderHeader(t,e)))}</div>${$t(t,((t,e)=>"row-"+e),((t,e)=>j`<div class="row" @click="${()=>this.dispatchEvent(new qi(t))}">${$t(this.columns,((t,i)=>"cell-"+e+" "+i),(i=>this.renderCell(i,t,e)))}</div>`))}</div>`}filterData(){let t=[...this.data];return this.filters.forEach(((e,i)=>{var r;const o=this.columns[i];if(e)switch(null!==(r=o.filter)&&void 0!==r?r:"text"){case"text":e.value&&(t=t.filter((t=>this.getValueAsString(o,t,i).toLowerCase().includes(e.value.toLowerCase()))));break;case"select":e.value&&(t=t.filter((t=>this.getValueAsString(o,t,i)===e.value)))}})),t}sortData(t){var e;if(this.currentSort){const i=this.columns[this.currentSort.column],r=null!==(e=i.comparator)&&void 0!==e?e:Ji,o="asc"===this.currentSort.order?r:(t,e)=>-r(t,e);return t.sort(((t,e)=>o(this.getValue(i,t),this.getValue(i,e))))}return t}update(t){super.update(t),t.has("sort")&&(this.currentSort=this.sort),(t.has("data")||t.has("columns"))&&this.updateSelectData()}updateSelectData(){this.selectData=[];const t=this.data,e=this.columns;for(let i in e){const r=e[i];"select"===r.filter&&(this.selectData[i]=[...new Set(t.map(((t,e)=>this.getValueAsString(r,t,e))))].sort(((t,e)=>t.localeCompare(e))))}this.requestUpdate()}renderHeader(t,e){return j`<div class="header-cell"><div class="column-title-container"><span class="column-title">${t.title}</span> ${this.renderColumnSort(t,e)}</div><div class="column-filter">${this.renderColumnFilter(t,e)}</div></div>`}renderColumnSort(t,e){var i;const r=this.currentSort&&this.currentSort.column===e,o=r?"asc"===this.currentSort.order?"expand_more":"expand_less":"unfold_more";return j`<ft-button round dense class="${null===(i=t.sortable)||void 0===i||i?"":"hidden"}" icon="${o}" label="Sort ${t.title}" @click="${()=>{var t;r?"asc"===(null===(t=this.currentSort)||void 0===t?void 0:t.order)?this.currentSort={column:e,order:"desc"}:this.currentSort=void 0:this.currentSort={column:e,order:"asc"}}}"></ft-button>`}renderColumnFilter(t,e){var i,r;const o=t=>{this.filters[e]={value:t.detail},this.requestUpdate()};switch(null!==(i=t.filter)&&void 0!==i?i:"text"){case"text":return j`<ft-text-field label="Search ${t.title}" @live-change="${o}"></ft-text-field>`;case"select":const i=null!==(r=this.selectData[e])&&void 0!==r?r:[];return i.length?j`<ft-select label="Filter ${t.title}" @change="${o}"><ft-select-option></ft-select-option>${i.map((t=>j`<ft-select-option value="${t}" label="${t}"></ft-select-option>`))}</ft-select>`:null}return null}renderCell(t,e,i){var r;const o=null!==(r=t.render)&&void 0!==r?r:Xi;return j`<div class="cell">${(t=>{const e=o(t,i);return"string"==typeof e?St(e):e})(this.getValue(t,e))}</div>`}getValue(t,e){return"string"==typeof t.getter?e[t.getter]:t.getter(e)}getValueAsString(t,e,i){const r=this.getValue(t,e);return"function"==typeof t.stringify?t.stringify(r,i):(t=>""+t)(r)}},t.FtFilterableTable.elementDefinitions={"ft-button":Zi,"ft-select":ki,"ft-select-option":Oi,"ft-text-field":Ri},Ki([nt({attribute:!1})],t.FtFilterableTable.prototype,"data",void 0),Ki([nt({attribute:!1})],t.FtFilterableTable.prototype,"columns",void 0),Ki([nt({attribute:!1})],t.FtFilterableTable.prototype,"sort",void 0),Ki([st()],t.FtFilterableTable.prototype,"currentSort",void 0),t.FtFilterableTable=Ki([Ct("ft-filterable-table")],t.FtFilterableTable),t.FtFilterableTableCssVariables=Gi,t.RowClickEvent=qi,Object.defineProperty(t,"t",{value:!0})}({});
|
|
839
|
+
function(t,e,i){let r,o=t;return"object"==typeof t?(o=t.slot,r=t):r={flatten:e},i?function(t){const{slot:e,selector:i}=null!=t?t:{};return at({descriptor:r=>({get(){var r;const o="slot"+(e?`[name=${e}]`:":not([name])"),n=null===(r=this.renderRoot)||void 0===r?void 0:r.querySelector(o),s=null!=n?pt(n,t):[];return i?s.filter((t=>t.matches(i))):s},enumerable:!0,configurable:!0})})}({slot:o,flatten:e,selector:i}):at({descriptor:t=>({get(){var t,e;const i="slot"+(o?`[name=${o}]`:":not([name])"),n=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(i);return null!==(e=null==n?void 0:n.assignedNodes(r))&&void 0!==e?e:[]},enumerable:!0,configurable:!0})})}("",!0)],ji.prototype,"slotNodes",void 0),zi([lt(".ft-tooltip--container")],ji.prototype,"container",void 0),zi([lt("slot")],ji.prototype,"target",void 0),zi([lt(".ft-tooltip")],ji.prototype,"tooltip",void 0),zi([lt(".ft-tooltip--content")],ji.prototype,"tooltipContent",void 0),zi([st()],ji.prototype,"visible",void 0),ji=zi([Ct("ft-tooltip")],ji);var Di=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const Ui={color:Et.extend("--ft-loader-color",zt.colorPrimary),size:Et.create("--ft-loader-size","SIZE","80px")};let Bi=class extends Nt{getStyles(){return s`
|
|
840
|
+
:host {
|
|
841
|
+
line-height: 0;
|
|
842
|
+
}
|
|
843
|
+
|
|
844
|
+
.ft-loader {
|
|
845
|
+
display: inline-block;
|
|
846
|
+
position: relative;
|
|
847
|
+
|
|
848
|
+
width: ${Ui.size};
|
|
849
|
+
height: ${Ui.size};
|
|
850
|
+
}
|
|
851
|
+
|
|
852
|
+
.ft-loader div {
|
|
853
|
+
position: absolute;
|
|
854
|
+
top: 37.5%;
|
|
855
|
+
width: 25%;
|
|
856
|
+
height: 25%;
|
|
857
|
+
border-radius: 50%;
|
|
858
|
+
background: ${Ui.color};
|
|
859
|
+
animation-timing-function: cubic-bezier(0, 1, 1, 0);
|
|
860
|
+
}
|
|
861
|
+
|
|
862
|
+
.ft-loader div:nth-child(1) {
|
|
863
|
+
left: 2.5%;
|
|
864
|
+
animation: appear 0.6s infinite;
|
|
865
|
+
}
|
|
866
|
+
|
|
867
|
+
.ft-loader div:nth-child(2) {
|
|
868
|
+
left: 2.5%;
|
|
869
|
+
animation: move 0.6s infinite;
|
|
870
|
+
}
|
|
871
|
+
|
|
872
|
+
.ft-loader div:nth-child(3) {
|
|
873
|
+
left: 37.5%;
|
|
874
|
+
animation: move 0.6s infinite;
|
|
875
|
+
}
|
|
876
|
+
|
|
877
|
+
.ft-loader div:nth-child(4) {
|
|
878
|
+
left: 72.5%;
|
|
879
|
+
animation: disappear 0.6s infinite;
|
|
880
|
+
}
|
|
881
|
+
|
|
882
|
+
@keyframes appear {
|
|
883
|
+
0% {
|
|
884
|
+
transform: scale(0);
|
|
885
|
+
}
|
|
886
|
+
100% {
|
|
887
|
+
transform: scale(1);
|
|
888
|
+
}
|
|
889
|
+
}
|
|
890
|
+
|
|
891
|
+
@keyframes disappear {
|
|
892
|
+
0% {
|
|
893
|
+
transform: scale(1);
|
|
894
|
+
}
|
|
895
|
+
100% {
|
|
896
|
+
transform: scale(0);
|
|
897
|
+
}
|
|
898
|
+
}
|
|
899
|
+
|
|
900
|
+
@keyframes move {
|
|
901
|
+
0% {
|
|
902
|
+
transform: translate(0, 0);
|
|
903
|
+
}
|
|
904
|
+
100% {
|
|
905
|
+
transform: translate(calc(0.35 * ${Ui.size}), 0);
|
|
906
|
+
}
|
|
907
|
+
}
|
|
908
|
+
`}getTemplate(){return j`
|
|
909
|
+
<div class="ft-loader">
|
|
910
|
+
<div></div>
|
|
911
|
+
<div></div>
|
|
912
|
+
<div></div>
|
|
913
|
+
<div></div>
|
|
914
|
+
</div>
|
|
915
|
+
`}};Bi=Di([Ct("ft-loader")],Bi);var _i=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};const Ii=Et.extend("--ft-button-color",zt.colorPrimary),Li={backgroundColor:Et.extend("--ft-button-background-color",zt.colorSurface),borderRadius:Et.extend("--ft-button-border-radius",zt.borderRadiusL),color:Ii,fontSize:Et.extend("--ft-button-font-size",je.fontSize),iconSize:Et.create("--ft-button-icon-size","SIZE","24px"),rippleColor:Et.extend("--ft-button-ripple-color",Ii),opacityDisabled:Et.external(zt.colorOpacityDisabled,"Design system")},Pi=Et.extend("--ft-button-primary-color",Et.extend("--ft-button-color",zt.colorOnPrimary)),Hi=Et.extend("--ft-button-primary-background-color",Et.extend("--ft-button-background-color",zt.colorPrimary)),Vi=Pi,Wi=(Et.extend("--ft-button-primary-ripple-color",Pi),Et.extend("--ft-button-dense-border-radius",Et.extend("--ft-button-border-radius",zt.borderRadiusM)));let Zi=class extends Nt{constructor(){super(...arguments),this.primary=!1,this.outlined=!1,this.disabled=!1,this.dense=!1,this.round=!1,this.label="",this.icon=void 0,this.trailingIcon=!1,this.loading=!1,this.tooltipPosition="bottom",this.onclick=t=>{this.isDisabled()&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}}getStyles(){return[Ft,s`
|
|
916
|
+
:host {
|
|
917
|
+
display: inline-block;
|
|
918
|
+
max-width: 100%;
|
|
919
|
+
}
|
|
920
|
+
|
|
921
|
+
button {
|
|
922
|
+
box-shadow: 0px 0px 0px transparent;
|
|
923
|
+
border: 0px solid transparent;
|
|
924
|
+
text-shadow: 0px 0px 0px transparent;
|
|
925
|
+
}
|
|
926
|
+
|
|
927
|
+
button:hover {
|
|
928
|
+
box-shadow: 0px 0px 0px transparent;
|
|
929
|
+
border: 0px solid transparent;
|
|
930
|
+
text-shadow: 0px 0px 0px transparent;
|
|
931
|
+
}
|
|
932
|
+
|
|
933
|
+
button:active {
|
|
934
|
+
outline: none;
|
|
935
|
+
border: none;
|
|
936
|
+
}
|
|
937
|
+
|
|
938
|
+
button:focus {
|
|
939
|
+
outline: 0;
|
|
940
|
+
}
|
|
941
|
+
|
|
942
|
+
.ft-button {
|
|
943
|
+
position: relative;
|
|
944
|
+
display: flex;
|
|
945
|
+
justify-content: center;
|
|
946
|
+
align-items: center;
|
|
947
|
+
width: 100%;
|
|
948
|
+
overflow: hidden;
|
|
949
|
+
box-sizing: border-box;
|
|
950
|
+
border: none;
|
|
951
|
+
|
|
952
|
+
--ft-button-internal-font-size: ${Li.fontSize};
|
|
953
|
+
--ft-button-internal-line-height: calc(var(--ft-button-internal-font-size) + 2px);
|
|
954
|
+
--ft-button-internal-color: ${Li.color};
|
|
955
|
+
--mdc-icon-size: ${Li.iconSize};
|
|
956
|
+
--ft-button-internal-vertical-padding: 6px;
|
|
957
|
+
--ft-button-internal-horizontal-padding: 8px;
|
|
958
|
+
${Rt(bi.color,Li.rippleColor)};
|
|
959
|
+
--ft-button-internal-content-height: max(var(--ft-button-internal-line-height), var(--mdc-icon-size));
|
|
960
|
+
|
|
961
|
+
border-radius: ${Li.borderRadius};
|
|
962
|
+
padding: var(--ft-button-internal-vertical-padding) var(--ft-button-internal-horizontal-padding);
|
|
963
|
+
background-color: ${Li.backgroundColor};
|
|
964
|
+
color: var(--ft-button-internal-color);
|
|
965
|
+
-webkit-mask-image: radial-gradient(white, black);
|
|
966
|
+
}
|
|
967
|
+
|
|
968
|
+
.ft-button:not([disabled]):hover {
|
|
969
|
+
cursor: pointer;
|
|
970
|
+
}
|
|
971
|
+
|
|
972
|
+
.ft-button--dense {
|
|
973
|
+
--ft-button-internal-vertical-padding: 2px;
|
|
974
|
+
--ft-button-internal-horizontal-padding: 4px;
|
|
975
|
+
border-radius: ${Wi};
|
|
976
|
+
}
|
|
977
|
+
|
|
978
|
+
.ft-button--round {
|
|
979
|
+
border-radius: calc(var(--ft-button-internal-content-height) / 2 + var(--ft-button-internal-vertical-padding));
|
|
980
|
+
}
|
|
981
|
+
|
|
982
|
+
.ft-button[disabled] {
|
|
983
|
+
filter: grayscale(1);
|
|
984
|
+
opacity: ${Li.opacityDisabled};
|
|
985
|
+
}
|
|
986
|
+
|
|
987
|
+
.ft-button.ft-button--primary {
|
|
988
|
+
background-color: ${Hi};
|
|
989
|
+
--ft-button-internal-color: ${Vi};
|
|
990
|
+
}
|
|
991
|
+
|
|
992
|
+
.ft-button.ft-button--outlined {
|
|
993
|
+
border: 1px solid var(--ft-button-internal-color);
|
|
994
|
+
padding: calc(var(--ft-button-internal-vertical-padding) - 1px) calc(var(--ft-button-internal-horizontal-padding) - 1px);
|
|
995
|
+
}
|
|
996
|
+
|
|
997
|
+
.ft-button:focus {
|
|
998
|
+
outline: none;
|
|
999
|
+
}
|
|
1000
|
+
|
|
1001
|
+
.ft-button--label {
|
|
1002
|
+
overflow: hidden;
|
|
1003
|
+
white-space: nowrap;
|
|
1004
|
+
text-overflow: ellipsis;
|
|
1005
|
+
display: block;
|
|
1006
|
+
margin: 0 var(--ft-button-internal-horizontal-padding);
|
|
1007
|
+
${Rt(je.fontSize,"var(--ft-button-internal-font-size)")};
|
|
1008
|
+
${Rt(je.lineHeight,"var(--ft-button-internal-content-height)")};
|
|
1009
|
+
}
|
|
1010
|
+
|
|
1011
|
+
.ft-button--safari-fix .ft-button--label {
|
|
1012
|
+
margin-right: 0;
|
|
1013
|
+
}
|
|
1014
|
+
|
|
1015
|
+
.ft-button--safari-fix .ft-button--label:after {
|
|
1016
|
+
content: "\\0000a0";
|
|
1017
|
+
display: inline-block;
|
|
1018
|
+
width: 0;
|
|
1019
|
+
}
|
|
1020
|
+
|
|
1021
|
+
.ft-button--label[hidden] {
|
|
1022
|
+
display: none;
|
|
1023
|
+
}
|
|
1024
|
+
|
|
1025
|
+
mwc-icon {
|
|
1026
|
+
flex-shrink: 0;
|
|
1027
|
+
width: var(--mdc-icon-size);
|
|
1028
|
+
}
|
|
1029
|
+
|
|
1030
|
+
.ft-button--label[hidden] + mwc-icon {
|
|
1031
|
+
margin: 0 calc(var(--ft-button-internal-horizontal-padding) * -1);
|
|
1032
|
+
padding: 0 var(--ft-button-internal-vertical-padding);
|
|
1033
|
+
}
|
|
1034
|
+
|
|
1035
|
+
.ft-button:not(.ft-button--trailing-icon) mwc-icon,
|
|
1036
|
+
.ft-button:not(.ft-button--trailing-icon) ft-loader {
|
|
1037
|
+
order: -1;
|
|
1038
|
+
}
|
|
1039
|
+
|
|
1040
|
+
ft-loader {
|
|
1041
|
+
${Rt(Ui.size,Li.iconSize)};
|
|
1042
|
+
${Rt(Ui.color,"var(--ft-button-internal-color)")};
|
|
1043
|
+
}
|
|
1044
|
+
`]}getTemplate(){const t={"ft-button":!0,"ft-button--primary":this.primary,"ft-button--outlined":this.outlined,"ft-button--dense":this.dense,"ft-button--round":this.round,"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-button--safari-fix":jt,"ft-no-text-select":!0};return this.addTooltip(j`
|
|
1045
|
+
<button part="button"
|
|
1046
|
+
class="${Dt(t)}"
|
|
1047
|
+
aria-label="${this.getLabel()}"
|
|
1048
|
+
?disabled=${this.isDisabled()}>
|
|
1049
|
+
<ft-ripple part="ripple" ?disabled=${this.isDisabled()}></ft-ripple>
|
|
1050
|
+
<ft-typography part="label"
|
|
1051
|
+
variant="button"
|
|
1052
|
+
class="ft-button--label"
|
|
1053
|
+
?hidden=${!this.hasTextContent()}>
|
|
1054
|
+
<slot @slotchange=${this.onSlotchange}></slot>
|
|
1055
|
+
</ft-typography>
|
|
1056
|
+
${this.resolveIcon()}
|
|
1057
|
+
</button>
|
|
1058
|
+
`)}addTooltip(t){return this.hasTextContent()||0===this.getLabel().trim().length?t:j`
|
|
1059
|
+
<ft-tooltip part="tooltip"
|
|
1060
|
+
text="${this.getLabel()}"
|
|
1061
|
+
position="${this.tooltipPosition}">
|
|
1062
|
+
${t}
|
|
1063
|
+
</ft-tooltip>
|
|
1064
|
+
`}resolveIcon(){return this.loading?j`
|
|
1065
|
+
<ft-loader></ft-loader> `:this.icon?j`
|
|
1066
|
+
<mwc-icon>${this.icon}</mwc-icon> `:U}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){var t,e;return null!==(e=null===(t=this.slottedContent)||void 0===t?void 0:t.assignedNodes().map((t=>t.textContent)).join("").trim())&&void 0!==e?e:""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}};Zi.elementDefinitions={"ft-ripple":gi,"ft-tooltip":ji,"ft-typography":Ze,"mwc-icon":wi,"ft-loader":Bi},_i([nt({type:Boolean})],Zi.prototype,"primary",void 0),_i([nt({type:Boolean})],Zi.prototype,"outlined",void 0),_i([nt({type:Boolean})],Zi.prototype,"disabled",void 0),_i([nt({type:Boolean})],Zi.prototype,"dense",void 0),_i([nt({type:Boolean})],Zi.prototype,"round",void 0),_i([nt({type:String})],Zi.prototype,"label",void 0),_i([nt({type:String})],Zi.prototype,"icon",void 0),_i([nt({type:Boolean})],Zi.prototype,"trailingIcon",void 0),_i([nt({type:Boolean})],Zi.prototype,"loading",void 0),_i([nt({type:String})],Zi.prototype,"tooltipPosition",void 0),_i([lt(".ft-button")],Zi.prototype,"button",void 0),_i([lt(".ft-button--label slot")],Zi.prototype,"slottedContent",void 0),Zi=_i([Ct("ft-button")],Zi);var Ki=function(t,e,i,r){for(var o,n=arguments.length,s=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(n<3?o(s):n>3?o(e,i,s):o(e,i))||s);return n>3&&s&&Object.defineProperty(e,i,s),s};class qi extends CustomEvent{constructor(t){super("row-click",{detail:t})}}const Gi={headerBackground:Et.create("--ft-filterable-table-header-background","COLOR","whitesmoke"),oddRowBackground:Et.create("--ft-filterable-table-odd-row-background","COLOR","#FFFFFF"),evenRowBackground:Et.create("--ft-filterable-table-even-row-background","COLOR","#fdfdfd"),rowHoverBackground:Et.create("--ft-filterable-table-row-hover-background","COLOR","#fafafa"),colorOnSurfaceHigh:Et.external(zt.colorOnSurfaceHigh,"Design system"),titleFont:Et.external(zt.titleFont,"Design system"),contentFont:Et.external(zt.contentFont,"Design system")},Xi=t=>j`${t}`,Ji=(t,e)=>t-e;t.FtFilterableTable=class extends Nt{constructor(){super(...arguments),this.data=[],this.columns=[],this.filters=[],this.selectData=[]}getStyles(){return s`
|
|
1067
|
+
:host {
|
|
1068
|
+
display: block;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.table {
|
|
1072
|
+
display: grid;
|
|
1073
|
+
grid-template-columns: repeat(${this.columns.length}, minmax(min-content, auto));
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.header, .row {
|
|
1077
|
+
display: contents;
|
|
1078
|
+
}
|
|
1079
|
+
|
|
1080
|
+
.header-cell {
|
|
1081
|
+
display: flex;
|
|
1082
|
+
flex-direction: column;
|
|
1083
|
+
background: ${Gi.headerBackground};
|
|
1084
|
+
color: ${Gi.colorOnSurfaceHigh};
|
|
1085
|
+
padding: .5rem 1rem;
|
|
1086
|
+
font-family: ${Gi.titleFont};
|
|
1087
|
+
}
|
|
1088
|
+
|
|
1089
|
+
.header-cell:first-of-type {
|
|
1090
|
+
border-radius: .5rem 0 0 0;
|
|
1091
|
+
}
|
|
1092
|
+
|
|
1093
|
+
.header-cell:last-of-type {
|
|
1094
|
+
border-radius: 0 .5rem 0 0;
|
|
1095
|
+
}
|
|
1096
|
+
|
|
1097
|
+
.column-title-container {
|
|
1098
|
+
display: flex;
|
|
1099
|
+
align-items: center;
|
|
1100
|
+
}
|
|
1101
|
+
|
|
1102
|
+
.column-title-container ft-button {
|
|
1103
|
+
${Rt(Li.backgroundColor,Gi.headerBackground)};
|
|
1104
|
+
${Rt(Li.color,Gi.colorOnSurfaceHigh)};
|
|
1105
|
+
}
|
|
1106
|
+
|
|
1107
|
+
.column-title {
|
|
1108
|
+
white-space: nowrap;
|
|
1109
|
+
text-transform: uppercase;
|
|
1110
|
+
margin-right: .5rem;
|
|
1111
|
+
}
|
|
1112
|
+
|
|
1113
|
+
.column-filter {
|
|
1114
|
+
flex-grow: 1;
|
|
1115
|
+
flex-shrink: 0;
|
|
1116
|
+
}
|
|
1117
|
+
|
|
1118
|
+
.column-filter:not(:empty) {
|
|
1119
|
+
padding-top: .5rem;
|
|
1120
|
+
}
|
|
1121
|
+
|
|
1122
|
+
.column-filter ft-text-field,
|
|
1123
|
+
.column-filter ft-select {
|
|
1124
|
+
width: 150px;
|
|
1125
|
+
min-width: 100%;
|
|
1126
|
+
}
|
|
1127
|
+
|
|
1128
|
+
.cell {
|
|
1129
|
+
padding: 1rem;
|
|
1130
|
+
border-left: 1px solid ${Gi.headerBackground};
|
|
1131
|
+
border-bottom: 1px solid ${Gi.headerBackground};
|
|
1132
|
+
overflow-x: auto;
|
|
1133
|
+
display: flex;
|
|
1134
|
+
align-items: center;
|
|
1135
|
+
font-family: ${Gi.contentFont};
|
|
1136
|
+
}
|
|
1137
|
+
|
|
1138
|
+
/* Even is 2n+1 and odd is 2n because of the header */
|
|
1139
|
+
.row:nth-child(2n) > .cell {
|
|
1140
|
+
background: ${Gi.oddRowBackground};
|
|
1141
|
+
}
|
|
1142
|
+
|
|
1143
|
+
.row:nth-child(2n + 1) > .cell {
|
|
1144
|
+
background: ${Gi.evenRowBackground};
|
|
1145
|
+
}
|
|
1146
|
+
|
|
1147
|
+
.row:hover > .cell {
|
|
1148
|
+
background: ${Gi.rowHoverBackground};
|
|
1149
|
+
}
|
|
1150
|
+
|
|
1151
|
+
.cell:last-of-type {
|
|
1152
|
+
border-right: 1px solid ${Gi.headerBackground};
|
|
1153
|
+
}
|
|
1154
|
+
|
|
1155
|
+
.row:last-of-type .cell:first-of-type {
|
|
1156
|
+
border-radius: 0 0 0 .5rem;
|
|
1157
|
+
}
|
|
1158
|
+
|
|
1159
|
+
.row:last-of-type .cell:last-of-type {
|
|
1160
|
+
border-radius: 0 0 .5rem 0;
|
|
1161
|
+
}
|
|
1162
|
+
|
|
1163
|
+
.hidden {
|
|
1164
|
+
visibility: hidden;
|
|
1165
|
+
}
|
|
1166
|
+
`}init(t,e,i){this.data=t,this.columns=e,this.sort=i}getTemplate(){let t=this.sortData(this.filterData());return j`
|
|
1167
|
+
<div class="table">
|
|
1168
|
+
<div class="header">
|
|
1169
|
+
${$t(this.columns,((t,e)=>"header-cell-"+e),((t,e)=>this.renderHeader(t,e)))}
|
|
1170
|
+
</div>
|
|
1171
|
+
${$t(t,((t,e)=>"row-"+e),((t,e)=>j`
|
|
1172
|
+
<div class="row"
|
|
1173
|
+
@click=${()=>this.dispatchEvent(new qi(t))}>
|
|
1174
|
+
${$t(this.columns,((t,i)=>"cell-"+e+" "+i),(i=>this.renderCell(i,t,e)))}
|
|
1175
|
+
</div>
|
|
1176
|
+
`))}
|
|
1177
|
+
</div>
|
|
1178
|
+
`}filterData(){let t=[...this.data];return this.filters.forEach(((e,i)=>{var r;const o=this.columns[i];if(e)switch(null!==(r=o.filter)&&void 0!==r?r:"text"){case"text":e.value&&(t=t.filter((t=>this.getValueAsString(o,t,i).toLowerCase().includes(e.value.toLowerCase()))));break;case"select":e.value&&(t=t.filter((t=>this.getValueAsString(o,t,i)===e.value)))}})),t}sortData(t){var e;if(this.currentSort){const i=this.columns[this.currentSort.column],r=null!==(e=i.comparator)&&void 0!==e?e:Ji,o="asc"===this.currentSort.order?r:(t,e)=>-r(t,e);return t.sort(((t,e)=>o(this.getValue(i,t),this.getValue(i,e))))}return t}update(t){super.update(t),t.has("sort")&&(this.currentSort=this.sort),(t.has("data")||t.has("columns"))&&this.updateSelectData()}updateSelectData(){this.selectData=[];const t=this.data,e=this.columns;for(let i in e){const r=e[i];"select"===r.filter&&(this.selectData[i]=[...new Set(t.map(((t,e)=>this.getValueAsString(r,t,e))))].sort(((t,e)=>t.localeCompare(e))))}this.requestUpdate()}renderHeader(t,e){return j`
|
|
1179
|
+
<div class="header-cell">
|
|
1180
|
+
<div class="column-title-container">
|
|
1181
|
+
<span class="column-title">${t.title}</span>
|
|
1182
|
+
${this.renderColumnSort(t,e)}
|
|
1183
|
+
</div>
|
|
1184
|
+
<div class="column-filter">
|
|
1185
|
+
${this.renderColumnFilter(t,e)}
|
|
1186
|
+
</div>
|
|
1187
|
+
</div>
|
|
1188
|
+
`}renderColumnSort(t,e){var i;const r=this.currentSort&&this.currentSort.column===e,o=r?"asc"===this.currentSort.order?"expand_more":"expand_less":"unfold_more";return j`
|
|
1189
|
+
<ft-button
|
|
1190
|
+
round
|
|
1191
|
+
dense
|
|
1192
|
+
class="${null===(i=t.sortable)||void 0===i||i?"":"hidden"}"
|
|
1193
|
+
icon="${o}"
|
|
1194
|
+
label="Sort ${t.title}"
|
|
1195
|
+
@click=${()=>{var t;r?"asc"===(null===(t=this.currentSort)||void 0===t?void 0:t.order)?this.currentSort={column:e,order:"desc"}:this.currentSort=void 0:this.currentSort={column:e,order:"asc"}}}
|
|
1196
|
+
></ft-button>
|
|
1197
|
+
`}renderColumnFilter(t,e){var i,r;const o=t=>{this.filters[e]={value:t.detail},this.requestUpdate()};switch(null!==(i=t.filter)&&void 0!==i?i:"text"){case"text":return j`
|
|
1198
|
+
<ft-text-field
|
|
1199
|
+
label="Search ${t.title}"
|
|
1200
|
+
@live-change="${o}"
|
|
1201
|
+
></ft-text-field>
|
|
1202
|
+
`;case"select":const i=null!==(r=this.selectData[e])&&void 0!==r?r:[];return i.length?j`
|
|
1203
|
+
<ft-select label="Filter ${t.title}" @change=${o}>
|
|
1204
|
+
<ft-select-option></ft-select-option>
|
|
1205
|
+
${i.map((t=>j`
|
|
1206
|
+
<ft-select-option value="${t}" label="${t}"></ft-select-option>
|
|
1207
|
+
`))}
|
|
1208
|
+
</ft-select>
|
|
1209
|
+
`:null}return null}renderCell(t,e,i){var r;const o=null!==(r=t.render)&&void 0!==r?r:Xi;return j`
|
|
1210
|
+
<div class="cell">${(t=>{const e=o(t,i);return"string"==typeof e?St(e):e})(this.getValue(t,e))}</div>
|
|
1211
|
+
`}getValue(t,e){return"string"==typeof t.getter?e[t.getter]:t.getter(e)}getValueAsString(t,e,i){const r=this.getValue(t,e);return"function"==typeof t.stringify?t.stringify(r,i):(t=>""+t)(r)}},t.FtFilterableTable.elementDefinitions={"ft-button":Zi,"ft-select":ki,"ft-select-option":Oi,"ft-text-field":Ri},Ki([nt({attribute:!1})],t.FtFilterableTable.prototype,"data",void 0),Ki([nt({attribute:!1})],t.FtFilterableTable.prototype,"columns",void 0),Ki([nt({attribute:!1})],t.FtFilterableTable.prototype,"sort",void 0),Ki([st()],t.FtFilterableTable.prototype,"currentSort",void 0),t.FtFilterableTable=Ki([Ct("ft-filterable-table")],t.FtFilterableTable),t.FtFilterableTableCssVariables=Gi,t.RowClickEvent=qi,Object.defineProperty(t,"t",{value:!0})}({});
|