@element-plus/nightly 0.0.20260121 → 0.0.20260122

package/es/components/color-picker/src/color-picker.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker.vue2.mjs","sources":["../../../../../../packages/components/color-picker/src/color-picker.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"popper\"\n    :visible=\"showPicker\"\n    :show-arrow=\"false\"\n    :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n    :offset=\"0\"\n    :gpu-acceleration=\"false\"\n    :popper-class=\"[ns.be('picker', 'panel'), popperClass!]\"\n    :popper-style=\"popperStyle\"\n    :stop-popper-mouse-event=\"false\"\n    pure\n    loop\n    role=\"dialog\"\n    effect=\"light\"\n    trigger=\"click\"\n    :teleported=\"teleported\"\n    :transition=\"`${ns.namespace.value}-zoom-in-top`\"\n    :persistent=\"persistent\"\n    :append-to=\"appendTo\"\n    @show=\"handleShowTooltip\"\n    @hide=\"setShowPicker(false)\"\n  >\n    <template #content>\n      <el-color-picker-panel\n        ref=\"pickerPanelRef\"\n        v-bind=\"panelProps\"\n        v-click-outside:[triggerRef]=\"handleClickOutside\"\n        :border=\"false\"\n        :validate-event=\"false\"\n        @keydown.esc=\"handleEsc\"\n      >\n        <template #footer>\n          <div>\n            <el-button\n              v-if=\"clearable\"\n              :class=\"ns.be('footer', 'link-btn')\"\n              text\n              size=\"small\"\n              @click=\"clear\"\n            >\n              {{ t('el.colorpicker.clear') }}\n            </el-button>\n            <el-button\n              plain\n              size=\"small\"\n              :class=\"ns.be('footer', 'btn')\"\n              @click=\"confirmValue\"\n            >\n              {{ t('el.colorpicker.confirm') }}\n            </el-button>\n          </div>\n        </template>\n      </el-color-picker-panel>\n    </template>\n    <template #default>\n      <div\n        :id=\"buttonId\"\n        ref=\"triggerRef\"\n        v-bind=\"$attrs\"\n        :class=\"btnKls\"\n        role=\"button\"\n        :aria-label=\"buttonAriaLabel\"\n        :aria-labelledby=\"buttonAriaLabelledby\"\n        :aria-description=\"\n          t('el.colorpicker.description', { color: modelValue || '' })\n        \"\n        :aria-disabled=\"colorDisabled\"\n        :tabindex=\"colorDisabled ? undefined : tabindex\"\n        @keydown=\"handleKeyDown\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n      >\n        <div :class=\"ns.be('picker', 'trigger')\" @click=\"handleTrigger\">\n          <span :class=\"[ns.be('picker', 'color'), ns.is('alpha', showAlpha)]\">\n            <span\n              :class=\"ns.be('picker', 'color-inner')\"\n              :style=\"{\n                backgroundColor: displayedColor,\n              }\"\n            >\n              <el-icon\n                v-show=\"modelValue || showPanelColor\"\n                :class=\"[ns.be('picker', 'icon'), ns.is('icon-arrow-down')]\"\n              >\n                <arrow-down />\n              </el-icon>\n              <el-icon\n                v-show=\"!modelValue && !showPanelColor\"\n                :class=\"[ns.be('picker', 'empty'), ns.is('icon-close')]\"\n              >\n                <close />\n              </el-icon>\n            </span>\n          </span>\n        </div>\n      </div>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, nextTick, provide, ref, watch } from 'vue'\nimport { debounce, pick } from 'lodash-unified'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { reactiveComputed } from '@vueuse/core'\nimport { ClickOutside as vClickOutside } from '@element-plus/directives'\nimport { ElTooltip } from '@element-plus/components/tooltip'\nimport { ElButton } from '@element-plus/components/button'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport {\n  useEmptyValues,\n  useFocusController,\n  useLocale,\n  useNamespace,\n} from '@element-plus/hooks'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { debugWarn, getEventCode } from '@element-plus/utils'\nimport { ArrowDown, Close } from '@element-plus/icons-vue'\nimport { colorPickerEmits, colorPickerPropsDefaults } from './color-picker'\nimport {\n  ElColorPickerPanel,\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelProps,\n} from '@element-plus/components/color-picker-panel'\nimport Color from '@element-plus/components/color-picker-panel/src/utils/color'\nimport { useCommonColor } from '@element-plus/components/color-picker-panel/src/composables/use-common-color'\n\nimport type { ColorPickerPanelInstance } from '@element-plus/components/color-picker-panel'\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\nimport type { ColorPickerProps } from './color-picker'\n\ndefineOptions({\n  name: 'ElColorPicker',\n})\nconst props = withDefaults(\n  defineProps<ColorPickerProps>(),\n  colorPickerPropsDefaults\n)\n\nconst emit = defineEmits(colorPickerEmits)\n\nconst { t } = useLocale()\nconst ns = useNamespace('color')\nconst { formItem } = useFormItem()\nconst colorSize = useFormSize()\nconst colorDisabled = useFormDisabled()\nconst { valueOnClear, isEmptyValue } = useEmptyValues(props, null)\nconst commonColor = useCommonColor(props, emit)\nconst { inputId: buttonId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\n\nconst popper = ref<TooltipInstance>()\nconst triggerRef = ref()\nconst pickerPanelRef = ref<ColorPickerPanelInstance>()\nconst showPicker = ref(false)\nconst showPanelColor = ref(false)\n\n// active-change is used to prevent modelValue changes from triggering.\nlet shouldActiveChange = true\n\nconst { isFocused, handleFocus, handleBlur } = useFocusController(triggerRef, {\n  disabled: colorDisabled,\n  beforeBlur(event) {\n    return popper.value?.isFocusInsideContent(event)\n  },\n  afterBlur() {\n    setShowPicker(false)\n    resetColor()\n    if (props.validateEvent) {\n      formItem?.validate?.('blur').catch((err) => debugWarn(err))\n    }\n  },\n})\n\nconst color = reactiveComputed(\n  () => pickerPanelRef.value?.color ?? commonColor.color\n) as Color\n\nconst panelProps = computed(() =>\n  pick(props, Object.keys(colorPickerPanelProps))\n)\n\nconst displayedColor = computed(() => {\n  if (!props.modelValue && !showPanelColor.value) {\n    return 'transparent'\n  }\n  return displayedRgb(color, props.showAlpha)\n})\n\nconst currentColor = computed(() => {\n  return !props.modelValue && !showPanelColor.value ? '' : color.value\n})\n\nconst buttonAriaLabel = computed<string | undefined>(() => {\n  return !isLabeledByFormItem.value\n    ? props.ariaLabel || t('el.colorpicker.defaultLabel')\n    : undefined\n})\n\nconst buttonAriaLabelledby = computed<string | undefined>(() => {\n  return isLabeledByFormItem.value ? formItem?.labelId : undefined\n})\n\nconst btnKls = computed(() => {\n  return [\n    ns.b('picker'),\n    ns.is('disabled', colorDisabled.value),\n    ns.bm('picker', colorSize.value),\n    ns.is('focused', isFocused.value),\n  ]\n})\n\nfunction displayedRgb(color: Color, showAlpha: boolean) {\n  const { r, g, b, a } = color.toRgb()\n  return showAlpha ? `rgba(${r}, ${g}, ${b}, ${a})` : `rgb(${r}, ${g}, ${b})`\n}\n\nfunction setShowPicker(value: boolean) {\n  showPicker.value = value\n}\n\nconst debounceSetShowPicker = debounce(setShowPicker, 100, { leading: true })\nfunction show() {\n  if (colorDisabled.value) return\n  setShowPicker(true)\n}\n\nfunction hide() {\n  debounceSetShowPicker(false)\n  resetColor()\n}\n\nfunction resetColor() {\n  nextTick(() => {\n    if (props.modelValue) {\n      color.fromString(props.modelValue)\n    } else {\n      color.value = ''\n      nextTick(() => {\n        showPanelColor.value = false\n      })\n    }\n  })\n}\n\nfunction handleTrigger() {\n  if (colorDisabled.value) return\n  if (showPicker.value) {\n    resetColor()\n  }\n  debounceSetShowPicker(!showPicker.value)\n}\n\nfunction confirmValue() {\n  const value = isEmptyValue(color.value) ? valueOnClear.value : color.value\n  emit(UPDATE_MODEL_EVENT, value)\n  emit(CHANGE_EVENT, value)\n  if (props.validateEvent) {\n    formItem?.validate('change').catch((err) => debugWarn(err))\n  }\n  debounceSetShowPicker(false)\n  // check if modelValue change, if not change, then reset color.\n  nextTick(() => {\n    const newColor = new Color({\n      enableAlpha: props.showAlpha,\n      format: props.colorFormat || '',\n      value: props.modelValue,\n    })\n    if (!color.compare(newColor)) {\n      resetColor()\n    }\n  })\n}\n\nfunction clear() {\n  debounceSetShowPicker(false)\n  emit(UPDATE_MODEL_EVENT, valueOnClear.value)\n  emit(CHANGE_EVENT, valueOnClear.value)\n  if (props.modelValue !== valueOnClear.value && props.validateEvent) {\n    formItem?.validate('change').catch((err) => debugWarn(err))\n  }\n  resetColor()\n  emit('clear')\n}\n\nfunction handleShowTooltip() {\n  pickerPanelRef?.value?.inputRef?.focus()\n}\n\nfunction handleClickOutside() {\n  if (!showPicker.value) return\n  hide()\n  isFocused.value && focus()\n}\n\nfunction handleEsc(event: KeyboardEvent) {\n  event.preventDefault()\n  event.stopPropagation()\n  setShowPicker(false)\n  resetColor()\n}\n\nfunction handleKeyDown(event: KeyboardEvent) {\n  const code = getEventCode(event)\n\n  switch (code) {\n    case EVENT_CODE.enter:\n    case EVENT_CODE.numpadEnter:\n    case EVENT_CODE.space:\n      event.preventDefault()\n      event.stopPropagation()\n      show()\n      break\n    case EVENT_CODE.esc:\n      handleEsc(event)\n      break\n  }\n}\n\nfunction focus() {\n  triggerRef.value.focus()\n}\n\nfunction blur() {\n  triggerRef.value.blur()\n}\n\nwatch(\n  () => currentColor.value,\n  (val) => {\n    shouldActiveChange && emit('activeChange', val)\n    shouldActiveChange = true\n  }\n)\n\nwatch(\n  () => color.value,\n  () => {\n    if (!props.modelValue && !showPanelColor.value) {\n      showPanelColor.value = true\n    }\n  }\n)\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (!newVal) {\n      showPanelColor.value = false\n    } else if (newVal && newVal !== color.value) {\n      shouldActiveChange = false\n      color.fromString(newVal)\n    }\n  }\n)\n\nwatch(\n  () => showPicker.value,\n  () => {\n    pickerPanelRef.value && nextTick(pickerPanelRef.value.update)\n  }\n)\n\nprovide(ROOT_COMMON_COLOR_INJECTION_KEY, commonColor)\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description manually show ColorPicker\n   */\n  show,\n  /**\n   * @description manually hide ColorPicker\n   */\n  hide,\n  /**\n   * @description focus the input element\n   */\n  focus,\n  /**\n   * @description blur the input element\n   */\n  blur,\n})\n</script>\n"],"names":["color","_createBlock","_unref","_withDirectives","_openBlock","_mergeProps","_createElementVNode","_normalizeClass","_createVNode","vClickOutside","$attrs","_normalizeStyle","_vShow"],"mappings":"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"}
+{"version":3,"file":"color-picker.vue2.mjs","sources":["../../../../../../packages/components/color-picker/src/color-picker.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"popper\"\n    :visible=\"showPicker\"\n    :show-arrow=\"false\"\n    :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n    :offset=\"0\"\n    :gpu-acceleration=\"false\"\n    :popper-class=\"[ns.be('picker', 'panel'), popperClass!]\"\n    :popper-style=\"popperStyle\"\n    :stop-popper-mouse-event=\"false\"\n    pure\n    loop\n    role=\"dialog\"\n    effect=\"light\"\n    trigger=\"click\"\n    :teleported=\"teleported\"\n    :transition=\"`${ns.namespace.value}-zoom-in-top`\"\n    :persistent=\"persistent\"\n    :append-to=\"appendTo\"\n    @show=\"handleShowTooltip\"\n    @hide=\"setShowPicker(false)\"\n  >\n    <template #content>\n      <el-color-picker-panel\n        ref=\"pickerPanelRef\"\n        v-bind=\"panelProps\"\n        v-click-outside:[triggerRef]=\"handleClickOutside\"\n        :border=\"false\"\n        :validate-event=\"false\"\n        @keydown.esc=\"handleEsc\"\n      >\n        <template #footer>\n          <div>\n            <el-button\n              v-if=\"clearable\"\n              :class=\"ns.be('footer', 'link-btn')\"\n              text\n              size=\"small\"\n              @click=\"clear\"\n            >\n              {{ t('el.colorpicker.clear') }}\n            </el-button>\n            <el-button\n              plain\n              size=\"small\"\n              :class=\"ns.be('footer', 'btn')\"\n              @click=\"confirmValue\"\n            >\n              {{ t('el.colorpicker.confirm') }}\n            </el-button>\n          </div>\n        </template>\n      </el-color-picker-panel>\n    </template>\n    <template #default>\n      <div\n        :id=\"buttonId\"\n        ref=\"triggerRef\"\n        v-bind=\"$attrs\"\n        :class=\"btnKls\"\n        role=\"button\"\n        :aria-label=\"buttonAriaLabel\"\n        :aria-labelledby=\"buttonAriaLabelledby\"\n        :aria-description=\"\n          t('el.colorpicker.description', { color: modelValue || '' })\n        \"\n        :aria-disabled=\"colorDisabled\"\n        :tabindex=\"colorDisabled ? undefined : tabindex\"\n        @keydown=\"handleKeyDown\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n      >\n        <div :class=\"ns.be('picker', 'trigger')\" @click=\"handleTrigger\">\n          <span :class=\"[ns.be('picker', 'color'), ns.is('alpha', showAlpha)]\">\n            <span\n              :class=\"ns.be('picker', 'color-inner')\"\n              :style=\"{\n                backgroundColor: displayedColor,\n              }\"\n            >\n              <el-icon\n                v-show=\"modelValue || showPanelColor\"\n                :class=\"[ns.be('picker', 'icon'), ns.is('icon-arrow-down')]\"\n              >\n                <arrow-down />\n              </el-icon>\n              <el-icon\n                v-show=\"!modelValue && !showPanelColor\"\n                :class=\"[ns.be('picker', 'empty'), ns.is('icon-close')]\"\n              >\n                <close />\n              </el-icon>\n            </span>\n          </span>\n        </div>\n      </div>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, nextTick, provide, ref, watch } from 'vue'\nimport { debounce, pick } from 'lodash-unified'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { reactiveComputed } from '@vueuse/core'\nimport { ClickOutside as vClickOutside } from '@element-plus/directives'\nimport { ElTooltip } from '@element-plus/components/tooltip'\nimport { ElButton } from '@element-plus/components/button'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport {\n  useEmptyValues,\n  useFocusController,\n  useLocale,\n  useNamespace,\n} from '@element-plus/hooks'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { debugWarn, getEventCode } from '@element-plus/utils'\nimport { ArrowDown, Close } from '@element-plus/icons-vue'\nimport { colorPickerEmits, colorPickerPropsDefaults } from './color-picker'\nimport {\n  ElColorPickerPanel,\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelProps,\n} from '@element-plus/components/color-picker-panel'\nimport Color from '@element-plus/components/color-picker-panel/src/utils/color'\nimport { useCommonColor } from '@element-plus/components/color-picker-panel/src/composables/use-common-color'\n\nimport type { ColorPickerPanelInstance } from '@element-plus/components/color-picker-panel'\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\nimport type { ColorPickerProps } from './color-picker'\n\ndefineOptions({\n  name: 'ElColorPicker',\n})\nconst props = withDefaults(\n  defineProps<ColorPickerProps>(),\n  colorPickerPropsDefaults\n)\n\nconst emit = defineEmits(colorPickerEmits)\n\nconst { t } = useLocale()\nconst ns = useNamespace('color')\nconst { formItem } = useFormItem()\nconst colorSize = useFormSize()\nconst colorDisabled = useFormDisabled()\nconst { valueOnClear, isEmptyValue } = useEmptyValues(props, null)\nconst commonColor = useCommonColor(props, emit)\nconst { inputId: buttonId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\n\nconst popper = ref<TooltipInstance>()\nconst triggerRef = ref()\nconst pickerPanelRef = ref<ColorPickerPanelInstance>()\nconst showPicker = ref(false)\nconst showPanelColor = ref(false)\n\n// active-change is used to prevent modelValue changes from triggering.\nlet shouldActiveChange = true\n\nconst { isFocused, handleFocus, handleBlur } = useFocusController(triggerRef, {\n  disabled: colorDisabled,\n  beforeBlur(event) {\n    return popper.value?.isFocusInsideContent(event)\n  },\n  afterBlur() {\n    setShowPicker(false)\n    resetColor()\n    if (props.validateEvent) {\n      formItem?.validate?.('blur').catch((err) => debugWarn(err))\n    }\n  },\n})\n\nconst color = reactiveComputed(\n  () => pickerPanelRef.value?.color ?? commonColor.color\n) as Color\n\nconst panelProps = computed(() =>\n  pick(props, Object.keys(colorPickerPanelProps))\n)\n\nconst displayedColor = computed(() => {\n  if (!props.modelValue && !showPanelColor.value) {\n    return 'transparent'\n  }\n  return displayedRgb(color, props.showAlpha)\n})\n\nconst currentColor = computed(() => {\n  return !props.modelValue && !showPanelColor.value ? '' : color.value\n})\n\nconst buttonAriaLabel = computed<string | undefined>(() => {\n  return !isLabeledByFormItem.value\n    ? props.ariaLabel || t('el.colorpicker.defaultLabel')\n    : undefined\n})\n\nconst buttonAriaLabelledby = computed<string | undefined>(() => {\n  return isLabeledByFormItem.value ? formItem?.labelId : undefined\n})\n\nconst btnKls = computed(() => {\n  return [\n    ns.b('picker'),\n    ns.is('disabled', colorDisabled.value),\n    ns.bm('picker', colorSize.value),\n    ns.is('focused', isFocused.value),\n  ]\n})\n\nfunction displayedRgb(color: Color, showAlpha: boolean) {\n  const { r, g, b, a } = color.toRgb()\n  return showAlpha ? `rgba(${r}, ${g}, ${b}, ${a})` : `rgb(${r}, ${g}, ${b})`\n}\n\nfunction setShowPicker(value: boolean) {\n  showPicker.value = value\n}\n\nconst debounceSetShowPicker = debounce(setShowPicker, 100, { leading: true })\nfunction show() {\n  if (colorDisabled.value) return\n  setShowPicker(true)\n}\n\nfunction hide() {\n  debounceSetShowPicker(false)\n  resetColor()\n}\n\nfunction resetColor() {\n  nextTick(() => {\n    if (props.modelValue) {\n      color.fromString(props.modelValue)\n    } else {\n      color.value = ''\n      nextTick(() => {\n        showPanelColor.value = false\n      })\n    }\n  })\n}\n\nfunction handleTrigger() {\n  if (colorDisabled.value) return\n  if (showPicker.value) {\n    resetColor()\n  }\n  debounceSetShowPicker(!showPicker.value)\n}\n\nfunction confirmValue() {\n  const value = isEmptyValue(color.value) ? valueOnClear.value : color.value\n  emit(UPDATE_MODEL_EVENT, value)\n  emit(CHANGE_EVENT, value)\n  if (props.validateEvent) {\n    formItem?.validate('change').catch((err) => debugWarn(err))\n  }\n  debounceSetShowPicker(false)\n  // check if modelValue change, if not change, then reset color.\n  nextTick(() => {\n    const newColor = new Color({\n      enableAlpha: props.showAlpha,\n      format: props.colorFormat || '',\n      value: props.modelValue,\n    })\n    if (!color.compare(newColor)) {\n      resetColor()\n    }\n  })\n}\n\nfunction clear() {\n  debounceSetShowPicker(false)\n  emit(UPDATE_MODEL_EVENT, valueOnClear.value)\n  emit(CHANGE_EVENT, valueOnClear.value)\n  if (props.modelValue !== valueOnClear.value && props.validateEvent) {\n    formItem?.validate('change').catch((err) => debugWarn(err))\n  }\n  resetColor()\n  emit('clear')\n}\n\nfunction handleShowTooltip() {\n  pickerPanelRef?.value?.inputRef?.focus()\n}\n\nfunction handleClickOutside() {\n  if (!showPicker.value) return\n  hide()\n  isFocused.value && focus()\n}\n\nfunction handleEsc(event: KeyboardEvent) {\n  event.preventDefault()\n  event.stopPropagation()\n  setShowPicker(false)\n  resetColor()\n}\n\nfunction handleKeyDown(event: KeyboardEvent) {\n  const code = getEventCode(event)\n\n  switch (code) {\n    case EVENT_CODE.enter:\n    case EVENT_CODE.numpadEnter:\n    case EVENT_CODE.space:\n      event.preventDefault()\n      event.stopPropagation()\n      show()\n      break\n    case EVENT_CODE.esc:\n      handleEsc(event)\n      break\n  }\n}\n\nfunction focus() {\n  triggerRef.value.focus()\n}\n\nfunction blur() {\n  triggerRef.value.blur()\n}\n\nwatch(\n  () => currentColor.value,\n  (val) => {\n    shouldActiveChange && emit('activeChange', val)\n    shouldActiveChange = true\n  }\n)\n\nwatch(\n  () => color.value,\n  () => {\n    if (!props.modelValue && !showPanelColor.value) {\n      showPanelColor.value = true\n    }\n  }\n)\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (!newVal) {\n      showPanelColor.value = false\n    } else if (newVal && newVal !== color.value) {\n      shouldActiveChange = false\n      color.fromString(newVal)\n    }\n  }\n)\n\nwatch(\n  () => showPicker.value,\n  () => {\n    pickerPanelRef.value && nextTick(pickerPanelRef.value.update)\n  }\n)\n\nprovide(ROOT_COMMON_COLOR_INJECTION_KEY, commonColor)\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description manually show ColorPicker\n   */\n  show,\n  /**\n   * @description manually hide ColorPicker\n   */\n  hide,\n  /**\n   * @description focus the input element\n   */\n  focus,\n  /**\n   * @description blur the input element\n   */\n  blur,\n})\n</script>\n"],"names":["color","_createBlock","_unref","_withDirectives","_openBlock","_mergeProps","_createElementVNode","_normalizeClass","_createVNode","vClickOutside","$attrs","_normalizeStyle","_vShow"],"mappings":"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"}

