@loadsmart/miranda-wc 1.33.1 → 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/layout/base-layout/base-layout.d.ts +1 -1
- package/dist/components/layout/base-layout/base-layout.d.ts.map +1 -1
- package/dist/components/layout/base-layout/base-layout.styles.d.ts +1 -1
- package/dist/components/layout/base-layout/base-layout.styles.d.ts.map +1 -1
- package/dist/components/layout/base-layout/index.d.ts +4 -0
- package/dist/components/layout/base-layout/index.d.ts.map +1 -0
- package/dist/components/layout/box/box.d.ts +3 -1
- package/dist/components/layout/box/box.d.ts.map +1 -1
- package/dist/components/layout/grid/grid.d.ts +3 -1
- package/dist/components/layout/grid/grid.d.ts.map +1 -1
- package/dist/components/layout/group/group.d.ts +3 -1
- package/dist/components/layout/group/group.d.ts.map +1 -1
- package/dist/components/layout/sidebar/sidebar.d.ts +3 -1
- package/dist/components/layout/sidebar/sidebar.d.ts.map +1 -1
- package/dist/components/layout/stack/stack.d.ts +3 -1
- package/dist/components/layout/stack/stack.d.ts.map +1 -1
- package/dist/components/layout/switcher/switcher.d.ts +3 -1
- package/dist/components/layout/switcher/switcher.d.ts.map +1 -1
- 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 +658 -533
- 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 N`${(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 Rt(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${Rt(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 qt(t){return H(`\n\t\t${Ot(t)};\n\t\t${Ut(t)}\n\t`)}const Nt={property:"all",delay:"0s",duration:"0.35s",easing:"ease-in-out"};function Lt(t){const e=Bt(t).map((t=>function(t){const e={...Nt,...t};return H(`${e.property} ${e.duration} ${e.easing} ${e.delay}`)}(t))).join(", ");return H(`\n\t\ttransition: ${e}\n\t`)}function Pt(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);
|
|
@@ -75,9 +75,9 @@ const dt=t=>null!=t?t:z
|
|
|
75
75
|
}
|
|
76
76
|
|
|
77
77
|
.button {
|
|
78
|
-
${
|
|
78
|
+
${Nt([{property:"color"},{property:"background-color"},{property:"border-color"}])};
|
|
79
79
|
|
|
80
|
-
${
|
|
80
|
+
${Lt("button-md")};
|
|
81
81
|
font-size: var(--m-button-font-size);
|
|
82
82
|
|
|
83
83
|
cursor: pointer;
|
|
@@ -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,23 +106,23 @@ 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(*) {
|
|
@@ -130,198 +130,198 @@ const dt=t=>null!=t?t:z
|
|
|
130
130
|
align-items: center;
|
|
131
131
|
|
|
132
132
|
${qt(0)};
|
|
133
|
-
${
|
|
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,60 +336,60 @@ 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
|
}
|
|
394
394
|
|
|
395
395
|
/* TODO: to be removed when the loading dots component is ready */
|
|
@@ -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
|
-
${
|
|
418
|
-
color: ${
|
|
417
|
+
${Lt("body-md")};
|
|
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
|
-
${
|
|
423
|
-
color: ${
|
|
422
|
+
${Lt("body-md-bold")};
|
|
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;
|
|
@@ -436,7 +436,7 @@ const dt=t=>null!=t?t:z
|
|
|
436
436
|
}
|
|
437
437
|
|
|
438
438
|
svg {
|
|
439
|
-
${
|
|
439
|
+
${Nt([{property:"color"},{property:"fill"}])};
|
|
440
440
|
|
|
441
441
|
inline-size: var(--m-icon-size);
|
|
442
442
|
block-size: var(--m-icon-size);
|
|
@@ -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,7 +468,7 @@ const dt=t=>null!=t?t:z
|
|
|
468
468
|
|
|
469
469
|
width: var(--button-size);
|
|
470
470
|
height: var(--button-size);
|
|
471
|
-
${
|
|
471
|
+
${Ot(0)};
|
|
472
472
|
${qt(0)};
|
|
473
473
|
background-color: var(--button-color);
|
|
474
474
|
border: none;
|
|
@@ -478,27 +478,27 @@ const dt=t=>null!=t?t:z
|
|
|
478
478
|
justify-content: center;
|
|
479
479
|
cursor: pointer;
|
|
480
480
|
|
|
481
|
-
${
|
|
481
|
+
${Nt([{property:"background-color"}])};
|
|
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;
|
|
@@ -554,9 +554,9 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
554
554
|
}
|
|
555
555
|
|
|
556
556
|
.m-text {
|
|
557
|
-
${
|
|
557
|
+
${Nt([{property:"color"}])};
|
|
558
558
|
|
|
559
|
-
${
|
|
559
|
+
${Lt()};
|
|
560
560
|
|
|
561
561
|
color: var(--m-text-color);
|
|
562
562
|
display: var(--m-text-display);
|
|
@@ -565,127 +565,127 @@ const fe="important",$e=" !"+fe,ye=ht(class extends ut{constructor(t){var e;if(s
|
|
|
565
565
|
}
|
|
566
566
|
|
|
567
567
|
.-body-lg-bold {
|
|
568
|
-
${
|
|
568
|
+
${Lt("body-lg-bold")};
|
|
569
569
|
}
|
|
570
570
|
|
|
571
571
|
.-body-lg {
|
|
572
|
-
${
|
|
572
|
+
${Lt("body-lg")};
|
|
573
573
|
}
|
|
574
574
|
|
|
575
575
|
.-body-md-bold-underline {
|
|
576
|
-
${
|
|
576
|
+
${Lt("body-md-bold-underline")};
|
|
577
577
|
}
|
|
578
578
|
|
|
579
579
|
.-body-md-bold {
|
|
580
|
-
${
|
|
580
|
+
${Lt("body-md-bold")};
|
|
581
581
|
}
|
|
582
582
|
|
|
583
583
|
.-body-md-underline {
|
|
584
|
-
${
|
|
584
|
+
${Lt("body-md-underline")};
|
|
585
585
|
}
|
|
586
586
|
|
|
587
587
|
.-body-md {
|
|
588
|
-
${
|
|
588
|
+
${Lt("body-md")};
|
|
589
589
|
}
|
|
590
590
|
|
|
591
591
|
.-body-sm-bold-underline {
|
|
592
|
-
${
|
|
592
|
+
${Lt("body-sm-bold-underline")};
|
|
593
593
|
}
|
|
594
594
|
|
|
595
595
|
.-body-sm-bold {
|
|
596
|
-
${
|
|
596
|
+
${Lt("body-sm-bold")};
|
|
597
597
|
}
|
|
598
598
|
|
|
599
599
|
.-body-sm-underline {
|
|
600
|
-
${
|
|
600
|
+
${Lt("body-sm-underline")};
|
|
601
601
|
}
|
|
602
602
|
|
|
603
603
|
.-body-sm {
|
|
604
|
-
${
|
|
604
|
+
${Lt("body-sm")};
|
|
605
605
|
}
|
|
606
606
|
|
|
607
607
|
.-button-lg {
|
|
608
|
-
${
|
|
608
|
+
${Lt("button-lg")};
|
|
609
609
|
}
|
|
610
610
|
|
|
611
611
|
.-button-md {
|
|
612
|
-
${
|
|
612
|
+
${Lt("button-md")};
|
|
613
613
|
}
|
|
614
614
|
|
|
615
615
|
.-button-sm {
|
|
616
|
-
${
|
|
616
|
+
${Lt("button-sm")};
|
|
617
617
|
}
|
|
618
618
|
|
|
619
619
|
.-chips-md {
|
|
620
|
-
${
|
|
620
|
+
${Lt("chips-md")};
|
|
621
621
|
}
|
|
622
622
|
|
|
623
623
|
.-chips-sm {
|
|
624
|
-
${
|
|
624
|
+
${Lt("chips-sm")};
|
|
625
625
|
}
|
|
626
626
|
|
|
627
627
|
.-heading-lg-bold {
|
|
628
|
-
${
|
|
628
|
+
${Lt("heading-lg-bold")};
|
|
629
629
|
}
|
|
630
630
|
|
|
631
631
|
.-heading-lg {
|
|
632
|
-
${
|
|
632
|
+
${Lt("heading-lg")};
|
|
633
633
|
}
|
|
634
634
|
|
|
635
635
|
.-heading-md-bold {
|
|
636
|
-
${
|
|
636
|
+
${Lt("heading-md-bold")};
|
|
637
637
|
}
|
|
638
638
|
|
|
639
639
|
.-heading-md {
|
|
640
|
-
${
|
|
640
|
+
${Lt("heading-md")};
|
|
641
641
|
}
|
|
642
642
|
|
|
643
643
|
.-heading-sm-bold {
|
|
644
|
-
${
|
|
644
|
+
${Lt("heading-sm-bold")};
|
|
645
645
|
}
|
|
646
646
|
|
|
647
647
|
.-heading-sm {
|
|
648
|
-
${
|
|
648
|
+
${Lt("heading-sm")};
|
|
649
649
|
}
|
|
650
650
|
|
|
651
651
|
.-hero-lg-bold {
|
|
652
|
-
${
|
|
652
|
+
${Lt("hero-lg-bold")};
|
|
653
653
|
}
|
|
654
654
|
|
|
655
655
|
.-hero-lg {
|
|
656
|
-
${
|
|
656
|
+
${Lt("hero-lg")};
|
|
657
657
|
}
|
|
658
658
|
|
|
659
659
|
.-hero-md-bold {
|
|
660
|
-
${
|
|
660
|
+
${Lt("hero-md-bold")};
|
|
661
661
|
}
|
|
662
662
|
|
|
663
663
|
.-hero-md {
|
|
664
|
-
${
|
|
664
|
+
${Lt("hero-md")};
|
|
665
665
|
}
|
|
666
666
|
|
|
667
667
|
.-hero-sm-bold {
|
|
668
|
-
${
|
|
668
|
+
${Lt("hero-sm-bold")};
|
|
669
669
|
}
|
|
670
670
|
|
|
671
671
|
.-hero-sm {
|
|
672
|
-
${
|
|
672
|
+
${Lt("hero-sm")};
|
|
673
673
|
}
|
|
674
674
|
|
|
675
675
|
.-number-md {
|
|
676
|
-
${
|
|
676
|
+
${Lt("number-md")};
|
|
677
677
|
}
|
|
678
678
|
|
|
679
679
|
.-number-sm {
|
|
680
|
-
${
|
|
680
|
+
${Lt("number-sm")};
|
|
681
681
|
}
|
|
682
682
|
|
|
683
683
|
.-table-header-md {
|
|
684
|
-
${
|
|
684
|
+
${Lt("table-header-md")};
|
|
685
685
|
}
|
|
686
686
|
|
|
687
687
|
.-table-header-sm {
|
|
688
|
-
${
|
|
688
|
+
${Lt("table-header-sm")};
|
|
689
689
|
}
|
|
690
690
|
|
|
691
691
|
.-ellipsized {
|
|
@@ -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,56 +838,56 @@ 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
|
|
|
867
867
|
.m-card-subtitle {
|
|
868
|
-
${
|
|
868
|
+
${Lt("body-md")};
|
|
869
869
|
|
|
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
|
-
${
|
|
890
|
-
color: ${
|
|
889
|
+
${Lt("heading-sm-bold")};
|
|
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
|
-
${
|
|
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
|
|
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,13 +1051,13 @@ let Re=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
|
|
|
1060
|
-
${
|
|
1060
|
+
${Nt([{property:"max-width"}])}
|
|
1061
1061
|
}
|
|
1062
1062
|
|
|
1063
1063
|
dialog[open] {
|
|
@@ -1066,23 +1066,23 @@ let Re=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,30 +1128,42 @@ let Re=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
|
-
--m-
|
|
1135
|
-
var(
|
|
1134
|
+
--m-${H(t)}-padding-t,
|
|
1135
|
+
var(
|
|
1136
|
+
--m-${H(t)}-padding-y,
|
|
1137
|
+
var(--m-${H(t)}-padding, 0)
|
|
1138
|
+
)
|
|
1136
1139
|
);
|
|
1137
1140
|
padding-block-end: var(
|
|
1138
|
-
--m-
|
|
1139
|
-
var(
|
|
1141
|
+
--m-${H(t)}-padding-b,
|
|
1142
|
+
var(
|
|
1143
|
+
--m-${H(t)}-padding-y,
|
|
1144
|
+
var(--m-${H(t)}-padding, 0)
|
|
1145
|
+
)
|
|
1140
1146
|
);
|
|
1141
1147
|
padding-inline-start: var(
|
|
1142
|
-
--m-
|
|
1143
|
-
var(
|
|
1148
|
+
--m-${H(t)}-padding-l,
|
|
1149
|
+
var(
|
|
1150
|
+
--m-${H(t)}-padding-x,
|
|
1151
|
+
var(--m-${H(t)}-padding, 0)
|
|
1152
|
+
)
|
|
1144
1153
|
);
|
|
1145
1154
|
padding-inline-end: var(
|
|
1146
|
-
--m-
|
|
1147
|
-
var(
|
|
1155
|
+
--m-${H(t)}-padding-r,
|
|
1156
|
+
var(
|
|
1157
|
+
--m-${H(t)}-padding-x,
|
|
1158
|
+
var(--m-${H(t)}-padding, 0)
|
|
1159
|
+
)
|
|
1148
1160
|
);
|
|
1149
1161
|
}
|
|
1150
|
-
`
|
|
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`
|
|
1151
1163
|
:host {
|
|
1152
|
-
--m-group-gap: ${
|
|
1153
|
-
--m-group-align: ${H(
|
|
1154
|
-
--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)};
|
|
1155
1167
|
|
|
1156
1168
|
display: flex;
|
|
1157
1169
|
flex-wrap: wrap;
|
|
@@ -1159,20 +1171,20 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1159
1171
|
align-items: var(--m-group-align);
|
|
1160
1172
|
justify-content: var(--m-group-justify);
|
|
1161
1173
|
}
|
|
1162
|
-
`],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
|
|
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`
|
|
1163
1175
|
:host {
|
|
1164
1176
|
overflow-y: auto;
|
|
1165
1177
|
overscroll-behavior: contain;
|
|
1166
1178
|
|
|
1167
|
-
${
|
|
1179
|
+
${Lt("body-md")};
|
|
1168
1180
|
}
|
|
1169
|
-
`],window.customElements.define("m-dialog-body",hi);class ui extends
|
|
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`
|
|
1170
1182
|
:host {
|
|
1171
|
-
--m-
|
|
1183
|
+
--m-box-padding: ${jt(mi.padding)};
|
|
1172
1184
|
--m-box-background-color: transparent;
|
|
1173
|
-
--m-box-border-radius: ${
|
|
1174
|
-
--m-box-border-width: ${
|
|
1175
|
-
--m-box-border-color: ${
|
|
1185
|
+
--m-box-border-radius: ${jt(mi.borderRadius)};
|
|
1186
|
+
--m-box-border-width: ${jt(mi.borderWidth)};
|
|
1187
|
+
--m-box-border-color: ${Bt(mi.borderColor)};
|
|
1176
1188
|
--m-box-text-align: ${H(mi.textAlign)};
|
|
1177
1189
|
|
|
1178
1190
|
box-sizing: border-box;
|
|
@@ -1184,11 +1196,11 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1184
1196
|
border-color: var(--m-box-border-color);
|
|
1185
1197
|
text-align: var(--m-box-text-align);
|
|
1186
1198
|
}
|
|
1187
|
-
`],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`
|
|
1188
1200
|
:host {
|
|
1189
|
-
--m-stack-gap: ${
|
|
1190
|
-
--m-stack-align: ${H(
|
|
1191
|
-
--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)};
|
|
1192
1204
|
|
|
1193
1205
|
display: flex;
|
|
1194
1206
|
flex-direction: column;
|
|
@@ -1197,10 +1209,10 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1197
1209
|
align-items: var(--m-stack-align);
|
|
1198
1210
|
justify-content: var(--m-stack-justify);
|
|
1199
1211
|
}
|
|
1200
|
-
`],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`
|
|
1201
1213
|
:host {
|
|
1202
|
-
--m-grid-gap: ${
|
|
1203
|
-
--m-grid-min-column-width: ${H(
|
|
1214
|
+
--m-grid-gap: ${jt(vi.gap)};
|
|
1215
|
+
--m-grid-min-column-width: ${H(vi.minColumnWidth)};
|
|
1204
1216
|
|
|
1205
1217
|
display: grid;
|
|
1206
1218
|
|
|
@@ -1212,15 +1224,15 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1212
1224
|
minmax(min(var(--m-grid-min-column-width), 100%), 1fr)
|
|
1213
1225
|
);
|
|
1214
1226
|
}
|
|
1215
|
-
`],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`
|
|
1216
1228
|
<slot name="sidebar"></slot>
|
|
1217
1229
|
<slot name="content"></slot>
|
|
1218
|
-
`}}
|
|
1230
|
+
`}}zi.CSSPropertiesPrefix="sidebar",zi.styles=[ai(zi.CSSPropertiesPrefix),X`
|
|
1219
1231
|
:host {
|
|
1220
|
-
--m-sidebar-gap: ${
|
|
1221
|
-
--m-sidebar-flex-direction: ${H(
|
|
1222
|
-
--m-sidebar-side-width: ${H(
|
|
1223
|
-
--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)};
|
|
1224
1236
|
|
|
1225
1237
|
display: flex;
|
|
1226
1238
|
flex-wrap: wrap;
|
|
@@ -1239,7 +1251,7 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1239
1251
|
flex-grow: 999;
|
|
1240
1252
|
min-width: var(--m-sidebar-min-content-width);
|
|
1241
1253
|
}
|
|
1242
|
-
`],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`
|
|
1243
1255
|
<style>
|
|
1244
1256
|
::slotted(*:nth-last-child(n + ${this.limit+1})) {
|
|
1245
1257
|
flex-basis: 100%;
|
|
@@ -1251,10 +1263,10 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1251
1263
|
`:"";return x`
|
|
1252
1264
|
${t}
|
|
1253
1265
|
<slot></slot>
|
|
1254
|
-
`}}
|
|
1266
|
+
`}}var Wi,Mi,ji;Ci.CSSPropertiesPrefix="switcher",Ci.styles=[ai(Ci.CSSPropertiesPrefix),X`
|
|
1255
1267
|
:host {
|
|
1256
|
-
--m-switcher-gap: ${
|
|
1257
|
-
--m-switcher-threshold: ${H(
|
|
1268
|
+
--m-switcher-gap: ${jt(Si.gap)};
|
|
1269
|
+
--m-switcher-threshold: ${H(Si.threshold)};
|
|
1258
1270
|
|
|
1259
1271
|
display: flex;
|
|
1260
1272
|
flex-wrap: wrap;
|
|
@@ -1267,27 +1279,27 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1267
1279
|
flex-basis: calc((var(--m-switcher-threshold) - 100%) * 999);
|
|
1268
1280
|
flex-grow: 1;
|
|
1269
1281
|
}
|
|
1270
|
-
`],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`
|
|
1271
1283
|
<m-group gap="spacing-6" align="center">
|
|
1272
1284
|
<m-group gap="spacing-1" align="center" style="flex-grow: 1;">
|
|
1273
|
-
${t(this,
|
|
1285
|
+
${t(this,Wi,"a",ji)}
|
|
1274
1286
|
<h1><slot></slot></h1>
|
|
1275
1287
|
</m-group>
|
|
1276
1288
|
<slot name="close"></slot>
|
|
1277
1289
|
</m-group>
|
|
1278
|
-
`}}
|
|
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`
|
|
1279
1291
|
<m-icon name=${i} color=${o} size="24" aria-hidden="true"></m-icon>
|
|
1280
|
-
`},
|
|
1292
|
+
`},Bi.styles=[X`
|
|
1281
1293
|
h1 {
|
|
1282
1294
|
margin: 0;
|
|
1283
1295
|
padding: 0;
|
|
1284
1296
|
|
|
1285
|
-
${
|
|
1297
|
+
${Lt("heading-md-bold")};
|
|
1286
1298
|
}
|
|
1287
|
-
`],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`
|
|
1288
1300
|
.m-divider {
|
|
1289
1301
|
border: 0;
|
|
1290
|
-
border-block-end: solid 1px ${
|
|
1302
|
+
border-block-end: solid 1px ${Bt("color-divider")};
|
|
1291
1303
|
margin-block-start: var(
|
|
1292
1304
|
--m-divider-margin-top,
|
|
1293
1305
|
var(--m-divider-margin-y, 0)
|
|
@@ -1297,53 +1309,53 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1297
1309
|
var(--m-divider-margin-y, 0)
|
|
1298
1310
|
);
|
|
1299
1311
|
}
|
|
1300
|
-
`],window.customElements.define("m-divider",
|
|
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
|
|
1301
1313
|
gap="spacing-0-5"
|
|
1302
1314
|
align="center"
|
|
1303
|
-
class=${
|
|
1315
|
+
class=${pt(e)}
|
|
1304
1316
|
>
|
|
1305
1317
|
<slot name="leading"
|
|
1306
|
-
>${"danger"===t(this,
|
|
1318
|
+
>${"danger"===t(this,_i,"m",Ti).call(this)?x`<m-icon
|
|
1307
1319
|
name="attention"
|
|
1308
1320
|
size="10"
|
|
1309
1321
|
color="color-danger-60"
|
|
1310
1322
|
></m-icon>`:z}</slot
|
|
1311
1323
|
>
|
|
1312
1324
|
<span
|
|
1313
|
-
class=${
|
|
1325
|
+
class=${pt({hint:!0,...e})}
|
|
1314
1326
|
><slot></slot>
|
|
1315
1327
|
</span>
|
|
1316
|
-
</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`
|
|
1317
1329
|
:host {
|
|
1318
|
-
--m-field-hint-color: ${
|
|
1330
|
+
--m-field-hint-color: ${Bt("color-text-tertiary")};
|
|
1319
1331
|
}
|
|
1320
1332
|
|
|
1321
1333
|
m-group {
|
|
1322
|
-
${
|
|
1334
|
+
${Rt(jt("spacing-2"))};
|
|
1323
1335
|
}
|
|
1324
1336
|
|
|
1325
1337
|
.-status-danger {
|
|
1326
|
-
--m-field-hint-color: ${
|
|
1338
|
+
--m-field-hint-color: ${Bt("color-danger-60")};
|
|
1327
1339
|
}
|
|
1328
1340
|
|
|
1329
1341
|
.hint {
|
|
1330
|
-
${
|
|
1342
|
+
${Lt("body-sm")};
|
|
1331
1343
|
color: var(--m-field-hint-color);
|
|
1332
1344
|
}
|
|
1333
|
-
`]],window.customElements.define("m-field-hint",
|
|
1334
|
-
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)})}
|
|
1335
1347
|
><slot></slot>
|
|
1336
|
-
${t(this,
|
|
1337
|
-
</label>`}}
|
|
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`
|
|
1338
1350
|
:host {
|
|
1339
1351
|
display: flex;
|
|
1340
1352
|
align-items: center;
|
|
1341
1353
|
justify-content: flex-start;
|
|
1342
|
-
gap: ${
|
|
1354
|
+
gap: ${jt("spacing-0-5")};
|
|
1343
1355
|
}
|
|
1344
1356
|
|
|
1345
1357
|
.label {
|
|
1346
|
-
${
|
|
1358
|
+
${Lt("body-md")};
|
|
1347
1359
|
|
|
1348
1360
|
display: inline-flex;
|
|
1349
1361
|
align-items: center;
|
|
@@ -1352,37 +1364,37 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1352
1364
|
margin: 0;
|
|
1353
1365
|
padding: 0;
|
|
1354
1366
|
|
|
1355
|
-
color: ${
|
|
1367
|
+
color: ${Bt("color-text-tertiary")};
|
|
1356
1368
|
}
|
|
1357
1369
|
|
|
1358
1370
|
.required {
|
|
1359
|
-
${
|
|
1371
|
+
${Lt("body-md")};
|
|
1360
1372
|
|
|
1361
|
-
color: ${
|
|
1373
|
+
color: ${Bt("color-text-error")};
|
|
1362
1374
|
|
|
1363
1375
|
content: '*';
|
|
1364
1376
|
|
|
1365
|
-
${
|
|
1377
|
+
${_t(jt("spacing-1"))};
|
|
1366
1378
|
}
|
|
1367
1379
|
|
|
1368
1380
|
.label.-size-small,
|
|
1369
1381
|
.label.-size-small .required {
|
|
1370
|
-
${
|
|
1382
|
+
${Lt("body-sm")};
|
|
1371
1383
|
}
|
|
1372
|
-
`]],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">
|
|
1373
1385
|
${this.label?x`<m-field-label>${this.label}</m-field-label>`:x`<slot name="label"></slot>`}
|
|
1374
1386
|
|
|
1375
1387
|
<slot></slot>
|
|
1376
1388
|
|
|
1377
1389
|
${this.hint?x`<m-field-hint>${this.hint}</m-field-hint>`:x`<slot name="hint"></slot>`}
|
|
1378
|
-
</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`
|
|
1379
1391
|
<div class="bar">
|
|
1380
1392
|
<span
|
|
1381
|
-
class=${
|
|
1382
|
-
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}%`})}
|
|
1383
1395
|
></span>
|
|
1384
1396
|
</div>
|
|
1385
|
-
`}}
|
|
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`
|
|
1386
1398
|
.bar {
|
|
1387
1399
|
display: flex;
|
|
1388
1400
|
flex-grow: 0;
|
|
@@ -1394,10 +1406,10 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1394
1406
|
overflow: hidden;
|
|
1395
1407
|
|
|
1396
1408
|
width: 100%;
|
|
1397
|
-
height: ${
|
|
1409
|
+
height: ${de("8px")};
|
|
1398
1410
|
|
|
1399
|
-
border-radius: ${
|
|
1400
|
-
background-color: ${
|
|
1411
|
+
border-radius: ${jt("border-radius-s")};
|
|
1412
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1401
1413
|
}
|
|
1402
1414
|
|
|
1403
1415
|
.progress {
|
|
@@ -1405,11 +1417,11 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1405
1417
|
top: 0;
|
|
1406
1418
|
left: 0;
|
|
1407
1419
|
|
|
1408
|
-
${
|
|
1420
|
+
${Nt([{property:"width"},{property:"background"}])};
|
|
1409
1421
|
|
|
1410
|
-
height: ${
|
|
1422
|
+
height: ${de("8px")};
|
|
1411
1423
|
|
|
1412
|
-
border-radius: ${
|
|
1424
|
+
border-radius: ${jt("border-radius-s")};
|
|
1413
1425
|
|
|
1414
1426
|
background: var(--m-progress-bar-progress-background);
|
|
1415
1427
|
}
|
|
@@ -1417,23 +1429,23 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1417
1429
|
.-default {
|
|
1418
1430
|
--m-progress-bar-progress-background: linear-gradient(
|
|
1419
1431
|
45deg,
|
|
1420
|
-
${
|
|
1421
|
-
${
|
|
1432
|
+
${Bt("color-brand-accent-1")} 22%,
|
|
1433
|
+
${Bt("color-brand-accent-2")} 88%
|
|
1422
1434
|
);
|
|
1423
1435
|
}
|
|
1424
1436
|
|
|
1425
1437
|
.-success {
|
|
1426
|
-
--m-progress-bar-progress-background: ${
|
|
1438
|
+
--m-progress-bar-progress-background: ${Bt("color-success-60")};
|
|
1427
1439
|
}
|
|
1428
1440
|
|
|
1429
1441
|
.-warning {
|
|
1430
|
-
--m-progress-bar-progress-background: ${
|
|
1442
|
+
--m-progress-bar-progress-background: ${Bt("color-warning-60")};
|
|
1431
1443
|
}
|
|
1432
1444
|
|
|
1433
1445
|
.-danger {
|
|
1434
|
-
--m-progress-bar-progress-background: ${
|
|
1446
|
+
--m-progress-bar-progress-background: ${Bt("color-danger-60")};
|
|
1435
1447
|
}
|
|
1436
|
-
`],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`
|
|
1437
1449
|
<button
|
|
1438
1450
|
type="button"
|
|
1439
1451
|
class="radio-button"
|
|
@@ -1445,34 +1457,34 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1445
1457
|
<slot name="leading"></slot>
|
|
1446
1458
|
<slot></slot>
|
|
1447
1459
|
</button>
|
|
1448
|
-
`}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`
|
|
1449
1461
|
:host {
|
|
1450
|
-
--m-radio-border-color: ${
|
|
1451
|
-
--m-radio-dot-check-color: ${
|
|
1462
|
+
--m-radio-border-color: ${Bt("color-border")};
|
|
1463
|
+
--m-radio-dot-check-color: ${Bt("color-primary-60")};
|
|
1452
1464
|
--m-radio-size: 14px;
|
|
1453
1465
|
--m-radio-background-color: white;
|
|
1454
|
-
--m-radio-border-width: ${
|
|
1455
|
-
--m-radio-label-color: ${
|
|
1456
|
-
--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")};
|
|
1457
1469
|
--m-radio-outline-offset: 2px;
|
|
1458
1470
|
}
|
|
1459
1471
|
|
|
1460
1472
|
.radio-button {
|
|
1461
|
-
${
|
|
1473
|
+
${Lt("body-md")};
|
|
1462
1474
|
color: var(--m-radio-label-color);
|
|
1463
1475
|
|
|
1464
1476
|
border: none;
|
|
1465
1477
|
background: none;
|
|
1466
1478
|
|
|
1467
|
-
height: ${
|
|
1479
|
+
height: ${jt("global-height-small")};
|
|
1468
1480
|
display: inline-flex;
|
|
1469
|
-
gap: ${
|
|
1481
|
+
gap: ${jt("spacing-1")};
|
|
1470
1482
|
align-items: center;
|
|
1471
|
-
border-radius: ${
|
|
1472
|
-
${
|
|
1483
|
+
border-radius: ${jt("border-radius-s")};
|
|
1484
|
+
${Nt({property:"color"})};
|
|
1473
1485
|
}
|
|
1474
1486
|
|
|
1475
|
-
${
|
|
1487
|
+
${It.focus(".radio-button")} {
|
|
1476
1488
|
outline: 1px solid var(--m-radio-outline-color);
|
|
1477
1489
|
outline-offset: var(--m-radio-outline-offset);
|
|
1478
1490
|
}
|
|
@@ -1488,7 +1500,7 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1488
1500
|
position: relative;
|
|
1489
1501
|
display: inline-flex;
|
|
1490
1502
|
|
|
1491
|
-
${
|
|
1503
|
+
${Nt({property:"border-color"})};
|
|
1492
1504
|
}
|
|
1493
1505
|
|
|
1494
1506
|
.radio-button .radio-input::before {
|
|
@@ -1501,7 +1513,7 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1501
1513
|
left: 50%;
|
|
1502
1514
|
display: block;
|
|
1503
1515
|
position: absolute;
|
|
1504
|
-
${
|
|
1516
|
+
${Nt([{property:"background-color"},{property:"height",duration:"120ms"},{property:"width",duration:"120ms"}])};
|
|
1505
1517
|
}
|
|
1506
1518
|
|
|
1507
1519
|
.radio-button[aria-checked='true'] .radio-input::before {
|
|
@@ -1509,18 +1521,18 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1509
1521
|
height: 10px;
|
|
1510
1522
|
}
|
|
1511
1523
|
|
|
1512
|
-
${
|
|
1524
|
+
${Gt(".radio-button")} {
|
|
1513
1525
|
cursor: default;
|
|
1514
|
-
--m-radio-label-color: ${
|
|
1515
|
-
--m-radio-background-color: ${
|
|
1526
|
+
--m-radio-label-color: ${Bt("color-neutral-40")};
|
|
1527
|
+
--m-radio-background-color: ${Bt("color-background-tertiary")};
|
|
1516
1528
|
}
|
|
1517
1529
|
|
|
1518
|
-
${
|
|
1519
|
-
--m-radio-border-color: ${
|
|
1530
|
+
${Gt('.radio-button[aria-checked="true"]',".radio-input")} {
|
|
1531
|
+
--m-radio-border-color: ${Bt("color-border")};
|
|
1520
1532
|
}
|
|
1521
1533
|
|
|
1522
|
-
${
|
|
1523
|
-
--m-radio-dot-check-color: ${
|
|
1534
|
+
${Gt(".radio-button",".radio-input::before")} {
|
|
1535
|
+
--m-radio-dot-check-color: ${Bt("color-neutral-40")};
|
|
1524
1536
|
}
|
|
1525
1537
|
|
|
1526
1538
|
.radio-button .radio-input::before {
|
|
@@ -1528,36 +1540,36 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1528
1540
|
}
|
|
1529
1541
|
|
|
1530
1542
|
.radio-button[aria-checked='true'] .radio-input {
|
|
1531
|
-
--m-radio-dot-check-color: ${
|
|
1532
|
-
--m-radio-border-color: ${
|
|
1543
|
+
--m-radio-dot-check-color: ${Bt("color-primary-60")};
|
|
1544
|
+
--m-radio-border-color: ${Bt("color-primary-60")};
|
|
1533
1545
|
}
|
|
1534
1546
|
|
|
1535
1547
|
.radio-button .radio-input {
|
|
1536
|
-
--m-radio-border-color: ${
|
|
1548
|
+
--m-radio-border-color: ${Bt("color-border")};
|
|
1537
1549
|
}
|
|
1538
1550
|
|
|
1539
|
-
${
|
|
1540
|
-
--m-radio-border-color: ${
|
|
1541
|
-
--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")};
|
|
1542
1554
|
}
|
|
1543
1555
|
|
|
1544
|
-
${
|
|
1545
|
-
--m-radio-label-color: ${
|
|
1556
|
+
${It.hover(".radio-button")} {
|
|
1557
|
+
--m-radio-label-color: ${Bt("color-text-primary")};
|
|
1546
1558
|
}
|
|
1547
1559
|
|
|
1548
|
-
${
|
|
1560
|
+
${Gt(".radio-button","*")} {
|
|
1549
1561
|
pointer-event: none;
|
|
1550
1562
|
}
|
|
1551
|
-
`],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`
|
|
1552
1564
|
<div
|
|
1553
|
-
class=${
|
|
1565
|
+
class=${pt({"radio-group":!0,"-vertical":"vertical"===this.orientation,"-horizontal":"horizontal"===this.orientation})}
|
|
1554
1566
|
>
|
|
1555
1567
|
<slot></slot>
|
|
1556
1568
|
</div>
|
|
1557
|
-
`}}
|
|
1569
|
+
`}}uo=new WeakMap,bo=new WeakMap,po=new WeakMap,go=new WeakMap,mo=new WeakMap,fo=new WeakMap,yo.styles=[X`
|
|
1558
1570
|
.radio-group {
|
|
1559
1571
|
display: flex;
|
|
1560
|
-
gap: ${
|
|
1572
|
+
gap: ${jt("spacing-2")};
|
|
1561
1573
|
}
|
|
1562
1574
|
.radio-group.-vertical {
|
|
1563
1575
|
flex-direction: column;
|
|
@@ -1565,25 +1577,138 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1565
1577
|
.radio-group.-horizontal {
|
|
1566
1578
|
flex-direction: row;
|
|
1567
1579
|
}
|
|
1568
|
-
`],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`
|
|
1569
1694
|
<span
|
|
1570
|
-
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})}
|
|
1571
1696
|
>
|
|
1572
1697
|
${this.isSkeleton?x``:x`<slot name="leading"></slot>`}
|
|
1573
1698
|
<slot></slot>
|
|
1574
1699
|
</span>
|
|
1575
|
-
`}}
|
|
1700
|
+
`}}Vo.styles=[[X`
|
|
1576
1701
|
@keyframes skeleton-loading {
|
|
1577
1702
|
0% {
|
|
1578
|
-
background-color: ${
|
|
1703
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1579
1704
|
opacity: 0.3;
|
|
1580
1705
|
}
|
|
1581
1706
|
50% {
|
|
1582
|
-
background-color: ${
|
|
1707
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1583
1708
|
opacity: 0.6;
|
|
1584
1709
|
}
|
|
1585
1710
|
100% {
|
|
1586
|
-
background-color: ${
|
|
1711
|
+
background-color: ${Bt("color-background-tertiary")};
|
|
1587
1712
|
}
|
|
1588
1713
|
}
|
|
1589
1714
|
`,X`
|
|
@@ -1598,60 +1723,60 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1598
1723
|
box-sizing: border-box;
|
|
1599
1724
|
max-width: 200px;
|
|
1600
1725
|
border-radius: 100px;
|
|
1601
|
-
line-height: ${
|
|
1726
|
+
line-height: ${jt("line-height-1")};
|
|
1602
1727
|
cursor: default;
|
|
1603
1728
|
}
|
|
1604
1729
|
|
|
1605
1730
|
.tag slot[name='leading']::slotted(*) {
|
|
1606
|
-
margin-inline-end: ${
|
|
1731
|
+
margin-inline-end: ${jt("spacing-1")};
|
|
1607
1732
|
vertical-align: middle;
|
|
1608
1733
|
}
|
|
1609
1734
|
|
|
1610
1735
|
.-size-small {
|
|
1611
|
-
${
|
|
1612
|
-
padding: ${
|
|
1613
|
-
block-size: ${
|
|
1736
|
+
${Lt("chips-sm")};
|
|
1737
|
+
padding: ${jt("spacing-1")} ${jt("spacing-2")};
|
|
1738
|
+
block-size: ${de("18px")};
|
|
1614
1739
|
}
|
|
1615
1740
|
.-size-default {
|
|
1616
|
-
${
|
|
1617
|
-
padding: ${
|
|
1618
|
-
block-size: ${
|
|
1741
|
+
${Lt("chips-md")};
|
|
1742
|
+
padding: ${jt("spacing-2")} ${jt("spacing-3")};
|
|
1743
|
+
block-size: ${jt("global-height-small")};
|
|
1619
1744
|
}
|
|
1620
1745
|
.-size-large {
|
|
1621
|
-
${
|
|
1622
|
-
padding: ${
|
|
1623
|
-
block-size: ${
|
|
1746
|
+
${Lt("button-lg")};
|
|
1747
|
+
padding: ${jt("spacing-3")} ${jt("spacing-4")};
|
|
1748
|
+
block-size: ${jt("global-height-default")};
|
|
1624
1749
|
}
|
|
1625
1750
|
|
|
1626
1751
|
.-success {
|
|
1627
|
-
color: ${
|
|
1628
|
-
background: ${
|
|
1752
|
+
color: ${Bt("color-success-60")};
|
|
1753
|
+
background: ${Bt("color-success-20")};
|
|
1629
1754
|
}
|
|
1630
1755
|
.-neutral {
|
|
1631
|
-
color: ${
|
|
1632
|
-
background: ${
|
|
1756
|
+
color: ${Bt("color-text-tertiary")};
|
|
1757
|
+
background: ${Bt("color-background-tertiary")};
|
|
1633
1758
|
}
|
|
1634
1759
|
.-warning {
|
|
1635
|
-
color: ${
|
|
1636
|
-
background: ${
|
|
1760
|
+
color: ${Bt("color-warning-100")};
|
|
1761
|
+
background: ${Bt("color-warning-20")};
|
|
1637
1762
|
}
|
|
1638
1763
|
.-danger {
|
|
1639
|
-
color: ${
|
|
1640
|
-
background: ${
|
|
1764
|
+
color: ${Bt("color-danger-60")};
|
|
1765
|
+
background: ${Bt("color-danger-20")};
|
|
1641
1766
|
}
|
|
1642
1767
|
|
|
1643
1768
|
.-is-skeleton {
|
|
1644
1769
|
${H("animation: skeleton-loading 1s linear infinite alternate;")};
|
|
1645
1770
|
width: var(--m-tag-skeleton-width);
|
|
1646
1771
|
}
|
|
1647
|
-
`]],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`
|
|
1648
1773
|
<div
|
|
1649
|
-
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)})}
|
|
1650
1775
|
>
|
|
1651
1776
|
<slot name="leading"></slot>
|
|
1652
1777
|
<input
|
|
1653
|
-
id="${
|
|
1654
|
-
type="${
|
|
1778
|
+
id="${ct(this.id)}"
|
|
1779
|
+
type="${ct(this.type)}"
|
|
1655
1780
|
class="text-field"
|
|
1656
1781
|
aria-disabled=${this.disabled?"true":"false"}
|
|
1657
1782
|
?disabled="${this.disabled}"
|
|
@@ -1660,80 +1785,80 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1660
1785
|
maxlength=${null!=this.maxLength&&this.maxLength>-1?this.maxLength:z}
|
|
1661
1786
|
min=${this.min||z}
|
|
1662
1787
|
minlength=${null!=this.minLength&&this.minLength>-1?this.minLength:z}
|
|
1663
|
-
pattern=${
|
|
1664
|
-
placeholder="${
|
|
1788
|
+
pattern=${ct(this.pattern)}
|
|
1789
|
+
placeholder="${ct(this.placeholder)}"
|
|
1665
1790
|
step=${this.step||z}
|
|
1666
|
-
value="${
|
|
1791
|
+
value="${ct(this.value)}"
|
|
1667
1792
|
@change=${this.reemit}
|
|
1668
|
-
@input=${t(this,
|
|
1793
|
+
@input=${t(this,Do,"f")}
|
|
1669
1794
|
/>
|
|
1670
1795
|
${this.clearable?x`<m-close-button
|
|
1671
|
-
class=${
|
|
1672
|
-
controls="${
|
|
1673
|
-
@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")}
|
|
1674
1799
|
label="Clear input"
|
|
1675
1800
|
></m-close-button>`:z}
|
|
1676
1801
|
<slot name="trailing"></slot>
|
|
1677
1802
|
</div>
|
|
1678
|
-
`}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`
|
|
1679
1804
|
:host {
|
|
1680
1805
|
--m-text-field-background-color: transparent;
|
|
1681
|
-
--m-text-field-border-color: ${
|
|
1682
|
-
--m-text-field-height: ${
|
|
1683
|
-
--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")};
|
|
1684
1809
|
--m-text-field-outline-offset: 2px;
|
|
1685
|
-
--m-text-field-padding-y: ${
|
|
1686
|
-
--m-text-field-placeholder-color: ${
|
|
1687
|
-
--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")};
|
|
1688
1813
|
}
|
|
1689
1814
|
|
|
1690
1815
|
.container {
|
|
1691
|
-
${
|
|
1692
|
-
${
|
|
1816
|
+
${Lt("body-md")};
|
|
1817
|
+
${Nt([{property:"background-color"},{property:"border-color"}])};
|
|
1693
1818
|
|
|
1694
1819
|
display: inline-flex;
|
|
1695
1820
|
align-items: center;
|
|
1696
1821
|
justify-content: start;
|
|
1697
|
-
gap: ${
|
|
1822
|
+
gap: ${jt("spacing-2")};
|
|
1698
1823
|
|
|
1699
1824
|
position: relative;
|
|
1700
1825
|
box-sizing: border-box;
|
|
1701
1826
|
width: 100%;
|
|
1702
1827
|
block-size: var(--m-text-field-height);
|
|
1703
1828
|
|
|
1704
|
-
${
|
|
1829
|
+
${Rt(jt("spacing-2"))};
|
|
1705
1830
|
|
|
1706
1831
|
background-color: var(--m-text-field-background-color);
|
|
1707
|
-
border-radius: ${
|
|
1832
|
+
border-radius: ${jt("border-radius-s")};
|
|
1708
1833
|
border: 1px solid var(--m-text-field-border-color);
|
|
1709
1834
|
}
|
|
1710
1835
|
|
|
1711
1836
|
.container.-size-small {
|
|
1712
|
-
--m-text-field-height: ${
|
|
1837
|
+
--m-text-field-height: ${jt("global-height-small")};
|
|
1713
1838
|
--m-text-field-padding-y: 0;
|
|
1714
1839
|
}
|
|
1715
1840
|
|
|
1716
1841
|
.container.-size-small,
|
|
1717
1842
|
.container.-size-small .text-field {
|
|
1718
|
-
${
|
|
1843
|
+
${Lt("body-sm")};
|
|
1719
1844
|
}
|
|
1720
1845
|
|
|
1721
1846
|
.container.-size-large {
|
|
1722
|
-
--m-text-field-height: ${
|
|
1723
|
-
--m-text-field-padding-y: ${
|
|
1847
|
+
--m-text-field-height: ${jt("global-height-large")};
|
|
1848
|
+
--m-text-field-padding-y: ${jt("spacing-3")};
|
|
1724
1849
|
}
|
|
1725
1850
|
|
|
1726
1851
|
.container.-status-danger {
|
|
1727
|
-
--m-text-field-border-color: ${
|
|
1852
|
+
--m-text-field-border-color: ${Bt("color-danger-60")};
|
|
1728
1853
|
}
|
|
1729
1854
|
|
|
1730
|
-
${
|
|
1731
|
-
--m-text-field-background-color: ${
|
|
1855
|
+
${Gt(".container")} {
|
|
1856
|
+
--m-text-field-background-color: ${Bt("color-background-tertiary")};
|
|
1732
1857
|
|
|
1733
1858
|
cursor: default;
|
|
1734
1859
|
}
|
|
1735
1860
|
|
|
1736
|
-
${
|
|
1861
|
+
${Gt(".container","*")} {
|
|
1737
1862
|
pointer-events: none;
|
|
1738
1863
|
}
|
|
1739
1864
|
|
|
@@ -1745,26 +1870,26 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1745
1870
|
cursor: default;
|
|
1746
1871
|
}
|
|
1747
1872
|
|
|
1748
|
-
${
|
|
1749
|
-
--m-text-field-border-color: ${
|
|
1873
|
+
${It.hover(".container")} {
|
|
1874
|
+
--m-text-field-border-color: ${Bt("color-primary-60")};
|
|
1750
1875
|
}
|
|
1751
1876
|
|
|
1752
|
-
${
|
|
1753
|
-
--m-text-field-border-color: ${
|
|
1877
|
+
${It.focus(".container")} {
|
|
1878
|
+
--m-text-field-border-color: ${Bt("color-primary-60")};
|
|
1754
1879
|
|
|
1755
1880
|
outline: 1px solid var(--m-text-field-outline-color);
|
|
1756
1881
|
outline-offset: var(--m-text-field-outline-offset);
|
|
1757
1882
|
}
|
|
1758
1883
|
|
|
1759
1884
|
.text-field {
|
|
1760
|
-
${
|
|
1885
|
+
${Lt("body-md")};
|
|
1761
1886
|
|
|
1762
1887
|
border: none;
|
|
1763
1888
|
outline: none;
|
|
1764
1889
|
flex: 1;
|
|
1765
1890
|
min-width: 0;
|
|
1766
1891
|
|
|
1767
|
-
${
|
|
1892
|
+
${Rt(0)};
|
|
1768
1893
|
padding-block: var(--m-text-field-padding-y);
|
|
1769
1894
|
|
|
1770
1895
|
background-color: var(--m-text-field-background-color);
|
|
@@ -1775,8 +1900,8 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1775
1900
|
color: var(--m-text-field-placeholder-color);
|
|
1776
1901
|
}
|
|
1777
1902
|
|
|
1778
|
-
${
|
|
1779
|
-
${
|
|
1903
|
+
${It.active(".text-field")},
|
|
1904
|
+
${It.focus(".text-field")} {
|
|
1780
1905
|
-webkit-appearance: none;
|
|
1781
1906
|
background: none;
|
|
1782
1907
|
border: none;
|
|
@@ -1790,43 +1915,43 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1790
1915
|
.clear.is-visible {
|
|
1791
1916
|
visibility: visible;
|
|
1792
1917
|
}
|
|
1793
|
-
`],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`
|
|
1794
1919
|
<m-group
|
|
1795
|
-
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})}
|
|
1796
1921
|
gap="spacing-1"
|
|
1797
1922
|
>
|
|
1798
1923
|
<slot></slot>
|
|
1799
1924
|
</m-group>
|
|
1800
|
-
`}}
|
|
1925
|
+
`}}Xo=new WeakMap,Yo=new WeakMap,Zo=new WeakMap,Fo=new WeakMap,Ko=new WeakMap,Qo=new WeakMap,nr.styles=[[X`
|
|
1801
1926
|
.toggle-group {
|
|
1802
1927
|
inline-size: max-content;
|
|
1803
1928
|
|
|
1804
|
-
border: 1px solid ${
|
|
1805
|
-
padding: ${
|
|
1929
|
+
border: 1px solid ${Bt("color-border")};
|
|
1930
|
+
padding: ${jt("spacing-1")};
|
|
1806
1931
|
|
|
1807
|
-
border-radius: ${
|
|
1932
|
+
border-radius: ${jt("border-radius-s")};
|
|
1808
1933
|
box-sizing: border-box;
|
|
1809
1934
|
|
|
1810
|
-
block-size: ${
|
|
1935
|
+
block-size: ${jt("global-height-default")};
|
|
1811
1936
|
}
|
|
1812
1937
|
|
|
1813
1938
|
.toggle-group.-small {
|
|
1814
|
-
block-size: ${
|
|
1939
|
+
block-size: ${jt("global-height-small")};
|
|
1815
1940
|
}
|
|
1816
1941
|
|
|
1817
1942
|
.toggle-group.-small ::slotted(m-toggle) {
|
|
1818
1943
|
--m-toggle-base-size: 18px;
|
|
1819
|
-
--m-toggle-font-size: ${
|
|
1944
|
+
--m-toggle-font-size: ${jt("font-size-2")};
|
|
1820
1945
|
--m-toggle-icon-size: 10px;
|
|
1821
1946
|
}
|
|
1822
1947
|
|
|
1823
1948
|
.toggle-group.-show-check ::slotted(m-toggle[aria-checked='true']) {
|
|
1824
1949
|
--m-toggle-icon-display: inline-flex;
|
|
1825
1950
|
}
|
|
1826
|
-
`]],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`
|
|
1827
1952
|
<button
|
|
1828
1953
|
type="button"
|
|
1829
|
-
class=${
|
|
1954
|
+
class=${pt({button:!0,toggle:!0})}
|
|
1830
1955
|
role="${this.role}"
|
|
1831
1956
|
aria-checked="${this.checked}"
|
|
1832
1957
|
?disabled="${this.disabled}"
|
|
@@ -1837,38 +1962,38 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1837
1962
|
|
|
1838
1963
|
<slot></slot>
|
|
1839
1964
|
</button>
|
|
1840
|
-
`}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`
|
|
1841
1966
|
:host {
|
|
1842
1967
|
/*
|
|
1843
1968
|
* These custom properties are here because they are meant to be
|
|
1844
1969
|
* overriden via toggle-group styles.
|
|
1845
1970
|
*/
|
|
1846
1971
|
--m-toggle-base-size: 30px;
|
|
1847
|
-
--m-toggle-font-size: ${
|
|
1972
|
+
--m-toggle-font-size: ${jt("font-size-3")};
|
|
1848
1973
|
--m-toggle-icon-size: 12px;
|
|
1849
1974
|
--m-toggle-icon-display: none;
|
|
1850
1975
|
|
|
1851
1976
|
--m-button-border-color: transparent;
|
|
1852
|
-
--m-button-color: ${
|
|
1853
|
-
--m-button-padding-x: ${
|
|
1977
|
+
--m-button-color: ${Bt("color-primary-100")};
|
|
1978
|
+
--m-button-padding-x: ${jt("spacing-2")};
|
|
1854
1979
|
--m-button-padding-y: 0;
|
|
1855
1980
|
|
|
1856
1981
|
--m-button-base-size: var(--m-toggle-base-size);
|
|
1857
1982
|
--m-button-font-size: var(--m-toggle-font-size);
|
|
1858
1983
|
}
|
|
1859
1984
|
|
|
1860
|
-
${
|
|
1861
|
-
--m-button-color: ${
|
|
1985
|
+
${Gt([".toggle"])} {
|
|
1986
|
+
--m-button-color: ${Bt("color-text-disabled")};
|
|
1862
1987
|
}
|
|
1863
1988
|
|
|
1864
1989
|
[aria-checked='true'] {
|
|
1865
|
-
--m-button-background-color: ${
|
|
1990
|
+
--m-button-background-color: ${Bt("color-primary-20")};
|
|
1866
1991
|
}
|
|
1867
1992
|
|
|
1868
|
-
${
|
|
1869
|
-
--m-button-background-color: ${
|
|
1870
|
-
--m-button-border-color: ${
|
|
1871
|
-
--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")};
|
|
1872
1997
|
}
|
|
1873
1998
|
|
|
1874
1999
|
.check-icon {
|
|
@@ -1877,5 +2002,5 @@ let Re=class{constructor(t,e,i,o=!1){this.host=t,this.context=e,this.callback=i,
|
|
|
1877
2002
|
|
|
1878
2003
|
display: var(--m-toggle-icon-display);
|
|
1879
2004
|
}
|
|
1880
|
-
`]],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};
|
|
1881
2006
|
//# sourceMappingURL=index.js.map
|