{"version":3,"file":"split.vue2.mjs","sources":["../../../components/split/split.vue"],"sourcesContent":["<template>\r\n  <div ref=\"wrapper\" :class=\"className\" @transitionend=\"removeTransition\">\r\n    <div\r\n      :class=\"[nh.be('panel'), nh.bem('panel', props.vertical ? 'top' : 'left')]\"\r\n      :style=\"leftPaneStyle\"\r\n    >\r\n      <slot name=\"left\"></slot>\r\n    </div>\r\n    <div\r\n      :class=\"[nh.be('panel'), nh.bem('panel', props.vertical ? 'bottom' : 'right')]\"\r\n      :style=\"rightPaneStyle\"\r\n    >\r\n      <slot name=\"right\"></slot>\r\n    </div>\r\n    <div :class=\"nh.be('trigger')\" :style=\"triggerStyle\">\r\n      <div ref=\"handler\" :class=\"nh.be('handler')\">\r\n        <template v-if=\"props.canFull\">\r\n          <button\r\n            type=\"button\"\r\n            :class=\"[nh.be('button'), nh.bem('button', `${props.vertical ? 'top' : 'left'}-full`)]\"\r\n            @pointerdown.stop\r\n            @click.left=\"handleFull(-1)\"\r\n          >\r\n            <Icon v-bind=\"fullIcons[0]\" :scale=\"+(fullIcons[0].scale || 1) * 0.6\"></Icon>\r\n          </button>\r\n          <button\r\n            type=\"button\"\r\n            :class=\"[\r\n              nh.be('button'),\r\n              nh.bem('button', `${props.vertical ? 'bottom' : 'right'}-full`)\r\n            ]\"\r\n            @pointerdown.stop\r\n            @click.left=\"handleFull(1)\"\r\n          >\r\n            <Icon v-bind=\"fullIcons[1]\" :scale=\"+(fullIcons[1].scale || 1) * 0.6\"></Icon>\r\n          </button>\r\n        </template>\r\n        <template v-else>\r\n          <slot name=\"handler\">\r\n            <span v-for=\"n in 6\" :key=\"n\" :class=\"nh.be('pointer')\"></span>\r\n          </slot>\r\n        </template>\r\n      </div>\r\n    </div>\r\n    <div ref=\"guide\" :class=\"nh.be('guide')\"></div>\r\n  </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { Icon } from '@/components/icon'\r\n\r\nimport { computed, defineComponent, ref, watch } from 'vue'\r\n\r\nimport { emitEvent, useIcons, useNameHelper, useProps } from '@vexip-ui/config'\r\nimport { useMoving } from '@vexip-ui/hooks'\r\nimport { splitProps } from './props'\r\n\r\nexport default defineComponent({\r\n  name: 'Split',\r\n  components: {\r\n    Icon,\r\n  },\r\n  props: splitProps,\r\n  emits: ['update:value'],\r\n  setup(_props, { emit }) {\r\n    const props = useProps('split', _props, {\r\n      value: {\r\n        default: 0.5,\r\n        validator: (value: number) => value > 0 && value < 1,\r\n        static: true,\r\n      },\r\n      min: 0.1,\r\n      max: 0.9,\r\n      vertical: false,\r\n      noTransition: false,\r\n      lazy: false,\r\n      canFull: false,\r\n    })\r\n\r\n    const nh = useNameHelper('split')\r\n    const icons = useIcons()\r\n    const currentValue = ref(props.value)\r\n    const currentFull = ref<0 | 1 | -1>(0)\r\n    const transition = ref(false)\r\n\r\n    const wrapper = ref<HTMLElement>()\r\n    const guide = ref<HTMLElement>()\r\n\r\n    const offset = computed(() => {\r\n      return props.vertical ? 'offsetHeight' : 'offsetWidth'\r\n    })\r\n    const position = computed<['top', 'bottom'] | ['left', 'right']>(() => {\r\n      return props.vertical ? ['top', 'bottom'] : ['left', 'right']\r\n    })\r\n\r\n    const { target: handler, moving } = useMoving({\r\n      lazy: true,\r\n      capture: false,\r\n      onStart: (state, event) => {\r\n        if (currentFull.value || !wrapper.value || event.button > 0) {\r\n          return false\r\n        }\r\n\r\n        const { min, max, vertical, lazy } = props\r\n        const outer = wrapper.value[offset.value]\r\n        const computedMin = min <= 1 ? min : min / outer\r\n        const computedMax = max <= 1 ? max : max / outer\r\n\r\n        state.outer = outer\r\n        state.min = computedMin\r\n        state.max = computedMax\r\n        state.vertical = vertical\r\n        state.splitLazy = lazy\r\n        state.start = currentValue.value * outer\r\n        state.target = currentValue.value\r\n\r\n        if (lazy && guide.value) {\r\n          guide.value.style[position.value[0]] = `${currentValue.value * 100}`\r\n          guide.value.style.display = 'block'\r\n        }\r\n\r\n        emitEvent(props.onMoveStart, currentValue.value)\r\n      },\r\n      onMove: state => {\r\n        const outer = state.outer as number\r\n        const min = state.min as number\r\n        const max = state.max as number\r\n        const delta = state.vertical ? state.deltaY : state.deltaX\r\n        const start = state.start as number\r\n        const value = Math.min(Math.max(min, (start + delta) / outer), max)\r\n\r\n        if (state.splitLazy) {\r\n          if (guide.value) {\r\n            guide.value.style[position.value[0]] = `${value * 100}%`\r\n          }\r\n\r\n          state.target = value\r\n        } else {\r\n          handleChange(value)\r\n        }\r\n\r\n        emitEvent(props.onMove, value)\r\n      },\r\n      onEnd: state => {\r\n        if (guide.value) {\r\n          guide.value.style.display = ''\r\n        }\r\n\r\n        if (state.splitLazy) {\r\n          const target = state.target as number\r\n\r\n          if (Math.abs(target - currentValue.value) > 0.01) {\r\n            setTransition()\r\n          }\r\n\r\n          handleChange(target)\r\n        }\r\n\r\n        emitEvent(props.onMoveEnd, currentValue.value)\r\n      },\r\n    })\r\n\r\n    const className = computed(() => {\r\n      let fullType = ''\r\n\r\n      if (currentFull.value) {\r\n        if (props.vertical) {\r\n          fullType = currentFull.value < 0 ? 'top' : 'bottom'\r\n        } else {\r\n          fullType = currentFull.value < 0 ? 'left' : 'right'\r\n        }\r\n      }\r\n\r\n      return {\r\n        [nh.b()]: true,\r\n        [nh.bs('vars')]: true,\r\n        [nh.bm('inherit')]: props.inherit,\r\n        [nh.bm(props.vertical ? 'vertical' : 'horizontal')]: true,\r\n        [nh.bm('moving')]: moving.value,\r\n        [nh.bm(`${fullType}-full`)]: !!fullType,\r\n        [nh.bm('transition')]: transition.value,\r\n      }\r\n    })\r\n    const leftPaneStyle = computed(() => {\r\n      return {\r\n        [position.value[1]]:\r\n          currentFull.value < 0\r\n            ? '0'\r\n            : currentFull.value > 0\r\n              ? '100%'\r\n              : `${(1 - currentValue.value) * 100}%`,\r\n      }\r\n    })\r\n    const rightPaneStyle = computed(() => {\r\n      return {\r\n        [position.value[0]]:\r\n          currentFull.value < 0\r\n            ? '100%'\r\n            : currentFull.value > 0\r\n              ? '0'\r\n              : `${currentValue.value * 100}%`,\r\n      }\r\n    })\r\n    const triggerStyle = computed(() => {\r\n      return {\r\n        [position.value[0]]:\r\n          currentFull.value < 0\r\n            ? '100%'\r\n            : currentFull.value > 0\r\n              ? '0'\r\n              : `calc(${currentValue.value * 100}% - var(${nh.cv('handler-size')}) * 0.5)`,\r\n      }\r\n    })\r\n    const fullIcons = computed(() => {\r\n      return props.vertical\r\n        ? [icons.value.angleDown, icons.value.angleUp]\r\n        : [icons.value.angleRight, icons.value.angleLeft]\r\n    })\r\n\r\n    watch(\r\n      () => props.value,\r\n      value => {\r\n        if (value.toFixed(5) !== currentValue.value.toFixed(5)) {\r\n          currentValue.value = value\r\n          setTransition()\r\n        }\r\n      },\r\n    )\r\n    watch(currentValue, value => {\r\n      if (guide.value) {\r\n        guide.value.style[position.value[0]] = `${value * 100}%`\r\n      }\r\n    })\r\n    watch(currentFull, value => {\r\n      setTransition()\r\n\r\n      if (value) {\r\n        let type: 'top' | 'right' | 'bottom' | 'left'\r\n\r\n        if (props.vertical) {\r\n          type = value < 0 ? 'top' : 'bottom'\r\n        } else {\r\n          type = value < 0 ? 'left' : 'right'\r\n        }\r\n\r\n        emitEvent(props.onFull, type)\r\n      } else {\r\n        emitEvent(props.onReset)\r\n      }\r\n    })\r\n\r\n    function setTransition() {\r\n      transition.value = !props.noTransition && !moving.value\r\n    }\r\n\r\n    function removeTransition() {\r\n      transition.value = false\r\n    }\r\n\r\n    function handleFull(type: 1 | -1) {\r\n      if (!props.canFull) {\r\n        return\r\n      }\r\n\r\n      if (currentFull.value) {\r\n        currentFull.value = 0\r\n      } else {\r\n        currentFull.value = type\r\n      }\r\n    }\r\n\r\n    function handleChange(value: number) {\r\n      if (value.toFixed(5) !== currentValue.value.toFixed(5)) {\r\n        currentValue.value = value\r\n\r\n        emitEvent(props.onChange, value)\r\n        emit('update:value', value)\r\n      }\r\n    }\r\n\r\n    return {\r\n      props,\r\n      nh,\r\n\r\n      className,\r\n      position,\r\n      leftPaneStyle,\r\n      rightPaneStyle,\r\n      triggerStyle,\r\n      fullIcons,\r\n\r\n      wrapper,\r\n      guide,\r\n      handler,\r\n\r\n      removeTransition,\r\n      handleFull,\r\n    }\r\n  },\r\n})\r\n</script>\r\n"],"names":["_sfc_main","defineComponent","Icon","splitProps","_props","emit","props","useProps","value","nh","useNameHelper","icons","useIcons","currentValue","ref","currentFull","transition","wrapper","guide","offset","computed","position","handler","moving","useMoving","state","event","min","max","vertical","lazy","outer","computedMin","computedMax","emitEvent","delta","start","handleChange","target","setTransition","className","fullType","leftPaneStyle","rightPaneStyle","triggerStyle","fullIcons","watch","type","removeTransition","handleFull"],"mappings":"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"}