package/es/components/color-picker-panel/src/color-picker-panel.vue2.mjs

@@ -1,10 +1,10 @@
+import { colorPickerPanelEmits, colorPickerPanelProps, ROOT_COMMON_COLOR_INJECTION_KEY, colorPickerPanelContextKey } from './color-picker-panel.mjs';
 import { defineComponent, ref, inject, onMounted, nextTick, watch, provide, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createBlock, createCommentVNode, createVNode, renderSlot } from 'vue';
 import { ElInput } from '../../input/index.mjs';
 import _sfc_main$3 from './components/alpha-slider.vue2.mjs';
 import _sfc_main$1 from './components/hue-slider.vue2.mjs';
 import _sfc_main$4 from './components/predefine.vue2.mjs';
 import _sfc_main$2 from './components/sv-panel.vue2.mjs';
-import { colorPickerPanelEmits, ROOT_COMMON_COLOR_INJECTION_KEY, colorPickerPanelContextKey } from './color-picker-panel.mjs';
 import { useCommonColor } from './composables/use-common-color.mjs';
 import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 import { useFormItem } from '../../form/src/hooks/use-form-item.mjs';
@@ -17,15 +17,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     name: "ElColorPickerPanel"
   },
   __name: "color-picker-panel",
-  props: {
-    modelValue: { type: [String, null], required: false, default: void 0 },
-    border: { type: Boolean, required: false, default: true },
-    showAlpha: { type: Boolean, required: false },
-    colorFormat: { type: String, required: false },
-    disabled: { type: Boolean, required: false },
-    predefine: { type: Array, required: false },
-    validateEvent: { type: Boolean, required: false, default: true }
-  },
+  props: colorPickerPanelProps,
   emits: colorPickerPanelEmits,
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;

