function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import React, { useState, useEffect, useRef, useCallback, useMemo } from 'react';
import dayjs from 'dayjs';
import classNames from 'classnames';
import PisellScrollView from "../PisellScrollView";
import { parseValue, getRangeBounds, snapToStepMinutes, isInDisabledRanges as checkDisabledRanges, getHorizontalAxisSlotCount, pickReferenceDateContainingNow } from "./utils";
import { useTimeAxis, useRealtime, useDragInertia } from "./hooks";
import { BackgroundLayer, CursorLayer, GestureLayer, NowButton, ScaleLayer } from "./components";
import { locales } from '@pisell/utils';
import pisellTimeNavigatorLocales from "./locales";
import "./PisellTimeNavigator.less";
import useEngineContext from "../../hooks/useEngineContext";
import { CELL_SIZE_H, CELL_SIZE_V, CURSOR_MOVES_H_PADDING_PX, CURSOR_MOVES_MIN_CELL_PX, CURSOR_MOVES_NOW_RESERVE_PX } from "./timeNavigatorConstants";

/** 默认横向轨道高度（px），与 Less 中 `--pisell-time-nav-track-h` 回退值一致 */
var DEFAULT_HORIZONTAL_TRACK_HEIGHT_PX = 48;

/** 与 `CURRENT_TIME_GRADIENT_WIDTH_H_PX = CELL_SIZE_H * 1.7` 同比例，随格宽变化 */
var horizontalCurrentTimeGradientWidthPx = function horizontalCurrentTimeGradientWidthPx(cellPx) {
  return Math.round(cellPx * 1.7);
};

/**
 * PisellTimeNavigator：可拖动的时间导航轴，时间范围内浏览、选择、控制
 */
