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

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

@@ -1 +1 @@
-{"version":3,"file":"TimelineComponent.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/TimelineComponent.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 */\nimport type { GenericUiEventArgs } from \"@itwin/appui-abstract\";\nimport { UiAdmin } from \"@itwin/appui-abstract\";\nimport type { DateFormatOptions } from \"@itwin/components-react\";\nimport {\n  toDateString,\n  toTimeString,\n  UiComponents,\n} from \"@itwin/components-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport {\n  SvgCaretLeft,\n  SvgCaretRight,\n  SvgCheckmark,\n  SvgMoreVertical,\n  SvgPlayCircular,\n} from \"@itwin/itwinui-icons-react\";\nimport { DropdownMenu, MenuDivider, MenuItem } from \"@itwin/itwinui-react\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\n\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { InlineEdit } from \"./InlineEdit\";\nimport type { PlaybackSettings, TimelinePausePlayArgs } from \"./interfaces\";\nimport { TimelinePausePlayAction } from \"./interfaces\";\nimport { PlayButton, PlayerButton } from \"./PlayerButton\";\nimport { Scrubber } from \"./Scrubber\";\n\nimport \"./TimelineComponent.scss\";\n\n// cspell:ignore millisec\n\nconst slowSpeed = 60 * 1000;\nconst mediumSpeed = 20 * 1000;\nconst fastSpeed = 10 * 1000;\n/**\n * [[TimelineMenuItemOption]]: specifies how the app wants the timeline speeds to be installed on the TimelineComponent's ContextMenu\n * \"replace\" : use the app-supplied items in place of the standard items\n * \"append\" : add the app-supplied items following the standard items\n * \"prefix\" : add the app-supplied items before the standard items\n *\n * @public\n */\nexport type TimelineMenuItemOption = \"replace\" | \"append\" | \"prefix\";\n/**\n * [[TimelineMenuItemProps]] specifies playback speed entries in the Timeline's ContextMenu\n * @public\n */\nexport interface TimelineMenuItemProps {\n  /** localized label for menu item */\n  label: string;\n\n  /** duration for the entire timeline to play */\n  timelineDuration: number;\n}\n/** TimelineDateMarkerProps: Mark a date on the timeline with an indicator\n * @public\n */\nexport interface TimelineDateMarkerProps {\n  /** Date to mark. If undefined, today's date will be used. */\n  date?: Date;\n  /** ReactNode to use as the marker on the timeline. If undefined, a short vertical bar will mark the date. */\n  dateMarker?: React.ReactNode;\n}\n/**\n *  [[TimelineComponentProps]] configure the timeline\n * @public\n */\nexport interface TimelineComponentProps {\n  /** Start date: beginning of the date range of a date-based timeline. */\n  startDate?: Date;\n  /** End date: end of the date range of a date-based timeline. */\n  endDate?: Date;\n  /** Total duration: range of the timeline in milliseconds. */\n  totalDuration: number;\n  /** Initial value for the current duration (the location of the thumb) in milliseconds */\n  initialDuration?: number;\n  /** Show in minimized mode (For future use. This prop will always be treated as true.) */\n  minimized?: boolean;\n  /** When playing, repeat indefinitely */\n  repeat?: boolean;\n  /** Show duration instead of time */\n  showDuration?: boolean;\n  /** Callback with current duration value (as a fraction) */\n  onChange?: (duration: number) => void;\n  /** Callback triggered when play/pause button is pressed */\n  onPlayPause?: (playing: boolean) => void;\n  /** Callback triggered when backward/forward buttons are pressed */\n  onJump?: (forward: boolean) => void;\n  /** Callback triggered when a setting is changed */\n  onSettingsChange?: (arg: PlaybackSettings) => void;\n  /** Always display in miniMode with no expand menu (For future use. This prop will always be treated as true) */\n  alwaysMinimized?: boolean;\n  /** ComponentId -- must be set to use TimelineComponentEvents */\n  componentId?: string;\n  /** Include the repeat option on the Timeline Context Menu */\n  includeRepeat?: boolean;\n  /** App-supplied speed entries in the Timeline Context Menu */\n  appMenuItems?: TimelineMenuItemProps[];\n  /** How to include the supplied app menu items in the Timeline Context Menu (prefix, append, replace)*/\n  appMenuItemOption?: TimelineMenuItemOption;\n  /** Display date and time offset by the number of minutes specified. When undefined - local timezone will be used */\n  timeZoneOffset?: number;\n  /** Display a marker on the timeline rail to indicate current date - will only work if starDate and endDate are defined */\n  markDate?: TimelineDateMarkerProps;\n  /** Options used to format date string. If not defined it will user browser default locale settings. */\n  dateFormatOptions?: DateFormatOptions;\n  /** Options used to format time string. If not defined it will user browser default locale settings. */\n  timeFormatOptions?: DateFormatOptions;\n}\n/** @internal */\ninterface TimelineComponentState {\n  /**  True if timeline is currently playing, false if paused */\n  isPlaying: boolean;\n  /** Minimized mode (For future use. This will always be true) */\n  minimized?: boolean;\n  /** Current duration in milliseconds */\n  currentDuration: number;\n  /** Total duration in milliseconds */\n  totalDuration: number;\n  /** If true, automatically restart when the timeline is finished playing */\n  repeat: boolean;\n  /** If true, include the repeat option in the timeline context menu */\n  includeRepeat: boolean;\n}\n\n/**\n * [[TimelineComponent]] is used to playback timeline data\n * @public\n */\nexport class TimelineComponent extends React.Component<\n  TimelineComponentProps,\n  TimelineComponentState\n> {\n  private _timeLastCycle = 0;\n  private _requestFrame = 0;\n  private _unmounted = false;\n  private _repeatLabel: string;\n  private _removeListener?: () => void;\n  private _standardTimelineMenuItems: TimelineMenuItemProps[] = [\n    {\n      label: UiIModelComponents.translate(\"timeline.slow\"),\n      timelineDuration: slowSpeed,\n    },\n    {\n      label: UiIModelComponents.translate(\"timeline.medium\"),\n      timelineDuration: mediumSpeed,\n    },\n    {\n      label: UiIModelComponents.translate(\"timeline.fast\"),\n      timelineDuration: fastSpeed,\n    },\n  ];\n\n  constructor(props: TimelineComponentProps) {\n    super(props);\n\n    this.state = {\n      isPlaying: false,\n      minimized: true,\n      currentDuration: props.initialDuration\n        ? props.initialDuration\n        : /* istanbul ignore next */ 0,\n      totalDuration: this.props.totalDuration,\n      repeat: this.props.repeat ? true : false,\n      includeRepeat:\n        this.props.includeRepeat || this.props.includeRepeat === undefined\n          ? true\n          : false,\n    };\n\n    this._repeatLabel = UiIModelComponents.translate(\"timeline.repeat\");\n    // istanbul ignore else\n    if (this.props.componentId) {\n      // can't handle an event if we have no id\n      this._removeListener = UiAdmin.onGenericUiEvent.addListener(\n        this._handleTimelinePausePlayEvent\n      );\n    }\n  }\n\n  public override componentWillUnmount() {\n    if (this._removeListener) this._removeListener();\n    window.cancelAnimationFrame(this._requestFrame);\n    this._unmounted = true;\n  }\n\n  public override shouldComponentUpdate(\n    nextProps: TimelineComponentProps,\n    nextState: TimelineComponentState\n  ) {\n    let result = false;\n\n    // istanbul ignore next\n    if (\n      nextState !== this.state ||\n      nextProps !== this.props ||\n      nextProps.startDate !== this.props.startDate ||\n      nextProps.endDate !== this.props.endDate ||\n      nextProps.initialDuration !== this.props.initialDuration ||\n      nextProps.repeat !== this.props.repeat\n    )\n      result = true;\n\n    return result;\n  }\n\n  public override componentDidUpdate(prevProps: TimelineComponentProps) {\n    // istanbul ignore else\n    if (this.props.initialDuration !== prevProps.initialDuration) {\n      this._setDuration(\n        this.props.initialDuration\n          ? this.props.initialDuration\n          : /* istanbul ignore next */ 0,\n        this.props.totalDuration !== prevProps.totalDuration\n          ? this.props.totalDuration\n          : undefined\n      );\n    }\n\n    // istanbul ignore else\n    if (this.props.repeat !== prevProps.repeat) {\n      this._changeRepeatSetting(this.props.repeat);\n    }\n\n    // istanbul ignore else\n    if (this.props.totalDuration !== prevProps.totalDuration) {\n      this._onSetTotalDuration(this.props.totalDuration);\n    }\n  }\n  private _handleTimelinePausePlayEvent = (args: GenericUiEventArgs): void => {\n    const timelineArgs = args as TimelinePausePlayArgs;\n    // istanbul ignore else\n    if (\n      !timelineArgs ||\n      this.props.componentId !== timelineArgs.uiComponentId ||\n      timelineArgs.timelineAction === undefined\n    )\n      return;\n\n    let startPlaying: boolean;\n    switch (timelineArgs.timelineAction) {\n      case TimelinePausePlayAction.Play:\n        startPlaying = true;\n        break;\n      case TimelinePausePlayAction.Pause:\n        startPlaying = false;\n        break;\n      case TimelinePausePlayAction.Toggle:\n        startPlaying = !this.state.isPlaying;\n        break;\n      // istanbul ignore next\n      default:\n        return; // throw error?\n    }\n    if (startPlaying) this._onPlay();\n    else this._onPause();\n  };\n\n  // user clicked backward button\n  private _onBackward = () => {\n    // istanbul ignore else\n    if (this.props.onJump) this.props.onJump(false);\n  };\n\n  // user clicked forward button\n  private _onForward = () => {\n    // istanbul ignore else\n    if (this.props.onJump) this.props.onJump(true);\n  };\n\n  // user clicked play button\n  private _onPlay = () => {\n    // istanbul ignore if\n    if (this.state.isPlaying) return;\n\n    // timeline was complete, restart from the beginning\n    if (this.state.currentDuration >= this.state.totalDuration) {\n      this._replay();\n    } else this._play();\n\n    // istanbul ignore else\n    if (this.props.onPlayPause) this.props.onPlayPause(true);\n  };\n\n  // user clicked pause button\n  private _onPause = () => {\n    // istanbul ignore if\n    if (!this.state.isPlaying) return;\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 on timeline rail or dragged scrubber handle\n  private _onTimelineChange = (values: ReadonlyArray<number>) => {\n    const currentDuration = values[0];\n    this._setDuration(currentDuration);\n  };\n\n  // set the current duration, which will call the OnChange callback\n  private _setDuration = (currentDuration: number, updatedTotal?: number) => {\n    const actualDuration = Math.min(\n      updatedTotal ?? this.state.totalDuration,\n      Math.max(currentDuration, 0)\n    );\n\n    this._timeLastCycle = new Date().getTime();\n    // istanbul ignore else\n    if (!this._unmounted) this.setState({ currentDuration: actualDuration });\n    // istanbul ignore else\n    if (this.props.onChange) {\n      const fraction =\n        actualDuration / (updatedTotal ?? this.state.totalDuration);\n      this.props.onChange(fraction);\n    }\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      return;\n    }\n\n    // update duration\n    const currentTime = new Date().getTime();\n    const millisecondsElapsed = currentTime - this._timeLastCycle;\n    const duration = this.state.currentDuration + millisecondsElapsed;\n    this._setDuration(duration);\n\n    // stop the animation!\n    if (duration >= this.state.totalDuration) {\n      window.cancelAnimationFrame(this._requestFrame);\n      this.setState({ isPlaying: false });\n      if (this.state.repeat) this._replay();\n      else {\n        // istanbul ignore else\n        if (this.props.onPlayPause) this.props.onPlayPause(false);\n      }\n\n      return;\n    }\n\n    // continue the animation - request the next frame\n    this._requestFrame = window.requestAnimationFrame(this._updateAnimation);\n  };\n\n  private _play() {\n    // start playing\n    this.setState({ isPlaying: true }, () => {\n      // request the next frame\n      this._timeLastCycle = new Date().getTime();\n      this._requestFrame = window.requestAnimationFrame(this._updateAnimation);\n    });\n  }\n\n  private _replay = () => {\n    // timeline was complete, restart from the beginning\n    this.setState({ currentDuration: 0 }, () => this._play());\n  };\n\n  private _displayTime(millisec: number) {\n    const addZero = (i: number) => {\n      return i < 10 ? `0${i}` : i;\n    };\n\n    const date = new Date(millisec);\n    // const hours = date.getUTCHours();\n    const minutes = date.getUTCMinutes();\n    const seconds = date.getUTCSeconds();\n    return `${addZero(minutes)}:${addZero(seconds)}`;\n  }\n\n  private _getMilliseconds(time: string) {\n    // istanbul ignore else - WIP\n    if (time.indexOf(\":\") !== -1) {\n      return (\n        (Number(time.split(\":\")[0]) * 60 + Number(time.split(\":\")[1])) * 1000\n      );\n    } else {\n      return Number(time) * 1000;\n    }\n  }\n\n  // user changed the total duration\n  private _onTotalDurationChange = (value: string) => {\n    // NOTE: we should reset the current duration to 0\n    const milliseconds = this._getMilliseconds(value);\n    this._onSetTotalDuration(milliseconds);\n  };\n\n  private _changeRepeatSetting = (newValue?: boolean) => {\n    // istanbul ignore else\n    if (newValue !== undefined) {\n      this.setState(\n        () => ({ repeat: newValue }),\n        () => {\n          // istanbul ignore else\n          if (this.props.onSettingsChange) {\n            this.props.onSettingsChange({ loop: this.state.repeat });\n          }\n        }\n      );\n    }\n  };\n\n  private _onRepeatChanged = () => {\n    this.setState(\n      (prevState) => ({ repeat: !prevState.repeat }),\n      () => {\n        // istanbul ignore else\n        if (this.props.onSettingsChange) {\n          this.props.onSettingsChange({ loop: this.state.repeat });\n        }\n      }\n    );\n  };\n\n  private _currentDate = (): Date => {\n    const fraction = this.state.currentDuration / this.state.totalDuration;\n    if (this.props.endDate && this.props.startDate) {\n      const timeElapsed =\n        (this.props.endDate.getTime() - this.props.startDate.getTime()) *\n        fraction;\n      return new Date(this.props.startDate.getTime() + timeElapsed);\n    }\n    return new Date();\n  };\n\n  private _onSetTotalDuration = (milliseconds: number) => {\n    this.setState({ totalDuration: milliseconds }, () => {\n      // istanbul ignore else\n      if (this.props.onSettingsChange) {\n        this.props.onSettingsChange({ duration: milliseconds });\n      }\n    });\n  };\n\n  private _createMenuItemNode(\n    item: TimelineMenuItemProps,\n    index: number,\n    currentTimelineDuration: number,\n    close: () => void\n  ): React.ReactElement {\n    const label = item.label;\n    const checked = currentTimelineDuration === item.timelineDuration;\n    const icon = checked ? (\n      <span className=\"icon\">\n        <Icon iconSpec={<SvgCheckmark />} />{\" \"}\n      </span>\n    ) : (\n      <span />\n    );\n    return (\n      <MenuItem\n        key={index}\n        startIcon={icon}\n        onClick={() => {\n          this._onSetTotalDuration(item.timelineDuration);\n          close();\n        }}\n      >\n        {label}\n      </MenuItem>\n    );\n  }\n\n  private _renderSettings = () => {\n    const createMenuItemNodes = (close: () => void): React.ReactElement[] => {\n      const { totalDuration } = this.state;\n      let contextMenuItems: Array<TimelineMenuItemProps> = [];\n\n      if (!this.props.appMenuItems) {\n        contextMenuItems = this._standardTimelineMenuItems;\n      } else {\n        if (this.props.appMenuItemOption === \"append\") {\n          contextMenuItems = this._standardTimelineMenuItems.concat(\n            this.props.appMenuItems\n          );\n        } else if (this.props.appMenuItemOption === \"prefix\") {\n          contextMenuItems = this.props.appMenuItems.concat(\n            this._standardTimelineMenuItems\n          );\n        } else {\n          contextMenuItems = this.props.appMenuItems;\n        }\n      }\n\n      const itemNodes: React.ReactElement[] = [];\n      let keyIndex = 0;\n      if (this.state.includeRepeat) {\n        const checked = this.state.repeat;\n        const icon = checked ? (\n          <span className=\"icon\">\n            <Icon iconSpec={<SvgCheckmark />} />{\" \"}\n          </span>\n        ) : (\n          <span />\n        );\n        itemNodes.push(\n          <MenuItem\n            key={++keyIndex}\n            onClick={() => {\n              this._onRepeatChanged();\n              close();\n            }}\n            startIcon={icon}\n          >\n            {this._repeatLabel}\n          </MenuItem>\n        );\n        itemNodes.push(<MenuDivider key={++keyIndex} />);\n      }\n\n      contextMenuItems.forEach((item: TimelineMenuItemProps, index: number) => {\n        itemNodes.push(\n          this._createMenuItemNode(\n            item,\n            index + keyIndex + 1,\n            totalDuration,\n            close\n          )\n        );\n      });\n\n      return itemNodes;\n    };\n\n    return (\n      <DropdownMenu menuItems={createMenuItemNodes} placement=\"top-start\">\n        <span\n          data-testid=\"timeline-settings\"\n          className=\"timeline-settings icon\"\n          role=\"button\"\n          tabIndex={-1}\n          title={UiComponents.translate(\"button.label.settings\")}\n        >\n          <Icon iconSpec={<SvgMoreVertical />} />\n        </span>\n      </DropdownMenu>\n    );\n  };\n\n  public override render() {\n    const {\n      startDate,\n      endDate,\n      showDuration,\n      timeZoneOffset,\n      dateFormatOptions,\n      timeFormatOptions,\n    } = this.props;\n    const { currentDuration, totalDuration, minimized } = this.state;\n    const currentDate = this._currentDate();\n    const durationString = this._displayTime(currentDuration);\n    const totalDurationString = this._displayTime(totalDuration);\n    const hasDates = !!startDate && !!endDate;\n\n    return (\n      <div\n        data-testid=\"timeline-component\"\n        className={classnames(\n          \"timeline-component\",\n          !!minimized && \"minimized\",\n          hasDates && \"has-dates\"\n        )}\n      >\n        <div className=\"header\">\n          <PlayButton\n            className=\"play-button\"\n            isPlaying={this.state.isPlaying}\n            onPlay={this._onPlay}\n            onPause={this._onPause}\n            data-testid=\"timeline-play\"\n          />\n          <PlayerButton\n            className=\"play-backward\"\n            icon={<SvgCaretLeft />}\n            onClick={this._onBackward}\n            title={UiIModelComponents.translate(\"timeline.backward\")}\n          />\n          <PlayerButton\n            className=\"play-button-step\"\n            icon={<SvgPlayCircular />}\n            isPlaying={this.state.isPlaying}\n            onPlay={this._onPlay}\n            onPause={this._onPause}\n            title={UiIModelComponents.translate(\"timeline.step\")}\n          />\n          <PlayerButton\n            className=\"play-forward\"\n            icon={<SvgCaretRight />}\n            onClick={this._onForward}\n            title={UiIModelComponents.translate(\"timeline.backward\")}\n          />\n          <span className=\"current-date\">\n            {toDateString(currentDate, timeZoneOffset, dateFormatOptions)}\n          </span>\n        </div>\n        <div className=\"scrubber\">\n          <PlayButton\n            className=\"play-button\"\n            isPlaying={this.state.isPlaying}\n            onPlay={this._onPlay}\n            onPause={this._onPause}\n          />\n          <div className=\"start-time-container\">\n            {hasDates && (\n              <span data-testid=\"test-start-date\" className=\"start-date\">\n                {toDateString(startDate, timeZoneOffset, dateFormatOptions)}\n              </span>\n            )}\n            {hasDates && !showDuration && (\n              <span data-testid=\"test-start-time\" className=\"start-time\">\n                {toTimeString(startDate, timeZoneOffset, timeFormatOptions)}\n              </span>\n            )}\n            {showDuration && (\n              <span className=\"duration-start-time\">{durationString}</span>\n            )}\n          </div>\n          <Scrubber\n            className=\"slider\"\n            currentDuration={this.state.currentDuration}\n            totalDuration={totalDuration}\n            startDate={startDate}\n            endDate={endDate}\n            isPlaying={this.state.isPlaying}\n            inMiniMode={!!minimized}\n            showTime={!showDuration}\n            onChange={this._onTimelineChange}\n            onUpdate={this._onTimelineChange}\n            timeZoneOffset={this.props.timeZoneOffset}\n            markDate={this.props.markDate}\n          />\n          <div className=\"end-time-container\">\n            {hasDates && (\n              <span className=\"end-date\">\n                {toDateString(endDate, timeZoneOffset)}\n              </span>\n            )}\n            {hasDates && !showDuration && (\n              <span className=\"end-time\">\n                {toTimeString(endDate, timeZoneOffset, timeFormatOptions)}\n              </span>\n            )}\n            {showDuration && (\n              <InlineEdit\n                className=\"duration-end-time\"\n                defaultValue={totalDurationString}\n                onChange={this._onTotalDurationChange}\n              />\n            )}\n          </div>\n          {minimized && this._renderSettings()}\n        </div>\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"TimelineComponent.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/TimelineComponent.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 */\nimport \"./TimelineComponent.scss\";\nimport * as React from \"react\";\nimport { UiAdmin } from \"@itwin/appui-abstract\";\nimport type { DateFormatOptions } from \"@itwin/components-react\";\nimport {\n  toDateString,\n  toTimeString,\n  UiComponents,\n} from \"@itwin/components-react\";\nimport { SvgCheckmark, SvgMoreVertical } from \"@itwin/itwinui-icons-react\";\nimport {\n  DropdownMenu,\n  IconButton,\n  MenuDivider,\n  MenuItem,\n} from \"@itwin/itwinui-react\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { InlineEdit } from \"./InlineEdit\";\nimport type { PlaybackSettings, TimelinePausePlayArgs } from \"./interfaces\";\nimport { TimelinePausePlayAction } from \"./interfaces\";\nimport { PlayButton } from \"./PlayButton\";\nimport { Scrubber } from \"./Scrubber\";\n\nconst slowSpeed = 60 * 1000;\nconst mediumSpeed = 20 * 1000;\nconst fastSpeed = 10 * 1000;\n\n/** [[TimelineMenuItemOption]]: specifies how the app wants the timeline speeds to be installed on the TimelineComponent's ContextMenu\n * \"replace\" : use the app-supplied items in place of the standard items\n * \"append\" : add the app-supplied items following the standard items\n * \"prefix\" : add the app-supplied items before the standard items\n *\n * @public\n */\nexport type TimelineMenuItemOption = \"replace\" | \"append\" | \"prefix\";\n\n/** [[TimelineMenuItemProps]] specifies playback speed entries in the Timeline's ContextMenu\n * @public\n */\nexport interface TimelineMenuItemProps {\n  /** localized label for menu item */\n  label: string;\n\n  /** duration for the entire timeline to play */\n  timelineDuration: number;\n}\n\n/** TimelineDateMarkerProps: Mark a date on the timeline with an indicator\n * @public\n */\nexport interface TimelineDateMarkerProps {\n  /** Date to mark. If undefined, today's date will be used. */\n  date?: Date;\n  /** ReactNode to use as the marker on the timeline. If undefined, a short vertical bar will mark the date. */\n  dateMarker?: React.ReactNode;\n}\n\n/** [[TimelineComponentProps]] configure the timeline\n * @public\n */\nexport interface TimelineComponentProps {\n  /** Start date: beginning of the date range of a date-based timeline. */\n  startDate?: Date;\n  /** End date: end of the date range of a date-based timeline. */\n  endDate?: Date;\n  /** Total duration: range of the timeline in milliseconds.\n   * @note This can be changed by user interaction. See {@link TimelineComponentProps.appMenuItems}.\n   */\n  totalDuration: number;\n  /** Initial value for the current duration (the location of the thumb) in milliseconds */\n  initialDuration?: number;\n  /** Show in minimized mode (For future use. This prop will always be treated as true.)\n   * @deprecated in 4.10.x. Has no effect.\n   */\n  minimized?: boolean;\n  /** When playing, repeat indefinitely. Defaults to `false`.\n   * @note This can be changed by user interaction. See {@link TimelineComponentProps.includeRepeat}.\n   */\n  repeat?: boolean;\n  /** Show duration instead of time */\n  showDuration?: boolean;\n  /** Callback with current duration value (as a fraction) */\n  onChange?: (duration: number) => void;\n  /** Callback triggered when play/pause button is pressed */\n  onPlayPause?: (playing: boolean) => void;\n  /** Callback triggered when backward/forward buttons are pressed.\n   * @deprecated in 4.10.x. Has no effect.\n   */\n  onJump?: (forward: boolean) => void;\n  /** Callback triggered when a setting is changed */\n  onSettingsChange?: (arg: PlaybackSettings) => void;\n  /** Always display in miniMode with no expand menu (For future use. This prop will always be treated as true)\n   * @deprecated in 4.10.x. Has no effect.\n   */\n  alwaysMinimized?: boolean;\n  /** ComponentId -- must be set to use TimelineComponentEvents */\n  componentId?: string;\n  /** Include the repeat option on the Timeline Context Menu. Defaults to `true`. */\n  includeRepeat?: boolean;\n  /** App-supplied speed entries in the Timeline Context Menu. Defaults to `[Slow, Medium, Fast]` items. */\n  appMenuItems?: TimelineMenuItemProps[];\n  /** How to include the supplied app menu items in the Timeline Context Menu (prefix, append or replace). Defaults to `replace`. */\n  appMenuItemOption?: TimelineMenuItemOption;\n  /** Display date and time offset by the number of minutes specified. When undefined - local timezone will be used */\n  timeZoneOffset?: number;\n  /** Display a marker on the timeline rail to indicate current date - will only work if starDate and endDate are defined */\n  markDate?: TimelineDateMarkerProps;\n  /** Options used to format date string. If not defined it will user browser default locale settings. */\n  dateFormatOptions?: DateFormatOptions;\n  /** Options used to format time string. If not defined it will user browser default locale settings. */\n  timeFormatOptions?: DateFormatOptions;\n}\n\n/** [[TimelineComponent]] is used to playback timeline data\n * @public\n */\nexport function TimelineComponent(props: TimelineComponentProps) {\n  const {\n    appMenuItemOption = \"replace\",\n    startDate,\n    endDate,\n    showDuration,\n    timeZoneOffset,\n    dateFormatOptions,\n    timeFormatOptions,\n    includeRepeat = true,\n    onSettingsChange,\n    onChange,\n    onPlayPause,\n  } = props;\n  const [isPlaying, setIsPlaying] = React.useState(false);\n  const [currentDuration, setCurrentDuration] = React.useState(\n    props.initialDuration ?? 0\n  );\n  const [totalDuration, setTotalDuration] = React.useState(props.totalDuration);\n  const [repeat, setRepeat] = React.useState(props.repeat ?? false);\n\n  const playOrReplay = React.useCallback(() => {\n    if (isPlaying) return;\n\n    if (currentDuration >= totalDuration) {\n      setCurrentDuration(0);\n    }\n\n    setIsPlaying(true);\n    onPlayPause?.(true);\n  }, [isPlaying, onPlayPause, currentDuration, totalDuration]);\n  const pause = React.useCallback(() => {\n    if (!isPlaying) return;\n    setIsPlaying(false);\n    onPlayPause?.(false);\n  }, [isPlaying, onPlayPause]);\n  const updateTotalDuration = (newTotalDuration: number) => {\n    if (newTotalDuration === totalDuration) return;\n\n    const fraction = currentDuration / totalDuration;\n    const newCurrentDuration = fraction * newTotalDuration;\n\n    setTotalDuration(newTotalDuration);\n    setCurrentDuration(newCurrentDuration);\n    onSettingsChange?.({ duration: newTotalDuration });\n  };\n  const updateDuration = (\n    newDuration: number,\n    currentTotalDuration = totalDuration\n  ) => {\n    newDuration = Math.max(newDuration, 0);\n    newDuration = Math.min(newDuration, currentTotalDuration);\n\n    if (newDuration === currentDuration) return;\n    setCurrentDuration(newDuration);\n\n    const fraction = newDuration / currentTotalDuration;\n    onChange?.(fraction);\n  };\n  const updateRepeat = (newRepeat: boolean) => {\n    if (newRepeat === repeat) return;\n\n    setRepeat(newRepeat);\n    onSettingsChange?.({ loop: newRepeat });\n  };\n\n  const [prevTotalDuration, setPrevTotalDuration] = React.useState(\n    props.totalDuration\n  );\n  if (prevTotalDuration !== props.totalDuration) {\n    setPrevTotalDuration(props.totalDuration);\n    updateTotalDuration(props.totalDuration);\n  }\n\n  const [prevInitialDuration, setPrevInitialDuration] = React.useState(\n    props.initialDuration\n  );\n  if (prevInitialDuration !== props.initialDuration) {\n    setPrevInitialDuration(props.initialDuration);\n    updateDuration(props.initialDuration ?? 0, props.totalDuration);\n  }\n\n  const [prevRepeat, setPrevRepeat] = React.useState(props.repeat);\n  if (prevRepeat !== props.repeat) {\n    setPrevRepeat(props.repeat);\n    updateRepeat(props.repeat ?? repeat);\n  }\n\n  React.useEffect(() => {\n    if (!props.componentId) return;\n    return UiAdmin.onGenericUiEvent.addListener((args) => {\n      const timelineArgs = args as TimelinePausePlayArgs;\n      if (\n        !timelineArgs ||\n        props.componentId !== timelineArgs.uiComponentId ||\n        timelineArgs.timelineAction === undefined\n      )\n        return;\n\n      switch (timelineArgs.timelineAction) {\n        case TimelinePausePlayAction.Play:\n          playOrReplay();\n          break;\n        case TimelinePausePlayAction.Pause:\n          pause();\n          break;\n        case TimelinePausePlayAction.Toggle:\n          if (isPlaying) {\n            pause();\n          } else {\n            playOrReplay();\n          }\n          break;\n      }\n    });\n  }, [isPlaying, pause, playOrReplay, props.componentId]);\n  useAnimation(({ delta }) => {\n    const duration = currentDuration + delta;\n    updateDuration(duration);\n\n    if (duration >= totalDuration) {\n      if (repeat) {\n        setCurrentDuration(0);\n        return;\n      }\n\n      pause();\n    }\n  }, isPlaying);\n\n  const onTimelineChange = (values: ReadonlyArray<number>) => {\n    const newDuration = values[0];\n    updateDuration(newDuration);\n  };\n\n  const currentDurationStr = toDisplayTime(currentDuration);\n  const totalDurationStr = toDisplayTime(totalDuration);\n  const hasDates = !!startDate && !!endDate;\n  return (\n    <div data-testid=\"timeline-component\" className=\"timeline-component\">\n      <PlayButton isPlaying={isPlaying} onPlay={playOrReplay} onPause={pause} />\n      <div className=\"time-container\">\n        {hasDates && (\n          <span data-testid=\"test-start-date\" className=\"timeline-date\">\n            {toDateString(startDate, timeZoneOffset, dateFormatOptions)}\n          </span>\n        )}\n        {hasDates && !showDuration && (\n          <span data-testid=\"test-start-time\" className=\"timeline-time\">\n            {toTimeString(startDate, timeZoneOffset, timeFormatOptions)}\n          </span>\n        )}\n        {showDuration && (\n          <span className=\"timeline-duration-time\">{currentDurationStr}</span>\n        )}\n      </div>\n      <Scrubber\n        className=\"slider\"\n        currentDuration={currentDuration}\n        totalDuration={totalDuration}\n        startDate={startDate}\n        endDate={endDate}\n        isPlaying={isPlaying}\n        showTime={!showDuration}\n        onChange={onTimelineChange}\n        onUpdate={onTimelineChange}\n        timeZoneOffset={props.timeZoneOffset}\n        markDate={props.markDate}\n      />\n      <div className=\"time-container\">\n        {hasDates && (\n          <span data-testid=\"test-end-date\" className=\"timeline-date\">\n            {toDateString(endDate, timeZoneOffset)}\n          </span>\n        )}\n        {hasDates && !showDuration && (\n          <span className=\"timeline-time\">\n            {toTimeString(endDate, timeZoneOffset, timeFormatOptions)}\n          </span>\n        )}\n        {showDuration && (\n          <InlineEdit\n            className=\"timeline-duration-time\"\n            defaultValue={totalDurationStr}\n            onChange={(value) => {\n              const newTotalDuration = timeToMs(value);\n              updateTotalDuration(newTotalDuration);\n            }}\n          />\n        )}\n      </div>\n      <SettingsMenu\n        appMenuItems={props.appMenuItems}\n        appMenuItemOption={appMenuItemOption}\n        includeRepeat={includeRepeat}\n        repeat={repeat}\n        totalDuration={totalDuration}\n        onRepeatClick={() => {\n          updateRepeat(!repeat);\n        }}\n        onTotalDurationChange={(newTotalDuration) => {\n          updateTotalDuration(newTotalDuration);\n        }}\n      />\n    </div>\n  );\n}\n\ntype SettingsMenuProps = Pick<\n  TimelineComponentProps,\n  \"appMenuItems\" | \"totalDuration\"\n> &\n  Pick<\n    Required<TimelineComponentProps>,\n    \"appMenuItemOption\" | \"includeRepeat\" | \"repeat\"\n  > & {\n    onRepeatClick: () => void;\n    onTotalDurationChange: (totalDuration: number) => void;\n  };\n\nfunction SettingsMenu({\n  appMenuItems,\n  appMenuItemOption,\n  includeRepeat,\n  repeat,\n  totalDuration,\n  onRepeatClick,\n  onTotalDurationChange,\n}: SettingsMenuProps) {\n  const settingsLabel = React.useMemo(\n    () => UiComponents.translate(\"button.label.settings\"),\n    []\n  );\n  const repeatLabel = React.useMemo(\n    () => UiIModelComponents.translate(\"timeline.repeat\"),\n    []\n  );\n  const standardItems: TimelineMenuItemProps[] = React.useMemo(\n    () => [\n      {\n        label: UiIModelComponents.translate(\"timeline.slow\"),\n        timelineDuration: slowSpeed,\n      },\n      {\n        label: UiIModelComponents.translate(\"timeline.medium\"),\n        timelineDuration: mediumSpeed,\n      },\n      {\n        label: UiIModelComponents.translate(\"timeline.fast\"),\n        timelineDuration: fastSpeed,\n      },\n    ],\n    []\n  );\n\n  const menuItems = React.useMemo(() => {\n    if (!appMenuItems) {\n      return standardItems;\n    }\n\n    if (appMenuItemOption === \"append\") {\n      return [...standardItems, ...appMenuItems];\n    }\n    if (appMenuItemOption === \"prefix\") {\n      return [...appMenuItems, ...standardItems];\n    }\n    // Replace\n    return appMenuItems;\n  }, [appMenuItemOption, appMenuItems, standardItems]);\n\n  return (\n    <DropdownMenu\n      menuItems={(close) => {\n        return [\n          ...(includeRepeat\n            ? [\n                <MenuItem\n                  key=\"repeat\"\n                  onClick={() => {\n                    onRepeatClick();\n                    close();\n                  }}\n                  startIcon={repeat ? <SvgCheckmark /> : <></>}\n                >\n                  {repeatLabel}\n                </MenuItem>,\n                <MenuDivider key=\"divider\" />,\n              ]\n            : []),\n          ...menuItems.map((item, index) => {\n            const checked = totalDuration === item.timelineDuration;\n            return (\n              <MenuItem\n                key={index}\n                startIcon={checked ? <SvgCheckmark /> : <></>}\n                onClick={() => {\n                  onTotalDurationChange(item.timelineDuration);\n                  close();\n                }}\n              >\n                {item.label}\n              </MenuItem>\n            );\n          }),\n        ];\n      }}\n      placement=\"top-start\"\n    >\n      <IconButton\n        data-testid=\"timeline-settings\"\n        title={settingsLabel}\n        styleType=\"borderless\"\n      >\n        <SvgMoreVertical />\n      </IconButton>\n    </DropdownMenu>\n  );\n}\n\nfunction useAnimation(\n  onAnimate: (args: { delta: number }) => void,\n  playing = true\n) {\n  const onAnimateRef = React.useRef(onAnimate);\n  onAnimateRef.current = onAnimate;\n\n  const lastTimeRef = React.useRef<number | undefined>();\n\n  React.useEffect(() => {\n    if (!playing) return;\n\n    let handle = 0;\n    let didCancel = false;\n\n    const animate = (time: number) => {\n      if (lastTimeRef.current === undefined) {\n        lastTimeRef.current = time;\n      }\n\n      const delta = time - lastTimeRef.current;\n      lastTimeRef.current = time;\n\n      onAnimateRef.current({\n        delta,\n      });\n\n      if (didCancel) return;\n\n      handle = window.requestAnimationFrame(animate);\n    };\n\n    handle = window.requestAnimationFrame(animate);\n    return () => {\n      didCancel = true;\n      lastTimeRef.current = undefined;\n      window.cancelAnimationFrame(handle);\n    };\n  }, [playing]);\n}\n\nfunction timeToMs(time: string) {\n  if (time.indexOf(\":\") !== -1) {\n    return (\n      (Number(time.split(\":\")[0]) * 60 + Number(time.split(\":\")[1])) * 1000\n    );\n  } else {\n    return Number(time) * 1000;\n  }\n}\n\nfunction toDisplayTime(ms: number) {\n  const addZero = (i: number) => {\n    return i < 10 ? `0${i}` : i;\n  };\n\n  const date = new Date(ms);\n  // const hours = date.getUTCHours();\n  const minutes = date.getUTCMinutes();\n  const seconds = date.getUTCSeconds();\n  return `${addZero(minutes)}:${addZero(seconds)}`;\n}\n"]}

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