package/es/components/color-picker-panel/src/color-picker-panel.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker-panel.vue2.mjs","sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), ns.is('disabled', disabled), ns.is('border', border)]\"\n    @focusout=\"handleFocusout\"\n  >\n    <div :class=\"ns.e('wrapper')\">\n      <hue-slider\n        ref=\"hueRef\"\n        class=\"hue-slider\"\n        :color=\"color\"\n        vertical\n        :disabled=\"disabled\"\n      />\n      <sv-panel ref=\"svRef\" :color=\"color\" :disabled=\"disabled\" />\n    </div>\n    <alpha-slider\n      v-if=\"showAlpha\"\n      ref=\"alphaRef\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n    />\n    <predefine\n      v-if=\"predefine\"\n      ref=\"predefine\"\n      :enable-alpha=\"showAlpha\"\n      :color=\"color\"\n      :colors=\"predefine\"\n      :disabled=\"disabled\"\n    />\n    <div :class=\"ns.e('footer')\">\n      <el-input\n        ref=\"inputRef\"\n        v-model=\"customInput\"\n        :validate-event=\"false\"\n        size=\"small\"\n        :disabled=\"disabled\"\n        @change=\"handleConfirm\"\n      />\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onMounted, provide, ref, watch } from 'vue'\nimport { ElInput } from '@element-plus/components/input'\nimport { useFormDisabled, useFormItem } from '@element-plus/components/form'\nimport { useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport {\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelContextKey,\n  colorPickerPanelEmits,\n} from './color-picker-panel'\nimport { useCommonColor } from './composables/use-common-color'\n\nimport type { ColorPickerPanelProps } from './color-picker-panel'\nimport type { InputInstance } from '@element-plus/components/input'\n\ndefineOptions({\n  name: 'ElColorPickerPanel',\n})\nconst props = withDefaults(defineProps<ColorPickerPanelProps>(), {\n  modelValue: undefined,\n  border: true,\n  validateEvent: true,\n})\nconst emit = defineEmits(colorPickerPanelEmits)\n\nconst ns = useNamespace('color-picker-panel')\nconst { formItem } = useFormItem()\nconst disabled = useFormDisabled()\nconst hueRef = ref<InstanceType<typeof HueSlider>>()\nconst svRef = ref<InstanceType<typeof SvPanel>>()\nconst alphaRef = ref<InstanceType<typeof AlphaSlider>>()\nconst inputRef = ref<InputInstance>()\nconst customInput = ref('')\n\nconst { color } = inject(\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  () => useCommonColor(props, emit),\n  true\n)\n\nfunction handleConfirm() {\n  color.fromString(customInput.value)\n  if (color.value !== customInput.value) {\n    customInput.value = color.value\n  }\n}\n\nfunction handleFocusout() {\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch((err) => debugWarn(err))\n  }\n}\n\nfunction update() {\n  hueRef.value?.update()\n  svRef.value?.update()\n  alphaRef.value?.update()\n}\n\nonMounted(() => {\n  if (props.modelValue) {\n    customInput.value = color.value\n  }\n  nextTick(update)\n})\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (newVal !== color.value) {\n      newVal ? color.fromString(newVal) : color.clear()\n    }\n  }\n)\n\nwatch(\n  () => color.value,\n  (val) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    customInput.value = val\n    if (props.validateEvent) {\n      formItem?.validate('change').catch((err) => debugWarn(err))\n    }\n  }\n)\n\nprovide(colorPickerPanelContextKey, {\n  currentColor: computed(() => color.value),\n})\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description custom input ref\n   */\n  inputRef,\n  /**\n   * @description update sub components\n   */\n  update,\n})\n</script>\n"],"names":["_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createVNode","HueSlider","SvPanel","_createBlock","AlphaSlider","Predefine","_renderSlot"],"mappings":"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"}
+{"version":3,"file":"color-picker-panel.vue2.mjs","sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), ns.is('disabled', disabled), ns.is('border', border)]\"\n    @focusout=\"handleFocusout\"\n  >\n    <div :class=\"ns.e('wrapper')\">\n      <hue-slider\n        ref=\"hueRef\"\n        class=\"hue-slider\"\n        :color=\"color\"\n        vertical\n        :disabled=\"disabled\"\n      />\n      <sv-panel ref=\"svRef\" :color=\"color\" :disabled=\"disabled\" />\n    </div>\n    <alpha-slider\n      v-if=\"showAlpha\"\n      ref=\"alphaRef\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n    />\n    <predefine\n      v-if=\"predefine\"\n      ref=\"predefine\"\n      :enable-alpha=\"showAlpha\"\n      :color=\"color\"\n      :colors=\"predefine\"\n      :disabled=\"disabled\"\n    />\n    <div :class=\"ns.e('footer')\">\n      <el-input\n        ref=\"inputRef\"\n        v-model=\"customInput\"\n        :validate-event=\"false\"\n        size=\"small\"\n        :disabled=\"disabled\"\n        @change=\"handleConfirm\"\n      />\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onMounted, provide, ref, watch } from 'vue'\nimport { ElInput } from '@element-plus/components/input'\nimport { useFormDisabled, useFormItem } from '@element-plus/components/form'\nimport { useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport {\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelContextKey,\n  colorPickerPanelEmits,\n} from './color-picker-panel'\nimport { useCommonColor } from './composables/use-common-color'\n\nimport type { ColorPickerPanelProps } from './color-picker-panel'\nimport type { InputInstance } from '@element-plus/components/input'\n\ndefineOptions({\n  name: 'ElColorPickerPanel',\n})\nconst props = withDefaults(defineProps<ColorPickerPanelProps>(), {\n  modelValue: undefined,\n  border: true,\n  validateEvent: true,\n})\nconst emit = defineEmits(colorPickerPanelEmits)\n\nconst ns = useNamespace('color-picker-panel')\nconst { formItem } = useFormItem()\nconst disabled = useFormDisabled()\nconst hueRef = ref<InstanceType<typeof HueSlider>>()\nconst svRef = ref<InstanceType<typeof SvPanel>>()\nconst alphaRef = ref<InstanceType<typeof AlphaSlider>>()\nconst inputRef = ref<InputInstance>()\nconst customInput = ref('')\n\nconst { color } = inject(\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  () => useCommonColor(props, emit),\n  true\n)\n\nfunction handleConfirm() {\n  color.fromString(customInput.value)\n  if (color.value !== customInput.value) {\n    customInput.value = color.value\n  }\n}\n\nfunction handleFocusout() {\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch((err) => debugWarn(err))\n  }\n}\n\nfunction update() {\n  hueRef.value?.update()\n  svRef.value?.update()\n  alphaRef.value?.update()\n}\n\nonMounted(() => {\n  if (props.modelValue) {\n    customInput.value = color.value\n  }\n  nextTick(update)\n})\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (newVal !== color.value) {\n      newVal ? color.fromString(newVal) : color.clear()\n    }\n  }\n)\n\nwatch(\n  () => color.value,\n  (val) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    customInput.value = val\n    if (props.validateEvent) {\n      formItem?.validate('change').catch((err) => debugWarn(err))\n    }\n  }\n)\n\nprovide(colorPickerPanelContextKey, {\n  currentColor: computed(() => color.value),\n})\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description custom input ref\n   */\n  inputRef,\n  /**\n   * @description update sub components\n   */\n  update,\n})\n</script>\n"],"names":["_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createVNode","HueSlider","SvPanel","_createBlock","AlphaSlider","Predefine","_renderSlot"],"mappings":"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"}

