@itwin/imodel-components-react 4.9.0 → 4.10.0-dev.1

package/lib/esm/imodel-components-react/timeline/Scrubber.d.ts

@@ -6,9 +6,7 @@ import type { TimelineDateMarkerProps } from "./TimelineComponent";
  * @internal
  */
 export declare function getPercentageOfRectangle(rect: DOMRect, pointer: number): number;
-/**
- * @internal
- */
+/** @internal */
 export declare function RailMarkers({ showToolTip, percent, tooltipText, markDate, }: {
     showToolTip: boolean;
     percent: number;

package/lib/esm/imodel-components-react/timeline/Scrubber.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Scrubber.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/Scrubber.tsx"],"names":[],"mappings":"AAIA,OAAO,iBAAiB,CAAC;AACzB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAEnE;;GAEG;AACH,wBAAgB,wBAAwB,CAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,UAGtE;AAiGD;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,OAAO,EACP,WAAW,EACX,QAAQ,GACT,EAAE;IACD,WAAW,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,eAAe,CAAC;CAC5B,qBAsBA;AAED;;;GAGG;AACH,wBAAgB,WAAW,sBAQ1B;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,eAAe,EAAE,cAAc,GAAG,SAAS,WA0B1E;AAED;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACnD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,uBAAuB,CAAC;CACpC;AAED;;GAEG;AACH,UAAU,eAAe;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AACD;;GAEG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,qBAyI5C"}
+{"version":3,"file":"Scrubber.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/Scrubber.tsx"],"names":[],"mappings":"AAIA,OAAO,iBAAiB,CAAC;AACzB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAEnE;;GAEG;AACH,wBAAgB,wBAAwB,CAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,UAGtE;AAkGD,gBAAgB;AAChB,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,OAAO,EACP,WAAW,EACX,QAAQ,GACT,EAAE;IACD,WAAW,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,eAAe,CAAC;CAC5B,qBAsBA;AAED;;;GAGG;AACH,wBAAgB,WAAW,sBAQ1B;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,eAAe,EAAE,cAAc,GAAG,SAAS,WAuB1E;AAED;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACnD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,uBAAuB,CAAC;CACpC;AAED;;GAEG;AACH,UAAU,eAAe;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AACD;;GAEG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,qBAsH5C"}

package/lib/esm/imodel-components-react/timeline/Scrubber.js

@@ -63,9 +63,7 @@ function markDateInTimelineRange(dateMarkerProps, startDate, endDate) {
     }
     return false;
 }
