@itwin/imodel-components-react 4.1.0 → 4.2.0

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

@@ -1,178 +1,178 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-.timeline-component {
-  box-sizing: border-box;
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  position: relative;
-  padding: 8px 16px;
-  min-width: 275px;
-
-  > .header {
-    display: flex;
-    align-items: center;
-    height: 38px;
-    position: relative;
-
-    > .play-backward {
-      border-radius: var(--iui-border-radius-1) 0 0 var(--iui-border-radius-1);
-    }
-
-    > .play-button-step {
-      border-left: none;
-      border-right: none;
-      border-radius: 0;
-    }
-
-    > .play-forward {
-      border-radius: 0px var(--iui-border-radius-1) var(--iui-border-radius-1) 0;
-    }
-
-    > .current-date {
-      font-size: 14px;
-      min-width: 180px;
-      padding: 8px;
-      color: var(--iui-color-text);
-      position: absolute;
-      left: 50%;
-      transform: translateX(-50%);
-      border-radius: var(--iui-border-radius-1);
-      border: solid 1px var(--iui-color-border);
-      background-color: var(--iui-color-background);
-      text-align: center;
-      box-sizing: border-box;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-  }
-
-  .play-button {
-    margin-right: 10px;
-  }
-
-  > .timeline-timeline {
-    margin: 8px 0;
-  }
-
-  > .scrubber {
-    min-height: 20px;
-    display: flex;
-    align-items: center;
-    position: relative;
-
-    .start-time-container,
-    .end-time-container {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
-
-    .start-time,
-    .end-time {
-      font-size: 12px;
-      color: var(--iui-color-text-muted);
-      text-align: center;
-      min-height: inherit;
-    }
-
-    .duration-start-time,
-    .duration-end-time {
-      font-size: 14px;
-      width: 40px;
-      color: var(--iui-color-text);
-      text-align: center;
-      min-height: inherit;
-    }
-
-    .start-date,
-    .end-date {
-      font-size: 12px;
-      color: var(--iui-color-text-muted);
-      padding-bottom: 4px;
-    }
-
-    .slider {
-      position: relative;
-      flex: 1;
-      margin: 0 20px;
-      height: 24px;
-    }
-  }
-}
-
-.timeline-settings {
-  margin-left: auto;
-  font-size: 14px;
-  color: var(--iui-color-text);
-  cursor: pointer;
-
-  &:hover {
-    color: var(--iui-color-text-hover);
-  }
-
-  &:focus {
-    outline: none;
-  }
-}
-
-.timeline-component.minimized .timeline-settings {
-  margin-left: 8px;
-  margin-right: -6px;
-}
-
-.timeline-component.has-dates .start-time-container {
-  margin-right: 8px;
-}
-
-.timeline-component.has-dates .end-time-container {
-  margin-left: 8px;
-}
-
-.timeline-component.minimized .header,
-.timeline-component.minimized .timeline-timeline,
-.timeline-component:not(.minimized) .scrubber .start-date,
-.timeline-component:not(.minimized) .scrubber .end-date,
-.timeline-component:not(.has-dates) .scrubber .start-date,
-.timeline-component:not(.has-dates) .scrubber .end-date,
-.timeline-component:not(.minimized) .scrubber .play-button,
-.timeline-component:not(.minimized) .scrubber .timeline-settings {
-  display: none;
-}
-
-.separator {
-  padding: 0.5em 0;
-  position: relative;
-
-  &:before {
-    content: "";
-    position: absolute;
-    top: 50%;
-    left: 4px;
-    right: 4px;
-    width: auto;
-    height: 1px;
-    background: #dce0e3;
-    transform: translateY(-50%);
-  }
-}
-
-.timeline-component-max-sized-scrolling-menu {
-  display: flex;
-  max-height: 100%;
-  > .tippy-box {
-    display: flex;
-    > .tippy-content {
-      display: flex;
-      > div {
-        display: flex;
-        > .iui-menu {
-          overflow: auto;
-        }
-      }
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+.timeline-component {
+  box-sizing: border-box;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  padding: 8px 16px;
+  min-width: 275px;
+
+  > .header {
+    display: flex;
+    align-items: center;
+    height: 38px;
+    position: relative;
+
+    > .play-backward {
+      border-radius: var(--iui-border-radius-1) 0 0 var(--iui-border-radius-1);
+    }
+
+    > .play-button-step {
+      border-left: none;
+      border-right: none;
+      border-radius: 0;
+    }
+
+    > .play-forward {
+      border-radius: 0px var(--iui-border-radius-1) var(--iui-border-radius-1) 0;
+    }
+
+    > .current-date {
+      font-size: 14px;
+      min-width: 180px;
+      padding: 8px;
+      color: var(--iui-color-text);
+      position: absolute;
+      left: 50%;
+      transform: translateX(-50%);
+      border-radius: var(--iui-border-radius-1);
+      border: solid 1px var(--iui-color-border);
+      background-color: var(--iui-color-background);
+      text-align: center;
+      box-sizing: border-box;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+
+  .play-button {
+    margin-right: 10px;
+  }
+
+  > .timeline-timeline {
+    margin: 8px 0;
+  }
+
+  > .scrubber {
+    min-height: 20px;
+    display: flex;
+    align-items: center;
+    position: relative;
+
+    .start-time-container,
+    .end-time-container {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+    }
+
+    .start-time,
+    .end-time {
+      font-size: 12px;
+      color: var(--iui-color-text-muted);
+      text-align: center;
+      min-height: inherit;
+    }
+
+    .duration-start-time,
+    .duration-end-time {
+      font-size: 14px;
+      width: 40px;
+      color: var(--iui-color-text);
+      text-align: center;
+      min-height: inherit;
+    }
+
+    .start-date,
+    .end-date {
+      font-size: 12px;
+      color: var(--iui-color-text-muted);
+      padding-bottom: 4px;
+    }
+
+    .slider {
+      position: relative;
+      flex: 1;
+      margin: 0 20px;
+      height: 24px;
+    }
+  }
+}
+
+.timeline-settings {
+  margin-left: auto;
+  font-size: 14px;
+  color: var(--iui-color-text);
+  cursor: pointer;
+
+  &:hover {
+    color: var(--iui-color-text-hover);
+  }
+
+  &:focus {
+    outline: none;
+  }
+}
+
+.timeline-component.minimized .timeline-settings {
+  margin-left: 8px;
+  margin-right: -6px;
+}
+
+.timeline-component.has-dates .start-time-container {
+  margin-right: 8px;
+}
+
+.timeline-component.has-dates .end-time-container {
+  margin-left: 8px;
+}
+
+.timeline-component.minimized .header,
+.timeline-component.minimized .timeline-timeline,
+.timeline-component:not(.minimized) .scrubber .start-date,
+.timeline-component:not(.minimized) .scrubber .end-date,
+.timeline-component:not(.has-dates) .scrubber .start-date,
+.timeline-component:not(.has-dates) .scrubber .end-date,
+.timeline-component:not(.minimized) .scrubber .play-button,
+.timeline-component:not(.minimized) .scrubber .timeline-settings {
+  display: none;
+}
+
+.separator {
+  padding: 0.5em 0;
+  position: relative;
+
+  &:before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 4px;
+    right: 4px;
+    width: auto;
+    height: 1px;
+    background: #dce0e3;
+    transform: translateY(-50%);
+  }
+}
+
+.timeline-component-max-sized-scrolling-menu {
+  display: flex;
+  max-height: 100%;
+  > .tippy-box {
+    display: flex;
+    > .tippy-content {
+      display: flex;
+      > div {
+        display: flex;
+        > .iui-menu {
+          overflow: auto;
+        }
+      }
+    }
+  }
+}

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

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/interfaces.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/interfaces.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhE;;GAEG;AACH,oBAAY,aAAa;IACvB,iBAAiB;IACjB,KAAK,IAAA;IACL,oBAAoB;IACpB,QAAQ,IAAA;IACR,kBAAkB;IAClB,MAAM,IAAA;IACN,gBAAgB;IAChB,IAAI,IAAA;IACJ,iBAAiB;IACjB,KAAK,IAAA;CACN;AAED;;GAEG;AACH,oBAAY,mBAAmB;IAC7B,qDAAqD;IACrD,UAAU,IAAA;IACV,sEAAsE;IACtE,WAAW,IAAA;CACZ;AAED;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC/B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,kDAAkD;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gGAAgG;IAChG,aAAa,CAAC,EAAE,IAAI,CAAC;IACrB,yHAAyH;IACzH,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB,yFAAyF;IACzF,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,6GAA6G;IAC7G,WAAW,CAAC,EAAE,mBAAmB,CAAC;CACnC;AAED;;;GAGG;AACH,MAAM,MAAM,8BAA8B,GAAG,CAC3C,iBAAiB,EAAE,MAAM,KACtB,IAAI,CAAC;AAEV;;;;GAIG;AACH,MAAM,MAAM,6BAA6B,GAAG,CAC1C,cAAc,EAAE,gBAAgB,KAC7B,IAAI,CAAC;AAEV;;GAEG;AACH,oBAAY,uBAAuB;IACjC,MAAM,IAAA;IACN,KAAK,IAAA;IACL,IAAI,IAAA;CACL;AACD;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,kBAAkB;IAC/D,cAAc,EAAE,uBAAuB,CAAC;CACzC;AACD;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,2BAA2B;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,kDAAkD;IAClD,MAAM,EAAE,MAAM,CAAC;IACf,yEAAyE;IACzE,yBAAyB,EAAE,OAAO,CAAC;IACnC,wCAAwC;IACxC,KAAK,CAAC,EAAE,IAAI,CAAC;IACb,mCAAmC;IACnC,GAAG,CAAC,EAAE,IAAI,CAAC;IACX,iDAAiD;IACjD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,IAAI,gBAAgB,CAAC;IAChC,wHAAwH;IACxH,eAAe,EAAE,MAAM,CAAC;IACxB,kDAAkD;IAClD,QAAQ,EAAE,MAAM,CAAC;IACjB,mDAAmD;IACnD,IAAI,EAAE,OAAO,CAAC;IACd,2CAA2C;IAC3C,cAAc,CAAC,QAAQ,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjD,qDAAqD;IACrD,gBAAgB,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;IACrC,uGAAuG;IACvG,wBAAwB,CAAC,EAAE,6BAA6B,CAAC;IACzD,2GAA2G;IAC3G,0BAA0B,CAAC,EAAE,8BAA8B,CAAC;IAC5D,iCAAiC;IACjC,QAAQ,CAAC,EAAE,cAAc,CAAC;CAC3B;AAED;;;;GAIG;AACH,MAAM,MAAM,4BAA4B,GAAG,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;AAEhE;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAEhC,MAAM,EAAE,MAAM,CAAC;IACf,yEAAyE;IACzE,yBAAyB,EAAE,OAAO,CAAC;IAEnC,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAC;IACrC,wCAAwC;IACxC,GAAG,EAAE,IAAI,CAAC;IACV,4CAA4C;IAC5C,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,0BAA0B;IAC1B,QAAQ,CAAC,SAAS,EAAE,IAAI,CAAC;IACzB,iDAAiD;IACjD,aAAa,CAAC,EAAE,4BAA4B,CAAC;IAC7C,iCAAiC;IACjC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,wCAAwC;IACxC,QAAQ,CAAC,OAAO,EAAE,IAAI,CAAC;IACvB,wCAAwC;IACxC,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC;IACtB,mBAAmB;IACnB,WAAW,EAAE,QAAQ,CAAC;IACtB,6CAA6C;IAC7C,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC;sGACkG;IAClG,cAAc,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,aAAa,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9D"}

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

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module Timeline
  */

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

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/interfaces.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAMH;;GAEG;AACH,MAAM,CAAN,IAAY,aAWX;AAXD,WAAY,aAAa;IACvB,iBAAiB;IACjB,mDAAK,CAAA;IACL,oBAAoB;IACpB,yDAAQ,CAAA;IACR,kBAAkB;IAClB,qDAAM,CAAA;IACN,gBAAgB;IAChB,iDAAI,CAAA;IACJ,iBAAiB;IACjB,mDAAK,CAAA;AACP,CAAC,EAXW,aAAa,KAAb,aAAa,QAWxB;AAED;;GAEG;AACH,MAAM,CAAN,IAAY,mBAKX;AALD,WAAY,mBAAmB;IAC7B,qDAAqD;IACrD,yEAAU,CAAA;IACV,sEAAsE;IACtE,2EAAW,CAAA;AACb,CAAC,EALW,mBAAmB,KAAnB,mBAAmB,QAK9B;AAoCD;;GAEG;AACH,MAAM,CAAN,IAAY,uBAIX;AAJD,WAAY,uBAAuB;IACjC,yEAAM,CAAA;IACN,uEAAK,CAAA;IACL,qEAAI,CAAA;AACN,CAAC,EAJW,uBAAuB,KAAvB,uBAAuB,QAIlC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Timeline\r\n */\r\n\r\nimport type { ColorDef } from \"@itwin/core-common\";\r\nimport type { ScreenViewport } from \"@itwin/core-frontend\";\r\nimport type { GenericUiEventArgs } from \"@itwin/appui-abstract\";\r\n\r\n/** The timeline scale.\r\n * @public\r\n */\r\nexport enum TimelineScale {\r\n  /** Show years */\r\n  Years,\r\n  /** Show quarters */\r\n  Quarters,\r\n  /** Show months */\r\n  Months,\r\n  /** Show days */\r\n  Days,\r\n  /** Show hours */\r\n  Hours,\r\n}\r\n\r\n/** Determines if data displayed to use is the actual date or the amount of time elapsed since project start.\r\n * @public\r\n */\r\nexport enum TimelineDateDisplay {\r\n  /** Display time axis using actual start/end dates */\r\n  ActualTime,\r\n  /** Display time axis using time relative to actual start/end dates */\r\n  ProjectTime,\r\n}\r\n\r\n/**\r\n * Playback Settings.\r\n * @public\r\n */\r\nexport interface PlaybackSettings {\r\n  /** time in milliseconds to play animation from start date to end date */\r\n  duration?: number;\r\n  /** Set to True if animation to restart each time playbackEnd is reached. Defaults to false. */\r\n  loop?: boolean;\r\n  /** If true a minimal set of data is displayed. */\r\n  minimized?: boolean;\r\n  /** Playback start. If defined must be within start-end range. If not define 'start' is used. */\r\n  playbackStart?: Date;\r\n  /** Playback end. If defined must be within start-end range and later than playbackStart. If not define 'end' is used. */\r\n  playbackEnd?: Date;\r\n  /** Set to True if user should be allowed to insert milestone dates. Defaults to false */\r\n  allowMilestoneEdits?: boolean;\r\n  /** Define if actual date/times are used or date/times relative to project are used to draw timeline axis. */\r\n  dateDisplay?: TimelineDateDisplay;\r\n}\r\n\r\n/**\r\n * An interface used to notify Handlers of the current pointer position in the timeline playback. Valid range is 0 to 1 and it determines percentage complete.\r\n * @public\r\n */\r\nexport type AnimationFractionChangeHandler = (animationFraction: number) => void;\r\n\r\n/**\r\n * An interface used to notify Handlers of Playback Settings changes.\r\n * Contains the settings to be used.\r\n * @public\r\n */\r\nexport type PlaybackSettingsChangeHandler = (settingsChange: PlaybackSettings) => void;\r\n\r\n/** Actions for Pause/Play event\r\n * @public\r\n */\r\nexport enum TimelinePausePlayAction {\r\n  Toggle,\r\n  Pause,\r\n  Play,\r\n}\r\n/** Args for event to pause or play the timeline component\r\n * @public\r\n */\r\nexport interface TimelinePausePlayArgs extends GenericUiEventArgs {\r\n  timelineAction: TimelinePausePlayAction;\r\n}\r\n/** Interface for a timeline data provider class\r\n * @public\r\n */\r\nexport interface TimelineDataProvider {\r\n  /** uniqueId of provider */\r\n  id: string;\r\n  /** view id when viewport is initially assigned */\r\n  viewId: string;\r\n  /** returns true if the provider has timeline animation data available */\r\n  supportsTimelineAnimation: boolean;\r\n  /** Starting date for entire timeline */\r\n  start?: Date;\r\n  /** End date for entire timeline */\r\n  end?: Date;\r\n  /** Current animation fraction from 0.0 to 1.0 */\r\n  animationFraction?: number;\r\n  getSettings(): PlaybackSettings;\r\n  /** Called to get the initial scrubber location. This must be a value between 0 and the duration in PlaybackSettings. */\r\n  initialDuration: number;\r\n  /** Called to get the duration of the Playback. */\r\n  duration: number;\r\n  /** If true the playback will continuously loop. */\r\n  loop: boolean;\r\n  /** Called to save the playback settings */\r\n  updateSettings(settings: PlaybackSettings): void;\r\n  /** Async call to load milestone and settings data */\r\n  loadTimelineData(): Promise<boolean>;\r\n  /** Called when an internal process has defined the playback settings and the UI needs to be updated */\r\n  onPlaybackSettingChanged?: PlaybackSettingsChangeHandler;\r\n  /** Called when the an internal process has defined the playback settings and the UI needs to be updated */\r\n  onAnimationFractionChanged?: AnimationFractionChangeHandler;\r\n  /** viewport to show animation */\r\n  viewport?: ScreenViewport;\r\n}\r\n\r\n/**\r\n * An interface used to notify Handlers of Playback progress.\r\n * Contains the settings to be used.\r\n * @alpha\r\n */\r\nexport type SolarPlaybackProgressHandler = (time: Date) => void;\r\n\r\n/** Data Provider interface for getting and setting solar position\r\n * @alpha\r\n */\r\nexport interface SolarDataProvider {\r\n  // View Id used to determine sunrise and sunset\r\n  viewId: string;\r\n  /** returns true if the provider has timeline animation data available */\r\n  supportsTimelineAnimation: boolean;\r\n  // set to true is timeline should be shown - return false if view is not set to display shadow.\r\n  readonly shouldShowTimeline: boolean;\r\n  /** Starting date for entire timeline */\r\n  day: Date;\r\n  /** Starting time for day in milliseconds */\r\n  readonly dayStartMs: number;\r\n  /** Time of day for sun */\r\n  readonly timeOfDay: Date;\r\n  /** Called during playback to update animation */\r\n  onTimeChanged?: SolarPlaybackProgressHandler;\r\n  /** viewport to show animation */\r\n  viewport?: ScreenViewport;\r\n  /** Time of Sunrise to nearest minute */\r\n  readonly sunrise: Date;\r\n  /** time of Sunrise to nearest minute */\r\n  readonly sunset: Date;\r\n  /** shadow color */\r\n  shadowColor: ColorDef;\r\n  /** timezone offset for local project time */\r\n  readonly timeZoneOffset: number;\r\n  /** set date for shadow study. If isProjectDate is false the is assume to be in users\r\n   * current time and the value is adjusted to be the same date and time at the project location. */\r\n  setDateAndTime: (day: Date, isProjectDate?: boolean) => void;\r\n}\r\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/interfaces.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAMH;;GAEG;AACH,MAAM,CAAN,IAAY,aAWX;AAXD,WAAY,aAAa;IACvB,iBAAiB;IACjB,mDAAK,CAAA;IACL,oBAAoB;IACpB,yDAAQ,CAAA;IACR,kBAAkB;IAClB,qDAAM,CAAA;IACN,gBAAgB;IAChB,iDAAI,CAAA;IACJ,iBAAiB;IACjB,mDAAK,CAAA;AACP,CAAC,EAXW,aAAa,KAAb,aAAa,QAWxB;AAED;;GAEG;AACH,MAAM,CAAN,IAAY,mBAKX;AALD,WAAY,mBAAmB;IAC7B,qDAAqD;IACrD,yEAAU,CAAA;IACV,sEAAsE;IACtE,2EAAW,CAAA;AACb,CAAC,EALW,mBAAmB,KAAnB,mBAAmB,QAK9B;AAwCD;;GAEG;AACH,MAAM,CAAN,IAAY,uBAIX;AAJD,WAAY,uBAAuB;IACjC,yEAAM,CAAA;IACN,uEAAK,CAAA;IACL,qEAAI,CAAA;AACN,CAAC,EAJW,uBAAuB,KAAvB,uBAAuB,QAIlC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Timeline\n */\n\nimport type { ColorDef } from \"@itwin/core-common\";\nimport type { ScreenViewport } from \"@itwin/core-frontend\";\nimport type { GenericUiEventArgs } from \"@itwin/appui-abstract\";\n\n/** The timeline scale.\n * @public\n */\nexport enum TimelineScale {\n  /** Show years */\n  Years,\n  /** Show quarters */\n  Quarters,\n  /** Show months */\n  Months,\n  /** Show days */\n  Days,\n  /** Show hours */\n  Hours,\n}\n\n/** Determines if data displayed to use is the actual date or the amount of time elapsed since project start.\n * @public\n */\nexport enum TimelineDateDisplay {\n  /** Display time axis using actual start/end dates */\n  ActualTime,\n  /** Display time axis using time relative to actual start/end dates */\n  ProjectTime,\n}\n\n/**\n * Playback Settings.\n * @public\n */\nexport interface PlaybackSettings {\n  /** time in milliseconds to play animation from start date to end date */\n  duration?: number;\n  /** Set to True if animation to restart each time playbackEnd is reached. Defaults to false. */\n  loop?: boolean;\n  /** If true a minimal set of data is displayed. */\n  minimized?: boolean;\n  /** Playback start. If defined must be within start-end range. If not define 'start' is used. */\n  playbackStart?: Date;\n  /** Playback end. If defined must be within start-end range and later than playbackStart. If not define 'end' is used. */\n  playbackEnd?: Date;\n  /** Set to True if user should be allowed to insert milestone dates. Defaults to false */\n  allowMilestoneEdits?: boolean;\n  /** Define if actual date/times are used or date/times relative to project are used to draw timeline axis. */\n  dateDisplay?: TimelineDateDisplay;\n}\n\n/**\n * An interface used to notify Handlers of the current pointer position in the timeline playback. Valid range is 0 to 1 and it determines percentage complete.\n * @public\n */\nexport type AnimationFractionChangeHandler = (\n  animationFraction: number\n) => void;\n\n/**\n * An interface used to notify Handlers of Playback Settings changes.\n * Contains the settings to be used.\n * @public\n */\nexport type PlaybackSettingsChangeHandler = (\n  settingsChange: PlaybackSettings\n) => void;\n\n/** Actions for Pause/Play event\n * @public\n */\nexport enum TimelinePausePlayAction {\n  Toggle,\n  Pause,\n  Play,\n}\n/** Args for event to pause or play the timeline component\n * @public\n */\nexport interface TimelinePausePlayArgs extends GenericUiEventArgs {\n  timelineAction: TimelinePausePlayAction;\n}\n/** Interface for a timeline data provider class\n * @public\n */\nexport interface TimelineDataProvider {\n  /** uniqueId of provider */\n  id: string;\n  /** view id when viewport is initially assigned */\n  viewId: string;\n  /** returns true if the provider has timeline animation data available */\n  supportsTimelineAnimation: boolean;\n  /** Starting date for entire timeline */\n  start?: Date;\n  /** End date for entire timeline */\n  end?: Date;\n  /** Current animation fraction from 0.0 to 1.0 */\n  animationFraction?: number;\n  getSettings(): PlaybackSettings;\n  /** Called to get the initial scrubber location. This must be a value between 0 and the duration in PlaybackSettings. */\n  initialDuration: number;\n  /** Called to get the duration of the Playback. */\n  duration: number;\n  /** If true the playback will continuously loop. */\n  loop: boolean;\n  /** Called to save the playback settings */\n  updateSettings(settings: PlaybackSettings): void;\n  /** Async call to load milestone and settings data */\n  loadTimelineData(): Promise<boolean>;\n  /** Called when an internal process has defined the playback settings and the UI needs to be updated */\n  onPlaybackSettingChanged?: PlaybackSettingsChangeHandler;\n  /** Called when the an internal process has defined the playback settings and the UI needs to be updated */\n  onAnimationFractionChanged?: AnimationFractionChangeHandler;\n  /** viewport to show animation */\n  viewport?: ScreenViewport;\n}\n\n/**\n * An interface used to notify Handlers of Playback progress.\n * Contains the settings to be used.\n * @alpha\n */\nexport type SolarPlaybackProgressHandler = (time: Date) => void;\n\n/** Data Provider interface for getting and setting solar position\n * @alpha\n */\nexport interface SolarDataProvider {\n  // View Id used to determine sunrise and sunset\n  viewId: string;\n  /** returns true if the provider has timeline animation data available */\n  supportsTimelineAnimation: boolean;\n  // set to true is timeline should be shown - return false if view is not set to display shadow.\n  readonly shouldShowTimeline: boolean;\n  /** Starting date for entire timeline */\n  day: Date;\n  /** Starting time for day in milliseconds */\n  readonly dayStartMs: number;\n  /** Time of day for sun */\n  readonly timeOfDay: Date;\n  /** Called during playback to update animation */\n  onTimeChanged?: SolarPlaybackProgressHandler;\n  /** viewport to show animation */\n  viewport?: ScreenViewport;\n  /** Time of Sunrise to nearest minute */\n  readonly sunrise: Date;\n  /** time of Sunrise to nearest minute */\n  readonly sunset: Date;\n  /** shadow color */\n  shadowColor: ColorDef;\n  /** timezone offset for local project time */\n  readonly timeZoneOffset: number;\n  /** set date for shadow study. If isProjectDate is false the is assume to be in users\n   * current time and the value is adjusted to be the same date and time at the project location. */\n  setDateAndTime: (day: Date, isProjectDate?: boolean) => void;\n}\n"]}

package/lib/esm/imodel-components-react/viewport/ViewportComponent.d.ts

@@ -3,8 +3,8 @@
  */
 import * as React from "react";
 import type { Id64String } from "@itwin/core-bentley";
-import type { IModelConnection, TentativePoint, ViewManager } from "@itwin/core-frontend";
-import { ScreenViewport, ViewState } from "@itwin/core-frontend";
+import type { IModelConnection, TentativePoint, ViewManager, ViewState } from "@itwin/core-frontend";
+import { ScreenViewport } from "@itwin/core-frontend";
 import type { CommonProps } from "@itwin/core-react";
 /** Type for a ViewState prop
  * @public

package/lib/esm/imodel-components-react/viewport/ViewportComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ViewportComponent.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/viewport/ViewportComponent.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAC,MAAM,qBAAqB,CAAC;AAKrD,OAAO,KAAK,EAAE,gBAAgB,EAC5B,cAAc,EAAE,WAAW,EAClB,MAAM,sBAAsB,CAAC;AACxC,OAAO,EACM,cAAc,EAAgB,SAAS,EACnD,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAMrD;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,CAAC,MAAM,SAAS,CAAC,CAAC;AAE1D;;;GAGG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,wBAAwB;IACxB,MAAM,EAAE,gBAAgB,CAAC;IACzB,kEAAkE;IAClE,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,wDAAwD;IACxD,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IAC1C,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB;IAChB,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,OAAO,CAAC;IACjD,gBAAgB;IAChB,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/D,sCAAsC;IACtC,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAClC,sCAAsC;IACtC,sBAAsB,CAAC,EAAE,OAAO,cAAc,CAAC;IAC/C,sCAAsC;IACtC,sBAAsB,CAAC,EAAE,cAAc,CAAC;CACzC;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,aAAa,eAwQrD"}
+{"version":3,"file":"ViewportComponent.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/viewport/ViewportComponent.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAKtD,OAAO,KAAK,EACV,gBAAgB,EAChB,cAAc,EACd,WAAW,EAEX,SAAS,EACV,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAEL,cAAc,EAGf,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAQrD;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,CAAC,MAAM,SAAS,CAAC,CAAC;AAE1D;;;GAGG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,wBAAwB;IACxB,MAAM,EAAE,gBAAgB,CAAC;IACzB,kEAAkE;IAClE,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,wDAAwD;IACxD,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IAC1C,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB;IAChB,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,OAAO,CAAC;IACjD,gBAAgB;IAChB,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/D,sCAAsC;IACtC,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAClC,sCAAsC;IACtC,sBAAsB,CAAC,EAAE,OAAO,cAAc,CAAC;IAC/C,sCAAsC;IACtC,sBAAsB,CAAC,EAAE,cAAc,CAAC;CACzC;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,aAAa,eAiVrD"}

package/lib/esm/imodel-components-react/viewport/ViewportComponent.js

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module Viewport
  */
@@ -9,16 +9,16 @@ import * as React from "react";
 import { Logger } from "@itwin/core-bentley";
 import { Transform } from "@itwin/core-geometry";
 import { NpcCenter } from "@itwin/core-common";
-import { IModelApp, ScreenViewport, ToolSettings, ViewState, } from "@itwin/core-frontend";
-import { ViewportComponentEvents, } from "./ViewportComponentEvents";
+import { IModelApp, ScreenViewport, StandardView, ToolSettings, } from "@itwin/core-frontend";
+import { ViewportComponentEvents } from "./ViewportComponentEvents";
 /**
  * A viewport React component that creates a ScreenViewport.
  * @public
  */
 export function ViewportComponent(props) {
-    const { viewState, imodel, viewDefinitionId, getViewOverlay, viewManagerOverride, tentativePointOverride, onContextMenu, style, className, screenViewportOverride, controlId, viewportRef } = props;
+    const { viewState, imodel, viewDefinitionId, getViewOverlay, viewManagerOverride, tentativePointOverride, onContextMenu, style, className, screenViewportOverride, controlId, viewportRef, } = props;
     // istanbul ignore next
-    const viewManagerRef = React.useRef(viewManagerOverride !== null && viewManagerOverride !== void 0 ? viewManagerOverride : IModelApp.viewManager);
+    const viewManagerRef = React.useRef(viewManagerOverride ?? IModelApp.viewManager);
     const tentativePointOverrideRef = React.useRef(tentativePointOverride);
     const screenViewportCreated = React.useRef(false);
     const viewportDiv = React.useRef(null);
@@ -34,13 +34,21 @@ export function ViewportComponent(props) {
         ViewportComponentEvents.setViewMatrix(vp);
         if (viewClassFullName.current !== vp.view.classFullName) {
             setTimeout(() => {
-                ViewportComponentEvents.onViewClassFullNameChangedEvent.emit({ viewport: vp, oldName: viewClassFullName.current, newName: vp.view.classFullName });
+                ViewportComponentEvents.onViewClassFullNameChangedEvent.emit({
+                    viewport: vp,
+                    oldName: viewClassFullName.current,
+                    newName: vp.view.classFullName,
+                });
                 viewClassFullName.current = vp.view.classFullName;
             });
         }
         if (viewId.current !== vp.view.id) {
             setTimeout(() => {
-                ViewportComponentEvents.onViewIdChangedEvent.emit({ viewport: vp, oldId: viewId.current, newId: vp.view.id });
+                ViewportComponentEvents.onViewIdChangedEvent.emit({
+                    viewport: vp,
+                    oldId: viewId.current,
+                    newId: vp.view.id,
+                });
                 viewId.current = vp.view.id;
             });
         }
@@ -48,38 +56,33 @@ export function ViewportComponent(props) {
     const handleStandardRotationChangeEvent = (args) => {
         const viewManager = viewManagerRef.current;
         const currentScreenViewport = screenViewportRef.current;
-        if (currentScreenViewport && viewManager.selectedView === currentScreenViewport) {
-            currentScreenViewport.view.setRotationAboutPoint(ViewState.getStandardViewMatrix(args.standardRotation));
+        if (currentScreenViewport &&
+            viewManager.selectedView === currentScreenViewport) {
+            currentScreenViewport.view.setRotationAboutPoint(StandardView.getStandardRotation(args.standardRotation));
             currentScreenViewport.synchWithView();
         }
     };
     const handleDrawingViewportChangeEvent = (args) => {
         const viewManager = viewManagerRef.current;
         const currentScreenViewport = screenViewportRef.current;
-        if (currentScreenViewport && viewManager.selectedView === currentScreenViewport) {
+        if (currentScreenViewport &&
+            viewManager.selectedView === currentScreenViewport) {
             currentScreenViewport.view.setOrigin(args.origin);
             currentScreenViewport.view.setRotation(args.rotation);
-            currentScreenViewport.synchWithView({ noSaveInUndo: args.complete !== true });
+            currentScreenViewport.synchWithView({
+                noSaveInUndo: args.complete !== true,
+            });
         }
     };
     const targetPoint = React.useRef(null);
     const getRotatePoint = (vp) => {
-        var _a, _b;
         const lastTargetPoint = targetPoint.current;
         // istanbul ignore next
-        const tentativePoint = (_a = tentativePointOverrideRef.current) !== null && _a !== void 0 ? _a : IModelApp.tentativePoint;
+        const tentativePoint = tentativePointOverrideRef.current ?? IModelApp.tentativePoint;
         // istanbul ignore else
         if (tentativePoint.isActive)
             return tentativePoint.getPoint();
         // istanbul ignore else
-        if (undefined !== vp.viewCmdTargetCenter) {
-            const testPt = vp.worldToView(vp.viewCmdTargetCenter);
-            const viewRect = vp.viewRect;
-            if (viewRect.containsPoint(testPt))
-                return vp.viewCmdTargetCenter;
-            vp.viewCmdTargetCenter = undefined;
-        }
-        // istanbul ignore else
         if (null !== lastTargetPoint) {
             const testPt = vp.worldToView(lastTargetPoint);
             const viewRect = vp.viewRect.clone();
@@ -90,15 +93,17 @@ export function ViewportComponent(props) {
             targetPoint.current = null;
         }
         const visiblePoint = vp.pickNearestVisibleGeometry(vp.npcToWorld(NpcCenter), vp.pixelsFromInches(ToolSettings.viewToolPickRadiusInches));
-        targetPoint.current = (undefined !== visiblePoint ? visiblePoint : vp.view.getTargetPoint());
+        targetPoint.current =
+            undefined !== visiblePoint ? visiblePoint : vp.view.getTargetPoint();
         // istanbul ignore next
-        return (_b = targetPoint.current) !== null && _b !== void 0 ? _b : vp.view.getCenter();
+        return targetPoint.current ?? vp.view.getCenter();
     };
     const handleCubeRotationChangeEvent = (args) => {
         const viewManager = viewManagerRef.current;
         const currentScreenViewport = screenViewportRef.current;
         // istanbul ignore else
-        if (currentScreenViewport && viewManager.selectedView === currentScreenViewport) {
+        if (currentScreenViewport &&
+            viewManager.selectedView === currentScreenViewport) {
             const rotMatrix = args.rotMatrix;
             // istanbul ignore else
             if (currentScreenViewport.rotation !== rotMatrix) {
@@ -138,7 +143,9 @@ export function ViewportComponent(props) {
     };
     const getScreenViewport = (parentDiv, inViewState) => {
         // istanbul ignore next
-        const screenViewportFactory = screenViewportOverride ? screenViewportOverride : ScreenViewport;
+        const screenViewportFactory = screenViewportOverride
+            ? screenViewportOverride
+            : ScreenViewport;
         const parentWindow = parentDiv.ownerDocument.defaultView;
         parentWindow.addEventListener("unload", handleWindowUnload, true); // listener clear after being called
         ViewportComponentEvents.initialize();
@@ -200,21 +207,23 @@ export function ViewportComponent(props) {
                 Logger.logError("ViewportComponent", `A Viewstate or a viewId and imodel must be provided`);
             }
             // istanbul ignore next
-            if (isMounted.current && ((currentViewState === null || currentViewState === void 0 ? void 0 : currentViewState.iModel.isOpen) || (currentViewState === null || currentViewState === void 0 ? void 0 : currentViewState.iModel.isBlank))) {
-                setInitialViewState(currentViewState === null || currentViewState === void 0 ? void 0 : currentViewState.clone());
+            if (isMounted.current &&
+                (currentViewState?.iModel.isOpen || currentViewState?.iModel.isBlank)) {
+                setInitialViewState(currentViewState?.clone());
             }
         }
         if (undefined === initialViewState)
-            fetchInitialViewstate(); // eslint-disable-line @typescript-eslint/no-floating-promises
+            void fetchInitialViewstate();
     }, [imodel, initialViewState, viewDefinitionId, viewState]);
     const [viewOverlay, setViewOverlay] = React.useState(null);
     // This useEffect connects to ViewManger as soon as initialViewState is available once component is mounted.
     React.useEffect(() => {
-        var _a;
         const parentDiv = viewportDiv.current;
         const viewManager = viewManagerRef.current;
         // istanbul ignore next
-        if (parentDiv && initialViewState && ((initialViewState === null || initialViewState === void 0 ? void 0 : initialViewState.iModel.isOpen) || (initialViewState === null || initialViewState === void 0 ? void 0 : initialViewState.iModel.isBlank))) {
+        if (parentDiv &&
+            initialViewState &&
+            (initialViewState?.iModel.isOpen || initialViewState?.iModel.isBlank)) {
             if (!screenViewportCreated.current) {
                 const screenViewport = getScreenViewport(parentDiv, initialViewState);
                 screenViewportRef.current = screenViewport;
@@ -227,7 +236,7 @@ export function ViewportComponent(props) {
             }
             else {
                 // istanbul ignore next
-                (_a = screenViewportRef.current) === null || _a === void 0 ? void 0 : _a.changeView(initialViewState);
+                screenViewportRef.current?.changeView(initialViewState);
             }
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -238,11 +247,14 @@ export function ViewportComponent(props) {
             onContextMenu(e);
     }, [onContextMenu]);
     const parentDivStyle = {
-        height: "100%", width: "100%", position: "relative",
+        height: "100%",
+        width: "100%",
+        position: "relative",
     };
     const viewportDivStyle = {
         ...style,
-        height: "100%", width: "100%",
+        height: "100%",
+        width: "100%",
     };
     return (React.createElement("div", { style: parentDivStyle, "data-item-id": controlId },
         React.createElement(React.Fragment, null,