package/es/components/color-picker-panel/src/components/alpha-slider.vue2.mjs

@@ -1,3 +1,4 @@
+import { alphaSliderProps } from '../props/slider.mjs';
 import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, normalizeStyle } from 'vue';
 import { useSlider, useSliderDOM } from '../composables/use-slider.mjs';
 import { useLocale } from '../../../../hooks/use-locale/index.mjs';
@@ -10,11 +11,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     name: "ElColorAlphaSlider"
   },
   __name: "alpha-slider",
-  props: {
-    color: { type: Object, required: true },
-    vertical: { type: Boolean, required: false },
-    disabled: { type: Boolean, required: false }
-  },
+  props: alphaSliderProps,
   setup(__props, { expose: __expose }) {
     const props = __props;
     const { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } = useSlider(props, { key: "alpha", minValue, maxValue });

package/es/components/color-picker-panel/src/components/alpha-slider.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alpha-slider.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/alpha-slider.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\">\n    <div ref=\"bar\" :class=\"barKls\" :style=\"barStyle\" @click=\"handleClick\" />\n    <div\n      ref=\"thumb\"\n      :class=\"thumbKls\"\n      :style=\"thumbStyle\"\n      :aria-label=\"ariaLabel\"\n      :aria-valuenow=\"currentValue\"\n      :aria-valuetext=\"ariaValuetext\"\n      :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n      :aria-valuemin=\"minValue\"\n      :aria-valuemax=\"maxValue\"\n      role=\"slider\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-disabled=\"disabled\"\n      @keydown=\"handleKeydown\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { useSlider, useSliderDOM } from '../composables/use-slider'\n\nimport type { AlphaSliderProps } from '../props/slider'\n\ndefineOptions({\n  name: 'ElColorAlphaSlider',\n})\n\nconst props = defineProps<AlphaSliderProps>()\nconst minValue = 0\nconst maxValue = 100\n\nconst { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } =\n  useSlider(props, { key: 'alpha', minValue, maxValue })\n\nconst { rootKls, barKls, barStyle, thumbKls, thumbStyle, update } =\n  useSliderDOM(props, {\n    namespace: 'color-alpha-slider',\n    maxValue,\n    currentValue,\n    bar,\n    thumb,\n    handleDrag,\n    getBackground,\n  })\n\nconst { t } = useLocale()\n\nconst ariaLabel = computed(() => t('el.colorpicker.alphaLabel'))\nconst ariaValuetext = computed(() => {\n  return t('el.colorpicker.alphaDescription', {\n    alpha: currentValue.value,\n    color: props.color.value,\n  })\n})\n\nfunction getBackground() {\n  if (props.color && props.color.value) {\n    const { r, g, b } = props.color.toRgb()\n    return `linear-gradient(to right, rgba(${r}, ${g}, ${b}, 0) 0%, rgba(${r}, ${g}, ${b}, 1) 100%)`\n  }\n  return ''\n}\n\ndefineExpose({\n  /**\n   * @description update alpha slider manually\n   * @type {Function}\n   */\n  update,\n  /**\n   * @description bar element ref\n   * @type {HTMLElement}\n   */\n  bar,\n  /**\n   * @description thumb element ref\n   * @type {HTMLElement}\n   */\n  thumb,\n})\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":"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"}
+{"version":3,"file":"alpha-slider.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/alpha-slider.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\">\n    <div ref=\"bar\" :class=\"barKls\" :style=\"barStyle\" @click=\"handleClick\" />\n    <div\n      ref=\"thumb\"\n      :class=\"thumbKls\"\n      :style=\"thumbStyle\"\n      :aria-label=\"ariaLabel\"\n      :aria-valuenow=\"currentValue\"\n      :aria-valuetext=\"ariaValuetext\"\n      :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n      :aria-valuemin=\"minValue\"\n      :aria-valuemax=\"maxValue\"\n      role=\"slider\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-disabled=\"disabled\"\n      @keydown=\"handleKeydown\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { useSlider, useSliderDOM } from '../composables/use-slider'\n\nimport type { AlphaSliderProps } from '../props/slider'\n\ndefineOptions({\n  name: 'ElColorAlphaSlider',\n})\n\nconst props = defineProps<AlphaSliderProps>()\nconst minValue = 0\nconst maxValue = 100\n\nconst { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } =\n  useSlider(props, { key: 'alpha', minValue, maxValue })\n\nconst { rootKls, barKls, barStyle, thumbKls, thumbStyle, update } =\n  useSliderDOM(props, {\n    namespace: 'color-alpha-slider',\n    maxValue,\n    currentValue,\n    bar,\n    thumb,\n    handleDrag,\n    getBackground,\n  })\n\nconst { t } = useLocale()\n\nconst ariaLabel = computed(() => t('el.colorpicker.alphaLabel'))\nconst ariaValuetext = computed(() => {\n  return t('el.colorpicker.alphaDescription', {\n    alpha: currentValue.value,\n    color: props.color.value,\n  })\n})\n\nfunction getBackground() {\n  if (props.color && props.color.value) {\n    const { r, g, b } = props.color.toRgb()\n    return `linear-gradient(to right, rgba(${r}, ${g}, ${b}, 0) 0%, rgba(${r}, ${g}, ${b}, 1) 100%)`\n  }\n  return ''\n}\n\ndefineExpose({\n  /**\n   * @description update alpha slider manually\n   * @type {Function}\n   */\n  update,\n  /**\n   * @description bar element ref\n   * @type {HTMLElement}\n   */\n  bar,\n  /**\n   * @description thumb element ref\n   * @type {HTMLElement}\n   */\n  thumb,\n})\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":"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"}

package/es/components/color-picker-panel/src/components/hue-slider.vue2.mjs

@@ -1,3 +1,4 @@
+import { hueSliderProps } from '../props/slider.mjs';
 import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, normalizeStyle } from 'vue';
 import { useSlider, useSliderDOM } from '../composables/use-slider.mjs';
 import { useLocale } from '../../../../hooks/use-locale/index.mjs';
@@ -10,11 +11,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     name: "ElColorHueSlider"
   },
   __name: "hue-slider",
