@itwin/imodel-components-react 4.17.6 → 5.0.0-dev.3

package/lib/cjs/imodel-components-react/timeline/Scrubber.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Scrubber.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/Scrubber.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\nimport \"./Scrubber.scss\";\nimport * as React from \"react\";\nimport { Slider } from \"@itwin/itwinui-react\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { useEventListener } from \"@itwin/core-react\";\nimport { toDateString, toTimeString } from \"@itwin/components-react\";\nimport type { TimelineDateMarkerProps } from \"./TimelineComponent\";\n\n/**\n * @internal\n */\nexport function getPercentageOfRectangle(rect: DOMRect, pointer: number) {\n  const position = Math.min(rect.right, Math.max(rect.left, pointer));\n  return (position - rect.left) / rect.width;\n}\n\nconst formatDuration = (value: number) => {\n  const addZero = (i: number) => {\n    return i < 10 ? `0${i}` : i;\n  };\n\n  const date = new Date(value);\n  const minutes = date.getUTCMinutes();\n  const seconds = date.getUTCSeconds();\n  return `${addZero(minutes)}:${addZero(seconds)}`;\n};\n\nconst formatDate = (\n  startDate: Date,\n  endDate: Date,\n  fraction: number,\n  timeZoneOffset?: number\n) => {\n  const delta = (endDate.getTime() - startDate.getTime()) * fraction;\n  const date = new Date(startDate.getTime() + delta);\n  return toDateString(date, timeZoneOffset);\n};\n\nconst formatTime = (\n  startDate: Date,\n  endDate: Date,\n  fraction: number,\n  timeZoneOffset?: number\n) => {\n  const delta = (endDate.getTime() - startDate.getTime()) * fraction;\n  const date = new Date(startDate.getTime() + delta);\n  return ` ${toTimeString(date, timeZoneOffset)}`;\n};\n\nfunction generateToolTipText(\n  showTime: boolean,\n  percent: number,\n  min: number,\n  max: number,\n  startDate?: Date,\n  endDate?: Date,\n  timeZoneOffset = 0\n) {\n  if (startDate && endDate)\n    return `${formatDate(startDate, endDate, percent, timeZoneOffset)}${\n      showTime ? formatTime(startDate, endDate, percent, timeZoneOffset) : \"\"\n    } `;\n\n  const val = Math.round(min + (max - min) * percent);\n  return formatDuration(val);\n}\n\nfunction getPercentageFromDate(startDate: Date, endDate: Date, date?: Date) {\n  const newDate = date ? date : new Date();\n  const startTime = startDate.getTime();\n  const totalDuration = endDate.getTime() - startTime;\n  return (newDate.getTime() - startTime) / totalDuration;\n}\n\nfunction getDateMarker(\n  dateMarkerPropsIn: TimelineDateMarkerProps,\n  startDate: Date,\n  endDate: Date\n): DateMarkerProps {\n  const percentage = getPercentageFromDate(\n    startDate,\n    endDate,\n    dateMarkerPropsIn.date\n  );\n  const marker = dateMarkerPropsIn.dateMarker ? (\n    dateMarkerPropsIn.dateMarker\n  ) : (\n    <span className=\"date-marker-default\"></span>\n  );\n  return { datePercentage: percentage, dateMarker: marker };\n}\n\nfunction markDateInTimelineRange(\n  dateMarkerProps?: TimelineDateMarkerProps,\n  startDate?: Date,\n  endDate?: Date\n): boolean {\n  if (dateMarkerProps && startDate && endDate) {\n    const inDate = dateMarkerProps.date ? dateMarkerProps.date : new Date();\n    if (\n      inDate.getTime() >= startDate.getTime() &&\n      inDate.getTime() <= endDate.getTime()\n    )\n      return true;\n  }\n  return false;\n}\n\n/** @internal */\nexport function RailMarkers({\n  showToolTip,\n  percent,\n  tooltipText,\n  markDate,\n}: {\n  showToolTip: boolean;\n  percent: number;\n  tooltipText: string;\n  markDate?: DateMarkerProps;\n}) {\n  return (\n    <div className=\"components-timeline-rail-marker-container\">\n      {showToolTip && (\n        <div\n          className=\"components-timeline-tooltip\"\n          style={{ left: `${Math.round(percent * 100)}% ` }}\n        >\n          <span className=\"tooltip-text\">{tooltipText}</span>\n        </div>\n      )}\n      {markDate && (\n        <div\n          className=\"components-timeline-date-marker\"\n          data-testid=\"test-date-marker\"\n          style={{ left: `${Math.round(markDate.datePercentage * 100)}% ` }}\n        >\n          {markDate.dateMarker}\n        </div>\n      )}\n    </div>\n  );\n}\n\n/**\n * Custom Timeline Thumb\n * @internal\n */\nexport function CustomThumb() {\n  return (\n    <div className=\"scrubber-handle\">\n      <div />\n      <div />\n      <div />\n    </div>\n  );\n}\n\n/**\n * @internal\n */\nexport function useFocusedThumb(sliderContainer: HTMLDivElement | undefined) {\n  const [thumbElement, setThumbElement] = React.useState<HTMLDivElement>();\n\n  React.useLayoutEffect(() => {\n    if (!sliderContainer) return;\n    const element = sliderContainer.querySelector(\".components-timeline-thumb\");\n    if (!element) return;\n    setThumbElement(element as HTMLDivElement);\n  }, [sliderContainer, thumbElement]);\n\n  const [thumbHasFocus, setThumbHasFocus] = React.useState(false);\n\n  const handleThumbFocus = React.useCallback(() => {\n    setThumbHasFocus(true);\n  }, []);\n\n  const handleThumbBlur = React.useCallback(() => {\n    setThumbHasFocus(false);\n  }, []);\n\n  useEventListener(\"focus\", handleThumbFocus, thumbElement);\n  useEventListener(\"blur\", handleThumbBlur, thumbElement);\n  return thumbHasFocus;\n}\n\n/** Properties for Scrubber/Slider used on timeline control\n * @internal\n */\n// eslint-disable-next-line deprecation/deprecation\nexport interface ScrubberProps extends CommonProps {\n  currentDuration: number;\n  totalDuration: number;\n  isPlaying: boolean;\n  startDate?: Date;\n  endDate?: Date;\n  showTime?: boolean;\n  onChange?: (values: ReadonlyArray<number>) => void;\n  onUpdate?: (values: ReadonlyArray<number>) => void;\n  timeZoneOffset?: number;\n  markDate?: TimelineDateMarkerProps;\n  trackContainerProps?: React.ComponentProps<\n    typeof Slider\n  >[\"trackContainerProps\"];\n}\n\n/** Properties for marking current date in RailMarkers\n * @internal\n */\ninterface DateMarkerProps {\n  datePercentage: number;\n  dateMarker?: React.ReactNode;\n}\n/** Scrubber/Slider for timeline control\n * @internal\n */\nexport function Scrubber(props: ScrubberProps) {\n  const {\n    startDate,\n    endDate,\n    showTime,\n    isPlaying,\n    totalDuration,\n    timeZoneOffset,\n    currentDuration,\n    className,\n    onChange,\n    onUpdate,\n    trackContainerProps,\n  } = props;\n\n  const [sliderContainer, setSliderContainer] =\n    React.useState<HTMLDivElement | null>(null);\n  const [pointerPercent, setPointerPercent] = React.useState(0);\n\n  const tooltipProps = React.useCallback(() => {\n    return { visible: false };\n  }, []);\n\n  const [showRailTooltip, setShowRailTooltip] = React.useState(false);\n\n  const handlePointerEnter = React.useCallback(() => {\n    setShowRailTooltip(true);\n  }, []);\n\n  const handlePointerLeave = React.useCallback(() => {\n    setShowRailTooltip(false);\n  }, []);\n\n  const handlePointerMove = React.useCallback(\n    (event: React.PointerEvent) => {\n      sliderContainer &&\n        setPointerPercent(\n          getPercentageOfRectangle(\n            sliderContainer.getBoundingClientRect(),\n            event.clientX\n          )\n        );\n    },\n    [sliderContainer]\n  );\n\n  const thumbHasFocus = useFocusedThumb(sliderContainer ?? undefined);\n\n  const tickLabel = React.useMemo(() => {\n    const showTip = isPlaying || showRailTooltip || thumbHasFocus;\n    const percent =\n      isPlaying || thumbHasFocus\n        ? currentDuration / totalDuration\n        : pointerPercent;\n    const markDateInRange = markDateInTimelineRange(\n      props.markDate,\n      startDate,\n      endDate\n    );\n    const currentDateMarker =\n      props.markDate && markDateInRange && startDate && endDate\n        ? getDateMarker(props.markDate, startDate, endDate)\n        : undefined;\n    const tooltipText = generateToolTipText(\n      !!showTime,\n      percent,\n      0,\n      totalDuration,\n      startDate,\n      endDate,\n      timeZoneOffset\n    );\n    return (\n      <RailMarkers\n        showToolTip={showTip}\n        percent={percent}\n        tooltipText={tooltipText}\n        markDate={currentDateMarker}\n      />\n    );\n  }, [\n    isPlaying,\n    showRailTooltip,\n    currentDuration,\n    totalDuration,\n    pointerPercent,\n    startDate,\n    endDate,\n    timeZoneOffset,\n    showTime,\n    thumbHasFocus,\n    props.markDate,\n  ]);\n\n  return (\n    <Slider\n      ref={setSliderContainer}\n      className={className}\n      step={1}\n      min={0}\n      max={totalDuration}\n      minLabel=\"\"\n      maxLabel=\"\"\n      onUpdate={onUpdate}\n      onChange={onChange}\n      values={[currentDuration]}\n      tooltipProps={tooltipProps}\n      thumbProps={() => ({\n        children: <CustomThumb />,\n        className: \"components-timeline-thumb\",\n      })}\n      tickLabels={tickLabel}\n      onPointerEnter={handlePointerEnter}\n      onPointerMove={handlePointerMove}\n      onPointerLeave={handlePointerLeave}\n      trackContainerProps={trackContainerProps}\n    />\n  );\n}\n"]}

