@loadsmart/miranda-wc 1.34.0 → 1.35.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/tabs/index.d.ts +5 -0
- package/dist/components/tabs/index.d.ts.map +1 -0
- package/dist/components/tabs/tab-panel.d.ts +86 -0
- package/dist/components/tabs/tab-panel.d.ts.map +1 -0
- package/dist/components/tabs/tab-panel.styles.d.ts +3 -0
- package/dist/components/tabs/tab-panel.styles.d.ts.map +1 -0
- package/dist/components/tabs/tab.d.ts +41 -0
- package/dist/components/tabs/tab.d.ts.map +1 -0
- package/dist/components/tabs/tab.styles.d.ts +3 -0
- package/dist/components/tabs/tab.styles.d.ts.map +1 -0
- package/dist/components/tabs/tabs.constants.d.ts +2 -0
- package/dist/components/tabs/tabs.constants.d.ts.map +1 -0
- package/dist/components/tabs/tabs.context.d.ts +6 -0
- package/dist/components/tabs/tabs.context.d.ts.map +1 -0
- package/dist/components/tabs/tabs.d.ts +66 -0
- package/dist/components/tabs/tabs.d.ts.map +1 -0
- package/dist/components/tabs/tabs.styles.d.ts +3 -0
- package/dist/components/tabs/tabs.styles.d.ts.map +1 -0
- package/dist/components/tabs/tabs.types.d.ts +54 -0
- package/dist/components/tabs/tabs.types.d.ts.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +578 -465
- package/dist/index.js.map +1 -1
- package/dist/styles/focusable.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -3,7 +3,7 @@ function t(t,e,i,o){if("a"===i&&!o)throw new TypeError("Private accessor was def
|
|
|
3
3
|
* @license
|
|
4
4
|
* Copyright 2017 Google LLC
|
|
5
5
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
6
|
-
*/}var i;const o=window,r=o.trustedTypes,n=r?r.createPolicy("lit-html",{createHTML:t=>t}):void 0,s="$lit$",a=`lit$${(Math.random()+"").slice(9)}$`,l="?"+a,d=`<${l}>`,c=document,h=()=>c.createComment(""),u=t=>null===t||"object"!=typeof t&&"function"!=typeof t,
|
|
6
|
+
*/}var i;const o=window,r=o.trustedTypes,n=r?r.createPolicy("lit-html",{createHTML:t=>t}):void 0,s="$lit$",a=`lit$${(Math.random()+"").slice(9)}$`,l="?"+a,d=`<${l}>`,c=document,h=()=>c.createComment(""),u=t=>null===t||"object"!=typeof t&&"function"!=typeof t,b=Array.isArray,p="[ \t\n\f\r]",g=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,m=/-->/g,f=/>/g,$=RegExp(`>|${p}(?:([^\\s"'>=/]+)(${p}*=${p}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),y=/'/g,v=/"/g,w=/^(?:script|style|textarea|title)$/i,x=(t=>(e,...i)=>({_$litType$:t,strings:e,values:i}))(1),k=Symbol.for("lit-noChange"),z=Symbol.for("lit-nothing"),S=new WeakMap,C=c.createTreeWalker(c,129,null,!1);class W{constructor({strings:t,_$litType$:e},i){let o;this.parts=[];let c=0,u=0;const b=t.length-1,p=this.parts,[x,k]=((t,e)=>{const i=t.length-1,o=[];let r,l=2===e?"<svg>":"",c=g;for(let e=0;e<i;e++){const i=t[e];let n,h,u=-1,b=0;for(;b<i.length&&(c.lastIndex=b,h=c.exec(i),null!==h);)b=c.lastIndex,c===g?"!--"===h[1]?c=m:void 0!==h[1]?c=f:void 0!==h[2]?(w.test(h[2])&&(r=RegExp("</"+h[2],"g")),c=$):void 0!==h[3]&&(c=$):c===$?">"===h[0]?(c=null!=r?r:g,u=-1):void 0===h[1]?u=-2:(u=c.lastIndex-h[2].length,n=h[1],c=void 0===h[3]?$:'"'===h[3]?v:y):c===v||c===y?c=$:c===m||c===f?c=g:(c=$,r=void 0);const p=c===$&&t[e+1].startsWith("/>")?" ":"";l+=c===g?i+d:u>=0?(o.push(n),i.slice(0,u)+s+i.slice(u)+a+p):i+a+(-2===u?(o.push(void 0),e):p)}const h=l+(t[i]||"<?>")+(2===e?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==n?n.createHTML(h):h,o]})(t,e);if(this.el=W.createElement(x,i),C.currentNode=this.el.content,2===e){const t=this.el.content,e=t.firstChild;e.remove(),t.append(...e.childNodes)}for(;null!==(o=C.nextNode())&&p.length<b;){if(1===o.nodeType){if(o.hasAttributes()){const t=[];for(const e of o.getAttributeNames())if(e.endsWith(s)||e.startsWith(a)){const i=k[u++];if(t.push(e),void 0!==i){const t=o.getAttribute(i.toLowerCase()+s).split(a),e=/([.?@])?(.*)/.exec(i);p.push({type:1,index:c,name:e[2],strings:t,ctor:"."===e[1]?A:"?"===e[1]?_:"@"===e[1]?T:B})}else p.push({type:6,index:c})}for(const e of t)o.removeAttribute(e)}if(w.test(o.tagName)){const t=o.textContent.split(a),e=t.length-1;if(e>0){o.textContent=r?r.emptyScript:"";for(let i=0;i<e;i++)o.append(t[i],h()),C.nextNode(),p.push({type:2,index:++c});o.append(t[e],h())}}}else if(8===o.nodeType)if(o.data===l)p.push({type:2,index:c});else{let t=-1;for(;-1!==(t=o.data.indexOf(a,t+1));)p.push({type:7,index:c}),t+=a.length-1}c++}}static createElement(t,e){const i=c.createElement("template");return i.innerHTML=t,i}}function M(t,e,i=t,o){var r,n,s,a;if(e===k)return e;let l=void 0!==o?null===(r=i._$Co)||void 0===r?void 0:r[o]:i._$Cl;const d=u(e)?void 0:e._$litDirective$;return(null==l?void 0:l.constructor)!==d&&(null===(n=null==l?void 0:l._$AO)||void 0===n||n.call(l,!1),void 0===d?l=void 0:(l=new d(t),l._$AT(t,i,o)),void 0!==o?(null!==(s=(a=i)._$Co)&&void 0!==s?s:a._$Co=[])[o]=l:i._$Cl=l),void 0!==l&&(e=M(t,l._$AS(t,e.values),l,o)),e}class j{constructor(t,e,i,o){var r;this.type=2,this._$AH=z,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=o,this._$Cp=null===(r=null==o?void 0:o.isConnected)||void 0===r||r}get _$AU(){var t,e;return null!==(e=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==e?e:this._$Cp}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===(null==t?void 0:t.nodeType)&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=M(this,t,e),u(t)?t===z||null==t||""===t?(this._$AH!==z&&this._$AR(),this._$AH=z):t!==this._$AH&&t!==k&&this._(t):void 0!==t._$litType$?this.g(t):void 0!==t.nodeType?this.$(t):(t=>b(t)||"function"==typeof(null==t?void 0:t[Symbol.iterator]))(t)?this.T(t):this._(t)}k(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}$(t){this._$AH!==t&&(this._$AR(),this._$AH=this.k(t))}_(t){this._$AH!==z&&u(this._$AH)?this._$AA.nextSibling.data=t:this.$(c.createTextNode(t)),this._$AH=t}g(t){var e;const{values:i,_$litType$:o}=t,r="number"==typeof o?this._$AC(t):(void 0===o.el&&(o.el=W.createElement(o.h,this.options)),o);if((null===(e=this._$AH)||void 0===e?void 0:e._$AD)===r)this._$AH.v(i);else{const t=new class{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var e;const{el:{content:i},parts:o}=this._$AD,r=(null!==(e=null==t?void 0:t.creationScope)&&void 0!==e?e:c).importNode(i,!0);C.currentNode=r;let n=C.nextNode(),s=0,a=0,l=o[0];for(;void 0!==l;){if(s===l.index){let e;2===l.type?e=new j(n,n.nextSibling,this,t):1===l.type?e=new l.ctor(n,l.name,l.strings,this,t):6===l.type&&(e=new P(n,this,t)),this._$AV.push(e),l=o[++a]}s!==(null==l?void 0:l.index)&&(n=C.nextNode(),s++)}return C.currentNode=c,r}v(t){let e=0;for(const i of this._$AV)void 0!==i&&(void 0!==i.strings?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++}}(r,this),e=t.u(this.options);t.v(i),this.$(e),this._$AH=t}}_$AC(t){let e=S.get(t.strings);return void 0===e&&S.set(t.strings,e=new W(t)),e}T(t){b(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,o=0;for(const r of t)o===e.length?e.push(i=new j(this.k(h()),this.k(h()),this,this.options)):i=e[o],i._$AI(r),o++;o<e.length&&(this._$AR(i&&i._$AB.nextSibling,o),e.length=o)}_$AR(t=this._$AA.nextSibling,e){var i;for(null===(i=this._$AP)||void 0===i||i.call(this,!1,!0,e);t&&t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){var e;void 0===this._$AM&&(this._$Cp=t,null===(e=this._$AP)||void 0===e||e.call(this,t))}}class B{constructor(t,e,i,o,r){this.type=1,this._$AH=z,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=r,i.length>2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=z}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,e=this,i,o){const r=this.strings;let n=!1;if(void 0===r)t=M(this,t,e,0),n=!u(t)||t!==this._$AH&&t!==k,n&&(this._$AH=t);else{const o=t;let s,a;for(t=r[0],s=0;s<r.length-1;s++)a=M(this,o[i+s],e,s),a===k&&(a=this._$AH[s]),n||(n=!u(a)||a!==this._$AH[s]),a===z?t=z:t!==z&&(t+=(null!=a?a:"")+r[s+1]),this._$AH[s]=a}n&&!o&&this.j(t)}j(t){t===z?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class A extends B{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===z?void 0:t}}const E=r?r.emptyScript:"";class _ extends B{constructor(){super(...arguments),this.type=4}j(t){t&&t!==z?this.element.setAttribute(this.name,E):this.element.removeAttribute(this.name)}}class T extends B{constructor(t,e,i,o,r){super(t,e,i,o,r),this.type=5}_$AI(t,e=this){var i;if((t=null!==(i=M(this,t,e,0))&&void 0!==i?i:z)===k)return;const o=this._$AH,r=t===z&&o!==z||t.capture!==o.capture||t.once!==o.once||t.passive!==o.passive,n=t!==z&&(o===z||r);r&&this.element.removeEventListener(this.name,this,o),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e,i;"function"==typeof this._$AH?this._$AH.call(null!==(i=null===(e=this.options)||void 0===e?void 0:e.host)&&void 0!==i?i:this.element,t):this._$AH.handleEvent(t)}}class P{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){M(this,t)}}const O=o.litHtmlPolyfillSupport;null==O||O(W,j),(null!==(i=o.litHtmlVersions)&&void 0!==i?i:o.litHtmlVersions=[]).push("2.7.4");const R=Symbol.for(""),U=t=>{if((null==t?void 0:t.r)===R)return null==t?void 0:t._$litStatic$},q=(t,...e)=>({_$litStatic$:e.reduce(((e,i,o)=>e+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(i)+t[o+1]),t[0]),r:R}),D=new Map,N=(t=>(e,...i)=>{const o=i.length;let r,n;const s=[],a=[];let l,d=0,c=!1;for(;d<o;){for(l=e[d];d<o&&void 0!==(n=i[d],r=U(n));)l+=r+e[++d],c=!0;d!==o&&a.push(n),s.push(l),d++}if(d===o&&s.push(e[o]),c){const t=s.join("$$lit$$");void 0===(e=D.get(t))&&(s.raw=s,D.set(t,e=s)),i=a}return t(e,...i)})(x),L=window,G=L.ShadowRoot&&(void 0===L.ShadyCSS||L.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,I=Symbol(),V=new WeakMap;
|
|
7
7
|
/**
|
|
8
8
|
* @license
|
|
9
9
|
* Copyright 2020 Google LLC
|
|
@@ -13,55 +13,55 @@ function t(t,e,i,o){if("a"===i&&!o)throw new TypeError("Private accessor was def
|
|
|
13
13
|
* @license
|
|
14
14
|
* Copyright 2017 Google LLC
|
|
15
15
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
16
|
-
*/;var Z;const F=window,K=F.trustedTypes,Q=K?K.emptyScript:"",tt=F.reactiveElementPolyfillSupport,et={toAttribute(t,e){switch(e){case Boolean:t=t?Q:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},it=(t,e)=>e!==t&&(e==e||t==t),ot={attribute:!0,type:String,converter:et,reflect:!1,hasChanged:it};class
|
|
16
|
+
*/;var Z;const F=window,K=F.trustedTypes,Q=K?K.emptyScript:"",tt=F.reactiveElementPolyfillSupport,et={toAttribute(t,e){switch(e){case Boolean:t=t?Q:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},it=(t,e)=>e!==t&&(e==e||t==t),ot={attribute:!0,type:String,converter:et,reflect:!1,hasChanged:it},rt="finalized";class nt extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this.u()}static addInitializer(t){var e;this.finalize(),(null!==(e=this.h)&&void 0!==e?e:this.h=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((e,i)=>{const o=this._$Ep(i,e);void 0!==o&&(this._$Ev.set(o,i),t.push(o))})),t}static createProperty(t,e=ot){if(e.state&&(e.attribute=!1),this.finalize(),this.elementProperties.set(t,e),!e.noAccessor&&!this.prototype.hasOwnProperty(t)){const i="symbol"==typeof t?Symbol():"__"+t,o=this.getPropertyDescriptor(t,i,e);void 0!==o&&Object.defineProperty(this.prototype,t,o)}}static getPropertyDescriptor(t,e,i){return{get(){return this[e]},set(o){const r=this[t];this[e]=o,this.requestUpdate(t,r,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||ot}static finalize(){if(this.hasOwnProperty(rt))return!1;this[rt]=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.h&&(this.h=[...t.h]),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const i of e)this.createProperty(i,t[i])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const i=new Set(t.flat(1/0).reverse());for(const t of i)e.unshift(Y(t))}else void 0!==t&&e.push(Y(t));return e}static _$Ep(t,e){const i=e.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}u(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)))}addController(t){var e,i;(null!==(e=this._$ES)&&void 0!==e?e:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(i=t.hostConnected)||void 0===i||i.call(t))}removeController(t){var e;null===(e=this._$ES)||void 0===e||e.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t,e)=>{this.hasOwnProperty(e)&&(this._$Ei.set(e,this[e]),delete this[e])}))}createRenderRoot(){var t;const e=null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions);return((t,e)=>{G?t.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):e.forEach((e=>{const i=document.createElement("style"),o=L.litNonce;void 0!==o&&i.setAttribute("nonce",o),i.textContent=e.cssText,t.appendChild(i)}))})(e,this.constructor.elementStyles),e}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var e;return null===(e=t.hostConnected)||void 0===e?void 0:e.call(t)}))}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var e;return null===(e=t.hostDisconnected)||void 0===e?void 0:e.call(t)}))}attributeChangedCallback(t,e,i){this._$AK(t,i)}_$EO(t,e,i=ot){var o;const r=this.constructor._$Ep(t,i);if(void 0!==r&&!0===i.reflect){const n=(void 0!==(null===(o=i.converter)||void 0===o?void 0:o.toAttribute)?i.converter:et).toAttribute(e,i.type);this._$El=t,null==n?this.removeAttribute(r):this.setAttribute(r,n),this._$El=null}}_$AK(t,e){var i;const o=this.constructor,r=o._$Ev.get(t);if(void 0!==r&&this._$El!==r){const t=o.getPropertyOptions(r),n="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==(null===(i=t.converter)||void 0===i?void 0:i.fromAttribute)?t.converter:et;this._$El=r,this[r]=n.fromAttribute(e,t.type),this._$El=null}}requestUpdate(t,e,i){let o=!0;void 0!==t&&(((i=i||this.constructor.getPropertyOptions(t)).hasChanged||it)(this[t],e)?(this._$AL.has(t)||this._$AL.set(t,e),!0===i.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,i))):o=!1),!this.isUpdatePending&&o&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,e)=>this[e]=t)),this._$Ei=void 0);let e=!1;const i=this._$AL;try{e=this.shouldUpdate(i),e?(this.willUpdate(i),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var e;return null===(e=t.hostUpdate)||void 0===e?void 0:e.call(t)})),this.update(i)):this._$Ek()}catch(t){throw e=!1,this._$Ek(),t}e&&this._$AE(i)}willUpdate(t){}_$AE(t){var e;null===(e=this._$ES)||void 0===e||e.forEach((t=>{var e;return null===(e=t.hostUpdated)||void 0===e?void 0:e.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,e)=>this._$EO(e,this[e],t))),this._$EC=void 0),this._$Ek()}updated(t){}firstUpdated(t){}}
|
|
17
17
|
/**
|
|
18
18
|
* @license
|
|
19
19
|
* Copyright 2017 Google LLC
|
|
20
20
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
21
21
|
*/
|
|
22
|
-
var
|
|
22
|
+
var st,at;nt[rt]=!0,nt.elementProperties=new Map,nt.elementStyles=[],nt.shadowRootOptions={mode:"open"},null==tt||tt({ReactiveElement:nt}),(null!==(Z=F.reactiveElementVersions)&&void 0!==Z?Z:F.reactiveElementVersions=[]).push("1.6.2");let lt=class extends nt{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t,e;const i=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=i.firstChild),i}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=((t,e,i)=>{var o,r;const n=null!==(o=null==i?void 0:i.renderBefore)&&void 0!==o?o:e;let s=n._$litPart$;if(void 0===s){const t=null!==(r=null==i?void 0:i.renderBefore)&&void 0!==r?r:null;n._$litPart$=s=new j(e.insertBefore(h(),t),t,void 0,null!=i?i:{})}return s._$AI(t),s})(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!1)}render(){return k}};lt.finalized=!0,lt._$litElement$=!0,null===(st=globalThis.litElementHydrateSupport)||void 0===st||st.call(globalThis,{LitElement:lt});const dt=globalThis.litElementPolyfillSupport;null==dt||dt({LitElement:lt}),(null!==(at=globalThis.litElementVersions)&&void 0!==at?at:globalThis.litElementVersions=[]).push("3.3.2");
|
|
23
23
|
/**
|
|
24
24
|
* @license
|
|
25
25
|
* Copyright 2018 Google LLC
|
|
26
26
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
27
27
|
*/
|
|
28
|
-
const
|
|
28
|
+
const ct=t=>null!=t?t:z
|
|
29
29
|
/**
|
|
30
30
|
* @license
|
|
31
31
|
* Copyright 2017 Google LLC
|
|
32
32
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
33
|
-
*/,
|
|
33
|
+
*/,ht=1,ut=t=>(...e)=>({_$litDirective$:t,values:e});let bt=class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};
|
|
34
34
|
/**
|
|
35
35
|
* @license
|
|
36
36
|
* Copyright 2018 Google LLC
|
|
37
37
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
38
|
-
*/const gt=ht(class extends ut{constructor(t){var e;if(super(t),t.type!==ct||"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,o;if(void 0===this.it){this.it=new Set,void 0!==t.strings&&(this.nt=new Set(t.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in e)e[t]&&!(null===(i=this.nt)||void 0===i?void 0:i.has(t))&&this.it.add(t);return this.render(e)}const r=t.element.classList;this.it.forEach((t=>{t in e||(r.remove(t),this.it.delete(t))}));for(const t in e){const i=!!e[t];i===this.it.has(t)||(null===(o=this.nt)||void 0===o?void 0:o.has(t))||(i?(r.add(t),this.it.add(t)):(r.remove(t),this.it.delete(t)))}return k}}),pt=(t,e=["article","div","span"],i="div")=>class extends t{static get properties(){return{as:{type:String}}}connectedCallback(){var t;super.connectedCallback(),this.as=null!==(t=e.includes(this.as)?this.as:i)&&void 0!==t?t:"div"}get tag(){return q`${(t=>({_$litStatic$:t,r:U}))(this.as)}`}};var bt,mt;class ft extends at{constructor(){super(...arguments),bt.set(this,void 0),mt.set(this,(()=>{if(this.hasAttribute("form")){const t=this.getRootNode(),i=this.getAttribute("form");e(this,bt,t.getElementById(i),"f")}else e(this,bt,this.closest("form"),"f")}))}static get properties(){return{assignedForm:{type:String,attribute:"form"}}}get form(){return t(this,bt,"f")}updated(e){super.updated(e),(e.has("form")||null==t(this,bt,"f"))&&t(this,mt,"f").call(this)}}function $t(t){return t&&t.i&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}bt=new WeakMap,mt=new WeakMap;var yt,vt,wt={};wt.LoadsmartTheme={"brand-color-brand":"20, 214, 77","brand-color-brand-accent-1":"0, 215, 215","brand-color-brand-accent-2":"132, 241, 30","border-radius-none":"0px","border-radius-s":"4px","border-radius-m":"8px","border-radius-l":"16px","border-radius-circle":"50%","border-none":0,"border-thin":"1px","border-medium":"2px","border-thick":"4px","color-background-primary":"252, 252, 255","color-background-secondary":"248, 249, 251","color-background-tertiary":"230, 237, 242","color-background-highlight":"202, 219, 221","color-background-inverted":"32, 41, 49","color-background-secondary-inverted":"61, 74, 85","color-border":"193, 206, 217","color-divider":"230, 237, 242","color-brand":"20, 214, 77","color-brand-accent-1":"0, 215, 215","color-brand-accent-2":"132, 241, 30","color-primary-20":"202, 219, 221","color-primary-60":"0, 84, 84","color-primary-100":"0, 51, 51","color-accent-20":"229, 245, 255","color-accent-60":"0, 98, 159","color-accent-100":"15, 66, 97","color-neutral-0":"252, 252, 255","color-neutral-10":"248, 249, 251","color-neutral-20":"230, 237, 242","color-neutral-40":"193, 206, 217","color-neutral-60":"94, 118, 138","color-neutral-80":"92, 106, 118","color-neutral-90":"61, 74, 85","color-neutral-100":"32, 41, 49","color-success-20":"227, 247, 239","color-success-60":"3, 124, 94","color-success-100":"0, 94, 71","color-danger-20":"255, 233, 230","color-danger-60":"186, 27, 27","color-danger-100":"104, 0, 3","color-warning-20":"255, 243, 214","color-warning-60":"248, 182, 14","color-warning-100":"102, 63, 25","color-text-primary":"32, 41, 49","color-text-secondary":"61, 74, 85","color-text-tertiary":"92, 106, 118","color-text-placeholder":"94, 118, 138","color-text-disabled":"193, 206, 217","color-text-inverted":"252, 252, 255","color-text-secondary-inverted":"193, 206, 217","color-text-error":"186, 27, 27","color-text-highlight":"0, 98, 159","color-text-link":"0, 98, 159","font-family-default":"'Manrope', sans-serif","font-family-title":"'PlusJakartaSans', 'Manrope', sans-serif","font-size-1":"0.625rem","font-size-2":"0.75rem","font-size-3":"0.875rem","font-size-4":"1rem","font-size-5":"1.25rem","font-size-6":"1.625rem","font-size-7":"2.375rem","font-size-8":"3rem","font-size-9":"3.625rem","font-weight-regular":500,"font-weight-medium":600,"font-weight-bold":700,"line-height-1":"100%","line-height-2":"125%","line-height-3":"130%","line-height-4":"140%","line-height-5":"150%","line-height-6":"180%","global-height-small":"1.75rem","global-height-default":"2.5rem","global-height-large":"3rem","opacity-0":"0%","opacity-20":"20%","opacity-40":"40%","opacity-60":"60%","opacity-100":"100%","elevation-1":"0px 0px 2px rgba(94, 118, 138, 0.1), 0px 1px 6px 2px rgba(61, 74, 85, 0.15)","elevation-2":"0px 1px 3px rgba(94, 118, 138, 0.2), 0px 4px 8px 3px rgba(61, 74, 85, 0.15)","elevation-3":"0px 0px 4px rgba(94, 118, 138, 0.2), 0px 6px 12px 6px rgba(61, 74, 85, 0.15)","elevation-4":"0px 5px 6px 4px rgba(94, 118, 138, 0.2), 0px 8px 10px rgba(61, 74, 85, 0.1)","glow-primary":"0.0px 0.0px 4.0px 0px rgb(3, 124, 94, .5)","glow-warning":"0.0px 0.0px 4.0px 0px rgba(255, 206, 79, 1.0)","spacing-1":"4px","spacing-2":"8px","spacing-3":"12px","spacing-4":"16px","spacing-5":"20px","spacing-6":"24px","spacing-8":"32px","spacing-10":"40px","spacing-12":"48px","spacing-14":"56px","spacing-16":"64px","spacing-20":"80px","spacing-30":"120px","spacing-0-5":"2px","platform-font-default":"'Manrope', sans-serif","platform-font-title":"'PlusJakartaSans', 'Manrope', sans-serif"};var xt=wt;function kt(t,e){return t.filter((function(t){return t.startsWith(e)}))}function zt(t,e){return t.filter((function(t){return!t.startsWith(e)}))}var St=zt(zt(Object.keys(xt.LoadsmartTheme),"brand-"),"platform-");function Ct(t){return xt.LoadsmartTheme[t]}function Wt(t){var e=Ct(t);return null==e?e:"--m-".concat(t)}function Mt(t){return H(yt(t))}function jt(t,e=1){return H(yt(t,e))}kt(St,"color-background-"),kt(St,"border-radius-"),kt(St,"border-"),kt(St,"color-"),kt(St,"elevation-"),kt(St,"font-family-"),kt(St,"font-size-"),kt(St,"font-weight-"),kt(St,"global-"),kt(St,"glow-"),kt(St,"line-height-"),kt(St,"opacity-"),function(t,e,i){if(i||2===arguments.length)for(var o,r=0,n=e.length;r<n;r++)!o&&r in e||(o||(o=Array.prototype.slice.call(e,0,r)),o[r]=e[r]);t.concat(o||Array.prototype.slice.call(e))}(["none"],kt(St,"spacing-"),!0),vt=Ct,yt=function(t,e){var i=Ct(t);return null==i?"":t.startsWith("color-")?"rgba(var(".concat(Wt(t),", ").concat(i,"), ").concat(null!=e?e:1,")"):"var(".concat(Wt(t),", ").concat(i,")")};var At={toArray:function(t){return null==t?[]:Array.isArray(t)?t:[t]}},Bt=$t(At.toArray);function Et(t){return H(`\n\t\tmargin-inline-start: ${t}\n\t`)}function _t(t){return H(`\n\t\t${Et(t)};\n\t\t${function(t){return H(`\n\t\tmargin-inline-end: ${t}\n\t`)}(t)}\n\t`)}function Pt(t){return H(`\n\t\t${function(t){return H(`\n\t\tmargin-block-start: ${t}\n\t`)}(t)};\n\t\t${function(t){return H(`\n\t\tmargin-block-end: ${t}\n\t`)}(t)}\n\t`)}function Tt(t){return H(`\n\t\t${_t(t)};\n\t\t${Pt(t)}\n\t`)}function Ot(t){return H(`\n\t\t${function(t){return H(`\n\t\tpadding-inline-end: ${t}\n\t`)}(t)};\n\t\t${function(t){return H(`\n\t\tpadding-inline-start: ${t}\n\t`)}(t)}\n\t`)}function Ut(t){return H(`\n\t\t${function(t){return H(`\n\t\tpadding-block-start: ${t}\n\t`)}(t)};\n\t\t${function(t){return H(`\n\t\tpadding-block-end: ${t}\n\t`)}(t)}\n\t`)}function Rt(t){return H(`\n\t\t${Ot(t)};\n\t\t${Ut(t)}\n\t`)}const qt={property:"all",delay:"0s",duration:"0.35s",easing:"ease-in-out"};function Nt(t){const e=Bt(t).map((t=>function(t){const e={...qt,...t};return H(`${e.property} ${e.duration} ${e.easing} ${e.delay}`)}(t))).join(", ");return H(`\n\t\ttransition: ${e}\n\t`)}function Lt(t){const e=H("\n\t\tfont-style: normal;\n\t\tfont-stretch: normal;\n\t\tletter-spacing: normal;\n\n\t\tfont-synthesis: none;\n\t\ttext-rendering: optimizeLegibility;\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\t-webkit-text-size-adjust: 100%;\n\t");return H(`${e}\n${function(t){switch(t){case"hero-lg-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\tfont-size: ${Mt("font-size-9")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"hero-lg":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\tfont-size: ${Mt("font-size-9")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"hero-md-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\tfont-size: ${Mt("font-size-8")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"hero-md":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\tfont-size: ${Mt("font-size-8")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"hero-sm-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\tfont-size: ${Mt("font-size-7")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"hero-sm":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\tfont-size: ${Mt("font-size-7")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"heading-lg-bold":return`\n\t\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\t\tfont-size: ${Mt("font-size-6")};\n\t\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t\t`;case"heading-lg":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-6")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"heading-md-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-5")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"heading-md":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-5")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"heading-sm-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-4")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"heading-sm":return`\n\t\t\t\tfont-family: ${Mt("font-family-title")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-4")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"body-lg-bold":return`\n\t\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\t\tfont-size: ${Mt("font-size-5")};\n\t\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t\t`;case"body-lg":return`\n\t\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\t\tline-height: ${Mt("line-height-6")};\n\t\t\t\t\tfont-size: ${Mt("font-size-5")};\n\t\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t\t`;case"body-md":case"number-md":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-3")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"body-md-underline":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-3")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"body-md-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-3")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"body-md-bold-underline":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-5")};\n\t\t\t\tfont-size: ${Mt("font-size-3")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"body-sm":case"number-sm":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-4")};\n\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")}\n\t\t\t`;case"body-sm-underline":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-4")};\n\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\tfont-weight: ${Mt("font-weight-regular")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"body-sm-bold":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-4")};\n\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"body-sm-bold-underline":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-4")};\n\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"button-lg":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\tfont-size: ${Mt("font-size-4")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"button-md":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\tfont-size: ${Mt("font-size-3")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"button-sm":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t`;case"table-header-md":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\tfont-size: ${Mt("font-size-3")};\n\t\t\t\tfont-weight: ${Mt("font-weight-medium")};\n\t\t\t\ttext-transform: uppercase\n\t\t\t`;case"table-header-sm":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\tfont-weight: ${Mt("font-weight-medium")}\n\t\t\t`;case"chips-md":return`\n\t\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\t\tfont-size: ${Mt("font-size-2")};\n\t\t\t\t\tfont-weight: ${Mt("font-weight-bold")}\n\t\t\t\t`;case"chips-sm":return`\n\t\t\t\tfont-family: ${Mt("font-family-default")};\n\t\t\t\tline-height: ${Mt("line-height-1")};\n\t\t\t\tfont-size: ${Mt("font-size-1")};\n\t\t\t\tfont-weight: ${Mt("font-weight-medium")};\n\t\t\t\ttext-transform: uppercase\n\t\t\t`;default:return""}}(t)}`)}function Dt(t,e=""){return H(Bt(t).map((t=>[`${t}.is-disabled`,`${t}:disabled`].map((t=>[t,e].join(" "))).join(", "))).join(", "))}const Gt={active:function(t){return H(Bt(t).map((t=>`${t}:not(.is-disabled, :disabled):active`)).join(", "))},focus:function(t){return H(Bt(t).map((t=>`${t}:not(.is-disabled, :disabled):focus,\n\t\t\t\t${t}:not(.is-disabled, :disabled):focus-within,\n\t\t\t\t${t}:not(.is-disabled, :disabled).is-focused`)).join(", "))},hover:function(t){return H(Bt(t).map((t=>`${t}:not(.is-disabled, :disabled):hover`)).join(", "))}};function It(){return X`
|
|
38
|
+
*/const pt=ut(class extends bt{constructor(t){var e;if(super(t),t.type!==ht||"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,o;if(void 0===this.it){this.it=new Set,void 0!==t.strings&&(this.nt=new Set(t.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in e)e[t]&&!(null===(i=this.nt)||void 0===i?void 0:i.has(t))&&this.it.add(t);return this.render(e)}const r=t.element.classList;this.it.forEach((t=>{t in e||(r.remove(t),this.it.delete(t))}));for(const t in e){const i=!!e[t];i===this.it.has(t)||(null===(o=this.nt)||void 0===o?void 0:o.has(t))||(i?(r.add(t),this.it.add(t)):(r.remove(t),this.it.delete(t)))}return k}}),gt=(t,e=["article","div","span"],i="div")=>class extends t{static get properties(){return{as:{type:String}}}connectedCallback(){var t;super.connectedCallback(),this.as=null!==(t=e.includes(this.as)?this.as:i)&&void 0!==t?t:"div"}get tag(){return q`${(t=>({_$litStatic$:t,r:R}))(this.as)}`}};var mt,ft;class $t extends lt{constructor(){super(...arguments),mt.set(this,void 0),ft.set(this,(()=>{if(this.hasAttribute("form")){const t=this.getRootNode(),i=this.getAttribute("form");e(this,mt,t.getElementById(i),"f")}else e(this,mt,this.closest("form"),"f")}))}static get properties(){return{assignedForm:{type:String,attribute:"form"}}}get form(){return t(this,mt,"f")}updated(e){super.updated(e),(e.has("form")||null==t(this,mt,"f"))&&t(this,ft,"f").call(this)}}function yt(t){return t&&t.i&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}mt=new WeakMap,ft=new WeakMap;var vt,wt,xt={};xt.LoadsmartTheme={"brand-color-brand":"20, 214, 77","brand-color-brand-accent-1":"0, 215, 215","brand-color-brand-accent-2":"132, 241, 30","border-radius-none":"0px","border-radius-s":"4px","border-radius-m":"8px","border-radius-l":"16px","border-radius-circle":"50%","border-none":0,"border-thin":"1px","border-medium":"2px","border-thick":"4px","color-background-primary":"252, 252, 255","color-background-secondary":"248, 249, 251","color-background-tertiary":"230, 237, 242","color-background-highlight":"202, 219, 221","color-background-inverted":"32, 41, 49","color-background-secondary-inverted":"61, 74, 85","color-border":"193, 206, 217","color-divider":"230, 237, 242","color-brand":"20, 214, 77","color-brand-accent-1":"0, 215, 215","color-brand-accent-2":"132, 241, 30","color-primary-20":"202, 219, 221","color-primary-60":"0, 84, 84","color-primary-100":"0, 51, 51","color-accent-20":"229, 245, 255","color-accent-60":"0, 98, 159","color-accent-100":"15, 66, 97","color-neutral-0":"252, 252, 255","color-neutral-10":"248, 249, 251","color-neutral-20":"230, 237, 242","color-neutral-40":"193, 206, 217","color-neutral-60":"94, 118, 138","color-neutral-80":"92, 106, 118","color-neutral-90":"61, 74, 85","color-neutral-100":"32, 41, 49","color-success-20":"227, 247, 239","color-success-60":"3, 124, 94","color-success-100":"0, 94, 71","color-danger-20":"255, 233, 230","color-danger-60":"186, 27, 27","color-danger-100":"104, 0, 3","color-warning-20":"255, 243, 214","color-warning-60":"248, 182, 14","color-warning-100":"102, 63, 25","color-text-primary":"32, 41, 49","color-text-secondary":"61, 74, 85","color-text-tertiary":"92, 106, 118","color-text-placeholder":"94, 118, 138","color-text-disabled":"193, 206, 217","color-text-inverted":"252, 252, 255","color-text-secondary-inverted":"193, 206, 217","color-text-error":"186, 27, 27","color-text-highlight":"0, 98, 159","color-text-link":"0, 98, 159","font-family-default":"'Manrope', sans-serif","font-family-title":"'PlusJakartaSans', 'Manrope', sans-serif","font-size-1":"0.625rem","font-size-2":"0.75rem","font-size-3":"0.875rem","font-size-4":"1rem","font-size-5":"1.25rem","font-size-6":"1.625rem","font-size-7":"2.375rem","font-size-8":"3rem","font-size-9":"3.625rem","font-weight-regular":500,"font-weight-medium":600,"font-weight-bold":700,"line-height-1":"100%","line-height-2":"125%","line-height-3":"130%","line-height-4":"140%","line-height-5":"150%","line-height-6":"180%","global-height-small":"1.75rem","global-height-default":"2.5rem","global-height-large":"3rem","opacity-0":"0%","opacity-20":"20%","opacity-40":"40%","opacity-60":"60%","opacity-100":"100%","elevation-1":"0px 0px 2px rgba(94, 118, 138, 0.1), 0px 1px 6px 2px rgba(61, 74, 85, 0.15)","elevation-2":"0px 1px 3px rgba(94, 118, 138, 0.2), 0px 4px 8px 3px rgba(61, 74, 85, 0.15)","elevation-3":"0px 0px 4px rgba(94, 118, 138, 0.2), 0px 6px 12px 6px rgba(61, 74, 85, 0.15)","elevation-4":"0px 5px 6px 4px rgba(94, 118, 138, 0.2), 0px 8px 10px rgba(61, 74, 85, 0.1)","glow-primary":"0.0px 0.0px 4.0px 0px rgb(3, 124, 94, .5)","glow-warning":"0.0px 0.0px 4.0px 0px rgba(255, 206, 79, 1.0)","spacing-1":"4px","spacing-2":"8px","spacing-3":"12px","spacing-4":"16px","spacing-5":"20px","spacing-6":"24px","spacing-8":"32px","spacing-10":"40px","spacing-12":"48px","spacing-14":"56px","spacing-16":"64px","spacing-20":"80px","spacing-30":"120px","spacing-0-5":"2px","platform-font-default":"'Manrope', sans-serif","platform-font-title":"'PlusJakartaSans', 'Manrope', sans-serif"};var kt=xt;function zt(t,e){return t.filter((function(t){return t.startsWith(e)}))}function St(t,e){return t.filter((function(t){return!t.startsWith(e)}))}var Ct=St(St(Object.keys(kt.LoadsmartTheme),"brand-"),"platform-");function Wt(t){return kt.LoadsmartTheme[t]}function Mt(t){var e=Wt(t);return null==e?e:"--m-".concat(t)}function jt(t){return H(vt(t))}function Bt(t,e=1){return H(vt(t,e))}zt(Ct,"color-background-"),zt(Ct,"border-radius-"),zt(Ct,"border-"),zt(Ct,"color-"),zt(Ct,"elevation-"),zt(Ct,"font-family-"),zt(Ct,"font-size-"),zt(Ct,"font-weight-"),zt(Ct,"global-"),zt(Ct,"glow-"),zt(Ct,"line-height-"),zt(Ct,"opacity-"),function(t,e,i){if(i||2===arguments.length)for(var o,r=0,n=e.length;r<n;r++)!o&&r in e||(o||(o=Array.prototype.slice.call(e,0,r)),o[r]=e[r]);t.concat(o||Array.prototype.slice.call(e))}(["none"],zt(Ct,"spacing-"),!0),wt=Wt,vt=function(t,e){var i=Wt(t);return null==i?"":t.startsWith("color-")?"rgba(var(".concat(Mt(t),", ").concat(i,"), ").concat(null!=e?e:1,")"):"var(".concat(Mt(t),", ").concat(i,")")};var At=function(t){return null==t?[]:Array.isArray(t)?t:[t]},Et=yt(At);function _t(t){return H(`\n\t\tmargin-inline-start: ${t}\n\t`)}function Tt(t){return H(`\n\t\t${_t(t)};\n\t\t${function(t){return H(`\n\t\tmargin-inline-end: ${t}\n\t`)}(t)}\n\t`)}function Pt(t){return H(`\n\t\t${function(t){return H(`\n\t\tmargin-block-start: ${t}\n\t`)}(t)};\n\t\t${function(t){return H(`\n\t\tmargin-block-end: ${t}\n\t`)}(t)}\n\t`)}function Ot(t){return H(`\n\t\t${Tt(t)};\n\t\t${Pt(t)}\n\t`)}function Rt(t){return H(`\n\t\t${function(t){return H(`\n\t\tpadding-inline-end: ${t}\n\t`)}(t)};\n\t\t${function(t){return H(`\n\t\tpadding-inline-start: ${t}\n\t`)}(t)}\n\t`)}function Ut(t){return H(`\n\t\t${function(t){return H(`\n\t\tpadding-block-start: ${t}\n\t`)}(t)};\n\t\t${function(t){return H(`\n\t\tpadding-block-end: ${t}\n\t`)}(t)}\n\t`)}function qt(t){return H(`\n\t\t${Rt(t)};\n\t\t${Ut(t)}\n\t`)}const Dt={property:"all",delay:"0s",duration:"0.35s",easing:"ease-in-out"};function Nt(t){const e=Et(t).map((t=>function(t){const e={...Dt,...t};return H(`${e.property} ${e.duration} ${e.easing} ${e.delay}`)}(t))).join(", ");return H(`\n\t\ttransition: ${e}\n\t`)}function Lt(t){const e=H("\n\t\tfont-style: normal;\n\t\tfont-stretch: normal;\n\t\tletter-spacing: normal;\n\n\t\tfont-synthesis: none;\n\t\ttext-rendering: optimizeLegibility;\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\t-webkit-text-size-adjust: 100%;\n\t");return H(`${e}\n${function(t){switch(t){case"hero-lg-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\tfont-size: ${jt("font-size-9")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"hero-lg":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\tfont-size: ${jt("font-size-9")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"hero-md-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\tfont-size: ${jt("font-size-8")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"hero-md":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\tfont-size: ${jt("font-size-8")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"hero-sm-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\tfont-size: ${jt("font-size-7")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"hero-sm":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\tfont-size: ${jt("font-size-7")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"heading-lg-bold":return`\n\t\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\t\tfont-size: ${jt("font-size-6")};\n\t\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t\t`;case"heading-lg":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-6")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"heading-md-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-5")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"heading-md":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-5")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"heading-sm-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-4")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"heading-sm":return`\n\t\t\t\tfont-family: ${jt("font-family-title")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-4")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"body-lg-bold":return`\n\t\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\t\tfont-size: ${jt("font-size-5")};\n\t\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t\t`;case"body-lg":return`\n\t\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\t\tline-height: ${jt("line-height-6")};\n\t\t\t\t\tfont-size: ${jt("font-size-5")};\n\t\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t\t`;case"body-md":case"number-md":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-3")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"body-md-underline":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-3")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"body-md-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-3")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"body-md-bold-underline":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-5")};\n\t\t\t\tfont-size: ${jt("font-size-3")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"body-sm":case"number-sm":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-4")};\n\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")}\n\t\t\t`;case"body-sm-underline":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-4")};\n\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\tfont-weight: ${jt("font-weight-regular")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"body-sm-bold":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-4")};\n\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"body-sm-bold-underline":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-4")};\n\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")};\n\t\t\t\ttext-decoration: underline\n\t\t\t`;case"button-lg":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\tfont-size: ${jt("font-size-4")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"button-md":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\tfont-size: ${jt("font-size-3")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"button-sm":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t`;case"table-header-md":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\tfont-size: ${jt("font-size-3")};\n\t\t\t\tfont-weight: ${jt("font-weight-medium")};\n\t\t\t\ttext-transform: uppercase\n\t\t\t`;case"table-header-sm":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\tfont-weight: ${jt("font-weight-medium")}\n\t\t\t`;case"chips-md":return`\n\t\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\t\tfont-size: ${jt("font-size-2")};\n\t\t\t\t\tfont-weight: ${jt("font-weight-bold")}\n\t\t\t\t`;case"chips-sm":return`\n\t\t\t\tfont-family: ${jt("font-family-default")};\n\t\t\t\tline-height: ${jt("line-height-1")};\n\t\t\t\tfont-size: ${jt("font-size-1")};\n\t\t\t\tfont-weight: ${jt("font-weight-medium")};\n\t\t\t\ttext-transform: uppercase\n\t\t\t`;default:return""}}(t)}`)}function Gt(t,e=""){return H(Et(t).map((t=>[`${t}.is-disabled`,`${t}:disabled`].map((t=>[t,e].join(" "))).join(", "))).join(", "))}const It={active:function(t){return H(Et(t).map((t=>`${t}:not(.is-disabled, :disabled):active`)).join(", "))},focus:function(t){return H(Et(t).map((t=>`${t}:not(.is-disabled, :disabled):focus,\n\t\t\t\t\t${t}:not(.is-disabled, :disabled):focus-visible,\n\t\t\t\t${t}:not(.is-disabled, :disabled):focus-within,\n\t\t\t\t${t}:not(.is-disabled, :disabled).is-focused`)).join(", "))},hover:function(t){return H(Et(t).map((t=>`${t}:not(.is-disabled, :disabled):hover`)).join(", "))}};function Vt(){return X`
|
|
39
39
|
:host {
|
|
40
40
|
--m-button-background-color: transparent;
|
|
41
|
-
--m-button-base-size: ${
|
|
42
|
-
--m-button-border-color: ${
|
|
43
|
-
--m-button-border-radius: ${
|
|
44
|
-
--m-button-color: ${
|
|
45
|
-
--m-button-outline-color: ${
|
|
41
|
+
--m-button-base-size: ${jt("global-height-default")};
|
|
42
|
+
--m-button-border-color: ${Bt("color-neutral-90")};
|
|
43
|
+
--m-button-border-radius: ${jt("border-radius-s")};
|
|
44
|
+
--m-button-color: ${Bt("color-text-secondary")};
|
|
45
|
+
--m-button-outline-color: ${Bt("color-primary-100")};
|
|
46
46
|
--m-button-outline-offset: 2px;
|
|
47
|
-
--m-button-padding-x: ${
|
|
48
|
-
--m-button-padding-y: ${
|
|
47
|
+
--m-button-padding-x: ${jt("spacing-4")};
|
|
48
|
+
--m-button-padding-y: ${jt("spacing-3")};
|
|
49
49
|
/**
|
|
50
50
|
* Useful when overriding via host :slotted query.
|
|
51
51
|
*/
|
|
52
|
-
--m-button-font-size: ${
|
|
52
|
+
--m-button-font-size: ${jt("font-size-3")};
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
:host([size='small']) {
|
|
56
|
-
--m-button-base-size: ${
|
|
56
|
+
--m-button-base-size: ${jt("global-height-small")};
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
:host([size='large']) {
|
|
60
|
-
--m-button-base-size: ${
|
|
60
|
+
--m-button-base-size: ${jt("global-height-large")};
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
:host([variant|='icon']) {
|
|
64
|
-
--m-button-border-radius: ${
|
|
64
|
+
--m-button-border-radius: ${jt("border-radius-circle")};
|
|
65
65
|
|
|
66
66
|
min-inline-size: var(--m-button-base-size);
|
|
67
67
|
inline-size: var(--m-button-base-size);
|
|
@@ -94,7 +94,7 @@ const dt=t=>null!=t?t:z
|
|
|
94
94
|
|
|
95
95
|
text-decoration: none;
|
|
96
96
|
|
|
97
|
-
gap: ${
|
|
97
|
+
gap: ${jt("spacing-1")};
|
|
98
98
|
|
|
99
99
|
padding-inline: var(--m-button-padding-x);
|
|
100
100
|
padding-block: var(--m-button-padding-y);
|
|
@@ -106,222 +106,222 @@ const dt=t=>null!=t?t:z
|
|
|
106
106
|
border-radius: var(--m-button-border-radius);
|
|
107
107
|
}
|
|
108
108
|
|
|
109
|
-
${
|
|
109
|
+
${Gt(".button")} {
|
|
110
110
|
cursor: default;
|
|
111
111
|
}
|
|
112
112
|
|
|
113
|
-
${
|
|
113
|
+
${Gt(".button","*")} {
|
|
114
114
|
pointer-events: none;
|
|
115
115
|
}
|
|
116
116
|
|
|
117
|
-
${
|
|
117
|
+
${It.focus(".button")} {
|
|
118
118
|
outline: 1px solid var(--m-button-outline-color);
|
|
119
119
|
outline-offset: var(--m-button-outline-offset);
|
|
120
120
|
}
|
|
121
121
|
|
|
122
|
-
${
|
|
123
|
-
--m-button-background-color: ${
|
|
124
|
-
--m-button-border-color: ${
|
|
125
|
-
--m-button-color: ${
|
|
122
|
+
${It.hover(".button")} {
|
|
123
|
+
--m-button-background-color: ${Bt("color-background-inverted")};
|
|
124
|
+
--m-button-border-color: ${Bt("color-background-inverted")};
|
|
125
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
126
126
|
}
|
|
127
127
|
|
|
128
128
|
::slotted(*) {
|
|
129
129
|
display: inline-flex;
|
|
130
130
|
align-items: center;
|
|
131
131
|
|
|
132
|
-
${
|
|
133
|
-
${
|
|
132
|
+
${qt(0)};
|
|
133
|
+
${Ot(0)};
|
|
134
134
|
}
|
|
135
135
|
|
|
136
136
|
slot[name='leading']::slotted(span),
|
|
137
137
|
slot[name='trailing']::slotted(span) {
|
|
138
138
|
justify-content: center;
|
|
139
139
|
}
|
|
140
|
-
`}var
|
|
140
|
+
`}var Jt,Ht,Xt,Yt,Zt,Ft,Kt;class Qt extends(gt($t,["button","a"],"button")){static get properties(){return{...$t.properties,role:{type:String,reflect:!0},loading:{type:Boolean},disabled:{type:Boolean,reflect:!0},variant:{type:String,reflect:!0},size:{type:String,reflect:!0},tabindex:{type:String},type:{type:String},href:{type:String},target:{type:String},download:{type:String}}}constructor(){super(),Jt.add(this),Xt.set(this,(()=>Boolean(this.disabled)||Boolean(this.loading))),Yt.set(this,(()=>{const e=t(this,Xt,"f").call(this);this.setAttribute("aria-disabled",String(e))})),Zt.set(this,(()=>{var e;return t(this,Jt,"m",Kt).call(this)?this.disabled?"-1":null!=this.tabindex?this.tabindex:"0":null!==(e=this.tabindex)&&void 0!==e?e:void 0})),Ft.set(this,(t=>{var e,i;if(this.disabled||this.loading)return t.preventDefault(),void t.stopPropagation();"submit"===this.type&&(null===(e=this.form)||void 0===e||e.requestSubmit()),"reset"===this.type&&(null===(i=this.form)||void 0===i||i.reset())})),this.as="button",this.disabled=!1,this.loading=!1,this.size="default",this.type="button",this.variant="secondary",this.target="_self"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","button"),this.addEventListener("click",t(this,Ft,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",t(this,Ft,"f"))}update(e){super.update(e),e.has("href")&&(this.as=t(this,Jt,"m",Kt).call(this)?"a":"button",this.role=t(this,Jt,"m",Kt).call(this)?"link":"button")}updated(e){super.updated(e),(e.has("disabled")||e.has("loading"))&&t(this,Yt,"f").call(this)}render(){const e=t(this,Jt,"m",Kt).call(this);return N`
|
|
141
141
|
<${this.tag}
|
|
142
|
-
class=${
|
|
143
|
-
type=${
|
|
144
|
-
?disabled="${t(this,
|
|
142
|
+
class=${pt({button:!0,"-primary":"primary"===this.variant,"-secondary":"secondary"===this.variant,"-tertiary":"tertiary"===this.variant,"-warning":"warning"===this.variant,"-danger":"danger"===this.variant,"-icon":"icon"===this.variant,"-icon-secondary":"icon-secondary"===this.variant,"-small":"small"===this.size,"-default":"default"===this.size,"-large":"large"===this.size,"is-loading":Boolean(this.loading),"is-disabled":t(this,Xt,"f").call(this)})}
|
|
143
|
+
type=${ct(e?void 0:this.type)}
|
|
144
|
+
?disabled="${t(this,Xt,"f").call(this)}"
|
|
145
145
|
aria-disabled=${this.disabled?"true":"false"}
|
|
146
|
-
role=${
|
|
147
|
-
tabindex=${
|
|
148
|
-
href=${
|
|
149
|
-
target=${
|
|
150
|
-
download=${
|
|
151
|
-
rel=${
|
|
146
|
+
role=${ct(e?"link":"button")}
|
|
147
|
+
tabindex=${ct(t(this,Zt,"f").call(this))}
|
|
148
|
+
href=${ct(e?this.href:void 0)}
|
|
149
|
+
target=${ct(e?this.target:void 0)}
|
|
150
|
+
download=${ct(e?this.download:void 0)}
|
|
151
|
+
rel=${ct(e&&this.target?"noreferrer noopener":void 0)}
|
|
152
152
|
>
|
|
153
153
|
<!-- TODO: Replace this with the loading dots component as soon as it is ready. -->
|
|
154
|
-
${this.loading&&!["icon","icon-secondary"].includes(this.variant)?
|
|
154
|
+
${this.loading&&!["icon","icon-secondary"].includes(this.variant)?N`<span class="loader">●●●</span>`:z}
|
|
155
155
|
<slot name="leading"></slot>
|
|
156
156
|
<slot></slot>
|
|
157
157
|
<slot name="trailing"></slot>
|
|
158
158
|
</${this.tag}>
|
|
159
|
-
`}focus(e){var i;null===(i=t(this,
|
|
159
|
+
`}focus(e){var i;null===(i=t(this,Jt,"a",Ht))||void 0===i||i.focus(e)}}Xt=new WeakMap,Yt=new WeakMap,Zt=new WeakMap,Ft=new WeakMap,Jt=new WeakSet,Ht=function(){var t,e;return null!==(e=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(".button"))&&void 0!==e?e:null},Kt=function(){return Boolean(this.href)},Qt.styles=[[Vt(),X`
|
|
160
160
|
.button.is-loading:not(.-icon, .-icon-secondary) *:not(.loader) {
|
|
161
161
|
visibility: hidden;
|
|
162
162
|
}
|
|
163
163
|
|
|
164
164
|
.button.-primary {
|
|
165
|
-
--m-button-background-color: ${
|
|
166
|
-
--m-button-border-color: ${
|
|
167
|
-
--m-button-color: ${
|
|
165
|
+
--m-button-background-color: ${Bt("color-primary-60")};
|
|
166
|
+
--m-button-border-color: ${Bt("color-primary-60")};
|
|
167
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
168
168
|
}
|
|
169
169
|
|
|
170
|
-
${
|
|
171
|
-
--m-button-background-color: ${
|
|
172
|
-
--m-button-border-color: ${
|
|
170
|
+
${Gt(".button.-primary")} {
|
|
171
|
+
--m-button-background-color: ${Bt("color-primary-20")};
|
|
172
|
+
--m-button-border-color: ${Bt("color-primary-20")};
|
|
173
173
|
}
|
|
174
174
|
|
|
175
|
-
${
|
|
176
|
-
--m-button-border-color: ${
|
|
177
|
-
--m-button-outline-color: ${
|
|
175
|
+
${It.focus(".button.-primary")} {
|
|
176
|
+
--m-button-border-color: ${Bt("color-primary-60")};
|
|
177
|
+
--m-button-outline-color: ${Bt("color-primary-60")};
|
|
178
178
|
}
|
|
179
179
|
|
|
180
|
-
${
|
|
181
|
-
${
|
|
182
|
-
--m-button-background-color: ${
|
|
183
|
-
--m-button-border-color: ${
|
|
180
|
+
${It.hover(".button.-primary")},
|
|
181
|
+
${It.active(".button.-primary")} {
|
|
182
|
+
--m-button-background-color: ${Bt("color-primary-100")};
|
|
183
|
+
--m-button-border-color: ${Bt("color-primary-100")};
|
|
184
184
|
}
|
|
185
185
|
|
|
186
186
|
.button.-primary.is-loading {
|
|
187
|
-
--m-button-background-color: ${
|
|
188
|
-
--m-button-border-color: ${
|
|
189
|
-
--m-button-color: ${
|
|
187
|
+
--m-button-background-color: ${Bt("color-primary-60")};
|
|
188
|
+
--m-button-border-color: ${Bt("color-primary-60")};
|
|
189
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
190
190
|
}
|
|
191
191
|
|
|
192
192
|
.button.-secondary {
|
|
193
193
|
--m-button-background-color: transparent;
|
|
194
|
-
--m-button-border-color: ${
|
|
195
|
-
--m-button-color: ${
|
|
194
|
+
--m-button-border-color: ${Bt("color-primary-100")};
|
|
195
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
196
196
|
}
|
|
197
197
|
|
|
198
|
-
${
|
|
199
|
-
--m-button-border-color: ${
|
|
200
|
-
--m-button-color: ${
|
|
198
|
+
${Gt(".button.-secondary")} {
|
|
199
|
+
--m-button-border-color: ${Bt("color-text-disabled")};
|
|
200
|
+
--m-button-color: ${Bt("color-text-disabled")};
|
|
201
201
|
}
|
|
202
202
|
|
|
203
|
-
${
|
|
204
|
-
--m-button-border-color: ${
|
|
205
|
-
--m-button-color: ${
|
|
203
|
+
${It.focus(".button.-secondary")} {
|
|
204
|
+
--m-button-border-color: ${Bt("color-primary-100")};
|
|
205
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
206
206
|
|
|
207
|
-
--m-button-outline-color: ${
|
|
207
|
+
--m-button-outline-color: ${Bt("color-primary-60")};
|
|
208
208
|
}
|
|
209
209
|
|
|
210
|
-
${
|
|
211
|
-
${
|
|
212
|
-
--m-button-background-color: ${
|
|
213
|
-
--m-button-border-color: ${
|
|
214
|
-
--m-button-color: ${
|
|
210
|
+
${It.hover(".button.-secondary")},
|
|
211
|
+
${It.active(".button.-secondary")} {
|
|
212
|
+
--m-button-background-color: ${Bt("color-background-tertiary")};
|
|
213
|
+
--m-button-border-color: ${Bt("color-primary-60")};
|
|
214
|
+
--m-button-color: ${Bt("color-primary-60")};
|
|
215
215
|
}
|
|
216
216
|
|
|
217
217
|
.button.-secondary.is-loading {
|
|
218
218
|
--m-button-background-color: transparent;
|
|
219
219
|
|
|
220
|
-
--m-button-border-color: ${
|
|
221
|
-
--m-button-color: ${
|
|
220
|
+
--m-button-border-color: ${Bt("color-primary-100")};
|
|
221
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
222
222
|
}
|
|
223
223
|
|
|
224
224
|
.button.-tertiary {
|
|
225
225
|
--m-button-background-color: transparent;
|
|
226
226
|
--m-button-border-color: transparent;
|
|
227
|
-
--m-button-color: ${
|
|
227
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
228
228
|
}
|
|
229
229
|
|
|
230
|
-
${
|
|
231
|
-
--m-button-color: ${
|
|
230
|
+
${Gt(".button.-tertiary")} {
|
|
231
|
+
--m-button-color: ${Bt("color-text-disabled")};
|
|
232
232
|
}
|
|
233
233
|
|
|
234
|
-
${
|
|
235
|
-
--m-button-color: ${
|
|
236
|
-
--m-button-outline-color: ${
|
|
234
|
+
${It.focus(".button.-tertiary")} {
|
|
235
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
236
|
+
--m-button-outline-color: ${Bt("color-primary-60")};
|
|
237
237
|
}
|
|
238
238
|
|
|
239
|
-
${
|
|
240
|
-
--m-button-background-color: ${
|
|
241
|
-
--m-button-border-color: ${
|
|
242
|
-
--m-button-color: ${
|
|
239
|
+
${It.hover(".button.-tertiary")} {
|
|
240
|
+
--m-button-background-color: ${Bt("color-background-tertiary")};
|
|
241
|
+
--m-button-border-color: ${Bt("color-background-tertiary")};
|
|
242
|
+
--m-button-color: ${Bt("color-primary-60")};
|
|
243
243
|
}
|
|
244
244
|
|
|
245
|
-
${
|
|
246
|
-
--m-button-background-color: ${
|
|
247
|
-
--m-button-border-color: ${
|
|
248
|
-
--m-button-color: ${
|
|
245
|
+
${It.active(".button.-tertiary")} {
|
|
246
|
+
--m-button-background-color: ${Bt("color-neutral-20")};
|
|
247
|
+
--m-button-border-color: ${Bt("color-neutral-20")};
|
|
248
|
+
--m-button-color: ${Bt("color-primary-60")};
|
|
249
249
|
}
|
|
250
250
|
|
|
251
251
|
.button.-tertiary.is-loading {
|
|
252
252
|
--m-button-background-color: transparent;
|
|
253
253
|
--m-button-border-color: transparent;
|
|
254
|
-
--m-button-color: ${
|
|
254
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
255
255
|
}
|
|
256
256
|
|
|
257
257
|
.button.-warning {
|
|
258
|
-
--m-button-background-color: ${
|
|
259
|
-
--m-button-border-color: ${
|
|
260
|
-
--m-button-color: ${
|
|
258
|
+
--m-button-background-color: ${Bt("color-warning-60")};
|
|
259
|
+
--m-button-border-color: ${Bt("color-warning-60")};
|
|
260
|
+
--m-button-color: ${Bt("color-text-primary")};
|
|
261
261
|
}
|
|
262
262
|
|
|
263
|
-
${
|
|
264
|
-
--m-button-background-color: ${
|
|
265
|
-
--m-button-border-color: ${
|
|
266
|
-
--m-button-color: ${
|
|
263
|
+
${Gt(".button.-warning")} {
|
|
264
|
+
--m-button-background-color: ${Bt("color-warning-20")};
|
|
265
|
+
--m-button-border-color: ${Bt("color-warning-20")};
|
|
266
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
267
267
|
}
|
|
268
268
|
|
|
269
|
-
${
|
|
270
|
-
--m-button-background-color: ${
|
|
271
|
-
--m-button-outline-color: ${
|
|
269
|
+
${It.focus(".button.-warning")} {
|
|
270
|
+
--m-button-background-color: ${Bt("color-warning-60")};
|
|
271
|
+
--m-button-outline-color: ${Bt("color-warning-60")};
|
|
272
272
|
}
|
|
273
273
|
|
|
274
|
-
${
|
|
275
|
-
${
|
|
276
|
-
--m-button-background-color: ${
|
|
277
|
-
--m-button-border-color: ${
|
|
278
|
-
--m-button-color: ${
|
|
274
|
+
${It.hover(".button.-warning")},
|
|
275
|
+
${It.active(".button.-warning")} {
|
|
276
|
+
--m-button-background-color: ${Bt("color-warning-100")};
|
|
277
|
+
--m-button-border-color: ${Bt("color-warning-100")};
|
|
278
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
279
279
|
}
|
|
280
280
|
|
|
281
281
|
.button.-warning.is-loading {
|
|
282
|
-
--m-button-background-color: ${
|
|
283
|
-
--m-button-border-color: ${
|
|
284
|
-
--m-button-color: ${
|
|
282
|
+
--m-button-background-color: ${Bt("color-warning-60")};
|
|
283
|
+
--m-button-border-color: ${Bt("color-warning-60")};
|
|
284
|
+
--m-button-color: ${Bt("color-text-primary")};
|
|
285
285
|
}
|
|
286
286
|
|
|
287
287
|
.button.-danger {
|
|
288
|
-
--m-button-background-color: ${
|
|
289
|
-
--m-button-border-color: ${
|
|
290
|
-
--m-button-color: ${
|
|
288
|
+
--m-button-background-color: ${Bt("color-danger-60")};
|
|
289
|
+
--m-button-border-color: ${Bt("color-danger-60")};
|
|
290
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
291
291
|
}
|
|
292
292
|
|
|
293
|
-
${
|
|
294
|
-
--m-button-background-color: ${
|
|
295
|
-
--m-button-border-color: ${
|
|
293
|
+
${Gt(".button.-danger")} {
|
|
294
|
+
--m-button-background-color: ${Bt("color-danger-20")};
|
|
295
|
+
--m-button-border-color: ${Bt("color-danger-20")};
|
|
296
296
|
}
|
|
297
297
|
|
|
298
|
-
${
|
|
299
|
-
--m-button-background-color: ${
|
|
300
|
-
--m-button-outline-color: ${
|
|
298
|
+
${It.focus(".button.-danger")} {
|
|
299
|
+
--m-button-background-color: ${Bt("color-danger-60")};
|
|
300
|
+
--m-button-outline-color: ${Bt("color-danger-60")};
|
|
301
301
|
}
|
|
302
302
|
|
|
303
|
-
${
|
|
304
|
-
${
|
|
305
|
-
--m-button-background-color: ${
|
|
306
|
-
--m-button-border-color: ${
|
|
303
|
+
${It.hover(".button.-danger")},
|
|
304
|
+
${It.active(".button.-danger")} {
|
|
305
|
+
--m-button-background-color: ${Bt("color-danger-100")};
|
|
306
|
+
--m-button-border-color: ${Bt("color-danger-100")};
|
|
307
307
|
}
|
|
308
308
|
|
|
309
309
|
.button.-danger.is-loading {
|
|
310
|
-
--m-button-background-color: ${
|
|
311
|
-
--m-button-border-color: ${
|
|
312
|
-
--m-button-color: ${
|
|
310
|
+
--m-button-background-color: ${Bt("color-danger-60")};
|
|
311
|
+
--m-button-border-color: ${Bt("color-danger-60")};
|
|
312
|
+
--m-button-color: ${Bt("color-text-inverted")};
|
|
313
313
|
}
|
|
314
314
|
|
|
315
315
|
.button.-icon,
|
|
316
316
|
.button.-icon-secondary {
|
|
317
|
-
--m-button-color: ${
|
|
318
|
-
--m-button-padding-x: ${
|
|
319
|
-
--m-button-padding-y: ${
|
|
317
|
+
--m-button-color: ${Bt("color-neutral-90")};
|
|
318
|
+
--m-button-padding-x: ${jt("spacing-1")};
|
|
319
|
+
--m-button-padding-y: ${jt("spacing-1")};
|
|
320
320
|
}
|
|
321
321
|
|
|
322
322
|
.button.-icon {
|
|
323
|
-
--m-button-background-color: ${
|
|
324
|
-
--m-button-border-color: ${
|
|
323
|
+
--m-button-background-color: ${Bt("color-background-tertiary")};
|
|
324
|
+
--m-button-border-color: ${Bt("color-background-tertiary")};
|
|
325
325
|
}
|
|
326
326
|
|
|
327
327
|
.button.-icon-secondary {
|
|
@@ -336,58 +336,58 @@ const dt=t=>null!=t?t:z
|
|
|
336
336
|
display: none;
|
|
337
337
|
}
|
|
338
338
|
|
|
339
|
-
${
|
|
340
|
-
--m-button-color: ${
|
|
339
|
+
${Gt([".button.-icon",".button.-icon-secondary"])} {
|
|
340
|
+
--m-button-color: ${Bt("color-neutral-40")};
|
|
341
341
|
}
|
|
342
342
|
|
|
343
|
-
${
|
|
344
|
-
--m-button-background-color: ${
|
|
345
|
-
--m-button-border-color: ${
|
|
343
|
+
${Gt(".button.-icon")} {
|
|
344
|
+
--m-button-background-color: ${Bt("color-neutral-20")};
|
|
345
|
+
--m-button-border-color: ${Bt("color-neutral-20")};
|
|
346
346
|
}
|
|
347
347
|
|
|
348
|
-
${
|
|
348
|
+
${Gt(".button.-icon-secondary")} {
|
|
349
349
|
--m-button-background-color: transparent;
|
|
350
350
|
--m-button-border-color: transparent;
|
|
351
351
|
}
|
|
352
352
|
|
|
353
|
-
${
|
|
354
|
-
--m-button-color: ${
|
|
355
|
-
--m-button-outline-color: ${
|
|
353
|
+
${It.focus([".button.-icon",".button.-icon-secondary"])} {
|
|
354
|
+
--m-button-color: ${Bt("color-primary-60")};
|
|
355
|
+
--m-button-outline-color: ${Bt("color-primary-60")};
|
|
356
356
|
}
|
|
357
357
|
|
|
358
|
-
${
|
|
359
|
-
--m-button-background-color: ${
|
|
358
|
+
${It.focus(".button.-icon")} {
|
|
359
|
+
--m-button-background-color: ${Bt("color-neutral-20")};
|
|
360
360
|
}
|
|
361
361
|
|
|
362
|
-
${
|
|
362
|
+
${It.focus(".button.-icon-secondary")} {
|
|
363
363
|
--m-button-background-color: transparent;
|
|
364
364
|
}
|
|
365
365
|
|
|
366
|
-
${
|
|
367
|
-
${
|
|
368
|
-
--m-button-color: ${
|
|
366
|
+
${It.hover([".button.-icon",".button.-icon-secondary"])},
|
|
367
|
+
${It.active([".button.-icon",".button.-icon-secondary"])} {
|
|
368
|
+
--m-button-color: ${Bt("color-primary-60")};
|
|
369
369
|
}
|
|
370
370
|
|
|
371
|
-
${
|
|
372
|
-
${
|
|
373
|
-
--m-button-background-color: ${
|
|
374
|
-
--m-button-border-color: ${
|
|
371
|
+
${It.hover(".button.-icon")},
|
|
372
|
+
${It.active(".button.-icon")} {
|
|
373
|
+
--m-button-background-color: ${Bt("color-background-highlight")};
|
|
374
|
+
--m-button-border-color: ${Bt("color-background-highlight")};
|
|
375
375
|
}
|
|
376
376
|
|
|
377
|
-
${
|
|
378
|
-
${
|
|
377
|
+
${It.hover(".button.-icon-secondary")},
|
|
378
|
+
${It.active(".button.-icon-secondary")} {
|
|
379
379
|
--m-button-background-color: transparent;
|
|
380
380
|
--m-button-border-color: transparent;
|
|
381
381
|
}
|
|
382
382
|
|
|
383
383
|
.button.-small {
|
|
384
|
-
--m-button-padding-y: ${
|
|
384
|
+
--m-button-padding-y: ${jt("spacing-2")};
|
|
385
385
|
|
|
386
386
|
${Lt("button-sm")};
|
|
387
387
|
}
|
|
388
388
|
|
|
389
389
|
.button.-large {
|
|
390
|
-
--m-button-padding-y: ${
|
|
390
|
+
--m-button-padding-y: ${jt("spacing-4")};
|
|
391
391
|
|
|
392
392
|
${Lt("button-lg")};
|
|
393
393
|
}
|
|
@@ -403,29 +403,29 @@ const dt=t=>null!=t?t:z
|
|
|
403
403
|
|
|
404
404
|
pointer-events: none;
|
|
405
405
|
}
|
|
406
|
-
`]],window.customElements.define("m-button",
|
|
406
|
+
`]],window.customElements.define("m-button",Qt);class te extends Qt{constructor(){super(),this.size="small"}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","primary-action")}}window.customElements.define("m-banner-action-primary",te);class ee extends Qt{constructor(){super(),this.variant="tertiary",this.size="small"}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","secondary-action")}}window.customElements.define("m-banner-action-secondary",ee);class ie extends lt{connectedCallback(){super.connectedCallback(),this.setAttribute("slot","actions")}render(){return x`
|
|
407
407
|
<slot name="secondary-action"></slot>
|
|
408
408
|
<slot name="primary-action"></slot>
|
|
409
|
-
`}}
|
|
409
|
+
`}}ie.styles=[X`
|
|
410
410
|
:host {
|
|
411
411
|
display: flex;
|
|
412
412
|
justify-content: flex-end;
|
|
413
|
-
gap: ${
|
|
413
|
+
gap: ${jt("spacing-2")};
|
|
414
414
|
}
|
|
415
|
-
`],window.customElements.define("m-banner-actions",
|
|
415
|
+
`],window.customElements.define("m-banner-actions",ie);class oe extends lt{connectedCallback(){super.connectedCallback(),this.setAttribute("slot","description")}render(){return x`<slot></slot>`}}oe.styles=[X`
|
|
416
416
|
:host {
|
|
417
417
|
${Lt("body-md")};
|
|
418
|
-
color: ${
|
|
418
|
+
color: ${Bt("color-text-secondary")};
|
|
419
419
|
}
|
|
420
|
-
`],window.customElements.define("m-banner-description",
|
|
420
|
+
`],window.customElements.define("m-banner-description",oe);class re extends lt{connectedCallback(){super.connectedCallback(),this.setAttribute("slot","icon")}render(){return x`<slot></slot>`}}window.customElements.define("m-banner-icon",re);class ne extends lt{connectedCallback(){super.connectedCallback(),this.setAttribute("slot","title")}render(){return x`<slot></slot>`}}ne.styles=[X`
|
|
421
421
|
:host {
|
|
422
422
|
${Lt("body-md-bold")};
|
|
423
|
-
color: ${
|
|
423
|
+
color: ${Bt("color-text-secondary")};
|
|
424
424
|
}
|
|
425
|
-
`],window.customElements.define("m-banner-title",
|
|
425
|
+
`],window.customElements.define("m-banner-title",ne);class se extends lt{constructor(){super(...arguments),this.emit=(t,e)=>{const i=new CustomEvent(t,{bubbles:!0,cancelable:!0,composed:!0,...e});this.dispatchEvent(i)},this.reemit=t=>{!function(t,e){!e.bubbles||t.shadowRoot&&!e.composed||e.stopPropagation();const i=Reflect.construct(e.constructor,[e.type,e]),o=t.dispatchEvent(i);o||e.preventDefault()}(this,t)}}}var ae={BASE_PIXELS:16,toRem:function(t,e=16){return parseInt(String(t),10)/e+"rem"}},le=yt(ae.toRem);function de(t,e){return H(le(t,e))}const ce=["alert-circle","attention","bell","check","close","info-circle","indeterminate"];var he,ue,be,pe,ge;class me extends se{static get properties(){return{name:{type:String},size:{type:String},color:{type:String},loading:{state:!0}}}constructor(){super(),he.add(this),this.icon=null,this.icon=null}connectedCallback(){super.connectedCallback(),t(this,he,"m",ue).call(this)}update(e){super.update(e),e.has("name")&&t(this,he,"m",ue).call(this)}updated(t){super.updated(t),t.has("size")&&null!=this.size&&this.style.setProperty("--m-icon-size",`${parseInt(String(this.size),10)||16}px`),t.has("color")&&null!=this.color&&this.style.setProperty("--m-icon-color",vt(this.color))}render(){return null!=this.name&&ce.includes(this.name)&&null!=this.icon?this.icon:z}}he=new WeakSet,ue=async function(){try{this.icon=null;const{default:t}=await import(`./icons/${this.name}.js`);this.icon=t}catch{console.error(`failed loading icon "${this.name}". Are you sure it exists?`)}finally{this.requestUpdate()}},me.styles=[[X`
|
|
426
426
|
:host {
|
|
427
427
|
--m-icon-size: 16px;
|
|
428
|
-
--m-icon-color: ${
|
|
428
|
+
--m-icon-color: ${Bt("color-text-primary")};
|
|
429
429
|
|
|
430
430
|
display: inline-flex;
|
|
431
431
|
align-items: center;
|
|
@@ -444,21 +444,21 @@ const dt=t=>null!=t?t:z
|
|
|
444
444
|
color: var(--m-icon-color);
|
|
445
445
|
fill: var(--m-icon-color);
|
|
446
446
|
}
|
|
447
|
-
`]],window.customElements.define("m-icon",
|
|
447
|
+
`]],window.customElements.define("m-icon",me);class fe extends se{static get properties(){return{controls:{type:String},disabled:{type:Boolean},inverted:{type:Boolean},label:{type:String},size:{type:String}}}constructor(){super(),be.add(this),ge.set(this,(()=>{this.emit("m-close")})),this.disabled=!1,this.inverted=!1,this.label="Close",this.size="default"}render(){var e;return x`
|
|
448
448
|
<button
|
|
449
449
|
type="button"
|
|
450
|
-
aria-controls="${
|
|
451
|
-
aria-label="${
|
|
452
|
-
class=${
|
|
450
|
+
aria-controls="${ct(this.controls)}"
|
|
451
|
+
aria-label="${ct(this.label)}"
|
|
452
|
+
class=${pt({"close-button":!0,"-size-small":"small"===this.size,"-size-default":"default"===this.size,"-size-large":"large"===this.size,"-inverted":null!==(e=this.inverted)&&void 0!==e&&e})}
|
|
453
453
|
?disabled="${this.disabled}"
|
|
454
|
-
@click=${t(this,
|
|
454
|
+
@click=${t(this,ge,"f")}
|
|
455
455
|
>
|
|
456
456
|
<m-icon name="close"></m-icon>
|
|
457
457
|
</button>
|
|
458
|
-
`}focus(e){var i;null===(i=t(this,
|
|
458
|
+
`}focus(e){var i;null===(i=t(this,be,"a",pe))||void 0===i||i.focus(e)}}ge=new WeakMap,be=new WeakSet,pe=function(){var t;return null!==(t=this.renderRoot.querySelector("button"))&&void 0!==t?t:null},fe.styles=[X`
|
|
459
459
|
:host {
|
|
460
|
-
--m-close-button-color: ${
|
|
461
|
-
--m-close-button-outline-color: ${
|
|
460
|
+
--m-close-button-color: ${Bt("color-text-primary")};
|
|
461
|
+
--m-close-button-outline-color: ${Bt("color-primary-100")};
|
|
462
462
|
--m-close-button-outline-offset: 2px;
|
|
463
463
|
}
|
|
464
464
|
|
|
@@ -468,8 +468,8 @@ const dt=t=>null!=t?t:z
|
|
|
468
468
|
|
|
469
469
|
width: var(--button-size);
|
|
470
470
|
height: var(--button-size);
|
|
471
|
-
${
|
|
472
|
-
${
|
|
471
|
+
${Ot(0)};
|
|
472
|
+
${qt(0)};
|
|
473
473
|
background-color: var(--button-color);
|
|
474
474
|
border: none;
|
|
475
475
|
border-radius: 50%;
|
|
@@ -482,23 +482,23 @@ const dt=t=>null!=t?t:z
|
|
|
482
482
|
}
|
|
483
483
|
|
|
484
484
|
.close-button.-size-small {
|
|
485
|
-
--button-size: ${
|
|
486
|
-
--icon-size: ${
|
|
485
|
+
--button-size: ${de("12px")};
|
|
486
|
+
--icon-size: ${de("8px")};
|
|
487
487
|
}
|
|
488
488
|
|
|
489
489
|
.close-button.-size-default {
|
|
490
|
-
--button-size: ${
|
|
491
|
-
--icon-size: ${
|
|
490
|
+
--button-size: ${de("16px")};
|
|
491
|
+
--icon-size: ${de("12px")};
|
|
492
492
|
}
|
|
493
493
|
|
|
494
494
|
.close-button.-size-large {
|
|
495
|
-
--button-size: ${
|
|
496
|
-
--icon-size: ${
|
|
495
|
+
--button-size: ${de("20px")};
|
|
496
|
+
--icon-size: ${de("16px")};
|
|
497
497
|
}
|
|
498
498
|
|
|
499
499
|
.close-button.-inverted {
|
|
500
500
|
--button-color: transparent;
|
|
501
|
-
--icon-color: ${
|
|
501
|
+
--icon-color: ${Bt("color-text-inverted")};
|
|
502
502
|
}
|
|
503
503
|
|
|
504
504
|
m-icon {
|
|
@@ -508,45 +508,45 @@ const dt=t=>null!=t?t:z
|
|
|
508
508
|
display: block;
|
|
509
509
|
}
|
|
510
510
|
|
|
511
|
-
${
|
|
511
|
+
${It.focus(".close-button")} {
|
|
512
512
|
outline: 1px solid var(--m-close-button-outline-color);
|
|
513
513
|
outline-offset: var(--m-close-button-outline-offset);
|
|
514
514
|
}
|
|
515
515
|
|
|
516
|
-
${
|
|
516
|
+
${It.hover(".close-button")} {
|
|
517
517
|
--button-color: var(--m-close-button-color);
|
|
518
|
-
--icon-color: ${
|
|
518
|
+
--icon-color: ${Bt("color-text-inverted")};
|
|
519
519
|
}
|
|
520
520
|
|
|
521
|
-
${
|
|
522
|
-
--button-color: ${
|
|
521
|
+
${It.hover(".close-button.-inverted")} {
|
|
522
|
+
--button-color: ${Bt("color-text-inverted")};
|
|
523
523
|
--icon-color: var(--m-close-button-color);
|
|
524
524
|
}
|
|
525
525
|
|
|
526
|
-
${
|
|
527
|
-
--icon-color: ${
|
|
526
|
+
${Gt(".close-button")} {
|
|
527
|
+
--icon-color: ${Bt("color-text-disabled")};
|
|
528
528
|
cursor: default;
|
|
529
529
|
}
|
|
530
530
|
|
|
531
|
-
${
|
|
531
|
+
${Gt(".close-button","*")} {
|
|
532
532
|
pointer-events: none;
|
|
533
533
|
}
|
|
534
|
-
`],window.customElements.define("m-close-button",
|
|
534
|
+
`],window.customElements.define("m-close-button",fe);
|
|
535
535
|
/**
|
|
536
536
|
* @license
|
|
537
537
|
* Copyright 2018 Google LLC
|
|
538
538
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
539
539
|
*/
|
|
540
|
-
const
|
|
540
|
+
const $e="important",ye=" !"+$e,ve=ut(class extends bt{constructor(t){var e;if(super(t),t.type!==ht||"style"!==t.name||(null===(e=t.strings)||void 0===e?void 0:e.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((e,i)=>{const o=t[i];return null==o?e:e+`${i=i.includes("-")?i:i.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${o};`}),"")}update(t,[e]){const{style:i}=t.element;if(void 0===this.ut){this.ut=new Set;for(const t in e)this.ut.add(t);return this.render(e)}this.ut.forEach((t=>{null==e[t]&&(this.ut.delete(t),t.includes("-")?i.removeProperty(t):i[t]="")}));for(const t in e){const o=e[t];if(null!=o){this.ut.add(t);const e="string"==typeof o&&o.endsWith(ye);t.includes("-")||e?i.setProperty(t,e?o.slice(0,-11):o,e?$e:""):i[t]=o}}return k}});class we extends(gt(lt,["h1","h2","h3","h4","h5","h6","p","span"],"span")){static get properties(){return{color:{type:String},ellipsized:{type:Boolean,reflect:!0},variant:{type:String,reflect:!0}}}constructor(){super(),this.as="span",this.color="color-text-primary",this.ellipsized=!1,this.variant="body-md"}render(){return N`
|
|
541
541
|
<${this.tag}
|
|
542
|
-
class=${
|
|
543
|
-
style=${
|
|
542
|
+
class=${pt({"m-text":!0,"-body-lg-bold":"body-lg-bold"===this.variant,"-body-lg":"body-lg"===this.variant,"-body-md-bold-underline":"body-md-bold-underline"===this.variant,"-body-md-bold":"body-md-bold"===this.variant,"-body-md-underline":"body-md-underline"===this.variant,"-body-md":"body-md"===this.variant,"-body-sm-bold-underline":"body-sm-bold-underline"===this.variant,"-body-sm-bold":"body-sm-bold"===this.variant,"-body-sm-underline":"body-sm-underline"===this.variant,"-body-sm":"body-sm"===this.variant,"-button-lg":"button-lg"===this.variant,"-button-md":"button-md"===this.variant,"-button-sm":"button-sm"===this.variant,"-chips-md":"chips-md"===this.variant,"-chips-sm":"chips-sm"===this.variant,"-heading-lg-bold":"heading-lg-bold"===this.variant,"-heading-lg":"heading-lg"===this.variant,"-heading-md-bold":"heading-md-bold"===this.variant,"-heading-md":"heading-md"===this.variant,"-heading-sm-bold":"heading-sm-bold"===this.variant,"-heading-sm":"heading-sm"===this.variant,"-hero-lg-bold":"hero-lg-bold"===this.variant,"-hero-lg":"hero-lg"===this.variant,"-hero-md-bold":"hero-md-bold"===this.variant,"-hero-md":"hero-md"===this.variant,"-hero-sm-bold":"hero-sm-bold"===this.variant,"-hero-sm":"hero-sm"===this.variant,"-number-md":"number-md"===this.variant,"-number-sm":"number-sm"===this.variant,"-table-header-md":"table-header-md"===this.variant,"-table-header-sm":"table-header-sm"===this.variant,"-ellipsized":Boolean(this.ellipsized)})}
|
|
543
|
+
style=${ve({"--m-text-color":vt(this.color)})}
|
|
544
544
|
>
|
|
545
545
|
<slot></slot>
|
|
546
546
|
</${this.tag}>
|
|
547
|
-
`}}var
|
|
547
|
+
`}}var xe,ke;we.styles=[X`
|
|
548
548
|
:host {
|
|
549
|
-
--m-text-color: ${
|
|
549
|
+
--m-text-color: ${Bt("color-text-primary")};
|
|
550
550
|
--m-text-display: inline-block;
|
|
551
551
|
--m-text-max-width: initial;
|
|
552
552
|
--m-text-padding: 0;
|
|
@@ -694,15 +694,15 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
694
694
|
white-space: nowrap;
|
|
695
695
|
max-width: var(--m-text-max-width);
|
|
696
696
|
}
|
|
697
|
-
`],window.customElements.define("m-text",
|
|
697
|
+
`],window.customElements.define("m-text",we);class ze extends se{static get properties(){return{variant:{type:String},dismissible:{type:Boolean},dismissed:{type:Boolean,reflect:!0}}}constructor(){super(),xe.set(this,void 0),ke.set(this,(()=>{this.dismissed=!0,this.emit("m-dismiss",{composed:!0})})),this.variant="neutral",this.dismissible=!1,this.dismissed=!1}get primaryAction(){return null==t(this,xe,"f")&&e(this,xe,this.querySelector("m-banner-action-primary"),"f"),t(this,xe,"f")}updated(t){super.updated(t),t.has("variant")&&null!=this.primaryAction&&(this.primaryAction.variant=function(t){switch(t){case"warning":return"warning";case"danger":return"danger";default:return"primary"}}(this.variant))}render(){if(this.dismissed)return z;const e=null!=this.querySelector("*[slot='description']"),i=null!=this.querySelector("*[slot='actions']"),o=x`
|
|
698
698
|
<m-close-button
|
|
699
699
|
id="close"
|
|
700
700
|
label="Dismiss"
|
|
701
|
-
@click=${t(this,
|
|
701
|
+
@click=${t(this,ke,"f")}
|
|
702
702
|
></m-close-button>
|
|
703
703
|
`;return x`
|
|
704
704
|
<div
|
|
705
|
-
class=${
|
|
705
|
+
class=${pt({banner:!0,"-success":"success"===this.variant,"-warning":"warning"===this.variant,"-danger":"danger"===this.variant,"-with-description":e})}
|
|
706
706
|
>
|
|
707
707
|
<div class="wrapper">
|
|
708
708
|
<slot name="icon">
|
|
@@ -716,7 +716,7 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
716
716
|
</div>
|
|
717
717
|
<slot name="actions"></slot>
|
|
718
718
|
</div>
|
|
719
|
-
`}}
|
|
719
|
+
`}}xe=new WeakMap,ke=new WeakMap,ze.styles=[X`
|
|
720
720
|
:host {
|
|
721
721
|
display: block;
|
|
722
722
|
width: 100%;
|
|
@@ -729,34 +729,34 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
729
729
|
.banner {
|
|
730
730
|
background-color: var(
|
|
731
731
|
--m-banner-background-color,
|
|
732
|
-
${
|
|
732
|
+
${Bt("color-background-secondary")}
|
|
733
733
|
);
|
|
734
|
-
border: var(--m-banner-border, 1px solid ${
|
|
735
|
-
border-radius: var(--m-banner-border-radius, ${
|
|
736
|
-
padding-inline: var(--m-banner-padding-x, ${
|
|
737
|
-
padding-block: var(--m-banner-padding-y, ${
|
|
734
|
+
border: var(--m-banner-border, 1px solid ${Bt("color-border")});
|
|
735
|
+
border-radius: var(--m-banner-border-radius, ${jt("border-radius-m")});
|
|
736
|
+
padding-inline: var(--m-banner-padding-x, ${jt("spacing-6")});
|
|
737
|
+
padding-block: var(--m-banner-padding-y, ${jt("spacing-4")});
|
|
738
738
|
display: flex;
|
|
739
739
|
flex-wrap: wrap;
|
|
740
740
|
justify-content: flex-end;
|
|
741
|
-
gap: ${
|
|
741
|
+
gap: ${jt("spacing-6")};
|
|
742
742
|
}
|
|
743
743
|
|
|
744
744
|
.banner.-success {
|
|
745
|
-
--m-banner-background-color: ${
|
|
746
|
-
--m-banner-border: 1px solid ${
|
|
747
|
-
--m-banner-icon-color: ${
|
|
745
|
+
--m-banner-background-color: ${Bt("color-success-20")};
|
|
746
|
+
--m-banner-border: 1px solid ${Bt("color-success-20")};
|
|
747
|
+
--m-banner-icon-color: ${Bt("color-success-60")};
|
|
748
748
|
}
|
|
749
749
|
|
|
750
750
|
.banner.-warning {
|
|
751
|
-
--m-banner-background-color: ${
|
|
752
|
-
--m-banner-border: 1px solid ${
|
|
753
|
-
--m-banner-icon-color: ${
|
|
751
|
+
--m-banner-background-color: ${Bt("color-warning-20")};
|
|
752
|
+
--m-banner-border: 1px solid ${Bt("color-warning-20")};
|
|
753
|
+
--m-banner-icon-color: ${Bt("color-warning-100")};
|
|
754
754
|
}
|
|
755
755
|
|
|
756
756
|
.banner.-danger {
|
|
757
|
-
--m-banner-background-color: ${
|
|
758
|
-
--m-banner-border: 1px solid ${
|
|
759
|
-
--m-banner-icon-color: ${
|
|
757
|
+
--m-banner-background-color: ${Bt("color-danger-20")};
|
|
758
|
+
--m-banner-border: 1px solid ${Bt("color-danger-20")};
|
|
759
|
+
--m-banner-icon-color: ${Bt("color-danger-60")};
|
|
760
760
|
}
|
|
761
761
|
|
|
762
762
|
.banner.-with-description {
|
|
@@ -765,17 +765,17 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
765
765
|
|
|
766
766
|
.wrapper {
|
|
767
767
|
display: flex;
|
|
768
|
-
gap: ${
|
|
768
|
+
gap: ${jt("spacing-6")};
|
|
769
769
|
align-items: center;
|
|
770
770
|
flex-grow: 1;
|
|
771
771
|
}
|
|
772
772
|
|
|
773
773
|
slot[name='icon'] > m-icon,
|
|
774
774
|
slot[name='icon']::slotted(*) {
|
|
775
|
-
--m-icon-color: var(--m-banner-icon-color, ${
|
|
775
|
+
--m-icon-color: var(--m-banner-icon-color, ${Bt("color-neutral-90")});
|
|
776
776
|
--m-icon-size: var(--m-banner-icon-size, 24px);
|
|
777
777
|
|
|
778
|
-
fill: var(--m-banner-icon-color, ${
|
|
778
|
+
fill: var(--m-banner-icon-color, ${Bt("color-neutral-90")});
|
|
779
779
|
block-size: var(--m-banner-icon-size, 24px);
|
|
780
780
|
inline-size: var(--m-banner-icon-size, 24px);
|
|
781
781
|
}
|
|
@@ -784,12 +784,12 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
784
784
|
display: flex;
|
|
785
785
|
flex-direction: column;
|
|
786
786
|
flex-grow: 1;
|
|
787
|
-
gap: ${
|
|
787
|
+
gap: ${jt("spacing-1")};
|
|
788
788
|
}
|
|
789
|
-
`],window.customElements.define("m-banner",
|
|
789
|
+
`],window.customElements.define("m-banner",ze);class Se extends lt{static get properties(){return{flagged:{type:Boolean},flagColor:{type:String,attribute:"flag-color"}}}constructor(){super(),this.flagged=!1,this.flagColor="color-background-inverted"}render(){return x`
|
|
790
790
|
<div
|
|
791
791
|
class="m-card"
|
|
792
|
-
style="${
|
|
792
|
+
style="${ve({"--m-card-flag-color":vt(this.flagColor)})}"
|
|
793
793
|
>
|
|
794
794
|
${this.flagged?x`<span class="m-card-flag"></span>`:z}
|
|
795
795
|
<div class="m-card-content">
|
|
@@ -799,9 +799,9 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
799
799
|
<slot name="body"></slot>
|
|
800
800
|
</div>
|
|
801
801
|
</div>
|
|
802
|
-
`}}
|
|
802
|
+
`}}Se.styles=[X`
|
|
803
803
|
:host {
|
|
804
|
-
--m-card-background-color: ${
|
|
804
|
+
--m-card-background-color: ${Bt("color-background-primary")};
|
|
805
805
|
}
|
|
806
806
|
|
|
807
807
|
.m-card {
|
|
@@ -810,8 +810,8 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
810
810
|
flex-direction: row;
|
|
811
811
|
|
|
812
812
|
background-color: var(--m-card-background-color);
|
|
813
|
-
border-radius: ${
|
|
814
|
-
border: solid 1px ${
|
|
813
|
+
border-radius: ${jt("border-radius-s")};
|
|
814
|
+
border: solid 1px ${Bt("color-divider")};
|
|
815
815
|
}
|
|
816
816
|
|
|
817
817
|
.m-card-flag {
|
|
@@ -824,11 +824,11 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
824
824
|
box-sizing: border-box;
|
|
825
825
|
border: 1px solid var(--m-card-flag-color);
|
|
826
826
|
background-color: var(--m-card-flag-color);
|
|
827
|
-
width: ${
|
|
828
|
-
border-top-left-radius: ${
|
|
827
|
+
width: ${jt("border-thick")};
|
|
828
|
+
border-top-left-radius: ${jt("border-radius-s")};
|
|
829
829
|
border-top-right-radius: 0;
|
|
830
830
|
border-bottom-right-radius: 0;
|
|
831
|
-
border-bottom-left-radius: ${
|
|
831
|
+
border-bottom-left-radius: ${jt("border-radius-s")};
|
|
832
832
|
}
|
|
833
833
|
|
|
834
834
|
.m-card-content {
|
|
@@ -838,29 +838,29 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
838
838
|
}
|
|
839
839
|
|
|
840
840
|
::slotted(m-divider) {
|
|
841
|
-
--m-divider-margin-top: ${
|
|
841
|
+
--m-divider-margin-top: ${jt("spacing-4")};
|
|
842
842
|
}
|
|
843
|
-
`],window.customElements.define("m-card",
|
|
843
|
+
`],window.customElements.define("m-card",Se);class Ce extends lt{static get properties(){return{slot:{type:String}}}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","body")}render(){return x`
|
|
844
844
|
<div class="m-card-body">
|
|
845
845
|
<slot></slot>
|
|
846
846
|
</div>
|
|
847
|
-
`}}
|
|
847
|
+
`}}Ce.styles=[X`
|
|
848
848
|
:host {
|
|
849
|
-
--m-card-body-padding-x: ${
|
|
850
|
-
--m-card-body-padding-y: ${
|
|
849
|
+
--m-card-body-padding-x: ${jt("spacing-4")};
|
|
850
|
+
--m-card-body-padding-y: ${jt("spacing-4")};
|
|
851
851
|
}
|
|
852
852
|
|
|
853
853
|
.m-card-body {
|
|
854
854
|
padding: var(--m-card-body-padding-y) var(--m-card-body-padding-x);
|
|
855
855
|
}
|
|
856
|
-
`],window.customElements.define("m-card-body",
|
|
856
|
+
`],window.customElements.define("m-card-body",Ce);class We extends lt{static get properties(){return{slot:{type:String}}}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","subtitle")}render(){return x`
|
|
857
857
|
<div class="m-card-subtitle">
|
|
858
858
|
<slot></slot>
|
|
859
859
|
</div>
|
|
860
|
-
`}}
|
|
860
|
+
`}}We.styles=[X`
|
|
861
861
|
:host {
|
|
862
|
-
--m-card-subtitle-margin-top: ${
|
|
863
|
-
--m-card-subtitle-padding-x: ${
|
|
862
|
+
--m-card-subtitle-margin-top: ${jt("spacing-2")};
|
|
863
|
+
--m-card-subtitle-padding-x: ${jt("spacing-4")};
|
|
864
864
|
--m-card-subtitle-padding-y: 0;
|
|
865
865
|
}
|
|
866
866
|
|
|
@@ -870,24 +870,24 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
870
870
|
margin-block-start: var(--m-card-subtitle-margin-top);
|
|
871
871
|
padding: var(--m-card-subtitle-padding-y) var(--m-card-subtitle-padding-x);
|
|
872
872
|
|
|
873
|
-
color: ${
|
|
873
|
+
color: ${Bt("color-text-tertiary")};
|
|
874
874
|
}
|
|
875
|
-
`],window.customElements.define("m-card-subtitle",
|
|
875
|
+
`],window.customElements.define("m-card-subtitle",We);class Me extends lt{static get properties(){return{slot:{type:String}}}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","title")}render(){return x`
|
|
876
876
|
<div class="m-card-title">
|
|
877
877
|
<slot name="leading"></slot>
|
|
878
878
|
<slot></slot>
|
|
879
879
|
</div>
|
|
880
|
-
`}}
|
|
880
|
+
`}}Me.styles=[X`
|
|
881
881
|
:host {
|
|
882
|
-
--m-card-title-padding-x: ${
|
|
883
|
-
--m-card-title-padding-top: ${
|
|
882
|
+
--m-card-title-padding-x: ${jt("spacing-4")};
|
|
883
|
+
--m-card-title-padding-top: ${jt("spacing-4")};
|
|
884
884
|
}
|
|
885
885
|
|
|
886
886
|
.m-card-title {
|
|
887
887
|
padding: var(--m-card-title-padding-top) var(--m-card-title-padding-x) 0;
|
|
888
888
|
|
|
889
889
|
${Lt("heading-sm-bold")};
|
|
890
|
-
color: ${
|
|
890
|
+
color: ${Bt("color-text-primary")};
|
|
891
891
|
}
|
|
892
892
|
|
|
893
893
|
slot[name='leading']::slotted(*) {
|
|
@@ -896,34 +896,34 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
896
896
|
align-items: center;
|
|
897
897
|
justify-content: center;
|
|
898
898
|
pointer-events: none;
|
|
899
|
-
margin-inline-end: ${
|
|
899
|
+
margin-inline-end: ${jt("spacing-1")};
|
|
900
900
|
}
|
|
901
|
-
`],window.customElements.define("m-card-title",
|
|
902
|
-
<label for="${
|
|
901
|
+
`],window.customElements.define("m-card-title",Me);const je={delay:"0s",duration:"0.35s",easing:"ease-in-out"};var Be,Ae,Ee;class _e extends lt{static get properties(){return{name:{type:String},disabled:{type:Boolean,reflect:!0},checked:{type:Boolean,reflect:!0},indeterminate:{type:Boolean,reflect:!0}}}constructor(){super(),Be.add(this),Ee.set(this,(t=>{const e=t.target,i=new CustomEvent("m-change",{cancelable:!1,composed:!1,bubbles:!0,detail:{checked:e.checked,indeterminate:e.indeterminate}});this.dispatchEvent(i),this.checked=e.checked,this.indeterminate=e.indeterminate})),this.name=void 0,this.disabled=!1,this.checked=!1,this.indeterminate=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","checkbox")}disconnectedCallback(){super.connectedCallback()}firstUpdated(){this.input=this.renderRoot.querySelector("input"),this.label=this.renderRoot.querySelector("label")}updated(){t(this,Be,"m",Ae).call(this)}render(){return x`
|
|
902
|
+
<label for="${ct(this.id)}" class="check-input-label">
|
|
903
903
|
<input
|
|
904
|
-
id="${
|
|
905
|
-
name="${
|
|
904
|
+
id="${ct(this.id)}"
|
|
905
|
+
name="${ct(this.name)}"
|
|
906
906
|
type="checkbox"
|
|
907
907
|
class="check-input"
|
|
908
908
|
?disabled="${this.disabled}"
|
|
909
909
|
?checked="${this.checked}"
|
|
910
|
-
@change=${t(this,
|
|
910
|
+
@change=${t(this,Ee,"f")}
|
|
911
911
|
/>
|
|
912
912
|
<m-icon name="check" class="check-icon"></m-icon>
|
|
913
913
|
<m-icon name="indeterminate" class="indeterminate-icon"></m-icon>
|
|
914
914
|
<slot name="leading"></slot>
|
|
915
915
|
<slot></slot>
|
|
916
916
|
</label>
|
|
917
|
-
`}focus(t){var e;null===(e=this.input)||void 0===e||e.focus(t)}}
|
|
918
|
-
${
|
|
917
|
+
`}focus(t){var e;null===(e=this.input)||void 0===e||e.focus(t)}}Ee=new WeakMap,Be=new WeakSet,Ae=function(){this.setAttribute("aria-disabled",this.disabled.toString()),this.setAttribute("aria-checked",this.indeterminate?"mixed":this.checked.toString()),this.input.indeterminate=this.indeterminate},_e.styles=[X`
|
|
918
|
+
${It.focus(".check-input-label")} {
|
|
919
919
|
border-radius: 2px;
|
|
920
|
-
outline: 1px solid ${
|
|
920
|
+
outline: 1px solid ${Bt("color-primary-60")};
|
|
921
921
|
}
|
|
922
922
|
|
|
923
923
|
.check-input-label {
|
|
924
924
|
${Lt("body-md")};
|
|
925
925
|
|
|
926
|
-
gap: ${
|
|
926
|
+
gap: ${jt("spacing-1")};
|
|
927
927
|
align-items: center;
|
|
928
928
|
display: inline-flex;
|
|
929
929
|
padding: 4px 2px;
|
|
@@ -935,66 +935,66 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
935
935
|
}
|
|
936
936
|
|
|
937
937
|
.check-input {
|
|
938
|
-
--checkbox-input-size: ${
|
|
938
|
+
--checkbox-input-size: ${jt("font-size-4")};
|
|
939
939
|
|
|
940
|
-
color: ${
|
|
940
|
+
color: ${Bt("color-text-tertiary")};
|
|
941
941
|
width: var(--checkbox-input-size);
|
|
942
942
|
height: var(--checkbox-input-size);
|
|
943
|
-
background: ${
|
|
943
|
+
background: ${Bt("color-neutral-0")};
|
|
944
944
|
appearance: none;
|
|
945
945
|
outline: none;
|
|
946
946
|
border-style: solid;
|
|
947
|
-
border-radius: ${
|
|
948
|
-
border-color: ${
|
|
949
|
-
border-width: ${
|
|
947
|
+
border-radius: ${jt("border-radius-s")};
|
|
948
|
+
border-color: ${Bt("color-border")};
|
|
949
|
+
border-width: ${jt("border-thin")};
|
|
950
950
|
margin: 0;
|
|
951
|
-
${Nt([{property:"border",...
|
|
951
|
+
${Nt([{property:"border",...je},{property:"background",...je}])};
|
|
952
952
|
}
|
|
953
953
|
|
|
954
954
|
.check-input:indeterminate,
|
|
955
955
|
.check-input:checked {
|
|
956
|
-
background: ${
|
|
957
|
-
border-color: ${
|
|
956
|
+
background: ${Bt("color-primary-60")};
|
|
957
|
+
border-color: ${Bt("color-primary-60")};
|
|
958
958
|
}
|
|
959
959
|
|
|
960
|
-
${
|
|
961
|
-
background: ${
|
|
960
|
+
${Gt(".check-input")} {
|
|
961
|
+
background: ${Bt("color-background-tertiary")};
|
|
962
962
|
cursor: not-allowed;
|
|
963
963
|
}
|
|
964
964
|
|
|
965
|
-
${
|
|
966
|
-
${
|
|
967
|
-
background: ${
|
|
968
|
-
border-color: ${
|
|
965
|
+
${Gt(".check-input:indeterminate")},
|
|
966
|
+
${Gt(".check-input:checked")} {
|
|
967
|
+
background: ${Bt("color-neutral-40")};
|
|
968
|
+
border-color: ${Bt("color-neutral-40")};
|
|
969
969
|
}
|
|
970
970
|
|
|
971
|
-
${
|
|
972
|
-
${
|
|
973
|
-
background: ${
|
|
974
|
-
border-color: ${
|
|
971
|
+
${It.hover(".check-input:indeterminate")},
|
|
972
|
+
${It.hover(".check-input:checked")} {
|
|
973
|
+
background: ${Bt("color-primary-100")};
|
|
974
|
+
border-color: ${Bt("color-primary-100")};
|
|
975
975
|
}
|
|
976
976
|
|
|
977
|
-
${
|
|
978
|
-
border-color: ${
|
|
977
|
+
${It.hover(".check-input")} {
|
|
978
|
+
border-color: ${Bt("color-primary-100")};
|
|
979
979
|
}
|
|
980
980
|
|
|
981
981
|
:host([disabled]) .check-input-label {
|
|
982
982
|
cursor: not-allowed;
|
|
983
|
-
color: ${
|
|
983
|
+
color: ${Bt("color-text-disabled")};
|
|
984
984
|
}
|
|
985
985
|
|
|
986
986
|
.check-icon,
|
|
987
987
|
.indeterminate-icon {
|
|
988
988
|
--m-icon-size: 1em;
|
|
989
|
-
--m-icon-color: ${
|
|
989
|
+
--m-icon-color: ${Bt("color-neutral-0")};
|
|
990
990
|
|
|
991
991
|
position: absolute;
|
|
992
992
|
|
|
993
993
|
pointer-events: none;
|
|
994
|
-
border-width: ${
|
|
994
|
+
border-width: ${jt("border-thin")};
|
|
995
995
|
border-style: solid;
|
|
996
996
|
border-color: transparent;
|
|
997
|
-
border-radius: ${
|
|
997
|
+
border-radius: ${jt("border-radius-s")};
|
|
998
998
|
display: none;
|
|
999
999
|
}
|
|
1000
1000
|
|
|
@@ -1002,13 +1002,13 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
1002
1002
|
.check-input:indeterminate:not(:checked) ~ .indeterminate-icon {
|
|
1003
1003
|
display: inline-flex;
|
|
1004
1004
|
}
|
|
1005
|
-
`],window.customElements.define("m-checkbox",
|
|
1005
|
+
`],window.customElements.define("m-checkbox",_e);
|
|
1006
1006
|
/**
|
|
1007
1007
|
* @license
|
|
1008
1008
|
* Copyright 2021 Google LLC
|
|
1009
1009
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
1010
1010
|
*/
|
|
1011
|
-
let
|
|
1011
|
+
let Te=class extends Event{constructor(t,e,i){super("context-request",{bubbles:!0,composed:!0}),this.context=t,this.callback=e,this.subscribe=i}};
|
|
1012
1012
|
/**
|
|
1013
1013
|
* @license
|
|
1014
1014
|
* Copyright 2021 Google LLC
|
|
@@ -1019,27 +1019,27 @@ let _e=class extends Event{constructor(t,e,i){super("context-request",{bubbles:!
|
|
|
1019
1019
|
* Copyright 2021 Google LLC
|
|
1020
1020
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
1021
1021
|
*/
|
|
1022
|
-
let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,this.subscribe=o,this.provided=!1,this.value=void 0,this.host.addController(this)}hostConnected(){this.dispatchRequest()}hostDisconnected(){this.unsubscribe&&(this.unsubscribe(),this.unsubscribe=void 0)}dispatchRequest(){this.host.dispatchEvent(new
|
|
1022
|
+
let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,this.subscribe=o,this.provided=!1,this.value=void 0,this.host.addController(this)}hostConnected(){this.dispatchRequest()}hostDisconnected(){this.unsubscribe&&(this.unsubscribe(),this.unsubscribe=void 0)}dispatchRequest(){this.host.dispatchEvent(new Te(this.context,((t,e)=>{this.unsubscribe&&(this.unsubscribe!==e&&(this.provided=!1,this.unsubscribe()),this.subscribe||this.unsubscribe()),this.value=t,this.host.requestUpdate(),this.provided&&!this.subscribe||(this.provided=!0,this.callback&&this.callback(t,e)),this.unsubscribe=e}),this.subscribe))}},Oe=class{constructor(t){this.callbacks=new Map,this.updateObservers=()=>{for(const[t,e]of this.callbacks)t(this.t,e)},void 0!==t&&(this.value=t)}get value(){return this.t}set value(t){this.setValue(t)}setValue(t,e=!1){const i=e||!Object.is(t,this.t);this.t=t,i&&this.updateObservers()}addCallback(t,e){e&&(this.callbacks.has(t)||this.callbacks.set(t,(()=>{this.callbacks.delete(t)}))),t(this.value)}clearCallbacks(){this.callbacks.clear()}},Re=class extends Event{constructor(t){super("context-provider",{bubbles:!0,composed:!0}),this.context=t}},Ue=class extends Oe{constructor(t,e,i){super(i),this.host=t,this.context=e,this.onContextRequest=t=>{t.context===this.context&&t.composedPath()[0]!==this.host&&(t.stopPropagation(),this.addCallback(t.callback,t.subscribe))},this.attachListeners(),this.host.addController(this)}attachListeners(){this.host.addEventListener("context-request",this.onContextRequest)}hostConnected(){this.host.dispatchEvent(new Re(this.context))}},qe=!1;
|
|
1023
1023
|
/**
|
|
1024
1024
|
* @license
|
|
1025
1025
|
* Copyright 2021 Google LLC
|
|
1026
1026
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
1027
|
-
*/function
|
|
1027
|
+
*/function De(){if(qe)return;const t=new class{constructor(){this.pendingContextRequests=new Map,this.onContextProvider=t=>{const e=this.pendingContextRequests.get(t.context);e&&(this.pendingContextRequests.delete(t.context),e.forEach((e=>{const i=e.element,o=e.callback;i&&i.dispatchEvent(new Te(t.context,o,!0))})))},this.onContextRequest=t=>{if(!t.subscribe)return;const e={element:t.target,callback:t.callback};let i=this.pendingContextRequests.get(t.context);i||(i=new Set,this.pendingContextRequests.set(t.context,i)),i.add(e)}}attach(t){t.addEventListener("context-request",this.onContextRequest),t.addEventListener("context-provider",this.onContextProvider)}detach(t){t.removeEventListener("context-request",this.onContextRequest),t.removeEventListener("context-provider",this.onContextProvider)}};t.attach(document.body),qe=!0}async function Ne(t,e){const i=t.getAnimations(e).map((({finished:t})=>t));await Promise.allSettled(i)}const Le=Symbol("dialog");var Ge,Ie,Ve,Je,He,Xe,Ye,Ze;De();class Fe extends se{static get properties(){return{open:{type:Boolean,reflect:!0},size:{type:String,reflect:!0},variant:{type:String,reflect:!0}}}constructor(){super(),Ge.add(this),Ie.set(this,new Ue(this,Le,{variant:"neutral"})),this.open=!1,this.size="small",this.variant="neutral"}render(){return x`
|
|
1028
1028
|
<dialog
|
|
1029
|
-
class="${
|
|
1030
|
-
@click=${t(this,
|
|
1031
|
-
@cancel=${t(this,
|
|
1029
|
+
class="${pt({"-size-small":"small"===this.size||!this.size,"-size-medium":"medium"===this.size,"-size-large":"large"===this.size,"-size-extra-large":"extra-large"===this.size})}"
|
|
1030
|
+
@click=${t(this,Ge,"m",Ye)}
|
|
1031
|
+
@cancel=${t(this,Ge,"m",Ze)}
|
|
1032
1032
|
>
|
|
1033
1033
|
<slot name="header"></slot>
|
|
1034
1034
|
<slot name="body"></slot>
|
|
1035
1035
|
<slot name="footer"></slot>
|
|
1036
1036
|
<slot name="actions"></slot>
|
|
1037
1037
|
</dialog>
|
|
1038
|
-
`}updated(e){var i;super.updated(e),e.has("variant")&&t(this,
|
|
1038
|
+
`}updated(e){var i;super.updated(e),e.has("variant")&&t(this,Ie,"f").setValue({variant:null!==(i=this.variant)&&void 0!==i?i:"neutral"}),e.has("open")&&t(this,Ge,"m",Je).call(this,e.get("open"))}show(){this.open=!0}hide(){this.open=!1}}Ie=new WeakMap,Ge=new WeakSet,Ve=function(){var t;return null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector("dialog")},Je=async function(e){const i=t(this,Ge,"a",Ve);i&&(!e&&this.open?(this.style.display="block",t(this,Ge,"m",He).call(this,"m-opening"),i.showModal(),await Ne(i),t(this,Ge,"m",He).call(this,"m-opened")):e&&!this.open?(t(this,Ge,"m",He).call(this,"m-closing"),i.classList.add("is-hiding"),await Ne(i),i.classList.remove("is-hiding"),i.close(),t(this,Ge,"m",He).call(this,"m-closed"),this.style.display="none"):null!=e||this.open||(this.style.display="none"))},He=function(t){this.emit(t,{cancelable:!1,bubbles:!1})},Xe=function(){this.open&&this.emit("m-close")},Ye=function(e){var i;const o=e.target instanceof HTMLDialogElement,r=null===(i=t(this,Ge,"a",Ve))||void 0===i?void 0:i.getBoundingClientRect();if(o&&r){(e.clientY<r.top||e.clientY>r.bottom||e.clientX<r.left||e.clientX>r.right)&&(e.preventDefault(),e.stopPropagation(),t(this,Ge,"m",Xe).call(this))}},Ze=function(e){e.preventDefault(),t(this,Ge,"m",Xe).call(this)},Fe.styles=[X`
|
|
1039
1039
|
:host {
|
|
1040
|
-
--margin: ${
|
|
1041
|
-
--padding: ${
|
|
1042
|
-
--gap: ${
|
|
1040
|
+
--margin: ${jt("spacing-6")};
|
|
1041
|
+
--padding: ${jt("spacing-6")};
|
|
1042
|
+
--gap: ${jt("spacing-6")};
|
|
1043
1043
|
}
|
|
1044
1044
|
|
|
1045
1045
|
slot::slotted(*) {
|
|
@@ -1051,9 +1051,9 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1051
1051
|
box-sizing: border-box;
|
|
1052
1052
|
padding: calc(var(--padding) - (var(--gap) / 2)) 0;
|
|
1053
1053
|
border: none;
|
|
1054
|
-
border-radius: ${
|
|
1054
|
+
border-radius: ${jt("border-radius-m")};
|
|
1055
1055
|
background-color: white;
|
|
1056
|
-
box-shadow: ${
|
|
1056
|
+
box-shadow: ${jt("elevation-4")};
|
|
1057
1057
|
width: auto;
|
|
1058
1058
|
max-height: calc(100% - var(--margin));
|
|
1059
1059
|
|
|
@@ -1066,23 +1066,23 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1066
1066
|
}
|
|
1067
1067
|
|
|
1068
1068
|
dialog.-size-small {
|
|
1069
|
-
max-width: min(${
|
|
1069
|
+
max-width: min(${de("400px")}, calc(100vw - var(--margin)));
|
|
1070
1070
|
}
|
|
1071
1071
|
|
|
1072
1072
|
dialog.-size-medium {
|
|
1073
|
-
max-width: min(${
|
|
1073
|
+
max-width: min(${de("600px")}, calc(100% - var(--margin)));
|
|
1074
1074
|
}
|
|
1075
1075
|
|
|
1076
1076
|
dialog.-size-large {
|
|
1077
|
-
max-width: min(${
|
|
1077
|
+
max-width: min(${de("800px")}, calc(100% - var(--margin)));
|
|
1078
1078
|
}
|
|
1079
1079
|
|
|
1080
1080
|
dialog.-size-extra-large {
|
|
1081
|
-
max-width: min(${
|
|
1081
|
+
max-width: min(${de("1000px")}, calc(100% - var(--margin)));
|
|
1082
1082
|
}
|
|
1083
1083
|
|
|
1084
1084
|
dialog::backdrop {
|
|
1085
|
-
background-color: ${
|
|
1085
|
+
background-color: ${Bt("color-background-secondary-inverted",.4)};
|
|
1086
1086
|
}
|
|
1087
1087
|
|
|
1088
1088
|
@media (prefers-reduced-motion: no-preference) {
|
|
@@ -1128,7 +1128,7 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1128
1128
|
opacity: 0;
|
|
1129
1129
|
}
|
|
1130
1130
|
}
|
|
1131
|
-
`],window.customElements.define("m-dialog",
|
|
1131
|
+
`],window.customElements.define("m-dialog",Fe);const Ke=["small","medium","large","extra-large"],Qe=["neutral","success","warning","danger"];var ti,ei;class ii extends Qt{constructor(){super(),ti.set(this,(t=>{switch(t.variant){case"danger":this.variant="danger";break;case"warning":this.variant="warning";break;default:this.variant="primary"}})),this.type="button",this.variant="primary",this.context=new Pe(this,Le,t(this,ti,"f"),!0)}}ti=new WeakMap,window.customElements.define("m-dialog-action-primary",ii);class oi extends Qt{constructor(){super(),this.type="button",this.variant="secondary"}}window.customElements.define("m-dialog-action-secondary",oi);class ri extends Qt{constructor(){super(),this.type="button",this.variant="tertiary"}}function ni(t,e){var i;const o=e?vt(e):"";return t&&null!==(i="none"===t?"0":vt(t))&&void 0!==i?i:o}window.customElements.define("m-dialog-action-tertiary",ri);class si extends lt{constructor(){super(...arguments),ei.set(this,((t,e)=>{e?this.style.setProperty(t,ni(e)):this.style.removeProperty(t)}))}static get properties(){return{padding:{type:String},paddingX:{type:String,attribute:"padding-x"},paddingY:{type:String,attribute:"padding-y"},paddingT:{type:String,attribute:"padding-t"},paddingB:{type:String,attribute:"padding-b"},paddingL:{type:String,attribute:"padding-l"},paddingR:{type:String,attribute:"padding-r"}}}getCSSPropertiesPrefix(){return"layout"}update(e){super.update(e);const i=this.getCSSPropertiesPrefix();e.has("padding")&&this.style.setProperty(`--m-${i}-padding`,ni(this.padding)),e.has("paddingX")&&t(this,ei,"f").call(this,`--m-${i}-padding-x`,this.paddingX),e.has("paddingY")&&t(this,ei,"f").call(this,`--m-${i}-padding-y`,this.paddingY),e.has("paddingT")&&t(this,ei,"f").call(this,`--m-${i}-padding-t`,this.paddingT),e.has("paddingB")&&t(this,ei,"f").call(this,`--m-${i}-padding-b`,this.paddingB),e.has("paddingL")&&t(this,ei,"f").call(this,`--m-${i}-padding-l`,this.paddingL),e.has("paddingR")&&t(this,ei,"f").call(this,`--m-${i}-padding-r`,this.paddingR)}render(){return x`<slot></slot>`}}function ai(t){return X`
|
|
1132
1132
|
:host {
|
|
1133
1133
|
padding-block-start: var(
|
|
1134
1134
|
--m-${H(t)}-padding-t,
|
|
@@ -1159,11 +1159,11 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1159
1159
|
)
|
|
1160
1160
|
);
|
|
1161
1161
|
}
|
|
1162
|
-
`}
|
|
1162
|
+
`}ei=new WeakMap;const li={gap:"spacing-4",align:"stretch",justify:"flex-start"};class di extends si{static get properties(){return{...super.properties,gap:{type:String},align:{type:String},justify:{type:String}}}constructor(){super(),this.gap=li.gap,this.align=li.align,this.justify=li.justify}getCSSPropertiesPrefix(){return di.CSSPropertiesPrefix}update(t){super.update(t),this.style.setProperty("--m-group-gap",ni(this.gap,li.gap)),this.style.setProperty("--m-group-align",this.align||li.align),this.style.setProperty("--m-group-justify",this.justify||li.justify)}render(){return x`<slot></slot>`}}di.CSSPropertiesPrefix="group",di.styles=[ai(di.CSSPropertiesPrefix),X`
|
|
1163
1163
|
:host {
|
|
1164
|
-
--m-group-gap: ${
|
|
1165
|
-
--m-group-align: ${H(
|
|
1166
|
-
--m-group-justify: ${H(
|
|
1164
|
+
--m-group-gap: ${jt(li.gap)};
|
|
1165
|
+
--m-group-align: ${H(li.align)};
|
|
1166
|
+
--m-group-justify: ${H(li.justify)};
|
|
1167
1167
|
|
|
1168
1168
|
display: flex;
|
|
1169
1169
|
flex-wrap: wrap;
|
|
@@ -1171,21 +1171,21 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1171
1171
|
align-items: var(--m-group-align);
|
|
1172
1172
|
justify-content: var(--m-group-justify);
|
|
1173
1173
|
}
|
|
1174
|
-
`],window.customElements.define("m-group",
|
|
1174
|
+
`],window.customElements.define("m-group",di);class ci extends di{constructor(){super(),this.align="center",this.gap="spacing-3",this.justify="flex-end"}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","actions")}}window.customElements.define("m-dialog-actions",ci);class hi extends lt{connectedCallback(){super.connectedCallback(),this.setAttribute("slot","body")}render(){return x`<slot></slot>`}}hi.styles=[X`
|
|
1175
1175
|
:host {
|
|
1176
1176
|
overflow-y: auto;
|
|
1177
1177
|
overscroll-behavior: contain;
|
|
1178
1178
|
|
|
1179
1179
|
${Lt("body-md")};
|
|
1180
1180
|
}
|
|
1181
|
-
`],window.customElements.define("m-dialog-body",
|
|
1181
|
+
`],window.customElements.define("m-dialog-body",hi);class ui extends fe{constructor(){super(),this.size="large"}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","close")}}window.customElements.define("m-dialog-close",ui);class bi extends lt{connectedCallback(){super.connectedCallback(),this.setAttribute("slot","footer")}render(){return x`<slot></slot>`}}window.customElements.define("m-dialog-footer",bi);const pi=["center","flex-start","flex-end","stretch"],gi=["center","flex-start","flex-end","space-between","space-around","space-evenly"],mi={padding:"spacing-4",borderRadius:"border-radius-s",borderWidth:"border-none",borderColor:"color-background-highlight",textAlign:"left"};class fi extends si{static get properties(){return{...super.properties,backgroundColor:{type:String,attribute:"background-color"},borderRadius:{type:String,attribute:"border-radius"},borderWidth:{type:String,attribute:"border-width"},borderColor:{type:String,attribute:"border-color"},textAlign:{type:String,attribute:"text-align"}}}constructor(){super(),this.padding=mi.padding,this.borderRadius=mi.borderRadius,this.borderWidth=mi.borderWidth,this.borderColor=mi.borderColor,this.textAlign=mi.textAlign}getCSSPropertiesPrefix(){return fi.CSSPropertiesPrefix}update(t){var e,i,o,r;super.update(t),t.has("backgroundColor")&&this.style.setProperty("--m-box-background-color",null!==(e=this.backgroundColor&&vt(this.backgroundColor))&&void 0!==e?e:"transparent"),t.has("borderRadius")&&this.style.setProperty("--m-box-border-radius",null!==(i=this.borderRadius&&vt(this.borderRadius))&&void 0!==i?i:vt(mi.borderRadius)),t.has("borderWidth")&&this.style.setProperty("--m-box-border-width",null!==(o=this.borderWidth&&vt(this.borderWidth))&&void 0!==o?o:vt(mi.borderWidth)),t.has("borderColor")&&this.style.setProperty("--m-box-border-color",null!==(r=this.borderColor&&vt(this.borderColor))&&void 0!==r?r:vt(mi.borderColor)),t.has("textAlign")&&this.style.setProperty("--m-box-text-align",this.textAlign||mi.textAlign)}render(){return x`<slot></slot>`}}fi.CSSPropertiesPrefix="box",fi.styles=[ai(fi.CSSPropertiesPrefix),X`
|
|
1182
1182
|
:host {
|
|
1183
|
-
--m-box-padding: ${
|
|
1183
|
+
--m-box-padding: ${jt(mi.padding)};
|
|
1184
1184
|
--m-box-background-color: transparent;
|
|
1185
|
-
--m-box-border-radius: ${
|
|
1186
|
-
--m-box-border-width: ${
|
|
1187
|
-
--m-box-border-color: ${
|
|
1188
|
-
--m-box-text-align: ${H(
|
|
1185
|
+
--m-box-border-radius: ${jt(mi.borderRadius)};
|
|
1186
|
+
--m-box-border-width: ${jt(mi.borderWidth)};
|
|
1187
|
+
--m-box-border-color: ${Bt(mi.borderColor)};
|
|
1188
|
+
--m-box-text-align: ${H(mi.textAlign)};
|
|
1189
1189
|
|
|
1190
1190
|
box-sizing: border-box;
|
|
1191
1191
|
|
|
@@ -1196,11 +1196,11 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1196
1196
|
border-color: var(--m-box-border-color);
|
|
1197
1197
|
text-align: var(--m-box-text-align);
|
|
1198
1198
|
}
|
|
1199
|
-
`],window.customElements.define("m-box",
|
|
1199
|
+
`],window.customElements.define("m-box",fi);const $i={gap:"spacing-4",align:"stretch",justify:"flex-start"};class yi extends si{static get properties(){return{...super.properties,gap:{type:String},align:{type:String},justify:{type:String}}}constructor(){super(),this.gap=$i.gap,this.align=$i.align,this.justify=$i.justify}getCSSPropertiesPrefix(){return yi.CSSPropertiesPrefix}update(t){super.update(t),this.style.setProperty("--m-stack-gap",ni(this.gap,$i.gap)),this.style.setProperty("--m-stack-align",this.align||$i.align),this.style.setProperty("--m-stack-justify",this.justify||$i.justify)}render(){return x`<slot></slot>`}}yi.CSSPropertiesPrefix="stack",yi.styles=[ai(yi.CSSPropertiesPrefix),X`
|
|
1200
1200
|
:host {
|
|
1201
|
-
--m-stack-gap: ${
|
|
1202
|
-
--m-stack-align: ${H(
|
|
1203
|
-
--m-stack-justify: ${H(
|
|
1201
|
+
--m-stack-gap: ${jt($i.gap)};
|
|
1202
|
+
--m-stack-align: ${H($i.align)};
|
|
1203
|
+
--m-stack-justify: ${H($i.justify)};
|
|
1204
1204
|
|
|
1205
1205
|
display: flex;
|
|
1206
1206
|
flex-direction: column;
|
|
@@ -1209,10 +1209,10 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1209
1209
|
align-items: var(--m-stack-align);
|
|
1210
1210
|
justify-content: var(--m-stack-justify);
|
|
1211
1211
|
}
|
|
1212
|
-
`],window.customElements.define("m-stack"
|
|
1212
|
+
`],window.customElements.define("m-stack",yi);const vi={gap:"spacing-4",minColumnWidth:wt("spacing-30")};class wi extends si{static get properties(){return{...super.properties,gap:{type:String},rowGap:{type:String,attribute:"row-gap"},columnGap:{type:String,attribute:"column-gap"},minColumnWidth:{type:String,attribute:"min-column-width"}}}constructor(){super(),this.gap=vi.gap,this.minColumnWidth=vi.minColumnWidth}getCSSPropertiesPrefix(){return wi.CSSPropertiesPrefix}update(t){super.update(t),t.has("gap")&&this.style.setProperty("--m-grid-gap",ni(this.gap,vi.gap)),t.has("rowGap")&&(this.rowGap?this.style.setProperty("--m-grid-row-gap",ni(this.rowGap)):this.style.removeProperty("--m-grid-row-gap")),t.has("columnGap")&&(this.columnGap?this.style.setProperty("--m-grid-column-gap",ni(this.columnGap)):this.style.removeProperty("--m-grid-column-gap")),t.has("minColumnWidth")&&this.style.setProperty("--m-grid-min-column-width",this.minColumnWidth||vi.minColumnWidth)}render(){return x`<slot></slot>`}}wi.CSSPropertiesPrefix="grid",wi.styles=[ai(wi.CSSPropertiesPrefix),X`
|
|
1213
1213
|
:host {
|
|
1214
|
-
--m-grid-gap: ${
|
|
1215
|
-
--m-grid-min-column-width: ${H(
|
|
1214
|
+
--m-grid-gap: ${jt(vi.gap)};
|
|
1215
|
+
--m-grid-min-column-width: ${H(vi.minColumnWidth)};
|
|
1216
1216
|
|
|
1217
1217
|
display: grid;
|
|
1218
1218
|
|
|
@@ -1224,15 +1224,15 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1224
1224
|
minmax(min(var(--m-grid-min-column-width), 100%), 1fr)
|
|
1225
1225
|
);
|
|
1226
1226
|
}
|
|
1227
|
-
`],window.customElements.define("m-grid",
|
|
1227
|
+
`],window.customElements.define("m-grid",wi);const xi={gap:"spacing-4",sideWidth:"auto",minContentWidth:"50%",reversed:!1};function ki(t){return t?"row-reverse":"row"}class zi extends si{static get properties(){return{...super.properties,gap:{type:String},sideWidth:{type:String,attribute:"side-width"},minContentWidth:{type:String,attribute:"min-content-width"},reversed:{type:Boolean}}}constructor(){super(),this.gap=xi.gap,this.sideWidth=xi.sideWidth,this.minContentWidth=xi.minContentWidth,this.reversed=xi.reversed}getCSSPropertiesPrefix(){return zi.CSSPropertiesPrefix}update(t){super.update(t),t.has("gap")&&this.style.setProperty("--m-sidebar-gap",ni(this.gap,xi.gap)),t.has("sideWidth")&&this.style.setProperty("--m-sidebar-side-width",this.sideWidth||xi.sideWidth),t.has("minContentWidth")&&this.style.setProperty("--m-sidebar-min-content-width",this.minContentWidth||xi.minContentWidth),t.has("reversed")&&this.style.setProperty("--m-sidebar-flex-direction",ki(this.reversed))}render(){return x`
|
|
1228
1228
|
<slot name="sidebar"></slot>
|
|
1229
1229
|
<slot name="content"></slot>
|
|
1230
|
-
`}}
|
|
1230
|
+
`}}zi.CSSPropertiesPrefix="sidebar",zi.styles=[ai(zi.CSSPropertiesPrefix),X`
|
|
1231
1231
|
:host {
|
|
1232
|
-
--m-sidebar-gap: ${
|
|
1233
|
-
--m-sidebar-flex-direction: ${H(xi
|
|
1234
|
-
--m-sidebar-side-width: ${H(
|
|
1235
|
-
--m-sidebar-min-content-width: ${H(
|
|
1232
|
+
--m-sidebar-gap: ${jt(xi.gap)};
|
|
1233
|
+
--m-sidebar-flex-direction: ${H(ki(xi.reversed))};
|
|
1234
|
+
--m-sidebar-side-width: ${H(xi.sideWidth)};
|
|
1235
|
+
--m-sidebar-min-content-width: ${H(xi.minContentWidth)};
|
|
1236
1236
|
|
|
1237
1237
|
display: flex;
|
|
1238
1238
|
flex-wrap: wrap;
|
|
@@ -1251,7 +1251,7 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1251
1251
|
flex-grow: 999;
|
|
1252
1252
|
min-width: var(--m-sidebar-min-content-width);
|
|
1253
1253
|
}
|
|
1254
|
-
`],window.customElements.define("m-sidebar",
|
|
1254
|
+
`],window.customElements.define("m-sidebar",zi);const Si={gap:"spacing-4",threshold:"10rem"};class Ci extends si{static get properties(){return{...super.properties,gap:{type:String},rowGap:{type:String,attribute:"row-gap"},columnGap:{type:String,attribute:"column-gap"},threshold:{type:String},limit:{type:Number}}}constructor(){super(),this.gap=Si.gap,this.threshold=Si.threshold}getCSSPropertiesPrefix(){return Ci.CSSPropertiesPrefix}update(t){super.update(t),t.has("gap")&&this.style.setProperty("--m-switcher-gap",ni(this.gap,Si.gap)),t.has("rowGap")&&(this.rowGap?this.style.setProperty("--m-switcher-row-gap",ni(this.rowGap)):this.style.removeProperty("--m-switcher-row-gap")),t.has("columnGap")&&(this.columnGap?this.style.setProperty("--m-switcher-column-gap",ni(this.columnGap)):this.style.removeProperty("--m-switcher-column-gap")),t.has("threshold")&&this.style.setProperty("--m-switcher-threshold",this.threshold||Si.threshold)}render(){const t=this.limit?x`
|
|
1255
1255
|
<style>
|
|
1256
1256
|
::slotted(*:nth-last-child(n + ${this.limit+1})) {
|
|
1257
1257
|
flex-basis: 100%;
|
|
@@ -1263,10 +1263,10 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1263
1263
|
`:"";return x`
|
|
1264
1264
|
${t}
|
|
1265
1265
|
<slot></slot>
|
|
1266
|
-
`}}var
|
|
1266
|
+
`}}var Wi,Mi,ji;Ci.CSSPropertiesPrefix="switcher",Ci.styles=[ai(Ci.CSSPropertiesPrefix),X`
|
|
1267
1267
|
:host {
|
|
1268
|
-
--m-switcher-gap: ${
|
|
1269
|
-
--m-switcher-threshold: ${H(
|
|
1268
|
+
--m-switcher-gap: ${jt(Si.gap)};
|
|
1269
|
+
--m-switcher-threshold: ${H(Si.threshold)};
|
|
1270
1270
|
|
|
1271
1271
|
display: flex;
|
|
1272
1272
|
flex-wrap: wrap;
|
|
@@ -1279,27 +1279,27 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1279
1279
|
flex-basis: calc((var(--m-switcher-threshold) - 100%) * 999);
|
|
1280
1280
|
flex-grow: 1;
|
|
1281
1281
|
}
|
|
1282
|
-
`],window.customElements.define("m-switcher",
|
|
1282
|
+
`],window.customElements.define("m-switcher",Ci);class Bi extends se{constructor(){super(),Wi.add(this),Mi.set(this,void 0),e(this,Mi,new Pe(this,Le,void 0,!0),"f")}connectedCallback(){super.connectedCallback(),this.setAttribute("slot","header")}render(){return x`
|
|
1283
1283
|
<m-group gap="spacing-6" align="center">
|
|
1284
1284
|
<m-group gap="spacing-1" align="center" style="flex-grow: 1;">
|
|
1285
|
-
${t(this,
|
|
1285
|
+
${t(this,Wi,"a",ji)}
|
|
1286
1286
|
<h1><slot></slot></h1>
|
|
1287
1287
|
</m-group>
|
|
1288
1288
|
<slot name="close"></slot>
|
|
1289
1289
|
</m-group>
|
|
1290
|
-
`}}
|
|
1290
|
+
`}}Mi=new WeakMap,Wi=new WeakSet,ji=function(){const{value:e}=t(this,Mi,"f");let i,o;switch(null==e?void 0:e.variant){case"danger":i="attention",o="color-danger-60";break;case"warning":i="alert-circle",o="color-warning-60";break;case"success":i="check",o="color-success-60";break;default:return z}return x`
|
|
1291
1291
|
<m-icon name=${i} color=${o} size="24" aria-hidden="true"></m-icon>
|
|
1292
|
-
`},
|
|
1292
|
+
`},Bi.styles=[X`
|
|
1293
1293
|
h1 {
|
|
1294
1294
|
margin: 0;
|
|
1295
1295
|
padding: 0;
|
|
1296
1296
|
|
|
1297
1297
|
${Lt("heading-md-bold")};
|
|
1298
1298
|
}
|
|
1299
|
-
`],window.customElements.define("m-dialog-header",
|
|
1299
|
+
`],window.customElements.define("m-dialog-header",Bi);class Ai extends lt{render(){return x` <hr class="m-divider" /> `}}Ai.styles=[X`
|
|
1300
1300
|
.m-divider {
|
|
1301
1301
|
border: 0;
|
|
1302
|
-
border-block-end: solid 1px ${
|
|
1302
|
+
border-block-end: solid 1px ${Bt("color-divider")};
|
|
1303
1303
|
margin-block-start: var(
|
|
1304
1304
|
--m-divider-margin-top,
|
|
1305
1305
|
var(--m-divider-margin-y, 0)
|
|
@@ -1309,49 +1309,49 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1309
1309
|
var(--m-divider-margin-y, 0)
|
|
1310
1310
|
);
|
|
1311
1311
|
}
|
|
1312
|
-
`],window.customElements.define("m-divider",Ai);const
|
|
1312
|
+
`],window.customElements.define("m-divider",Ai);const Ei="field";var _i,Ti,Pi,Oi,Ri;class Ui extends se{static get properties(){return{status:{type:String},slot:{type:String}}}constructor(){super(),_i.add(this),this.field=new Pe(this,Ei,void 0,!0),this.slot="hint"}render(){const e={"-status-default":"default"===t(this,_i,"m",Ti).call(this),"-status-danger":"danger"===t(this,_i,"m",Ti).call(this)};return x` <m-group
|
|
1313
1313
|
gap="spacing-0-5"
|
|
1314
1314
|
align="center"
|
|
1315
|
-
class=${
|
|
1315
|
+
class=${pt(e)}
|
|
1316
1316
|
>
|
|
1317
1317
|
<slot name="leading"
|
|
1318
|
-
>${"danger"===t(this,
|
|
1318
|
+
>${"danger"===t(this,_i,"m",Ti).call(this)?x`<m-icon
|
|
1319
1319
|
name="attention"
|
|
1320
1320
|
size="10"
|
|
1321
1321
|
color="color-danger-60"
|
|
1322
1322
|
></m-icon>`:z}</slot
|
|
1323
1323
|
>
|
|
1324
1324
|
<span
|
|
1325
|
-
class=${
|
|
1325
|
+
class=${pt({hint:!0,...e})}
|
|
1326
1326
|
><slot></slot>
|
|
1327
1327
|
</span>
|
|
1328
|
-
</m-group>`}}
|
|
1328
|
+
</m-group>`}}_i=new WeakSet,Ti=function(){var t;return this.status||(null===(t=this.field.value)||void 0===t?void 0:t.status)},Ui.styles=[[X`
|
|
1329
1329
|
:host {
|
|
1330
|
-
--m-field-hint-color: ${
|
|
1330
|
+
--m-field-hint-color: ${Bt("color-text-tertiary")};
|
|
1331
1331
|
}
|
|
1332
1332
|
|
|
1333
1333
|
m-group {
|
|
1334
|
-
${
|
|
1334
|
+
${Rt(jt("spacing-2"))};
|
|
1335
1335
|
}
|
|
1336
1336
|
|
|
1337
1337
|
.-status-danger {
|
|
1338
|
-
--m-field-hint-color: ${
|
|
1338
|
+
--m-field-hint-color: ${Bt("color-danger-60")};
|
|
1339
1339
|
}
|
|
1340
1340
|
|
|
1341
1341
|
.hint {
|
|
1342
1342
|
${Lt("body-sm")};
|
|
1343
1343
|
color: var(--m-field-hint-color);
|
|
1344
1344
|
}
|
|
1345
|
-
`]],window.customElements.define("m-field-hint",Ui);class
|
|
1346
|
-
class=${
|
|
1345
|
+
`]],window.customElements.define("m-field-hint",Ui);class qi extends se{static get properties(){return{required:{type:Boolean},size:{type:String},slot:{type:String}}}constructor(){super(),Pi.add(this),this.field=new Pe(this,Ei,void 0,!0),this.slot="hint"}render(){return x`<label
|
|
1346
|
+
class=${pt({label:!0,"-size-default":"default"===t(this,Pi,"m",Oi).call(this),"-size-small":"small"===t(this,Pi,"m",Oi).call(this)})}
|
|
1347
1347
|
><slot></slot>
|
|
1348
|
-
${t(this,Pi,"m",
|
|
1349
|
-
</label>`}}Pi=new WeakSet,
|
|
1348
|
+
${t(this,Pi,"m",Ri).call(this)?x`<span class="required">*</span>`:z}
|
|
1349
|
+
</label>`}}Pi=new WeakSet,Oi=function(){var t;return this.size||(null===(t=this.field.value)||void 0===t?void 0:t.size)},Ri=function(){var t;return null!=this.required?this.required:Boolean(null===(t=this.field.value)||void 0===t?void 0:t.required)},qi.styles=[[X`
|
|
1350
1350
|
:host {
|
|
1351
1351
|
display: flex;
|
|
1352
1352
|
align-items: center;
|
|
1353
1353
|
justify-content: flex-start;
|
|
1354
|
-
gap: ${
|
|
1354
|
+
gap: ${jt("spacing-0-5")};
|
|
1355
1355
|
}
|
|
1356
1356
|
|
|
1357
1357
|
.label {
|
|
@@ -1364,37 +1364,37 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1364
1364
|
margin: 0;
|
|
1365
1365
|
padding: 0;
|
|
1366
1366
|
|
|
1367
|
-
color: ${
|
|
1367
|
+
color: ${Bt("color-text-tertiary")};
|
|
1368
1368
|
}
|
|
1369
1369
|
|
|
1370
1370
|
.required {
|
|
1371
1371
|
${Lt("body-md")};
|
|
1372
1372
|
|
|
1373
|
-
color: ${
|
|
1373
|
+
color: ${Bt("color-text-error")};
|
|
1374
1374
|
|
|
1375
1375
|
content: '*';
|
|
1376
1376
|
|
|
1377
|
-
${
|
|
1377
|
+
${_t(jt("spacing-1"))};
|
|
1378
1378
|
}
|
|
1379
1379
|
|
|
1380
1380
|
.label.-size-small,
|
|
1381
1381
|
.label.-size-small .required {
|
|
1382
1382
|
${Lt("body-sm")};
|
|
1383
1383
|
}
|
|
1384
|
-
`]],window.customElements.define("m-field-label",
|
|
1384
|
+
`]],window.customElements.define("m-field-label",qi),De();class Di extends se{static get properties(){return{label:{type:String},hint:{type:String},required:{type:Boolean},status:{type:String},size:{type:String}}}constructor(){super(),this.provider=new Ue(this,Ei,{required:!1,size:"default",status:"default"}),this.required=!1,this.status="default",this.size="default"}update(t){super.update(t),(t.has("required")||t.has("status")||t.has("size"))&&this.provider.setValue({required:this.required,status:this.status,size:this.size})}render(){return x`<m-stack gap="spacing-1">
|
|
1385
1385
|
${this.label?x`<m-field-label>${this.label}</m-field-label>`:x`<slot name="label"></slot>`}
|
|
1386
1386
|
|
|
1387
1387
|
<slot></slot>
|
|
1388
1388
|
|
|
1389
1389
|
${this.hint?x`<m-field-hint>${this.hint}</m-field-hint>`:x`<slot name="hint"></slot>`}
|
|
1390
|
-
</m-stack>`}}window.customElements.define("m-field",
|
|
1390
|
+
</m-stack>`}}window.customElements.define("m-field",Di);const Ni=["default","danger"];var Li,Gi,Ii;class Vi extends lt{static get properties(){return{variant:{type:String,reflect:!0},value:{type:Number,reflect:!0},max:{type:Number,reflect:!0}}}constructor(){super(),Li.add(this),this.variant="default",this.value=0,this.max=100}connectedCallback(){super.connectedCallback(),this.setAttribute("role","progressbar"),this.setAttribute("aria-valuemin","0")}updated(){this.setAttribute("aria-valuenow",String(this.value)),this.setAttribute("aria-valuemax",String(this.max))}get percentage(){return 100*t(this,Li,"a",Ii)/t(this,Li,"a",Gi)}get currentVariant(){return this.variant}render(){return x`
|
|
1391
1391
|
<div class="bar">
|
|
1392
1392
|
<span
|
|
1393
|
-
class=${
|
|
1394
|
-
style=${
|
|
1393
|
+
class=${pt({progress:!0,"-default":"default"===this.currentVariant,"-success":"success"===this.currentVariant,"-warning":"warning"===this.currentVariant,"-danger":"danger"===this.currentVariant})}
|
|
1394
|
+
style=${ve({width:`${this.percentage}%`})}
|
|
1395
1395
|
></span>
|
|
1396
1396
|
</div>
|
|
1397
|
-
`}}Li=new WeakSet,
|
|
1397
|
+
`}}Li=new WeakSet,Gi=function(){return this.max<=0?100:this.max},Ii=function(){return e=this.value,i=0,o=t(this,Li,"a",Gi),Math.min(Math.max(i,e),o);var e,i,o},Vi.styles=[X`
|
|
1398
1398
|
.bar {
|
|
1399
1399
|
display: flex;
|
|
1400
1400
|
flex-grow: 0;
|
|
@@ -1406,10 +1406,10 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1406
1406
|
overflow: hidden;
|
|
1407
1407
|
|
|
1408
1408
|
width: 100%;
|
|
1409
|
-
height: ${
|
|
1409
|
+
height: ${de("8px")};
|
|
1410
1410
|
|
|
1411
|
-
border-radius: ${
|
|
1412
|
-
background-color: ${
|
|
1411
|
+
border-radius: ${jt("border-radius-s")};
|
|
1412
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1413
1413
|
}
|
|
1414
1414
|
|
|
1415
1415
|
.progress {
|
|
@@ -1419,9 +1419,9 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1419
1419
|
|
|
1420
1420
|
${Nt([{property:"width"},{property:"background"}])};
|
|
1421
1421
|
|
|
1422
|
-
height: ${
|
|
1422
|
+
height: ${de("8px")};
|
|
1423
1423
|
|
|
1424
|
-
border-radius: ${
|
|
1424
|
+
border-radius: ${jt("border-radius-s")};
|
|
1425
1425
|
|
|
1426
1426
|
background: var(--m-progress-bar-progress-background);
|
|
1427
1427
|
}
|
|
@@ -1429,23 +1429,23 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1429
1429
|
.-default {
|
|
1430
1430
|
--m-progress-bar-progress-background: linear-gradient(
|
|
1431
1431
|
45deg,
|
|
1432
|
-
${
|
|
1433
|
-
${
|
|
1432
|
+
${Bt("color-brand-accent-1")} 22%,
|
|
1433
|
+
${Bt("color-brand-accent-2")} 88%
|
|
1434
1434
|
);
|
|
1435
1435
|
}
|
|
1436
1436
|
|
|
1437
1437
|
.-success {
|
|
1438
|
-
--m-progress-bar-progress-background: ${
|
|
1438
|
+
--m-progress-bar-progress-background: ${Bt("color-success-60")};
|
|
1439
1439
|
}
|
|
1440
1440
|
|
|
1441
1441
|
.-warning {
|
|
1442
|
-
--m-progress-bar-progress-background: ${
|
|
1442
|
+
--m-progress-bar-progress-background: ${Bt("color-warning-60")};
|
|
1443
1443
|
}
|
|
1444
1444
|
|
|
1445
1445
|
.-danger {
|
|
1446
|
-
--m-progress-bar-progress-background: ${
|
|
1446
|
+
--m-progress-bar-progress-background: ${Bt("color-danger-60")};
|
|
1447
1447
|
}
|
|
1448
|
-
`],window.customElements.define("m-progress-bar",
|
|
1448
|
+
`],window.customElements.define("m-progress-bar",Vi);class Ji extends Vi{get currentVariant(){return this.percentage>=66?"success":this.percentage>=33?"warning":"danger"}}window.customElements.define("m-progress-bar-countdown",Ji);const Hi="m-check";var Xi,Yi,Zi,Fi,Ki;class Qi extends lt{static get properties(){return{value:{type:String},disabled:{type:Boolean,reflect:!0},checked:{type:Boolean,reflect:!0}}}constructor(){super(),Xi.add(this),Zi.set(this,(t=>{if(this.disabled)return t.preventDefault(),void t.stopPropagation();const e={detail:{value:this.value,type:"select"},bubbles:!0,composed:!1};this.dispatchEvent(new CustomEvent(Hi,e))})),Fi.set(this,(()=>{this.setAttribute("aria-disabled",String(this.disabled))})),Ki.set(this,(()=>{this.setAttribute("aria-checked",String(this.checked))})),this.disabled=!1,this.checked=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","radio"),this.addEventListener("click",t(this,Zi,"f"))}updated(e){super.updated(e),e.has("disabled")&&t(this,Fi,"f").call(this),e.has("checked")&&t(this,Ki,"f").call(this)}render(){return x`
|
|
1449
1449
|
<button
|
|
1450
1450
|
type="button"
|
|
1451
1451
|
class="radio-button"
|
|
@@ -1457,15 +1457,15 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1457
1457
|
<slot name="leading"></slot>
|
|
1458
1458
|
<slot></slot>
|
|
1459
1459
|
</button>
|
|
1460
|
-
`}focus(e){var i;null===(i=t(this,
|
|
1460
|
+
`}focus(e){var i;null===(i=t(this,Xi,"a",Yi))||void 0===i||i.focus(e)}}Zi=new WeakMap,Fi=new WeakMap,Ki=new WeakMap,Xi=new WeakSet,Yi=function(){var t,e;return null!==(e=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector("button"))&&void 0!==e?e:null},Qi.styles=[X`
|
|
1461
1461
|
:host {
|
|
1462
|
-
--m-radio-border-color: ${
|
|
1463
|
-
--m-radio-dot-check-color: ${
|
|
1462
|
+
--m-radio-border-color: ${Bt("color-border")};
|
|
1463
|
+
--m-radio-dot-check-color: ${Bt("color-primary-60")};
|
|
1464
1464
|
--m-radio-size: 14px;
|
|
1465
1465
|
--m-radio-background-color: white;
|
|
1466
|
-
--m-radio-border-width: ${
|
|
1467
|
-
--m-radio-label-color: ${
|
|
1468
|
-
--m-radio-outline-color: ${
|
|
1466
|
+
--m-radio-border-width: ${jt("border-thin")};
|
|
1467
|
+
--m-radio-label-color: ${Bt("color-text-tertiary")};
|
|
1468
|
+
--m-radio-outline-color: ${Bt("color-primary-60")};
|
|
1469
1469
|
--m-radio-outline-offset: 2px;
|
|
1470
1470
|
}
|
|
1471
1471
|
|
|
@@ -1476,15 +1476,15 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1476
1476
|
border: none;
|
|
1477
1477
|
background: none;
|
|
1478
1478
|
|
|
1479
|
-
height: ${
|
|
1479
|
+
height: ${jt("global-height-small")};
|
|
1480
1480
|
display: inline-flex;
|
|
1481
|
-
gap: ${
|
|
1481
|
+
gap: ${jt("spacing-1")};
|
|
1482
1482
|
align-items: center;
|
|
1483
|
-
border-radius: ${
|
|
1483
|
+
border-radius: ${jt("border-radius-s")};
|
|
1484
1484
|
${Nt({property:"color"})};
|
|
1485
1485
|
}
|
|
1486
1486
|
|
|
1487
|
-
${
|
|
1487
|
+
${It.focus(".radio-button")} {
|
|
1488
1488
|
outline: 1px solid var(--m-radio-outline-color);
|
|
1489
1489
|
outline-offset: var(--m-radio-outline-offset);
|
|
1490
1490
|
}
|
|
@@ -1521,18 +1521,18 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1521
1521
|
height: 10px;
|
|
1522
1522
|
}
|
|
1523
1523
|
|
|
1524
|
-
${
|
|
1524
|
+
${Gt(".radio-button")} {
|
|
1525
1525
|
cursor: default;
|
|
1526
|
-
--m-radio-label-color: ${
|
|
1527
|
-
--m-radio-background-color: ${
|
|
1526
|
+
--m-radio-label-color: ${Bt("color-neutral-40")};
|
|
1527
|
+
--m-radio-background-color: ${Bt("color-background-tertiary")};
|
|
1528
1528
|
}
|
|
1529
1529
|
|
|
1530
|
-
${
|
|
1531
|
-
--m-radio-border-color: ${
|
|
1530
|
+
${Gt('.radio-button[aria-checked="true"]',".radio-input")} {
|
|
1531
|
+
--m-radio-border-color: ${Bt("color-border")};
|
|
1532
1532
|
}
|
|
1533
1533
|
|
|
1534
|
-
${
|
|
1535
|
-
--m-radio-dot-check-color: ${
|
|
1534
|
+
${Gt(".radio-button",".radio-input::before")} {
|
|
1535
|
+
--m-radio-dot-check-color: ${Bt("color-neutral-40")};
|
|
1536
1536
|
}
|
|
1537
1537
|
|
|
1538
1538
|
.radio-button .radio-input::before {
|
|
@@ -1540,36 +1540,36 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1540
1540
|
}
|
|
1541
1541
|
|
|
1542
1542
|
.radio-button[aria-checked='true'] .radio-input {
|
|
1543
|
-
--m-radio-dot-check-color: ${
|
|
1544
|
-
--m-radio-border-color: ${
|
|
1543
|
+
--m-radio-dot-check-color: ${Bt("color-primary-60")};
|
|
1544
|
+
--m-radio-border-color: ${Bt("color-primary-60")};
|
|
1545
1545
|
}
|
|
1546
1546
|
|
|
1547
1547
|
.radio-button .radio-input {
|
|
1548
|
-
--m-radio-border-color: ${
|
|
1548
|
+
--m-radio-border-color: ${Bt("color-border")};
|
|
1549
1549
|
}
|
|
1550
1550
|
|
|
1551
|
-
${
|
|
1552
|
-
--m-radio-border-color: ${
|
|
1553
|
-
--m-radio-dot-check-color: ${
|
|
1551
|
+
${It.hover(".radio-button")} .radio-input {
|
|
1552
|
+
--m-radio-border-color: ${Bt("color-primary-100")};
|
|
1553
|
+
--m-radio-dot-check-color: ${Bt("color-primary-100")};
|
|
1554
1554
|
}
|
|
1555
1555
|
|
|
1556
|
-
${
|
|
1557
|
-
--m-radio-label-color: ${
|
|
1556
|
+
${It.hover(".radio-button")} {
|
|
1557
|
+
--m-radio-label-color: ${Bt("color-text-primary")};
|
|
1558
1558
|
}
|
|
1559
1559
|
|
|
1560
|
-
${
|
|
1560
|
+
${Gt(".radio-button","*")} {
|
|
1561
1561
|
pointer-event: none;
|
|
1562
1562
|
}
|
|
1563
|
-
`],window.customElements.define("m-radio",
|
|
1563
|
+
`],window.customElements.define("m-radio",Qi);var to,eo={};Object.defineProperty(eo,"i",{value:!0});var io=At;const oo=(t,e)=>{const i=io(t);if(0===i.length)return e;const o=new Set;return o.add(String(i.at(-1))),o},ro=(t,e)=>{const i=io(t);if(0===i.length)return e;const o=new Set(e);for(const t of i)o.add(String(t));return o},no={type:"single",init:t=>oo(t,new Set),select:oo,unselect(t,e){const i=io(t);if(0===i.length||0===e.size)return e;const o=new Set(e);for(const t of i)o.delete(String(t));return o},toggle(t,e){const i=io(t);if(0===i.length)return e;const o=new Set;for(const t of i){const i=String(t);e.has(i)||(o.clear(),o.add(i))}return o},reset:t=>null==t?new Set:t,value(t){if(null==t||0===t.size)return null;const[e]=Array.from(t);return e}},so={type:"single-strict",init:t=>oo(t,new Set),select:oo,unselect(t,e){const i=io(t);if(0===i.length||0===e.size)return e;const o=new Set(e);for(let t=0;t<i.length&&e.size>1;t++)o.delete(String(i[t]));return o},toggle(t,e){const i=io(t);if(0===i.length)return e;const o=new Set(e);for(const t of i){const i=String(t);e.has(i)||(o.clear(),o.add(i))}return o},reset:t=>null==t?new Set:t,value(t){if(null==t||0===t.size)return null;const[e]=Array.from(t);return e}},ao={type:"multiple",init:t=>ro(t,new Set),select:ro,unselect(t,e){const i=io(t);if(0===i.length||0===e.size)return e;const o=new Set(e);for(const t of i)o.delete(String(t));return o},toggle(t,e){const i=io(t);if(0===i.length)return e;const o=new Set(e);for(const t of i){const i=String(t);e.has(i)?o.delete(i):o.add(i)}return o},reset:t=>null==t?new Set:t,value:t=>null==t||0===t.size?null:Array.from(t)};var lo,co,ho,uo,bo,po,go,mo,fo;eo.SELECTION_TYPES=["single","single-strict","multiple"],to=eo.default=function(t){const{type:e="multiple"}=t;return"single"===e?no:"single-strict"===e?so:ao};class $o{constructor(e,i,o){lo.add(this),this.disabled=!1,this.event="m-select",co.set(this,(t=>{if(this.disabled)return;if(null==this.type)return void console.warn("[SelectionController] Did you forget to set the selection type?");const{detail:{type:e,value:i}}=t;switch(e){case"select":this.select(Et(i));break;case"unselect":this.unselect(Et(i));break;case"toggle":this.toggle(Et(i))}})),this.init=t=>{this.host.selection=this.strategy.init(t)},this.select=e=>{this.host.selection=this.strategy.select(e,this.host.selection),t(this,lo,"m",ho).call(this)},this.unselect=e=>{this.host.selection=this.strategy.unselect(e,this.host.selection),t(this,lo,"m",ho).call(this)},this.toggle=e=>{this.host.selection=this.strategy.toggle(e,this.host.selection),t(this,lo,"m",ho).call(this)},this.subscribe=()=>{this.host.addEventListener(this.event,t(this,co,"f"))},this.unsubscribe=()=>{this.host.removeEventListener(this.event,t(this,co,"f"))},this.host=e,this.type=i,this.event=o,this.strategy=to({type:i}),this.host.addController(this)}hostConnected(){this.subscribe()}hostDisconnected(){this.unsubscribe()}hostUpdate(){null!=this.host.type&&this.host.type!==this.type&&(this.unsubscribe(),this.host.removeController(this))}}co=new WeakMap,lo=new WeakSet,ho=function(){const t={detail:{type:this.type,value:this.strategy.value(this.host.selection)},bubbles:!0,composed:!1};this.host.dispatchEvent(new CustomEvent("m-change",t))};class yo extends lt{static get properties(){return{value:{type:String,reflect:!0},disabled:{type:Boolean,reflect:!0},selection:{state:!0},orientation:{type:String}}}constructor(){super(),uo.set(this,null),bo.set(this,null),po.set(this,(()=>{var e;return null===(e=t(this,go,"f").call(this)[0])||void 0===e?void 0:e.value})),go.set(this,(()=>{var i,o,r;e(this,bo,null!==(i=t(this,bo,"f"))&&void 0!==i?i:this.shadowRoot&&this.shadowRoot.querySelector("slot"),"f");return[...null!==(r=null===(o=t(this,bo,"f"))||void 0===o?void 0:o.assignedElements({flatten:!0}))&&void 0!==r?r:[]].filter((t=>"m-radio"===t.tagName.toLowerCase()))})),mo.set(this,(t=>{t.checked=this.selection.has(t.value)})),fo.set(this,(t=>{t.disabled=this.disabled})),this.disabled=!1,this.selection=new Set,this.value="",this.orientation="vertical",this.type="single-strict"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","radio-group"),e(this,uo,new $o(this,this.type,Hi),"f")}update(e){super.update(e),e.has("value")&&t(this,uo,"f")&&t(this,uo,"f").init(Et(this.value||t(this,po,"f").call(this))),e.has("selection")&&([this.value]=this.selection)}updated(e){super.updated(e),e.has("selection")&&t(this,go,"f").call(this).forEach((e=>{t(this,mo,"f").call(this,e)})),e.has("disabled")&&t(this,go,"f").call(this).forEach((e=>{t(this,fo,"f").call(this,e)}))}render(){return x`
|
|
1564
1564
|
<div
|
|
1565
|
-
class=${
|
|
1565
|
+
class=${pt({"radio-group":!0,"-vertical":"vertical"===this.orientation,"-horizontal":"horizontal"===this.orientation})}
|
|
1566
1566
|
>
|
|
1567
1567
|
<slot></slot>
|
|
1568
1568
|
</div>
|
|
1569
|
-
`}}
|
|
1569
|
+
`}}uo=new WeakMap,bo=new WeakMap,po=new WeakMap,go=new WeakMap,mo=new WeakMap,fo=new WeakMap,yo.styles=[X`
|
|
1570
1570
|
.radio-group {
|
|
1571
1571
|
display: flex;
|
|
1572
|
-
gap: ${
|
|
1572
|
+
gap: ${jt("spacing-2")};
|
|
1573
1573
|
}
|
|
1574
1574
|
.radio-group.-vertical {
|
|
1575
1575
|
flex-direction: column;
|
|
@@ -1577,25 +1577,138 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1577
1577
|
.radio-group.-horizontal {
|
|
1578
1578
|
flex-direction: row;
|
|
1579
1579
|
}
|
|
1580
|
-
`],window.customElements.define("m-radio-group",
|
|
1580
|
+
`],window.customElements.define("m-radio-group",yo);const vo="tabs",wo="m-select-tab";var xo,ko,zo,So,Co,Wo,Mo,jo,Bo,Ao,Eo,_o,To,Po,Oo,Ro,Uo,qo,Do,No;class Lo extends se{static get properties(){return{activeTab:{type:String,attribute:"active-tab",reflect:!0},disabled:{type:Boolean,reflect:!0},lazy:{type:Boolean},selection:{state:!0},tabContentDirection:{type:String,attribute:"tab-content-direction"}}}constructor(){super(),xo.set(this,null),ko.set(this,null),this.provider=new Ue(this,vo,{tabContentDirection:"horizontal",disabled:!1,lazy:!1,selection:new Set("")}),zo.set(this,(t=>{t.stopPropagation();const[e]=Array.from(this.selection),i={detail:{value:String(e)}};this.emit("m-tab-change",i)})),So.set(this,(()=>{var e;return null===(e=t(this,Co,"f").call(this)[0])||void 0===e?void 0:e.name})),Co.set(this,(()=>{var i,o,r;e(this,ko,null!==(i=t(this,ko,"f"))&&void 0!==i?i:this.shadowRoot&&this.shadowRoot.querySelector("slot"),"f");return[...null!==(r=null===(o=t(this,ko,"f"))||void 0===o?void 0:o.assignedElements({flatten:!0}))&&void 0!==r?r:[]].filter((t=>"m-tab"===t.tagName.toLowerCase()))})),this.activeTab="",this.tabContentDirection="horizontal",this.disabled=!1,this.lazy=!1,this.type="single-strict",this.selection=new Set}connectedCallback(){super.connectedCallback(),e(this,xo,new $o(this,this.type,wo),"f"),this.addEventListener("m-change",t(this,zo,"f"))}update(e){super.update(e),e.has("activeTab")&&t(this,xo,"f")&&t(this,xo,"f").init(Et(this.activeTab||t(this,So,"f").call(this)));const[i]=Array.from(this.selection);!e.has("selection")||this.activeTab&&i===this.activeTab||(this.activeTab=i),(e.has("tabContentDirection")||e.has("disabled")||e.has("lazy")||e.has("selection"))&&this.provider.setValue({tabContentDirection:this.tabContentDirection,disabled:this.disabled,lazy:this.lazy,selection:this.selection})}render(){return x`
|
|
1581
|
+
<div class="tablist" role="tablist"><slot name="tab"></slot></div>
|
|
1582
|
+
<slot></slot>
|
|
1583
|
+
`}}xo=new WeakMap,ko=new WeakMap,zo=new WeakMap,So=new WeakMap,Co=new WeakMap,Lo.styles=[X`
|
|
1584
|
+
:host {
|
|
1585
|
+
--m-tabs-border-width: ${jt("border-thin")};
|
|
1586
|
+
--m-tabs-border-color: ${Bt("color-divider")};
|
|
1587
|
+
}
|
|
1588
|
+
|
|
1589
|
+
.tablist {
|
|
1590
|
+
display: flex;
|
|
1591
|
+
flex-direction: row;
|
|
1592
|
+
gap: 1px;
|
|
1593
|
+
border-bottom-style: solid;
|
|
1594
|
+
border-bottom-width: var(--m-tabs-border-width);
|
|
1595
|
+
border-bottom-color: var(--m-tabs-border-color);
|
|
1596
|
+
}
|
|
1597
|
+
`],window.customElements.define("m-tabs",Lo);class Go extends se{static get properties(){return{name:{type:String},disabled:{type:Boolean,reflect:!0},slot:{type:String,reflect:!0}}}constructor(){super(),Wo.add(this),this.tabs=new Pe(this,vo,void 0,!0),jo.set(this,(t=>{if(this.disabled)return t.preventDefault(),void t.stopPropagation();const e={detail:{value:this.name,type:"select"},bubbles:!0,composed:!1};this.emit(wo,e)})),Bo.set(this,(()=>{var t;return null===(t=this.tabs.value)||void 0===t?void 0:t.tabContentDirection})),Ao.set(this,(()=>{var t;return Boolean(null===(t=this.tabs.value)||void 0===t?void 0:t.selection.has(this.name))})),Eo.set(this,(()=>{var t;return this.disabled||Boolean(null===(t=this.tabs.value)||void 0===t?void 0:t.disabled)})),this.disabled=!1}connectedCallback(){super.connectedCallback(),this.id=`${this.name}-tab`,this.setAttribute("slot","tab"),this.setAttribute("role","tab"),this.setAttribute("aria-controls",`${this.name}-panel`),this.setAttribute("aria-selected","false"),this.addEventListener("click",t(this,jo,"f"))}updated(e){super.updated(e),t(this,Ao,"f").call(this)?this.setAttribute("aria-selected","true"):this.setAttribute("aria-selected","false"),e.has("name")&&(this.id=`${this.name}-tab`,this.setAttribute("aria-controls",`${this.name}-panel`)),e.has("disabled")&&this.setAttribute("aria-disabled",String(this.disabled))}render(){return x`
|
|
1598
|
+
<button
|
|
1599
|
+
type="button"
|
|
1600
|
+
class=${pt({tab:!0,"-vertical":"vertical"===t(this,Bo,"f").call(this),"-horizontal":"horizontal"===t(this,Bo,"f").call(this)})}
|
|
1601
|
+
?disabled=${t(this,Eo,"f").call(this)}
|
|
1602
|
+
aria-selected=${t(this,Ao,"f").call(this)}
|
|
1603
|
+
>
|
|
1604
|
+
<slot name="leading"></slot>
|
|
1605
|
+
<slot></slot>
|
|
1606
|
+
</button>
|
|
1607
|
+
`}focus(e){var i;null===(i=t(this,Wo,"a",Mo))||void 0===i||i.focus(e)}}jo=new WeakMap,Bo=new WeakMap,Ao=new WeakMap,Eo=new WeakMap,Wo=new WeakSet,Mo=function(){var t,e;return null!==(e=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector("button"))&&void 0!==e?e:null},Go.styles=[X`
|
|
1608
|
+
:host {
|
|
1609
|
+
--m-tab-border-width: ${jt("border-thin")};
|
|
1610
|
+
--m-tab-border-color: ${Bt("color-divider")};
|
|
1611
|
+
--m-tab-border-radius: ${jt("border-radius-s")};
|
|
1612
|
+
--m-tab-background-color: none;
|
|
1613
|
+
--m-tab-label-color: ${Bt("color-text-tertiary")};
|
|
1614
|
+
--m-tab-leading-color: ${Bt("color-text-tertiary")};
|
|
1615
|
+
|
|
1616
|
+
--m-tab-outline-color: ${Bt("color-primary-60")};
|
|
1617
|
+
|
|
1618
|
+
--m-tab-padding-x: ${jt("spacing-6")};
|
|
1619
|
+
--m-tab-height: ${jt("spacing-12")};
|
|
1620
|
+
}
|
|
1621
|
+
|
|
1622
|
+
.tab {
|
|
1623
|
+
cursor: pointer;
|
|
1624
|
+
position: relative;
|
|
1625
|
+
padding-bottom: 1px;
|
|
1626
|
+
bottom: -1px;
|
|
1627
|
+
display: inline-flex;
|
|
1628
|
+
align-items: center;
|
|
1629
|
+
justify-content: center;
|
|
1630
|
+
gap: ${jt("spacing-3")};
|
|
1631
|
+
height: var(--m-tab-height);
|
|
1632
|
+
padding-inline: var(--m-tab-padding-x);
|
|
1633
|
+
|
|
1634
|
+
${Lt("body-md")};
|
|
1635
|
+
color: var(--m-tab-label-color);
|
|
1636
|
+
|
|
1637
|
+
background-color: var(--m-tab-background-color);
|
|
1638
|
+
border: none;
|
|
1639
|
+
border-bottom-style: solid;
|
|
1640
|
+
border-bottom-width: var(--m-tab-border-width);
|
|
1641
|
+
border-bottom-color: var(--m-tab-border-color);
|
|
1642
|
+
border-top-left-radius: var(--m-tab-border-radius);
|
|
1643
|
+
border-top-right-radius: var(--m-tab-border-radius);
|
|
1644
|
+
|
|
1645
|
+
@media (prefers-reduced-motion: no-preference) {
|
|
1646
|
+
${Nt([{property:"background-color"},{property:"border-color"},{property:"color"}])};
|
|
1647
|
+
}
|
|
1648
|
+
}
|
|
1649
|
+
.tab.-vertical {
|
|
1650
|
+
flex-direction: column;
|
|
1651
|
+
--m-tab-height: ${jt("spacing-20")};
|
|
1652
|
+
}
|
|
1653
|
+
.tab.-horizontal {
|
|
1654
|
+
flex-direction: row;
|
|
1655
|
+
}
|
|
1656
|
+
|
|
1657
|
+
slot[name='leading']::slotted(*) {
|
|
1658
|
+
color: var(--m-tab-leading-color);
|
|
1659
|
+
}
|
|
1660
|
+
|
|
1661
|
+
${It.hover(".tab")} {
|
|
1662
|
+
--m-tab-background-color: ${Bt("color-background-tertiary")};
|
|
1663
|
+
}
|
|
1664
|
+
|
|
1665
|
+
${It.focus(".tab")} {
|
|
1666
|
+
outline: 1px solid var(--m-tab-outline-color);
|
|
1667
|
+
}
|
|
1668
|
+
|
|
1669
|
+
.tab[aria-selected='true'] {
|
|
1670
|
+
--m-tab-border-width: ${jt("border-medium")};
|
|
1671
|
+
--m-tab-border-color: ${Bt("color-primary-60")};
|
|
1672
|
+
--m-tab-label-color: ${Bt("color-text-secondary")};
|
|
1673
|
+
--m-tab-leading-color: ${Bt("color-primary-60")};
|
|
1674
|
+
padding-bottom: 0;
|
|
1675
|
+
}
|
|
1676
|
+
|
|
1677
|
+
${Gt(".tab")} {
|
|
1678
|
+
cursor: default;
|
|
1679
|
+
--m-tab-label-color: ${Bt("color-text-disabled")};
|
|
1680
|
+
--m-tab-leading-color: ${Bt("color-text-disabled")};
|
|
1681
|
+
--m-tab-border-color: ${Bt("color-divider")};
|
|
1682
|
+
}
|
|
1683
|
+
|
|
1684
|
+
${Gt(".tab","*")} {
|
|
1685
|
+
pointer-events: none;
|
|
1686
|
+
}
|
|
1687
|
+
`],window.customElements.define("m-tab",Go);class Io extends(To=fi){static get properties(){return{...super.properties,forTab:{type:String,attribute:"for-tab"},lazy:{type:Boolean}}}constructor(){super(),this.tabs=new Pe(this,vo,void 0,!0),Po.set(this,(()=>{var t;return Boolean(null===(t=this.tabs.value)||void 0===t?void 0:t.selection.has(this.forTab))})),Oo.set(this,(()=>{var t;return this.lazy||Boolean(null===(t=this.tabs.value)||void 0===t?void 0:t.lazy)})),this.lazy=!1,this.padding="none",this.paddingY="spacing-8"}connectedCallback(){super.connectedCallback(),this.id=`${this.forTab}-panel`,this.setAttribute("role","tabpanel"),this.setAttribute("aria-labelledby",`${this.forTab}-tab`)}updated(e){super.updated(e),t(this,Po,"f").call(this)?(this.style.setProperty("--m-tab-panel-display","block"),this.removeAttribute("aria-hidden")):(this.style.setProperty("--m-tab-panel-display","none"),this.setAttribute("aria-hidden","true")),e.has("forTab")&&(this.id=`${this.forTab}-panel`,this.setAttribute("aria-labelledby",`${this.forTab}-tab`))}render(){return t(this,Oo,"f").call(this)&&!t(this,Po,"f").call(this)?x``:x`<slot></slot>`}}_o=Io,Po=new WeakMap,Oo=new WeakMap,Io.styles=[...Reflect.get(To,"styles",_o),X`
|
|
1688
|
+
:host {
|
|
1689
|
+
--m-tab-panel-display: none;
|
|
1690
|
+
|
|
1691
|
+
display: var(--m-tab-panel-display);
|
|
1692
|
+
}
|
|
1693
|
+
`],window.customElements.define("m-tab-panel",Io);class Vo extends lt{static get properties(){return{variant:{type:String},size:{type:String},isSkeleton:{type:Boolean,attribute:"is-skeleton"}}}constructor(){super(),this.variant="neutral",this.size="default",this.isSkeleton=!1}render(){return x`
|
|
1581
1694
|
<span
|
|
1582
|
-
class=${
|
|
1695
|
+
class=${pt({tag:!0,"-success":"success"===this.variant,"-neutral":"neutral"===this.variant,"-warning":"warning"===this.variant,"-danger":"danger"===this.variant,"-is-skeleton":this.isSkeleton,"-size-small":"small"===this.size,"-size-default":"default"===this.size,"-size-large":"large"===this.size})}
|
|
1583
1696
|
>
|
|
1584
1697
|
${this.isSkeleton?x``:x`<slot name="leading"></slot>`}
|
|
1585
1698
|
<slot></slot>
|
|
1586
1699
|
</span>
|
|
1587
|
-
`}}
|
|
1700
|
+
`}}Vo.styles=[[X`
|
|
1588
1701
|
@keyframes skeleton-loading {
|
|
1589
1702
|
0% {
|
|
1590
|
-
background-color: ${
|
|
1703
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1591
1704
|
opacity: 0.3;
|
|
1592
1705
|
}
|
|
1593
1706
|
50% {
|
|
1594
|
-
background-color: ${
|
|
1707
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1595
1708
|
opacity: 0.6;
|
|
1596
1709
|
}
|
|
1597
1710
|
100% {
|
|
1598
|
-
background-color: ${
|
|
1711
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1599
1712
|
}
|
|
1600
1713
|
}
|
|
1601
1714
|
`,X`
|
|
@@ -1610,60 +1723,60 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1610
1723
|
box-sizing: border-box;
|
|
1611
1724
|
max-width: 200px;
|
|
1612
1725
|
border-radius: 100px;
|
|
1613
|
-
line-height: ${
|
|
1726
|
+
line-height: ${jt("line-height-1")};
|
|
1614
1727
|
cursor: default;
|
|
1615
1728
|
}
|
|
1616
1729
|
|
|
1617
1730
|
.tag slot[name='leading']::slotted(*) {
|
|
1618
|
-
margin-inline-end: ${
|
|
1731
|
+
margin-inline-end: ${jt("spacing-1")};
|
|
1619
1732
|
vertical-align: middle;
|
|
1620
1733
|
}
|
|
1621
1734
|
|
|
1622
1735
|
.-size-small {
|
|
1623
1736
|
${Lt("chips-sm")};
|
|
1624
|
-
padding: ${
|
|
1625
|
-
block-size: ${
|
|
1737
|
+
padding: ${jt("spacing-1")} ${jt("spacing-2")};
|
|
1738
|
+
block-size: ${de("18px")};
|
|
1626
1739
|
}
|
|
1627
1740
|
.-size-default {
|
|
1628
1741
|
${Lt("chips-md")};
|
|
1629
|
-
padding: ${
|
|
1630
|
-
block-size: ${
|
|
1742
|
+
padding: ${jt("spacing-2")} ${jt("spacing-3")};
|
|
1743
|
+
block-size: ${jt("global-height-small")};
|
|
1631
1744
|
}
|
|
1632
1745
|
.-size-large {
|
|
1633
1746
|
${Lt("button-lg")};
|
|
1634
|
-
padding: ${
|
|
1635
|
-
block-size: ${
|
|
1747
|
+
padding: ${jt("spacing-3")} ${jt("spacing-4")};
|
|
1748
|
+
block-size: ${jt("global-height-default")};
|
|
1636
1749
|
}
|
|
1637
1750
|
|
|
1638
1751
|
.-success {
|
|
1639
|
-
color: ${
|
|
1640
|
-
background: ${
|
|
1752
|
+
color: ${Bt("color-success-60")};
|
|
1753
|
+
background: ${Bt("color-success-20")};
|
|
1641
1754
|
}
|
|
1642
1755
|
.-neutral {
|
|
1643
|
-
color: ${
|
|
1644
|
-
background: ${
|
|
1756
|
+
color: ${Bt("color-text-tertiary")};
|
|
1757
|
+
background: ${Bt("color-background-tertiary")};
|
|
1645
1758
|
}
|
|
1646
1759
|
.-warning {
|
|
1647
|
-
color: ${
|
|
1648
|
-
background: ${
|
|
1760
|
+
color: ${Bt("color-warning-100")};
|
|
1761
|
+
background: ${Bt("color-warning-20")};
|
|
1649
1762
|
}
|
|
1650
1763
|
.-danger {
|
|
1651
|
-
color: ${
|
|
1652
|
-
background: ${
|
|
1764
|
+
color: ${Bt("color-danger-60")};
|
|
1765
|
+
background: ${Bt("color-danger-20")};
|
|
1653
1766
|
}
|
|
1654
1767
|
|
|
1655
1768
|
.-is-skeleton {
|
|
1656
1769
|
${H("animation: skeleton-loading 1s linear infinite alternate;")};
|
|
1657
1770
|
width: var(--m-tag-skeleton-width);
|
|
1658
1771
|
}
|
|
1659
|
-
`]],window.customElements.define("m-tag",
|
|
1772
|
+
`]],window.customElements.define("m-tag",Vo);class Jo extends se{static get properties(){return{clearable:{type:Boolean},disabled:{type:Boolean,reflect:!0},max:{type:String},maxLength:{type:Number,reflect:!0,attribute:"max-length"},min:{type:String},minLength:{type:Number,reflect:!0,attribute:"min-length"},pattern:{type:String},placeholder:{type:String},readOnly:{type:Boolean,reflect:!0,attribute:"read-only"},size:{type:String},status:{type:String},step:{type:String},type:{type:String},value:{type:String}}}constructor(){super(),Ro.add(this),this.inputElement=null,this.field=new Pe(this,Ei,void 0,!0),Do.set(this,(t=>{this.value=t.target.value,this.reemit(t)})),No.set(this,(t=>{t.stopPropagation(),this.clear()})),this.clearable=!1,this.disabled=!1,this.placeholder=void 0,this.size="default",this.type="text",this.value=void 0,this.max=""}connectedCallback(){super.connectedCallback(),this.setAttribute("role","textbox")}render(){return x`
|
|
1660
1773
|
<div
|
|
1661
|
-
class=${
|
|
1774
|
+
class=${pt({container:!0,"-size-small":"small"===this.size,"-size-default":"default"===this.size,"-size-large":"large"===this.size,"is-disabled":Boolean(this.disabled),"-status-default":"default"===t(this,Ro,"m",qo).call(this),"-status-danger":"danger"===t(this,Ro,"m",qo).call(this)})}
|
|
1662
1775
|
>
|
|
1663
1776
|
<slot name="leading"></slot>
|
|
1664
1777
|
<input
|
|
1665
|
-
id="${
|
|
1666
|
-
type="${
|
|
1778
|
+
id="${ct(this.id)}"
|
|
1779
|
+
type="${ct(this.type)}"
|
|
1667
1780
|
class="text-field"
|
|
1668
1781
|
aria-disabled=${this.disabled?"true":"false"}
|
|
1669
1782
|
?disabled="${this.disabled}"
|
|
@@ -1672,31 +1785,31 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1672
1785
|
maxlength=${null!=this.maxLength&&this.maxLength>-1?this.maxLength:z}
|
|
1673
1786
|
min=${this.min||z}
|
|
1674
1787
|
minlength=${null!=this.minLength&&this.minLength>-1?this.minLength:z}
|
|
1675
|
-
pattern=${
|
|
1676
|
-
placeholder="${
|
|
1788
|
+
pattern=${ct(this.pattern)}
|
|
1789
|
+
placeholder="${ct(this.placeholder)}"
|
|
1677
1790
|
step=${this.step||z}
|
|
1678
|
-
value="${
|
|
1791
|
+
value="${ct(this.value)}"
|
|
1679
1792
|
@change=${this.reemit}
|
|
1680
|
-
@input=${t(this,
|
|
1793
|
+
@input=${t(this,Do,"f")}
|
|
1681
1794
|
/>
|
|
1682
1795
|
${this.clearable?x`<m-close-button
|
|
1683
|
-
class=${
|
|
1684
|
-
controls="${
|
|
1685
|
-
@m-close=${t(this,
|
|
1796
|
+
class=${pt({clear:!0,"is-visible":t(this,Ro,"m",Uo).call(this)})}
|
|
1797
|
+
controls="${ct(this.id)}"
|
|
1798
|
+
@m-close=${t(this,No,"f")}
|
|
1686
1799
|
label="Clear input"
|
|
1687
1800
|
></m-close-button>`:z}
|
|
1688
1801
|
<slot name="trailing"></slot>
|
|
1689
1802
|
</div>
|
|
1690
|
-
`}get input(){var t,e;return null==this.inputElement&&(this.inputElement=null!==(e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("input"))&&void 0!==e?e:null),this.inputElement}clear(){this.value="",this.input&&(this.input.value=""),this.emit("m-clear"),this.focus()}focus(){var t;null===(t=this.input)||void 0===t||t.focus()}}
|
|
1803
|
+
`}get input(){var t,e;return null==this.inputElement&&(this.inputElement=null!==(e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("input"))&&void 0!==e?e:null),this.inputElement}clear(){this.value="",this.input&&(this.input.value=""),this.emit("m-clear"),this.focus()}focus(){var t;null===(t=this.input)||void 0===t||t.focus()}}Do=new WeakMap,No=new WeakMap,Ro=new WeakSet,Uo=function(){const t=this.value||"";return!this.disabled&&t.length>0},qo=function(){var t;return this.status||(null===(t=this.field.value)||void 0===t?void 0:t.status)},Jo.styles=[X`
|
|
1691
1804
|
:host {
|
|
1692
1805
|
--m-text-field-background-color: transparent;
|
|
1693
|
-
--m-text-field-border-color: ${
|
|
1694
|
-
--m-text-field-height: ${
|
|
1695
|
-
--m-text-field-outline-color: ${
|
|
1806
|
+
--m-text-field-border-color: ${Bt("color-border")};
|
|
1807
|
+
--m-text-field-height: ${jt("global-height-default")};
|
|
1808
|
+
--m-text-field-outline-color: ${Bt("color-primary-100")};
|
|
1696
1809
|
--m-text-field-outline-offset: 2px;
|
|
1697
|
-
--m-text-field-padding-y: ${
|
|
1698
|
-
--m-text-field-placeholder-color: ${
|
|
1699
|
-
--m-text-field-color: ${
|
|
1810
|
+
--m-text-field-padding-y: ${jt("spacing-2")};
|
|
1811
|
+
--m-text-field-placeholder-color: ${Bt("color-text-placeholder")};
|
|
1812
|
+
--m-text-field-color: ${Bt("color-text-primary")};
|
|
1700
1813
|
}
|
|
1701
1814
|
|
|
1702
1815
|
.container {
|
|
@@ -1706,22 +1819,22 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1706
1819
|
display: inline-flex;
|
|
1707
1820
|
align-items: center;
|
|
1708
1821
|
justify-content: start;
|
|
1709
|
-
gap: ${
|
|
1822
|
+
gap: ${jt("spacing-2")};
|
|
1710
1823
|
|
|
1711
1824
|
position: relative;
|
|
1712
1825
|
box-sizing: border-box;
|
|
1713
1826
|
width: 100%;
|
|
1714
1827
|
block-size: var(--m-text-field-height);
|
|
1715
1828
|
|
|
1716
|
-
${
|
|
1829
|
+
${Rt(jt("spacing-2"))};
|
|
1717
1830
|
|
|
1718
1831
|
background-color: var(--m-text-field-background-color);
|
|
1719
|
-
border-radius: ${
|
|
1832
|
+
border-radius: ${jt("border-radius-s")};
|
|
1720
1833
|
border: 1px solid var(--m-text-field-border-color);
|
|
1721
1834
|
}
|
|
1722
1835
|
|
|
1723
1836
|
.container.-size-small {
|
|
1724
|
-
--m-text-field-height: ${
|
|
1837
|
+
--m-text-field-height: ${jt("global-height-small")};
|
|
1725
1838
|
--m-text-field-padding-y: 0;
|
|
1726
1839
|
}
|
|
1727
1840
|
|
|
@@ -1731,21 +1844,21 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1731
1844
|
}
|
|
1732
1845
|
|
|
1733
1846
|
.container.-size-large {
|
|
1734
|
-
--m-text-field-height: ${
|
|
1735
|
-
--m-text-field-padding-y: ${
|
|
1847
|
+
--m-text-field-height: ${jt("global-height-large")};
|
|
1848
|
+
--m-text-field-padding-y: ${jt("spacing-3")};
|
|
1736
1849
|
}
|
|
1737
1850
|
|
|
1738
1851
|
.container.-status-danger {
|
|
1739
|
-
--m-text-field-border-color: ${
|
|
1852
|
+
--m-text-field-border-color: ${Bt("color-danger-60")};
|
|
1740
1853
|
}
|
|
1741
1854
|
|
|
1742
|
-
${
|
|
1743
|
-
--m-text-field-background-color: ${
|
|
1855
|
+
${Gt(".container")} {
|
|
1856
|
+
--m-text-field-background-color: ${Bt("color-background-tertiary")};
|
|
1744
1857
|
|
|
1745
1858
|
cursor: default;
|
|
1746
1859
|
}
|
|
1747
1860
|
|
|
1748
|
-
${
|
|
1861
|
+
${Gt(".container","*")} {
|
|
1749
1862
|
pointer-events: none;
|
|
1750
1863
|
}
|
|
1751
1864
|
|
|
@@ -1757,12 +1870,12 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1757
1870
|
cursor: default;
|
|
1758
1871
|
}
|
|
1759
1872
|
|
|
1760
|
-
${
|
|
1761
|
-
--m-text-field-border-color: ${
|
|
1873
|
+
${It.hover(".container")} {
|
|
1874
|
+
--m-text-field-border-color: ${Bt("color-primary-60")};
|
|
1762
1875
|
}
|
|
1763
1876
|
|
|
1764
|
-
${
|
|
1765
|
-
--m-text-field-border-color: ${
|
|
1877
|
+
${It.focus(".container")} {
|
|
1878
|
+
--m-text-field-border-color: ${Bt("color-primary-60")};
|
|
1766
1879
|
|
|
1767
1880
|
outline: 1px solid var(--m-text-field-outline-color);
|
|
1768
1881
|
outline-offset: var(--m-text-field-outline-offset);
|
|
@@ -1776,7 +1889,7 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1776
1889
|
flex: 1;
|
|
1777
1890
|
min-width: 0;
|
|
1778
1891
|
|
|
1779
|
-
${
|
|
1892
|
+
${Rt(0)};
|
|
1780
1893
|
padding-block: var(--m-text-field-padding-y);
|
|
1781
1894
|
|
|
1782
1895
|
background-color: var(--m-text-field-background-color);
|
|
@@ -1787,8 +1900,8 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1787
1900
|
color: var(--m-text-field-placeholder-color);
|
|
1788
1901
|
}
|
|
1789
1902
|
|
|
1790
|
-
${
|
|
1791
|
-
${
|
|
1903
|
+
${It.active(".text-field")},
|
|
1904
|
+
${It.focus(".text-field")} {
|
|
1792
1905
|
-webkit-appearance: none;
|
|
1793
1906
|
background: none;
|
|
1794
1907
|
border: none;
|
|
@@ -1802,43 +1915,43 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1802
1915
|
.clear.is-visible {
|
|
1803
1916
|
visibility: visible;
|
|
1804
1917
|
}
|
|
1805
|
-
`],window.customElements.define("m-text-field",
|
|
1918
|
+
`],window.customElements.define("m-text-field",Jo);const Ho="m-toggle";var Xo,Yo,Zo,Fo,Ko,Qo,tr,er,ir,or,rr;class nr extends lt{static get properties(){return{disabled:{type:Boolean},role:{type:String,reflect:!0},showCheck:{type:Boolean,attribute:"show-check"},size:{type:String},type:{type:String},value:{},selection:{state:!0}}}constructor(){super(),Xo.set(this,null),Yo.set(this,null),Zo.set(this,(()=>{var i,o,r;e(this,Yo,null!==(i=t(this,Yo,"f"))&&void 0!==i?i:this.shadowRoot&&this.shadowRoot.querySelector("slot"),"f");return[...null!==(r=null===(o=t(this,Yo,"f"))||void 0===o?void 0:o.assignedElements({flatten:!0}))&&void 0!==r?r:[]].filter((t=>"m-toggle"===t.tagName.toLowerCase()))})),Fo.set(this,(t=>{t.setAttribute("role",["single","single-strict"].includes(this.type)?"radio":"checkbox")})),Ko.set(this,(t=>{t.checked=this.selection.has(t.value)})),Qo.set(this,(t=>{t.disabled=this.disabled})),this.showCheck=!1,this.size="default",this.type="single",this.selection=new Set}update(i){super.update(i),(null!=i.get("type")&&null!=this.type||null==t(this,Xo,"f"))&&(e(this,Xo,new $o(this,this.type,Ho),"f"),t(this,Xo,"f").init(Et(this.value)),this.role=["single","single-strict"].includes(this.type)?"radiogroup":"group"),i.has("value")&&t(this,Xo,"f").init(Et(this.value))}updated(e){super.updated(e),e.has("selection")&&t(this,Zo,"f").call(this).forEach((e=>{t(this,Ko,"f").call(this,e)})),e.has("disabled")&&t(this,Zo,"f").call(this).forEach((e=>{t(this,Qo,"f").call(this,e)})),e.has("role")&&t(this,Zo,"f").call(this).forEach((e=>{t(this,Fo,"f").call(this,e)}))}render(){return x`
|
|
1806
1919
|
<m-group
|
|
1807
|
-
class=${
|
|
1920
|
+
class=${pt({"toggle-group":!0,"-single":"single"===this.type,"-single-strict":"single-strict"===this.type,"-multiple":"multiple"===this.type,"-small":"small"===this.size,"-show-check":this.showCheck})}
|
|
1808
1921
|
gap="spacing-1"
|
|
1809
1922
|
>
|
|
1810
1923
|
<slot></slot>
|
|
1811
1924
|
</m-group>
|
|
1812
|
-
`}}
|
|
1925
|
+
`}}Xo=new WeakMap,Yo=new WeakMap,Zo=new WeakMap,Fo=new WeakMap,Ko=new WeakMap,Qo=new WeakMap,nr.styles=[[X`
|
|
1813
1926
|
.toggle-group {
|
|
1814
1927
|
inline-size: max-content;
|
|
1815
1928
|
|
|
1816
|
-
border: 1px solid ${
|
|
1817
|
-
padding: ${
|
|
1929
|
+
border: 1px solid ${Bt("color-border")};
|
|
1930
|
+
padding: ${jt("spacing-1")};
|
|
1818
1931
|
|
|
1819
|
-
border-radius: ${
|
|
1932
|
+
border-radius: ${jt("border-radius-s")};
|
|
1820
1933
|
box-sizing: border-box;
|
|
1821
1934
|
|
|
1822
|
-
block-size: ${
|
|
1935
|
+
block-size: ${jt("global-height-default")};
|
|
1823
1936
|
}
|
|
1824
1937
|
|
|
1825
1938
|
.toggle-group.-small {
|
|
1826
|
-
block-size: ${
|
|
1939
|
+
block-size: ${jt("global-height-small")};
|
|
1827
1940
|
}
|
|
1828
1941
|
|
|
1829
1942
|
.toggle-group.-small ::slotted(m-toggle) {
|
|
1830
1943
|
--m-toggle-base-size: 18px;
|
|
1831
|
-
--m-toggle-font-size: ${
|
|
1944
|
+
--m-toggle-font-size: ${jt("font-size-2")};
|
|
1832
1945
|
--m-toggle-icon-size: 10px;
|
|
1833
1946
|
}
|
|
1834
1947
|
|
|
1835
1948
|
.toggle-group.-show-check ::slotted(m-toggle[aria-checked='true']) {
|
|
1836
1949
|
--m-toggle-icon-display: inline-flex;
|
|
1837
1950
|
}
|
|
1838
|
-
`]],window.customElements.define("m-toggle-group",
|
|
1951
|
+
`]],window.customElements.define("m-toggle-group",nr);class sr extends lt{static get properties(){return{checked:{type:Boolean},disabled:{type:Boolean,reflect:!0},role:{type:String,reflect:!0},value:{type:String}}}constructor(){super(),tr.add(this),ir.set(this,(()=>{if(this.disabled)return;this.checked=!this.checked;const t={detail:{value:this.value,type:"toggle"},bubbles:!0,composed:!1};this.dispatchEvent(new CustomEvent(Ho,t))})),or.set(this,(()=>{this.setAttribute("aria-disabled",String(this.disabled))})),rr.set(this,(()=>{this.setAttribute("aria-checked",String(this.checked))})),this.disabled=!1,this.checked=!1}connectedCallback(){super.connectedCallback(),this.addEventListener("click",t(this,ir,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",t(this,ir,"f"))}updated(e){super.updated(e),e.has("disabled")&&t(this,or,"f").call(this),e.has("checked")&&t(this,rr,"f").call(this)}render(){return x`
|
|
1839
1952
|
<button
|
|
1840
1953
|
type="button"
|
|
1841
|
-
class=${
|
|
1954
|
+
class=${pt({button:!0,toggle:!0})}
|
|
1842
1955
|
role="${this.role}"
|
|
1843
1956
|
aria-checked="${this.checked}"
|
|
1844
1957
|
?disabled="${this.disabled}"
|
|
@@ -1849,38 +1962,38 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1849
1962
|
|
|
1850
1963
|
<slot></slot>
|
|
1851
1964
|
</button>
|
|
1852
|
-
`}focus(e){var i;null===(i=t(this,
|
|
1965
|
+
`}focus(e){var i;null===(i=t(this,tr,"a",er))||void 0===i||i.focus(e)}}ir=new WeakMap,or=new WeakMap,rr=new WeakMap,tr=new WeakSet,er=function(){var t,e;return null!==(e=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector("button"))&&void 0!==e?e:null},sr.styles=[[Vt(),X`
|
|
1853
1966
|
:host {
|
|
1854
1967
|
/*
|
|
1855
1968
|
* These custom properties are here because they are meant to be
|
|
1856
1969
|
* overriden via toggle-group styles.
|
|
1857
1970
|
*/
|
|
1858
1971
|
--m-toggle-base-size: 30px;
|
|
1859
|
-
--m-toggle-font-size: ${
|
|
1972
|
+
--m-toggle-font-size: ${jt("font-size-3")};
|
|
1860
1973
|
--m-toggle-icon-size: 12px;
|
|
1861
1974
|
--m-toggle-icon-display: none;
|
|
1862
1975
|
|
|
1863
1976
|
--m-button-border-color: transparent;
|
|
1864
|
-
--m-button-color: ${
|
|
1865
|
-
--m-button-padding-x: ${
|
|
1977
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
1978
|
+
--m-button-padding-x: ${jt("spacing-2")};
|
|
1866
1979
|
--m-button-padding-y: 0;
|
|
1867
1980
|
|
|
1868
1981
|
--m-button-base-size: var(--m-toggle-base-size);
|
|
1869
1982
|
--m-button-font-size: var(--m-toggle-font-size);
|
|
1870
1983
|
}
|
|
1871
1984
|
|
|
1872
|
-
${
|
|
1873
|
-
--m-button-color: ${
|
|
1985
|
+
${Gt([".toggle"])} {
|
|
1986
|
+
--m-button-color: ${Bt("color-text-disabled")};
|
|
1874
1987
|
}
|
|
1875
1988
|
|
|
1876
1989
|
[aria-checked='true'] {
|
|
1877
|
-
--m-button-background-color: ${
|
|
1990
|
+
--m-button-background-color: ${Bt("color-primary-20")};
|
|
1878
1991
|
}
|
|
1879
1992
|
|
|
1880
|
-
${
|
|
1881
|
-
--m-button-background-color: ${
|
|
1882
|
-
--m-button-border-color: ${
|
|
1883
|
-
--m-button-color: ${
|
|
1993
|
+
${It.hover(".toggle")} {
|
|
1994
|
+
--m-button-background-color: ${Bt("color-background-tertiary")};
|
|
1995
|
+
--m-button-border-color: ${Bt("color-background-tertiary")};
|
|
1996
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
1884
1997
|
}
|
|
1885
1998
|
|
|
1886
1999
|
.check-icon {
|
|
@@ -1889,5 +2002,5 @@ let Pe=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1889
2002
|
|
|
1890
2003
|
display: var(--m-toggle-icon-display);
|
|
1891
2004
|
}
|
|
1892
|
-
`]],window.customElements.define("m-toggle",
|
|
2005
|
+
`]],window.customElements.define("m-toggle",sr);export{pi as ALIGN_ITEMS_VALUES,ze as Banner,te as BannerActionPrimary,ee as BannerActionSecondary,ie as BannerActions,oe as BannerDescription,re as BannerIcon,ne as BannerTitle,fi as Box,Qt as Button,Se as Card,Ce as CardBody,We as CardSubtitle,Me as CardTitle,_e as Checkbox,fe as CloseButton,Ke as DIALOG_SIZES,Qe as DIALOG_VARIANTS,Fe as Dialog,ii as DialogActionPrimary,oi as DialogActionSecondary,ri as DialogActionTertiary,ci as DialogActions,hi as DialogBody,ui as DialogClose,bi as DialogFooter,Bi as DialogHeader,Ai as Divider,Ni as FIELD_STATUSES,Di as Field,Ui as FieldHint,qi as FieldLabel,wi as Grid,di as Group,gi as JUSTIFY_CONTENT_VALUES,Vi as ProgressBar,Ji as ProgressBarCountdown,Qi as Radio,yo as RadioGroup,zi as Sidebar,yi as Stack,Ci as Switcher,Go as Tab,Io as TabPanel,Lo as Tabs,Vo as Tag,we as Text,Jo as TextField,sr as Toggle,nr as ToggleGroup,mi as defaultBoxProps,vi as defaultGridProps,li as defaultGroupProps,xi as defaultSidebarProps,$i as defaultStackProps,Si as defaultSwitcherProps};
|
|
1893
2006
|
//# sourceMappingURL=index.js.map
|