@trimble-oss/moduswebcomponents
Version:
Modus Web Components is a modern, accessible UI library built with Stencil JS that provides reusable web components following Trimble's Modus design system. This updated version focuses on improved flexibility, enhanced theming options, comprehensive cust
1 lines • 27 kB
JavaScript
import{r as o,c,h as s,H as d,g as t}from"./p-D_4hbGjA.js";import{K as r,i as u}from"./p-BLBSdonk.js";const m=class{constructor(s){o(this,s),this.buttonClick=c(this,"buttonClick"),this.inheritedAttributes={},this.color="primary",this.customClass="",this.disabled=!1,this.fullWidth=!1,this.pressed=!1,this.shape="rectangle",this.size="md",this.type="button",this.variant="filled",this.handleClick=o=>{this.disabled||this.buttonClick.emit(o)},this.handleKeyDown=o=>{this.disabled||o.key!==r.Enter&&o.key!==r.Space||(o.preventDefault(),this.buttonClick.emit(o))}}componentWillLoad(){this.inheritedAttributes=u(this.el)}getClasses(){const o=["modus-wc-btn"],c=(({color:o,disabled:c,fullWidth:s,pressed:d,shape:t,size:r,variant:u})=>{let m="";if(o)switch(o){case"primary":m=`${m} modus-wc-btn-primary`;break;case"secondary":m=`${m} modus-wc-btn-secondary`;break;case"tertiary":m=`${m} modus-wc-btn-neutral`;break;case"warning":m=`${m} modus-wc-btn-warning`;break;case"danger":m=`${m} modus-wc-btn-error`}if(c&&(m=`${m} modus-wc-btn-disabled`),s&&(m=`${m} modus-wc-btn-block`),d&&(m=`${m} modus-wc-btn-active`),t)switch(t){case"circle":m=`${m} modus-wc-btn-circle`;break;case"ellipse":m=`${m} modus-wc-btn-ellipse`;break;case"square":m=`${m} modus-wc-btn-square`}if(r&&(m=`${m} modus-wc-btn-${r}`),u)switch(u){case"borderless":m=`${m} modus-wc-btn-borderless`;break;case"filled":m=`${m} modus-wc-btn-filled`;break;case"outlined":m=`${m} modus-wc-btn-outline`}return m.trim()})({color:this.color,disabled:this.disabled,fullWidth:this.fullWidth,pressed:this.pressed,shape:this.shape,size:this.size,variant:this.variant});return c&&o.push(c),this.customClass&&o.push(this.customClass),o.join(" ")}render(){const o=this.pressed?"true":void 0;return s(d,{key:"e52093307a31052c590b31df97e47f3002426368"},s("button",Object.assign({key:"ac98aafb5b30ba4bb8bef613f09bb0e9539268a5",class:this.getClasses(),"aria-pressed":o,disabled:this.disabled,onClick:this.handleClick,onKeyDown:this.handleKeyDown,tabIndex:this.disabled?-1:0,type:this.type},this.inheritedAttributes),s("slot",{key:"5bcf393c59add0cdfc88478bc2e5918d6817bd70"})))}get el(){return t(this)}};m.style="modus-wc-button .modus-wc-btn-xs{height:var(--modus-wc-size-xs);min-height:var(--modus-wc-size-xs)}modus-wc-button .modus-wc-btn-sm{height:var(--modus-wc-size-sm);min-height:var(--modus-wc-size-sm)}modus-wc-button .modus-wc-btn-md{height:var(--modus-wc-size-md);min-height:var(--modus-wc-size-md)}modus-wc-button .modus-wc-btn-lg{height:var(--modus-wc-size-lg);min-height:var(--modus-wc-size-lg)}modus-wc-button .modus-wc-btn-xl{height:var(--modus-wc-size-xl);min-height:var(--modus-wc-size-xl)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-primary[aria-pressed=true]{background-color:var(--modus-wc-color-primary);border:1px solid transparent;color:var(--modus-wc-color-primary-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-primary:hover{background-color:var(--modus-wc-color-primary-pale);color:var(--modus-wc-color-primary)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-secondary[aria-pressed=true]{background-color:var(--modus-wc-color-secondary);border:1px solid transparent;color:var(--modus-wc-color-secondary-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-secondary:hover{background-color:var(--modus-wc-color-secondary-pale);color:var(--modus-wc-color-secondary)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-accent[aria-pressed=true]{background-color:var(--modus-wc-color-accent);border:1px solid transparent;color:var(--modus-wc-color-accent-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-accent:hover{background-color:var(--modus-wc-color-accent-pale);color:var(--modus-wc-color-accent)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-neutral[aria-pressed=true]{background-color:var(--modus-wc-color-neutral);border:1px solid transparent;color:var(--modus-wc-color-base-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-neutral:hover{background-color:var(--modus-wc-color-neutral-pale);color:var(--modus-wc-color-base-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-warning[aria-pressed=true]{background-color:var(--modus-wc-color-warning);border:1px solid transparent;color:var(--modus-wc-color-warning-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-warning:hover{background-color:var(--modus-wc-color-warning-pale);color:var(--modus-wc-color-warning)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-error[aria-pressed=true]{background-color:var(--modus-wc-color-error);border:1px solid transparent;color:var(--modus-wc-color-error-content)}modus-wc-button .modus-wc-btn-outline.modus-wc-btn-error:hover{background-color:var(--modus-wc-color-error-pale);color:var(--modus-wc-color-error)}modus-wc-button .modus-wc-btn-borderless{background-color:transparent;border:none;box-shadow:none}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-primary[aria-pressed=true]{background-color:var(--modus-wc-color-primary);border:1px solid transparent;color:var(--modus-wc-color-primary-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-primary:hover{background-color:var(--modus-wc-color-primary-pale);color:var(--modus-wc-color-primary)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-secondary[aria-pressed=true]{background-color:var(--modus-wc-color-secondary);border:1px solid transparent;color:var(--modus-wc-color-secondary-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-secondary:hover{background-color:var(--modus-wc-color-secondary-pale);color:var(--modus-wc-color-secondary)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-accent[aria-pressed=true]{background-color:var(--modus-wc-color-accent);border:1px solid transparent;color:var(--modus-wc-color-accent-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-accent:hover{background-color:var(--modus-wc-color-accent-pale);color:var(--modus-wc-color-accent)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-neutral[aria-pressed=true]{background-color:var(--modus-wc-color-neutral);border:1px solid transparent;color:var(--modus-wc-color-base-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-neutral:hover{background-color:var(--modus-wc-color-neutral-pale);color:var(--modus-wc-color-base-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-warning[aria-pressed=true]{background-color:var(--modus-wc-color-warning);border:1px solid transparent;color:var(--modus-wc-color-warning-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-warning:hover{background-color:var(--modus-wc-color-warning-pale);color:var(--modus-wc-color-warning)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-error[aria-pressed=true]{background-color:var(--modus-wc-color-error);border:1px solid transparent;color:var(--modus-wc-color-error-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-error:hover{background-color:var(--modus-wc-color-error-pale);color:var(--modus-wc-color-error)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-primary{color:var(--modus-wc-color-primary)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-secondary{color:var(--modus-wc-color-secondary)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-neutral{color:var(--modus-wc-color-content)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-warning{color:var(--modus-wc-color-warning)}modus-wc-button .modus-wc-btn-borderless.modus-wc-btn-error{color:var(--modus-wc-color-error)}modus-wc-button .modus-wc-btn.modus-wc-btn-ellipse{border-radius:var(--modus-wc-border-radius-rounded)}modus-wc-button .modus-wc-btn-circle.modus-wc-btn-md,modus-wc-button .modus-wc-btn-square.modus-wc-btn-md{width:var(--modus-wc-size-md)}modus-wc-button .modus-wc-btn-circle.modus-wc-btn-lg,modus-wc-button .modus-wc-btn-square.modus-wc-btn-lg{width:var(--modus-wc-size-lg)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn{--rounded-btn:var(--modus-wc-border-radius-md);border:none;outline:none}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn:not(.modus-wc-btn-circle):not(.modus-wc-btn-square),[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn:not(.modus-wc-btn-circle):not(.modus-wc-btn-square){height:fit-content;min-height:fit-content}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-xs,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-xs{font-size:var(--modus-wc-font-size-xs)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-xs:not(.modus-wc-btn-circle):not(.modus-wc-btn-square),[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-xs:not(.modus-wc-btn-circle):not(.modus-wc-btn-square){padding:var(--modus-wc-spacing-2xs) var(--modus-wc-spacing-sm)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-sm,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-sm{font-size:var(--modus-wc-font-size-sm)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-sm:not(.modus-wc-btn-circle):not(.modus-wc-btn-square),[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-sm:not(.modus-wc-btn-circle):not(.modus-wc-btn-square){padding:var(--modus-wc-spacing-xs) var(--modus-wc-spacing-md)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-md,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-md{font-size:var(--modus-wc-font-size-md)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-md:not(.modus-wc-btn-circle):not(.modus-wc-btn-square),[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-md:not(.modus-wc-btn-circle):not(.modus-wc-btn-square){padding:var(--modus-wc-spacing-sm) var(--modus-wc-spacing-lg)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-lg,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-lg{font-size:var(--modus-wc-font-size-lg)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-lg:not(.modus-wc-btn-circle):not(.modus-wc-btn-square),[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-lg:not(.modus-wc-btn-circle):not(.modus-wc-btn-square){padding:var(--modus-wc-spacing-md) var(--modus-wc-spacing-xl)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless{background-color:transparent;box-shadow:none}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless:active,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless:active{background-color:transparent}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless:hover,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless:hover{background-color:transparent}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline{background-color:transparent;border:var(--modus-wc-border-width-xs) solid var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline:active,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline:active{background-color:transparent}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline:hover,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline:hover{background-color:transparent}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary:focus-visible,[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary:focus-visible{box-shadow:0 0 0 0.25rem rgba(38, 122, 177, 0.5)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary:focus-visible,[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary:focus-visible{box-shadow:0 0 0 0.25rem rgba(98, 102, 108, 0.5)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral:focus-visible,[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral:focus-visible{box-shadow:0 0 0 0.25rem rgba(98, 102, 108, 0.5)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning:focus-visible,[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning:focus-visible{box-shadow:0 0 0 0.25rem rgba(194, 125, 31, 0.5)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error:focus-visible,[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error:focus-visible,[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error:focus-visible{box-shadow:0 0 0 0.25rem rgba(224, 66, 76, 0.5)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-disabled{opacity:0.3}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless:focus-visible{border:var(--modus-wc-border-width-sm) solid var(--modus-wc-color-black)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{color:var(--modus-wc-color-trimble-blue)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-secondary{color:var(--modus-wc-color-gray-6)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-neutral{color:var(--modus-wc-color-gray-6)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-warning{color:var(--modus-wc-color-yellow)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-error{color:var(--modus-wc-color-red)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary{background-color:var(--modus-wc-color-trimble-blue);color:var(--modus-wc-color-white)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary:hover{background-color:var(--modus-wc-color-blue-light)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary:active{background-color:var(--modus-wc-color-blue-dark)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary{background-color:var(--modus-wc-color-gray-6);color:var(--modus-wc-color-white)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary:hover{background-color:var(--modus-wc-color-gray-5)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary:active{background-color:var(--modus-wc-color-gray-7)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral{background-color:var(--modus-wc-color-gray-1);color:var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral:hover{background-color:var(--modus-wc-color-gray-0)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral:active{background-color:var(--modus-wc-color-gray-2)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning{background-color:var(--modus-wc-color-yellow);border:var(--modus-wc-border-width-xs) solid var(--modus-wc-color-red);color:var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning:hover{background-color:var(--modus-wc-color-yellow-light)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning:active{background-color:var(--modus-wc-color-yellow-dark)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error{background-color:var(--modus-wc-color-red);color:var(--modus-wc-color-white)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error:hover{background-color:var(--modus-wc-color-red-light)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error:active{background-color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary{border-color:var(--modus-wc-color-trimble-blue);color:var(--modus-wc-color-trimble-blue)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary:hover{background-color:var(--modus-wc-color-blue-pale);border-color:var(--modus-wc-color-blue-light);color:var(--modus-wc-color-blue-light)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary:active{background-color:rgba(0, 99, 163, 0.18);border-color:var(--modus-wc-color-blue-dark);color:var(--modus-wc-color-blue-dark)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary{border-color:var(--modus-wc-color-trimble-gray);color:var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary:hover{background-color:var(--modus-wc-color-gray-0)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary:active{background-color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral{border-color:var(--modus-wc-color-trimble-gray);color:var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral:hover{background-color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral:active{background-color:var(--modus-wc-color-gray-2)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning{border-color:var(--modus-wc-color-yellow);color:var(--modus-wc-color-yellow)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning:hover{border-color:var(--modus-wc-color-yellow-light);color:var(--modus-wc-color-yellow-light)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning:active{border-color:var(--modus-wc-color-yellow-dark);color:var(--modus-wc-color-yellow-dark)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error{border-color:var(--modus-wc-color-red);color:var(--modus-wc-color-red)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error:hover{border-color:var(--modus-wc-color-red-light);color:var(--modus-wc-color-red-light)}[data-theme=modus-classic-light] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error:active{border-color:var(--modus-wc-color-red-dark);color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-disabled{opacity:0.4}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless:focus-visible{border:var(--modus-wc-border-width-sm) solid var(--modus-wc-color-white)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-primary{color:var(--modus-wc-color-highlight-blue)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-secondary{color:var(--modus-wc-color-gray-6)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-neutral{color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-warning{color:var(--modus-wc-color-yellow)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-borderless.modus-wc-btn-error{color:var(--modus-wc-color-red)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary{background-color:var(--modus-wc-color-highlight-blue);color:var(--modus-wc-color-gray-10)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary:hover{background-color:var(--modus-wc-color-blue-light)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-primary:active{background-color:var(--modus-wc-color-blue-dark)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary{background-color:var(--modus-wc-color-gray-6);color:var(--modus-wc-color-white)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary:hover{background-color:var(--modus-wc-color-gray-5)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-secondary:active{background-color:var(--modus-wc-color-gray-7)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral{background-color:var(--modus-wc-color-gray-1);color:var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral:hover{background-color:var(--modus-wc-color-gray-0)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-neutral:active{background-color:var(--modus-wc-color-gray-4)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning{background-color:var(--modus-wc-color-yellow);border:var(--modus-wc-border-width-xs) solid var(--modus-wc-color-red);color:var(--modus-wc-color-trimble-gray)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning:hover{background-color:var(--modus-wc-color-yellow-light)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-warning:active{background-color:var(--modus-wc-color-yellow-dark)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error{background-color:var(--modus-wc-color-red);color:var(--modus-wc-color-white)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error:hover{background-color:var(--modus-wc-color-red-light)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-filled.modus-wc-btn-error:active{background-color:var(--modus-wc-color-red-dark)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary{border-color:var(--modus-wc-color-highlight-blue);color:var(--modus-wc-color-highlight-blue)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary:hover{background-color:rgba(1, 154, 235, 0.12)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-primary:active{background-color:rgba(1, 154, 235, 0.3)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary{border-color:var(--modus-wc-color-gray-1);color:var(--modus-wc-color-gray-1)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary:hover{background-color:rgba(203, 205, 214, 0.12)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-secondary:active{background-color:rgba(203, 205, 214, 0.3)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral{border-color:var(--modus-wc-color-gray-2);color:var(--modus-wc-color-gray-2)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral:hover{background-color:rgba(203, 205, 214, 0.12)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-neutral:active{background-color:rgba(203, 205, 214, 0.3)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning{border-color:var(--modus-wc-color-yellow);color:var(--modus-wc-color-yellow)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning:hover{border-color:var(--modus-wc-color-yellow-light);color:var(--modus-wc-color-yellow-light)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-warning:active{border-color:var(--modus-wc-color-yellow-dark);color:var(--modus-wc-color-yellow-dark)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error{border-color:var(--modus-wc-color-red);color:var(--modus-wc-color-red)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error:hover{border-color:var(--modus-wc-color-red-light);color:var(--modus-wc-color-red-light)}[data-theme=modus-classic-dark] modus-wc-button .modus-wc-btn.modus-wc-btn-outline.modus-wc-btn-error:active{border-color:var(--modus-wc-color-red-dark);color:var(--modus-wc-color-red-dark)}";export{m as modus_wc_button}