-  props: {
-    color: { type: Object, required: true },
-    vertical: { type: Boolean, required: false },
-    disabled: { type: Boolean, required: false }
-  },
+  props: hueSliderProps,
   setup(__props, { expose: __expose }) {
     const props = __props;
     const { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } = useSlider(props, { key: "hue", minValue, maxValue });

package/es/components/color-picker-panel/src/components/hue-slider.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"hue-slider.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/hue-slider.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\">\n    <div ref=\"bar\" :class=\"barKls\" @click=\"handleClick\" />\n    <div\n      ref=\"thumb\"\n      :class=\"thumbKls\"\n      :style=\"thumbStyle\"\n      :aria-label=\"ariaLabel\"\n      :aria-valuenow=\"currentValue\"\n      :aria-valuetext=\"ariaValuetext\"\n      :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n      :aria-valuemin=\"minValue\"\n      :aria-valuemax=\"maxValue\"\n      role=\"slider\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-disabled=\"disabled\"\n      @keydown=\"handleKeydown\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { useSlider, useSliderDOM } from '../composables/use-slider'\n\nimport type { HueSliderProps } from '../props/slider'\n\ndefineOptions({\n  name: 'ElColorHueSlider',\n})\n\nconst props = defineProps<HueSliderProps>()\nconst minValue = 0\nconst maxValue = 360\n\nconst { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } =\n  useSlider(props, { key: 'hue', minValue, maxValue })\n\nconst { rootKls, barKls, thumbKls, thumbStyle, thumbTop, update } =\n  useSliderDOM(props, {\n    namespace: 'color-hue-slider',\n    maxValue,\n    currentValue,\n    bar,\n    thumb,\n    handleDrag,\n  })\n\nconst { t } = useLocale()\n\nconst ariaLabel = computed(() => t('el.colorpicker.hueLabel'))\nconst ariaValuetext = computed(() => {\n  return t('el.colorpicker.hueDescription', {\n    hue: currentValue.value,\n    color: props.color.value,\n  })\n})\n\ndefineExpose({\n  /**\n   * @description bar element ref\n   */\n  bar,\n  /**\n   * @description thumb element ref\n   */\n  thumb,\n  /**\n   * @description thumb top position, only for vertical slider\n   */\n  thumbTop,\n  /**\n   * @description update hue slider manually\n   */\n  update,\n})\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":";;;;;AAiCA,MAAM,QAAA,GAAW,CAAA;AACjB,MAAM,QAAA,GAAW,GAAA;;;;;;;;;;;;AAFjB,IAAA,MAAM,KAAA,GAAQ,OAAA;AAId,IAAA,MAAM,EAAE,YAAA,EAAc,GAAA,EAAK,KAAA,EAAO,YAAY,WAAA,EAAa,aAAA,EAAc,GACvE,SAAA,CAAU,OAAO,EAAE,GAAA,EAAK,KAAA,EAAO,QAAA,EAAU,UAAU,CAAA;AAErD,IAAA,MAAM,EAAE,SAAS,MAAA,EAAQ,QAAA,EAAU,YAAY,QAAA,EAAU,MAAA,EAAO,GAC9D,YAAA,CAAa,KAAA,EAAO;AAAA,MAClB,SAAA,EAAW,kBAAA;AAAA,MACX,QAAA;AAAA,MACA,YAAA;AAAA,MACA,GAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACD,CAAA;AAEH,IAAA,MAAM,EAAE,CAAA,EAAE,GAAI,SAAA,EAAU;AAExB,IAAA,MAAM,SAAA,GAAY,QAAA,CAAS,MAAM,CAAA,CAAE,yBAAyB,CAAC,CAAA;AAC7D,IAAA,MAAM,aAAA,GAAgB,SAAS,MAAM;AACnC,MAAA,OAAO,EAAE,+BAAA,EAAiC;AAAA,QACxC,KAAK,YAAA,CAAa,KAAA;AAAA,QAClB,KAAA,EAAO,MAAM,KAAA,CAAM;AAAA,OACpB,CAAA;AAAA,IACH,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA;AAAA;AAAA;AAAA,MAIX,GAAA;AAAA;AAAA;AAAA;AAAA,MAIA,KAAA;AAAA;AAAA;AAAA;AAAA,MAIA,QAAA;AAAA;AAAA;AAAA;AAAA,MAIA;AAAA,KACD,CAAA;;0BA3ECA,kBAAA;AAAA,QAiBM,KAAA;AAAA,QAAA;AAAA,UAjBA,KAAA,iBAAOC,KAAA,CAAA,OAAA,CAAO;AAAA;;UAClBC,kBAAA;AAAA,YAAsD,KAAA;AAAA,YAAA;AAAA,uBAA7C,KAAA;AAAA,cAAJ,GAAA,EAAI,GAAA;AAAA,cAAO,KAAA,iBAAOD,KAAA,CAAA,MAAA,CAAM,CAAA;AAAA,cAAG,OAAA,EAAK,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,2BAAEA,KAAA,CAAA,WAAA,KAAAA,KAAA,CAAA,WAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;;;;UACvCC,mBAcE,KAAA,EAAA;AAAA,qBAbI,OAAA;AAAA,YAAJ,GAAA,EAAI,KAAA;AAAA,YACH,KAAA,iBAAOD,KAAA,CAAA,QAAA,CAAQ,CAAA;AAAA,YACf,KAAA,iBAAOA,KAAA,CAAA,UAAA,CAAU,CAAA;AAAA,YACjB,cAAY,SAAA,CAAA,KAAA;AAAA,YACZ,eAAA,EAAeA,MAAA,YAAA,CAAA;AAAA,YACf,kBAAgB,aAAA,CAAA,KAAA;AAAA,YAChB,kBAAA,EAAkB,OAAA,CAAA,QAAA,GAAQ,UAAA,GAAA,YAAA;AAAA,YAC1B,eAAA,EAAe,QAAA;AAAA,YACf,eAAA,EAAe,QAAA;AAAA,YAChB,IAAA,EAAK,QAAA;AAAA,YACJ,QAAA,EAAU,OAAA,CAAA,QAAA,GAAW,MAAA,GAAS,CAAA;AAAA,YAC9B,iBAAe,OAAA,CAAA,QAAA;AAAA,YACf,SAAA,EAAO,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,yBAAEA,KAAA,CAAA,aAAA,KAAAA,KAAA,CAAA,aAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;;;;;;;;;;"}
+{"version":3,"file":"hue-slider.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/hue-slider.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\">\n    <div ref=\"bar\" :class=\"barKls\" @click=\"handleClick\" />\n    <div\n      ref=\"thumb\"\n      :class=\"thumbKls\"\n      :style=\"thumbStyle\"\n      :aria-label=\"ariaLabel\"\n      :aria-valuenow=\"currentValue\"\n      :aria-valuetext=\"ariaValuetext\"\n      :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n      :aria-valuemin=\"minValue\"\n      :aria-valuemax=\"maxValue\"\n      role=\"slider\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-disabled=\"disabled\"\n      @keydown=\"handleKeydown\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { useSlider, useSliderDOM } from '../composables/use-slider'\n\nimport type { HueSliderProps } from '../props/slider'\n\ndefineOptions({\n  name: 'ElColorHueSlider',\n})\n\nconst props = defineProps<HueSliderProps>()\nconst minValue = 0\nconst maxValue = 360\n\nconst { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } =\n  useSlider(props, { key: 'hue', minValue, maxValue })\n\nconst { rootKls, barKls, thumbKls, thumbStyle, thumbTop, update } =\n  useSliderDOM(props, {\n    namespace: 'color-hue-slider',\n    maxValue,\n    currentValue,\n    bar,\n    thumb,\n    handleDrag,\n  })\n\nconst { t } = useLocale()\n\nconst ariaLabel = computed(() => t('el.colorpicker.hueLabel'))\nconst ariaValuetext = computed(() => {\n  return t('el.colorpicker.hueDescription', {\n    hue: currentValue.value,\n    color: props.color.value,\n  })\n})\n\ndefineExpose({\n  /**\n   * @description bar element ref\n   */\n  bar,\n  /**\n   * @description thumb element ref\n   */\n  thumb,\n  /**\n   * @description thumb top position, only for vertical slider\n   */\n  thumbTop,\n  /**\n   * @description update hue slider manually\n   */\n  update,\n})\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":";;;;;;AAiCA,MAAM,QAAA,GAAW,CAAA;AACjB,MAAM,QAAA,GAAW,GAAA;;;;;;;;AAFjB,IAAA,MAAM,KAAA,GAAQ,OAAA;AAId,IAAA,MAAM,EAAE,YAAA,EAAc,GAAA,EAAK,KAAA,EAAO,YAAY,WAAA,EAAa,aAAA,EAAc,GACvE,SAAA,CAAU,OAAO,EAAE,GAAA,EAAK,KAAA,EAAO,QAAA,EAAU,UAAU,CAAA;AAErD,IAAA,MAAM,EAAE,SAAS,MAAA,EAAQ,QAAA,EAAU,YAAY,QAAA,EAAU,MAAA,EAAO,GAC9D,YAAA,CAAa,KAAA,EAAO;AAAA,MAClB,SAAA,EAAW,kBAAA;AAAA,MACX,QAAA;AAAA,MACA,YAAA;AAAA,MACA,GAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACD,CAAA;AAEH,IAAA,MAAM,EAAE,CAAA,EAAE,GAAI,SAAA,EAAU;AAExB,IAAA,MAAM,SAAA,GAAY,QAAA,CAAS,MAAM,CAAA,CAAE,yBAAyB,CAAC,CAAA;AAC7D,IAAA,MAAM,aAAA,GAAgB,SAAS,MAAM;AACnC,MAAA,OAAO,EAAE,+BAAA,EAAiC;AAAA,QACxC,KAAK,YAAA,CAAa,KAAA;AAAA,QAClB,KAAA,EAAO,MAAM,KAAA,CAAM;AAAA,OACpB,CAAA;AAAA,IACH,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA;AAAA;AAAA;AAAA,MAIX,GAAA;AAAA;AAAA;AAAA;AAAA,MAIA,KAAA;AAAA;AAAA;AAAA;AAAA,MAIA,QAAA;AAAA;AAAA;AAAA;AAAA,MAIA;AAAA,KACD,CAAA;;0BA3ECA,kBAAA;AAAA,QAiBM,KAAA;AAAA,QAAA;AAAA,UAjBA,KAAA,iBAAOC,KAAA,CAAA,OAAA,CAAO;AAAA;;UAClBC,kBAAA;AAAA,YAAsD,KAAA;AAAA,YAAA;AAAA,uBAA7C,KAAA;AAAA,cAAJ,GAAA,EAAI,GAAA;AAAA,cAAO,KAAA,iBAAOD,KAAA,CAAA,MAAA,CAAM,CAAA;AAAA,cAAG,OAAA,EAAK,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,2BAAEA,KAAA,CAAA,WAAA,KAAAA,KAAA,CAAA,WAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;;;;UACvCC,mBAcE,KAAA,EAAA;AAAA,qBAbI,OAAA;AAAA,YAAJ,GAAA,EAAI,KAAA;AAAA,YACH,KAAA,iBAAOD,KAAA,CAAA,QAAA,CAAQ,CAAA;AAAA,YACf,KAAA,iBAAOA,KAAA,CAAA,UAAA,CAAU,CAAA;AAAA,YACjB,cAAY,SAAA,CAAA,KAAA;AAAA,YACZ,eAAA,EAAeA,MAAA,YAAA,CAAA;AAAA,YACf,kBAAgB,aAAA,CAAA,KAAA;AAAA,YAChB,kBAAA,EAAkB,OAAA,CAAA,QAAA,GAAQ,UAAA,GAAA,YAAA;AAAA,YAC1B,eAAA,EAAe,QAAA;AAAA,YACf,eAAA,EAAe,QAAA;AAAA,YAChB,IAAA,EAAK,QAAA;AAAA,YACJ,QAAA,EAAU,OAAA,CAAA,QAAA,GAAW,MAAA,GAAS,CAAA;AAAA,YAC9B,iBAAe,OAAA,CAAA,QAAA;AAAA,YACf,SAAA,EAAO,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,yBAAEA,KAAA,CAAA,aAAA,KAAAA,KAAA,CAAA,aAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;;;;;;;;;;"}

package/es/components/color-picker-panel/src/components/predefine.vue2.mjs

@@ -1,3 +1,4 @@
+import { predefineProps } from '../props/predefine.mjs';
 import { defineComponent, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, Fragment, renderList, normalizeStyle } from 'vue';
 import { usePredefine, usePredefineDOM } from '../composables/use-predefine.mjs';
 import { useLocale } from '../../../../hooks/use-locale/index.mjs';
@@ -8,12 +9,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     name: "ElColorPredefine"
   },
   __name: "predefine",
