@duetds/components
Version:
This package includes Duet Components and related tools.
1 lines • 4.72 kB
JavaScript
import{r as e,h as t,g as s}from"./p-e7cbb506.js";import{i,r as a}from"./p-7601659c.js";import{c}from"./p-ea56b96b.js";import{c as l}from"./p-ec399bf6.js";class r{constructor(t){e(this,t),this.required=!1,this.theme="",this.disabled=!1,this.label="label",this.checked=!1}componentWillLoad(){i(),"default"!==this.theme&&document.documentElement.classList.contains("duet-theme-turva")&&(this.theme="turva")}componentDidUnload(){a()}render(){const e=c("duet-checkbox-container",{"duet-theme-turva":"turva"===this.theme}),s=c("duet-checkbox",{disabled:this.disabled}),i=this.identifier||l("DuetCheckbox");return t("div",{class:e},t("input",{type:"checkbox",value:this.value,class:s,checked:this.checked,disabled:this.disabled,"aria-controls":this.accessibleControls,"aria-active-descendant":this.accessibleActiveDescendant,"aria-owns":this.accessibleOwns,required:this.required,role:this.role,name:this.name,id:i}),t("label",{class:"duet-label",htmlFor:i},t("span",null,this.label)),t("span",{class:"duet-textarea-help"},this.helpText))}get element(){return s(this)}static get style(){return":host{background:transparent;margin:0;margin-right:8px;margin-bottom:12px;display:-ms-inline-flexbox;display:inline-flex;vertical-align:bottom;max-width:100%}.duet-label,:host{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;border:0;padding:0}.duet-label{background:transparent;margin:0;margin-bottom:8px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:localtapiola-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:1rem;background:#fff;color:#00294d;font-weight:400;line-height:1.25;-webkit-transition:.3s ease;transition:.3s ease;z-index:100;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;cursor:pointer;display:inline;vertical-align:top}.duet-theme-turva .duet-label{color:#111;font-family:turva-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}.duet-label span{display:inline-block;vertical-align:top;width:calc(100% - 32px)}.duet-label-hidden .duet-label{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.duet-checkbox{padding:0;padding:13.5px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:absolute;opacity:0;z-index:2;left:0;top:0;cursor:pointer}.duet-checkbox,.duet-checkbox-container{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;margin:0;width:100%;height:100%}.duet-checkbox-container{padding:0;position:relative}.duet-checkbox+label:before{content:\"\";display:inline-block;vertical-align:top;z-index:100;width:18px;height:18px;border-radius:4px;background:#fff;margin:0 10px 1px 1px;border:1px solid #00294d}.duet-theme-turva .duet-checkbox+label:before{border-color:#111}.duet-checkbox:checked+label:before{background:#00294d;border:1px solid #00294d}.duet-theme-turva .duet-checkbox:checked+label:before{background:#111;border-color:#111}:host-context(.user-is-tabbing) .duet-checkbox:focus+label:before{outline:1px dotted #0077b3;outline:5px auto -webkit-focus-ring-color}.duet-checkbox:checked+label:after{content:\"\";position:absolute;left:5px;top:4px;z-index:200;background:transparent url(\"data:image/svg+xml;utf8,<svg fill=\'white\' xmlns=\'http://www.w3.org/2000/svg\' width=\'24\' height=\'24\' viewBox=\'0 0 24 24\'><path d=\'M23.374.287a1.5,1.5,0,0,0-2.093.345L7.246,20.2,2.561,15.511A1.5,1.5,0,1,0,.439,17.632l5.935,5.934a1.525,1.525,0,0,0,2.279-.186l15.066-21A1.5,1.5,0,0,0,23.374.287Z\' /></svg>\") no-repeat 0 0;background-size:100% auto;width:12px;height:12px}.duet-theme-turva .duet-checkbox:checked+label:after{top:3px}.duet-checkbox.disabled+label,.duet-checkbox[disabled]+label{cursor:not-allowed;color:#657787}.duet-theme-turva .duet-checkbox.disabled+label,.duet-theme-turva .duet-checkbox[disabled]+label{color:#757575}.duet-checkbox.disabled+label:before,.duet-checkbox[disabled]+label:before{border-color:#cfd2d4}.duet-theme-turva .duet-checkbox.disabled+label:before,.duet-theme-turva .duet-checkbox[disabled]+label:before{border-color:#d1d1d1}.duet-checkbox.disabled:checked+label:before,.duet-checkbox[disabled]:checked+label:before{background:#657787;border:1px solid #657787}.duet-theme-turva .duet-checkbox.disabled:checked+label:before,.duet-theme-turva .duet-checkbox[disabled]:checked+label:before{border-color:#757575;background:#757575}"}}export{r as duet_checkbox};