ivue-material-plus/dist/unplugin-vue-components/es/components/ivue-radio-group/index2.mjs.map

A high quality UI components Library with Vue.js

{"version":3,"file":"index2.mjs","sources":["../../../../../src/components/ivue-radio-group/index.vue"],"sourcesContent":["<template>\r\n  <div :class=\"wrapperClasses\" :id=\"inputId\">\r\n    <slot></slot>\r\n  </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { computed, defineComponent, watch, provide, PropType, ref } from 'vue';\r\n\r\nimport { oneOf } from '../../utils/assist';\r\nimport { debugWarn } from '../../utils/error';\r\nimport { useFormItem, useFormItemInputId } from '../../hooks';\r\n\r\n// type\r\nimport { Props, Size, RadioContextKey } from './types/radio-group';\r\n\r\nconst prefixCls = 'ivue-radio-group';\r\n\r\nlet seed = 0;\r\nconst now = Date.now();\r\nconst getUuid = () => `${prefixCls}_${now}_${seed++}`;\r\n\r\nexport default defineComponent({\r\n  name: prefixCls,\r\n  emits: ['update:modelValue', 'on-change'],\r\n  props: {\r\n    /**\r\n     * 指定当前选中的项目数据。可以使用 v-model 双向绑定数据\r\n     *\r\n     * @type {String | Number}\r\n     */\r\n    modelValue: {\r\n      type: [String, Number],\r\n      default: '',\r\n    },\r\n    /**\r\n     * name 属性\r\n     *\r\n     * @type {String}\r\n     */\r\n    name: {\r\n      type: String,\r\n      default: getUuid,\r\n    },\r\n    /**\r\n     * 垂直排列\r\n     *\r\n     * @type {Boolean}\r\n     */\r\n    vertical: {\r\n      type: Boolean,\r\n      default: false,\r\n    },\r\n    /**\r\n     * 可选值为 button 或不填，为 button 时使用按钮样式\r\n     *\r\n     * @type {String}\r\n     */\r\n    type: {\r\n      type: String,\r\n      validator(value: string) {\r\n        return oneOf(value, ['button']);\r\n      },\r\n    },\r\n    /**\r\n     * 按钮样式，可选值为 default 和 solid\r\n     *\r\n     * @type {String}\r\n     */\r\n    buttonStyle: {\r\n      type: String,\r\n      validator(value: string) {\r\n        return oneOf(value, ['default', 'solid']);\r\n      },\r\n      default: 'default',\r\n    },\r\n    /**\r\n     * 单选框的尺寸，可选值为 large、small、default 或者不设置\r\n     *\r\n     * @type {String}\r\n     */\r\n    size: {\r\n      type: String as PropType<Size>,\r\n      validator(value: string) {\r\n        return oneOf(value, ['large', 'small', 'default']);\r\n      },\r\n      default() {\r\n        return 'default';\r\n      },\r\n    },\r\n    /**\r\n     * 输入时是否触发表单的校验\r\n     *\r\n     * @type {Boolean}\r\n     */\r\n    validateEvent: {\r\n      type: Boolean,\r\n      default: true,\r\n    },\r\n  },\r\n  setup(props: Props, { emit }) {\r\n    // 设置表单对应的输入框id\r\n    const { formItem } = useFormItem();\r\n\r\n    // 输入框id\r\n    const { inputId } = useFormItemInputId(props, {\r\n      formItemContext: formItem,\r\n    });\r\n\r\n    // 当前值\r\n    const currentValue = ref<string | number>(props.modelValue);\r\n\r\n    // 外部样式\r\n    const wrapperClasses = computed(() => {\r\n      return [\r\n        `${prefixCls}`,\r\n        {\r\n          // 单选框的尺寸\r\n          [`${prefixCls}--${props.size}`]: !!props.size,\r\n          // 单选框的尺寸\r\n          [`${prefixCls}--${props.size}`]: !!props.size,\r\n          // 垂直排列\r\n          [`${prefixCls}--vertical`]: props.vertical,\r\n          // 按钮\r\n          [`${prefixCls}--${props.type}`]: !!props.type,\r\n          // 按钮样式\r\n          [`${prefixCls}--button--${props.buttonStyle}`]:\r\n            props.type === 'button' && props.buttonStyle !== 'default',\r\n        },\r\n      ];\r\n    });\r\n\r\n    // methods\r\n\r\n    // 改变值\r\n    const handleChange = (value: string | number) => {\r\n      currentValue.value = value;\r\n\r\n      emit('update:modelValue', value);\r\n      emit('on-change', value);\r\n    };\r\n\r\n    // watch\r\n\r\n    // 监听 v-model\r\n    watch(\r\n      () => props.modelValue,\r\n      () => {\r\n        // 当F前值是否不相等\r\n        if (currentValue.value !== props.modelValue) {\r\n          currentValue.value = props.modelValue;\r\n        }\r\n\r\n        // 输入时是否触发表单的校验\r\n        if (props.validateEvent) {\r\n          formItem?.validate('change').catch((err) => debugWarn(err));\r\n        }\r\n      }\r\n    );\r\n\r\n    // provide\r\n\r\n    provide(RadioContextKey, {\r\n      name: props.name,\r\n      currentValue: currentValue,\r\n      change: handleChange,\r\n    });\r\n\r\n    return {\r\n      prefixCls,\r\n\r\n      // data\r\n      currentValue,\r\n      inputId,\r\n\r\n      // computed\r\n      wrapperClasses,\r\n\r\n      // methods\r\n      handleChange,\r\n    };\r\n  },\r\n});\r\n</script>\r\n"],"names":["_openBlock","_createElementBlock","_normalizeClass"],"mappings":";;;;;AACa,SAAA,YAAA,IAAE,EAAA,MAAA,EAAc,MAAA,EAAA,MAAA,EAAA,OAAA,QAAA,EAAA;EAAO,OAAAA,SAAA,EAAO,EAAAC,kBAAA,CAAA,KAAA,EAAA;AAAA,IAAA,KAAA,EAAAC,cAAA,CAAA,IAAA,CAAA,cAAA,CAAA;AAAA,IACvC,IAAA,IAAA,CAAA,OAAA;AAAA,GAAA,EAAA;AAAA;;;;;;;"}