@limetech/lime-elements/dist/lime-elements/p-c6aaf532.entry.js

Lime Elements

import{r as e,h as t,H as o,g as i}from"./p-288f0842.js";import{m as a,r as n}from"./p-e127eaaa.js";import{g as s,b as r}from"./p-d251f404.js";const l='@charset "UTF-8";:host{display:inline-block}:host([hidden]){display:none}:host([aria-expanded=true]) button,:host([aria-expanded]:not([aria-expanded=false])) button{box-shadow:var(--button-shadow-inset-pressed) !important}button.mdc-button{font-family:inherit}button{display:flex;align-items:center;justify-content:center;gap:0.125rem;border:none;border-radius:0.4rem;padding-top:0;padding-right:var(--button-padding-right, 0.5rem);padding-bottom:0;padding-left:var(--button-padding-left, 0.5rem);min-height:2.25rem;width:100%}button:disabled{cursor:not-allowed}button:disabled.outlined{border-color:rgba(var(--contrast-1700), 0.2)}button:not(:disabled){transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}button:not(:disabled):focus{outline:none}button:not(:disabled):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button:not(:disabled):hover,button:not(:disabled):focus,button:not(:disabled):focus-visible{will-change:color, background-color, box-shadow, transform}button:not(:disabled):hover,button:not(:disabled):focus-visible{transform:translate3d(0, -0.04rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button:not(:disabled):active{--limel-clickable-transform-timing-function:cubic-bezier(\n      0.83,\n      -0.15,\n      0.49,\n      1.16\n  );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button:not(:disabled):hover,button:not(:disabled):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}:host(limel-button[primary]) button:not(:disabled){color:var(--lime-on-primary-color, var(--limel-theme-on-primary-color));background-color:var(--lime-primary-color, var(--limel-theme-primary-color))}:host(limel-button[primary]) button:disabled{background-color:rgba(var(--contrast-1700), 0.15)}:host(limel-button:not([primary])) button:not(:disabled){color:var(--lime-primary-color, var(--limel-theme-primary-color))}:host(limel-button:not([primary])) button:disabled{color:rgba(var(--contrast-1600), 0.37);background-color:rgba(var(--contrast-1600), 0.1)}.label{font-size:var(--limel-theme-default-font-size);font-weight:600;letter-spacing:0.03125rem;padding:0 0.25rem}limel-spinner{position:absolute}limel-icon{width:1.25rem;flex-shrink:0;vertical-align:top}svg{height:1.875rem;opacity:0;pointer-events:none;position:absolute;width:1.875rem}svg line{stroke:rgb(var(--contrast-600));stroke-width:2}limel-icon,.label,limel-spinner,svg{transition:opacity 300ms ease-in-out}.loading limel-icon,.loading .label{opacity:0}.loading limel-spinner{opacity:1}.just-loaded limel-icon,.just-loaded .label,.just-failed limel-icon,.just-failed .label{opacity:0}.just-loaded svg,.just-failed svg{opacity:1}.just-failed{background-color:var(--limel-theme-error-color) !important;animation:shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both}.outlined{border:1px solid;border-color:var(--lime-primary-color, var(--limel-theme-primary-color))}@keyframes shake{10%,90%{transform:translate3d(-0.0625rem, 0, 0)}20%,80%{transform:translate3d(0.125rem, 0, 0)}30%,50%,70%{transform:translate3d(-0.1875rem, 0, 0)}40%,60%{transform:translate3d(0.1875rem, 0, 0)}}@keyframes reduced-presence{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0.7)}}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded){animation:reduced-presence 0.3s ease forwards;transition:padding 0.3s ease, min-width 0.3s ease;transition-delay:0.3s;padding:0;min-width:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .label{transition:font-size 0.8s ease;transition-delay:0.3s;font-size:0;opacity:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-icon,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-spinner,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) svg,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .icon{transition:all 0.3s ease;transition-delay:0.3s;opacity:0;width:0;height:0}';const d=class{constructor(t){e(this,t);this.filterClickWhenDisabled=e=>{if(this.disabled){e.preventDefault()}};this.label=undefined;this.primary=false;this.outlined=false;this.icon=undefined;this.disabled=false;this.loading=false;this.loadingFailed=false;this.justLoaded=false}componentWillLoad(){a(this.host)}disconnectedCallback(){n(this.host)}render(){return t(o,{onClick:this.filterClickWhenDisabled},t("button",{class:{loading:this.loading,"just-loaded":this.justLoaded&&!this.loadingFailed,"just-failed":this.justLoaded&&this.loadingFailed,outlined:this.outlined},disabled:this.disabled||this.loading,"aria-busy":this.loading?"true":"false","aria-live":"polite"},this.renderIcon(this.icon),this.renderLabel(),this.renderSpinner(),t("svg",{viewBox:"0 0 30 30"},this.renderLoadingIcons())))}loadingWatcher(e,t){const o=this.hasFinishedLoading(e,t);if(o){this.handleLoadingFinished()}else if(e){this.handleLoadingStarted()}}hasFinishedLoading(e,t){return t&&!e}handleLoadingFinished(){this.justLoaded=true;const e=2e3;this.justLoadedTimeout=window.setTimeout((()=>{this.justLoaded=false}),e)}handleLoadingStarted(){this.justLoaded=false;window.clearTimeout(this.justLoadedTimeout)}renderLoadingIcons(){if(this.loadingFailed){return[t("line",{x1:"9",y1:"9",x2:"21",y2:"21"}),t("line",{x1:"21",y1:"9",x2:"9",y2:"21"})]}return[t("line",{x1:"8",y1:"14",x2:"15",y2:"20"}),t("line",{x1:"23",y1:"9",x2:"14",y2:"20"})]}renderIcon(e){const o=s(e);if(!o){return}const i=r(e);if(!this.label&&!i){const e="⚠️ Accessibility warning: `limel-button` has no `label` and its `icon` has no `title`. "+"This creates an inaccessible button for screen reader users. "+"Please add either a `label`, a `title` to the `icon`, or use a `limel-tooltip`. "+"See https://lundalogik.github.io/lime-elements/versions/latest/#/component/limel-button/ "+"for more information.";console.warn(e)}let a;if(typeof e==="object"){a=e.color}const n={role:"presentation",name:o,"aria-label":i,"aria-hidden":i?null:"true",style:{color:a}};return t("limel-icon",Object.assign({},n))}renderLabel(){if(!this.label){return}return t("span",{class:"label"},this.label)}renderSpinner(){if(!this.loading){return}return t("limel-spinner",{limeBranded:false})}static get delegatesFocus(){return true}get host(){return i(this)}static get watchers(){return{loading:["loadingWatcher"]}}};d.style=l;export{d as limel_button};
//# sourceMappingURL=p-c6aaf532.entry.js.map