eslink-ui-plus/umd/checkbox/index.js

vue3 component library, css framework

(function(n,i){typeof exports=="object"&&typeof module!="undefined"?module.exports=i(require("vue")):typeof define=="function"&&define.amd?define(["vue"],i):(n=typeof globalThis!="undefined"?globalThis:n||self,n["es-checkbox"]=i(n.Vue))})(this,function(n){"use strict";var i=Object.defineProperty,h=Object.defineProperties,m=Object.getOwnPropertyDescriptors,b=Object.getOwnPropertySymbols,k=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable,f=(e,t,o)=>t in e?i(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,u=(e,t)=>{for(var o in t||(t={}))k.call(t,o)&&f(e,o,t[o]);if(b)for(var o of b(t))x.call(t,o)&&f(e,o,t[o]);return e},_=(e,t)=>h(e,m(t)),s=n.defineComponent({props:{modelValue:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},labelText:{type:String,default:""},indeterminate:Boolean},emits:["update:modelValue","change","select"],setup(e,t){const{emit:o}=t,a=n.reactive({checked:e.modelValue,indeterminate:e.indeterminate}),{modelValue:r,disabled:p}=n.toRefs(e),l=c=>{if(p.value)return;const d=!r.value;a.indeterminate?(a.checked=!0,a.indeterminate=!1):(a.checked=!a.checked,a.checked&&(a.indeterminate=!1)),o("select",{e:c,data:d}),o("update:modelValue",d)};return n.watch(r,(c,d)=>{c!==d&&(a.checked=c,o("change",c))}),n.watch(()=>a.indeterminate,()=>{a.indeterminate&&(a.checked=!1)}),_(u({},n.toRefs(a)),{toggleChecked:l})}});n.pushScopeId("data-v-ab10b2fe");const g=["checked"],v={class:"es-checkbox__name"};n.popScopeId();function y(e,t,o,a,r,p){return n.openBlock(),n.createElementBlock("label",{class:n.normalizeClass(["es-checkbox",{"is-disabled":e.disabled}]),onClick:t[0]||(t[0]=n.withModifiers((...l)=>e.toggleChecked&&e.toggleChecked(...l),["prevent"]))},[n.createElementVNode("span",{class:n.normalizeClass(["es-checkbox__label",{"is-checked":e.checked,"is-disabled":e.disabled,"is-indeterminate":e.indeterminate}])},null,2),n.createElementVNode("input",{class:"es-checkbox__value",type:"checkbox",checked:e.checked},null,8,g),n.createElementVNode("span",v,[n.renderSlot(e.$slots,"default",{},()=>[n.createTextVNode(n.toDisplayString(e.labelText),1)])])],2)}function w(e,t){t===void 0&&(t={});var o=t.insertAt;if(!(!e||typeof document=="undefined")){var a=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css",o==="top"&&a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}var C=`.es-checkbox[data-v-ab10b2fe] {
  height: 22px;
  line-height: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
      user-select: none;
  cursor: pointer;
  display: inline-block;
}
.es-checkbox.is-disabled[data-v-ab10b2fe] {
  cursor: not-allowed;
}
.es-checkbox:hover .es-checkbox__label[data-v-ab10b2fe] {
  border-color: #1b9dde;
}
.es-checkbox:hover .es-checkbox__label.is-disabled[data-v-ab10b2fe] {
  border-color: #e4e7ec;
}
.es-checkbox__label[data-v-ab10b2fe] {
  width: 16px;
  height: 16px;
  background: #ffffff;
  border: 1px solid #e4e7ec;
  box-sizing: border-box;
  border-radius: 2px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
}
.es-checkbox__label[data-v-ab10b2fe]::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 9px;
  left: 8px;
  top: 3px;
  background: #ffffff;
  border-radius: 1px;
  -webkit-transform-origin: center;
          transform-origin: center;
}
.es-checkbox__label[data-v-ab10b2fe]::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 4px;
  left: 4px;
  top: 7px;
  background: #ffffff;
  border-radius: 1px;
  -webkit-transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(0);
          transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(0);
  -webkit-transform-origin: center;
          transform-origin: center;
}
.es-checkbox__label.is-checked[data-v-ab10b2fe] {
  background: #148dd2;
  border: 0;
}
.es-checkbox__label.is-checked[data-v-ab10b2fe]::before {
  -webkit-transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1);
          transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1);
}
.es-checkbox__label.is-checked[data-v-ab10b2fe]::after {
  -webkit-transform: rotate(42deg) scaleY(1);
          transform: rotate(42deg) scaleY(1);
}
.es-checkbox__label.is-indeterminate[data-v-ab10b2fe] {
  background-color: #148dd2;
  border-color: #148dd2;
}
.es-checkbox__label.is-indeterminate[data-v-ab10b2fe]::before {
  content: "";
  position: absolute;
  display: block;
  background-color: #fff;
  width: 14px;
  height: 3px;
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  left: 0;
  right: 0;
  top: 5px;
}
.es-checkbox__label.is-indeterminate[data-v-ab10b2fe]::after {
  display: none;
}
.es-checkbox__label.is-disabled[data-v-ab10b2fe] {
  background: #f5f7fa;
  border: 1px solid #e4e7ec;
}
.es-checkbox__label.is-disabled ~ span.es-checkbox__name[data-v-ab10b2fe] {
  color: #a3a9b3;
}
.es-checkbox__label.is-checked.is-disabled[data-v-ab10b2fe]::before {
  background: #a3a9b3;
  -webkit-transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1);
          transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1);
}
.es-checkbox__label.is-checked.is-disabled[data-v-ab10b2fe]::after {
  background: #a3a9b3;
  -webkit-transform: rotate(42deg) scaleY(1);
          transform: rotate(42deg) scaleY(1);
}
.es-checkbox__value[data-v-ab10b2fe] {
  opacity: 0;
  outline: none;
  position: absolute;
  margin: 0;
  width: 0;
  height: 0;
  z-index: -1;
}
.es-checkbox__name[data-v-ab10b2fe] {
  height: 22px;
  color: #515c70;
  font-family: PingFangSC;
  font-size: 14px;
  line-height: 22px;
  margin-left: 8px;
  vertical-align: middle;
}`;return w(C),s.render=y,s.__scopeId="data-v-ab10b2fe",s.__file="components/checkbox/index.vue",s.install=e=>{e.component("es-checkbox",s)},s});