@itwin/imodel-components-react 4.0.0-dev.10 → 4.0.0-dev.12

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

@@ -1,112 +1,105 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
-@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 {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background-image: linear-gradient(
-      to bottom,
-      $buic-background-3,
-      $buic-background-3
-    ),
-    linear-gradient(to bottom, $buic-background-1, $buic-background-1);
-  box-sizing: border-box;
-  width: 38px;
-  height: 20px;
-  border-radius: var(--iui-border-radius-1);
-  border: 1px solid $buic-background-5;
-  transform: translateX(-19.2px);
-  top: 4px;
-}
-
-.components-timeline-rail-marker-container {
-  width: 100%;
-  position: absolute;
-
-  div.components-timeline-tooltip {
-    @include uicore-z-index(tooltip);
-    position: absolute;
-    top: -8px;
-    display: inline-block;
-    transform: translateX(-50px);
-    border-bottom: 1px dotted #222;
-    font-size: 14px;
-
-    .tooltip-text {
-      width: 100px;
-      background-color: #222;
-      color: #fff;
-      // opacity: 0.8;
-      text-align: center;
-      border-radius: 6px;
-      padding: 8px 0;
-      position: absolute;
-      z-index: 1;
-      bottom: 150%;
-
-      &:after {
-        content: "";
-        position: absolute;
-        top: 100%;
-        left: 50%;
-        margin-left: -5px;
-        border-width: 5px;
-        border-style: solid;
-        border-color: #222 transparent transparent transparent;
-      }
-    }
-  }
-}
-
-.scrubber-handle {
-  pointer-events: none;
-  position: absolute;
-  width: 38px;
-  height: 20px;
-  border-radius: var(--iui-border-radius-1);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  box-sizing: border-box;
-  cursor: pointer;
-
-  > div {
-    width: 1px;
-    height: 10px;
-    opacity: 0.25;
-    margin: 0 1px;
-    background-color: $buic-foreground-body;
-  }
-}
-
-.scrubber-track {
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-  height: 4px;
-  z-index: 1;
-  cursor: pointer;
-}
-
-.components-timeline-date-marker {
-  pointer-events: none;
-  position: absolute;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transform: translateY(50%);
-}
-
-.date-marker-default {
-  height: 12px;
-  width: 3px;
-  border-radius: var(--iui-border-radius-1);
-  transform: translateY(1px);
-  background-color: $buic-foreground-primary;
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* 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 {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: var(--iui-color-background);
+  box-sizing: border-box;
+  width: 38px;
+  height: 20px;
+  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;
+
+  div.components-timeline-tooltip {
+    @include uicore-z-index(tooltip);
+    position: absolute;
+    top: -8px;
+    display: inline-block;
+    transform: translateX(-50px);
+    border-bottom: 1px dotted rgba(0, 0, 0, var(--iui-opacity-3));
+    font-size: 14px;
+
+    .tooltip-text {
+      width: 100px;
+      background-color: rgba(0, 0, 0, var(--iui-opacity-3));
+      color: #fff;
+      // opacity: 0.8;
+      text-align: center;
+      border-radius: 6px;
+      padding: 8px 0;
+      position: absolute;
+      z-index: 1;
+      bottom: 150%;
+
+      &:after {
+        content: "";
+        position: absolute;
+        top: 100%;
+        left: 50%;
+        margin-left: -5px;
+        border-width: 5px;
+        border-style: solid;
+        border-color: rgba(0, 0, 0, var(--iui-opacity-3)) transparent
+          transparent transparent;
+      }
+    }
+  }
+}
+
+.scrubber-handle {
+  pointer-events: none;
+  position: absolute;
+  width: 38px;
+  height: 20px;
+  border-radius: var(--iui-border-radius-1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  cursor: pointer;
+
+  > div {
+    width: 1px;
+    height: 10px;
+    margin: 0 1px;
+    background-color: var(--iui-color-border-subtle);
+  }
+}
+
+.scrubber-track {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  height: 4px;
+  z-index: 1;
+  cursor: pointer;
+}
+
+.components-timeline-date-marker {
+  pointer-events: none;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transform: translateY(50%);
+}
+
+.date-marker-default {
+  height: 12px;
+  width: 3px;
+  border-radius: var(--iui-border-radius-1);
+  transform: translateY(1px);
+  background-color: var(--iui-color-border);
+}

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

@@ -1,78 +1,78 @@
-/** @packageDocumentation
- * @module Timeline
- */
-import "./SolarTimeline.scss";
-import * as React from "react";
-import { ColorDef } from "@itwin/core-common";
-import { SolarDataProvider } from "./interfaces";
-interface SolarTimelineComponentProps {
-    dataProvider: SolarDataProvider;
-    onPlayPause?: (playing: boolean) => void;
-    duration?: number;
-    speed?: number;
-}
-interface SolarTimelineComponentState {
-    isPlaying: boolean;
-    isDateOpened: boolean;
-    isSettingsOpened: boolean;
-    dayStartMs: number;
-    sunRiseOffsetMs: number;
-    sunSetOffsetMs: number;
-    sunDeltaMs: number;
-    currentTimeOffsetMs: number;
-    speed: number;
-    loop: boolean;
-    shadowColor: ColorDef;
-    duration: number;
-    adjustedDuration: number;
-}
-/** Solar Timeline
- * @alpha
- */
-export declare class SolarTimeline extends React.PureComponent<SolarTimelineComponentProps, SolarTimelineComponentState> {
-    private _datePicker;
-    private _settings;
-    private _requestFrame;
-    private _unmounted;
-    private _timeLastCycle;
-    private _totalPlayTime;
-    private _settingsPopupTitle;
-    private _playLabel;
-    private _settingLabel;
-    private _loopLabel;
-    private _speedLabel;
-    private _dateTimeLabel;
-    private _months;
-    private _timeLabel;
-    private _amLabel;
-    private _pmLabel;
-    private readonly _presetColors;
-    constructor(props: SolarTimelineComponentProps);
-    componentWillUnmount(): void;
-    private _updateAnimation;
-    private _play;
-    private _onPause;
-    private _onPlay;
-    private setPlaybackTimeBySunTime;
-    /** note the day passed in is in the time of the current user not in project time because the date picker works in
-     * local time  */
-    private _onDayClick;
-    private _onTimeChanged;
-    private _onCloseDayPicker;
-    private _onOpenDayPicker;
-    private _onCloseSettingsPopup;
-    private _onOpenSettingsPopup;
-    private ensureRange;
-    private processSunTimeChange;
-    private _onUpdate;
-    private _onChange;
-    private _onSpeedChange;
-    private _onToggleLoop;
-    private _formatTime;
-    private _onPresetColorPick;
-    private _handleHueOrSaturationChange;
-    getLocalTime(ticks: number): Date;
-    render(): JSX.Element;
-}
-export {};
+/** @packageDocumentation
+ * @module Timeline
+ */
+import "./SolarTimeline.scss";
+import * as React from "react";
+import { ColorDef } from "@itwin/core-common";
+import { SolarDataProvider } from "./interfaces";
+interface SolarTimelineComponentProps {
+    dataProvider: SolarDataProvider;
+    onPlayPause?: (playing: boolean) => void;
+    duration?: number;
+    speed?: number;
+}
+interface SolarTimelineComponentState {
+    isPlaying: boolean;
+    isDateOpened: boolean;
+    isSettingsOpened: boolean;
+    dayStartMs: number;
+    sunRiseOffsetMs: number;
+    sunSetOffsetMs: number;
+    sunDeltaMs: number;
+    currentTimeOffsetMs: number;
+    speed: number;
+    loop: boolean;
+    shadowColor: ColorDef;
+    duration: number;
+    adjustedDuration: number;
+}
+/** Solar Timeline
+ * @alpha
+ */
+export declare class SolarTimeline extends React.PureComponent<SolarTimelineComponentProps, SolarTimelineComponentState> {
+    private _datePicker;
+    private _settings;
+    private _requestFrame;
+    private _unmounted;
+    private _timeLastCycle;
+    private _totalPlayTime;
+    private _settingsPopupTitle;
+    private _playLabel;
+    private _settingLabel;
+    private _loopLabel;
+    private _speedLabel;
+    private _dateTimeLabel;
+    private _months;
+    private _timeLabel;
+    private _amLabel;
+    private _pmLabel;
+    private readonly _presetColors;
+    constructor(props: SolarTimelineComponentProps);
+    componentWillUnmount(): void;
+    private _updateAnimation;
+    private _play;
+    private _onPause;
+    private _onPlay;
+    private setPlaybackTimeBySunTime;
+    /** note the day passed in is in the time of the current user not in project time because the date picker works in
+     * local time  */
+    private _onDayClick;
+    private _onTimeChanged;
+    private _onCloseDayPicker;
+    private _onOpenDayPicker;
+    private _onCloseSettingsPopup;
+    private _onOpenSettingsPopup;
+    private ensureRange;
+    private processSunTimeChange;
+    private _onUpdate;
+    private _onChange;
+    private _onSpeedChange;
+    private _onToggleLoop;
+    private _formatTime;
+    private _onPresetColorPick;
+    private _handleHueOrSaturationChange;
+    getLocalTime(ticks: number): Date;
+    render(): JSX.Element;
+}
+export {};
 //# sourceMappingURL=SolarTimeline.d.ts.map

package/lib/cjs/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;AAG/B,OAAO,EAAe,QAAQ,EAAY,MAAM,oBAAoB,CAAC;AAOrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAsHjD,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,CAAC,2BAA2B,EAAE,2BAA2B,CAAC;IAC9G,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,CAA6D;IACxF,OAAO,CAAC,UAAU,CAAsD;IACxE,OAAO,CAAC,aAAa,CAA0D;IAC/E,OAAO,CAAC,UAAU,CAAmD;IACrE,OAAO,CAAC,WAAW,CAAuD;IAC1E,OAAO,CAAC,cAAc,CAA0D;IAEhF,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;IAgC9B,oBAAoB;IAMpC,OAAO,CAAC,gBAAgB,CAuCtB;IAEF,OAAO,CAAC,KAAK;IAab,OAAO,CAAC,QAAQ,CAiBd;IAGF,OAAO,CAAC,OAAO,CAWb;IAEF,OAAO,CAAC,wBAAwB;IAIhC;qBACiB;IACjB,OAAO,CAAC,WAAW,CAkBjB;IAEF,OAAO,CAAC,cAAc,CAkBpB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,qBAAqB,CAE3B;IAEF,OAAO,CAAC,oBAAoB,CAE1B;IAEF,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,oBAAoB;IAmB5B,OAAO,CAAC,SAAS,CAGf;IAEF,OAAO,CAAC,SAAS,CAGf;IAEF,OAAO,CAAC,cAAc,CAGpB;IAEF,OAAO,CAAC,aAAa,CAEnB;IAEF,OAAO,CAAC,WAAW,CASjB;IAEF,OAAO,CAAC,kBAAkB,CAExB;IAEF,OAAO,CAAC,4BAA4B,CAMlC;IAEK,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAMxB,MAAM;CAsFvB"}
+{"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;AAG/B,OAAO,EAAe,QAAQ,EAAY,MAAM,oBAAoB,CAAC;AAOrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAuHjD,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,CAAC,2BAA2B,EAAE,2BAA2B,CAAC;IAC9G,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,CAA6D;IACxF,OAAO,CAAC,UAAU,CAAsD;IACxE,OAAO,CAAC,aAAa,CAA0D;IAC/E,OAAO,CAAC,UAAU,CAAmD;IACrE,OAAO,CAAC,WAAW,CAAuD;IAC1E,OAAO,CAAC,cAAc,CAA0D;IAEhF,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;IAgC9B,oBAAoB;IAMpC,OAAO,CAAC,gBAAgB,CAuCtB;IAEF,OAAO,CAAC,KAAK;IAab,OAAO,CAAC,QAAQ,CAiBd;IAGF,OAAO,CAAC,OAAO,CAWb;IAEF,OAAO,CAAC,wBAAwB;IAIhC;qBACiB;IACjB,OAAO,CAAC,WAAW,CAkBjB;IAEF,OAAO,CAAC,cAAc,CAkBpB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,qBAAqB,CAE3B;IAEF,OAAO,CAAC,oBAAoB,CAE1B;IAEF,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,oBAAoB;IAmB5B,OAAO,CAAC,SAAS,CAGf;IAEF,OAAO,CAAC,SAAS,CAGf;IAEF,OAAO,CAAC,cAAc,CAGpB;IAEF,OAAO,CAAC,aAAa,CAEnB;IAEF,OAAO,CAAC,WAAW,CASjB;IAEF,OAAO,CAAC,kBAAkB,CAExB;IAEF,OAAO,CAAC,4BAA4B,CAMlC;IAEK,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAMxB,MAAM;CAsFvB"}