tdesign-vue-next/es/color-picker/components/format/inputs.mjs.map

TDesign Component for vue-next

{"version":3,"file":"inputs.mjs","sources":["../../../../../components/color-picker/components/format/inputs.tsx"],"sourcesContent":["import { computed, defineComponent, PropType, reactive, watch } from 'vue';\nimport { throttle } from 'lodash-es';\nimport props from '../../props';\nimport { Color } from '../../utils';\nimport TInput from '../../../input';\nimport TInputNumber from '../../../input-number';\nimport { FORMAT_INPUT_CONFIG } from './config';\n\nexport default defineComponent({\n  name: 'FormatInputs',\n  inheritAttrs: false,\n  props: {\n    ...props,\n    color: {\n      type: Object as PropType<Color>,\n    },\n    onInputChange: {\n      type: Function,\n      default: () => {\n        return () => {};\n      },\n    },\n  },\n  setup(props) {\n    const inputConfigs = computed(() => {\n      const configs = [...FORMAT_INPUT_CONFIG[props.format]];\n      if (props.enableAlpha) {\n        configs.push({\n          type: 'inputNumber',\n          key: 'a',\n          min: 0,\n          max: 100,\n          format: (value: number) => `${value}%`,\n          flex: 1.15,\n        });\n      }\n      return configs;\n    });\n\n    const modelValue = reactive<any>({});\n    const lastModelValue = reactive<any>({});\n\n    /**\n     * 获取不同格式的输入输出值\n     * @param type 'encode' | 'decode'\n     * @returns\n     */\n    const getFormatColorMap = (type: 'encode' | 'decode') => {\n      const { color } = props;\n      if (type === 'encode') {\n        return {\n          HSV: color.getHsva(),\n          HSL: color.getHsla(),\n          RGB: color.getRgba(),\n          CMYK: color.getCmyk(),\n          CSS: {\n            css: color.css,\n          },\n          HEX: {\n            hex: color.hex,\n          },\n        };\n      }\n      // decode\n      return {\n        HSV: Color.object2color(modelValue, 'HSV'),\n        HSL: Color.object2color(modelValue, 'HSL'),\n        RGB: Color.object2color(modelValue, 'RGB'),\n        CMYK: Color.object2color(modelValue, 'CMYK'),\n        CSS: modelValue.css,\n        HEX: modelValue.hex,\n      };\n    };\n\n    // 更新modelValue\n    const updateModelValue = () => {\n      const { format, color } = props;\n      // @ts-ignore\n      // TODO: 从类型上看，values 可能为空，那么下面就会报错，需要同步类型处理 1.getFormatColorMap 2. format 前置过滤\n      const values = getFormatColorMap('encode')[format];\n      values.a = Math.round(color.alpha * 100);\n      Object.keys(values).forEach((key) => {\n        modelValue[key] = values[key];\n        lastModelValue[key] = values[key];\n      });\n    };\n\n    updateModelValue();\n\n    const throttleUpdate = throttle(updateModelValue, 100);\n\n    watch(() => {\n      const { saturation, hue, value, alpha, css } = props.color;\n      return [saturation, hue, value, alpha, css, props.format];\n    }, throttleUpdate);\n\n    const handleChange = (key: string, v: number | string) => {\n      if (v === lastModelValue[key]) {\n        return;\n      }\n      // @ts-ignore\n      // TODO: 如上\n      const value = getFormatColorMap('decode')[props.format];\n      props.onInputChange(value, modelValue.a / 100, key, v);\n    };\n\n    return () => {\n      const inputProps = {\n        ...((props.inputProps as any) || {}),\n      };\n      return (\n        <div class=\"input-group\">\n          {inputConfigs.value.map((config) => {\n            return (\n              <div\n                class=\"input-group__item\"\n                key={config.key}\n                style={{\n                  flex: config.flex || 1,\n                }}\n              >\n                {config.type === 'input' ? (\n                  <TInput\n                    {...inputProps}\n                    align=\"center\"\n                    size=\"small\"\n                    disabled={props.disabled}\n                    v-model={modelValue[config.key]}\n                    maxlength={props.format === 'HEX' ? 9 : undefined}\n                    title={modelValue[config.key]}\n                    onBlur={(v: string) => handleChange(config.key, v)}\n                    onEnter={(v: string) => handleChange(config.key, v)}\n                  />\n                ) : (\n                  <TInputNumber\n                    {...inputProps}\n                    align=\"center\"\n                    size=\"small\"\n                    disabled={props.disabled}\n                    v-model={modelValue[config.key]}\n                    title={modelValue[config.key]}\n                    min={config.min}\n                    max={config.max}\n                    step={1}\n                    format={config.format}\n                    theme=\"normal\"\n                    onBlur={(v: number) => handleChange(config.key, v)}\n                    onEnter={(v: number) => handleChange(config.key, v)}\n                  />\n                )}\n              </div>\n            );\n          })}\n        </div>\n      );\n    };\n  },\n});\n"],"names":["defineComponent","name","inheritAttrs","props","_objectSpread","color","type","Object","onInputChange","Function","default","setup","inputConfigs","computed","configs","_toConsumableArray","FORMAT_INPUT_CONFIG","format","enableAlpha","push","key","min","max","value","concat","flex","modelValue","reactive","lastModelValue","getFormatColorMap","HSV","getHsva","HSL","getHsla","RGB","getRgba","CMYK","getCmyk","CSS","css","HEX","hex","Color","object2color","updateModelValue","values","a","Math","round","alpha","keys","forEach","throttleUpdate","throttle","watch","_props2$color","saturation","hue","handleChange","v","inputProps","_createVNode","map","config","TInput","_mergeProps","disabled","onUpdateModelValue","$event","onBlur","onEnter"],"mappings":"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"}