song-ui-u
Version:
vue3 + js的PC前端组件库
1 lines • 3 kB
Source Map (JSON)
{"version":3,"file":"checkbox.vue.cjs","sources":["../../../../../packages/components/checkbox/src/checkbox.vue"],"sourcesContent":["<template>\n <component\n :is=\"tag\"\n :class=\"[\n ns.b(),\n ns.m(type),\n ns.is('checked', isChecked || indeterminate),\n ns.is('loading', isLoading),\n ns.is('disabled', isDisabled || isLoading),\n ns.m('size', checkboxSize),\n ]\"\n @click=\"clickEvent\"\n >\n <span :class=\"[ns.e('wrapper')]\">\n <input\n :class=\"[ns.e('input')]\"\n type=\"checkbox\"\n v-model=\"model\"\n :value=\"value\"\n :name=\"value\"\n @change=\"changeEvent\"\n @click.stop\n />\n <span :class=\"[ns.e('inner'), ns.is('indeterminate', indeterminate)]\">\n <template v-if=\"indeterminate\">\n <i :class=\"[ns.e('indeterminate', indeterminate)]\"></i>\n </template>\n <x-icon v-else>\n <Loader\n v-if=\"isLoading\"\n :class=\"[`${ns.is('loading-transition', isLoading)}`]\"\n />\n <CheckBlod v-else />\n </x-icon>\n </span>\n </span>\n <span :class=\"[ns.e('label')]\"><slot /></span>\n </component>\n</template>\n<script>\nexport default { name: \"x-checkbox\" };\n</script>\n<script setup>\nimport { computed } from \"vue\";\nimport { XIcon } from \"@ui-library/components\";\nimport { useCheckbox } from \"./composables\";\nimport { useNamespace, useParent } from \"@ui-library/hook\";\nimport { CheckBlod, Loader } from \"song-ui-pro-icon\";\nconst ns = useNamespace(\"checkbox\");\nconst checkboxModel = defineModel();\nconst emit = defineEmits([\"change\"]);\n/** props */\nconst props = defineProps({\n value: {\n type: [String, Boolean, Number, Object],\n default: undefined,\n },\n tag: {\n type: String,\n default: \"label\",\n },\n type: {\n type: String,\n default: \"default\",\n },\n value: {\n type: [String, Number, Boolean],\n default: undefined,\n },\n size: {\n type: String,\n default: \"default\",\n },\n checked: Boolean,\n disabled: Boolean,\n all: Boolean,\n indeterminate: Boolean,\n beforeChange: Function,\n});\n\nconst {\n checkboxSize,\n isDisabled,\n model,\n isChecked,\n isLoading,\n changeEvent,\n clickEvent,\n} = useCheckbox({ props, checkboxModel });\n</script>\n"],"names":["useNamespace","_useModel","useCheckbox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAe,WAAA,GAAA,EAAE,IAAI,EAAE,YAAY,EAAE,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQrC,MAAM,EAAE,GAAGA,oBAAY,CAAC,UAAU,CAAC,CAAA;AACnC,MAAM,aAAa,GAAGC,YAAW,CAAA,OAAA,EAAA,YAAC,CAAC,CAAA;AACnC,MAAM,IAAI,GAAG,MAAuB,CAAA;AACpC;AACA,MAAM,KAAK,GAAG,OA0BZ,CAAA;;AAEF,MAAM;AACN,EAAE,YAAY;AACd,EAAE,UAAU;AACZ,EAAE,KAAK;AACP,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,WAAW;AACb,EAAE,UAAU;AACZ,CAAC,GAAGC,uBAAW,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}