-  props: {
-    colors: { type: Array, required: true },
-    color: { type: Object, required: true },
-    enableAlpha: { type: Boolean, required: true },
-    disabled: { type: Boolean, required: false }
-  },
+  props: predefineProps,
   setup(__props) {
     const props = __props;
     const { rgbaColors, handleSelect } = usePredefine(props);

package/es/components/color-picker-panel/src/components/predefine.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"predefine.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/predefine.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\">\n    <div :class=\"colorsKls\">\n      <button\n        v-for=\"(item, index) in rgbaColors\"\n        :key=\"colors[index]\"\n        type=\"button\"\n        :disabled=\"disabled\"\n        :aria-label=\"ariaLabel(item.value)\"\n        :class=\"colorSelectorKls(item)\"\n        @click=\"handleSelect(index)\"\n      >\n        <div :style=\"{ backgroundColor: item.value }\" />\n      </button>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { usePredefine, usePredefineDOM } from '../composables/use-predefine'\nimport { useLocale } from '@element-plus/hooks/use-locale'\n\nimport type { PredefineProps } from '../props/predefine'\n\ndefineOptions({\n  name: 'ElColorPredefine',\n})\n\nconst props = defineProps<PredefineProps>()\n\nconst { rgbaColors, handleSelect } = usePredefine(props)\nconst { rootKls, colorsKls, colorSelectorKls } = usePredefineDOM(props)\nconst { t } = useLocale()\n\nconst ariaLabel = (value: string) => {\n  return t('el.colorpicker.predefineDescription', { value })\n}\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode","_openBlock","_Fragment","_renderList","_normalizeClass","_normalizeStyle"],"mappings":";;;;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAEd,IAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,aAAa,KAAK,CAAA;AACvD,IAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,gBAAA,EAAiB,GAAI,gBAAgB,KAAK,CAAA;AACtE,IAAA,MAAM,EAAE,CAAA,EAAE,GAAI,SAAA,EAAU;AAExB,IAAA,MAAM,SAAA,GAAY,CAAC,KAAA,KAAkB;AACnC,MAAA,OAAO,CAAA,CAAE,qCAAA,EAAuC,EAAE,KAAA,EAAO,CAAA;AAAA,IAC3D,CAAA;;0BAnCEA,kBAAA;AAAA,QAcM,KAAA;AAAA,QAAA;AAAA,UAdA,KAAA,iBAAOC,KAAA,CAAA,OAAA,CAAO;AAAA;;UAClBC,kBAAA;AAAA,YAYM,KAAA;AAAA,YAAA;AAAA,cAZA,KAAA,iBAAOD,KAAA,CAAA,SAAA,CAAS;AAAA;;eACpBE,SAAA,CAAA,IAAA,CAAA,EAAAH,kBAAA;AAAA,gBAUSI,QAAA;AAAA,gBAAA,IAAA;AAAA,gBAAAC,WATiBJ,KAAA,CAAA,UAAA,CAAA,EAAU,CAA1B,MAAM,KAAA,KAAK;sCADrBD,kBAAA,CAUS,QAAA,EAAA;AAAA,oBARN,GAAA,EAAK,OAAA,CAAA,MAAA,CAAO,KAAK,CAAA;AAAA,oBAClB,IAAA,EAAK,QAAA;AAAA,oBACJ,UAAU,OAAA,CAAA,QAAA;AAAA,oBACV,YAAA,EAAY,SAAA,CAAU,IAAA,CAAK,KAAK,CAAA;AAAA,oBAChC,OAAKM,cAAA,CAAEL,KAAA,CAAA,gBAAA,CAAA,CAAiB,IAAI,CAAA,CAAA;AAAA,oBAC5B,SAAK,CAAA,MAAA,KAAEA,KAAA,CAAA,YAAA,EAAa,KAAK;AAAA;oBAE1BC,kBAAA;AAAA,sBAAgD,KAAA;AAAA,sBAAA;AAAA,wBAA1C,OAAKK,cAAA,CAAA,EAAA,eAAA,EAAqB,IAAA,CAAK,OAAK;AAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"predefine.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/predefine.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\">\n    <div :class=\"colorsKls\">\n      <button\n        v-for=\"(item, index) in rgbaColors\"\n        :key=\"colors[index]\"\n        type=\"button\"\n        :disabled=\"disabled\"\n        :aria-label=\"ariaLabel(item.value)\"\n        :class=\"colorSelectorKls(item)\"\n        @click=\"handleSelect(index)\"\n      >\n        <div :style=\"{ backgroundColor: item.value }\" />\n      </button>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { usePredefine, usePredefineDOM } from '../composables/use-predefine'\nimport { useLocale } from '@element-plus/hooks/use-locale'\n\nimport type { PredefineProps } from '../props/predefine'\n\ndefineOptions({\n  name: 'ElColorPredefine',\n})\n\nconst props = defineProps<PredefineProps>()\n\nconst { rgbaColors, handleSelect } = usePredefine(props)\nconst { rootKls, colorsKls, colorSelectorKls } = usePredefineDOM(props)\nconst { t } = useLocale()\n\nconst ariaLabel = (value: string) => {\n  return t('el.colorpicker.predefineDescription', { value })\n}\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode","_openBlock","_Fragment","_renderList","_normalizeClass","_normalizeStyle"],"mappings":";;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAEd,IAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,aAAa,KAAK,CAAA;AACvD,IAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,gBAAA,EAAiB,GAAI,gBAAgB,KAAK,CAAA;AACtE,IAAA,MAAM,EAAE,CAAA,EAAE,GAAI,SAAA,EAAU;AAExB,IAAA,MAAM,SAAA,GAAY,CAAC,KAAA,KAAkB;AACnC,MAAA,OAAO,CAAA,CAAE,qCAAA,EAAuC,EAAE,KAAA,EAAO,CAAA;AAAA,IAC3D,CAAA;;0BAnCEA,kBAAA;AAAA,QAcM,KAAA;AAAA,QAAA;AAAA,UAdA,KAAA,iBAAOC,KAAA,CAAA,OAAA,CAAO;AAAA;;UAClBC,kBAAA;AAAA,YAYM,KAAA;AAAA,YAAA;AAAA,cAZA,KAAA,iBAAOD,KAAA,CAAA,SAAA,CAAS;AAAA;;eACpBE,SAAA,CAAA,IAAA,CAAA,EAAAH,kBAAA;AAAA,gBAUSI,QAAA;AAAA,gBAAA,IAAA;AAAA,gBAAAC,WATiBJ,KAAA,CAAA,UAAA,CAAA,EAAU,CAA1B,MAAM,KAAA,KAAK;sCADrBD,kBAAA,CAUS,QAAA,EAAA;AAAA,oBARN,GAAA,EAAK,OAAA,CAAA,MAAA,CAAO,KAAK,CAAA;AAAA,oBAClB,IAAA,EAAK,QAAA;AAAA,oBACJ,UAAU,OAAA,CAAA,QAAA;AAAA,oBACV,YAAA,EAAY,SAAA,CAAU,IAAA,CAAK,KAAK,CAAA;AAAA,oBAChC,OAAKM,cAAA,CAAEL,KAAA,CAAA,gBAAA,CAAA,CAAiB,IAAI,CAAA,CAAA;AAAA,oBAC5B,SAAK,CAAA,MAAA,KAAEA,KAAA,CAAA,YAAA,EAAa,KAAK;AAAA;oBAE1BC,kBAAA;AAAA,sBAAgD,KAAA;AAAA,sBAAA;AAAA,wBAA1C,OAAKK,cAAA,CAAA,EAAA,eAAA,EAAqB,IAAA,CAAK,OAAK;AAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/color-picker-panel/src/components/sv-panel.vue2.mjs

@@ -1,3 +1,4 @@
+import { svPanelProps } from '../props/sv-panel.mjs';
 import { defineComponent, computed, createElementBlock, openBlock, unref, normalizeStyle, normalizeClass, createElementVNode } from 'vue';
 import { useLocale } from '../../../../hooks/use-locale/index.mjs';
 import { useSvPanel, useSvPanelDOM } from '../composables/use-sv-panel.mjs';
@@ -8,10 +9,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     name: "ElSvPanel"
   },
   __name: "sv-panel",