package/lib/cjs/imodel-components-react/timeline/SolarTimeline.d.ts

@@ -1,60 +0,0 @@
-/** @packageDocumentation
- * @module Timeline
- */
-import "./SolarTimeline.scss";
-import * as React from "react";
-import { ColorDef } from "@itwin/core-common";
-import type { SolarDataProvider } from "./interfaces";
-interface SolarTimelineComponentProps {
-    dataProvider: SolarDataProvider;
-    onPlayPause?: (playing: boolean) => void;
-    duration?: number;
-    speed?: number;
-}
-interface SolarTimelineComponentState {
-    isPlaying: boolean;
-    isDateOpened: boolean;
-    isSettingsOpened: boolean;
-    dayStartMs: number;
-    sunRiseOffsetMs: number;
-    sunSetOffsetMs: number;
-    sunDeltaMs: number;
-    currentTimeOffsetMs: number;
-    speed: number;
-    loop: boolean;
-    shadowColor: ColorDef;
-    duration: number;
-    adjustedDuration: number;
-}
-/** Solar Timeline
- * @alpha
- */
-export declare class SolarTimeline extends React.PureComponent<SolarTimelineComponentProps, SolarTimelineComponentState> {
-    private _requestFrame;
-    private _unmounted;
-    private _timeLastCycle;
-    private _totalPlayTime;
-    private readonly _presetColors;
-    private readonly _speeds;
-    constructor(props: SolarTimelineComponentProps);
-    componentWillUnmount(): void;
-    private _updateAnimation;
-    private _play;
-    private _onPause;
-    private _onPlay;
-    private setPlaybackTimeBySunTime;
-    private _onDateChange;
-    private _onCloseSettingsPopup;
-    private _onOpenSettingsPopup;
-    private ensureRange;
-    private processSunTimeChange;
-    private _onUpdate;
-    private _onChange;
-    private _onSpeedChange;
-    private _onToggleLoop;
-    private _formatTime;
-    getLocalTime(ticks: number): Date;
-    render(): React.JSX.Element;
-}
-export {};
-//# sourceMappingURL=SolarTimeline.d.ts.map

package/lib/cjs/imodel-components-react/timeline/SolarTimeline.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SolarTimeline.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SolarTimeline.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AA4B3D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AA8EtD,UAAU,2BAA2B;IACnC,YAAY,EAAE,iBAAiB,CAAC;IAChC,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,2BAA2B;IACnC,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,WAAW,EAAE,QAAQ,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,aAAc,SAAQ,KAAK,CAAC,aAAa,CACpD,2BAA2B,EAC3B,2BAA2B,CAC5B;IACC,OAAO,CAAC,aAAa,CAAK;IAC1B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,cAAc,CAAK;IAE3B,OAAO,CAAC,QAAQ,CAAC,aAAa,CAS5B;IAEF,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAsB;gBAElC,KAAK,EAAE,2BAA2B;IA8C9B,oBAAoB;IAMpC,OAAO,CAAC,gBAAgB,CA4CtB;IAEF,OAAO,CAAC,KAAK;IAWb,OAAO,CAAC,QAAQ,CAad;IAGF,OAAO,CAAC,OAAO,CAYb;IAEF,OAAO,CAAC,wBAAwB;IAWhC,OAAO,CAAC,aAAa,CAyCnB;IAEF,OAAO,CAAC,qBAAqB,CAE3B;IAEF,OAAO,CAAC,oBAAoB,CAI1B;IAEF,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,oBAAoB;IA0B5B,OAAO,CAAC,SAAS,CAEf;IAEF,OAAO,CAAC,SAAS,CAEf;IAEF,OAAO,CAAC,cAAc,CAGpB;IAEF,OAAO,CAAC,aAAa,CAEnB;IAEF,OAAO,CAAC,WAAW,CAoBjB;IAEK,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IASxB,MAAM;CA8JvB"}

package/lib/cjs/imodel-components-react/timeline/SolarTimeline.js

