{"version":3,"file":"color-hue.vue2.mjs","sources":["../../../components/color-picker/color-hue.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"wrapper\"\n    :class=\"nh.be('hue')\"\n    tabindex=\"-1\"\n    role=\"group\"\n  >\n    <div :class=\"nh.be('hue-handler')\" :style=\"{ left: `${currentLeft}%` }\"></div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, watch } from 'vue'\n\nimport { useNameHelper } from '@vexip-ui/config'\nimport { useModifier, useMoving } from '@vexip-ui/hooks'\nimport { boundRange, toFixed } from '@vexip-ui/utils'\n\nexport default defineComponent({\n  name: 'ColorHue',\n  props: {\n    hue: {\n      type: Number,\n      default: 0,\n      validator: (value: number) => {\n        return value >= 0 && value <= 360\n      }\n    }\n  },\n  emits: ['edit-start', 'edit-end', 'change'],\n  setup(props, { emit }) {\n    const currentLeft = ref(props.hue * 100)\n\n    let prevLeft = currentLeft.value\n    let widthLimit: number\n    let leftStartAt: number\n\n    const { target: wrapper } = useModifier({\n      passive: false,\n      onKeyDown: (event, modifier) => {\n        if (modifier.left || modifier.right) {\n          event.preventDefault()\n\n          const step = event.ctrlKey ? 10 : event.altKey ? 0.5 : 2\n          const delta = step * (modifier.left ? -1 : 1)\n\n          currentLeft.value += delta\n\n          verifyPosition()\n          prevLeft = currentLeft.value\n          handleChange()\n        }\n      }\n    })\n\n    const { moving: editing } = useMoving({\n      target: wrapper,\n      onStart: (state, event) => {\n        if (!wrapper.value || event.button > 0) {\n          return false\n        }\n\n        const rect = wrapper.value.getBoundingClientRect()\n        const { left, width } = rect\n\n        widthLimit = width\n        currentLeft.value = ((leftStartAt = state.clientX - left) / width) * 100\n\n        verifyPosition()\n        emit('edit-start')\n\n        if (Math.abs(currentLeft.value - prevLeft) >= 0.01) {\n          prevLeft = currentLeft.value\n          handleChange()\n        }\n      },\n      onMove: state => {\n        currentLeft.value = ((leftStartAt + state.deltaX) / widthLimit) * 100\n\n        verifyPosition()\n        handleChange()\n      },\n      onEnd: () => {\n        emit('edit-end')\n      }\n    })\n\n    watch(\n      () => props.hue,\n      value => {\n        currentLeft.value = (value / 360) * 100\n        verifyPosition()\n      },\n      { immediate: true }\n    )\n\n    function verifyPosition() {\n      currentLeft.value = toFixed(boundRange(currentLeft.value, 0, 100), 3)\n    }\n\n    function handleChange() {\n      emit('change', (currentLeft.value / 100) * 360)\n    }\n\n    return {\n      nh: useNameHelper('color-picker'),\n      currentLeft,\n      editing,\n\n      wrapper\n    }\n  }\n})\n</script>\n"],"names":["_sfc_main","defineComponent","value","props","emit","currentLeft","ref","prevLeft","widthLimit","leftStartAt","wrapper","useModifier","event","modifier","delta","verifyPosition","handleChange","editing","useMoving","state","rect","left","width","watch","toFixed","boundRange","useNameHelper"],"mappings":";;;;AAkBA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IACL,KAAK;AAAA,MACH,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAACC,MACHA,KAAS,KAAKA,KAAS;AAAA,IAChC;AAAA,EAEJ;AAAA,EACA,OAAO,CAAC,cAAc,YAAY,QAAQ;AAAA,EAC1C,MAAMC,GAAO,EAAE,MAAAC,KAAQ;AACrB,UAAMC,IAAcC,EAAIH,EAAM,MAAM,GAAG;AAEvC,QAAII,IAAWF,EAAY,OACvBG,GACAC;AAEJ,UAAM,EAAE,QAAQC,EAAQ,IAAIC,EAAY;AAAA,MACtC,SAAS;AAAA,MACT,WAAW,CAACC,GAAOC,MAAa;AAC1B,YAAAA,EAAS,QAAQA,EAAS,OAAO;AACnC,UAAAD,EAAM,eAAe;AAGrB,gBAAME,KADOF,EAAM,UAAU,KAAKA,EAAM,SAAS,MAAM,MACjCC,EAAS,OAAO,KAAK;AAE3C,UAAAR,EAAY,SAASS,GAENC,EAAA,GACfR,IAAWF,EAAY,OACVW,EAAA;AAAA,QAAA;AAAA,MACf;AAAA,IACF,CACD,GAEK,EAAE,QAAQC,EAAQ,IAAIC,EAAU;AAAA,MACpC,QAAQR;AAAA,MACR,SAAS,CAACS,GAAOP,MAAU;AACzB,YAAI,CAACF,EAAQ,SAASE,EAAM,SAAS;AAC5B,iBAAA;AAGH,cAAAQ,IAAOV,EAAQ,MAAM,sBAAsB,GAC3C,EAAE,MAAAW,GAAM,OAAAC,EAAA,IAAUF;AAEX,QAAAZ,IAAAc,GACbjB,EAAY,SAAUI,IAAcU,EAAM,UAAUE,KAAQC,IAAS,KAEtDP,EAAA,GACfX,EAAK,YAAY,GAEb,KAAK,IAAIC,EAAY,QAAQE,CAAQ,KAAK,SAC5CA,IAAWF,EAAY,OACVW,EAAA;AAAA,MAEjB;AAAA,MACA,QAAQ,CAASG,MAAA;AACf,QAAAd,EAAY,SAAUI,IAAcU,EAAM,UAAUX,IAAc,KAEnDO,EAAA,GACFC,EAAA;AAAA,MACf;AAAA,MACA,OAAO,MAAM;AACX,QAAAZ,EAAK,UAAU;AAAA,MAAA;AAAA,IACjB,CACD;AAED,IAAAmB;AAAA,MACE,MAAMpB,EAAM;AAAA,MACZ,CAASD,MAAA;AACK,QAAAG,EAAA,QAASH,IAAQ,MAAO,KACrBa,EAAA;AAAA,MACjB;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IACpB;AAEA,aAASA,IAAiB;AACZ,MAAAV,EAAA,QAAQmB,EAAQC,EAAWpB,EAAY,OAAO,GAAG,GAAG,GAAG,CAAC;AAAA,IAAA;AAGtE,aAASW,IAAe;AACtB,MAAAZ,EAAK,UAAWC,EAAY,QAAQ,MAAO,GAAG;AAAA,IAAA;AAGzC,WAAA;AAAA,MACL,IAAIqB,EAAc,cAAc;AAAA,MAChC,aAAArB;AAAA,MACA,SAAAY;AAAA,MAEA,SAAAP;AAAA,IACF;AAAA,EAAA;AAEJ,CAAC;"}