-  props: {
-    color: { type: Object, required: true },
-    disabled: { type: Boolean, required: false }
-  },
+  props: svPanelProps,
   setup(__props, { expose: __expose }) {
     const props = __props;
     const {

package/es/components/color-picker-panel/src/components/sv-panel.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sv-panel.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/sv-panel.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\" :style=\"rootStyle\" @click=\"handleClick\">\n    <div\n      ref=\"cursorRef\"\n      :class=\"cursorKls\"\n      :style=\"cursorStyle\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-disabled=\"disabled\"\n      role=\"slider\"\n      aria-valuemin=\"0,0\"\n      aria-valuemax=\"100,100\"\n      :aria-label=\"ariaLabel\"\n      :aria-valuenow=\"`${saturation},${brightness}`\"\n      :aria-valuetext=\"ariaValuetext\"\n      @keydown=\"handleKeydown\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useLocale } from '@element-plus/hooks/use-locale'\nimport { useSvPanel, useSvPanelDOM } from '../composables/use-sv-panel'\n\nimport type { SvPanelProps } from '../props/sv-panel'\n\ndefineOptions({\n  name: 'ElSvPanel',\n})\n\nconst props = defineProps<SvPanelProps>()\n\nconst {\n  cursorRef,\n  cursorTop,\n  cursorLeft,\n  background,\n  saturation,\n  brightness,\n  handleClick,\n  handleDrag,\n  handleKeydown,\n} = useSvPanel(props)\n\nconst { rootKls, cursorKls, rootStyle, cursorStyle, update } = useSvPanelDOM(\n  props,\n  {\n    cursorTop,\n    cursorLeft,\n    background,\n    handleDrag,\n  }\n)\n\nconst { t } = useLocale()\n\nconst ariaLabel = computed(() => t('el.colorpicker.svLabel'))\nconst ariaValuetext = computed(() => {\n  return t('el.colorpicker.svDescription', {\n    saturation: saturation.value,\n    brightness: brightness.value,\n    color: props.color.value,\n  })\n})\n\ndefineExpose({\n  /**\n   * @description update sv panel manually\n   */\n  update,\n})\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":";;;;;;;;;;;;;;;AA8BA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAEd,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF,GAAI,WAAW,KAAK,CAAA;AAEpB,IAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,SAAA,EAAW,WAAA,EAAa,QAAO,GAAI,aAAA;AAAA,MAC7D,KAAA;AAAA,MACA;AAAA,QACE,SAAA;AAAA,QACA,UAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,MAAM,EAAE,CAAA,EAAE,GAAI,SAAA,EAAU;AAExB,IAAA,MAAM,SAAA,GAAY,QAAA,CAAS,MAAM,CAAA,CAAE,wBAAwB,CAAC,CAAA;AAC5D,IAAA,MAAM,aAAA,GAAgB,SAAS,MAAM;AACnC,MAAA,OAAO,EAAE,8BAAA,EAAgC;AAAA,QACvC,YAAY,UAAA,CAAW,KAAA;AAAA,QACvB,YAAY,UAAA,CAAW,KAAA;AAAA,QACvB,KAAA,EAAO,MAAM,KAAA,CAAM;AAAA,OACpB,CAAA;AAAA,IACH,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA;AAAA;AAAA;AAAA,MAIX;AAAA,KACD,CAAA;;0BArECA,kBAAA;AAAA,QAeM,KAAA;AAAA,QAAA;AAAA,UAfA,KAAA,iBAAOC,KAAA,CAAA,OAAA,CAAO,CAAA;AAAA,UAAG,KAAA,iBAAOA,KAAA,CAAA,SAAA,CAAS,CAAA;AAAA,UAAG,OAAA,EAAK,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,uBAAEA,KAAA,CAAA,WAAA,KAAAA,KAAA,CAAA,WAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;UAC/CC,mBAaE,KAAA,EAAA;AAAA,qBAZI,WAAA;AAAA,YAAJ,GAAA,EAAI,SAAA;AAAA,YACH,KAAA,iBAAOD,KAAA,CAAA,SAAA,CAAS,CAAA;AAAA,YAChB,KAAA,iBAAOA,KAAA,CAAA,WAAA,CAAW,CAAA;AAAA,YAClB,QAAA,EAAU,OAAA,CAAA,QAAA,GAAW,MAAA,GAAS,CAAA;AAAA,YAC9B,iBAAe,OAAA,CAAA,QAAA;AAAA,YAChB,IAAA,EAAK,QAAA;AAAA,YACL,eAAA,EAAc,KAAA;AAAA,YACd,eAAA,EAAc,SAAA;AAAA,YACb,cAAY,SAAA,CAAA,KAAA;AAAA,YACZ,eAAA,EAAa,GAAKA,KAAA,CAAA,UAAA,CAAU,CAAA,CAAA,EAAIA,KAAA,CAAA,UAAA,CAAU,CAAA,CAAA;AAAA,YAC1C,kBAAgB,aAAA,CAAA,KAAA;AAAA,YAChB,SAAA,EAAO,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,yBAAEA,KAAA,CAAA,aAAA,KAAAA,KAAA,CAAA,aAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;;;;;;;;;;"}
+{"version":3,"file":"sv-panel.vue2.mjs","sources":["../../../../../../../packages/components/color-picker-panel/src/components/sv-panel.vue"],"sourcesContent":["<template>\n  <div :class=\"rootKls\" :style=\"rootStyle\" @click=\"handleClick\">\n    <div\n      ref=\"cursorRef\"\n      :class=\"cursorKls\"\n      :style=\"cursorStyle\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-disabled=\"disabled\"\n      role=\"slider\"\n      aria-valuemin=\"0,0\"\n      aria-valuemax=\"100,100\"\n      :aria-label=\"ariaLabel\"\n      :aria-valuenow=\"`${saturation},${brightness}`\"\n      :aria-valuetext=\"ariaValuetext\"\n      @keydown=\"handleKeydown\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useLocale } from '@element-plus/hooks/use-locale'\nimport { useSvPanel, useSvPanelDOM } from '../composables/use-sv-panel'\n\nimport type { SvPanelProps } from '../props/sv-panel'\n\ndefineOptions({\n  name: 'ElSvPanel',\n})\n\nconst props = defineProps<SvPanelProps>()\n\nconst {\n  cursorRef,\n  cursorTop,\n  cursorLeft,\n  background,\n  saturation,\n  brightness,\n  handleClick,\n  handleDrag,\n  handleKeydown,\n} = useSvPanel(props)\n\nconst { rootKls, cursorKls, rootStyle, cursorStyle, update } = useSvPanelDOM(\n  props,\n  {\n    cursorTop,\n    cursorLeft,\n    background,\n    handleDrag,\n  }\n)\n\nconst { t } = useLocale()\n\nconst ariaLabel = computed(() => t('el.colorpicker.svLabel'))\nconst ariaValuetext = computed(() => {\n  return t('el.colorpicker.svDescription', {\n    saturation: saturation.value,\n    brightness: brightness.value,\n    color: props.color.value,\n  })\n})\n\ndefineExpose({\n  /**\n   * @description update sv panel manually\n   */\n  update,\n})\n</script>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":";;;;;;;;;;;;;AA8BA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAEd,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF,GAAI,WAAW,KAAK,CAAA;AAEpB,IAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,SAAA,EAAW,WAAA,EAAa,QAAO,GAAI,aAAA;AAAA,MAC7D,KAAA;AAAA,MACA;AAAA,QACE,SAAA;AAAA,QACA,UAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,MAAM,EAAE,CAAA,EAAE,GAAI,SAAA,EAAU;AAExB,IAAA,MAAM,SAAA,GAAY,QAAA,CAAS,MAAM,CAAA,CAAE,wBAAwB,CAAC,CAAA;AAC5D,IAAA,MAAM,aAAA,GAAgB,SAAS,MAAM;AACnC,MAAA,OAAO,EAAE,8BAAA,EAAgC;AAAA,QACvC,YAAY,UAAA,CAAW,KAAA;AAAA,QACvB,YAAY,UAAA,CAAW,KAAA;AAAA,QACvB,KAAA,EAAO,MAAM,KAAA,CAAM;AAAA,OACpB,CAAA;AAAA,IACH,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA;AAAA;AAAA;AAAA,MAIX;AAAA,KACD,CAAA;;0BArECA,kBAAA;AAAA,QAeM,KAAA;AAAA,QAAA;AAAA,UAfA,KAAA,iBAAOC,KAAA,CAAA,OAAA,CAAO,CAAA;AAAA,UAAG,KAAA,iBAAOA,KAAA,CAAA,SAAA,CAAS,CAAA;AAAA,UAAG,OAAA,EAAK,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,uBAAEA,KAAA,CAAA,WAAA,KAAAA,KAAA,CAAA,WAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;UAC/CC,mBAaE,KAAA,EAAA;AAAA,qBAZI,WAAA;AAAA,YAAJ,GAAA,EAAI,SAAA;AAAA,YACH,KAAA,iBAAOD,KAAA,CAAA,SAAA,CAAS,CAAA;AAAA,YAChB,KAAA,iBAAOA,KAAA,CAAA,WAAA,CAAW,CAAA;AAAA,YAClB,QAAA,EAAU,OAAA,CAAA,QAAA,GAAW,MAAA,GAAS,CAAA;AAAA,YAC9B,iBAAe,OAAA,CAAA,QAAA;AAAA,YAChB,IAAA,EAAK,QAAA;AAAA,YACL,eAAA,EAAc,KAAA;AAAA,YACd,eAAA,EAAc,SAAA;AAAA,YACb,cAAY,SAAA,CAAA,KAAA;AAAA,YACZ,eAAA,EAAa,GAAKA,KAAA,CAAA,UAAA,CAAU,CAAA,CAAA,EAAIA,KAAA,CAAA,UAAA,CAAU,CAAA,CAAA;AAAA,YAC1C,kBAAgB,aAAA,CAAA,KAAA;AAAA,YAChB,SAAA,EAAO,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,yBAAEA,KAAA,CAAA,aAAA,KAAAA,KAAA,CAAA,aAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA;;;;;;;;;;;"}

package/es/components/countdown/src/countdown.vue2.mjs

@@ -1,6 +1,6 @@
+import { countdownEmits, countdownProps } from './countdown.mjs';
 import { defineComponent, ref, computed, onMounted, watch, onBeforeUnmount, createBlock, openBlock, unref, createSlots, renderList, withCtx, renderSlot } from 'vue';
 import { ElStatistic } from '../../statistic/index.mjs';
-import { countdownEmits } from './countdown.mjs';
 import { formatTime, getTime } from './utils.mjs';
 import { rAF, cAF } from '../../../utils/raf.mjs';
 import { CHANGE_EVENT } from '../../../constants/event.mjs';
@@ -10,14 +10,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     name: "ElCountdown"
   },
   __name: "countdown",
-  props: {
-    format: { type: String, required: false, default: "HH:mm:ss" },
-    prefix: { type: String, required: false },
-    suffix: { type: String, required: false },
-    title: { type: String, required: false },
-    value: { type: null, required: false, default: 0 },
-    valueStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true, default: void 0 }
-  },
+  props: countdownProps,
   emits: countdownEmits,
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;