@@ -1,358 +0,0 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
- * See LICENSE.md in the project root for license terms and full copyright notice.
- *--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Timeline
- */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SolarTimeline = void 0;
-require("./SolarTimeline.scss");
-const classnames_1 = __importDefault(require("classnames"));
-const React = __importStar(require("react"));
-const core_common_1 = require("@itwin/core-common");
-const components_react_1 = require("@itwin/components-react");
-const itwinui_react_1 = require("@itwin/itwinui-react");
-const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
-const UiIModelComponents_1 = require("../UiIModelComponents");
-const PlayButton_1 = require("./PlayButton");
-const useTranslation_1 = require("../useTranslation");
-const msPerMinute = 1000 * 60;
-const msPerHour = msPerMinute * 60;
-const defaultPlaybackDuration = 40 * 1000;
-const offset = 6;
-function Timeline(props) {
-    const { formatTick, formatTime, onChange, onUpdate, dayStartMs, sunSetOffsetMs, sunRiseOffsetMs, currentTimeOffsetMs, } = props;
-    const tooltipContent = formatTime(dayStartMs + currentTimeOffsetMs);
-    const className = (0, classnames_1.default)("solar-timeline", props.className, formatTick && "showticks");
-    const sunRiseStr = formatTime(dayStartMs + sunRiseOffsetMs);
-    const sunSetStr = formatTime(dayStartMs + sunSetOffsetMs);
-    return (React.createElement("div", { className: className },
-        React.createElement(itwinui_react_1.VisuallyHidden, null, "Solar timeline"),
-        React.createElement(itwinui_react_1.Slider, { thumbProps: () => ({ "aria-labelledby": "timeline" }), step: msPerMinute, min: sunRiseOffsetMs, max: sunSetOffsetMs, minLabel: React.createElement(itwinui_react_1.Tooltip, { content: sunRiseStr },
-                React.createElement(itwinui_react_1.Icon, null,
-                    React.createElement(itwinui_icons_react_1.SvgSun, null))), maxLabel: React.createElement(itwinui_react_1.Tooltip, { content: sunSetStr },
-                React.createElement(itwinui_react_1.Icon, null,
-                    React.createElement(itwinui_icons_react_1.SvgMoon, null))), onUpdate: onUpdate, onChange: onChange, values: [currentTimeOffsetMs], tooltipProps: () => ({
-                content: tooltipContent,
-            }) })));
-}
-/** Solar Timeline
- * @alpha
- */
-class SolarTimeline extends React.PureComponent {
-    constructor(props) {
-        super(props);
-        this._requestFrame = 0;
-        this._unmounted = false;
-        this._timeLastCycle = 0;
-        this._totalPlayTime = 0;
-        this._presetColors = [
-            core_common_1.ColorDef.create(core_common_1.ColorByName.grey),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.lightGrey),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.darkGrey),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.lightBlue),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.lightGreen),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.darkGreen),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.tan),
-            core_common_1.ColorDef.create(core_common_1.ColorByName.darkBrown),
-        ];
-        this._speeds = [1, 2, 3, 4, 5, 6];
-        // recursively update the animation until we hit the end or the pause button is clicked
-        this._updateAnimation = (_timestamp) => {
-            if (!this.state.isPlaying || this._unmounted) {
-                window.cancelAnimationFrame(this._requestFrame);
-                return;
-            }
-            const currentTime = new Date().getTime();
-            this._totalPlayTime += currentTime - this._timeLastCycle;
-            this._timeLastCycle = currentTime;
-            let percentComplete = this._totalPlayTime / this.state.adjustedDuration;
-            if (percentComplete > 1)
-                percentComplete = 1;
-            let newPlayingState = true;
-            // calculate the next sun time base on the percentage playback complete - should be int value as that is step amount for slider
-            let nextSunOffset = Math.floor(this.state.sunRiseOffsetMs + percentComplete * this.state.sunDeltaMs);
-            if (percentComplete > 0.99) {
-                if (!this.state.loop) {
-                    newPlayingState = false;
-                    nextSunOffset = this.state.sunSetOffsetMs;
-                    window.cancelAnimationFrame(this._requestFrame);
-                }
-                else {
-                    nextSunOffset = this.state.sunRiseOffsetMs;
-                    this._totalPlayTime = 0;
-                }
-            }
-            if (this.props.dataProvider.onTimeChanged) {
-                const currentSunTime = new Date(this.state.dayStartMs + nextSunOffset);
-                this.props.dataProvider.onTimeChanged(currentSunTime);
-            }
-            this.setState({ isPlaying: newPlayingState, currentTimeOffsetMs: nextSunOffset }, () => {
-                if (newPlayingState)
-                    this._requestFrame = window.requestAnimationFrame(this._updateAnimation);
-            });
-        };
-        // user clicked pause button
-        this._onPause = () => {
-            if (!this.state.isPlaying)
-                return;
-            const currentTime = new Date().getTime();
-            this._totalPlayTime += currentTime - this._timeLastCycle;
-            // stop requesting frames
-            window.cancelAnimationFrame(this._requestFrame);
-            // stop playing
-            this.setState({ isPlaying: false });
-            if (this.props.onPlayPause)
-                this.props.onPlayPause(false);
-        };
-        // user clicked play button
-        this._onPlay = () => {
-            if (this.state.isPlaying)
-                return;
-            if (this.state.currentTimeOffsetMs >= this.state.sunSetOffsetMs ||
-                this.state.currentTimeOffsetMs <= this.state.sunRiseOffsetMs) {
-                this._totalPlayTime = 0;
-                this._play(this.state.sunRiseOffsetMs);
-            }
-            else {
-                this._play(this.state.currentTimeOffsetMs);
-            }
-        };
-        this._onDateChange = (newDate) => {
-            this.props.dataProvider.setDateAndTime(newDate);
-            const dayStartMs = this.props.dataProvider.dayStartMs;
-            const sunRiseOffsetMs = this.props.dataProvider.sunrise.getTime() - dayStartMs;
-            const sunSetOffsetMs = this.props.dataProvider.sunset.getTime() - dayStartMs;
-            const sunDeltaMs = sunSetOffsetMs - sunRiseOffsetMs;
-            /** call dataProvider to update display style */
-            // this.props.dataProvider.onTimeChanged?.(this.props.dataProvider.timeOfDay);
-            // Update time
-            const newHours = newDate.getHours();
-            const newMinutes = newDate.getMinutes();
-            const newSunTime = newHours * msPerHour + newMinutes * msPerMinute;
-            const dateWithNewTime = new Date(dayStartMs + newSunTime);
-            // this.props.dataProvider.setDateAndTime(dateWithNewTime, true);
-            const currentTimeOffsetMs = this.ensureRange(newSunTime, sunRiseOffsetMs, sunSetOffsetMs);
-            this.setPlaybackTimeBySunTime(currentTimeOffsetMs, sunRiseOffsetMs, sunDeltaMs);
-            this._timeLastCycle = new Date().getTime();
-            this.props.dataProvider.onTimeChanged?.(dateWithNewTime);
-            this.setState({
-                dayStartMs,
-                sunRiseOffsetMs,
-                sunSetOffsetMs,
-                currentTimeOffsetMs,
-                sunDeltaMs,
-                isDateOpened: false,
-            });
-        };
-        this._onCloseSettingsPopup = () => {
-            this.setState({ isSettingsOpened: false });
-        };
-        this._onOpenSettingsPopup = () => {
-            this.setState((prevState) => ({
-                isSettingsOpened: !prevState.isSettingsOpened,
-            }));
-        };
-        this._onUpdate = (values) => {
-            if (!this.state.isPlaying)
-                this.processSunTimeChange(values[0]);
-        };
-        this._onChange = (values) => {
-            if (!this.state.isPlaying)
-                this.processSunTimeChange(values[0]);
-        };
-        this._onSpeedChange = (value) => {
-            const adjustedDuration = this.state.duration / value;
-            this.setState({ speed: value, adjustedDuration });
-        };
-        this._onToggleLoop = () => {
-            this.setState((prevState) => ({ loop: !prevState.loop }));
-        };
-        this._formatTime = (ms) => {
-            const date = new Date(ms);
-            const amLabel = components_react_1.UiComponents.translate("time.am");
-            const pmLabel = components_react_1.UiComponents.translate("time.pm");
-            // convert project date to browser locale date
-            const localTime = (0, components_react_1.adjustDateToTimezone)(date, this.props.dataProvider.timeZoneOffset * 60);
-            let hours = localTime.getHours();
-            const minutes = date.getMinutes();
-            const abbrev = hours < 12 ? amLabel : hours === 24 ? amLabel : pmLabel;
-            hours = hours > 12 ? hours - 12 : hours;
-            const hoursStr = hours.toLocaleString(undefined, {
-                minimumIntegerDigits: 2,
-            });
-            const minutesStr = minutes.toLocaleString(undefined, {
-                minimumIntegerDigits: 2,
-            });
-            return `${hoursStr}:${minutesStr} ${abbrev}`;
-        };
-        const dayStartMs = this.props.dataProvider.dayStartMs;
-        const sunRiseOffsetMs = this.props.dataProvider.sunrise.getTime() - dayStartMs;
-        const sunSetOffsetMs = this.props.dataProvider.sunset.getTime() - dayStartMs;
-        const sunDeltaMs = sunSetOffsetMs - sunRiseOffsetMs;
-        const sunOffsetMs = this.props.dataProvider.timeOfDay.getTime() - dayStartMs;
-        const currentTimeOffsetMs = this.ensureRange(sunOffsetMs, sunRiseOffsetMs, sunSetOffsetMs);
-        const shadowColor = this.props.dataProvider.shadowColor;
-        const duration = this.props.duration
-            ? this.props.duration
-            : defaultPlaybackDuration;
-        const speed = this.props.speed ? this.props.speed : 2;
-        const adjustedDuration = duration / speed;
-        this.setPlaybackTimeBySunTime(currentTimeOffsetMs, sunRiseOffsetMs, sunDeltaMs, adjustedDuration);
-        this.state = {
-            isDateOpened: false,
-            isSettingsOpened: false,
-            isPlaying: false,
-            dayStartMs,
-            sunRiseOffsetMs,
-            sunSetOffsetMs,
-            sunDeltaMs,
-            currentTimeOffsetMs,
-            speed,
-            loop: false,
-            shadowColor,
-            duration,
-            adjustedDuration,
-        };
-    }
-    componentWillUnmount() {
-        window.cancelAnimationFrame(this._requestFrame);
-        this._unmounted = true;
-    }
-    _play(sunTimeMs) {
-        this._timeLastCycle = new Date().getTime();
-        // start playing
-        this.setState({ isPlaying: true, currentTimeOffsetMs: sunTimeMs }, () => {
-            this._requestFrame = window.requestAnimationFrame(this._updateAnimation);
-            if (this.props.onPlayPause)
-                this.props.onPlayPause(true);
-        });
-    }
-    setPlaybackTimeBySunTime(sunOffsetMs, sunRiseOffsetMs, sunDeltaMs, adjustedDuration) {
-        this._totalPlayTime =
-            ((sunOffsetMs - sunRiseOffsetMs) / sunDeltaMs) *
-                (adjustedDuration ? adjustedDuration : this.state.adjustedDuration);
-    }
-    ensureRange(value, min, max) {
-        return Math.max(Math.min(value, max), min);
-    }
-    processSunTimeChange(sunTime) {
-        if (sunTime === this.state.currentTimeOffsetMs)
-            return;
-        const currentTimeOffsetMs = this.ensureRange(sunTime, this.state.sunRiseOffsetMs, this.state.sunSetOffsetMs);
-        if (this.props.dataProvider.onTimeChanged) {
-            const currentSunTime = new Date(this.state.dayStartMs + currentTimeOffsetMs);
-            this.props.dataProvider.onTimeChanged(currentSunTime);
-        }
-        this.setState({ currentTimeOffsetMs }, () => {
-            const currentTime = new Date().getTime();
-            this._timeLastCycle = currentTime;
-            const percentComplete = (currentTimeOffsetMs - this.state.sunRiseOffsetMs) /
-                this.state.sunDeltaMs;
-            this._totalPlayTime = percentComplete * this.state.adjustedDuration;
-        });
-    }
-    getLocalTime(ticks) {
-        const projectTime = new Date(ticks);
-        // convert project date to browser locale date
-        return (0, components_react_1.adjustDateToTimezone)(projectTime, this.props.dataProvider.timeZoneOffset * 60);
-    }
-    render() {
-        const { dataProvider } = this.props;
-        const { speed: currentSpeed, loop, currentTimeOffsetMs, sunRiseOffsetMs, sunSetOffsetMs, } = this.state;
-        const months = [
-            components_react_1.UiComponents.translate("month.short.january"),
-            components_react_1.UiComponents.translate("month.short.february"),
-            components_react_1.UiComponents.translate("month.short.march"),
-            components_react_1.UiComponents.translate("month.short.april"),
-            components_react_1.UiComponents.translate("month.short.may"),
-            components_react_1.UiComponents.translate("month.short.june"),
-            components_react_1.UiComponents.translate("month.short.july"),
-            components_react_1.UiComponents.translate("month.short.august"),
-            components_react_1.UiComponents.translate("month.short.september"),
-            components_react_1.UiComponents.translate("month.short.october"),
-            components_react_1.UiComponents.translate("month.short.november"),
-            components_react_1.UiComponents.translate("month.short.december"),
-        ];
-        const localTime = this.getLocalTime(this.state.dayStartMs + this.state.currentTimeOffsetMs);
-        const formattedTime = this._formatTime(dataProvider.dayStartMs + currentTimeOffsetMs);
-        const formattedDate = `${months[localTime.getMonth()]}, ${localTime.getDate()}`;
-        return (React.createElement("div", { className: "solar-timeline-wrapper" },
-            React.createElement(itwinui_react_1.Flex, { flexWrap: "wrap", gap: "none", className: "solar-timeline-start" },
-                React.createElement(PlayButton_1.PlayButton, { isPlaying: this.state.isPlaying, onPlay: this._onPlay, onPause: this._onPause }),
-                React.createElement(itwinui_react_1.Popover, { content: React.createElement(itwinui_react_1.DatePicker, { date: localTime, onChange: this._onDateChange, showTime: true, use12Hours: true }), visible: this.state.isDateOpened, onVisibleChange: (isDateOpened) => {
-                        this.setState({ isDateOpened });
-                    }, placement: "top", middleware: {
-                        offset,
-                    } },
-                    React.createElement(CalendarButton, { onClick: () => {
-                            const isDateOpened = !this.state.isDateOpened;
-                            this.setState({ isDateOpened });
-                        } },
-                        formattedDate,
-                        " @ ",
-                        formattedTime))),
-            React.createElement(Timeline, { dayStartMs: dataProvider.dayStartMs, sunSetOffsetMs: sunSetOffsetMs, sunRiseOffsetMs: sunRiseOffsetMs, currentTimeOffsetMs: currentTimeOffsetMs, onChange: this._onChange, onUpdate: this._onUpdate, formatTime: this._formatTime, isPlaying: this.state.isPlaying }),
-            React.createElement(itwinui_react_1.Flex, { justifyContent: "flex-end", flexWrap: "wrap", gap: "none", className: "solar-timeline-end" },
-                React.createElement(itwinui_react_1.VisuallyHidden, null,
-                    React.createElement(itwinui_react_1.Label, { htmlFor: "speed" }, "Timeline speed")),
-                React.createElement(itwinui_react_1.Tooltip, { content: UiIModelComponents_1.UiIModelComponents.translate("solartimeline.speed") },
-                    React.createElement(itwinui_react_1.Select, { native: true, styleType: "borderless", triggerProps: {
-                            name: "speed",
-                        }, onChange: (newValue) => this._onSpeedChange(Number(newValue)), value: currentSpeed.toString(), options: this._speeds.map((speed) => ({
-                            value: speed.toString(),
-                            label: `${speed}x`,
-                        })) })),
-                React.createElement(itwinui_react_1.IconButton, { styleType: "borderless", label: UiIModelComponents_1.UiIModelComponents.translate("timeline.repeat"), onClick: this._onToggleLoop, isActive: loop },
-                    React.createElement(itwinui_icons_react_1.SvgLoop, null)),
-                React.createElement(itwinui_react_1.Popover, { content: React.createElement(itwinui_react_1.ColorPicker, { selectedColor: this.state.shadowColor.colors, onChangeComplete: (color) => {
-                            const colorDef = core_common_1.ColorDef.create(color.toTbgr());
-                            this.setState({ shadowColor: colorDef }, () => (this.props.dataProvider.shadowColor = colorDef));
-                        } },
-                        React.createElement(itwinui_react_1.Text, { variant: "title", as: "h2", style: { textAlign: "center" } }, UiIModelComponents_1.UiIModelComponents.translate("solarsettings.shadowcolor")),
-                        React.createElement(itwinui_react_1.ColorBuilder, null),
-                        React.createElement(itwinui_react_1.ColorInputPanel, { defaultColorFormat: "hsl" }),
-                        React.createElement(itwinui_react_1.ColorPalette, { colors: this._presetColors.map((color) => color.colors) })), placement: "top", middleware: {
-                        offset,
-                    } },
-                    React.createElement(itwinui_react_1.IconButton, { styleType: "borderless", "data-testid": "shadow-settings-button", label: UiIModelComponents_1.UiIModelComponents.translate("timeline.settings"), onClick: this._onOpenSettingsPopup },
-                        React.createElement(itwinui_icons_react_1.SvgSettings, null))))));
-    }
-}
-exports.SolarTimeline = SolarTimeline;
-const CalendarButton = React.forwardRef(function CalendarButton({ children, onClick }, ref) {
-    const { translate } = (0, useTranslation_1.useTranslation)();
-    const tooltip = translate("solartimeline.dateTime");
-    return (React.createElement(itwinui_react_1.Tooltip, { content: tooltip },
-        React.createElement(itwinui_react_1.Button, { styleType: "borderless", startIcon: React.createElement(itwinui_icons_react_1.SvgCalendar, null), "data-testid": "solar-date-time-button", title: tooltip, onClick: onClick, ref: ref },
-            React.createElement("span", { className: "solar-timeline-date-time" }, children))));
-});
-//# sourceMappingURL=SolarTimeline.js.map