export function PisellTimeNavigator(props) {
  var _context$engine;
  var valueProp = props.value,
    onChange = props.onChange,
    defaultValue = props.defaultValue,
    referenceDateProp = props.referenceDate,
    _props$realtime = props.realtime,
    realtime = _props$realtime === void 0 ? false : _props$realtime,
    range = props.range,
    _props$stepMinutes = props.stepMinutes,
    stepMinutes = _props$stepMinutes === void 0 ? 15 : _props$stepMinutes,
    _props$majorStepMinut = props.majorStepMinutes,
    majorStepMinutes = _props$majorStepMinut === void 0 ? 60 : _props$majorStepMinut,
    _props$cursorMode = props.cursorMode,
    cursorMode = _props$cursorMode === void 0 ? 'axis-moves' : _props$cursorMode,
    _props$orientation = props.orientation,
    orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation,
    horizontalAxisCellSizePx = props.horizontalAxisCellSizePx,
    horizontalTrackHeightPx = props.horizontalTrackHeightPx,
    disabledRanges = props.disabledRanges,
    _props$showNowButton = props.showNowButton,
    showNowButton = _props$showNowButton === void 0 ? true : _props$showNowButton,
    _props$userInteractio = props.userInteractionLocked,
    userInteractionLocked = _props$userInteractio === void 0 ? false : _props$userInteractio,
    _props$snapToStep = props.snapToStep,
    snapToStep = _props$snapToStep === void 0 ? false : _props$snapToStep,
    _props$inertia = props.inertia,
    inertia = _props$inertia === void 0 ? false : _props$inertia,
    businessHours = props.businessHours,
    pastTimeFade = props.pastTimeFade,
    containerStyle = props.containerStyle,
    scaleStyle = props.scaleStyle,
    cursorStyle = props.cursorStyle,
    nowButtonStyle = props.nowButtonStyle,
    className = props.className,
    style = props.style,
    locale = props.locale,
    _props$timeFormat = props.timeFormat,
    timeFormat = _props$timeFormat === void 0 ? 'HH:mm' : _props$timeFormat,
    formatTimeLabel = props.formatTimeLabel,
    renderNowButton = props.renderNowButton,
    onUserInteraction = props.onUserInteraction,
    densitySeriesProp = props.densitySeries,
    loadDensityProp = props.loadDensity;
  var context = useEngineContext();
  locales.init(pisellTimeNavigatorLocales, (context === null || context === void 0 || (_context$engine = context.engine) === null || _context$engine === void 0 || (_context$engine = _context$engine.props) === null || _context$engine === void 0 ? void 0 : _context$engine.locale) || 'en');

  /**
   * 锚定日历日：
   * - 显式传入 prop 时以 prop 为准（调用方可能在「看未来 / 过去某一天」的语义下指定）；
   * - 未传 prop 时，自动挑选「能让 dayjs() 落入营业窗口 [refDay + range.start, refDay + range.end]」
   *   的那一天，使得橙色「现在」高亮永远落在轴内。
   *   例：营业边界 16:00（24h 窗口），now = 中午 12:00 → 选昨天，窗口 [昨 16:00, 今 16:00] 包含 now；
   *       now = 下午 18:00 → 选今天，窗口 [今 16:00, 明 16:00] 包含 now。
   */
  var referenceDateFromProp = useMemo(function () {
    if (referenceDateProp == null) return undefined;
    var d = parseValue(referenceDateProp, dayjs());
    return (d !== null && d !== void 0 ? d : dayjs()).startOf('day');
  }, [referenceDateProp]);
  var referenceDate = referenceDateFromProp !== null && referenceDateFromProp !== void 0 ? referenceDateFromProp : pickReferenceDateContainingNow(range, dayjs());
  var isHorizontal = orientation === 'horizontal';

  /**
   * 横向轨道高度（px）；刻度层、密度 SVG、ScrollView 与轴 inline 高度对齐。
   * 竖向布局不使用本值（保持默认 48 不参与垂直轴样式）。
   */
  var trackHeightPx = useMemo(function () {
    var raw = horizontalTrackHeightPx;
    if (raw == null || !Number.isFinite(Number(raw))) {
      return DEFAULT_HORIZONTAL_TRACK_HEIGHT_PX;
    }
    var n = Math.round(Number(raw));
    return Math.max(28, Math.min(96, n));
  }, [horizontalTrackHeightPx]);

  /**
   * 按自然日稳定依赖，避免无 referenceDate prop 时每次 render 新建 dayjs 触发重复 loadDensity。
   * 注：自动挑选的 referenceDate（可能为昨/明）也要带进 key，否则跨越营业边界后密度仍会停留在前一日。
   */
  var referenceDayKey = referenceDate.format('YYYY-MM-DD');
  var _useState = useState(),
    _useState2 = _slicedToArray(_useState, 2),
    densityLoaded = _useState2[0],
    setDensityLoaded = _useState2[1];
  var densityReqId = useRef(0);
  /**
   * 仅当日历锚定日或 step 变化时清空密度折线；`loadDensity` 回调因上游 deps 变引用而变时
   * 保留上一帧数据直至新请求返回，避免预约页列表/高光周期性更新导致整轴「闪一下」。
   */
  var densityAxisKeyRef = useRef(null);
  var densityGradientId = useMemo(function () {
    return "pisell-time-density-fill-".concat(Math.random().toString(36).slice(2, 8));
  }, []);
  useEffect(function () {
    var axisKey = "".concat(referenceDayKey, "|").concat(stepMinutes);
    var axisKeyChanged = densityAxisKeyRef.current === null || densityAxisKeyRef.current !== axisKey;
    if (densitySeriesProp !== undefined) {
      densityAxisKeyRef.current = null;
      setDensityLoaded(undefined);
      return;
    }
    if (!loadDensityProp) {
      densityAxisKeyRef.current = null;
      setDensityLoaded(undefined);
      return;
    }
    densityAxisKeyRef.current = axisKey;
    var req = ++densityReqId.current;
    var cancelled = false;
    if (axisKeyChanged) {
      setDensityLoaded(undefined);
    }
    var refDay = dayjs(referenceDayKey).startOf('day');
    void loadDensityProp({
      referenceDate: refDay,
      stepMinutes: stepMinutes
    }).then(function (arr) {
      if (cancelled || req !== densityReqId.current) return;
      setDensityLoaded(Array.isArray(arr) ? arr : []);
    }).catch(function () {
      if (cancelled || req !== densityReqId.current) return;
      setDensityLoaded(undefined);
    });
    return function () {
      cancelled = true;
    };
  }, [referenceDayKey, stepMinutes, loadDensityProp, densitySeriesProp]);
  var resolvedDensity = densitySeriesProp !== undefined ? densitySeriesProp : densityLoaded;
  var isAxisMoves = cursorMode === 'axis-moves';
  var _useState3 = useState({
      w: 0,
      h: 0
    }),
    _useState4 = _slicedToArray(_useState3, 2),
    viewportSize = _useState4[0],
    setViewportSize = _useState4[1];

  /** 挂载和视口变化时同步尺寸（需在 cellSize 计算之前声明 state） */
  var viewportWrapRef = useRef(null);
  useEffect(function () {
    var el = viewportWrapRef.current;
    if (!el) return;
    var setSize = function setSize() {
      var w = el.clientWidth;
      var h = el.clientHeight;
      setViewportSize(function (prev) {
        return prev.w === w && prev.h === h ? prev : {
          w: w,
          h: h
        };
      });
    };
    setSize();
    var ro = new ResizeObserver(setSize);
    ro.observe(el);
    return function () {
      return ro.disconnect();
    };
  }, []);
  var horizontalSlotCount = useMemo(function () {
    return isHorizontal ? getHorizontalAxisSlotCount(range, referenceDate, stepMinutes) : 0;
  }, [isHorizontal, range === null || range === void 0 ? void 0 : range.start, range === null || range === void 0 ? void 0 : range.end, referenceDate, stepMinutes]);

  /** cursor-moves + 横向：整段 range 压进一条可视区域，等比例缩小格宽 */
  var cellSizePx = useMemo(function () {
    if (!isHorizontal) return CELL_SIZE_V;
    if (isAxisMoves) {
      var custom = horizontalAxisCellSizePx;
      if (custom != null && Number.isFinite(custom)) {
        var _n = Number(custom);
        if (_n > 0) return Math.max(32, Math.min(_n, 200));
      }
      return CELL_SIZE_H;
    }
    var n = horizontalSlotCount;
    if (n <= 0) return CELL_SIZE_H;
    var vpW = Math.max(1, viewportSize.w || 400);
    var reserve = showNowButton ? CURSOR_MOVES_NOW_RESERVE_PX : 0;
    var usable = Math.max(40, vpW - reserve - CURSOR_MOVES_H_PADDING_PX * 2);
    var raw = Math.floor(usable / n);
    return Math.max(CURSOR_MOVES_MIN_CELL_PX, Math.min(CELL_SIZE_H, raw));
  }, [isHorizontal, isAxisMoves, horizontalAxisCellSizePx, horizontalSlotCount, viewportSize.w, showNowButton]);
  var axis = useTimeAxis({
    range: range,
    stepMinutes: stepMinutes,
    referenceDate: referenceDate,
    orientation: orientation,
    cellSizePx: cellSizePx
  });
  var horizontalDensityCurve = useMemo(function () {
    if (!isHorizontal || !(resolvedDensity !== null && resolvedDensity !== void 0 && resolvedDensity.length)) return null;
    var ticksN = axis.ticks.length;
    var n = Math.min(resolvedDensity.length, ticksN);
    if (n < 2) return null;
    var slice = resolvedDensity.slice(0, n);
    var maxV = Math.max.apply(Math, _toConsumableArray(slice).concat([0]));
    var minV = Math.min.apply(Math, _toConsumableArray(slice).concat([0]));
    var span = Math.max(1, maxV - minV);
    /** 与默认 48px 轴配 46px 密度层一致：轨道高度减 2px 上下留白 */
    var h = Math.max(12, trackHeightPx - 2);
    var points = slice.map(function (v, i) {
      /**
       * 用 `timeToOffset(ticks[i])` 而非 `i * cellSize + cellSize/2` 取 x：
       * head/tail partial 格存在时，每格宽度不再等于 `cellSize`，按索引等比相乘会跑偏。
       * `timeToOffset` 始终随时间线性映射（含两端 dotOffsetPx 留白），与刻度层视觉对齐。
       */
      var x = axis.timeToOffset(axis.ticks[i]);
      /** 映射到 [0,1]：最低值贴底，最高值接近顶部，基本吃满密度层高度 */
      var t = (v - minV) / span;
      var y = h - 1 - t * (h - 3);
      return {
        x: x,
        y: y
      };
    });
    var first = points[0];
    var last = points[points.length - 1];
    var linePath = "M ".concat(first.x, " ").concat(first.y);
    for (var i = 0; i < points.length - 1; i += 1) {
      var p0 = points[i];
      var p1 = points[i + 1];
      var cx = (p0.x + p1.x) / 2;
      var cy = (p0.y + p1.y) / 2;
      linePath += " Q ".concat(p0.x, " ").concat(p0.y, " ").concat(cx, " ").concat(cy);
    }
    linePath += " T ".concat(last.x, " ").concat(last.y);
    var areaPath = "".concat(linePath, " L ").concat(last.x, " ").concat(h, " L ").concat(first.x, " ").concat(h, " Z");
    return {
      points: points,
      linePath: linePath,
      areaPath: areaPath,
      h: h,
      w: axis.totalLengthPx
    };
  }, [isHorizontal, resolvedDensity, axis.ticks, axis.timeToOffset, axis.totalLengthPx, cellSizePx, trackHeightPx]);
  var isControlled = valueProp !== undefined;
  var _useState5 = useState(function () {
      var v = valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue;
      return parseValue(v, referenceDate);
    }),
    _useState6 = _slicedToArray(_useState5, 2),
    internalValue = _useState6[0],
    setInternalValue = _useState6[1];
  var value = isControlled ? valueProp != null ? parseValue(valueProp, referenceDate) : null : internalValue;
  var effectiveValue = value !== null && value !== void 0 ? value : axis.rangeStart;
  var scrollRef = useRef(null);
  /** 标记当前是否为「程序性滚动到中心」：其触发的 onScrollEnd 不再做时间判定 */
  var scrollToCenterInProgressRef = useRef(false);
  /** 标记 value 是否由滚动/松手更新：若是则不再根据 value 做「滚动到中心」 */
  var valueUpdatedByScrollRef = useRef(false);
  /** 手指是否仍按在滚动区域上；仅当完全松手后才执行吸附 */
  var isPointerDownRef = useRef(false);
  var _useState7 = useState({
      scrollLeft: 0,
      scrollTop: 0
    }),
    _useState8 = _slicedToArray(_useState7, 2),
    scrollPosition = _useState8[0],
    setScrollPosition = _useState8[1];
  /** 每分钟更新一次，使当前时间线/渐变块随真实时间移动 */
  var _useState9 = useState(0),
    _useState10 = _slicedToArray(_useState9, 2),
    setNowTick = _useState10[1];
  useEffect(function () {
    var id = setInterval(function () {
      return setNowTick(function (n) {
        return n + 1;
      });
    }, 60 * 1000);
    return function () {
      return clearInterval(id);
    };
  }, []);

  /** cursor-moves：拖指针时禁止程序性滚动抢焦点 */
  var cursorDragActiveRef = useRef(false);
  /**
   * 拖拽起点 + 缩放系数。
   * `pxPerClient` 把 `clientX` 的屏幕 CSS 像素换算成轴内本地像素（offsetPx 的单位）。
   * 没有变换时为 1；当祖先元素带有 `transform: scale(n)` 或浏览器在 iPad 等设备上对页面整体做了
   * 视觉缩放时，`getBoundingClientRect().width / offsetWidth` 会反映出渲染缩放系数 n。
   * 不做这层换算的话，手指走的屏幕距离会被原样累加到 offsetPx 上，但光标视觉位置经过 scale(n) 后
   * 只走 n*delta，于是用户感知"拖了 10 小时但时间只走了 9 小时"（典型 9/10 ≈ 0.9 倍 scale）。
   */
  var cursorDragBaseRef = useRef({
    startClient: 0,
    startOffset: 0,
    pxPerClient: 1
  });

  /**
   * 计算 viewportWrapRef 当前的渲染缩放系数（screenPx → 本地 px 倍率）。
   * 若元素未挂载或宽度异常则返回 1，永不放大放小本意外的 delta。
   */
  var measureWrapPxPerClient = useCallback(function () {
    var el = viewportWrapRef.current;
    if (!el) return 1;
    var rect = el.getBoundingClientRect();
    var layout = isHorizontal ? el.offsetWidth : el.offsetHeight;
    var rendered = isHorizontal ? rect.width : rect.height;
    if (!layout || !rendered) return 1;
    var scale = rendered / layout;
    if (!Number.isFinite(scale) || scale <= 0.01) return 1;
    return 1 / scale;
  }, [isHorizontal]);
  /**
   * 指针气泡放大反馈：仅 down/up/cancel 各触发一次重渲染（move 事件不参与），
   * 拖拽过程中不会引起轴体重排。
   */
  var _useState11 = useState(false),
    _useState12 = _slicedToArray(_useState11, 2),
    isCursorDragging = _useState12[0],
    setIsCursorDragging = _useState12[1];

  /**
   * 拖拽性能：受控模式下 onChange 会让父级（如 PisellReservation）整页重渲，
   * 触控环境下尤其明显（手指仍按着但光标卡帧）。
   *
   * 解决策略 = 「视觉本地 + onChange 提交一次」：
   * - 拖拽过程中只更新本地 dragVisualOffsetPx（轻量 state，仅本组件重渲），
   *   光标和气泡跟着这个 offset 移动，跟手且廉价；
   * - 不调用 onChange / setInternalValue，父级和兄弟组件完全不知道在拖；
   * - 松手时清空本地 offset 并一次性 applyOffsetToNavigatorValue(_, true)，
   *   走 snap → onChange → 父级 setState 的正常路径。React 18 自动批处理，
   *   父级 valueProp 更新与本地 dragVisualOffsetPx 清零会合并成一次 render，
   *   不会出现「松手 → 旧值 → 新值」的回闪。
   *
   * 同帧多次 move 用 rAF 再折叠一层，应对高频鼠标 / 高刷设备。
   */
  var _useState13 = useState(null),
    _useState14 = _slicedToArray(_useState13, 2),
    dragVisualOffsetPx = _useState14[0],
    setDragVisualOffsetPx = _useState14[1];
  var pendingDragOffsetRef = useRef(null);
  var dragRafIdRef = useRef(null);
  var cancelPendingDragFrame = useCallback(function () {
    if (dragRafIdRef.current != null) {
      cancelAnimationFrame(dragRafIdRef.current);
      dragRafIdRef.current = null;
    }
    pendingDragOffsetRef.current = null;
  }, []);
  useEffect(function () {
    return cancelPendingDragFrame;
  }, [cancelPendingDragFrame]);
  var getScrollContainer = useCallback(function () {
    var _scrollRef$current$ge, _scrollRef$current, _scrollRef$current$ge2;
    return (_scrollRef$current$ge = (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 || (_scrollRef$current$ge2 = _scrollRef$current.getScrollContainer) === null || _scrollRef$current$ge2 === void 0 ? void 0 : _scrollRef$current$ge2.call(_scrollRef$current)) !== null && _scrollRef$current$ge !== void 0 ? _scrollRef$current$ge : null;
  }, []);
  var inertiaHandlers = useDragInertia({
    enabled: inertia && !userInteractionLocked,
    orientation: orientation,
    getScrollContainer: getScrollContainer
  });

  /** 横向：点位于每格中心 cellSizePx/2；竖向：对齐整点上面的粗线（格顶），dotOffsetPx=0 */
  /** 视口未量到前用默认值，避免首帧 axisStartMargin 为 0 导致错位 */
  var effectiveViewportW = viewportSize.w || 400;
  var effectiveViewportH = viewportSize.h || 300;
  var halfViewportW = effectiveViewportW / 2;
  var halfViewportH = effectiveViewportH / 2;
  var dotOffsetPx = isHorizontal ? cellSizePx / 2 : 0;
  /** cursor-moves 横向：左右小边距，整轴落在视口内；axis-moves 保持半屏留白可滚动 */
  var axisStartMarginW = isHorizontal && !isAxisMoves ? CURSOR_MOVES_H_PADDING_PX : Math.max(0, halfViewportW - dotOffsetPx);
  var axisStartMarginH = Math.max(0, halfViewportH - dotOffsetPx);

  /**
   * 横向 axis-wrap：无 Now 时用 width:100% + minWidth:自然内容宽，铺满滚动视口；内容更长时仍可横向滚动。
   * 依赖 effectiveViewportW（须在 viewportSize 之后计算）。
   */
  var horizontalAxisWrapStyle = useMemo(function () {
    if (!isHorizontal) return null;
    var minHeight = trackHeightPx;
    if (isAxisMoves) {
      var _natural = axis.totalLengthPx + (effectiveViewportW - cellSizePx);
      if (!showNowButton) {
        return {
          width: '100%',
          minWidth: _natural,
          minHeight: minHeight,
          boxSizing: 'border-box'
        };
      }
      return {
        width: _natural,
        minHeight: minHeight
      };
    }
    var natural = CURSOR_MOVES_H_PADDING_PX + axis.totalLengthPx + CURSOR_MOVES_H_PADDING_PX;
    if (!showNowButton) {
      return {
        width: '100%',
        minWidth: natural,
        minHeight: minHeight,
        boxSizing: 'border-box'
      };
    }
    return {
      width: natural,
      minHeight: minHeight
    };
  }, [isHorizontal, isAxisMoves, axis.totalLengthPx, effectiveViewportW, cellSizePx, showNowButton, trackHeightPx]);

  /** 拖动中：用连续映射按 1 分钟步长显示时间（不吸附到 stepMinutes） */
  var handleScroll = useCallback(function (data) {
    /** 程序性滚动到中心（如点 Now）过程中不更新任何状态，避免时间轴再动、value 被覆盖 */
    if (scrollToCenterInProgressRef.current) return;
    setScrollPosition({
      scrollLeft: data.scrollLeft,
      scrollTop: data.scrollTop
    });
    setViewportSize({
      w: data.clientWidth,
      h: data.clientHeight
    });
    if (userInteractionLocked) return;
    if (!isAxisMoves || data.clientWidth <= 0 && data.clientHeight <= 0) return;
    var halfW = data.clientWidth / 2;
    var halfH = data.clientHeight / 2;
    var hasPadding = isHorizontal ? effectiveViewportW > 0 : effectiveViewportH > 0;
    var centerOffset = isHorizontal ? hasPadding ? data.scrollLeft + dotOffsetPx : data.scrollLeft + halfW : hasPadding ? data.scrollTop + dotOffsetPx : data.scrollTop + halfH;
    var t = axis.offsetToTimeContinuous(centerOffset);
    if (!t) return;
    var tMinute = t.startOf('minute');
    if (checkDisabledRanges(tMinute, disabledRanges)) return;
    valueUpdatedByScrollRef.current = true;
    if (!isControlled) setInternalValue(tMinute);
    onChange === null || onChange === void 0 || onChange(tMinute);
  }, [isAxisMoves, isHorizontal, isControlled, axis.offsetToTimeContinuous, disabledRanges, onChange, effectiveViewportW, effectiveViewportH, dotOffsetPx, userInteractionLocked]);

  /** 根据当前视口中心吸附到 0/15/30/45 分钟并更新 value；由松手后的 scrollEnd 或 pointerUp 调用 */
  var performSnapFromScrollPosition = useCallback(function (scrollLeft, scrollTop, clientWidth, clientHeight) {
    if (!isAxisMoves || clientWidth <= 0 && clientHeight <= 0) return;
    valueUpdatedByScrollRef.current = false;
    var hasPadding = isHorizontal ? effectiveViewportW > 0 : effectiveViewportH > 0;
    var centerOffset = isHorizontal ? hasPadding ? scrollLeft + dotOffsetPx : scrollLeft + clientWidth / 2 : hasPadding ? scrollTop + dotOffsetPx : scrollTop + clientHeight / 2;
    var t = axis.offsetToTimeContinuous(centerOffset);
    if (!t) return;
    var snapped = snapToStep ? snapToStepMinutes(t, stepMinutes) : t;
    if (checkDisabledRanges(snapped, disabledRanges)) return;
    if (!isControlled) setInternalValue(snapped);
    onChange === null || onChange === void 0 || onChange(snapped);
  }, [isAxisMoves, isHorizontal, isControlled, axis.offsetToTimeContinuous, snapToStep, stepMinutes, disabledRanges, onChange, effectiveViewportW, effectiveViewportH, dotOffsetPx]);

  /** 程序性滚动结束后延迟清除标记，避免同一次滚动触发的后续 scrollEnd 误走吸附（导致轴动、值被改） */
  var scrollEndClearTimeoutRef = useRef(null);

  /** 滚动结束：仅当手指已松开时才吸附（避免拖动中停顿就吸附）；若仍按着则等 pointerUp 再吸附 */
  var handleScrollEnd = useCallback(function (data) {
    if (userInteractionLocked) return;
    if (scrollToCenterInProgressRef.current) {
      if (scrollEndClearTimeoutRef.current) clearTimeout(scrollEndClearTimeoutRef.current);
      /** 不立即清除：程序性滚动的 scrollEnd 会在动画结束时才触发（可能数百 ms 后），延迟清除才能跳过那次吸附 */
      scrollEndClearTimeoutRef.current = setTimeout(function () {
        scrollToCenterInProgressRef.current = false;
        scrollEndClearTimeoutRef.current = null;
      }, 500);
      return;
    }
    if (isPointerDownRef.current) return;
    performSnapFromScrollPosition(data.scrollLeft, data.scrollTop, data.clientWidth, data.clientHeight);
  }, [performSnapFromScrollPosition, userInteractionLocked]);

  /** 手指松开时若尚未吸附（例如按住不动再松手），用当前滚动位置做一次吸附；点 Now 按钮松手不吸附 */
  var handlePointerUp = useCallback(function (e) {
    var _e$target, _e$target$closest, _scrollRef$current2, _scrollRef$current2$g;
    isPointerDownRef.current = false;
    if (userInteractionLocked) return;
    if ((_e$target = e.target) !== null && _e$target !== void 0 && (_e$target$closest = _e$target.closest) !== null && _e$target$closest !== void 0 && _e$target$closest.call(_e$target, '.pisell-time-navigator-now')) return;
    if (!isAxisMoves) return;
    var container = (_scrollRef$current2 = scrollRef.current) === null || _scrollRef$current2 === void 0 || (_scrollRef$current2$g = _scrollRef$current2.getScrollContainer) === null || _scrollRef$current2$g === void 0 ? void 0 : _scrollRef$current2$g.call(_scrollRef$current2);
    if (!container) return;
    performSnapFromScrollPosition(container.scrollLeft, container.scrollTop, container.clientWidth, container.clientHeight);
  }, [isAxisMoves, performSnapFromScrollPosition, userInteractionLocked]);
  var snapFn = useCallback(function (t) {
    return snapToStepMinutes(t, stepMinutes);
  }, [stepMinutes]);
  var isInDisabled = useCallback(function (t) {
    return checkDisabledRanges(t, disabledRanges);
  }, [disabledRanges]);
  var handleChange = useCallback(function (next) {
    if (isInDisabled(next)) return;
    if (!isControlled) setInternalValue(next);
    onChange === null || onChange === void 0 || onChange(next);
  }, [isControlled, onChange, isInDisabled]);
  useRealtime(realtime, function () {
    var wall = dayjs().startOf('minute');
    var _getRangeBounds = getRangeBounds(range, referenceDate),
      _getRangeBounds2 = _slicedToArray(_getRangeBounds, 2),
      rangeStart = _getRangeBounds2[0],
      rangeEnd = _getRangeBounds2[1];
    /** 跨日营业：用真实此刻落在 [rangeStart, rangeEnd] 内，而非仅 reference 当日钟面 */
    var clamped = wall.isBefore(rangeStart) ? rangeStart : wall.isAfter(rangeEnd) ? rangeEnd : wall;
    var snapped = snapToStep ? snapFn(clamped) : clamped;
    if (!isInDisabled(snapped)) handleChange(snapped);
  });
  useEffect(function () {
    if (!isControlled && valueProp !== undefined) {
      setInternalValue(parseValue(valueProp, referenceDate));
    }
  }, [isControlled, valueProp, referenceDate]);

  /** 锚定日切换时保留非受控下的时分，落到新日上 */
  var referenceDayMs = referenceDate.valueOf();
  useEffect(function () {
    if (isControlled) return;
    setInternalValue(function (prev) {
      if (!prev) {
        return parseValue(defaultValue, referenceDate);
      }
      return referenceDate.hour(prev.hour()).minute(prev.minute()).second(0).millisecond(0);
    });
  }, [referenceDayMs, isControlled, defaultValue]);
  var cursorOffsetPx = axis.timeToOffset(effectiveValue);

  /**
   * 拖拽视觉态：当用户正在拖动时，dragVisualOffsetPx 记录最新本地 offset，
   * 光标和拖拽气泡都用 visualCursorOffsetPx / visualValue，本组件自己消化高频更新；
   * 父级直到松手才会通过 onChange 收到一次最终值（带 snap）。
   */
  var visualCursorOffsetPx = dragVisualOffsetPx !== null && dragVisualOffsetPx !== void 0 ? dragVisualOffsetPx : cursorOffsetPx;
  var visualValue = useMemo(function () {
    var _axis$offsetToTimeCon;
    if (dragVisualOffsetPx == null) return effectiveValue;
    return (_axis$offsetToTimeCon = axis.offsetToTimeContinuous(dragVisualOffsetPx)) !== null && _axis$offsetToTimeCon !== void 0 ? _axis$offsetToTimeCon : effectiveValue;
  }, [dragVisualOffsetPx, axis.offsetToTimeContinuous, effectiveValue]);
  /** 刻度「现在线」：真实系统时刻落在轴区间内时绘制（含跨日营业次日凌晨） */
  var wallAligned = dayjs().startOf('minute');
  var currentTimeInRange = !wallAligned.isBefore(axis.rangeStart) && !wallAligned.isAfter(axis.rangeEnd);
  var currentTimeOffsetPx = currentTimeInRange ? axis.timeToOffset(wallAligned) : undefined;

  /** 游标/「现在」/拖拽气泡共用：支持预约顶栏「次日 HH:mm」等自定义文案 */
  var resolveTimeLabel = useCallback(function (t) {
    if (formatTimeLabel) return formatTimeLabel(t);
    return locale ? t.locale(locale).format(timeFormat) : t.format(timeFormat);
  }, [formatTimeLabel, locale, timeFormat]);

  /** 横向轴「此刻」橙区：宽度按格宽 ×1.7，右缘对齐当前时刻 */
  var horizontalCurrentTimeHighlightStyle = useMemo(function () {
    if (!isHorizontal || currentTimeOffsetPx == null || currentTimeOffsetPx < 0) {
      return null;
    }
    var gradW = horizontalCurrentTimeGradientWidthPx(cellSizePx);
    var w = Math.min(gradW, currentTimeOffsetPx);
    return {
      left: axisStartMarginW + Math.max(0, currentTimeOffsetPx - w),
      top: 0,
      width: w,
      height: trackHeightPx
    };
  }, [isHorizontal, currentTimeOffsetPx, axisStartMarginW, cellSizePx, trackHeightPx]);

  // 以点为基准：有留白时 targetScroll = cursorOffsetPx - dotOffsetPx（使该点对准视口中心）
  var SCROLL_SYNC_THRESHOLD_PX = 2;
  var hasScrollPadding = isHorizontal ? effectiveViewportW > 0 : effectiveViewportH > 0;
  /**
   * 竖向：上留白用 axis marginTop，下留白用 axis marginBottom（均为半屏）
   * axis-wrap 高度 = marginTop + 轴内容 + marginBottom
   */
  var verticalTailPx = effectiveViewportH / 2;
  var verticalWrapHeight = axisStartMarginH + axis.totalLengthPx + verticalTailPx;
  var maxScrollPx = isHorizontal ? Math.max(0, axis.totalLengthPx - cellSizePx) : Math.max(0, verticalWrapHeight - effectiveViewportH);
  useEffect(function () {
    var _scrollRef$current4, _scrollRef$current4$g;
    /** 横向 cursor-moves：整段 range 已压进视口，禁止程序性横滚 */
    if (!isAxisMoves && isHorizontal) {
      var _scrollRef$current3, _scrollRef$current3$g;
      var _container = (_scrollRef$current3 = scrollRef.current) === null || _scrollRef$current3 === void 0 || (_scrollRef$current3$g = _scrollRef$current3.getScrollContainer) === null || _scrollRef$current3$g === void 0 ? void 0 : _scrollRef$current3$g.call(_scrollRef$current3);
      if (_container && _container.scrollLeft !== 0) {
        _container.scrollTo({
          left: 0,
          behavior: 'auto'
        });
      }
      return;
    }
    if (!isAxisMoves && cursorDragActiveRef.current) return;
    if (valueUpdatedByScrollRef.current) {
      valueUpdatedByScrollRef.current = false;
      return;
    }
    var container = (_scrollRef$current4 = scrollRef.current) === null || _scrollRef$current4 === void 0 || (_scrollRef$current4$g = _scrollRef$current4.getScrollContainer) === null || _scrollRef$current4$g === void 0 ? void 0 : _scrollRef$current4$g.call(_scrollRef$current4);
    if (!container) return;
    var viewportPx = isHorizontal ? container.clientWidth : container.clientHeight;
    var targetScroll = hasScrollPadding ? Math.max(0, Math.min(cursorOffsetPx - dotOffsetPx, maxScrollPx)) : Math.max(0, Math.min(cursorOffsetPx - viewportPx / 2, Math.max(0, axis.totalLengthPx - viewportPx)));
    var currentScroll = isHorizontal ? container.scrollLeft : container.scrollTop;
    if (Math.abs(currentScroll - targetScroll) <= SCROLL_SYNC_THRESHOLD_PX) return;
    scrollToCenterInProgressRef.current = true;
    if (isHorizontal) {
      container.scrollTo({
        left: targetScroll,
        behavior: 'smooth'
      });
    } else {
      container.scrollTo({
        top: targetScroll,
        behavior: 'smooth'
      });
    }
  }, [effectiveValue.valueOf(), isHorizontal, cursorOffsetPx, maxScrollPx, hasScrollPadding, dotOffsetPx, cellSizePx, axis.totalLengthPx, isAxisMoves]);
  var scrollToCenterTime = useCallback(function (t) {
    var container = getScrollContainer();
    if (!container) return;
    var offset = axis.timeToOffset(t);
    var viewportPx = isHorizontal ? container.clientWidth : container.clientHeight;
    var maxScroll = hasScrollPadding ? maxScrollPx : Math.max(0, axis.totalLengthPx - viewportPx);
    var target = hasScrollPadding ? Math.max(0, Math.min(offset - dotOffsetPx, maxScrollPx)) : Math.max(0, Math.min(offset - viewportPx / 2, maxScroll));
    scrollToCenterInProgressRef.current = true;
    container.scrollTo({
      left: isHorizontal ? target : 0,
      top: isHorizontal ? 0 : target,
      behavior: 'smooth'
    });
  }, [getScrollContainer, axis.timeToOffset, axis.totalLengthPx, isHorizontal, hasScrollPadding, dotOffsetPx, maxScrollPx]);
  var handleSelectTime = useCallback(function (t) {
    handleChange(t);
    if (isAxisMoves) scrollToCenterTime(t);
  }, [handleChange, isAxisMoves, scrollToCenterTime]);

  /** 点 Now：系统当前时刻映射到锚定日，再 clamp 到 range */
  var handleNow = useCallback(function () {
    valueUpdatedByScrollRef.current = false;
    var wall = dayjs().startOf('minute');
    var _getRangeBounds3 = getRangeBounds(range, referenceDate),
      _getRangeBounds4 = _slicedToArray(_getRangeBounds3, 2),
      rangeStart = _getRangeBounds4[0],
      rangeEnd = _getRangeBounds4[1];
    var clamped = wall.isBefore(rangeStart) ? rangeStart : wall.isAfter(rangeEnd) ? rangeEnd : wall;
    handleChange(clamped);
  }, [range, referenceDate, handleChange]);
  var applyOffsetToNavigatorValue = useCallback(function (offsetPx, snap) {
    var maxO = Math.max(0, axis.totalLengthPx - 0.001);
    var nextOff = Math.max(0, Math.min(offsetPx, maxO));
    var t = axis.offsetToTimeContinuous(nextOff);
    if (!t) return;
    var out = snapToStep ? snap ? snapToStepMinutes(t, stepMinutes) : t.startOf('minute') : t;
    if (checkDisabledRanges(out, disabledRanges)) return;
    if (!isControlled) setInternalValue(out);
    onChange === null || onChange === void 0 || onChange(out);
  }, [axis.totalLengthPx, axis.offsetToTimeContinuous, snapToStep, stepMinutes, disabledRanges, isControlled, onChange]);
  var handleCursorDragPointerDown = useCallback(function (e) {
    if (userInteractionLocked || isAxisMoves) return;
    e.preventDefault();
    e.stopPropagation();
    onUserInteraction === null || onUserInteraction === void 0 || onUserInteraction();
    cursorDragActiveRef.current = true;
    cursorDragBaseRef.current = {
      startClient: isHorizontal ? e.clientX : e.clientY,
      startOffset: cursorOffsetPx,
      pxPerClient: measureWrapPxPerClient()
    };
    valueUpdatedByScrollRef.current = true;
    setIsCursorDragging(true);
    e.currentTarget.setPointerCapture(e.pointerId);
  }, [userInteractionLocked, isAxisMoves, isHorizontal, cursorOffsetPx, onUserInteraction, measureWrapPxPerClient]);
  var handleCursorDragPointerMove = useCallback(function (e) {
    if (!cursorDragActiveRef.current) return;
    var client = isHorizontal ? e.clientX : e.clientY;
    var screenDelta = client - cursorDragBaseRef.current.startClient;
    /**
     * 把 clientX 的屏幕 CSS 像素 delta 折算成轴本地像素。
     * 没有 CSS 缩放时 pxPerClient=1；祖先有 transform: scale(0.9) 等情况下，
     * 1 屏幕 px 对应 1/0.9 ≈ 1.11 本地 px，否则 offsetPx 走得不够，
     * 表现为"光标跟不上手指、时间轴比手指走得近"。
     */
    var delta = screenDelta * (cursorDragBaseRef.current.pxPerClient || 1);
    var nextOff = cursorDragBaseRef.current.startOffset + delta;
    /**
     * rAF 节流 + 仅更新本地视觉 offset：
     * - 不调用 onChange，避免父级（reservation 主页 / 楼层图 / 排程带等）
     *   每帧重渲，触控环境下尤其明显；
     * - 只更新本地 dragVisualOffsetPx，光标 + 拖拽气泡通过它定位，
     *   再叠加 rAF 把同帧多次 move 合并成一次 setState。
     * 真正提交 onChange 只发生在 pointerUp。
     */
    pendingDragOffsetRef.current = nextOff;
    if (dragRafIdRef.current != null) return;
    dragRafIdRef.current = requestAnimationFrame(function () {
      dragRafIdRef.current = null;
      var pending = pendingDragOffsetRef.current;
      pendingDragOffsetRef.current = null;
      if (pending == null) return;
      if (!cursorDragActiveRef.current) return;
      var maxO = Math.max(0, axis.totalLengthPx - 0.001);
      var clamped = Math.max(0, Math.min(pending, maxO));
      setDragVisualOffsetPx(clamped);
    });
  }, [isHorizontal, axis.totalLengthPx]);
  var handleCursorDragPointerUp = useCallback(function (e) {
    if (!cursorDragActiveRef.current) return;
    cursorDragActiveRef.current = false;
    setIsCursorDragging(false);
    try {
      e.currentTarget.releasePointerCapture(e.pointerId);
    } catch (_unused) {
      /* already released */
    }
    var client = isHorizontal ? e.clientX : e.clientY;
    var screenDelta = client - cursorDragBaseRef.current.startClient;
    var delta = screenDelta * (cursorDragBaseRef.current.pxPerClient || 1);
    var nextOff = cursorDragBaseRef.current.startOffset + delta;
    valueUpdatedByScrollRef.current = false;
    /**
     * 松手时：
     * 1) 取消未消费的 rAF 帧（已被最终 offset 取代）；
     * 2) 清空本地视觉 offset 并 apply 最终值（snap=true）。
     *    React 18 自动批处理：setDragVisualOffsetPx(null) 与父级响应
     *    onChange 后回填的 valueProp 会合并成同一次渲染，不会出现
     *    「松手 → 旧值 → 新值」的回闪。
     */
    cancelPendingDragFrame();
    setDragVisualOffsetPx(null);
    applyOffsetToNavigatorValue(nextOff, true);
  }, [isHorizontal, applyOffsetToNavigatorValue, cancelPendingDragFrame]);
  var businessHoursPx = useMemo(function () {
    if (!businessHours) return undefined;
    var _getRangeBounds5 = getRangeBounds(businessHours, referenceDate),
      _getRangeBounds6 = _slicedToArray(_getRangeBounds5, 2),
      s = _getRangeBounds6[0],
      e = _getRangeBounds6[1];
    return [axis.timeToOffset(s), axis.timeToOffset(e)];
  }, [businessHours, referenceDate, axis.timeToOffset]);
  var scrollConfig = useMemo(function () {
    return {
      show: false,
      type: isHorizontal ? 'lrArrows' : 'tbArrows',
      scrollDistance: cellSizePx
    };
  }, [isHorizontal, cellSizePx]);
  return /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-time-navigator', "pisell-time-navigator--".concat(orientation), userInteractionLocked && 'pisell-time-navigator--interaction-locked', className),
    style: isHorizontal ? _objectSpread(_objectSpread({}, style !== null && style !== void 0 ? style : {}), {}, _defineProperty({}, '--pisell-time-nav-track-h', "".concat(trackHeightPx, "px"))) : _objectSpread({
      height: '100%',
      minHeight: 200
    }, style !== null && style !== void 0 ? style : {})
  }, /*#__PURE__*/React.createElement("div", {
    ref: viewportWrapRef,
    className: "pisell-time-navigator-viewport-wrap",
    style: isHorizontal ? undefined : {
      height: '100%',
      minHeight: 200,
      maxHeight: 800
    },
    onPointerDownCapture: function onPointerDownCapture() {
      isPointerDownRef.current = true;
    },
    onPointerUpCapture: handlePointerUp,
    onPointerLeaveCapture: handlePointerUp
  }, /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-time-navigator-scroll-host', userInteractionLocked && 'pisell-time-navigator-scroll-host--interaction-locked')
  }, /*#__PURE__*/React.createElement(PisellScrollView, {
    ref: scrollRef,
    width: '100%',
    height: '100%',
    overflow: isHorizontal ? 'x' : 'y',
    showScrollButtons: false,
    scrollbarStyle: "none",
    scrollActionsConfig: scrollConfig,
    onScroll: handleScroll,
    onScrollEnd: handleScrollEnd,
    style: _objectSpread(_objectSpread({}, isHorizontal ? {
      height: trackHeightPx
    } : {
      width: 54,
      minHeight: 200,
      height: '100%',
      maxHeight: 800
    }), containerStyle)
  }, /*#__PURE__*/React.createElement(GestureLayer, {
    orientation: orientation,
    cellSizePx: cellSizePx,
    axisStartMarginPx: isHorizontal ? axisStartMarginW : axisStartMarginH,
    offsetToTime: axis.offsetToTime,
    offsetToTimeContinuous: axis.offsetToTimeContinuous,
    onSelectTime: handleSelectTime,
    isInDisabledRanges: isInDisabled,
    snapToStep: snapToStep,
    stepMinutes: stepMinutes,
    snapFn: snapFn,
    scrollPosition: scrollPosition,
    viewportSize: viewportSize,
    onUserInteraction: onUserInteraction,
    onPointerDown: inertiaHandlers.onPointerDown,
    onPointerMove: inertiaHandlers.onPointerMove,
    onPointerUp: inertiaHandlers.onPointerUp,
    onPointerLeave: inertiaHandlers.onPointerUp
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell-time-navigator-axis-wrap",
    style: isHorizontal ? horizontalAxisWrapStyle !== null && horizontalAxisWrapStyle !== void 0 ? horizontalAxisWrapStyle : {
      minHeight: trackHeightPx
    } : {
      width: '100%'
      /* 不设 height，由轴（marginTop + 内容 + marginBottom）自然撑开，避免固定高度与 margin 的 CSS 盒模型歧义 */
    }
  }, horizontalCurrentTimeHighlightStyle && /*#__PURE__*/React.createElement("div", {
    className: "pisell-time-navigator-current-gradient pisell-time-navigator-current-gradient--horizontal",
    style: horizontalCurrentTimeHighlightStyle,
    "aria-hidden": true
  }), /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-time-navigator-axis', "pisell-time-navigator-axis--".concat(orientation)),
    "data-time-navigator-axis": true,
    style: isHorizontal ? {
      width: axis.totalLengthPx,
      height: trackHeightPx,
      marginLeft: axisStartMarginW
    } : {
      height: axis.totalLengthPx,
      width: '100%',
      marginTop: axisStartMarginH,
      marginBottom: verticalTailPx
    }
  }, /*#__PURE__*/React.createElement(BackgroundLayer, {
    orientation: orientation,
    pastTimeFade: pastTimeFade,
    businessHoursPx: businessHoursPx
  }), horizontalDensityCurve ? /*#__PURE__*/React.createElement("svg", {
    className: "pisell-time-navigator-density-layer",
    width: horizontalDensityCurve.w,
    height: horizontalDensityCurve.h,
    viewBox: "0 0 ".concat(horizontalDensityCurve.w, " ").concat(horizontalDensityCurve.h),
    preserveAspectRatio: "none",
    "aria-hidden": true
  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
    id: densityGradientId,
    x1: "0",
    y1: "0",
    x2: "0",
    y2: "1"
  }, /*#__PURE__*/React.createElement("stop", {
    offset: "0%",
    stopColor: "#ff9c66",
    stopOpacity: "0.32"
  }), /*#__PURE__*/React.createElement("stop", {
    offset: "100%",
    stopColor: "#ff9c66",
    stopOpacity: "0.02"
  }))), /*#__PURE__*/React.createElement("path", {
    d: horizontalDensityCurve.areaPath,
    fill: "url(#".concat(densityGradientId, ")")
  }), /*#__PURE__*/React.createElement("path", {
    d: horizontalDensityCurve.linePath,
    fill: "none",
    stroke: "#ff8a4a",
    strokeWidth: 1.8,
    vectorEffect: "non-scaling-stroke"
  }), horizontalDensityCurve.points.map(function (p, i) {
    return /*#__PURE__*/React.createElement("circle", {
      key: i,
      cx: p.x,
      cy: p.y,
      r: 1.4,
      fill: "#ff8a4a"
    });
  })) : null, /*#__PURE__*/React.createElement(ScaleLayer, {
    orientation: orientation,
    ticks: axis.ticks,
    stepMinutes: stepMinutes,
    majorStepMinutes: majorStepMinutes,
    timeFormat: timeFormat,
    locale: locale,
    style: scaleStyle,
    horizontalCellSizePx: isHorizontal ? cellSizePx : undefined,
    cellWidthsPx: isHorizontal ? axis.cellWidthsPx : undefined,
    leadingPaddingPx: isHorizontal ? dotOffsetPx : undefined,
    trailingPaddingPx: isHorizontal ? dotOffsetPx : undefined
  }), isHorizontal && currentTimeOffsetPx != null && currentTimeOffsetPx >= 0 && /*#__PURE__*/React.createElement("span", {
    className: "pisell-time-navigator-current-time-bubble",
    style: {
      left: currentTimeOffsetPx
    },
    "aria-hidden": true
  }, resolveTimeLabel(wallAligned)), !isHorizontal && currentTimeOffsetPx != null && currentTimeOffsetPx >= 0 && /*#__PURE__*/React.createElement("div", {
    className: "pisell-time-navigator-current-line",
    style: {
      left: 0,
      top: currentTimeOffsetPx - 1,
      width: '100%',
      height: 2,
      background: '#FF692E'
    },
    "aria-hidden": true
  }), !isAxisMoves && /*#__PURE__*/React.createElement(CursorLayer, {
    orientation: orientation,
    value: visualValue,
    timeFormat: timeFormat,
    formatTimeLabel: formatTimeLabel,
    locale: locale,
    isRealtime: realtime,
    offsetPx: visualCursorOffsetPx,
    style: cursorStyle,
    dragInteractive: !userInteractionLocked,
    isDragging: isCursorDragging,
    onDragPointerDown: handleCursorDragPointerDown,
    onDragPointerMove: handleCursorDragPointerMove,
    onDragPointerUp: handleCursorDragPointerUp,
    onDragPointerCancel: handleCursorDragPointerUp
  })))))), !isAxisMoves && isHorizontal && isCursorDragging && visualValue != null && /*#__PURE__*/React.createElement("div", {
    className: "pisell-time-navigator-drag-bubble-overlay",
    "aria-hidden": true
  }, /*#__PURE__*/React.createElement("span", {
    className: classNames('pisell-time-navigator-drag-bubble', realtime && 'pisell-time-navigator-drag-bubble--realtime'),
    style: {
      left: axisStartMarginW + visualCursorOffsetPx - scrollPosition.scrollLeft
    }
  }, resolveTimeLabel(visualValue))), isAxisMoves && /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-time-navigator-cursor-fixed', "pisell-time-navigator-cursor-fixed--".concat(orientation)),
    "aria-hidden": true
  }, /*#__PURE__*/React.createElement(CursorLayer, {
    orientation: orientation,
    value: effectiveValue,
    timeFormat: timeFormat,
    formatTimeLabel: formatTimeLabel,
    locale: locale,
    isRealtime: realtime,
    offsetPx: 0,
    fixedCenter: true,
    style: cursorStyle
  })), showNowButton && /*#__PURE__*/React.createElement(NowButton, {
    orientation: orientation,
    onClick: handleNow,
    style: nowButtonStyle,
    renderCustom: renderNowButton
  })));
}
PisellTimeNavigator.displayName = 'PisellTimeNavigator';