-/**
- * @internal
- */
+/** @internal */
 export function RailMarkers({ showToolTip, percent, tooltipText, markDate, }) {
     return (React.createElement("div", { className: "components-timeline-rail-marker-container" },
         showToolTip && (React.createElement("div", { className: "components-timeline-tooltip", style: { left: `${Math.round(percent * 100)}% ` } },
@@ -88,13 +86,12 @@ export function CustomThumb() {
 export function useFocusedThumb(sliderContainer) {
     const [thumbElement, setThumbElement] = React.useState();
     React.useLayoutEffect(() => {
-        // istanbul ignore else
-        if (sliderContainer) {
-            const element = sliderContainer.querySelector(".iui-slider-thumb");
-            if (element && thumbElement !== element) {
-                setThumbElement(element);
-            }
-        }
+        if (!sliderContainer)
+            return;
+        const element = sliderContainer.querySelector(".components-timeline-thumb");
+        if (!element)
+            return;
+        setThumbElement(element);
     }, [sliderContainer, thumbElement]);
     const [thumbHasFocus, setThumbHasFocus] = React.useState(false);
     const handleThumbFocus = React.useCallback(() => {
@@ -112,24 +109,8 @@ export function useFocusedThumb(sliderContainer) {
  */
 export function Scrubber(props) {
     const { startDate, endDate, showTime, isPlaying, totalDuration, timeZoneOffset, currentDuration, className, onChange, onUpdate, } = props;
-    const thumbProps = () => {
-        return {
-            className: "components-timeline-thumb",
-            children: React.createElement(CustomThumb, null),
-        };
-    };
-    const sliderRef = React.useRef(null);
-    const [sliderContainer, setSliderContainer] = React.useState();
+    const [sliderContainer, setSliderContainer] = React.useState(null);
     const [pointerPercent, setPointerPercent] = React.useState(0);
-    React.useLayoutEffect(() => {
-        // istanbul ignore else
-        if (sliderRef.current) {
-            const container = sliderRef.current.querySelector(".iui-slider-container");
-            if (container && sliderContainer !== container) {
-                setSliderContainer(container);
-            }
-        }
-    }, [sliderContainer]);
     const tooltipProps = React.useCallback(() => {
         return { visible: false };
     }, []);
@@ -146,7 +127,7 @@ export function Scrubber(props) {
         sliderContainer &&
             setPointerPercent(getPercentageOfRectangle(sliderContainer.getBoundingClientRect(), event.clientX));
     }, [sliderContainer]);
-    const thumbHasFocus = useFocusedThumb(sliderContainer);
+    const thumbHasFocus = useFocusedThumb(sliderContainer ?? undefined);
     const tickLabel = React.useMemo(() => {
         const showTip = isPlaying || showRailTooltip || thumbHasFocus;
         const percent = isPlaying || thumbHasFocus
@@ -171,10 +152,9 @@ export function Scrubber(props) {
         thumbHasFocus,
         props.markDate,
     ]);
-    return (React.createElement(Slider, { ref: sliderRef, className: className, step: 1, min: 0, max: totalDuration, minLabel: "", maxLabel: "", onUpdate: onUpdate, onChange: onChange, values: [currentDuration], tooltipProps: tooltipProps, thumbProps: thumbProps, tickLabels: tickLabel, railContainerProps: {
-            onPointerEnter: handlePointerEnter,
-            onPointerMove: handlePointerMove,
-            onPointerLeave: handlePointerLeave,
-        } }));
+    return (React.createElement(Slider, { ref: setSliderContainer, className: className, step: 1, min: 0, max: totalDuration, minLabel: "", maxLabel: "", onUpdate: onUpdate, onChange: onChange, values: [currentDuration], tooltipProps: tooltipProps, thumbProps: () => ({
+            children: React.createElement(CustomThumb, null),
+            className: "components-timeline-thumb",
+        }), tickLabels: tickLabel, onPointerEnter: handlePointerEnter, onPointerMove: handlePointerMove, onPointerLeave: handlePointerLeave }));
 }
 //# sourceMappingURL=Scrubber.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Scrubber.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/Scrubber.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,iBAAiB,CAAC;AACzB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGrE;;GAEG;AACH,MAAM,UAAU,wBAAwB,CAAC,IAAa,EAAE,OAAe;IACrE,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IACpE,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC;AAC7C,CAAC;AAED,6BAA6B;AAC7B,MAAM,cAAc,GAAG,CAAC,KAAa,EAAE,EAAE;IACvC,MAAM,OAAO,GAAG,CAAC,CAAS,EAAE,EAAE;QAC5B,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7B,MAAM,OAAO,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;IACrC,MAAM,OAAO,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;IACrC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;AACnD,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CACjB,SAAe,EACf,OAAa,EACb,QAAgB,EAChB,cAAuB,EACvB,EAAE;IACF,MAAM,KAAK,GAAG,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC,GAAG,QAAQ,CAAC;IACnE,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,GAAG,KAAK,CAAC,CAAC;IACnD,OAAO,YAAY,CAAC,IAAI,EAAE,cAAc,CAAC,CAAC;AAC5C,CAAC,CAAC;AAEF,6BAA6B;AAC7B,MAAM,UAAU,GAAG,CACjB,SAAe,EACf,OAAa,EACb,QAAgB,EAChB,cAAuB,EACvB,EAAE;IACF,MAAM,KAAK,GAAG,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC,GAAG,QAAQ,CAAC;IACnE,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,GAAG,KAAK,CAAC,CAAC;IACnD,OAAO,IAAI,YAAY,CAAC,IAAI,EAAE,cAAc,CAAC,EAAE,CAAC;AAClD,CAAC,CAAC;AAEF,SAAS,mBAAmB,CAC1B,QAAiB,EACjB,OAAe,EACf,GAAW,EACX,GAAW,EACX,SAAgB,EAChB,OAAc,EACd,cAAc,GAAG,CAAC;IAElB,IAAI,SAAS,IAAI,OAAO;QACtB,OAAO,GAAG,UAAU,CAAC,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,GAC/D,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,EACvE,GAAG,CAAC;IAEN,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,OAAO,CAAC,CAAC;IACpD,OAAO,cAAc,CAAC,GAAG,CAAC,CAAC;AAC7B,CAAC;AAED,SAAS,qBAAqB,CAAC,SAAe,EAAE,OAAa,EAAE,IAAW;IACxE,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC;IACzC,MAAM,SAAS,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC;IACtC,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC;IACpD,OAAO,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,GAAG,aAAa,CAAC;AACzD,CAAC;AAED,SAAS,aAAa,CACpB,iBAA0C,EAC1C,SAAe,EACf,OAAa;IAEb,MAAM,UAAU,GAAG,qBAAqB,CACtC,SAAS,EACT,OAAO,EACP,iBAAiB,CAAC,IAAI,CACvB,CAAC;IACF,MAAM,MAAM,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC,CAAC,CAC5C,iBAAiB,CAAC,UAAU,CAC7B,CAAC,CAAC,CAAC,CACF,8BAAM,SAAS,EAAC,qBAAqB,GAAQ,CAC9C,CAAC;IACF,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC;AAC5D,CAAC;AAED,SAAS,uBAAuB,CAC9B,eAAyC,EACzC,SAAgB,EAChB,OAAc;IAEd,uBAAuB;IACvB,IAAI,eAAe,IAAI,SAAS,IAAI,OAAO,EAAE;QAC3C,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC;QACxE,uBAAuB;QACvB,IACE,MAAM,CAAC,OAAO,EAAE,IAAI,SAAS,CAAC,OAAO,EAAE;YACvC,MAAM,CAAC,OAAO,EAAE,IAAI,OAAO,CAAC,OAAO,EAAE;YAErC,OAAO,IAAI,CAAC;KACf;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AACD;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,WAAW,EACX,OAAO,EACP,WAAW,EACX,QAAQ,GAMT;IACC,OAAO,CACL,6BAAK,SAAS,EAAC,2CAA2C;QACvD,WAAW,IAAI,CACd,6BACE,SAAS,EAAC,6BAA6B,EACvC,KAAK,EAAE,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC,IAAI,EAAE;YAEjD,8BAAM,SAAS,EAAC,cAAc,IAAE,WAAW,CAAQ,CAC/C,CACP;QACA,QAAQ,IAAI,CACX,6BACE,SAAS,EAAC,iCAAiC,iBAC/B,kBAAkB,EAC9B,KAAK,EAAE,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,cAAc,GAAG,GAAG,CAAC,IAAI,EAAE,IAEhE,QAAQ,CAAC,UAAU,CAChB,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,CACL,6BAAK,SAAS,EAAC,iBAAiB;QAC9B,gCAAO;QACP,gCAAO;QACP,gCAAO,CACH,CACP,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,eAAe,CAAC,eAA2C;IACzE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAkB,CAAC;IAEzE,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,uBAAuB;QACvB,IAAI,eAAe,EAAE;YACnB,MAAM,OAAO,GAAG,eAAe,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;YACnE,IAAI,OAAO,IAAI,YAAY,KAAK,OAAO,EAAE;gBACvC,eAAe,CAAC,OAAyB,CAAC,CAAC;aAC5C;SACF;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAC;IAEpC,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhE,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC9C,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC7C,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,EAAE,YAAY,CAAC,CAAC;IAC1D,gBAAgB,CAAC,MAAM,EAAE,eAAe,EAAE,YAAY,CAAC,CAAC;IACxD,OAAO,aAAa,CAAC;AACvB,CAAC;AA0BD;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,KAAoB;IAC3C,MAAM,EACJ,SAAS,EACT,OAAO,EACP,QAAQ,EACR,SAAS,EACT,aAAa,EACb,cAAc,EACd,eAAe,EACf,SAAS,EACT,QAAQ,EACR,QAAQ,GACT,GAAG,KAAK,CAAC;IAEV,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,OAAO;YACL,SAAS,EAAE,2BAA2B;YACtC,QAAQ,EAAE,oBAAC,WAAW,OAAG;SAC1B,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GACzC,KAAK,CAAC,QAAQ,EAAkB,CAAC;IACnC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAE9D,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,uBAAuB;QACvB,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,MAAM,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,aAAa,CAC/C,uBAAuB,CACxB,CAAC;YACF,IAAI,SAAS,IAAI,eAAe,KAAK,SAAS,EAAE;gBAC9C,kBAAkB,CAAC,SAA2B,CAAC,CAAC;aACjD;SACF;IACH,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC1C,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpE,uBAAuB;IACvB,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,uBAAuB;IACvB,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CACzC,CAAC,KAAyB,EAAE,EAAE;QAC5B,eAAe;YACb,iBAAiB,CACf,wBAAwB,CACtB,eAAe,CAAC,qBAAqB,EAAE,EACvC,KAAK,CAAC,OAAO,CACd,CACF,CAAC;IACN,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,MAAM,aAAa,GAAG,eAAe,CAAC,eAAe,CAAC,CAAC;IAEvD,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnC,MAAM,OAAO,GAAG,SAAS,IAAI,eAAe,IAAI,aAAa,CAAC;QAC9D,MAAM,OAAO,GACX,SAAS,IAAI,aAAa;YACxB,CAAC,CAAC,eAAe,GAAG,aAAa;YACjC,CAAC,CAAC,cAAc,CAAC;QACrB,MAAM,eAAe,GAAG,uBAAuB,CAC7C,KAAK,CAAC,QAAQ,EACd,SAAS,EACT,OAAO,CACR,CAAC;QACF,MAAM,iBAAiB,GACrB,KAAK,CAAC,QAAQ,IAAI,eAAe,IAAI,SAAS,IAAI,OAAO;YACvD,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAE,OAAO,CAAC;YACnD,CAAC,CAAC,SAAS,CAAC;QAChB,MAAM,WAAW,GAAG,mBAAmB,CACrC,CAAC,CAAC,QAAQ,EACV,OAAO,EACP,CAAC,EACD,aAAa,EACb,SAAS,EACT,OAAO,EACP,cAAc,CACf,CAAC;QACF,OAAO,CACL,oBAAC,WAAW,IACV,WAAW,EAAE,OAAO,EACpB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,iBAAiB,GAC3B,CACH,CAAC;IACJ,CAAC,EAAE;QACD,SAAS;QACT,eAAe;QACf,eAAe;QACf,aAAa;QACb,cAAc;QACd,SAAS;QACT,OAAO;QACP,cAAc;QACd,QAAQ;QACR,aAAa;QACb,KAAK,CAAC,QAAQ;KACf,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,CAAC,EACP,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,aAAa,EAClB,QAAQ,EAAC,EAAE,EACX,QAAQ,EAAC,EAAE,EACX,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,CAAC,eAAe,CAAC,EACzB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,SAAS,EACrB,kBAAkB,EAAE;YAClB,cAAc,EAAE,kBAAkB;YAClC,aAAa,EAAE,iBAAiB;YAChC,cAAc,EAAE,kBAAkB;SACnC,GACD,CACH,CAAC;AACJ,CAAC","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\n// istanbul ignore next - WIP\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\n// istanbul ignore next - WIP\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  // istanbul ignore else\n  if (dateMarkerProps && startDate && endDate) {\n    const inDate = dateMarkerProps.date ? dateMarkerProps.date : new Date();\n    // istanbul ignore else\n    if (\n      inDate.getTime() >= startDate.getTime() &&\n      inDate.getTime() <= endDate.getTime()\n    )\n      return true;\n  }\n  return false;\n}\n/**\n * @internal\n */\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    // istanbul ignore else\n    if (sliderContainer) {\n      const element = sliderContainer.querySelector(\".iui-slider-thumb\");\n      if (element && thumbElement !== element) {\n        setThumbElement(element as HTMLDivElement);\n      }\n    }\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 */\nexport interface ScrubberProps extends CommonProps {\n  currentDuration: number;\n  totalDuration: number;\n  isPlaying: boolean;\n  inMiniMode: 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}\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  } = props;\n\n  const thumbProps = () => {\n    return {\n      className: \"components-timeline-thumb\",\n      children: <CustomThumb />,\n    };\n  };\n\n  const sliderRef = React.useRef<HTMLDivElement>(null);\n  const [sliderContainer, setSliderContainer] =\n    React.useState<HTMLDivElement>();\n  const [pointerPercent, setPointerPercent] = React.useState(0);\n\n  React.useLayoutEffect(() => {\n    // istanbul ignore else\n    if (sliderRef.current) {\n      const container = sliderRef.current.querySelector(\n        \".iui-slider-container\"\n      );\n      if (container && sliderContainer !== container) {\n        setSliderContainer(container as HTMLDivElement);\n      }\n    }\n  }, [sliderContainer]);\n\n  const tooltipProps = React.useCallback(() => {\n    return { visible: false };\n  }, []);\n\n  const [showRailTooltip, setShowRailTooltip] = React.useState(false);\n\n  // istanbul ignore next\n  const handlePointerEnter = React.useCallback(() => {\n    setShowRailTooltip(true);\n  }, []);\n\n  // istanbul ignore next\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);\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={sliderRef}\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={thumbProps}\n      tickLabels={tickLabel}\n      railContainerProps={{\n        onPointerEnter: handlePointerEnter,\n        onPointerMove: handlePointerMove,\n        onPointerLeave: handlePointerLeave,\n      }}\n    />\n  );\n}\n"]}
+{"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\n// istanbul ignore next - WIP\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\n// istanbul ignore next - WIP\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  // istanbul ignore else\n  if (dateMarkerProps && startDate && endDate) {\n    const inDate = dateMarkerProps.date ? dateMarkerProps.date : new Date();\n    // istanbul ignore else\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 */\nexport interface ScrubberProps extends CommonProps {\n  currentDuration: number;\n  totalDuration: number;\n  isPlaying: boolean;\n  inMiniMode: 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}\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  } = 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  // istanbul ignore next\n  const handlePointerEnter = React.useCallback(() => {\n    setShowRailTooltip(true);\n  }, []);\n\n  // istanbul ignore next\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    />\n  );\n}\n"]}

package/lib/esm/imodel-components-react/timeline/Scrubber.scss

@@ -3,8 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 @import "~@itwin/core-react/lib/cjs/core-react/z-index";
-// the following overrides default iui-slider-thumb settings from  iTwinUI
-div.components-timeline-thumb.iui-slider-thumb {
+
+.components-timeline-thumb {
   display: flex;
   justify-content: center;
   align-items: center;
@@ -15,14 +15,14 @@ div.components-timeline-thumb.iui-slider-thumb {
   border-radius: var(--iui-border-radius-1);
   border: 1px solid var(--iui-color-border);
   transform: translateX(-19.2px);
-  top: 4px;
 }
 
 .components-timeline-rail-marker-container {
-  width: 100%;
   position: absolute;
+  width: 100%;
+  top: 0;
 
-  div.components-timeline-tooltip {
+  .components-timeline-tooltip {
     @include uicore-z-index(tooltip);
     position: absolute;
     top: -8px;

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

@@ -1 +1 @@
-{"version":3,"file":"SolarTimeline.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SolarTimeline.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAKH,OAAO,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAc3D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAyKtD,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,WAAW,CAA4B;IAC/C,OAAO,CAAC,SAAS,CAA4B;IAC7C,OAAO,CAAC,aAAa,CAAK;IAC1B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,mBAAmB,CAEzB;IACF,OAAO,CAAC,UAAU,CAAsD;IACxE,OAAO,CAAC,aAAa,CAEnB;IACF,OAAO,CAAC,UAAU,CAAmD;IACrE,OAAO,CAAC,WAAW,CAAuD;IAC1E,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,OAAO,CAab;IAEF,OAAO,CAAC,UAAU,CAA6C;IAC/D,OAAO,CAAC,QAAQ,CAAqC;IACrD,OAAO,CAAC,QAAQ,CAAqC;IACrD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAS5B;gBAEU,KAAK,EAAE,2BAA2B;IA8C9B,oBAAoB;IAMpC,OAAO,CAAC,gBAAgB,CA6CtB;IAEF,OAAO,CAAC,KAAK;IAYb,OAAO,CAAC,QAAQ,CAed;IAGF,OAAO,CAAC,OAAO,CAab;IAEF,OAAO,CAAC,wBAAwB;IAWhC;qBACiB;IACjB,OAAO,CAAC,WAAW,CAoCjB;IAEF,OAAO,CAAC,cAAc,CA2BpB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;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,CAajB;IAEF,OAAO,CAAC,kBAAkB,CAKxB;IAEF,OAAO,CAAC,4BAA4B,CAUlC;IAEK,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IASxB,MAAM;CAiNvB"}
+{"version":3,"file":"SolarTimeline.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SolarTimeline.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAKH,OAAO,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAc3D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAuJtD,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,WAAW,CAA4B;IAC/C,OAAO,CAAC,SAAS,CAA4B;IAC7C,OAAO,CAAC,aAAa,CAAK;IAC1B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,mBAAmB,CAEzB;IACF,OAAO,CAAC,UAAU,CAAsD;IACxE,OAAO,CAAC,aAAa,CAEnB;IACF,OAAO,CAAC,UAAU,CAAmD;IACrE,OAAO,CAAC,WAAW,CAAuD;IAC1E,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,OAAO,CAab;IAEF,OAAO,CAAC,UAAU,CAA6C;IAC/D,OAAO,CAAC,QAAQ,CAAqC;IACrD,OAAO,CAAC,QAAQ,CAAqC;IACrD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAS5B;gBAEU,KAAK,EAAE,2BAA2B;IA8C9B,oBAAoB;IAMpC,OAAO,CAAC,gBAAgB,CA6CtB;IAEF,OAAO,CAAC,KAAK;IAYb,OAAO,CAAC,QAAQ,CAed;IAGF,OAAO,CAAC,OAAO,CAab;IAEF,OAAO,CAAC,wBAAwB;IAWhC;qBACiB;IACjB,OAAO,CAAC,WAAW,CAoCjB;IAEF,OAAO,CAAC,cAAc,CA2BpB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;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,CAajB;IAEF,OAAO,CAAC,kBAAkB,CAKxB;IAEF,OAAO,CAAC,4BAA4B,CAUlC;IAEK,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IASxB,MAAM;CAgNvB"}

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

@@ -32,24 +32,8 @@ const addZero = (i) => {
     return i < 10 ? `0${i}` : i;
 };
 function Timeline(props) {
-    const sliderRef = React.useRef(null);
-    const [sliderContainer, setSliderContainer] = React.useState();
+    const [sliderContainer, setSliderContainer] = React.useState(null);
     const [pointerPercent, setPointerPercent] = React.useState(0);
-    React.useLayoutEffect(() => {
-        // istanbul ignore else
-        if (sliderRef.current) {
-            const container = sliderRef.current.querySelector(".iui-slider-container");
-            if (container && sliderContainer !== container) {
-                setSliderContainer(container);
-            }
-        }
-    }, [sliderContainer]);
-    const thumbProps = () => {
-        return {
-            className: "components-timeline-thumb",
-            children: React.createElement(CustomThumb, null),
-        };
-    };
     const tooltipProps = React.useCallback(() => {
         return { visible: false };
     }, []);
@@ -65,7 +49,7 @@ function Timeline(props) {
             setPointerPercent(getPercentageOfRectangle(sliderContainer.getBoundingClientRect(), event.clientX));
     }, [sliderContainer]);
     const { formatTick, formatTime, onChange, onUpdate, dayStartMs, sunSetOffsetMs, sunRiseOffsetMs, currentTimeOffsetMs, isPlaying, } = props;
-    const thumbHasFocus = useFocusedThumb(sliderContainer);
+    const thumbHasFocus = useFocusedThumb(sliderContainer ?? undefined);
     const tickLabel = React.useMemo(() => {
         const showTip = isPlaying || showRailTooltip || thumbHasFocus;
         const totalDuration = sunSetOffsetMs - sunRiseOffsetMs;
@@ -87,17 +71,16 @@ function Timeline(props) {
         formatTime,
         dayStartMs,
     ]);
-    const className = classnames("solar-slider", props.className, formatTick && "showticks");
+    const className = classnames("solar-timeline", props.className, formatTick && "showticks");
     const sunRiseFormat = formatTime(dayStartMs + sunRiseOffsetMs);
     const sunSetFormat = formatTime(dayStartMs + sunSetOffsetMs);
     return (React.createElement("div", { className: className },
         React.createElement(Tooltip, { content: sunRiseFormat },
             React.createElement("span", { className: "sunrise" }, "\u2600")),
-        React.createElement(Slider, { ref: sliderRef, className: className, step: millisecPerMinute, min: sunRiseOffsetMs, max: sunSetOffsetMs, minLabel: "", maxLabel: "", onUpdate: onUpdate, onChange: onChange, values: [currentTimeOffsetMs], tooltipProps: tooltipProps, thumbProps: thumbProps, tickLabels: tickLabel, railContainerProps: {
-                onPointerEnter: handlePointerEnter,
-                onPointerMove: handlePointerMove,
-                onPointerLeave: handlePointerLeave,
-            } }),
+        React.createElement(Slider, { ref: setSliderContainer, className: "solar-slider", step: millisecPerMinute, min: sunRiseOffsetMs, max: sunSetOffsetMs, minLabel: "", maxLabel: "", onUpdate: onUpdate, onChange: onChange, values: [currentTimeOffsetMs], tooltipProps: tooltipProps, thumbProps: () => ({
+                className: "components-timeline-thumb",
+                children: React.createElement(CustomThumb, null),
+            }), tickLabels: tickLabel, onPointerEnter: handlePointerEnter, onPointerMove: handlePointerMove, onPointerLeave: handlePointerLeave }),
         React.createElement(Tooltip, { content: sunSetFormat },
             React.createElement("span", { className: "sunset" }, "\u263D"))));
 }
@@ -401,7 +384,7 @@ export class SolarTimeline extends React.PureComponent {
                                     minutes: localTime.getMinutes(),
                                     seconds: 0,
                                 }, timeDisplay: TimeDisplay.H12MC, onTimeChange: this._onTimeChanged })))),
-                React.createElement(Timeline, { className: "solar-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(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("div", { className: "speed-container" },
                     React.createElement("span", { title: this._speedLabel },
                         speed,

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

@@ -1 +1 @@
-{"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\n// component is in alpha state - it may change after usability testing - test coverage not complete\n/* istanbul ignore file */\n\nimport \"./SolarTimeline.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Slider, Text, Tooltip } from \"@itwin/itwinui-react\";\n\nimport type { HSVColor } from \"@itwin/core-common\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport { RelativePosition, TimeDisplay } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon, Popup } from \"@itwin/core-react\";\nimport type { TimeSpec } from \"@itwin/components-react\";\nimport {\n  adjustDateToTimezone,\n  DatePicker,\n  TimeField,\n  UiComponents,\n} from \"@itwin/components-react\";\nimport { HueSlider } from \"../color/HueSlider\";\nimport { SaturationPicker } from \"../color/SaturationPicker\";\nimport { ColorSwatch } from \"../color/Swatch\";\nimport type { SolarDataProvider } from \"./interfaces\";\nimport { PlayButton } from \"./PlayerButton\";\nimport { SpeedTimeline } from \"./SpeedTimeline\";\nimport {\n  CustomThumb,\n  getPercentageOfRectangle,\n  RailMarkers,\n  useFocusedThumb,\n} from \"./Scrubber\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { SvgCalendar, SvgLoop, SvgSettings } from \"@itwin/itwinui-icons-react\";\n\n// cSpell:ignore millisec solarsettings showticks shadowcolor solartimeline datepicker millisecs\n\nconst millisecPerMinute = 1000 * 60;\nconst millisecPerHour = millisecPerMinute * 60;\n// const millisecPerDay = millisecPerHour * 24;\nconst defaultPlaybackDuration = 40 * 1000; // 40 seconds\nconst addZero = (i: number) => {\n  return i < 10 ? `0${i}` : i;\n};\n\ninterface TimelineProps extends CommonProps {\n  dayStartMs: number;\n  sunRiseOffsetMs: number;\n  sunSetOffsetMs: number;\n  currentTimeOffsetMs: number;\n  isPlaying: boolean;\n  formatTick?: (millisec: number) => string;\n  formatTime: (millisec: number) => string;\n  onChange?: (values: ReadonlyArray<number>) => void;\n  onUpdate?: (values: ReadonlyArray<number>) => void;\n}\nfunction Timeline(props: TimelineProps) {\n  const sliderRef = React.useRef<HTMLDivElement>(null);\n  const [sliderContainer, setSliderContainer] =\n    React.useState<HTMLDivElement>();\n  const [pointerPercent, setPointerPercent] = React.useState(0);\n\n  React.useLayoutEffect(() => {\n    // istanbul ignore else\n    if (sliderRef.current) {\n      const container = sliderRef.current.querySelector(\n        \".iui-slider-container\"\n      );\n      if (container && sliderContainer !== container) {\n        setSliderContainer(container as HTMLDivElement);\n      }\n    }\n  }, [sliderContainer]);\n\n  const thumbProps = () => {\n    return {\n      className: \"components-timeline-thumb\",\n      children: <CustomThumb />,\n    };\n  };\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 {\n    formatTick,\n    formatTime,\n    onChange,\n    onUpdate,\n    dayStartMs,\n    sunSetOffsetMs,\n    sunRiseOffsetMs,\n    currentTimeOffsetMs,\n    isPlaying,\n  } = props;\n\n  const thumbHasFocus = useFocusedThumb(sliderContainer);\n\n  const tickLabel = React.useMemo(() => {\n    const showTip = isPlaying || showRailTooltip || thumbHasFocus;\n    const totalDuration = sunSetOffsetMs - sunRiseOffsetMs;\n    const percent =\n      isPlaying || thumbHasFocus\n        ? (currentTimeOffsetMs - sunRiseOffsetMs) / totalDuration\n        : pointerPercent;\n    const tooltipText = formatTime(\n      isPlaying || thumbHasFocus\n        ? dayStartMs + currentTimeOffsetMs\n        : dayStartMs + (sunRiseOffsetMs + pointerPercent * totalDuration)\n    );\n    return (\n      <RailMarkers\n        showToolTip={showTip}\n        percent={percent}\n        tooltipText={tooltipText}\n      />\n    );\n  }, [\n    isPlaying,\n    showRailTooltip,\n    thumbHasFocus,\n    sunSetOffsetMs,\n    sunRiseOffsetMs,\n    currentTimeOffsetMs,\n    pointerPercent,\n    formatTime,\n    dayStartMs,\n  ]);\n\n  const className = classnames(\n    \"solar-slider\",\n    props.className,\n    formatTick && \"showticks\"\n  );\n  const sunRiseFormat = formatTime(dayStartMs + sunRiseOffsetMs);\n  const sunSetFormat = formatTime(dayStartMs + sunSetOffsetMs);\n  return (\n    <div className={className}>\n      <Tooltip content={sunRiseFormat}>\n        <span className=\"sunrise\">&#x2600;</span>\n      </Tooltip>\n      <Slider\n        ref={sliderRef}\n        className={className}\n        step={millisecPerMinute}\n        min={sunRiseOffsetMs}\n        max={sunSetOffsetMs}\n        minLabel=\"\"\n        maxLabel=\"\"\n        onUpdate={onUpdate}\n        onChange={onChange}\n        values={[currentTimeOffsetMs]}\n        tooltipProps={tooltipProps}\n        thumbProps={thumbProps}\n        tickLabels={tickLabel}\n        railContainerProps={{\n          onPointerEnter: handlePointerEnter,\n          onPointerMove: handlePointerMove,\n          onPointerLeave: handlePointerLeave,\n        }}\n      />\n      <Tooltip content={sunSetFormat}>\n        <span className=\"sunset\">&#x263D;</span>\n      </Tooltip>\n    </div>\n  );\n}\n\ninterface SolarTimelineComponentProps {\n  dataProvider: SolarDataProvider; // provides date, sunrise, sunset in millisecs, 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 _datePicker: HTMLElement | null = null;\n  private _settings: HTMLElement | null = null;\n  private _requestFrame = 0;\n  private _unmounted = false;\n  private _timeLastCycle = 0;\n  private _totalPlayTime = 0;\n  private _settingsPopupTitle = UiIModelComponents.translate(\n    \"solarsettings.shadowcolor\"\n  );\n  private _playLabel = UiIModelComponents.translate(\"solartimeline.play\");\n  private _settingLabel = UiIModelComponents.translate(\n    \"solartimeline.settings\"\n  );\n  private _loopLabel = UiIModelComponents.translate(\"timeline.repeat\");\n  private _speedLabel = UiIModelComponents.translate(\"solartimeline.speed\");\n  private _dateTimeLabel = UiIModelComponents.translate(\n    \"solartimeline.dateTime\"\n  );\n\n  private _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  private _timeLabel = UiComponents.translate(\"datepicker.time\");\n  private _amLabel = UiComponents.translate(\"time.am\");\n  private _pmLabel = UiComponents.translate(\"time.pm\");\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  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    // istanbul ignore else\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      // istanbul ignore else\n      if (this.props.onPlayPause) this.props.onPlayPause(true);\n    });\n  }\n\n  // user clicked pause button\n  private _onPause = () => {\n    // istanbul ignore if\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    // istanbul ignore else\n    if (this.props.onPlayPause) this.props.onPlayPause(false);\n  };\n\n  // user clicked play button\n  private _onPlay = () => {\n    // istanbul ignore if\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  /** note the day passed in is in the time of the current user not in project time because the date picker works in\n   * local time  */\n  private _onDayClick = (day: Date) => {\n    const selectedDate = new Date(\n      day.getTime() + this.state.currentTimeOffsetMs\n    );\n    this.props.dataProvider.setDateAndTime(selectedDate);\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    const sunOffsetMs = this.ensureRange(\n      this.state.currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs\n    );\n    this.setPlaybackTimeBySunTime(sunOffsetMs, sunRiseOffsetMs, sunDeltaMs);\n\n    /** call dataProvider to update display style */\n    if (this.props.dataProvider.onTimeChanged)\n      this.props.dataProvider.onTimeChanged(this.props.dataProvider.timeOfDay);\n\n    this.setState(\n      {\n        dayStartMs,\n        sunRiseOffsetMs,\n        sunSetOffsetMs,\n        currentTimeOffsetMs: sunOffsetMs,\n        sunDeltaMs,\n        isDateOpened: false,\n      },\n      () => {\n        this._timeLastCycle = new Date().getTime();\n      }\n    );\n  };\n\n  private _onTimeChanged = (time: TimeSpec) => {\n    // compute the current date (with time)\n    const dayStartMs = this.props.dataProvider.dayStartMs;\n    const sunTime =\n      time.hours * millisecPerHour + time.minutes * millisecPerMinute;\n    const dateWithNewTime = new Date(dayStartMs + sunTime);\n    this.props.dataProvider.setDateAndTime(dateWithNewTime, true);\n\n    // notify the provider to update style\n    if (this.props.dataProvider.onTimeChanged)\n      this.props.dataProvider.onTimeChanged(dateWithNewTime);\n\n    const currentTimeOffsetMs = this.ensureRange(\n      sunTime,\n      this.state.sunRiseOffsetMs,\n      this.state.sunSetOffsetMs\n    );\n\n    this.setPlaybackTimeBySunTime(\n      currentTimeOffsetMs,\n      this.state.sunRiseOffsetMs,\n      this.state.sunDeltaMs\n    );\n    this._timeLastCycle = new Date().getTime();\n\n    // update the timeline\n    this.setState({ currentTimeOffsetMs });\n  };\n\n  private _onCloseDayPicker = () => {\n    this.setState({ isDateOpened: false });\n  };\n\n  private _onOpenDayPicker = () => {\n    this.setState((prevState) => ({ isDateOpened: !prevState.isDateOpened }));\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 = (millisec: number) => {\n    const date = new Date(millisec);\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 = addZero(date.getMinutes());\n    const abbrev =\n      hours < 12 ? this._amLabel : hours === 24 ? this._amLabel : this._pmLabel;\n    hours = hours > 12 ? hours - 12 : hours;\n    return `${hours}:${minutes} ${abbrev}`;\n  };\n\n  private _onPresetColorPick = (shadowColor: ColorDef) => {\n    this.setState(\n      { shadowColor },\n      () => (this.props.dataProvider.shadowColor = shadowColor)\n    );\n  };\n\n  private _handleHueOrSaturationChange = (hueOrSaturation: HSVColor) => {\n    if (hueOrSaturation.s === 0)\n      // for a ColorDef to be created from hsv s can't be 0\n      hueOrSaturation = hueOrSaturation.clone(undefined, 0.5);\n\n    const shadowColor = hueOrSaturation.toColorDef();\n    this.setState(\n      { shadowColor },\n      () => (this.props.dataProvider.shadowColor = shadowColor)\n    );\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,\n      loop,\n      currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs,\n    } = this.state;\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      this._months[localTime.getMonth()]\n    }, ${localTime.getDate()}`;\n\n    const colorSwatchStyle: React.CSSProperties = {\n      width: `100%`,\n      height: `100%`,\n    };\n\n    return (\n      <div className={\"solar-timeline-wrapper\"}>\n        <div className=\"header\">\n          <PlayButton\n            tooltip={this._playLabel}\n            className=\"play-button\"\n            isPlaying={this.state.isPlaying}\n            onPlay={this._onPlay}\n            onPause={this._onPause}\n          />\n          <button\n            data-testid=\"solar-date-time-button\"\n            title={this._dateTimeLabel}\n            className=\"current-date\"\n            ref={(element) => (this._datePicker = element)}\n            onClick={this._onOpenDayPicker}\n          >\n            <span>{formattedDate}</span>\n            <span>/</span>\n            <span>{formattedTime}</span>\n            <span className=\"icon\">\n              <Icon iconSpec={<SvgCalendar />} />\n            </span>\n          </button>\n          <Popup\n            style={{ border: \"none\" }}\n            offset={11}\n            target={this._datePicker}\n            isOpen={this.state.isDateOpened}\n            onClose={this._onCloseDayPicker}\n            position={RelativePosition.Top}\n          >\n            <div\n              className=\"components-date-picker-calendar-popup-panel\"\n              data-testid=\"components-date-picker-calendar-popup-panel\"\n            >\n              <DatePicker\n                selected={localTime}\n                onDateChange={this._onDayClick}\n                showFocusOutline={false}\n              />\n              <div className=\"time-container\">\n                <Text variant=\"body\" className=\"time-label\">\n                  {this._timeLabel}\n                </Text>\n                <TimeField\n                  time={{\n                    hours: localTime.getHours(),\n                    minutes: localTime.getMinutes(),\n                    seconds: 0,\n                  }}\n                  timeDisplay={TimeDisplay.H12MC}\n                  onTimeChange={this._onTimeChanged}\n                />\n              </div>\n            </div>\n          </Popup>\n          <Timeline\n            className=\"solar-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          <div className=\"speed-container\">\n            <span title={this._speedLabel}>{speed}x</span>\n            <SpeedTimeline\n              className=\"speed\"\n              onChange={this._onSpeedChange}\n              speed={this.state.speed}\n            />\n          </div>\n          {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events */}\n          <span\n            title={this._loopLabel}\n            className={classnames(\n              \"icon\",\n              !loop && \"no-loop-playback\",\n              loop && \"loop-playback\"\n            )}\n            onClick={this._onToggleLoop}\n            role=\"button\"\n            tabIndex={-1}\n          >\n            <Icon iconSpec={<SvgLoop />} />\n          </span>\n          <button\n            data-testid=\"shadow-settings-button\"\n            title={this._settingLabel}\n            className=\"shadow-settings-button\"\n            ref={(element) => (this._settings = element)}\n            onClick={this._onOpenSettingsPopup}\n          >\n            <span className=\"icon\">\n              <Icon iconSpec={<SvgSettings />} />\n            </span>\n          </button>\n          <Popup\n            className=\"shadow-settings-popup\"\n            target={this._settings}\n            offset={11}\n            isOpen={this.state.isSettingsOpened}\n            onClose={this._onCloseSettingsPopup}\n            position={RelativePosition.Top}\n          >\n            <div className=\"shadow-settings-popup-container\">\n              <div className=\"shadow-settings-header\">\n                {this._settingsPopupTitle}\n              </div>\n              <div className=\"shadow-settings-color\">\n                <div className=\"shadow-settings-color-top\">\n                  <SaturationPicker\n                    hsv={this.state.shadowColor.toHSV()}\n                    onSaturationChange={this._handleHueOrSaturationChange}\n                  />\n                </div>\n                <div className=\"shadow-settings-color-bottom\">\n                  <div className=\"shadow-settings-color-bottom-left\">\n                    <HueSlider\n                      hsv={this.state.shadowColor.toHSV()}\n                      onHueChange={this._handleHueOrSaturationChange}\n                      isHorizontal={true}\n                    />\n                  </div>\n                  <div className=\"shadow-settings-color-bottom-right\">\n                    <ColorSwatch\n                      style={colorSwatchStyle}\n                      colorDef={this.state.shadowColor}\n                      round={false}\n                    />\n                  </div>\n                </div>\n              </div>\n              <div className=\"shadow-settings-color-presets\">\n                <ColorSwatch\n                  colorDef={this._presetColors[0]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[1]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[2]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[3]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[4]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[5]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[6]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[7]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n              </div>\n            </div>\n          </Popup>\n        </div>\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"SolarTimeline.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/SolarTimeline.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,mGAAmG;AACnG,0BAA0B;AAE1B,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAG7D,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEtE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,oBAAoB,EACpB,UAAU,EACV,SAAS,EACT,YAAY,GACb,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EACL,WAAW,EACX,wBAAwB,EACxB,WAAW,EACX,eAAe,GAChB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAE/E,gGAAgG;AAEhG,MAAM,iBAAiB,GAAG,IAAI,GAAG,EAAE,CAAC;AACpC,MAAM,eAAe,GAAG,iBAAiB,GAAG,EAAE,CAAC;AAC/C,+CAA+C;AAC/C,MAAM,uBAAuB,GAAG,EAAE,GAAG,IAAI,CAAC,CAAC,aAAa;AACxD,MAAM,OAAO,GAAG,CAAC,CAAS,EAAE,EAAE;IAC5B,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AAC9B,CAAC,CAAC;AAcF,SAAS,QAAQ,CAAC,KAAoB;IACpC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GACzC,KAAK,CAAC,QAAQ,CAAwB,IAAI,CAAC,CAAC;IAC9C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAE9D,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC1C,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpE,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CACzC,CAAC,KAAyB,EAAE,EAAE;QAC5B,eAAe;YACb,iBAAiB,CACf,wBAAwB,CACtB,eAAe,CAAC,qBAAqB,EAAE,EACvC,KAAK,CAAC,OAAO,CACd,CACF,CAAC;IACN,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,MAAM,EACJ,UAAU,EACV,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,SAAS,GACV,GAAG,KAAK,CAAC;IAEV,MAAM,aAAa,GAAG,eAAe,CAAC,eAAe,IAAI,SAAS,CAAC,CAAC;IAEpE,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnC,MAAM,OAAO,GAAG,SAAS,IAAI,eAAe,IAAI,aAAa,CAAC;QAC9D,MAAM,aAAa,GAAG,cAAc,GAAG,eAAe,CAAC;QACvD,MAAM,OAAO,GACX,SAAS,IAAI,aAAa;YACxB,CAAC,CAAC,CAAC,mBAAmB,GAAG,eAAe,CAAC,GAAG,aAAa;YACzD,CAAC,CAAC,cAAc,CAAC;QACrB,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,IAAI,aAAa;YACxB,CAAC,CAAC,UAAU,GAAG,mBAAmB;YAClC,CAAC,CAAC,UAAU,GAAG,CAAC,eAAe,GAAG,cAAc,GAAG,aAAa,CAAC,CACpE,CAAC;QACF,OAAO,CACL,oBAAC,WAAW,IACV,WAAW,EAAE,OAAO,EACpB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,GACxB,CACH,CAAC;IACJ,CAAC,EAAE;QACD,SAAS;QACT,eAAe;QACf,aAAa;QACb,cAAc;QACd,eAAe;QACf,mBAAmB;QACnB,cAAc;QACd,UAAU;QACV,UAAU;KACX,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,UAAU,CAC1B,gBAAgB,EAChB,KAAK,CAAC,SAAS,EACf,UAAU,IAAI,WAAW,CAC1B,CAAC;IACF,MAAM,aAAa,GAAG,UAAU,CAAC,UAAU,GAAG,eAAe,CAAC,CAAC;IAC/D,MAAM,YAAY,GAAG,UAAU,CAAC,UAAU,GAAG,cAAc,CAAC,CAAC;IAC7D,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS;QACvB,oBAAC,OAAO,IAAC,OAAO,EAAE,aAAa;YAC7B,8BAAM,SAAS,EAAC,SAAS,aAAgB,CACjC;QACV,oBAAC,MAAM,IACL,GAAG,EAAE,kBAAkB,EACvB,SAAS,EAAC,cAAc,EACxB,IAAI,EAAE,iBAAiB,EACvB,GAAG,EAAE,eAAe,EACpB,GAAG,EAAE,cAAc,EACnB,QAAQ,EAAC,EAAE,EACX,QAAQ,EAAC,EAAE,EACX,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,CAAC,mBAAmB,CAAC,EAC7B,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,GAAG,EAAE,CAAC,CAAC;gBACjB,SAAS,EAAE,2BAA2B;gBACtC,QAAQ,EAAE,oBAAC,WAAW,OAAG;aAC1B,CAAC,EACF,UAAU,EAAE,SAAS,EACrB,cAAc,EAAE,kBAAkB,EAClC,aAAa,EAAE,iBAAiB,EAChC,cAAc,EAAE,kBAAkB,GAClC;QACF,oBAAC,OAAO,IAAC,OAAO,EAAE,YAAY;YAC5B,8BAAM,SAAS,EAAC,QAAQ,aAAgB,CAChC,CACN,CACP,CAAC;AACJ,CAAC;AAyBD;;GAEG;AACH,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,aAGxC;IAiDC,YAAY,KAAkC;QAC5C,KAAK,CAAC,KAAK,CAAC,CAAC;QAjDP,gBAAW,GAAuB,IAAI,CAAC;QACvC,cAAS,GAAuB,IAAI,CAAC;QACrC,kBAAa,GAAG,CAAC,CAAC;QAClB,eAAU,GAAG,KAAK,CAAC;QACnB,mBAAc,GAAG,CAAC,CAAC;QACnB,mBAAc,GAAG,CAAC,CAAC;QACnB,wBAAmB,GAAG,kBAAkB,CAAC,SAAS,CACxD,2BAA2B,CAC5B,CAAC;QACM,eAAU,GAAG,kBAAkB,CAAC,SAAS,CAAC,oBAAoB,CAAC,CAAC;QAChE,kBAAa,GAAG,kBAAkB,CAAC,SAAS,CAClD,wBAAwB,CACzB,CAAC;QACM,eAAU,GAAG,kBAAkB,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;QAC7D,gBAAW,GAAG,kBAAkB,CAAC,SAAS,CAAC,qBAAqB,CAAC,CAAC;QAClE,mBAAc,GAAG,kBAAkB,CAAC,SAAS,CACnD,wBAAwB,CACzB,CAAC;QAEM,YAAO,GAAG;YAChB,YAAY,CAAC,SAAS,CAAC,qBAAqB,CAAC;YAC7C,YAAY,CAAC,SAAS,CAAC,sBAAsB,CAAC;YAC9C,YAAY,CAAC,SAAS,CAAC,mBAAmB,CAAC;YAC3C,YAAY,CAAC,SAAS,CAAC,mBAAmB,CAAC;YAC3C,YAAY,CAAC,SAAS,CAAC,iBAAiB,CAAC;YACzC,YAAY,CAAC,SAAS,CAAC,kBAAkB,CAAC;YAC1C,YAAY,CAAC,SAAS,CAAC,kBAAkB,CAAC;YAC1C,YAAY,CAAC,SAAS,CAAC,oBAAoB,CAAC;YAC5C,YAAY,CAAC,SAAS,CAAC,uBAAuB,CAAC;YAC/C,YAAY,CAAC,SAAS,CAAC,qBAAqB,CAAC;YAC7C,YAAY,CAAC,SAAS,CAAC,sBAAsB,CAAC;YAC9C,YAAY,CAAC,SAAS,CAAC,sBAAsB,CAAC;SAC/C,CAAC;QAEM,eAAU,GAAG,YAAY,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;QACvD,aAAQ,GAAG,YAAY,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7C,aAAQ,GAAG,YAAY,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;QACpC,kBAAa,GAAG;YAC/B,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC;YACjC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC;YACtC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,QAAQ,CAAC;YACrC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC;YACtC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,UAAU,CAAC;YACvC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC;YACtC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC;YAChC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC;SACvC,CAAC;QAqDF,uFAAuF;QAC/E,qBAAgB,GAAG,CAAC,UAAkB,EAAE,EAAE;YAChD,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,UAAU,EAAE;gBAC5C,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;gBAChD,OAAO;aACR;YAED,MAAM,WAAW,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;YACzC,IAAI,CAAC,cAAc,IAAI,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC;YACzD,IAAI,CAAC,cAAc,GAAG,WAAW,CAAC;YAClC,IAAI,eAAe,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC;YACxE,IAAI,eAAe,GAAG,CAAC;gBAAE,eAAe,GAAG,CAAC,CAAC;YAE7C,IAAI,eAAe,GAAG,IAAI,CAAC;YAE3B,+HAA+H;YAC/H,IAAI,aAAa,GAAG,IAAI,CAAC,KAAK,CAC5B,IAAI,CAAC,KAAK,CAAC,eAAe,GAAG,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CACrE,CAAC;YAEF,IAAI,eAAe,GAAG,IAAI,EAAE;gBAC1B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;oBACpB,eAAe,GAAG,KAAK,CAAC;oBACxB,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;oBAC1C,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;iBACjD;qBAAM;oBACL,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC;oBAC3C,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC;iBACzB;aACF;YAED,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE;gBACzC,MAAM,cAAc,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,aAAa,CAAC,CAAC;gBACvE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;aACvD;YAED,IAAI,CAAC,QAAQ,CACX,EAAE,SAAS,EAAE,eAAe,EAAE,mBAAmB,EAAE,aAAa,EAAE,EAClE,GAAG,EAAE;gBACH,IAAI,eAAe;oBACjB,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,qBAAqB,CAC/C,IAAI,CAAC,gBAAgB,CACtB,CAAC;YACN,CAAC,CACF,CAAC;QACJ,CAAC,CAAC;QAaF,4BAA4B;QACpB,aAAQ,GAAG,GAAG,EAAE;YACtB,qBAAqB;YACrB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS;gBAAE,OAAO;YAElC,MAAM,WAAW,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;YACzC,IAAI,CAAC,cAAc,IAAI,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC;YAEzD,yBAAyB;YACzB,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;YAEhD,eAAe;YACf,IAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;YAEpC,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW;gBAAE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC5D,CAAC,CAAC;QAEF,2BAA2B;QACnB,YAAO,GAAG,GAAG,EAAE;YACrB,qBAAqB;YACrB,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS;gBAAE,OAAO;YAEjC,IACE,IAAI,CAAC,KAAK,CAAC,mBAAmB,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc;gBAC3D,IAAI,CAAC,KAAK,CAAC,mBAAmB,IAAI,IAAI,CAAC,KAAK,CAAC,eAAe,EAC5D;gBACA,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC;gBACxB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;aACxC;iBAAM;gBACL,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;aAC5C;QACH,CAAC,CAAC;QAaF;yBACiB;QACT,gBAAW,GAAG,CAAC,GAAS,EAAE,EAAE;YAClC,MAAM,YAAY,GAAG,IAAI,IAAI,CAC3B,GAAG,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAC/C,CAAC;YACF,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;YACrD,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC;YACtD,MAAM,eAAe,GACnB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,UAAU,CAAC;YACzD,MAAM,cAAc,GAClB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,OAAO,EAAE,GAAG,UAAU,CAAC;YACxD,MAAM,UAAU,GAAG,cAAc,GAAG,eAAe,CAAC;YAEpD,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAClC,IAAI,CAAC,KAAK,CAAC,mBAAmB,EAC9B,eAAe,EACf,cAAc,CACf,CAAC;YACF,IAAI,CAAC,wBAAwB,CAAC,WAAW,EAAE,eAAe,EAAE,UAAU,CAAC,CAAC;YAExE,gDAAgD;YAChD,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa;gBACvC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;YAE3E,IAAI,CAAC,QAAQ,CACX;gBACE,UAAU;gBACV,eAAe;gBACf,cAAc;gBACd,mBAAmB,EAAE,WAAW;gBAChC,UAAU;gBACV,YAAY,EAAE,KAAK;aACpB,EACD,GAAG,EAAE;gBACH,IAAI,CAAC,cAAc,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;YAC7C,CAAC,CACF,CAAC;QACJ,CAAC,CAAC;QAEM,mBAAc,GAAG,CAAC,IAAc,EAAE,EAAE;YAC1C,uCAAuC;YACvC,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC;YACtD,MAAM,OAAO,GACX,IAAI,CAAC,KAAK,GAAG,eAAe,GAAG,IAAI,CAAC,OAAO,GAAG,iBAAiB,CAAC;YAClE,MAAM,eAAe,GAAG,IAAI,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,CAAC;YACvD,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;YAE9D,sCAAsC;YACtC,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa;gBACvC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;YAEzD,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,CAC1C,OAAO,EACP,IAAI,CAAC,KAAK,CAAC,eAAe,EAC1B,IAAI,CAAC,KAAK,CAAC,cAAc,CAC1B,CAAC;YAEF,IAAI,CAAC,wBAAwB,CAC3B,mBAAmB,EACnB,IAAI,CAAC,KAAK,CAAC,eAAe,EAC1B,IAAI,CAAC,KAAK,CAAC,UAAU,CACtB,CAAC;YACF,IAAI,CAAC,cAAc,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;YAE3C,sBAAsB;YACtB,IAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC,CAAC;QACzC,CAAC,CAAC;QAEM,sBAAiB,GAAG,GAAG,EAAE;YAC/B,IAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC;QACzC,CAAC,CAAC;QAEM,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,SAAS,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC;QAC5E,CAAC,CAAC;QAEM,0BAAqB,GAAG,GAAG,EAAE;YACnC,IAAI,CAAC,QAAQ,CAAC,EAAE,gBAAgB,EAAE,KAAK,EAAE,CAAC,CAAC;QAC7C,CAAC,CAAC;QAEM,yBAAoB,GAAG,GAAG,EAAE;YAClC,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;gBAC5B,gBAAgB,EAAE,CAAC,SAAS,CAAC,gBAAgB;aAC9C,CAAC,CAAC,CAAC;QACN,CAAC,CAAC;QAgCM,cAAS,GAAG,CAAC,MAA6B,EAAE,EAAE;YACpD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS;gBAAE,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QAClE,CAAC,CAAC;QAEM,cAAS,GAAG,CAAC,MAA6B,EAAE,EAAE;YACpD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS;gBAAE,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QAClE,CAAC,CAAC;QAEM,mBAAc,GAAG,CAAC,KAAa,EAAE,EAAE;YACzC,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,KAAK,CAAC;YACrD,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,gBAAgB,EAAE,CAAC,CAAC;QACpD,CAAC,CAAC;QAEM,kBAAa,GAAG,GAAG,EAAE;YAC3B,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;QAC5D,CAAC,CAAC;QAEM,gBAAW,GAAG,CAAC,QAAgB,EAAE,EAAE;YACzC,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC;YAChC,8CAA8C;YAC9C,MAAM,SAAS,GAAG,oBAAoB,CACpC,IAAI,EACJ,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,cAAc,GAAG,EAAE,CAC5C,CAAC;YACF,IAAI,KAAK,GAAG,SAAS,CAAC,QAAQ,EAAE,CAAC;YACjC,MAAM,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;YAC3C,MAAM,MAAM,GACV,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC;YAC5E,KAAK,GAAG,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;YACxC,OAAO,GAAG,KAAK,IAAI,OAAO,IAAI,MAAM,EAAE,CAAC;QACzC,CAAC,CAAC;QAEM,uBAAkB,GAAG,CAAC,WAAqB,EAAE,EAAE;YACrD,IAAI,CAAC,QAAQ,CACX,EAAE,WAAW,EAAE,EACf,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,GAAG,WAAW,CAAC,CAC1D,CAAC;QACJ,CAAC,CAAC;QAEM,iCAA4B,GAAG,CAAC,eAAyB,EAAE,EAAE;YACnE,IAAI,eAAe,CAAC,CAAC,KAAK,CAAC;gBACzB,qDAAqD;gBACrD,eAAe,GAAG,eAAe,CAAC,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;YAE1D,MAAM,WAAW,GAAG,eAAe,CAAC,UAAU,EAAE,CAAC;YACjD,IAAI,CAAC,QAAQ,CACX,EAAE,WAAW,EAAE,EACf,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,GAAG,WAAW,CAAC,CAC1D,CAAC;QACJ,CAAC,CAAC;QA9TA,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC;QACtD,MAAM,eAAe,GACnB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,UAAU,CAAC;QACzD,MAAM,cAAc,GAClB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,OAAO,EAAE,GAAG,UAAU,CAAC;QACxD,MAAM,UAAU,GAAG,cAAc,GAAG,eAAe,CAAC;QACpD,MAAM,WAAW,GACf,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,OAAO,EAAE,GAAG,UAAU,CAAC;QAC3D,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,CAC1C,WAAW,EACX,eAAe,EACf,cAAc,CACf,CAAC;QACF,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC;QACxD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ;YAClC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ;YACrB,CAAC,CAAC,uBAAuB,CAAC;QAC5B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;QACtD,MAAM,gBAAgB,GAAG,QAAQ,GAAG,KAAK,CAAC;QAC1C,IAAI,CAAC,wBAAwB,CAC3B,mBAAmB,EACnB,eAAe,EACf,UAAU,EACV,gBAAgB,CACjB,CAAC;QAEF,IAAI,CAAC,KAAK,GAAG;YACX,YAAY,EAAE,KAAK;YACnB,gBAAgB,EAAE,KAAK;YACvB,SAAS,EAAE,KAAK;YAChB,UAAU;YACV,eAAe;YACf,cAAc;YACd,UAAU;YACV,mBAAmB;YACnB,KAAK;YACL,IAAI,EAAE,KAAK;YACX,WAAW;YACX,QAAQ;YACR,gBAAgB;SACjB,CAAC;IACJ,CAAC;IAEe,oBAAoB;QAClC,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAChD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;IACzB,CAAC;IAkDO,KAAK,CAAC,SAAiB;QAC7B,IAAI,CAAC,cAAc,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;QAE3C,gBAAgB;QAChB,IAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,mBAAmB,EAAE,SAAS,EAAE,EAAE,GAAG,EAAE;YACtE,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,qBAAqB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACzE,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW;gBAAE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;IACL,CAAC;IAoCO,wBAAwB,CAC9B,WAAmB,EACnB,eAAuB,EACvB,UAAkB,EAClB,gBAAyB;QAEzB,IAAI,CAAC,cAAc;YACjB,CAAC,CAAC,WAAW,GAAG,eAAe,CAAC,GAAG,UAAU,CAAC;gBAC9C,CAAC,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;IACxE,CAAC;IAyFO,WAAW,CAAC,KAAa,EAAE,GAAW,EAAE,GAAW;QACzD,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC;IAC7C,CAAC;IAEO,oBAAoB,CAAC,OAAe;QAC1C,IAAI,OAAO,KAAK,IAAI,CAAC,KAAK,CAAC,mBAAmB;YAAE,OAAO;QAEvD,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,CAC1C,OAAO,EACP,IAAI,CAAC,KAAK,CAAC,eAAe,EAC1B,IAAI,CAAC,KAAK,CAAC,cAAc,CAC1B,CAAC;QAEF,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE;YACzC,MAAM,cAAc,GAAG,IAAI,IAAI,CAC7B,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,mBAAmB,CAC5C,CAAC;YACF,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;SACvD;QAED,IAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,EAAE,GAAG,EAAE;YAC1C,MAAM,WAAW,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;YACzC,IAAI,CAAC,cAAc,GAAG,WAAW,CAAC;YAClC,MAAM,eAAe,GACnB,CAAC,mBAAmB,GAAG,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC;gBAClD,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;YACxB,IAAI,CAAC,cAAc,GAAG,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC;QACtE,CAAC,CAAC,CAAC;IACL,CAAC;IAqDM,YAAY,CAAC,KAAa;QAC/B,MAAM,WAAW,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;QACpC,8CAA8C;QAC9C,OAAO,oBAAoB,CACzB,WAAW,EACX,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,cAAc,GAAG,EAAE,CAC5C,CAAC;IACJ,CAAC;IAEe,MAAM;QACpB,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACpC,MAAM,EACJ,KAAK,EACL,IAAI,EACJ,mBAAmB,EACnB,eAAe,EACf,cAAc,GACf,GAAG,IAAI,CAAC,KAAK,CAAC;QACf,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,CACjC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,mBAAmB,CACvD,CAAC;QACF,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,CACpC,YAAY,CAAC,UAAU,GAAG,mBAAmB,CAC9C,CAAC;QACF,MAAM,aAAa,GAAG,GACpB,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,CACnC,KAAK,SAAS,CAAC,OAAO,EAAE,EAAE,CAAC;QAE3B,MAAM,gBAAgB,GAAwB;YAC5C,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;SACf,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAE,wBAAwB;YACtC,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,UAAU,IACT,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,SAAS,EAAC,aAAa,EACvB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,OAAO,EAAE,IAAI,CAAC,QAAQ,GACtB;gBACF,+CACc,wBAAwB,EACpC,KAAK,EAAE,IAAI,CAAC,cAAc,EAC1B,SAAS,EAAC,cAAc,EACxB,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,EAC9C,OAAO,EAAE,IAAI,CAAC,gBAAgB;oBAE9B,kCAAO,aAAa,CAAQ;oBAC5B,sCAAc;oBACd,kCAAO,aAAa,CAAQ;oBAC5B,8BAAM,SAAS,EAAC,MAAM;wBACpB,oBAAC,IAAI,IAAC,QAAQ,EAAE,oBAAC,WAAW,OAAG,GAAI,CAC9B,CACA;gBACT,oBAAC,KAAK,IACJ,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EACzB,MAAM,EAAE,EAAE,EACV,MAAM,EAAE,IAAI,CAAC,WAAW,EACxB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAC/B,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,QAAQ,EAAE,gBAAgB,CAAC,GAAG;oBAE9B,6BACE,SAAS,EAAC,6CAA6C,iBAC3C,6CAA6C;wBAEzD,oBAAC,UAAU,IACT,QAAQ,EAAE,SAAS,EACnB,YAAY,EAAE,IAAI,CAAC,WAAW,EAC9B,gBAAgB,EAAE,KAAK,GACvB;wBACF,6BAAK,SAAS,EAAC,gBAAgB;4BAC7B,oBAAC,IAAI,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,YAAY,IACxC,IAAI,CAAC,UAAU,CACX;4BACP,oBAAC,SAAS,IACR,IAAI,EAAE;oCACJ,KAAK,EAAE,SAAS,CAAC,QAAQ,EAAE;oCAC3B,OAAO,EAAE,SAAS,CAAC,UAAU,EAAE;oCAC/B,OAAO,EAAE,CAAC;iCACX,EACD,WAAW,EAAE,WAAW,CAAC,KAAK,EAC9B,YAAY,EAAE,IAAI,CAAC,cAAc,GACjC,CACE,CACF,CACA;gBACR,oBAAC,QAAQ,IACP,UAAU,EAAE,YAAY,CAAC,UAAU,EACnC,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,mBAAmB,EAAE,mBAAmB,EACxC,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,GAC/B;gBACF,6BAAK,SAAS,EAAC,iBAAiB;oBAC9B,8BAAM,KAAK,EAAE,IAAI,CAAC,WAAW;wBAAG,KAAK;4BAAS;oBAC9C,oBAAC,aAAa,IACZ,SAAS,EAAC,OAAO,EACjB,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GACvB,CACE;gBAEN,8BACE,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,SAAS,EAAE,UAAU,CACnB,MAAM,EACN,CAAC,IAAI,IAAI,kBAAkB,EAC3B,IAAI,IAAI,eAAe,CACxB,EACD,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,CAAC;oBAEZ,oBAAC,IAAI,IAAC,QAAQ,EAAE,oBAAC,OAAO,OAAG,GAAI,CAC1B;gBACP,+CACc,wBAAwB,EACpC,KAAK,EAAE,IAAI,CAAC,aAAa,EACzB,SAAS,EAAC,wBAAwB,EAClC,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,EAC5C,OAAO,EAAE,IAAI,CAAC,oBAAoB;oBAElC,8BAAM,SAAS,EAAC,MAAM;wBACpB,oBAAC,IAAI,IAAC,QAAQ,EAAE,oBAAC,WAAW,OAAG,GAAI,CAC9B,CACA;gBACT,oBAAC,KAAK,IACJ,SAAS,EAAC,uBAAuB,EACjC,MAAM,EAAE,IAAI,CAAC,SAAS,EACtB,MAAM,EAAE,EAAE,EACV,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,EACnC,OAAO,EAAE,IAAI,CAAC,qBAAqB,EACnC,QAAQ,EAAE,gBAAgB,CAAC,GAAG;oBAE9B,6BAAK,SAAS,EAAC,iCAAiC;wBAC9C,6BAAK,SAAS,EAAC,wBAAwB,IACpC,IAAI,CAAC,mBAAmB,CACrB;wBACN,6BAAK,SAAS,EAAC,uBAAuB;4BACpC,6BAAK,SAAS,EAAC,2BAA2B;gCACxC,oBAAC,gBAAgB,IACf,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,EAAE,EACnC,kBAAkB,EAAE,IAAI,CAAC,4BAA4B,GACrD,CACE;4BACN,6BAAK,SAAS,EAAC,8BAA8B;gCAC3C,6BAAK,SAAS,EAAC,mCAAmC;oCAChD,oBAAC,SAAS,IACR,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,EAAE,EACnC,WAAW,EAAE,IAAI,CAAC,4BAA4B,EAC9C,YAAY,EAAE,IAAI,GAClB,CACE;gCACN,6BAAK,SAAS,EAAC,oCAAoC;oCACjD,oBAAC,WAAW,IACV,KAAK,EAAE,gBAAgB,EACvB,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,EAChC,KAAK,EAAE,KAAK,GACZ,CACE,CACF,CACF;wBACN,6BAAK,SAAS,EAAC,+BAA+B;4BAC5C,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC;4BACF,oBAAC,WAAW,IACV,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,kBAAkB,GACpC,CACE,CACF,CACA,CACJ,CACF,CACP,CAAC;IACJ,CAAC;CACF","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\n// component is in alpha state - it may change after usability testing - test coverage not complete\n/* istanbul ignore file */\n\nimport \"./SolarTimeline.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Slider, Text, Tooltip } from \"@itwin/itwinui-react\";\n\nimport type { HSVColor } from \"@itwin/core-common\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport { RelativePosition, TimeDisplay } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon, Popup } from \"@itwin/core-react\";\nimport type { TimeSpec } from \"@itwin/components-react\";\nimport {\n  adjustDateToTimezone,\n  DatePicker,\n  TimeField,\n  UiComponents,\n} from \"@itwin/components-react\";\nimport { HueSlider } from \"../color/HueSlider\";\nimport { SaturationPicker } from \"../color/SaturationPicker\";\nimport { ColorSwatch } from \"../color/Swatch\";\nimport type { SolarDataProvider } from \"./interfaces\";\nimport { PlayButton } from \"./PlayerButton\";\nimport { SpeedTimeline } from \"./SpeedTimeline\";\nimport {\n  CustomThumb,\n  getPercentageOfRectangle,\n  RailMarkers,\n  useFocusedThumb,\n} from \"./Scrubber\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { SvgCalendar, SvgLoop, SvgSettings } from \"@itwin/itwinui-icons-react\";\n\n// cSpell:ignore millisec solarsettings showticks shadowcolor solartimeline datepicker millisecs\n\nconst millisecPerMinute = 1000 * 60;\nconst millisecPerHour = millisecPerMinute * 60;\n// const millisecPerDay = millisecPerHour * 24;\nconst defaultPlaybackDuration = 40 * 1000; // 40 seconds\nconst addZero = (i: number) => {\n  return i < 10 ? `0${i}` : i;\n};\n\ninterface TimelineProps extends CommonProps {\n  dayStartMs: number;\n  sunRiseOffsetMs: number;\n  sunSetOffsetMs: number;\n  currentTimeOffsetMs: number;\n  isPlaying: boolean;\n  formatTick?: (millisec: number) => string;\n  formatTime: (millisec: number) => string;\n  onChange?: (values: ReadonlyArray<number>) => void;\n  onUpdate?: (values: ReadonlyArray<number>) => void;\n}\n\nfunction Timeline(props: TimelineProps) {\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 {\n    formatTick,\n    formatTime,\n    onChange,\n    onUpdate,\n    dayStartMs,\n    sunSetOffsetMs,\n    sunRiseOffsetMs,\n    currentTimeOffsetMs,\n    isPlaying,\n  } = props;\n\n  const thumbHasFocus = useFocusedThumb(sliderContainer ?? undefined);\n\n  const tickLabel = React.useMemo(() => {\n    const showTip = isPlaying || showRailTooltip || thumbHasFocus;\n    const totalDuration = sunSetOffsetMs - sunRiseOffsetMs;\n    const percent =\n      isPlaying || thumbHasFocus\n        ? (currentTimeOffsetMs - sunRiseOffsetMs) / totalDuration\n        : pointerPercent;\n    const tooltipText = formatTime(\n      isPlaying || thumbHasFocus\n        ? dayStartMs + currentTimeOffsetMs\n        : dayStartMs + (sunRiseOffsetMs + pointerPercent * totalDuration)\n    );\n    return (\n      <RailMarkers\n        showToolTip={showTip}\n        percent={percent}\n        tooltipText={tooltipText}\n      />\n    );\n  }, [\n    isPlaying,\n    showRailTooltip,\n    thumbHasFocus,\n    sunSetOffsetMs,\n    sunRiseOffsetMs,\n    currentTimeOffsetMs,\n    pointerPercent,\n    formatTime,\n    dayStartMs,\n  ]);\n\n  const className = classnames(\n    \"solar-timeline\",\n    props.className,\n    formatTick && \"showticks\"\n  );\n  const sunRiseFormat = formatTime(dayStartMs + sunRiseOffsetMs);\n  const sunSetFormat = formatTime(dayStartMs + sunSetOffsetMs);\n  return (\n    <div className={className}>\n      <Tooltip content={sunRiseFormat}>\n        <span className=\"sunrise\">&#x2600;</span>\n      </Tooltip>\n      <Slider\n        ref={setSliderContainer}\n        className=\"solar-slider\"\n        step={millisecPerMinute}\n        min={sunRiseOffsetMs}\n        max={sunSetOffsetMs}\n        minLabel=\"\"\n        maxLabel=\"\"\n        onUpdate={onUpdate}\n        onChange={onChange}\n        values={[currentTimeOffsetMs]}\n        tooltipProps={tooltipProps}\n        thumbProps={() => ({\n          className: \"components-timeline-thumb\",\n          children: <CustomThumb />,\n        })}\n        tickLabels={tickLabel}\n        onPointerEnter={handlePointerEnter}\n        onPointerMove={handlePointerMove}\n        onPointerLeave={handlePointerLeave}\n      />\n      <Tooltip content={sunSetFormat}>\n        <span className=\"sunset\">&#x263D;</span>\n      </Tooltip>\n    </div>\n  );\n}\n\ninterface SolarTimelineComponentProps {\n  dataProvider: SolarDataProvider; // provides date, sunrise, sunset in millisecs, 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 _datePicker: HTMLElement | null = null;\n  private _settings: HTMLElement | null = null;\n  private _requestFrame = 0;\n  private _unmounted = false;\n  private _timeLastCycle = 0;\n  private _totalPlayTime = 0;\n  private _settingsPopupTitle = UiIModelComponents.translate(\n    \"solarsettings.shadowcolor\"\n  );\n  private _playLabel = UiIModelComponents.translate(\"solartimeline.play\");\n  private _settingLabel = UiIModelComponents.translate(\n    \"solartimeline.settings\"\n  );\n  private _loopLabel = UiIModelComponents.translate(\"timeline.repeat\");\n  private _speedLabel = UiIModelComponents.translate(\"solartimeline.speed\");\n  private _dateTimeLabel = UiIModelComponents.translate(\n    \"solartimeline.dateTime\"\n  );\n\n  private _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  private _timeLabel = UiComponents.translate(\"datepicker.time\");\n  private _amLabel = UiComponents.translate(\"time.am\");\n  private _pmLabel = UiComponents.translate(\"time.pm\");\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  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    // istanbul ignore else\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      // istanbul ignore else\n      if (this.props.onPlayPause) this.props.onPlayPause(true);\n    });\n  }\n\n  // user clicked pause button\n  private _onPause = () => {\n    // istanbul ignore if\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    // istanbul ignore else\n    if (this.props.onPlayPause) this.props.onPlayPause(false);\n  };\n\n  // user clicked play button\n  private _onPlay = () => {\n    // istanbul ignore if\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  /** note the day passed in is in the time of the current user not in project time because the date picker works in\n   * local time  */\n  private _onDayClick = (day: Date) => {\n    const selectedDate = new Date(\n      day.getTime() + this.state.currentTimeOffsetMs\n    );\n    this.props.dataProvider.setDateAndTime(selectedDate);\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    const sunOffsetMs = this.ensureRange(\n      this.state.currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs\n    );\n    this.setPlaybackTimeBySunTime(sunOffsetMs, sunRiseOffsetMs, sunDeltaMs);\n\n    /** call dataProvider to update display style */\n    if (this.props.dataProvider.onTimeChanged)\n      this.props.dataProvider.onTimeChanged(this.props.dataProvider.timeOfDay);\n\n    this.setState(\n      {\n        dayStartMs,\n        sunRiseOffsetMs,\n        sunSetOffsetMs,\n        currentTimeOffsetMs: sunOffsetMs,\n        sunDeltaMs,\n        isDateOpened: false,\n      },\n      () => {\n        this._timeLastCycle = new Date().getTime();\n      }\n    );\n  };\n\n  private _onTimeChanged = (time: TimeSpec) => {\n    // compute the current date (with time)\n    const dayStartMs = this.props.dataProvider.dayStartMs;\n    const sunTime =\n      time.hours * millisecPerHour + time.minutes * millisecPerMinute;\n    const dateWithNewTime = new Date(dayStartMs + sunTime);\n    this.props.dataProvider.setDateAndTime(dateWithNewTime, true);\n\n    // notify the provider to update style\n    if (this.props.dataProvider.onTimeChanged)\n      this.props.dataProvider.onTimeChanged(dateWithNewTime);\n\n    const currentTimeOffsetMs = this.ensureRange(\n      sunTime,\n      this.state.sunRiseOffsetMs,\n      this.state.sunSetOffsetMs\n    );\n\n    this.setPlaybackTimeBySunTime(\n      currentTimeOffsetMs,\n      this.state.sunRiseOffsetMs,\n      this.state.sunDeltaMs\n    );\n    this._timeLastCycle = new Date().getTime();\n\n    // update the timeline\n    this.setState({ currentTimeOffsetMs });\n  };\n\n  private _onCloseDayPicker = () => {\n    this.setState({ isDateOpened: false });\n  };\n\n  private _onOpenDayPicker = () => {\n    this.setState((prevState) => ({ isDateOpened: !prevState.isDateOpened }));\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 = (millisec: number) => {\n    const date = new Date(millisec);\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 = addZero(date.getMinutes());\n    const abbrev =\n      hours < 12 ? this._amLabel : hours === 24 ? this._amLabel : this._pmLabel;\n    hours = hours > 12 ? hours - 12 : hours;\n    return `${hours}:${minutes} ${abbrev}`;\n  };\n\n  private _onPresetColorPick = (shadowColor: ColorDef) => {\n    this.setState(\n      { shadowColor },\n      () => (this.props.dataProvider.shadowColor = shadowColor)\n    );\n  };\n\n  private _handleHueOrSaturationChange = (hueOrSaturation: HSVColor) => {\n    if (hueOrSaturation.s === 0)\n      // for a ColorDef to be created from hsv s can't be 0\n      hueOrSaturation = hueOrSaturation.clone(undefined, 0.5);\n\n    const shadowColor = hueOrSaturation.toColorDef();\n    this.setState(\n      { shadowColor },\n      () => (this.props.dataProvider.shadowColor = shadowColor)\n    );\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,\n      loop,\n      currentTimeOffsetMs,\n      sunRiseOffsetMs,\n      sunSetOffsetMs,\n    } = this.state;\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      this._months[localTime.getMonth()]\n    }, ${localTime.getDate()}`;\n\n    const colorSwatchStyle: React.CSSProperties = {\n      width: `100%`,\n      height: `100%`,\n    };\n\n    return (\n      <div className={\"solar-timeline-wrapper\"}>\n        <div className=\"header\">\n          <PlayButton\n            tooltip={this._playLabel}\n            className=\"play-button\"\n            isPlaying={this.state.isPlaying}\n            onPlay={this._onPlay}\n            onPause={this._onPause}\n          />\n          <button\n            data-testid=\"solar-date-time-button\"\n            title={this._dateTimeLabel}\n            className=\"current-date\"\n            ref={(element) => (this._datePicker = element)}\n            onClick={this._onOpenDayPicker}\n          >\n            <span>{formattedDate}</span>\n            <span>/</span>\n            <span>{formattedTime}</span>\n            <span className=\"icon\">\n              <Icon iconSpec={<SvgCalendar />} />\n            </span>\n          </button>\n          <Popup\n            style={{ border: \"none\" }}\n            offset={11}\n            target={this._datePicker}\n            isOpen={this.state.isDateOpened}\n            onClose={this._onCloseDayPicker}\n            position={RelativePosition.Top}\n          >\n            <div\n              className=\"components-date-picker-calendar-popup-panel\"\n              data-testid=\"components-date-picker-calendar-popup-panel\"\n            >\n              <DatePicker\n                selected={localTime}\n                onDateChange={this._onDayClick}\n                showFocusOutline={false}\n              />\n              <div className=\"time-container\">\n                <Text variant=\"body\" className=\"time-label\">\n                  {this._timeLabel}\n                </Text>\n                <TimeField\n                  time={{\n                    hours: localTime.getHours(),\n                    minutes: localTime.getMinutes(),\n                    seconds: 0,\n                  }}\n                  timeDisplay={TimeDisplay.H12MC}\n                  onTimeChange={this._onTimeChanged}\n                />\n              </div>\n            </div>\n          </Popup>\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          <div className=\"speed-container\">\n            <span title={this._speedLabel}>{speed}x</span>\n            <SpeedTimeline\n              className=\"speed\"\n              onChange={this._onSpeedChange}\n              speed={this.state.speed}\n            />\n          </div>\n          {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events */}\n          <span\n            title={this._loopLabel}\n            className={classnames(\n              \"icon\",\n              !loop && \"no-loop-playback\",\n              loop && \"loop-playback\"\n            )}\n            onClick={this._onToggleLoop}\n            role=\"button\"\n            tabIndex={-1}\n          >\n            <Icon iconSpec={<SvgLoop />} />\n          </span>\n          <button\n            data-testid=\"shadow-settings-button\"\n            title={this._settingLabel}\n            className=\"shadow-settings-button\"\n            ref={(element) => (this._settings = element)}\n            onClick={this._onOpenSettingsPopup}\n          >\n            <span className=\"icon\">\n              <Icon iconSpec={<SvgSettings />} />\n            </span>\n          </button>\n          <Popup\n            className=\"shadow-settings-popup\"\n            target={this._settings}\n            offset={11}\n            isOpen={this.state.isSettingsOpened}\n            onClose={this._onCloseSettingsPopup}\n            position={RelativePosition.Top}\n          >\n            <div className=\"shadow-settings-popup-container\">\n              <div className=\"shadow-settings-header\">\n                {this._settingsPopupTitle}\n              </div>\n              <div className=\"shadow-settings-color\">\n                <div className=\"shadow-settings-color-top\">\n                  <SaturationPicker\n                    hsv={this.state.shadowColor.toHSV()}\n                    onSaturationChange={this._handleHueOrSaturationChange}\n                  />\n                </div>\n                <div className=\"shadow-settings-color-bottom\">\n                  <div className=\"shadow-settings-color-bottom-left\">\n                    <HueSlider\n                      hsv={this.state.shadowColor.toHSV()}\n                      onHueChange={this._handleHueOrSaturationChange}\n                      isHorizontal={true}\n                    />\n                  </div>\n                  <div className=\"shadow-settings-color-bottom-right\">\n                    <ColorSwatch\n                      style={colorSwatchStyle}\n                      colorDef={this.state.shadowColor}\n                      round={false}\n                    />\n                  </div>\n                </div>\n              </div>\n              <div className=\"shadow-settings-color-presets\">\n                <ColorSwatch\n                  colorDef={this._presetColors[0]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[1]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[2]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[3]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[4]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[5]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[6]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n                <ColorSwatch\n                  colorDef={this._presetColors[7]}\n                  round={false}\n                  onColorPick={this._onPresetColorPick}\n                />\n              </div>\n            </div>\n          </Popup>\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/lib/esm/imodel-components-react/timeline/SolarTimeline.scss

@@ -7,10 +7,6 @@
 $top-position: 6px;
 $bottom-position: 4px;
 
-.solar-slider.solar-timeline > .iui-slider-container {
-  height: 28px;
-}
-
 .solar-timeline-wrapper {
   box-sizing: border-box;
   background: var(--iui-color-background);
@@ -69,16 +65,13 @@ $bottom-position: 4px;
       color: var(--iui-color-text);
       font-size: var(--iui-font-size-1);
       cursor: pointer;
+      gap: 6px;
 
       &:focus-visible {
         outline: 1px solid var(--iui-color-border-accent);
         outline-offset: -1px;
       }
 
-      > span:nth-child(2) {
-        margin: 0 6px;
-      }
-
       > .icon-calendar {
         flex-grow: 1;
         margin-left: auto;
@@ -125,13 +118,18 @@ $bottom-position: 4px;
     }
   }
 
-  .solar-slider {
+  .solar-timeline {
     position: relative;
     display: flex;
     box-sizing: border-box;
     align-items: center;
     flex: 1;
 
+    .solar-slider {
+      position: relative;
+      flex: 1;
+    }
+
     .rail-outer {
       position: absolute;
       top: 50%;
@@ -248,10 +246,6 @@ $bottom-position: 4px;
   margin-bottom: 8px;
 }
 
-.solar-timeline-wrapper .solar-timeline {
-  display: flex;
-}
-
 .solar-timeline-wrapper.expanded {
   height: 100px;
 }

package/lib/esm/imodel-components-react/timeline/TimelineComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineComponent.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/TimelineComponent.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAgBjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,gBAAgB,EAAyB,MAAM,cAAc,CAAC;AAK5E,OAAO,0BAA0B,CAAC;AAOlC;;;;;;;GAOG;AACH,MAAM,MAAM,sBAAsB,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;AACrE;;;GAGG;AACH,MAAM,WAAW,qBAAqB;IACpC,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IAEd,+CAA+C;IAC/C,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AACD;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,6DAA6D;IAC7D,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,6GAA6G;IAC7G,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AACD;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC,wEAAwE;IACxE,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,gEAAgE;IAChE,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,6DAA6D;IAC7D,aAAa,EAAE,MAAM,CAAC;IACtB,yFAAyF;IACzF,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,yFAAyF;IACzF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wCAAwC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,2DAA2D;IAC3D,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mEAAmE;IACnE,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,mDAAmD;IACnD,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACnD,gHAAgH;IAChH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6DAA6D;IAC7D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACvC,uGAAuG;IACvG,iBAAiB,CAAC,EAAE,sBAAsB,CAAC;IAC3C,oHAAoH;IACpH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0HAA0H;IAC1H,QAAQ,CAAC,EAAE,uBAAuB,CAAC;IACnC,uGAAuG;IACvG,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,uGAAuG;IACvG,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC;AACD,gBAAgB;AAChB,UAAU,sBAAsB;IAC9B,8DAA8D;IAC9D,SAAS,EAAE,OAAO,CAAC;IACnB,gEAAgE;IAChE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,uCAAuC;IACvC,eAAe,EAAE,MAAM,CAAC;IACxB,qCAAqC;IACrC,aAAa,EAAE,MAAM,CAAC;IACtB,2EAA2E;IAC3E,MAAM,EAAE,OAAO,CAAC;IAChB,sEAAsE;IACtE,aAAa,EAAE,OAAO,CAAC;CACxB;AAED;;;GAGG;AACH,qBAAa,iBAAkB,SAAQ,KAAK,CAAC,SAAS,CACpD,sBAAsB,EACtB,sBAAsB,CACvB;IACC,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,aAAa,CAAK;IAC1B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,eAAe,CAAC,CAAa;IACrC,OAAO,CAAC,0BAA0B,CAahC;gBAEU,KAAK,EAAE,sBAAsB;IA2BzB,oBAAoB;IAMpB,qBAAqB,CACnC,SAAS,EAAE,sBAAsB,EACjC,SAAS,EAAE,sBAAsB;IAkBnB,kBAAkB,CAAC,SAAS,EAAE,sBAAsB;IAuBpE,OAAO,CAAC,6BAA6B,CA2BnC;IAGF,OAAO,CAAC,WAAW,CAGjB;IAGF,OAAO,CAAC,UAAU,CAGhB;IAGF,OAAO,CAAC,OAAO,CAWb;IAGF,OAAO,CAAC,QAAQ,CAYd;IAGF,OAAO,CAAC,iBAAiB,CAGvB;IAGF,OAAO,CAAC,YAAY,CAelB;IAGF,OAAO,CAAC,gBAAgB,CA2BtB;IAEF,OAAO,CAAC,KAAK;IASb,OAAO,CAAC,OAAO,CAGb;IAEF,OAAO,CAAC,YAAY;IAYpB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,sBAAsB,CAI5B;IAEF,OAAO,CAAC,oBAAoB,CAa1B;IAEF,OAAO,CAAC,gBAAgB,CAUtB;IAEF,OAAO,CAAC,YAAY,CASlB;IAEF,OAAO,CAAC,mBAAmB,CAOzB;IAEF,OAAO,CAAC,mBAAmB;IA6B3B,OAAO,CAAC,eAAe,CA4GrB;IAEc,MAAM;CAoHvB"}
+{"version":3,"file":"TimelineComponent.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/TimelineComponent.tsx"],"names":[],"mappings":"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"}