package/lib/cjs/imodel-components-react/timeline/SolarTimeline.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SolarTimeline.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SolarTimeline.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Timeline\n */\n\nimport \"./SolarTimeline.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { adjustDateToTimezone, UiComponents } from \"@itwin/components-react\";\nimport {\n  Button,\n  ColorBuilder,\n  ColorInputPanel,\n  ColorPalette,\n  ColorPicker,\n  DatePicker,\n  Flex,\n  Icon,\n  IconButton,\n  Label,\n  Popover,\n  Select,\n  Slider,\n  Text,\n  Tooltip,\n  VisuallyHidden,\n} from \"@itwin/itwinui-react\";\nimport {\n  SvgCalendar,\n  SvgLoop,\n  SvgMoon,\n  SvgSettings,\n  SvgSun,\n} from \"@itwin/itwinui-icons-react\";\nimport type { SolarDataProvider } from \"./interfaces\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { PlayButton } from \"./PlayButton\";\nimport { useTranslation } from \"../useTranslation\";\n\nconst msPerMinute = 1000 * 60;\nconst msPerHour = msPerMinute * 60;\nconst defaultPlaybackDuration = 40 * 1000;\n\nconst offset = 6;\n\n// eslint-disable-next-line deprecation/deprecation\ninterface TimelineProps extends CommonProps {\n  dayStartMs: number;\n  sunRiseOffsetMs: number;\n  sunSetOffsetMs: number;\n  currentTimeOffsetMs: number;\n  isPlaying: boolean;\n  formatTick?: (ms: number) => string;\n  formatTime: (ms: number) => string;\n  onChange?: (values: ReadonlyArray<number>) => void;\n  onUpdate?: (values: ReadonlyArray<number>) => void;\n}\n\nfunction Timeline(props: TimelineProps) {\n  const {\n    formatTick,\n    formatTime,\n    onChange,\n    onUpdate,\n    dayStartMs,\n    sunSetOffsetMs,\n    sunRiseOffsetMs,\n    currentTimeOffsetMs,\n  } = props;\n\n  const tooltipContent = formatTime(dayStartMs + currentTimeOffsetMs);\n\n  const className = classnames(\n    \"solar-timeline\",\n    props.className,\n    formatTick && \"showticks\"\n  );\n  const sunRiseStr = formatTime(dayStartMs + sunRiseOffsetMs);\n  const sunSetStr = formatTime(dayStartMs + sunSetOffsetMs);\n  return (\n    <div className={className}>\n      <VisuallyHidden>Solar timeline</VisuallyHidden>\n      <Slider\n        thumbProps={() => ({ \"aria-labelledby\": \"timeline\" })}\n        step={msPerMinute}\n        min={sunRiseOffsetMs}\n        max={sunSetOffsetMs}\n        minLabel={\n          <Tooltip content={sunRiseStr}>\n            <Icon>\n              <SvgSun />\n            </Icon>\n          </Tooltip>\n        }\n        maxLabel={\n          <Tooltip content={sunSetStr}>\n            <Icon>\n              <SvgMoon />\n            </Icon>\n          </Tooltip>\n        }\n        onUpdate={onUpdate}\n        onChange={onChange}\n        values={[currentTimeOffsetMs]}\n        tooltipProps={() => ({\n          content: tooltipContent,\n        })}\n      />\n    </div>\n  );\n}\n\ninterface SolarTimelineComponentProps {\n  dataProvider: SolarDataProvider; // provides date, sunrise, sunset in ms, also contains timezone offset from UTC, and updates the display style to current time.\n  onPlayPause?: (playing: boolean) => void; // callback triggered when play/pause button is pressed\n  duration?: number; // playback duration in milliseconds\n  speed?: number;\n}\n\ninterface SolarTimelineComponentState {\n  isPlaying: boolean; // timeline is currently playing or paused\n  isDateOpened: boolean; // date picker is opened\n  isSettingsOpened: boolean; // settings popup is opened\n  dayStartMs: number;\n  sunRiseOffsetMs: number;\n  sunSetOffsetMs: number;\n  sunDeltaMs: number;\n  currentTimeOffsetMs: number;\n  speed: number;\n  loop: boolean;\n  shadowColor: ColorDef;\n  duration: number; // playback duration in milliseconds\n  adjustedDuration: number; // playback duration in milliseconds/ speed\n}\n\n/** Solar Timeline\n * @alpha\n */\nexport class SolarTimeline extends React.PureComponent<\n  SolarTimelineComponentProps,\n  SolarTimelineComponentState\n> {\n  private _requestFrame = 0;\n  private _unmounted = false;\n  private _timeLastCycle = 0;\n  private _totalPlayTime = 0;\n\n  private readonly _presetColors = [\n    ColorDef.create(ColorByName.grey),\n    ColorDef.create(ColorByName.lightGrey),\n    ColorDef.create(ColorByName.darkGrey),\n    ColorDef.create(ColorByName.lightBlue),\n    ColorDef.create(ColorByName.lightGreen),\n    ColorDef.create(ColorByName.darkGreen),\n    ColorDef.create(ColorByName.tan),\n    ColorDef.create(ColorByName.darkBrown),\n  ];\n\n  private readonly _speeds = [1, 2, 3, 4, 5, 6];\n\n  constructor(props: SolarTimelineComponentProps) {\n    super(props);\n\n    const dayStartMs = this.props.dataProvider.dayStartMs;\n    const sunRiseOffsetMs =\n      this.props.dataProvider.sunrise.getTime() - dayStartMs;\n    const sunSetOffsetMs =\n      this.props.dataProvider.sunset.getTime() - dayStartMs;\n    const sunDeltaMs = sunSetOffsetMs - sunRiseOffsetMs;\n    const sunOffsetMs =\n      this.props.dataProvider.timeOfDay.getTime() - dayStartMs;\n    const currentTimeOffsetMs = this.ensureRange(\n      sunOffsetMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs\n    );\n    const shadowColor = this.props.dataProvider.shadowColor;\n    const duration = this.props.duration\n      ? this.props.duration\n      : defaultPlaybackDuration;\n    const speed = this.props.speed ? this.props.speed : 2;\n    const adjustedDuration = duration / speed;\n    this.setPlaybackTimeBySunTime(\n      currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunDeltaMs,\n      adjustedDuration\n    );\n\n    this.state = {\n      isDateOpened: false,\n      isSettingsOpened: false,\n      isPlaying: false,\n      dayStartMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs,\n      sunDeltaMs,\n      currentTimeOffsetMs,\n      speed,\n      loop: false,\n      shadowColor,\n      duration,\n      adjustedDuration,\n    };\n  }\n\n  public override componentWillUnmount() {\n    window.cancelAnimationFrame(this._requestFrame);\n    this._unmounted = true;\n  }\n\n  // recursively update the animation until we hit the end or the pause button is clicked\n  private _updateAnimation = (_timestamp: number) => {\n    if (!this.state.isPlaying || this._unmounted) {\n      window.cancelAnimationFrame(this._requestFrame);\n      return;\n    }\n\n    const currentTime = new Date().getTime();\n    this._totalPlayTime += currentTime - this._timeLastCycle;\n    this._timeLastCycle = currentTime;\n    let percentComplete = this._totalPlayTime / this.state.adjustedDuration;\n    if (percentComplete > 1) percentComplete = 1;\n\n    let newPlayingState = true;\n\n    // calculate the next sun time base on the percentage playback complete - should be int value as that is step amount for slider\n    let nextSunOffset = Math.floor(\n      this.state.sunRiseOffsetMs + percentComplete * this.state.sunDeltaMs\n    );\n\n    if (percentComplete > 0.99) {\n      if (!this.state.loop) {\n        newPlayingState = false;\n        nextSunOffset = this.state.sunSetOffsetMs;\n        window.cancelAnimationFrame(this._requestFrame);\n      } else {\n        nextSunOffset = this.state.sunRiseOffsetMs;\n        this._totalPlayTime = 0;\n      }\n    }\n\n    if (this.props.dataProvider.onTimeChanged) {\n      const currentSunTime = new Date(this.state.dayStartMs + nextSunOffset);\n      this.props.dataProvider.onTimeChanged(currentSunTime);\n    }\n\n    this.setState(\n      { isPlaying: newPlayingState, currentTimeOffsetMs: nextSunOffset },\n      () => {\n        if (newPlayingState)\n          this._requestFrame = window.requestAnimationFrame(\n            this._updateAnimation\n          );\n      }\n    );\n  };\n\n  private _play(sunTimeMs: number) {\n    this._timeLastCycle = new Date().getTime();\n\n    // start playing\n    this.setState({ isPlaying: true, currentTimeOffsetMs: sunTimeMs }, () => {\n      this._requestFrame = window.requestAnimationFrame(this._updateAnimation);\n      if (this.props.onPlayPause) this.props.onPlayPause(true);\n    });\n  }\n\n  // user clicked pause button\n  private _onPause = () => {\n    if (!this.state.isPlaying) return;\n\n    const currentTime = new Date().getTime();\n    this._totalPlayTime += currentTime - this._timeLastCycle;\n\n    // stop requesting frames\n    window.cancelAnimationFrame(this._requestFrame);\n\n    // stop playing\n    this.setState({ isPlaying: false });\n\n    if (this.props.onPlayPause) this.props.onPlayPause(false);\n  };\n\n  // user clicked play button\n  private _onPlay = () => {\n    if (this.state.isPlaying) return;\n\n    if (\n      this.state.currentTimeOffsetMs >= this.state.sunSetOffsetMs ||\n      this.state.currentTimeOffsetMs <= this.state.sunRiseOffsetMs\n    ) {\n      this._totalPlayTime = 0;\n      this._play(this.state.sunRiseOffsetMs);\n    } else {\n      this._play(this.state.currentTimeOffsetMs);\n    }\n  };\n\n  private setPlaybackTimeBySunTime(\n    sunOffsetMs: number,\n    sunRiseOffsetMs: number,\n    sunDeltaMs: number,\n    adjustedDuration?: number\n  ) {\n    this._totalPlayTime =\n      ((sunOffsetMs - sunRiseOffsetMs) / sunDeltaMs) *\n      (adjustedDuration ? adjustedDuration : this.state.adjustedDuration);\n  }\n\n  private _onDateChange = (newDate: Date) => {\n    this.props.dataProvider.setDateAndTime(newDate);\n\n    const dayStartMs = this.props.dataProvider.dayStartMs;\n    const sunRiseOffsetMs =\n      this.props.dataProvider.sunrise.getTime() - dayStartMs;\n    const sunSetOffsetMs =\n      this.props.dataProvider.sunset.getTime() - dayStartMs;\n    const sunDeltaMs = sunSetOffsetMs - sunRiseOffsetMs;\n\n    /** call dataProvider to update display style */\n    // this.props.dataProvider.onTimeChanged?.(this.props.dataProvider.timeOfDay);\n\n    // Update time\n    const newHours = newDate.getHours();\n    const newMinutes = newDate.getMinutes();\n    const newSunTime = newHours * msPerHour + newMinutes * msPerMinute;\n    const dateWithNewTime = new Date(dayStartMs + newSunTime);\n    // this.props.dataProvider.setDateAndTime(dateWithNewTime, true);\n\n    const currentTimeOffsetMs = this.ensureRange(\n      newSunTime,\n      sunRiseOffsetMs,\n      sunSetOffsetMs\n    );\n    this.setPlaybackTimeBySunTime(\n      currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunDeltaMs\n    );\n    this._timeLastCycle = new Date().getTime();\n\n    this.props.dataProvider.onTimeChanged?.(dateWithNewTime);\n    this.setState({\n      dayStartMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs,\n      currentTimeOffsetMs,\n      sunDeltaMs,\n      isDateOpened: false,\n    });\n  };\n\n  private _onCloseSettingsPopup = () => {\n    this.setState({ isSettingsOpened: false });\n  };\n\n  private _onOpenSettingsPopup = () => {\n    this.setState((prevState) => ({\n      isSettingsOpened: !prevState.isSettingsOpened,\n    }));\n  };\n\n  private ensureRange(value: number, min: number, max: number): number {\n    return Math.max(Math.min(value, max), min);\n  }\n\n  private processSunTimeChange(sunTime: number) {\n    if (sunTime === this.state.currentTimeOffsetMs) return;\n\n    const currentTimeOffsetMs = this.ensureRange(\n      sunTime,\n      this.state.sunRiseOffsetMs,\n      this.state.sunSetOffsetMs\n    );\n\n    if (this.props.dataProvider.onTimeChanged) {\n      const currentSunTime = new Date(\n        this.state.dayStartMs + currentTimeOffsetMs\n      );\n      this.props.dataProvider.onTimeChanged(currentSunTime);\n    }\n\n    this.setState({ currentTimeOffsetMs }, () => {\n      const currentTime = new Date().getTime();\n      this._timeLastCycle = currentTime;\n      const percentComplete =\n        (currentTimeOffsetMs - this.state.sunRiseOffsetMs) /\n        this.state.sunDeltaMs;\n      this._totalPlayTime = percentComplete * this.state.adjustedDuration;\n    });\n  }\n\n  private _onUpdate = (values: ReadonlyArray<number>) => {\n    if (!this.state.isPlaying) this.processSunTimeChange(values[0]);\n  };\n\n  private _onChange = (values: ReadonlyArray<number>) => {\n    if (!this.state.isPlaying) this.processSunTimeChange(values[0]);\n  };\n\n  private _onSpeedChange = (value: number) => {\n    const adjustedDuration = this.state.duration / value;\n    this.setState({ speed: value, adjustedDuration });\n  };\n\n  private _onToggleLoop = () => {\n    this.setState((prevState) => ({ loop: !prevState.loop }));\n  };\n\n  private _formatTime = (ms: number) => {\n    const date = new Date(ms);\n    const amLabel = UiComponents.translate(\"time.am\");\n    const pmLabel = UiComponents.translate(\"time.pm\");\n    // convert project date to browser locale date\n    const localTime = adjustDateToTimezone(\n      date,\n      this.props.dataProvider.timeZoneOffset * 60\n    );\n    let hours = localTime.getHours();\n    const minutes = date.getMinutes();\n    const abbrev = hours < 12 ? amLabel : hours === 24 ? amLabel : pmLabel;\n    hours = hours > 12 ? hours - 12 : hours;\n    const hoursStr = hours.toLocaleString(undefined, {\n      minimumIntegerDigits: 2,\n    });\n    const minutesStr = minutes.toLocaleString(undefined, {\n      minimumIntegerDigits: 2,\n    });\n    return `${hoursStr}:${minutesStr} ${abbrev}`;\n  };\n\n  public getLocalTime(ticks: number): Date {\n    const projectTime = new Date(ticks);\n    // convert project date to browser locale date\n    return adjustDateToTimezone(\n      projectTime,\n      this.props.dataProvider.timeZoneOffset * 60\n    );\n  }\n\n  public override render() {\n    const { dataProvider } = this.props;\n    const {\n      speed: currentSpeed,\n      loop,\n      currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs,\n    } = this.state;\n    const months = [\n      UiComponents.translate(\"month.short.january\"),\n      UiComponents.translate(\"month.short.february\"),\n      UiComponents.translate(\"month.short.march\"),\n      UiComponents.translate(\"month.short.april\"),\n      UiComponents.translate(\"month.short.may\"),\n      UiComponents.translate(\"month.short.june\"),\n      UiComponents.translate(\"month.short.july\"),\n      UiComponents.translate(\"month.short.august\"),\n      UiComponents.translate(\"month.short.september\"),\n      UiComponents.translate(\"month.short.october\"),\n      UiComponents.translate(\"month.short.november\"),\n      UiComponents.translate(\"month.short.december\"),\n    ];\n\n    const localTime = this.getLocalTime(\n      this.state.dayStartMs + this.state.currentTimeOffsetMs\n    );\n    const formattedTime = this._formatTime(\n      dataProvider.dayStartMs + currentTimeOffsetMs\n    );\n    const formattedDate = `${\n      months[localTime.getMonth()]\n    }, ${localTime.getDate()}`;\n\n    return (\n      <div className=\"solar-timeline-wrapper\">\n        <Flex flexWrap=\"wrap\" gap=\"none\" className=\"solar-timeline-start\">\n          <PlayButton\n            isPlaying={this.state.isPlaying}\n            onPlay={this._onPlay}\n            onPause={this._onPause}\n          />\n          <Popover\n            content={\n              <DatePicker\n                date={localTime}\n                onChange={this._onDateChange}\n                showTime\n                use12Hours\n              />\n            }\n            visible={this.state.isDateOpened}\n            onVisibleChange={(isDateOpened) => {\n              this.setState({ isDateOpened });\n            }}\n            placement=\"top\"\n            middleware={{\n              offset,\n            }}\n          >\n            <CalendarButton\n              onClick={() => {\n                const isDateOpened = !this.state.isDateOpened;\n                this.setState({ isDateOpened });\n              }}\n            >\n              {formattedDate} @ {formattedTime}\n            </CalendarButton>\n          </Popover>\n        </Flex>\n\n        <Timeline\n          dayStartMs={dataProvider.dayStartMs}\n          sunSetOffsetMs={sunSetOffsetMs}\n          sunRiseOffsetMs={sunRiseOffsetMs}\n          currentTimeOffsetMs={currentTimeOffsetMs}\n          onChange={this._onChange}\n          onUpdate={this._onUpdate}\n          formatTime={this._formatTime}\n          isPlaying={this.state.isPlaying}\n        />\n\n        <Flex\n          justifyContent=\"flex-end\"\n          flexWrap=\"wrap\"\n          gap=\"none\"\n          className=\"solar-timeline-end\"\n        >\n          <VisuallyHidden>\n            <Label htmlFor=\"speed\">Timeline speed</Label>\n          </VisuallyHidden>\n          <Tooltip\n            content={UiIModelComponents.translate(\"solartimeline.speed\")}\n          >\n            <Select\n              native\n              styleType=\"borderless\"\n              triggerProps={{\n                name: \"speed\",\n              }}\n              onChange={(newValue) => this._onSpeedChange(Number(newValue))}\n              value={currentSpeed.toString()}\n              options={this._speeds.map((speed) => ({\n                value: speed.toString(),\n                label: `${speed}x`,\n              }))}\n            />\n          </Tooltip>\n\n          <IconButton\n            styleType=\"borderless\"\n            label={UiIModelComponents.translate(\"timeline.repeat\")}\n            onClick={this._onToggleLoop}\n            isActive={loop}\n          >\n            <SvgLoop />\n          </IconButton>\n\n          <Popover\n            content={\n              <ColorPicker\n                selectedColor={this.state.shadowColor.colors}\n                onChangeComplete={(color) => {\n                  const colorDef = ColorDef.create(color.toTbgr());\n                  this.setState(\n                    { shadowColor: colorDef },\n                    () => (this.props.dataProvider.shadowColor = colorDef)\n                  );\n                }}\n              >\n                <Text variant=\"title\" as=\"h2\" style={{ textAlign: \"center\" }}>\n                  {UiIModelComponents.translate(\"solarsettings.shadowcolor\")}\n                </Text>\n                <ColorBuilder />\n                <ColorInputPanel defaultColorFormat=\"hsl\" />\n                <ColorPalette\n                  colors={this._presetColors.map((color) => color.colors)}\n                />\n              </ColorPicker>\n            }\n            placement=\"top\"\n            middleware={{\n              offset,\n            }}\n          >\n            <IconButton\n              styleType=\"borderless\"\n              data-testid=\"shadow-settings-button\"\n              label={UiIModelComponents.translate(\"timeline.settings\")}\n              onClick={this._onOpenSettingsPopup}\n            >\n              <SvgSettings />\n            </IconButton>\n          </Popover>\n        </Flex>\n      </div>\n    );\n  }\n}\n\ninterface CalendarButtonProps {\n  children?: React.ReactNode;\n  onClick?: () => void;\n}\n\nconst CalendarButton = React.forwardRef<HTMLButtonElement, CalendarButtonProps>(\n  function CalendarButton({ children, onClick }, ref) {\n    const { translate } = useTranslation();\n    const tooltip = translate(\"solartimeline.dateTime\");\n\n    return (\n      <Tooltip content={tooltip}>\n        <Button\n          styleType=\"borderless\"\n          startIcon={<SvgCalendar />}\n          data-testid=\"solar-date-time-button\"\n          title={tooltip}\n          onClick={onClick}\n          ref={ref}\n        >\n          <span className=\"solar-timeline-date-time\">{children}</span>\n        </Button>\n      </Tooltip>\n    );\n  }\n);\n"]}

