"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var slider_exports = {};
__export(slider_exports, {
  Slider: () => Slider
});
module.exports = __toCommonJS(slider_exports);
var import_classnames = __toESM(require("classnames"));
var import_react = __toESM(require("react"));
var import_consts = require("../consts.js");
var import_slider_scss = __toESM(require("../statics/styles/slider-scss.js"));
const Slider = ({
  min = 0,
  max = 10,
  tabIndex = 0,
  onChange,
  dataHook,
  ariaProps,
  value,
  onChangeCommitted,
  languageDir,
  thumbVisibility = import_consts.SLIDER_THUMB_VISIBILITY.fixed,
  trackSize = import_consts.SLIDER_TRACK_SIZE.medium,
  step,
  ariaLabel,
  disabled,
  className
}) => {
  const [fillPercentage, setFillPercentage] = (0, import_react.useState)(0);
  const track = {
    fill: import_consts.ACTION_COLOR_LIVESITE,
    unFilled: import_consts.BG_COLOR_LIVESITE,
    gradientDeg: languageDir === "rtl" ? "270deg" : "90deg"
  };
  const bgStyle = {
    background: `linear-gradient(${track.gradientDeg} ,${track.fill} ${fillPercentage}%, ${track.unFilled} ${fillPercentage + 0.1}%)`
  };
  const isFixedThumb = thumbVisibility === import_consts.SLIDER_THUMB_VISIBILITY.fixed;
  const onKeyUp = (event) => {
    switch (event.key) {
      case "ArrowUp":
      case "ArrowDown":
      case "ArrowRight":
      case "ArrowLeft":
      case "Home":
      case "End":
      case "PageUp":
      case "PageDown":
        onChangeCommitted?.(event.target.valueAsNumber);
        break;
      default:
        return;
    }
  };
  const onKeyDown = (e) => {
    switch (e.key) {
      case "ArrowUp":
      case "ArrowDown":
      case "ArrowRight":
      case "ArrowLeft":
      case "Home":
      case "End":
      case "PageUp":
      case "PageDown":
        onChange?.(e.target.valueAsNumber);
        break;
      default:
        return;
    }
  };
  (0, import_react.useEffect)(() => {
    setFillPercentage(100 * (value - min) / (max - min));
  }, [value]);
  return /* @__PURE__ */ import_react.default.createElement(
    "input",
    {
      ...ariaProps,
      "aria-label": ariaLabel,
      tabIndex,
      type: "range",
      className: (0, import_classnames.default)(import_slider_scss.default.slider, import_slider_scss.default.wrapperSlider, import_slider_scss.default[trackSize], className, {
        [import_slider_scss.default.slider_fixed_thumb]: isFixedThumb
      }),
      "data-hook": dataHook,
      onChange: (e) => onChange(e.target.valueAsNumber),
      value,
      min,
      max,
      step,
      onMouseUp: (e) => onChangeCommitted?.(e.target.valueAsNumber),
      onTouchEnd: (e) => onChangeCommitted?.(e.target.valueAsNumber),
      onKeyUp,
      onKeyDown,
      style: bgStyle,
      disabled
    }
  );
};
//# sourceMappingURL=slider.js.map