@@ -3,159 +3,46 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 .timeline-component {
-  box-sizing: border-box;
   width: 100%;
+  min-width: 275px;
+
   display: flex;
-  flex-direction: column;
-  position: relative;
+  flex-direction: row;
+  align-items: center;
   padding: 8px 16px;
-  min-width: 275px;
+  box-sizing: border-box;
+  gap: 8px;
 
-  > .header {
+  .time-container {
     display: flex;
+    flex-direction: column;
     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-time {
+    font-size: 12px;
+    color: var(--iui-color-text-muted);
+    text-align: center;
+    min-height: inherit;
   }
 
-  > .timeline-timeline {
-    margin: 8px 0;
+  .timeline-duration-time {
+    font-size: 14px;
+    width: 40px;
+    color: var(--iui-color-text);
+    text-align: center;
+    min-height: inherit;
   }
 
-  > .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-date {
+    font-size: 12px;
+    color: var(--iui-color-text-muted);
+    padding-bottom: 4px;
   }
-}
-
-.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%);
+  .slider {
+    position: relative;
+    flex: 1;
+    margin: 0 20px;
   }
 }

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

@@ -27,7 +27,6 @@ export * from "./imodel-components-react/quantityformat/QuantityFormatPanel";
 export * from "./imodel-components-react/timeline/interfaces";
 export * from "./imodel-components-react/timeline/BaseTimelineDataProvider";
 export * from "./imodel-components-react/timeline/InlineEdit";
-export * from "./imodel-components-react/timeline/PlayerButton";
 export * from "./imodel-components-react/timeline/Scrubber";
 export * from "./imodel-components-react/timeline/TimelineComponent";
 export * from "./imodel-components-react/timeline/SolarTimeline";

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

@@ -1 +1 @@
-{"version":3,"file":"imodel-components-react.d.ts","sourceRoot":"","sources":["../../src/imodel-components-react.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAElF,cAAc,6CAA6C,CAAC;AAC5D,cAAc,mDAAmD,CAAC;AAClE,cAAc,mDAAmD,CAAC;AAClE,cAAc,kDAAkD,CAAC;AACjE,cAAc,oDAAoD,CAAC;AACnE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,kDAAkD,CAAC;AACjE,cAAc,wCAAwC,CAAC;AAEvD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,gDAAgD,CAAC;AAE/D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sDAAsD,CAAC;AAErE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,yDAAyD,CAAC;AAExE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,4DAA4D,CAAC;AAC3E,cAAc,+DAA+D,CAAC;AAE9E,cAAc,sDAAsD,CAAC;AACrE,cAAc,0DAA0D,CAAC;AACzE,cAAc,uDAAuD,CAAC;AACtE,cAAc,qDAAqD,CAAC;AACpE,cAAc,0DAA0D,CAAC;AACzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,8DAA8D,CAAC;AAE7E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,6DAA6D,CAAC;AAC5E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,iDAAiD,CAAC;AAChE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,sDAAsD,CAAC;AACrE,cAAc,kDAAkD,CAAC;AACjE,cAAc,0DAA0D,CAAC;AAEzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAE3E;;;;GAIG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG"}
+{"version":3,"file":"imodel-components-react.d.ts","sourceRoot":"","sources":["../../src/imodel-components-react.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAElF,cAAc,6CAA6C,CAAC;AAC5D,cAAc,mDAAmD,CAAC;AAClE,cAAc,mDAAmD,CAAC;AAClE,cAAc,kDAAkD,CAAC;AACjE,cAAc,oDAAoD,CAAC;AACnE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,kDAAkD,CAAC;AACjE,cAAc,wCAAwC,CAAC;AAEvD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,gDAAgD,CAAC;AAE/D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sDAAsD,CAAC;AAErE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,yDAAyD,CAAC;AAExE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,4DAA4D,CAAC;AAC3E,cAAc,+DAA+D,CAAC;AAE9E,cAAc,sDAAsD,CAAC;AACrE,cAAc,0DAA0D,CAAC;AACzE,cAAc,uDAAuD,CAAC;AACtE,cAAc,qDAAqD,CAAC;AACpE,cAAc,0DAA0D,CAAC;AACzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,8DAA8D,CAAC;AAE7E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,6DAA6D,CAAC;AAC5E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,6CAA6C,CAAC;AAC5D,cAAc,sDAAsD,CAAC;AACrE,cAAc,kDAAkD,CAAC;AACjE,cAAc,0DAA0D,CAAC;AAEzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAE3E;;;;GAIG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG"}

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

@@ -32,7 +32,6 @@ export * from "./imodel-components-react/quantityformat/QuantityFormatPanel";
 export * from "./imodel-components-react/timeline/interfaces";
 export * from "./imodel-components-react/timeline/BaseTimelineDataProvider";
 export * from "./imodel-components-react/timeline/InlineEdit";
-export * from "./imodel-components-react/timeline/PlayerButton";
 export * from "./imodel-components-react/timeline/Scrubber";
 export * from "./imodel-components-react/timeline/TimelineComponent";
 export * from "./imodel-components-react/timeline/SolarTimeline";

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

@@ -1 +1 @@
-{"version":3,"file":"imodel-components-react.js","sourceRoot":"","sources":["../../src/imodel-components-react.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAEhG,qEAAqE;AAErE,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAElF,cAAc,6CAA6C,CAAC;AAC5D,cAAc,mDAAmD,CAAC;AAClE,cAAc,mDAAmD,CAAC;AAClE,cAAc,kDAAkD,CAAC;AACjE,cAAc,oDAAoD,CAAC;AACnE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,kDAAkD,CAAC;AACjE,cAAc,wCAAwC,CAAC;AAEvD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,gDAAgD,CAAC;AAE/D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sDAAsD,CAAC;AAErE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,yDAAyD,CAAC;AAExE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,4DAA4D,CAAC;AAC3E,cAAc,+DAA+D,CAAC;AAE9E,cAAc,sDAAsD,CAAC;AACrE,cAAc,0DAA0D,CAAC;AACzE,cAAc,uDAAuD,CAAC;AACtE,cAAc,qDAAqD,CAAC;AACpE,cAAc,0DAA0D,CAAC;AACzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,8DAA8D,CAAC;AAE7E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,6DAA6D,CAAC;AAC5E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,iDAAiD,CAAC;AAChE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,sDAAsD,CAAC;AACrE,cAAc,kDAAkD,CAAC;AACjE,cAAc,0DAA0D,CAAC;AAEzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAE3E;;;;GAIG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG","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\n// cSpell:ignore iconpicker lineweight hocs datepicker quantityformat\n\nexport { UiIModelComponents } from \"./imodel-components-react/UiIModelComponents\";\n\nexport * from \"./imodel-components-react/color/AlphaSlider\";\nexport * from \"./imodel-components-react/color/ColorPickerButton\";\nexport * from \"./imodel-components-react/color/ColorPickerDialog\";\nexport * from \"./imodel-components-react/color/ColorPickerPopup\";\nexport * from \"./imodel-components-react/color/getCSSColorFromDef\";\nexport * from \"./imodel-components-react/color/HueSlider\";\nexport * from \"./imodel-components-react/color/SaturationPicker\";\nexport * from \"./imodel-components-react/color/Swatch\";\n\nexport * from \"./imodel-components-react/editors/ColorEditor\";\nexport * from \"./imodel-components-react/editors/WeightEditor\";\n\nexport * from \"./imodel-components-react/inputs/QuantityInput\";\nexport * from \"./imodel-components-react/inputs/QuantityNumberInput\";\n\nexport * from \"./imodel-components-react/lineweight/Swatch\";\nexport * from \"./imodel-components-react/lineweight/WeightPickerButton\";\n\nexport * from \"./imodel-components-react/navigationaids/Cube\";\nexport * from \"./imodel-components-react/navigationaids/CubeNavigationAid\";\nexport * from \"./imodel-components-react/navigationaids/DrawingNavigationAid\";\n\nexport * from \"./imodel-components-react/quantityformat/FormatPanel\";\nexport * from \"./imodel-components-react/quantityformat/FormatPrecision\";\nexport * from \"./imodel-components-react/quantityformat/FormatSample\";\nexport * from \"./imodel-components-react/quantityformat/FormatType\";\nexport * from \"./imodel-components-react/quantityformat/FormatUnitLabel\";\nexport * from \"./imodel-components-react/quantityformat/FormatUnits\";\nexport * from \"./imodel-components-react/quantityformat/MiscFormatOptions\";\nexport * from \"./imodel-components-react/quantityformat/QuantityFormatPanel\";\n\nexport * from \"./imodel-components-react/timeline/interfaces\";\nexport * from \"./imodel-components-react/timeline/BaseTimelineDataProvider\";\nexport * from \"./imodel-components-react/timeline/InlineEdit\";\nexport * from \"./imodel-components-react/timeline/PlayerButton\";\nexport * from \"./imodel-components-react/timeline/Scrubber\";\nexport * from \"./imodel-components-react/timeline/TimelineComponent\";\nexport * from \"./imodel-components-react/timeline/SolarTimeline\";\nexport * from \"./imodel-components-react/timeline/BaseSolarDataProvider\";\n\nexport * from \"./imodel-components-react/viewport/ViewportComponent\";\nexport * from \"./imodel-components-react/viewport/ViewportComponentEvents\";\n\n/** @docs-package-description\n * The imodel-components-react package contains React components that depend on the core-frontend, core-common or core-quantity packages.\n * The components pertain to Color, Cube, LineWeight, Navigation Aids, Quantity Inputs, Timeline and Viewport.\n * For more information, see [learning about imodel-components-react]($docs/learning/ui/imodel-components/index.md).\n */\n/**\n * @docs-group-description Color\n * Classes and components for working with and picking a Color.\n */\n/**\n * @docs-group-description Common\n * Common classes used across various UI components.\n */\n/**\n * @docs-group-description Cube\n * Component for 3D Cube.\n */\n/**\n * @docs-group-description Inputs\n * Input Components that format and parse input for IModelApps.\n */\n/**\n * @docs-group-description LineWeight\n * Classes and components for working with and picking a Line Weight.\n */\n/**\n * @docs-group-description NavigationAids\n * Classes and components for working with Navigation Aids.\n */\n/**\n * @docs-group-description PropertyEditors\n * Classes and components for working with Property Editors.\n */\n/**\n * @docs-group-description QuantityFormat\n * Classes and components for working with a Quantity Formats.\n */\n/**\n * @docs-group-description Timeline\n * Classes and components that provide a timeline\n */\n/**\n * @docs-group-description Viewport\n * Classes and components for working with a Viewport.\n */\n"]}
+{"version":3,"file":"imodel-components-react.js","sourceRoot":"","sources":["../../src/imodel-components-react.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAEhG,qEAAqE;AAErE,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAElF,cAAc,6CAA6C,CAAC;AAC5D,cAAc,mDAAmD,CAAC;AAClE,cAAc,mDAAmD,CAAC;AAClE,cAAc,kDAAkD,CAAC;AACjE,cAAc,oDAAoD,CAAC;AACnE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,kDAAkD,CAAC;AACjE,cAAc,wCAAwC,CAAC;AAEvD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,gDAAgD,CAAC;AAE/D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sDAAsD,CAAC;AAErE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,yDAAyD,CAAC;AAExE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,4DAA4D,CAAC;AAC3E,cAAc,+DAA+D,CAAC;AAE9E,cAAc,sDAAsD,CAAC;AACrE,cAAc,0DAA0D,CAAC;AACzE,cAAc,uDAAuD,CAAC;AACtE,cAAc,qDAAqD,CAAC;AACpE,cAAc,0DAA0D,CAAC;AACzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,8DAA8D,CAAC;AAE7E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,6DAA6D,CAAC;AAC5E,cAAc,+CAA+C,CAAC;AAC9D,cAAc,6CAA6C,CAAC;AAC5D,cAAc,sDAAsD,CAAC;AACrE,cAAc,kDAAkD,CAAC;AACjE,cAAc,0DAA0D,CAAC;AAEzE,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAE3E;;;;GAIG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG;AACH;;;GAGG","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\n// cSpell:ignore iconpicker lineweight hocs datepicker quantityformat\n\nexport { UiIModelComponents } from \"./imodel-components-react/UiIModelComponents\";\n\nexport * from \"./imodel-components-react/color/AlphaSlider\";\nexport * from \"./imodel-components-react/color/ColorPickerButton\";\nexport * from \"./imodel-components-react/color/ColorPickerDialog\";\nexport * from \"./imodel-components-react/color/ColorPickerPopup\";\nexport * from \"./imodel-components-react/color/getCSSColorFromDef\";\nexport * from \"./imodel-components-react/color/HueSlider\";\nexport * from \"./imodel-components-react/color/SaturationPicker\";\nexport * from \"./imodel-components-react/color/Swatch\";\n\nexport * from \"./imodel-components-react/editors/ColorEditor\";\nexport * from \"./imodel-components-react/editors/WeightEditor\";\n\nexport * from \"./imodel-components-react/inputs/QuantityInput\";\nexport * from \"./imodel-components-react/inputs/QuantityNumberInput\";\n\nexport * from \"./imodel-components-react/lineweight/Swatch\";\nexport * from \"./imodel-components-react/lineweight/WeightPickerButton\";\n\nexport * from \"./imodel-components-react/navigationaids/Cube\";\nexport * from \"./imodel-components-react/navigationaids/CubeNavigationAid\";\nexport * from \"./imodel-components-react/navigationaids/DrawingNavigationAid\";\n\nexport * from \"./imodel-components-react/quantityformat/FormatPanel\";\nexport * from \"./imodel-components-react/quantityformat/FormatPrecision\";\nexport * from \"./imodel-components-react/quantityformat/FormatSample\";\nexport * from \"./imodel-components-react/quantityformat/FormatType\";\nexport * from \"./imodel-components-react/quantityformat/FormatUnitLabel\";\nexport * from \"./imodel-components-react/quantityformat/FormatUnits\";\nexport * from \"./imodel-components-react/quantityformat/MiscFormatOptions\";\nexport * from \"./imodel-components-react/quantityformat/QuantityFormatPanel\";\n\nexport * from \"./imodel-components-react/timeline/interfaces\";\nexport * from \"./imodel-components-react/timeline/BaseTimelineDataProvider\";\nexport * from \"./imodel-components-react/timeline/InlineEdit\";\nexport * from \"./imodel-components-react/timeline/Scrubber\";\nexport * from \"./imodel-components-react/timeline/TimelineComponent\";\nexport * from \"./imodel-components-react/timeline/SolarTimeline\";\nexport * from \"./imodel-components-react/timeline/BaseSolarDataProvider\";\n\nexport * from \"./imodel-components-react/viewport/ViewportComponent\";\nexport * from \"./imodel-components-react/viewport/ViewportComponentEvents\";\n\n/** @docs-package-description\n * The imodel-components-react package contains React components that depend on the core-frontend, core-common or core-quantity packages.\n * The components pertain to Color, Cube, LineWeight, Navigation Aids, Quantity Inputs, Timeline and Viewport.\n * For more information, see [learning about imodel-components-react]($docs/learning/ui/imodel-components/index.md).\n */\n/**\n * @docs-group-description Color\n * Classes and components for working with and picking a Color.\n */\n/**\n * @docs-group-description Common\n * Common classes used across various UI components.\n */\n/**\n * @docs-group-description Cube\n * Component for 3D Cube.\n */\n/**\n * @docs-group-description Inputs\n * Input Components that format and parse input for IModelApps.\n */\n/**\n * @docs-group-description LineWeight\n * Classes and components for working with and picking a Line Weight.\n */\n/**\n * @docs-group-description NavigationAids\n * Classes and components for working with Navigation Aids.\n */\n/**\n * @docs-group-description PropertyEditors\n * Classes and components for working with Property Editors.\n */\n/**\n * @docs-group-description QuantityFormat\n * Classes and components for working with a Quantity Formats.\n */\n/**\n * @docs-group-description Timeline\n * Classes and components that provide a timeline\n */\n/**\n * @docs-group-description Viewport\n * Classes and components for working with a Viewport.\n */\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/imodel-components-react",
-  "version": "4.10.0-dev.1",
+  "version": "4.10.0",
   "description": "iTwin.js UI IModel Components",
   "main": "lib/cjs/imodel-components-react.js",
   "module": "lib/esm/imodel-components-react.js",
@@ -23,13 +23,13 @@
   },
   "peerDependencies": {
     "@itwin/appui-abstract": "^3.7.0 || ^4.0.0",
-    "@itwin/components-react": "^4.10.0-dev.1",
+    "@itwin/components-react": "^4.10.0",
     "@itwin/core-bentley": "^3.7.0 || ^4.0.0",
     "@itwin/core-common": "^3.7.0 || ^4.0.0",
     "@itwin/core-frontend": "^3.7.0 || ^4.0.0",
     "@itwin/core-geometry": "^3.7.0 || ^4.0.0",
     "@itwin/core-quantity": "^3.7.0 || ^4.0.0",
-    "@itwin/core-react": "^4.10.0-dev.1",
+    "@itwin/core-react": "^4.10.0",
     "react": "^17.0.0 || ^18.0.0",
     "react-dom": "^17.0.0 || ^18.0.0"
   },
@@ -38,16 +38,16 @@
     "NOTE: All tools used by scripts in this package must be listed as devDependencies"
   ],
   "devDependencies": {
-    "@itwin/appui-abstract": "^3.7.0",
-    "@itwin/build-tools": "^3.7.0",
-    "@itwin/core-bentley": "^3.7.0",
-    "@itwin/core-common": "^3.7.0",
-    "@itwin/core-frontend": "^3.7.0",
-    "@itwin/core-geometry": "^3.7.0",
-    "@itwin/core-orbitgt": "^3.7.0",
-    "@itwin/core-quantity": "^3.7.0",
-    "@itwin/eslint-plugin": "^4.0.0-dev.45",
-    "@itwin/webgl-compatibility": "^3.7.0",
+    "@itwin/appui-abstract": "^3.7.0 || ^4.0.0",
+    "@itwin/build-tools": "^3.7.0 || ^4.0.0",
+    "@itwin/core-bentley": "^3.7.0 || ^4.0.0",
+    "@itwin/core-common": "^3.7.0 || ^4.0.0",
+    "@itwin/core-frontend": "^3.7.0 || ^4.0.0",
+    "@itwin/core-geometry": "^3.7.0 || ^4.0.0",
+    "@itwin/core-orbitgt": "^3.7.0 || ^4.0.0",
+    "@itwin/core-quantity": "^3.7.0 || ^4.0.0",
+    "@itwin/eslint-plugin": "^4.0.0-dev.52",
+    "@itwin/webgl-compatibility": "^3.7.0 || ^4.0.0",
     "@testing-library/dom": "^8.11.2",
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^7.0.2",
@@ -85,8 +85,8 @@
     "typemoq": "^2.1.0",
     "typescript": "~5.0.2",
     "upath": "^2.0.1",
-    "@itwin/components-react": "4.10.0-dev.1",
-    "@itwin/core-react": "4.10.0-dev.1"
+    "@itwin/components-react": "4.10.0",
+    "@itwin/core-react": "4.10.0"
   },
   "//dependencies": [
     "NOTE: these dependencies should be only for things that DO NOT APPEAR IN THE API",
@@ -110,7 +110,7 @@
     ],
     "check-coverage": true,
     "statements": 99,
-    "branches": 99,
+    "branches": 98,
     "functions": 100,
     "lines": 99
   },

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

@@ -1,34 +0,0 @@
-import "./PlayerButton.scss";
-import * as React from "react";
-import type { CommonProps } from "@itwin/core-react";
-/** Player button used by buttons on timeline control
- * @internal
- */
-export declare class PlayerButton extends React.PureComponent<any> {
-    private _onClick;
-    render(): React.JSX.Element;
-}
-/** Properties for Play/Pause button used on timeline control
- * @internal
- */
-export interface PlayerButtonProps extends CommonProps {
-    isPlaying: boolean;
-    onPlay?: () => void;
-    onPause?: () => void;
-    tooltip?: string;
-}
-interface PlayButtonState {
-    isPlaying: boolean;
-}
-/** Play/Pause button used on timeline control
- * @internal
- */
-export declare class PlayButton extends React.Component<PlayerButtonProps, PlayButtonState> {
-    constructor(props: PlayerButtonProps, context?: any);
-    /** @internal */
-    componentDidUpdate(): void;
-    private _onClick;
-    render(): React.JSX.Element;
-}
-export {};
-//# sourceMappingURL=PlayerButton.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"PlayerButton.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/PlayerButton.tsx"],"names":[],"mappings":"AAIA,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAKrD;;GAEG;AACH,qBAAa,YAAa,SAAQ,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC;IACxD,OAAO,CAAC,QAAQ,CAGd;IAEc,MAAM;CAevB;AAED;;GAEG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,eAAe;IACvB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,SAAS,CAC7C,iBAAiB,EACjB,eAAe,CAChB;gBACa,KAAK,EAAE,iBAAiB,EAAE,OAAO,CAAC,EAAE,GAAG;IAMnD,gBAAgB;IACA,kBAAkB;IAMlC,OAAO,CAAC,QAAQ,CAYd;IAEc,MAAM;CA6BvB"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"PlayerButton.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/PlayerButton.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 \"./PlayerButton.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { SvgPause, SvgPlay } from \"@itwin/itwinui-icons-react\";\n\n/** Player button used by buttons on timeline control\n * @internal\n */\nexport class PlayerButton extends React.PureComponent<any> {\n  private _onClick = () => {\n    // istanbul ignore else\n    if (this.props.onClick) this.props.onClick();\n  };\n\n  public override render() {\n    const { icon, title } = this.props;\n    return (\n      <button\n        data-testid={this.props.className}\n        className={classnames(\"player-button\", this.props.className)}\n        onClick={this._onClick}\n        title={title}\n      >\n        <span className=\"icon\">\n          <Icon iconSpec={icon} />\n        </span>\n      </button>\n    );\n  }\n}\n\n/** Properties for Play/Pause button used on timeline control\n * @internal\n */\nexport interface PlayerButtonProps extends CommonProps {\n  isPlaying: boolean;\n  onPlay?: () => void;\n  onPause?: () => void;\n  tooltip?: string;\n}\n\ninterface PlayButtonState {\n  isPlaying: boolean;\n}\n\n/** Play/Pause button used on timeline control\n * @internal\n */\nexport class PlayButton extends React.Component<\n  PlayerButtonProps,\n  PlayButtonState\n> {\n  constructor(props: PlayerButtonProps, context?: any) {\n    super(props, context);\n\n    this.state = { isPlaying: this.props.isPlaying };\n  }\n\n  /** @internal */\n  public override componentDidUpdate() {\n    if (this.props.isPlaying !== this.state.isPlaying) {\n      this.setState((_, props) => ({ isPlaying: props.isPlaying }));\n    }\n  }\n\n  private _onClick = () => {\n    const _isPlaying = !this.state.isPlaying;\n\n    this.setState({ isPlaying: _isPlaying });\n\n    if (_isPlaying) {\n      // istanbul ignore else\n      if (this.props.onPlay) this.props.onPlay();\n    } else {\n      // istanbul ignore else\n      if (this.props.onPause) this.props.onPause();\n    }\n  };\n\n  public override render() {\n    const { tooltip } = this.props;\n    const iconSpec = this.state.isPlaying ? <SvgPause /> : <SvgPlay />;\n    let title = tooltip;\n\n    if (!title)\n      title = UiIModelComponents.translate(\n        this.state.isPlaying ? \"timeline.pause\" : \"timeline.play\"\n      );\n\n    return (\n      <button\n        data-testid={this.props.className}\n        title={title}\n        className={classnames(\"player-button\", this.props.className)}\n        onClick={this._onClick}\n      >\n        <span\n          className=\"icon\"\n          data-testid={this.state.isPlaying ? \"pause\" : \"play\"}\n        >\n          <Icon\n            iconSpec={iconSpec}\n            data-testid={this.state.isPlaying ? \"pause\" : \"play\"}\n          />\n        </span>\n      </button>\n    );\n  }\n}\n"]}

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

@@ -1,34 +0,0 @@
-import "./PlayerButton.scss";
-import * as React from "react";
-import type { CommonProps } from "@itwin/core-react";
-/** Player button used by buttons on timeline control
- * @internal
- */
-export declare class PlayerButton extends React.PureComponent<any> {
-    private _onClick;
-    render(): React.JSX.Element;
-}
-/** Properties for Play/Pause button used on timeline control
- * @internal
- */
-export interface PlayerButtonProps extends CommonProps {
-    isPlaying: boolean;
-    onPlay?: () => void;
-    onPause?: () => void;
-    tooltip?: string;
-}
-interface PlayButtonState {
-    isPlaying: boolean;
-}
-/** Play/Pause button used on timeline control
- * @internal
- */
-export declare class PlayButton extends React.Component<PlayerButtonProps, PlayButtonState> {
-    constructor(props: PlayerButtonProps, context?: any);
-    /** @internal */
-    componentDidUpdate(): void;
-    private _onClick;
-    render(): React.JSX.Element;
-}
-export {};
-//# sourceMappingURL=PlayerButton.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"PlayerButton.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/PlayerButton.tsx"],"names":[],"mappings":"AAIA,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAKrD;;GAEG;AACH,qBAAa,YAAa,SAAQ,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC;IACxD,OAAO,CAAC,QAAQ,CAGd;IAEc,MAAM;CAevB;AAED;;GAEG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,eAAe;IACvB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,SAAS,CAC7C,iBAAiB,EACjB,eAAe,CAChB;gBACa,KAAK,EAAE,iBAAiB,EAAE,OAAO,CAAC,EAAE,GAAG;IAMnD,gBAAgB;IACA,kBAAkB;IAMlC,OAAO,CAAC,QAAQ,CAYd;IAEc,MAAM;CA6BvB"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"PlayerButton.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/PlayerButton.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 \"./PlayerButton.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\nimport { SvgPause, SvgPlay } from \"@itwin/itwinui-icons-react\";\n\n/** Player button used by buttons on timeline control\n * @internal\n */\nexport class PlayerButton extends React.PureComponent<any> {\n  private _onClick = () => {\n    // istanbul ignore else\n    if (this.props.onClick) this.props.onClick();\n  };\n\n  public override render() {\n    const { icon, title } = this.props;\n    return (\n      <button\n        data-testid={this.props.className}\n        className={classnames(\"player-button\", this.props.className)}\n        onClick={this._onClick}\n        title={title}\n      >\n        <span className=\"icon\">\n          <Icon iconSpec={icon} />\n        </span>\n      </button>\n    );\n  }\n}\n\n/** Properties for Play/Pause button used on timeline control\n * @internal\n */\nexport interface PlayerButtonProps extends CommonProps {\n  isPlaying: boolean;\n  onPlay?: () => void;\n  onPause?: () => void;\n  tooltip?: string;\n}\n\ninterface PlayButtonState {\n  isPlaying: boolean;\n}\n\n/** Play/Pause button used on timeline control\n * @internal\n */\nexport class PlayButton extends React.Component<\n  PlayerButtonProps,\n  PlayButtonState\n> {\n  constructor(props: PlayerButtonProps, context?: any) {\n    super(props, context);\n\n    this.state = { isPlaying: this.props.isPlaying };\n  }\n\n  /** @internal */\n  public override componentDidUpdate() {\n    if (this.props.isPlaying !== this.state.isPlaying) {\n      this.setState((_, props) => ({ isPlaying: props.isPlaying }));\n    }\n  }\n\n  private _onClick = () => {\n    const _isPlaying = !this.state.isPlaying;\n\n    this.setState({ isPlaying: _isPlaying });\n\n    if (_isPlaying) {\n      // istanbul ignore else\n      if (this.props.onPlay) this.props.onPlay();\n    } else {\n      // istanbul ignore else\n      if (this.props.onPause) this.props.onPause();\n    }\n  };\n\n  public override render() {\n    const { tooltip } = this.props;\n    const iconSpec = this.state.isPlaying ? <SvgPause /> : <SvgPlay />;\n    let title = tooltip;\n\n    if (!title)\n      title = UiIModelComponents.translate(\n        this.state.isPlaying ? \"timeline.pause\" : \"timeline.play\"\n      );\n\n    return (\n      <button\n        data-testid={this.props.className}\n        title={title}\n        className={classnames(\"player-button\", this.props.className)}\n        onClick={this._onClick}\n      >\n        <span\n          className=\"icon\"\n          data-testid={this.state.isPlaying ? \"pause\" : \"play\"}\n        >\n          <Icon\n            iconSpec={iconSpec}\n            data-testid={this.state.isPlaying ? \"pause\" : \"play\"}\n          />\n        </span>\n      </button>\n    );\n  }\n}\n"]}