tdesign-react/lib/color-picker/hooks/useStyles.js

TDesign Component for React

/**
 * tdesign v1.15.1
 * (c) 2025 tdesign
 * @license MIT
 */

import { _ as _slicedToArray } from '../../_chunks/dep-48805ab8.js';
import { useState, useEffect } from 'react';
import '../../_chunks/dep-026a4c6b.js';

var useStyles = function useStyles(params, panelRectRef) {
  var color = params.color,
    value = params.value,
    maxValue = params.maxValue,
    type = params.type;
  var _useState = useState({
      left: "",
      color: ""
    }),
    _useState2 = _slicedToArray(_useState, 2),
    styles = _useState2[0],
    setStyles = _useState2[1];
  useEffect(function () {
    var width = panelRectRef.current.width;
    if (!width) return;
    var left = Math.round(Number(value) / Number(maxValue) * 100);
    var thumbColor = "";
    if (type === "hue") {
      thumbColor = "hsl(".concat(color.hue, ", 100%, 50%)");
    } else if (type === "alpha") {
      thumbColor = color.rgba;
    }
    setStyles({
      left: "".concat(left, "%"),
      color: thumbColor
    });
  }, [color.hue, color.rgba, value]);
  return {
    styles: styles
  };
};

export { useStyles as default };
//# sourceMappingURL=useStyles.js.map