package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SpeedTimeline.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SpeedTimeline.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAKrD,UAAU,UAAW,SAAQ,WAAW;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,UAAU,qBA0B9C"}

package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.js

@@ -1,57 +0,0 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
- * See LICENSE.md in the project root for license terms and full copyright notice.
- *--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Timeline
- */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SpeedTimeline = void 0;
-require("./SpeedTimeline.scss");
-const classnames_1 = __importDefault(require("classnames"));
-const React = __importStar(require("react"));
-const itwinui_react_1 = require("@itwin/itwinui-react");
-/** Speed Timeline used in Solar Timeline component
- * @internal
- */
-function SpeedTimeline(props) {
-    const onChange = (values) => {
-        const value = values[0];
-        if (props.onChange && value >= 1 && value <= 6)
-            props.onChange(value);
-    };
-    const tooltipProps = React.useCallback(() => {
-        return { visible: false };
-    }, []);
-    return (React.createElement("div", { className: (0, classnames_1.default)("speed-timeline", props.className) },
-        React.createElement(itwinui_react_1.Slider, { step: 1, min: 1, max: 6, minLabel: "", maxLabel: "", onUpdate: onChange, onChange: onChange, values: [props.speed], trackDisplayMode: "none", tooltipProps: tooltipProps })));
-}
-exports.SpeedTimeline = SpeedTimeline;
-//# sourceMappingURL=SpeedTimeline.js.map