package/es/components/countdown/src/countdown.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"countdown.vue2.mjs","sources":["../../../../../../packages/components/countdown/src/countdown.vue"],"sourcesContent":["<template>\n  <el-statistic\n    :value=\"rawValue\"\n    :title=\"title\"\n    :prefix=\"prefix\"\n    :suffix=\"suffix\"\n    :value-style=\"valueStyle\"\n    :formatter=\"formatter\"\n  >\n    <template v-for=\"(_, name) in $slots\" #[name]>\n      <slot :name=\"name\" />\n    </template>\n  </el-statistic>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'\nimport { ElStatistic } from '@element-plus/components/statistic'\nimport { cAF, rAF } from '@element-plus/utils'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport { countdownEmits } from './countdown'\nimport { formatTime, getTime } from './utils'\n\nimport type { CountdownProps } from './countdown'\n\ndefineOptions({\n  name: 'ElCountdown',\n})\nconst props = withDefaults(defineProps<CountdownProps>(), {\n  format: 'HH:mm:ss',\n  value: 0,\n  valueStyle: undefined,\n})\nconst emit = defineEmits(countdownEmits)\n\nlet timer: ReturnType<typeof rAF> | undefined\nconst rawValue = ref<number>(0)\nconst displayValue = computed(() => formatTime(rawValue.value, props.format))\n\nconst formatter = (val: number) => formatTime(val, props.format)\n\nconst stopTimer = () => {\n  if (timer) {\n    cAF(timer)\n    timer = undefined\n  }\n}\n\nconst startTimer = () => {\n  const timestamp = getTime(props.value)\n  const frameFunc = () => {\n    let diff = timestamp - Date.now()\n    emit(CHANGE_EVENT, diff)\n    if (diff <= 0) {\n      diff = 0\n      stopTimer()\n      emit('finish')\n    } else {\n      timer = rAF(frameFunc)\n    }\n    rawValue.value = diff\n  }\n  timer = rAF(frameFunc)\n}\n\nonMounted(() => {\n  rawValue.value = getTime(props.value) - Date.now()\n\n  watch(\n    () => [props.value, props.format],\n    () => {\n      stopTimer()\n      startTimer()\n    },\n    {\n      immediate: true,\n    }\n  )\n})\n\nonBeforeUnmount(() => {\n  stopTimer()\n})\n\ndefineExpose({\n  /**\n   * @description current display value\n   */\n  displayValue,\n})\n</script>\n"],"names":["_createBlock","_unref","$slots","_renderSlot"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAKd,IAAA,MAAM,IAAA,GAAO,MAAA;AAEb,IAAA,IAAI,KAAA;AACJ,IAAA,MAAM,QAAA,GAAW,IAAY,CAAC,CAAA;AAC9B,IAAA,MAAM,YAAA,GAAe,SAAS,MAAM,UAAA,CAAW,SAAS,KAAA,EAAO,KAAA,CAAM,MAAM,CAAC,CAAA;AAE5E,IAAA,MAAM,YAAY,CAAC,GAAA,KAAgB,UAAA,CAAW,GAAA,EAAK,MAAM,MAAM,CAAA;AAE/D,IAAA,MAAM,YAAY,MAAM;AACtB,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,GAAA,CAAI,KAAK,CAAA;AACT,QAAA,KAAA,GAAQ,MAAA;AAAA,MACV;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,aAAa,MAAM;AACvB,MAAA,MAAM,SAAA,GAAY,OAAA,CAAQ,KAAA,CAAM,KAAK,CAAA;AACrC,MAAA,MAAM,YAAY,MAAM;AACtB,QAAA,IAAI,IAAA,GAAO,SAAA,GAAY,IAAA,CAAK,GAAA,EAAI;AAChC,QAAA,IAAA,CAAK,cAAc,IAAI,CAAA;AACvB,QAAA,IAAI,QAAQ,CAAA,EAAG;AACb,UAAA,IAAA,GAAO,CAAA;AACP,UAAA,SAAA,EAAU;AACV,UAAA,IAAA,CAAK,QAAQ,CAAA;AAAA,QACf,CAAA,MAAO;AACL,UAAA,KAAA,GAAQ,IAAI,SAAS,CAAA;AAAA,QACvB;AACA,QAAA,QAAA,CAAS,KAAA,GAAQ,IAAA;AAAA,MACnB,CAAA;AACA,MAAA,KAAA,GAAQ,IAAI,SAAS,CAAA;AAAA,IACvB,CAAA;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,QAAA,CAAS,QAAQ,OAAA,CAAQ,KAAA,CAAM,KAAK,CAAA,GAAI,KAAK,GAAA,EAAI;AAEjD,MAAA,KAAA;AAAA,QACE,MAAM,CAAC,KAAA,CAAM,KAAA,EAAO,MAAM,MAAM,CAAA;AAAA,QAChC,MAAM;AACJ,UAAA,SAAA,EAAU;AACV,UAAA,UAAA,EAAW;AAAA,QACb,CAAA;AAAA,QACA;AAAA,UACE,SAAA,EAAW;AAAA;AACb,OACF;AAAA,IACF,CAAC,CAAA;AAED,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,SAAA,EAAU;AAAA,IACZ,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA;AAAA;AAAA;AAAA,MAIX;AAAA,KACD,CAAA;;0BAxFCA,WAAA,CAWeC,KAAA,CAAA,WAAA,CAAA,EAAA;AAAA,QAVZ,OAAO,QAAA,CAAA,KAAA;AAAA,QACP,OAAO,OAAA,CAAA,KAAA;AAAA,QACP,QAAQ,OAAA,CAAA,MAAA;AAAA,QACR,QAAQ,OAAA,CAAA,MAAA;AAAA,QACR,eAAa,OAAA,CAAA,UAAA;AAAA,QACb;AAAA;;;;mBAE6BC,IAAAA,CAAAA,MAAAA,EAAM,CAAlB,GAAG,IAAA,KAAI;;;wBACvB,MAAqB;AAAA,cAArBC,UAAA,CAAqB,IAAA,SAAR,IAAI;AAAA;;;;;;;;;;"}
+{"version":3,"file":"countdown.vue2.mjs","sources":["../../../../../../packages/components/countdown/src/countdown.vue"],"sourcesContent":["<template>\n  <el-statistic\n    :value=\"rawValue\"\n    :title=\"title\"\n    :prefix=\"prefix\"\n    :suffix=\"suffix\"\n    :value-style=\"valueStyle\"\n    :formatter=\"formatter\"\n  >\n    <template v-for=\"(_, name) in $slots\" #[name]>\n      <slot :name=\"name\" />\n    </template>\n  </el-statistic>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'\nimport { ElStatistic } from '@element-plus/components/statistic'\nimport { cAF, rAF } from '@element-plus/utils'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport { countdownEmits } from './countdown'\nimport { formatTime, getTime } from './utils'\n\nimport type { CountdownProps } from './countdown'\n\ndefineOptions({\n  name: 'ElCountdown',\n})\nconst props = withDefaults(defineProps<CountdownProps>(), {\n  format: 'HH:mm:ss',\n  value: 0,\n  valueStyle: undefined,\n})\nconst emit = defineEmits(countdownEmits)\n\nlet timer: ReturnType<typeof rAF> | undefined\nconst rawValue = ref<number>(0)\nconst displayValue = computed(() => formatTime(rawValue.value, props.format))\n\nconst formatter = (val: number) => formatTime(val, props.format)\n\nconst stopTimer = () => {\n  if (timer) {\n    cAF(timer)\n    timer = undefined\n  }\n}\n\nconst startTimer = () => {\n  const timestamp = getTime(props.value)\n  const frameFunc = () => {\n    let diff = timestamp - Date.now()\n    emit(CHANGE_EVENT, diff)\n    if (diff <= 0) {\n      diff = 0\n      stopTimer()\n      emit('finish')\n    } else {\n      timer = rAF(frameFunc)\n    }\n    rawValue.value = diff\n  }\n  timer = rAF(frameFunc)\n}\n\nonMounted(() => {\n  rawValue.value = getTime(props.value) - Date.now()\n\n  watch(\n    () => [props.value, props.format],\n    () => {\n      stopTimer()\n      startTimer()\n    },\n    {\n      immediate: true,\n    }\n  )\n})\n\nonBeforeUnmount(() => {\n  stopTimer()\n})\n\ndefineExpose({\n  /**\n   * @description current display value\n   */\n  displayValue,\n})\n</script>\n"],"names":["_createBlock","_unref","$slots","_renderSlot"],"mappings":";;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAKd,IAAA,MAAM,IAAA,GAAO,MAAA;AAEb,IAAA,IAAI,KAAA;AACJ,IAAA,MAAM,QAAA,GAAW,IAAY,CAAC,CAAA;AAC9B,IAAA,MAAM,YAAA,GAAe,SAAS,MAAM,UAAA,CAAW,SAAS,KAAA,EAAO,KAAA,CAAM,MAAM,CAAC,CAAA;AAE5E,IAAA,MAAM,YAAY,CAAC,GAAA,KAAgB,UAAA,CAAW,GAAA,EAAK,MAAM,MAAM,CAAA;AAE/D,IAAA,MAAM,YAAY,MAAM;AACtB,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,GAAA,CAAI,KAAK,CAAA;AACT,QAAA,KAAA,GAAQ,MAAA;AAAA,MACV;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,aAAa,MAAM;AACvB,MAAA,MAAM,SAAA,GAAY,OAAA,CAAQ,KAAA,CAAM,KAAK,CAAA;AACrC,MAAA,MAAM,YAAY,MAAM;AACtB,QAAA,IAAI,IAAA,GAAO,SAAA,GAAY,IAAA,CAAK,GAAA,EAAI;AAChC,QAAA,IAAA,CAAK,cAAc,IAAI,CAAA;AACvB,QAAA,IAAI,QAAQ,CAAA,EAAG;AACb,UAAA,IAAA,GAAO,CAAA;AACP,UAAA,SAAA,EAAU;AACV,UAAA,IAAA,CAAK,QAAQ,CAAA;AAAA,QACf,CAAA,MAAO;AACL,UAAA,KAAA,GAAQ,IAAI,SAAS,CAAA;AAAA,QACvB;AACA,QAAA,QAAA,CAAS,KAAA,GAAQ,IAAA;AAAA,MACnB,CAAA;AACA,MAAA,KAAA,GAAQ,IAAI,SAAS,CAAA;AAAA,IACvB,CAAA;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,QAAA,CAAS,QAAQ,OAAA,CAAQ,KAAA,CAAM,KAAK,CAAA,GAAI,KAAK,GAAA,EAAI;AAEjD,MAAA,KAAA;AAAA,QACE,MAAM,CAAC,KAAA,CAAM,KAAA,EAAO,MAAM,MAAM,CAAA;AAAA,QAChC,MAAM;AACJ,UAAA,SAAA,EAAU;AACV,UAAA,UAAA,EAAW;AAAA,QACb,CAAA;AAAA,QACA;AAAA,UACE,SAAA,EAAW;AAAA;AACb,OACF;AAAA,IACF,CAAC,CAAA;AAED,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,SAAA,EAAU;AAAA,IACZ,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA;AAAA;AAAA;AAAA,MAIX;AAAA,KACD,CAAA;;0BAxFCA,WAAA,CAWeC,KAAA,CAAA,WAAA,CAAA,EAAA;AAAA,QAVZ,OAAO,QAAA,CAAA,KAAA;AAAA,QACP,OAAO,OAAA,CAAA,KAAA;AAAA,QACP,QAAQ,OAAA,CAAA,MAAA;AAAA,QACR,QAAQ,OAAA,CAAA,MAAA;AAAA,QACR,eAAa,OAAA,CAAA,UAAA;AAAA,QACb;AAAA;;;;mBAE6BC,IAAAA,CAAAA,MAAAA,EAAM,CAAlB,GAAG,IAAA,KAAI;;;wBACvB,MAAqB;AAAA,cAArBC,UAAA,CAAqB,IAAA,SAAR,IAAI;AAAA;;;;;;;;;;"}

package/es/components/date-picker-panel/src/date-picker-com/panel-date-range.vue2.mjs

@@ -776,7 +776,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                             key: 0,
                             type: "button",
                             disabled: !enableYearArrow.value || unref(dateRangeDisabled),
-                            class: normalizeClass([unref(ppNs).e("icon-btn"), "d-arrow-left"]),
+                            class: normalizeClass([[
+                              unref(ppNs).e("icon-btn"),
+                              unref(ppNs).is("disabled", !enableYearArrow.value || unref(dateRangeDisabled))
+                            ], "d-arrow-left"]),
                             "aria-label": unref(t)(`el.datepicker.prevYear`),
                             onClick: rightPrevYear
                           }, [
@@ -794,7 +797,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                             key: 1,
                             type: "button",
                             disabled: !enableMonthArrow.value || unref(dateRangeDisabled),
-                            class: normalizeClass([unref(ppNs).e("icon-btn"), "arrow-left"]),
+                            class: normalizeClass([[
+                              unref(ppNs).e("icon-btn"),
+                              unref(ppNs).is("disabled", !enableMonthArrow.value || unref(dateRangeDisabled))
+                            ], "arrow-left"]),
                             "aria-label": unref(t)(`el.datepicker.prevMonth`),
                             onClick: rightPrevMonth
                           }, [