tdesign-react 0.31.2-alpha.1 → 0.31.2-alpha.2

package/esm/color-picker/components/panel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/color-picker/components/panel/index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, forwardRef, MutableRefObject } from 'react';\nimport classNames from 'classnames';\nimport useCommonClassName from '../../../_util/useCommonClassName';\nimport useDefault from '../../../_util/useDefault';\nimport { useLocaleReceiver } from '../../../locale/LocalReceiver';\nimport useClassname from '../../hooks/useClassname';\nimport PanelHeader from './header';\nimport Color, { getColorObject } from '../../../_common/js/color-picker/color';\nimport { GradientColorPoint } from '../../../_common/js/color-picker/gradient';\nimport {\n  DEFAULT_COLOR,\n  DEFAULT_LINEAR_GRADIENT,\n  TD_COLOR_USED_COLORS_MAX_SIZE,\n  DEFAULT_SYSTEM_SWATCH_COLORS,\n} from '../../const';\nimport { ColorPickerProps, TdColorModes, TdColorSaturationData } from '../../interface';\nimport { ColorPickerChangeTrigger, TdColorPickerProps } from '../../type';\nimport LinearGradient from './linear-gradient';\nimport SaturationPanel from './saturation';\nimport HUESlider from './hue';\nimport AlphaSlider from './alpha';\nimport FormatPanel from './format';\nimport SwatchesPanel from './swatches';\n\nconst Panel = forwardRef((props: ColorPickerProps, ref: MutableRefObject<HTMLDivElement>) => {\n  const baseClassName = useClassname();\n  const { STATUS } = useCommonClassName();\n  const [local, t] = useLocaleReceiver('colorPicker');\n  const {\n    disabled,\n    value,\n    defaultValue,\n    onChange,\n    enableAlpha = false,\n    format,\n    onPaletteBarChange,\n    swatchColors,\n    className,\n    style = {},\n    togglePopup,\n    closeBtn,\n    colorModes = ['linear-gradient', 'monochrome'],\n  } = props;\n  const [innerValue, setInnerValue] = useDefault(value, defaultValue, onChange);\n  const colorInstanceRef = useRef<Color>(new Color(innerValue || DEFAULT_COLOR));\n\n  useEffect(() => {\n    colorInstanceRef.current.update(defaultValue || DEFAULT_COLOR);\n  }, [defaultValue]);\n\n  const getmodeByColor = colorInstanceRef.current.isGradient ? 'linear-gradient' : 'monochrome';\n  const [mode, setMode] = useState<TdColorModes>('monochrome');\n\n  useEffect(() => {\n    if (colorModes.length === 1) {\n      setMode(colorModes[0]);\n    } else {\n      setMode(getmodeByColor);\n    }\n  }, [colorModes, getmodeByColor]);\n\n  const formatRef = useRef<TdColorPickerProps['format']>(colorInstanceRef.current.isGradient ? 'CSS' : 'RGB');\n\n  const { recentColors, defaultRecentColors, onRecentColorsChange } = props;\n  const [recentlyUsedColors, setRecentlyUsedColors] = useDefault(\n    recentColors,\n    defaultRecentColors,\n    onRecentColorsChange,\n  );\n\n  const baseProps = {\n    color: colorInstanceRef.current,\n    disabled,\n    baseClassName,\n  };\n\n  const handleModeChange = (value: TdColorModes) => {\n    setMode(value);\n    const { rgba, gradientColors, linearGradient } = colorInstanceRef.current;\n    if (value === 'linear-gradient') {\n      colorInstanceRef.current = new Color(gradientColors.length > 0 ? linearGradient : DEFAULT_LINEAR_GRADIENT);\n      return;\n    }\n    colorInstanceRef.current = new Color(rgba);\n  };\n\n  const formatValue = () => {\n    // 渐变模式下直接输出css样式\n    if (mode === 'linear-gradient') {\n      return colorInstanceRef.current.linearGradient;\n    }\n\n    return colorInstanceRef.current.getFormatsColorMap()[format] || colorInstanceRef.current.css;\n  };\n\n  // 最近使用颜色变更时触发\n  const handleRecentlyUsedColorsChange = (colors: string[]) => {\n    setRecentlyUsedColors(colors);\n  };\n\n  // 添加最近使用颜色\n  const addRecentlyUsedColor = () => {\n    if (recentlyUsedColors === null || recentlyUsedColors === false) {\n      return;\n    }\n    const colors = [...((recentlyUsedColors as string[]) || [])];\n    const { isGradient, linearGradient, rgba } = colorInstanceRef.current;\n    const currentColor = isGradient ? linearGradient : rgba;\n    const index = colors.indexOf(currentColor);\n    if (index > -1) {\n      colors.splice(index, 1);\n    }\n    colors.unshift(currentColor);\n    if (colors.length > TD_COLOR_USED_COLORS_MAX_SIZE) {\n      colors.length = TD_COLOR_USED_COLORS_MAX_SIZE;\n    }\n    handleRecentlyUsedColorsChange(colors);\n  };\n\n  const emitColorChange = (trigger?: ColorPickerChangeTrigger) => {\n    setInnerValue(formatValue(), {\n      color: getColorObject(colorInstanceRef.current),\n      trigger: trigger || 'palette-saturation-brightness',\n    });\n  };\n\n  // 饱和度变化\n  const handleSaturationChange = ({ saturation, value }: TdColorSaturationData) => {\n    const { saturation: sat, value: val } = colorInstanceRef.current;\n    let changeTrigger: ColorPickerChangeTrigger = 'palette-saturation-brightness';\n    colorInstanceRef.current.saturation = saturation;\n    colorInstanceRef.current.value = value;\n\n    if (value !== val && saturation !== sat) {\n      changeTrigger = 'palette-saturation-brightness';\n    } else if (saturation !== sat) {\n      changeTrigger = 'palette-saturation';\n    } else if (value !== val) {\n      changeTrigger = 'palette-brightness';\n    } else {\n      return;\n    }\n    emitColorChange(changeTrigger);\n  };\n\n  // hue色相变化\n  const handleHUEChange = (hue: number) => {\n    colorInstanceRef.current.hue = hue;\n    emitColorChange('palette-hue-bar');\n    onPaletteBarChange?.({\n      color: getColorObject(colorInstanceRef.current),\n    });\n  };\n\n  /**\n   * 透明度变化\n   * @param alpha\n   */\n  const handleAlphaChange = (alpha: number) => {\n    colorInstanceRef.current.alpha = alpha;\n    emitColorChange('palette-alpha-bar');\n    onPaletteBarChange?.({\n      color: getColorObject(colorInstanceRef.current),\n    });\n  };\n\n  /**\n   * 渐变改变\n   * @param param0\n   */\n  const handleGradientChange = ({\n    key,\n    payload,\n  }: {\n    key: 'degree' | 'selectedId' | 'colors';\n    payload: number | string | GradientColorPoint[];\n    addUsedColor?: boolean;\n  }) => {\n    let trigger: ColorPickerChangeTrigger = 'palette-saturation-brightness';\n    switch (key) {\n      case 'degree':\n        colorInstanceRef.current.gradientDegree = payload as number;\n        trigger = 'input';\n        break;\n      case 'selectedId':\n        colorInstanceRef.current.gradientSelectedId = payload as string;\n        break;\n      case 'colors':\n        colorInstanceRef.current.gradientColors = payload as GradientColorPoint[];\n        break;\n    }\n    emitColorChange(trigger);\n  };\n\n  // format选择格式变化\n  const handleFormatModeChange = (format: TdColorPickerProps['format']) => (formatRef.current = format);\n\n  // format输入变化\n  const handleInputChange = (input: string, alpha?: number) => {\n    colorInstanceRef.current.update(input);\n    colorInstanceRef.current.alpha = alpha;\n    emitColorChange('input');\n  };\n\n  // 渲染预设颜色区域\n  const SwatchesArea = React.memo(() => {\n    // 最近使用颜色\n    const showUsedColors = recentColors !== null && recentColors !== false;\n    // 系统颜色\n    let systemColors = swatchColors;\n    if (systemColors === undefined) {\n      systemColors = [...DEFAULT_SYSTEM_SWATCH_COLORS];\n    }\n    const showSystemColors = systemColors?.length > 0;\n\n    if (!showSystemColors && !showUsedColors) {\n      return null;\n    }\n\n    // 色块点击\n    const handleSetColor = (value: string) => {\n      const isGradientValue = Color.isGradientColor(value);\n      const color = colorInstanceRef.current;\n      if (isGradientValue) {\n        if (colorModes.includes('linear-gradient')) {\n          setMode('linear-gradient');\n          color.update(value);\n          color.updateCurrentGradientColor();\n        } else {\n          console.warn('该模式不支持渐变色');\n        }\n      } else if (mode === 'linear-gradient') {\n        color.updateStates(value);\n        color.updateCurrentGradientColor();\n      } else {\n        color.update(value);\n      }\n      emitColorChange();\n    };\n\n    return (\n      <>\n        <div className={`${baseClassName}__swatches-wrap`}>\n          {showUsedColors && (\n            <SwatchesPanel\n              {...baseProps}\n              title={t(local.recentColorTitle)}\n              editable\n              handleAddColor={addRecentlyUsedColor}\n              colors={recentlyUsedColors as string[]}\n              onSetColor={(color: string) => handleSetColor(color)}\n              onChange={handleRecentlyUsedColorsChange}\n            />\n          )}\n          {showSystemColors && (\n            <SwatchesPanel\n              {...baseProps}\n              title={t(local.swatchColorTitle)}\n              colors={systemColors}\n              onSetColor={(color: string) => handleSetColor(color)}\n            />\n          )}\n        </div>\n      </>\n    );\n  });\n\n  return (\n    <div\n      className={classNames(`${baseClassName}__panel`, disabled ? STATUS.disabled : false, className)}\n      onClick={(e) => e.stopPropagation()}\n      style={{ ...style }}\n      ref={ref}\n    >\n      <PanelHeader\n        baseClassName={baseClassName}\n        mode={mode}\n        colorModes={colorModes}\n        closeBtn={closeBtn}\n        togglePopup={togglePopup}\n        onModeChange={handleModeChange}\n      />\n      <div className={`${baseClassName}__body`}>\n        {mode === 'linear-gradient' && <LinearGradient {...baseProps} onChange={handleGradientChange} />}\n        <SaturationPanel {...baseProps} onChange={handleSaturationChange} />\n        <HUESlider {...baseProps} onChange={handleHUEChange} />\n        {enableAlpha && <AlphaSlider {...baseProps} onChange={handleAlphaChange} />}\n        <FormatPanel\n          {...props}\n          {...baseProps}\n          format={formatRef.current}\n          onModeChange={handleFormatModeChange}\n          onInputChange={handleInputChange}\n        />\n        <SwatchesArea />\n      </div>\n    </div>\n  );\n});\n\nexport default React.memo(Panel);\n"],"names":["Panel","forwardRef","props","ref","baseClassName","useClassname","useCommonClassName","STATUS","useLocaleReceiver","local","t","disabled","value","defaultValue","onChange","enableAlpha","format","onPaletteBarChange","swatchColors","className","style","togglePopup","closeBtn","colorModes","useDefault","innerValue","setInnerValue","colorInstanceRef","useRef","Color","DEFAULT_COLOR","useEffect","current","update","getmodeByColor","isGradient","useState","mode","setMode","length","formatRef","recentColors","defaultRecentColors","onRecentColorsChange","recentlyUsedColors","setRecentlyUsedColors","baseProps","color","handleModeChange","value2","rgba","gradientColors","linearGradient","DEFAULT_LINEAR_GRADIENT","formatValue","getFormatsColorMap","css","handleRecentlyUsedColorsChange","colors","addRecentlyUsedColor","currentColor","index","indexOf","splice","unshift","TD_COLOR_USED_COLORS_MAX_SIZE","emitColorChange","trigger","getColorObject","handleSaturationChange","saturation","sat","val","changeTrigger","handleHUEChange","hue","handleAlphaChange","alpha","handleGradientChange","key","payload","gradientDegree","gradientSelectedId","handleFormatModeChange","format2","handleInputChange","input","SwatchesArea","React","memo","showUsedColors","systemColors","DEFAULT_SYSTEM_SWATCH_COLORS","showSystemColors","handleSetColor","isGradientValue","isGradientColor","includes","updateCurrentGradientColor","console","warn","updateStates","createElement","Fragment","SwatchesPanel","title","recentColorTitle","editable","handleAddColor","onSetColor","swatchColorTitle","classNames","onClick","e","stopPropagation","PanelHeader","onModeChange","LinearGradient","SaturationPanel","HUESlider","AlphaSlider","FormatPanel","onInputChange"],"mappings":"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"}

package/esm/color-picker/components/panel/linear-gradient.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<(props: any) => JSX.Element>;
+export default _default;

package/esm/color-picker/components/panel/linear-gradient.js

@@ -0,0 +1,363 @@
+/**
+ * tdesign v0.31.1
+ * (c) 2022 tdesign
+ * @license MIT
+ */
+
+import { _ as _toConsumableArray } from '../../../_chunks/dep-3cf23cb4.js';
+import React, { useRef, useEffect, useCallback } from 'react';
+import { c as cloneDeep_1 } from '../../../_chunks/dep-9926d76f.js';
+import classNames from 'classnames';
+import useClassname from '../../hooks/useClassname.js';
+import { genGradientPoint, gradientColors2string } from '../../../_common/js/color-picker/color.js';
+import useCommonClassName from '../../../_util/useCommonClassName.js';
+import { GRADIENT_SLIDER_DEFAULT_WIDTH } from '../../const.js';
+import { InputNumber } from '../../../input-number/index.js';
+import '../../../_chunks/dep-85a9595a.js';
+import '../../../_chunks/dep-8702aba9.js';
+import '../../../_chunks/dep-cdbc448f.js';
+import '../../../_chunks/dep-e9e7c24f.js';
+import '../../../_chunks/dep-c47502ef.js';
+import '../../../_chunks/dep-3a2f4bdf.js';
+import '../../../_chunks/dep-d51fd958.js';
+import '../../../_chunks/dep-db8880c0.js';
+import '../../../_chunks/dep-8efaaac0.js';
+import '../../../_chunks/dep-d539b435.js';
+import '../../../_chunks/dep-2b0021c1.js';
+import '../../../_chunks/dep-09299e3f.js';
+import '../../../_chunks/dep-23b2574f.js';
+import '../../../_chunks/dep-a1403158.js';
+import '../../../_chunks/dep-c03c5f48.js';
+import '../../../_chunks/dep-9b67144e.js';
+import '../../../_chunks/dep-d038aaf3.js';
+import '../../../_chunks/dep-00728537.js';
+import '../../../_chunks/dep-32abd81f.js';
+import '../../../_chunks/dep-f3e5eb4b.js';
+import '../../../_chunks/dep-ae52f85e.js';
+import '../../../_chunks/dep-63ed508e.js';
+import '../../../_chunks/dep-155571ca.js';
+import '../../../_chunks/dep-d17dffc0.js';
+import '../../../_chunks/dep-6bf856c2.js';
+import '../../../_chunks/dep-d820193b.js';
+import '../../../_util/useConfig.js';
+import '../../../_chunks/dep-bbad8591.js';
+import '../../../_chunks/dep-1628aaec.js';
+import '../../../_chunks/dep-81670ae9.js';
+import '../../../locale/zh_CN.js';
+import '../../../_common/js/global-config/locale/zh_CN.js';
+import '../../../config-provider/zh_CN_config.js';
+import '../../../_chunks/dep-aca05d9d.js';
+import '../../../_chunks/dep-926c2765.js';
+import 'tinycolor2';
+import '../../../_common/js/color-picker/cmyk.js';
+import '../../../_common/js/color-picker/gradient.js';
+import '../../../input-number/InputNumber.js';
+import '../../../_chunks/dep-ea842483.js';
+import '../../../_util/useUpdateEffect.js';
+import '../../../_util/useLayoutEffect.js';
+import '../../../_util/dom.js';
+import 'raf';
+import '../../../_chunks/dep-c9e242b1.js';
+import '../../../_util/easing.js';
+import '../../../input-number/StepHandler.js';
+import 'tdesign-icons-react';
+import '../../../button/index.js';
+import '../../../button/Button.js';
+import '../../../_util/noop.js';
+import '../../../_util/useRipple.js';
+import '../../../_util/useAnimation.js';
+import '../../../_util/setStyle.js';
+import '../../../loading/index.js';
+import '../../../loading/Loading.js';
+import '../../../common/Portal.js';
+import 'react-dom';
+import '../../../loading/gradient.js';
+import '../../../_common/js/loading/circle-adapter.js';
+import '../../../_common/js/utils/set-style.js';
+import '../../../_common/js/utils/helper.js';
+import '../../../loading/plugin.js';
+import '../../../loading/style/index.js';
+import '../../../loading/type.js';
+import '../../../button/style/index.js';
+import '../../../button/type.js';
+import '../../../input-number/utils/numberUtils.js';
+import '../../../input/index.js';
+import '../../../input/Input.js';
+import '../../../_util/forwardRefWithStatics.js';
+import 'hoist-non-react-statics';
+import '../../../_util/helper.js';
+import '../../../_chunks/dep-e0790d2e.js';
+import '../../../_chunks/dep-020d9062.js';
+import '../../../_chunks/dep-fd1b4e24.js';
+import '../../../_chunks/dep-0d23bb2c.js';
+import '../../../_chunks/dep-db65b23a.js';
+import '../../../input/InputGroup.js';
+import '../../../_util/useDefaultValue.js';
+import '../../../_util/useDefault.js';
+import '../../../locale/LocalReceiver.js';
+import '../../../config-provider/index.js';
+import '../../../config-provider/ConfigProvider.js';
+import '../../../input/style/index.js';
+import '../../../input/type.js';
+import '../../../input-number/style/index.js';
+import '../../../input-number/type.js';
+
+var DELETE_KEYS = ["delete", "backspace"];
+
+var LinearGradient = function LinearGradient(props) {
+  var onChange = props.onChange,
+      color = props.color,
+      disabled = props.disabled;
+  var baseClassName = useClassname();
+
+  var _useCommonClassName = useCommonClassName(),
+      statusClassNames = _useCommonClassName.STATUS;
+
+  var refSlider = useRef(null);
+  var sliderRectRef = useRef({
+    left: 0,
+    width: GRADIENT_SLIDER_DEFAULT_WIDTH
+  });
+  var isDragging = useRef(false);
+  var isMoved = useRef(false);
+  var degree = useRef(props.color.gradientDegree);
+  var selectedId = useRef(props.color.gradientSelectedId);
+  var colors = useRef(cloneDeep_1(color.gradientColors));
+  useEffect(function () {
+    degree.current = color === null || color === void 0 ? void 0 : color.gradientDegree;
+    selectedId.current = color.gradientSelectedId;
+    colors.current = cloneDeep_1(color.gradientColors);
+  }, [color]);
+
+  var updateSliderRect = function updateSliderRect() {
+    var rect = refSlider.current.getBoundingClientRect();
+    sliderRectRef.current = {
+      left: rect.left,
+      width: rect.width || GRADIENT_SLIDER_DEFAULT_WIDTH
+    };
+  };
+
+  var handleChange = useCallback(function (key, payload, addUsedColor) {
+    if (disabled) {
+      return;
+    }
+
+    onChange({
+      key: key,
+      payload: payload,
+      addUsedColor: addUsedColor
+    });
+  }, [onChange, disabled]);
+
+  var handleDegreeChange = function handleDegreeChange(value) {
+    if (props.disabled || value === props.color.gradientDegree) {
+      return;
+    }
+
+    degree.current = value;
+    handleChange("degree", value, true);
+  };
+
+  var handleSelectedIdChange = function handleSelectedIdChange(value) {
+    if (props.disabled) {
+      return;
+    }
+
+    selectedId.current = value;
+    handleChange("selectedId", value);
+  };
+
+  var handleColorsChange = useCallback(function (value, isEnded) {
+    if (props.disabled) {
+      return;
+    }
+
+    colors.current = value;
+    handleChange("colors", value, isEnded);
+  }, [props.disabled, handleChange]);
+  var updateActiveThumbLeft = useCallback(function (left) {
+    var index = colors.current.findIndex(function (c) {
+      return c.id === selectedId.current;
+    });
+
+    if (index === -1) {
+      return;
+    }
+
+    var point = colors.current[index];
+    var formatLeft = Math.max(0, Math.min(sliderRectRef.current.width, left));
+    var percentLeft = formatLeft / sliderRectRef.current.width * 100;
+    var newColors = colors.current.map(function (item, i) {
+      return index !== i ? item : {
+        color: point.color,
+        left: percentLeft,
+        id: point.id
+      };
+    });
+    handleColorsChange(newColors);
+  }, [handleColorsChange]);
+
+  var handleStart = function handleStart(id, e) {
+    if (isDragging.current || props.disabled) {
+      return;
+    }
+
+    isMoved.current = false;
+    isDragging.current = true;
+    e.preventDefault();
+    e.stopPropagation();
+    refSlider.current.focus();
+  };
+
+  var handleMove = useCallback(function (e) {
+    if (!isDragging.current || disabled) {
+      return;
+    }
+
+    var rect = refSlider.current.getBoundingClientRect();
+    var left = e.clientX - rect.x;
+    isMoved.current = true;
+    updateActiveThumbLeft(left);
+  }, [disabled, updateActiveThumbLeft]);
+  var handleEnd = useCallback(function () {
+    if (!isDragging.current) {
+      return;
+    }
+
+    setTimeout(function () {
+      isDragging.current = false;
+    }, 0);
+
+    if (isMoved.current) {
+      handleColorsChange(colors.current, true);
+      isMoved.current = false;
+    }
+  }, [handleColorsChange]);
+
+  var handleKeyup = function handleKeyup(e) {
+    if (props.disabled) {
+      return;
+    }
+
+    var points = _toConsumableArray(colors.current);
+
+    var pos = points.findIndex(function (c) {
+      return c.id === selectedId.current;
+    });
+    var length = points.length;
+
+    if (DELETE_KEYS.includes(e.key.toLocaleLowerCase()) && length > 2 && pos >= 0 && pos <= length - 1) {
+      points.splice(pos, 1);
+
+      if (!points[pos]) {
+        pos = points[pos + 1] ? pos + 1 : points[pos - 1] ? pos - 1 : 0;
+      }
+
+      var current = points[pos];
+      handleColorsChange(points, true);
+      handleSelectedIdChange(current === null || current === void 0 ? void 0 : current.id);
+    }
+  };
+
+  var handleThumbBarClick = function handleThumbBarClick(e) {
+    if (props.disabled) {
+      return;
+    }
+
+    updateSliderRect();
+    var left = e.clientX - sliderRectRef.current.left;
+    left = Math.max(0, Math.min(sliderRectRef.current.width, left));
+    var percentLeft = left / sliderRectRef.current.width * 100;
+    var newPoint = genGradientPoint(percentLeft, props.color.rgba);
+
+    var newColors = _toConsumableArray(colors.current);
+
+    newColors.push(newPoint);
+    handleColorsChange(newColors, true);
+    handleSelectedIdChange(newPoint.id);
+  };
+
+  useEffect(function () {
+    updateSliderRect();
+    window.addEventListener("mousemove", handleMove, false);
+    window.addEventListener("mouseup", handleEnd, false);
+    window.addEventListener("contextmenu", handleEnd, false);
+    return function () {
+      window.removeEventListener("mousemove", handleMove, false);
+      window.removeEventListener("mouseup", handleEnd, false);
+      window.removeEventListener("contextmenu", handleEnd, false);
+    };
+  }, []);
+  var _props$color = props.color,
+      linearGradient = _props$color.linearGradient,
+      gradientColors = _props$color.gradientColors;
+  var thumbBackground = gradientColors2string({
+    points: gradientColors,
+    degree: 90
+  });
+
+  var handleClickThumb = function handleClickThumb(e) {
+    return e.stopPropagation();
+  };
+
+  return /* @__PURE__ */React.createElement("div", {
+    className: "".concat(baseClassName, "__gradient")
+  }, /* @__PURE__ */React.createElement("div", {
+    className: "".concat(baseClassName, "__gradient-slider")
+  }, /* @__PURE__ */React.createElement("div", {
+    className: classNames("".concat(baseClassName, "__slider"), "".concat(baseClassName, "--bg-alpha")),
+    onKeyUp: handleKeyup,
+    tabIndex: 0,
+    ref: refSlider
+  }, /* @__PURE__ */React.createElement("ul", {
+    className: "gradient-thumbs",
+    onClick: handleThumbBarClick,
+    style: {
+      background: thumbBackground
+    }
+  }, colors.current.map(function (t) {
+    var left = "".concat(Math.round(t.left * 100) / 100, "%");
+    return /* @__PURE__ */React.createElement("li", {
+      className: classNames(["".concat(baseClassName, "__thumb"), "gradient-thumbs__item", selectedId.current === t.id ? statusClassNames.active : ""]),
+      key: t.id,
+      title: "".concat(t.color, " ").concat(left),
+      style: {
+        color: t.color,
+        left: left
+      },
+      onClick: handleClickThumb,
+      onMouseDown: function onMouseDown(e) {
+        return handleStart(t.id, e);
+      }
+    }, /* @__PURE__ */React.createElement("span", {
+      className: classNames(["gradient-thumbs__item-inner", "".concat(baseClassName, "--bg-alpha")])
+    }));
+  })))), /* @__PURE__ */React.createElement("div", {
+    className: "".concat(baseClassName, "__gradient-degree"),
+    title: "".concat(degree, "deg")
+  }, /* @__PURE__ */React.createElement(InputNumber, {
+    theme: "normal",
+    min: 0,
+    max: 360,
+    step: 1,
+    format: function format(value) {
+      return "".concat(value, "\xB0");
+    },
+    value: degree.current,
+    onBlur: handleDegreeChange,
+    onEnter: handleDegreeChange,
+    disabled: props.disabled
+  })), /* @__PURE__ */React.createElement("div", {
+    className: classNames(["".concat(baseClassName, "__gradient-preview"), "".concat(baseClassName, "--bg-alpha")])
+  }, /* @__PURE__ */React.createElement("span", {
+    className: "preview-inner",
+    style: {
+      background: linearGradient
+    }
+  })));
+};
+
+var LinearGradient$1 = /*#__PURE__*/React.memo(LinearGradient);
+
+export { LinearGradient$1 as default };
+//# sourceMappingURL=linear-gradient.js.map

package/esm/color-picker/components/panel/linear-gradient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"linear-gradient.js","sources":["../../../../src/color-picker/components/panel/linear-gradient.tsx"],"sourcesContent":["import React, { KeyboardEvent, MouseEvent as ReactMouseEvent, useCallback, useEffect, useRef } from 'react';\nimport cloneDeep from 'lodash/cloneDeep';\nimport classNames from 'classnames';\nimport useClassname from '../../hooks/useClassname';\nimport { genGradientPoint, gradientColors2string } from '../../../_common/js/color-picker/color';\nimport { GradientColorPoint } from '../../../_common/js/color-picker/gradient';\nimport useCommonClassName from '../../../_util/useCommonClassName';\nimport { GRADIENT_SLIDER_DEFAULT_WIDTH } from '../../const';\nimport InputNumber from '../../../input-number';\n\nconst DELETE_KEYS: string[] = ['delete', 'backspace'];\n\ntype TSliderRect = {\n  left: number;\n  width: number;\n};\n\nconst LinearGradient = (props) => {\n  const { onChange, color, disabled } = props;\n  const baseClassName = useClassname();\n  const { STATUS: statusClassNames } = useCommonClassName();\n  const refSlider = useRef<HTMLDivElement>(null);\n  const sliderRectRef = useRef<TSliderRect>({\n    left: 0,\n    width: GRADIENT_SLIDER_DEFAULT_WIDTH,\n  });\n  const isDragging = useRef<Boolean>(false);\n  const isMoved = useRef<Boolean>(false);\n  const degree = useRef(props.color.gradientDegree);\n  const selectedId = useRef(props.color.gradientSelectedId);\n  const colors = useRef<GradientColorPoint[]>(cloneDeep(color.gradientColors));\n\n  useEffect(() => {\n    degree.current = color?.gradientDegree;\n    selectedId.current = color.gradientSelectedId;\n    colors.current = cloneDeep(color.gradientColors);\n  }, [color]);\n\n  const updateSliderRect = () => {\n    const rect = refSlider.current.getBoundingClientRect();\n    sliderRectRef.current = {\n      left: rect.left,\n      width: rect.width || GRADIENT_SLIDER_DEFAULT_WIDTH,\n    };\n  };\n\n  const handleChange = useCallback(\n    (key: 'degree' | 'selectedId' | 'colors', payload: any, addUsedColor?: boolean) => {\n      if (disabled) {\n        return;\n      }\n      onChange({\n        key,\n        payload,\n        addUsedColor,\n      });\n    },\n    [onChange, disabled],\n  );\n\n  const handleDegreeChange = (value: number) => {\n    if (props.disabled || value === props.color.gradientDegree) {\n      return;\n    }\n    degree.current = value;\n    handleChange('degree', value, true);\n  };\n\n  const handleSelectedIdChange = (value: string) => {\n    if (props.disabled) {\n      return;\n    }\n    selectedId.current = value;\n    handleChange('selectedId', value);\n  };\n\n  const handleColorsChange = useCallback(\n    (value: GradientColorPoint[], isEnded?: boolean) => {\n      if (props.disabled) {\n        return;\n      }\n      colors.current = value;\n      handleChange('colors', value, isEnded);\n    },\n    [props.disabled, handleChange],\n  );\n\n  /**\n   * 设置bar的位置\n   * @param left\n   * @returns\n   */\n  const updateActiveThumbLeft = useCallback(\n    (left: number) => {\n      const index = colors.current.findIndex((c) => c.id === selectedId.current);\n      if (index === -1) {\n        return;\n      }\n      const point = colors.current[index];\n      const formatLeft = Math.max(0, Math.min(sliderRectRef.current.width, left));\n\n      const percentLeft = (formatLeft / sliderRectRef.current.width) * 100;\n\n      const newColors = colors.current.map((item, i) =>\n        index !== i\n          ? item\n          : {\n              color: point.color,\n              left: percentLeft,\n              id: point.id,\n            },\n      );\n\n      handleColorsChange(newColors);\n    },\n    [handleColorsChange],\n  );\n\n  // 移动开始\n  const handleStart = (id: string, e: ReactMouseEvent) => {\n    if (isDragging.current || props.disabled) {\n      return;\n    }\n    isMoved.current = false;\n    isDragging.current = true;\n    e.preventDefault();\n    e.stopPropagation();\n    // handleSelectedIdChange(id);\n    // 让slider获取焦点，以便键盘事件生效。\n    refSlider.current.focus();\n  };\n\n  // 移动中\n  const handleMove = useCallback(\n    (e: MouseEvent) => {\n      if (!isDragging.current || disabled) {\n        return;\n      }\n\n      const rect = refSlider.current.getBoundingClientRect();\n      const left = e.clientX - rect.x;\n      isMoved.current = true;\n      updateActiveThumbLeft(left);\n    },\n    [disabled, updateActiveThumbLeft],\n  );\n\n  // 移动结束\n  const handleEnd = useCallback(() => {\n    if (!isDragging.current) {\n      return;\n    }\n    setTimeout(() => {\n      isDragging.current = false;\n    }, 0);\n    if (isMoved.current) {\n      handleColorsChange(colors.current, true);\n      isMoved.current = false;\n    }\n  }, [handleColorsChange]);\n\n  const handleKeyup = (e: KeyboardEvent) => {\n    if (props.disabled) {\n      return;\n    }\n    const points = [...colors.current];\n    let pos = points.findIndex((c) => c.id === selectedId.current);\n    const { length } = points;\n    // 必须保证有两个点\n    if (DELETE_KEYS.includes(e.key.toLocaleLowerCase()) && length > 2 && pos >= 0 && pos <= length - 1) {\n      points.splice(pos, 1);\n      if (!points[pos]) {\n        // eslint-disable-next-line no-nested-ternary\n        pos = points[pos + 1] ? pos + 1 : points[pos - 1] ? pos - 1 : 0;\n      }\n      const current = points[pos];\n      handleColorsChange(points, true);\n      handleSelectedIdChange(current?.id);\n    }\n  };\n\n  const handleThumbBarClick = (e: ReactMouseEvent) => {\n    if (props.disabled) {\n      return;\n    }\n    updateSliderRect();\n\n    let left = e.clientX - sliderRectRef.current.left;\n    left = Math.max(0, Math.min(sliderRectRef.current.width, left));\n    const percentLeft = (left / sliderRectRef.current.width) * 100;\n\n    const newPoint = genGradientPoint(percentLeft, props.color.rgba);\n    const newColors = [...colors.current];\n    newColors.push(newPoint);\n    handleColorsChange(newColors, true);\n    handleSelectedIdChange(newPoint.id);\n  };\n\n  useEffect(() => {\n    updateSliderRect();\n\n    window.addEventListener('mousemove', handleMove, false);\n    window.addEventListener('mouseup', handleEnd, false);\n    window.addEventListener('contextmenu', handleEnd, false);\n\n    return () => {\n      window.removeEventListener('mousemove', handleMove, false);\n      window.removeEventListener('mouseup', handleEnd, false);\n      window.removeEventListener('contextmenu', handleEnd, false);\n    };\n    // eslint-disable-next-line\n  }, []);\n\n  const { linearGradient, gradientColors } = props.color;\n\n  const thumbBackground = gradientColors2string({\n    points: gradientColors,\n    degree: 90,\n  });\n\n  const handleClickThumb = (e: ReactMouseEvent) => e.stopPropagation();\n\n  return (\n    <div className={`${baseClassName}__gradient`}>\n      <div className={`${baseClassName}__gradient-slider`}>\n        <div\n          className={classNames(`${baseClassName}__slider`, `${baseClassName}--bg-alpha`)}\n          onKeyUp={handleKeyup}\n          tabIndex={0}\n          ref={refSlider}\n        >\n          <ul\n            className=\"gradient-thumbs\"\n            onClick={handleThumbBarClick}\n            style={{\n              background: thumbBackground,\n            }}\n          >\n            {colors.current.map((t) => {\n              const left = `${Math.round(t.left * 100) / 100}%`;\n              return (\n                <li\n                  className={classNames([\n                    `${baseClassName}__thumb`,\n                    'gradient-thumbs__item',\n                    selectedId.current === t.id ? statusClassNames.active : '',\n                  ])}\n                  key={t.id}\n                  title={`${t.color} ${left}`}\n                  style={{\n                    color: t.color,\n                    left,\n                  }}\n                  onClick={handleClickThumb}\n                  onMouseDown={(e: ReactMouseEvent) => handleStart(t.id, e)}\n                >\n                  <span className={classNames(['gradient-thumbs__item-inner', `${baseClassName}--bg-alpha`])}></span>\n                </li>\n              );\n            })}\n          </ul>\n        </div>\n      </div>\n      <div className={`${baseClassName}__gradient-degree`} title={`${degree}deg`}>\n        <InputNumber\n          theme=\"normal\"\n          min={0}\n          max={360}\n          step={1}\n          format={(value: number) => `${value}°`}\n          value={degree.current}\n          onBlur={handleDegreeChange}\n          onEnter={handleDegreeChange}\n          disabled={props.disabled}\n        />\n      </div>\n      <div className={classNames([`${baseClassName}__gradient-preview`, `${baseClassName}--bg-alpha`])}>\n        <span\n          className=\"preview-inner\"\n          style={{\n            background: linearGradient,\n          }}\n        ></span>\n      </div>\n    </div>\n  );\n};\n\nexport default React.memo(LinearGradient);\n"],"names":["DELETE_KEYS","LinearGradient","props","onChange","color","disabled","baseClassName","useClassname","useCommonClassName","statusClassNames","STATUS","refSlider","useRef","sliderRectRef","left","width","GRADIENT_SLIDER_DEFAULT_WIDTH","isDragging","isMoved","degree","gradientDegree","selectedId","gradientSelectedId","colors","cloneDeep","gradientColors","useEffect","current","updateSliderRect","rect","getBoundingClientRect","handleChange","useCallback","key","payload","addUsedColor","handleDegreeChange","value","handleSelectedIdChange","handleColorsChange","isEnded","updateActiveThumbLeft","index","findIndex","c","id","point","formatLeft","Math","max","min","percentLeft","newColors","map","item","i","handleStart","e","preventDefault","stopPropagation","focus","handleMove","clientX","x","handleEnd","setTimeout","handleKeyup","points","pos","length","includes","toLocaleLowerCase","splice","handleThumbBarClick","newPoint","genGradientPoint","rgba","push","window","addEventListener","removeEventListener","linearGradient","thumbBackground","gradientColors2string","handleClickThumb","React","createElement","className","classNames","onKeyUp","tabIndex","ref","onClick","style","background","t","round","active","title","onMouseDown","InputNumber","theme","step","format","onBlur","onEnter","memo"],"mappings":"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"}

package/esm/color-picker/components/panel/saturation.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TdColorBaseProps } from '../../interface';
+declare const _default: React.MemoExoticComponent<(props: TdColorBaseProps) => JSX.Element>;
+export default _default;

package/esm/color-picker/components/panel/saturation.js

@@ -0,0 +1,124 @@
+/**
+ * tdesign v0.31.1
+ * (c) 2022 tdesign
+ * @license MIT
+ */
+
+import { _ as _defineProperty } from '../../../_chunks/dep-1628aaec.js';
+import React, { useRef, useCallback, useEffect } from 'react';
+import { SATURATION_PANEL_DEFAULT_WIDTH, SATURATION_PANEL_DEFAULT_HEIGHT } from '../../const.js';
+import useDrag from '../../../_util/useDrag.js';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var Saturation = function Saturation(props) {
+  var color = props.color,
+      disabled = props.disabled,
+      onChange = props.onChange,
+      baseClassName = props.baseClassName;
+  var panelRef = useRef(null);
+  var thumbRef = useRef(null);
+  var panelRectRef = useRef({
+    width: SATURATION_PANEL_DEFAULT_WIDTH,
+    height: SATURATION_PANEL_DEFAULT_HEIGHT
+  });
+
+  var styles = function styles() {
+    var saturation = color.saturation,
+        value = color.value,
+        rgb = color.rgb;
+    var _panelRectRef$current = panelRectRef.current,
+        width = _panelRectRef$current.width,
+        height = _panelRectRef$current.height;
+    var top = Math.round((1 - value) * height);
+    var left = Math.round(saturation * width);
+    return {
+      color: rgb,
+      left: "".concat(left, "px"),
+      top: "".concat(top, "px")
+    };
+  };
+
+  var getSaturationAndValueByCoordinate = function getSaturationAndValueByCoordinate(coordinate) {
+    var _panelRectRef$current2 = panelRectRef.current,
+        width = _panelRectRef$current2.width,
+        height = _panelRectRef$current2.height;
+    var x = coordinate.x,
+        y = coordinate.y;
+    var saturation = Math.round(x / width * 100);
+    var value = Math.round((1 - y / height) * 100);
+    return {
+      saturation: saturation,
+      value: value
+    };
+  };
+
+  var isDragging = useRef(false);
+  var handleDrag = useCallback(function (_ref, isEnd) {
+    var x = _ref.x,
+        y = _ref.y;
+
+    if (disabled) {
+      return;
+    }
+
+    isDragging.current = true;
+
+    var _getSaturationAndValu = getSaturationAndValueByCoordinate({
+      x: x,
+      y: y
+    }),
+        saturation = _getSaturationAndValu.saturation,
+        value = _getSaturationAndValu.value;
+
+    onChange({
+      saturation: saturation / 100,
+      value: value / 100,
+      addUsedColor: isEnd
+    });
+  }, [disabled, onChange]);
+  var handleDragEnd = useCallback(function (coordinate) {
+    if (disabled) {
+      return;
+    }
+
+    isDragging.current = false;
+    handleDrag(coordinate, true);
+  }, []);
+  useDrag(panelRef, {
+    start: function start() {
+      panelRectRef.current.width = panelRef.current.offsetWidth;
+      panelRectRef.current.height = panelRef.current.offsetHeight;
+    },
+    end: function end(coordinate) {
+      handleDragEnd(coordinate);
+    },
+    drag: function drag(coordinate) {
+      handleDrag(coordinate);
+    }
+  });
+  useEffect(function () {
+    panelRectRef.current.width = panelRef.current.offsetWidth || SATURATION_PANEL_DEFAULT_WIDTH;
+    panelRectRef.current.height = panelRef.current.offsetHeight || SATURATION_PANEL_DEFAULT_HEIGHT;
+  }, [handleDrag, handleDragEnd]);
+  return /* @__PURE__ */React.createElement("div", {
+    className: "".concat(baseClassName, "__saturation"),
+    ref: panelRef,
+    style: {
+      background: "hsl(".concat(color.hue, ", 100%, 50%)")
+    }
+  }, /* @__PURE__ */React.createElement("span", {
+    className: "".concat(baseClassName, "__thumb"),
+    role: "slider",
+    tabIndex: 0,
+    ref: thumbRef,
+    style: _objectSpread({}, styles())
+  }));
+};
+
+var SaturationPanel = /*#__PURE__*/React.memo(Saturation);
+
+export { SaturationPanel as default };
+//# sourceMappingURL=saturation.js.map

package/esm/color-picker/components/panel/saturation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"saturation.js","sources":["../../../../src/color-picker/components/panel/saturation.tsx"],"sourcesContent":["import React, { useRef, useEffect, useCallback } from 'react';\nimport { SATURATION_PANEL_DEFAULT_HEIGHT, SATURATION_PANEL_DEFAULT_WIDTH } from '../../const';\nimport { TdColorBaseProps } from '../../interface';\nimport useDrag, { Coordinate } from '../../../_util/useDrag';\n\nconst Saturation = (props: TdColorBaseProps) => {\n  const { color, disabled, onChange, baseClassName } = props;\n  const panelRef = useRef<HTMLDivElement>(null);\n  const thumbRef = useRef<HTMLElement>(null);\n  const panelRectRef = useRef({\n    width: SATURATION_PANEL_DEFAULT_WIDTH,\n    height: SATURATION_PANEL_DEFAULT_HEIGHT,\n  });\n\n  const styles = () => {\n    const { saturation, value, rgb } = color;\n    const { width, height } = panelRectRef.current;\n    const top = Math.round((1 - value) * height);\n    const left = Math.round(saturation * width);\n    return {\n      color: rgb,\n      left: `${left}px`,\n      top: `${top}px`,\n    };\n  };\n\n  const getSaturationAndValueByCoordinate = (coordinate: Coordinate) => {\n    const { width, height } = panelRectRef.current;\n    const { x, y } = coordinate;\n    const saturation = Math.round((x / width) * 100);\n    const value = Math.round((1 - y / height) * 100);\n    return {\n      saturation,\n      value,\n    };\n  };\n\n  const isDragging = useRef<Boolean>(false);\n\n  const handleDrag = useCallback(\n    ({ x, y }: Coordinate, isEnd?: boolean) => {\n      if (disabled) {\n        return;\n      }\n      isDragging.current = true;\n      const { saturation, value } = getSaturationAndValueByCoordinate({ x, y });\n      onChange({\n        saturation: saturation / 100,\n        value: value / 100,\n        addUsedColor: isEnd,\n      });\n    },\n    [disabled, onChange],\n  );\n\n  const handleDragEnd = useCallback((coordinate: Coordinate) => {\n    if (disabled) {\n      return;\n    }\n    isDragging.current = false;\n    handleDrag(coordinate, true);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useDrag(panelRef, {\n    start: () => {\n      panelRectRef.current.width = panelRef.current.offsetWidth;\n      panelRectRef.current.height = panelRef.current.offsetHeight;\n    },\n    end: (coordinate: Coordinate) => {\n      handleDragEnd(coordinate);\n    },\n    drag: (coordinate: Coordinate) => {\n      handleDrag(coordinate);\n    },\n  });\n\n  useEffect(() => {\n    panelRectRef.current.width = panelRef.current.offsetWidth || SATURATION_PANEL_DEFAULT_WIDTH;\n    panelRectRef.current.height = panelRef.current.offsetHeight || SATURATION_PANEL_DEFAULT_HEIGHT;\n  }, [handleDrag, handleDragEnd]);\n\n  return (\n    <div\n      className={`${baseClassName}__saturation`}\n      ref={panelRef}\n      style={{\n        background: `hsl(${color.hue}, 100%, 50%)`,\n      }}\n    >\n      <span\n        className={`${baseClassName}__thumb`}\n        role=\"slider\"\n        tabIndex={0}\n        ref={thumbRef}\n        style={{ ...styles() }}\n      ></span>\n    </div>\n  );\n};\n\nexport default React.memo(Saturation);\n"],"names":["Saturation","props","color","disabled","onChange","baseClassName","panelRef","useRef","thumbRef","panelRectRef","width","SATURATION_PANEL_DEFAULT_WIDTH","height","SATURATION_PANEL_DEFAULT_HEIGHT","styles","saturation","value","rgb","current","top","Math","round","left","getSaturationAndValueByCoordinate","coordinate","x","y","isDragging","handleDrag","useCallback","isEnd","addUsedColor","handleDragEnd","useDrag","start","offsetWidth","offsetHeight","end","drag","useEffect","React","createElement","className","ref","style","background","hue","role","tabIndex","memo"],"mappings":"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"}

package/esm/color-picker/components/panel/slider.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { TdColorBaseProps } from '../../interface';
+export interface TdColorSliderProps extends TdColorBaseProps {
+    className?: string;
+    value?: Number;
+    maxValue?: Number;
+    railStyle?: Object;
+}
+declare const _default: React.MemoExoticComponent<(props: TdColorSliderProps) => JSX.Element>;
+export default _default;