package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SpeedTimeline.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SpeedTimeline.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEH,gCAA8B;AAC9B,4DAAoC;AACpC,6CAA+B;AAC/B,wDAA8C;AAW9C;;GAEG;AACH,SAAgB,aAAa,CAAC,KAAiB;IAC7C,MAAM,QAAQ,GAAG,CAAC,MAA6B,EAAE,EAAE;QACjD,MAAM,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC;YAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxE,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC1C,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,gBAAgB,EAAE,KAAK,CAAC,SAAS,CAAC;QAC3D,oBAAC,sBAAM,IACL,IAAI,EAAE,CAAC,EACP,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,CAAC,EACN,QAAQ,EAAC,EAAE,EACX,QAAQ,EAAC,EAAE,EACX,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EACrB,gBAAgB,EAAC,MAAM,EACvB,YAAY,EAAE,YAAY,GAC1B,CACE,CACP,CAAC;AACJ,CAAC;AA1BD,sCA0BC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Timeline\n */\n\nimport \"./SpeedTimeline.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Slider } from \"@itwin/itwinui-react\";\nimport type { CommonProps } from \"@itwin/core-react\";\n\n// component is in alpha state - it may change after usability testing - test coverage not complete\n\n// eslint-disable-next-line deprecation/deprecation\ninterface SpeedProps extends CommonProps {\n  speed: number;\n  onChange?: (value: number) => void;\n}\n\n/** Speed Timeline used in Solar Timeline component\n * @internal\n */\nexport function SpeedTimeline(props: SpeedProps) {\n  const onChange = (values: ReadonlyArray<number>) => {\n    const value = values[0];\n    if (props.onChange && value >= 1 && value <= 6) props.onChange(value);\n  };\n\n  const tooltipProps = React.useCallback(() => {\n    return { visible: false };\n  }, []);\n\n  return (\n    <div className={classnames(\"speed-timeline\", props.className)}>\n      <Slider\n        step={1}\n        min={1}\n        max={6}\n        minLabel=\"\"\n        maxLabel=\"\"\n        onUpdate={onChange}\n        onChange={onChange}\n        values={[props.speed]}\n        trackDisplayMode=\"none\"\n        tooltipProps={tooltipProps}\n      />\n    </div>\n  );\n}\n"]}