element-plus/es/components/checkbox/src/checkbox-button.mjs.map

A Component Library for Vue 3

{"version":3,"file":"checkbox-button.mjs","sources":["../../../../../../packages/components/checkbox/src/checkbox-button.vue"],"sourcesContent":["<template>\n  <label\n    :class=\"[\n      ns.b('button'),\n      ns.bm('button', size),\n      ns.is('disabled', isDisabled),\n      ns.is('checked', isChecked),\n      ns.is('focus', focus),\n    ]\"\n    role=\"checkbox\"\n    :aria-checked=\"isChecked\"\n    :aria-disabled=\"isDisabled\"\n  >\n    <input\n      v-if=\"trueLabel || falseLabel\"\n      v-model=\"model\"\n      :class=\"ns.be('button', 'original')\"\n      type=\"checkbox\"\n      :name=\"name\"\n      :tabindex=\"tabindex\"\n      :disabled=\"isDisabled\"\n      :true-value=\"trueLabel\"\n      :false-value=\"falseLabel\"\n      @change=\"handleChange\"\n      @focus=\"focus = true\"\n      @blur=\"focus = false\"\n    />\n    <input\n      v-else\n      v-model=\"model\"\n      :class=\"ns.be('button', 'original')\"\n      type=\"checkbox\"\n      :name=\"name\"\n      :tabindex=\"tabindex\"\n      :disabled=\"isDisabled\"\n      :value=\"label\"\n      @change=\"handleChange\"\n      @focus=\"focus = true\"\n      @blur=\"focus = false\"\n    />\n\n    <span\n      v-if=\"$slots.default || label\"\n      :class=\"ns.be('button', 'inner')\"\n      :style=\"isChecked ? activeStyle : null\"\n    >\n      <slot>{{ label }}</slot>\n    </span>\n  </label>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useCheckbox, useCheckboxGroup, useCheckboxProps } from './useCheckbox'\n\nexport default defineComponent({\n  name: 'ElCheckboxButton',\n  props: useCheckboxProps,\n  emits: [UPDATE_MODEL_EVENT, 'change'],\n  setup(props) {\n    const { focus, isChecked, isDisabled, size, model, handleChange } =\n      useCheckbox(props)\n    const { checkboxGroup } = useCheckboxGroup()\n    const ns = useNamespace('checkbox')\n\n    const activeStyle = computed(() => {\n      const fillValue = checkboxGroup?.fill?.value ?? ''\n      return {\n        backgroundColor: fillValue,\n        borderColor: fillValue,\n        color: checkboxGroup?.textColor?.value ?? '',\n        boxShadow: fillValue ? `-1px 0 0 0 ${fillValue}` : null,\n      }\n    })\n\n    return {\n      focus,\n      isChecked,\n      isDisabled,\n      model,\n      handleChange,\n      activeStyle,\n      size,\n      ns,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;AAwDA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO,CAAC,oBAAoB;AAAA,EAC5B,MAAM,OAAO;AACX,UAAM,EAAE,OAAO,WAAW,YAAY,MAAM,OAAO,iBACjD,YAAY;AACd,UAAM,EAAE,kBAAkB;AAC1B,UAAM,KAAK,aAAa;AAExB,UAAM,cAAc,SAAS,MAAM;AACjC,YAAM,YAAY;AAClB;AAAO;AACY,QACjB;AAAa,QACb,sBAAsB;AAAoB,QAC1C;AAAmD;AAAA;AAIvD;AAAO;AACL,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;;SAlFI;AAAA;AAAc;AAAuB,MAAwB,QAAG;AAAe,MAAmB,QAAG,GAAE;AAAY,MAAkB,QAAG,GAAE;AAAU;;;AAQzJ,IACA,gBAAa;AAAE;;AAGR;;MAEL;AAAY,MACb,uBAAe;AAAA,MACd;AAAM,MACN;AAAU,MACV,UAAU;AAAA,MACV,eAAY;AAAA,MACZ,cAAW;AAAE,MACb;AAAM,MACN;AAAY,MACZ;AAAW;;AAVE;;;MAeb;AAAY,MACb,uBAAe;AAAA,MACd;AAAM,MACN;AAAU,MACV,UAAU;AAAA,MACV,UAAO;AAAA,MACP;AAAM,MACN;AAAY,MACZ;AAAW;;AATE;;;;AAcR,MACL;AAAmB;;AAEpB;AAAc;;;;;;;;;;"}