xdesign-vue-next/es/slider/hooks/useSliderMark.mjs.map

XDesign Component for vue-next

{"version":3,"file":"useSliderMark.mjs","sources":["../../../src/slider/hooks/useSliderMark.tsx"],"sourcesContent":["import { computed, VNode, Ref } from 'vue';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { SliderMarks } from '../type';\nimport { TNode } from '../../common';\nimport log from '../../_common/js/log/log';\nimport { getStopStyle } from '../util/common';\nimport TSliderMark from '../slider-mark';\nimport isArray from 'lodash/isArray';\n\ninterface MarkItem {\n  point: number;\n  position: number;\n  mark: string | number | TNode<{ value: number }>;\n}\n\ninterface useSliderMarkProps {\n  max: number;\n  min: number;\n  marks: number[] | SliderMarks;\n  vertical: boolean;\n  prefixName: string;\n}\n\n/**\n * 聚合管理刻度值渲染逻辑\n */\nexport const useSliderMark = (config: Ref<useSliderMarkProps>) => {\n  const name = config.value.prefixName;\n  const markList = computed(() => {\n    const markProps = config.value;\n    if (!markProps.marks) {\n      return [];\n    }\n    const legalMarks: Array<MarkItem> = [];\n    if (isArray(markProps.marks)) {\n      const marksList = cloneDeep(markProps.marks).sort((a, b) => a - b);\n      const maxLimit = Math.max(...marksList, markProps.max);\n      const minLimit = Math.min(...marksList, markProps.min);\n      if (minLimit < markProps.min) {\n        log.errorOnce('TSlider', 'marks min value should >= props min');\n      }\n      if (maxLimit > markProps.max) {\n        log.errorOnce('TSlider', 'marks max value should <= props max');\n      }\n      marksList.forEach((item) => {\n        legalMarks.push({\n          point: item,\n          position: ((item - minLimit) / (maxLimit - minLimit)) * 100,\n          mark: item,\n        });\n      });\n    } else {\n      Object.keys(markProps.marks)\n        .map(parseFloat)\n        .sort((a, b) => a - b)\n        .filter((point) => point <= markProps.max && point >= markProps.min)\n        .forEach((point) => {\n          const item: MarkItem = {\n            point,\n            position: ((point - markProps.min) * 100) / (markProps.max - markProps.min),\n            mark: markProps.marks[point],\n          };\n          legalMarks.push(item);\n        });\n    }\n    return legalMarks;\n  });\n\n  const renderMask = (onChangeFn?: (point: number) => void): VNode => {\n    if (!markList.value.length) return null;\n\n    return (\n      <div>\n        <div class={`${name}__stops`}>\n          {markList.value.map((item, index) => {\n            if (item.position === 0 || item.position === 100) return null;\n            return (\n              <div\n                class={`${name}__stop ${name}__mark-stop`}\n                style={getStopStyle(item.position, config.value.vertical)}\n                key={index}\n              />\n            );\n          })}\n        </div>\n        <div class={`${name}__mark`}>\n          {markList.value.map((item, key) => (\n            <TSliderMark\n              mark={item.mark as any}\n              point={item.point}\n              key={key}\n              style={getStopStyle(item.position, config.value.vertical)}\n              onClickMarkPoint={onChangeFn}\n            />\n          ))}\n        </div>\n      </div>\n    );\n  };\n\n  return renderMask;\n};\n"],"names":["isArray","cloneDeep","log","marksList","point","mark","Object","position","legalMarks","_createVNode"],"mappings":"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"}