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

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

@@ -1,82 +1,86 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InlineEdit = void 0;
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-require("./InlineEdit.scss");
-const classnames_1 = __importDefault(require("classnames"));
-const React = __importStar(require("react"));
-const appui_abstract_1 = require("@itwin/appui-abstract");
-const itwinui_react_1 = require("@itwin/itwinui-react");
-/** Duration Inline Editor
- * @internal
- */
-class InlineEdit extends React.Component {
-    constructor(props) {
-        super(props);
-        this._inputRef = React.createRef();
-        // istanbul ignore next
-        this._onBlur = (event) => {
-            this._sendChange(event.target.value);
-        };
-        this._onFocus = (event) => {
-            event.target.select();
-        };
-        this._onKeyDown = (event) => {
-            switch (event.key) {
-                case appui_abstract_1.SpecialKey.Escape:
-                    this.setState((prevState) => ({ value: prevState.originalValue }), () => this._inputRef.current.select());
-                    break;
-                case appui_abstract_1.SpecialKey.Enter:
-                    this._sendChange(this.state.value);
-                    break;
-            }
-        };
-        this._onChange = (event) => {
-            this.setState({ value: event.target.value });
-        };
-        this.state = { value: this.props.defaultValue, originalValue: this.props.defaultValue };
-    }
-    /** @internal */
-    componentDidUpdate(prevProps, _prevState) {
-        if (prevProps.defaultValue !== this.props.defaultValue) {
-            this.setState((_, props) => {
-                return { value: props.defaultValue, originalValue: props.defaultValue };
-            });
-        }
-    }
-    _sendChange(value) {
-        // istanbul ignore else
-        if (this.props.onChange)
-            this.props.onChange(value);
-    }
-    render() {
-        return (React.createElement(itwinui_react_1.Input, { "data-testid": "timeline-duration-edit-input", className: (0, classnames_1.default)("inline-edit-input", this.props.className), style: this.props.style, ref: this._inputRef, type: "text", value: this.state.value, size: "small", onFocus: this._onFocus, onBlur: this._onBlur, onKeyDown: this._onKeyDown, onChange: this._onChange }));
-    }
-}
-exports.InlineEdit = InlineEdit;
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InlineEdit = void 0;
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+require("./InlineEdit.scss");
+const classnames_1 = __importDefault(require("classnames"));
+const React = __importStar(require("react"));
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const itwinui_react_1 = require("@itwin/itwinui-react");
+/** Duration Inline Editor
+ * @internal
+ */
+class InlineEdit extends React.Component {
+    constructor(props) {
+        super(props);
+        this._inputRef = React.createRef();
+        // istanbul ignore next
+        this._onBlur = (event) => {
+            this._sendChange(event.target.value);
+        };
+        this._onFocus = (event) => {
+            event.target.select();
+        };
+        this._onKeyDown = (event) => {
+            switch (event.key) {
+                case appui_abstract_1.SpecialKey.Escape:
+                    this.setState((prevState) => ({ value: prevState.originalValue }), () => this._inputRef.current.select());
+                    break;
+                case appui_abstract_1.SpecialKey.Enter:
+                    this._sendChange(this.state.value);
+                    break;
+            }
+        };
+        this._onChange = (event) => {
+            this.setState({ value: event.target.value });
+        };
+        this.state = { value: this.props.defaultValue, originalValue: this.props.defaultValue };
+    }
+    /** @internal */
+    componentDidUpdate(prevProps, _prevState) {
+        if (prevProps.defaultValue !== this.props.defaultValue) {
+            this.setState((_, props) => {
+                return { value: props.defaultValue, originalValue: props.defaultValue };
+            });
+        }
+    }
+    _sendChange(value) {
+        // istanbul ignore else
+        if (this.props.onChange)
+            this.props.onChange(value);
+    }
+    render() {
+        return (React.createElement(itwinui_react_1.Input, { "data-testid": "timeline-duration-edit-input", className: (0, classnames_1.default)("inline-edit-input", this.props.className), style: this.props.style, ref: this._inputRef, type: "text", value: this.state.value, size: "small", onFocus: this._onFocus, onBlur: this._onBlur, onKeyDown: this._onKeyDown, onChange: this._onChange }));
+    }
+}
+exports.InlineEdit = InlineEdit;
 //# sourceMappingURL=InlineEdit.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"InlineEdit.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/InlineEdit.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;+FAG+F;AAC/F,6BAA2B;AAC3B,4DAAoC;AACpC,6CAA+B;AAC/B,0DAAmD;AAEnD,wDAA6C;AAY7C;;GAEG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,SAA2C;IAG/E,YAAY,KAAsB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QAHP,cAAS,GAAG,KAAK,CAAC,SAAS,EAAoB,CAAC;QAiBxD,uBAAuB;QACf,YAAO,GAAG,CAAC,KAA0C,EAAE,EAAE;YAC/D,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACvC,CAAC,CAAC;QAEM,aAAQ,GAAG,CAAC,KAA0C,EAAE,EAAE;YAChE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;QACxB,CAAC,CAAC;QAEM,eAAU,GAAG,CAAC,KAA4C,EAAE,EAAE;YACpE,QAAQ,KAAK,CAAC,GAAG,EAAE;gBACjB,KAAK,2BAAU,CAAC,MAAM;oBACpB,IAAI,CAAC,QAAQ,CACX,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,aAAa,EAAE,CAAC,EACnD,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,OAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;oBAC1C,MAAM;gBACR,KAAK,2BAAU,CAAC,KAAK;oBACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBACnC,MAAM;aACT;QACH,CAAC,CAAC;QAEM,cAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;YACjE,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;QAC/C,CAAC,CAAC;QApCA,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC;IAC1F,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA0B,EAAE,UAA2B;QACxF,IAAI,SAAS,CAAC,YAAY,KAAK,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE;YACtD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;gBACzB,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,YAAY,EAAE,aAAa,EAAE,KAAK,CAAC,YAAY,EAAE,CAAC;YAC1E,CAAC,CAAC,CAAC;SACJ;IACH,CAAC;IA4BO,WAAW,CAAC,KAAa;QAC/B,uBAAuB;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ;YACrB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAEe,MAAM;QACpB,OAAO,CACL,oBAAC,qBAAK,mBACQ,8BAA8B,EAC1C,SAAS,EAAE,IAAA,oBAAU,EAAC,mBAAmB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAChE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,GAAG,EAAE,IAAI,CAAC,SAAS,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,QAAQ,EAAE,IAAI,CAAC,SAAS,GAAI,CAC/B,CAAC;IACJ,CAAC;CACF;AAlED,gCAkEC","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\nimport \"./InlineEdit.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { Input } from \"@itwin/itwinui-react\";\r\n\r\ninterface InlineEditProps extends CommonProps {\r\n  defaultValue: string;\r\n  onChange?: (value: string) => void;\r\n}\r\n\r\ninterface InlineEditState {\r\n  value: string;\r\n  originalValue: string;\r\n}\r\n\r\n/** Duration Inline Editor\r\n * @internal\r\n */\r\nexport class InlineEdit extends React.Component<InlineEditProps, InlineEditState> {\r\n  private _inputRef = React.createRef<HTMLInputElement>();\r\n\r\n  constructor(props: InlineEditProps) {\r\n    super(props);\r\n\r\n    this.state = { value: this.props.defaultValue, originalValue: this.props.defaultValue };\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: InlineEditProps, _prevState: InlineEditState) { // eslint-disable-line @typescript-eslint/naming-convention\r\n    if (prevProps.defaultValue !== this.props.defaultValue) {\r\n      this.setState((_, props) => {\r\n        return { value: props.defaultValue, originalValue: props.defaultValue };\r\n      });\r\n    }\r\n  }\r\n\r\n  // istanbul ignore next\r\n  private _onBlur = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    this._sendChange(event.target.value);\r\n  };\r\n\r\n  private _onFocus = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    event.target.select();\r\n  };\r\n\r\n  private _onKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n    switch (event.key) {\r\n      case SpecialKey.Escape:\r\n        this.setState(\r\n          (prevState) => ({ value: prevState.originalValue }),\r\n          () => this._inputRef.current!.select());\r\n        break;\r\n      case SpecialKey.Enter:\r\n        this._sendChange(this.state.value);\r\n        break;\r\n    }\r\n  };\r\n\r\n  private _onChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    this.setState({ value: event.target.value });\r\n  };\r\n\r\n  private _sendChange(value: string) {\r\n    // istanbul ignore else\r\n    if (this.props.onChange)\r\n      this.props.onChange(value);\r\n  }\r\n\r\n  public override render() {\r\n    return (\r\n      <Input\r\n        data-testid=\"timeline-duration-edit-input\"\r\n        className={classnames(\"inline-edit-input\", this.props.className)}\r\n        style={this.props.style}\r\n        ref={this._inputRef}\r\n        type=\"text\"\r\n        value={this.state.value}\r\n        size=\"small\"\r\n        onFocus={this._onFocus}\r\n        onBlur={this._onBlur}\r\n        onKeyDown={this._onKeyDown}\r\n        onChange={this._onChange} />\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"InlineEdit.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/timeline/InlineEdit.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;+FAG+F;AAC/F,6BAA2B;AAC3B,4DAAoC;AACpC,6CAA+B;AAC/B,0DAAmD;AAEnD,wDAA6C;AAY7C;;GAEG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,SAA2C;IAG/E,YAAY,KAAsB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QAHP,cAAS,GAAG,KAAK,CAAC,SAAS,EAAoB,CAAC;QAiBxD,uBAAuB;QACf,YAAO,GAAG,CAAC,KAA0C,EAAE,EAAE;YAC/D,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACvC,CAAC,CAAC;QAEM,aAAQ,GAAG,CAAC,KAA0C,EAAE,EAAE;YAChE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;QACxB,CAAC,CAAC;QAEM,eAAU,GAAG,CAAC,KAA4C,EAAE,EAAE;YACpE,QAAQ,KAAK,CAAC,GAAG,EAAE;gBACjB,KAAK,2BAAU,CAAC,MAAM;oBACpB,IAAI,CAAC,QAAQ,CACX,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,aAAa,EAAE,CAAC,EACnD,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,OAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;oBAC1C,MAAM;gBACR,KAAK,2BAAU,CAAC,KAAK;oBACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBACnC,MAAM;aACT;QACH,CAAC,CAAC;QAEM,cAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;YACjE,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;QAC/C,CAAC,CAAC;QApCA,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC;IAC1F,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA0B,EAAE,UAA2B;QACxF,IAAI,SAAS,CAAC,YAAY,KAAK,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE;YACtD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;gBACzB,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,YAAY,EAAE,aAAa,EAAE,KAAK,CAAC,YAAY,EAAE,CAAC;YAC1E,CAAC,CAAC,CAAC;SACJ;IACH,CAAC;IA4BO,WAAW,CAAC,KAAa;QAC/B,uBAAuB;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ;YACrB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAEe,MAAM;QACpB,OAAO,CACL,oBAAC,qBAAK,mBACQ,8BAA8B,EAC1C,SAAS,EAAE,IAAA,oBAAU,EAAC,mBAAmB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAChE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,GAAG,EAAE,IAAI,CAAC,SAAS,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,QAAQ,EAAE,IAAI,CAAC,SAAS,GAAI,CAC/B,CAAC;IACJ,CAAC;CACF;AAlED,gCAkEC","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\nimport \"./InlineEdit.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { Input } from \"@itwin/itwinui-react\";\r\n\r\ninterface InlineEditProps extends CommonProps {\r\n  defaultValue: string;\r\n  onChange?: (value: string) => void;\r\n}\r\n\r\ninterface InlineEditState {\r\n  value: string;\r\n  originalValue: string;\r\n}\r\n\r\n/** Duration Inline Editor\r\n * @internal\r\n */\r\nexport class InlineEdit extends React.Component<InlineEditProps, InlineEditState> {\r\n  private _inputRef = React.createRef<HTMLInputElement>();\r\n\r\n  constructor(props: InlineEditProps) {\r\n    super(props);\r\n\r\n    this.state = { value: this.props.defaultValue, originalValue: this.props.defaultValue };\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: InlineEditProps, _prevState: InlineEditState) { // eslint-disable-line @typescript-eslint/naming-convention\r\n    if (prevProps.defaultValue !== this.props.defaultValue) {\r\n      this.setState((_, props) => {\r\n        return { value: props.defaultValue, originalValue: props.defaultValue };\r\n      });\r\n    }\r\n  }\r\n\r\n  // istanbul ignore next\r\n  private _onBlur = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    this._sendChange(event.target.value);\r\n  };\r\n\r\n  private _onFocus = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    event.target.select();\r\n  };\r\n\r\n  private _onKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n    switch (event.key) {\r\n      case SpecialKey.Escape:\r\n        this.setState(\r\n          (prevState) => ({ value: prevState.originalValue }),\r\n          () => this._inputRef.current!.select());\r\n        break;\r\n      case SpecialKey.Enter:\r\n        this._sendChange(this.state.value);\r\n        break;\r\n    }\r\n  };\r\n\r\n  private _onChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    this.setState({ value: event.target.value });\r\n  };\r\n\r\n  private _sendChange(value: string) {\r\n    // istanbul ignore else\r\n    if (this.props.onChange)\r\n      this.props.onChange(value);\r\n  }\r\n\r\n  public override render() {\r\n    return (\r\n      <Input\r\n        data-testid=\"timeline-duration-edit-input\"\r\n        className={classnames(\"inline-edit-input\", this.props.className)}\r\n        style={this.props.style}\r\n        ref={this._inputRef}\r\n        type=\"text\"\r\n        value={this.state.value}\r\n        size=\"small\"\r\n        onFocus={this._onFocus}\r\n        onBlur={this._onBlur}\r\n        onKeyDown={this._onKeyDown}\r\n        onChange={this._onChange} />\r\n    );\r\n  }\r\n}\r\n"]}

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

@@ -1,34 +1,34 @@
-import "./PlayerButton.scss";
-import * as React from "react";
-import { 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(): 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(): JSX.Element;
-}
-export {};
+import "./PlayerButton.scss";
+import * as React from "react";
+import { 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(): 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(): JSX.Element;
+}
+export {};
 //# sourceMappingURL=PlayerButton.d.ts.map

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

@@ -1,96 +1,100 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PlayButton = exports.PlayerButton = void 0;
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-require("./PlayerButton.scss");
-const classnames_1 = __importDefault(require("classnames"));
-const React = __importStar(require("react"));
-const core_react_1 = require("@itwin/core-react");
-const UiIModelComponents_1 = require("../UiIModelComponents");
-const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
-/** Player button used by buttons on timeline control
- * @internal
- */
-class PlayerButton extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        this._onClick = () => {
-            // istanbul ignore else
-            if (this.props.onClick)
-                this.props.onClick();
-        };
-    }
-    render() {
-        const { icon, title } = this.props;
-        return (React.createElement("button", { "data-testid": this.props.className, className: (0, classnames_1.default)("player-button", this.props.className), onClick: this._onClick, title: title },
-            React.createElement("span", { className: "icon" },
-                React.createElement(core_react_1.Icon, { iconSpec: icon }))));
-    }
-}
-exports.PlayerButton = PlayerButton;
-/** Play/Pause button used on timeline control
- * @internal
- */
-class PlayButton extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-        this._onClick = () => {
-            const _isPlaying = !this.state.isPlaying;
-            this.setState({ isPlaying: _isPlaying });
-            if (_isPlaying) {
-                // istanbul ignore else
-                if (this.props.onPlay)
-                    this.props.onPlay();
-            }
-            else {
-                // istanbul ignore else
-                if (this.props.onPause)
-                    this.props.onPause();
-            }
-        };
-        this.state = { isPlaying: this.props.isPlaying };
-    }
-    /** @internal */
-    componentDidUpdate() {
-        if (this.props.isPlaying !== this.state.isPlaying) {
-            this.setState((_, props) => ({ isPlaying: props.isPlaying }));
-        }
-    }
-    render() {
-        const { tooltip } = this.props;
-        const iconSpec = this.state.isPlaying ? React.createElement(itwinui_icons_react_1.SvgPause, null) : React.createElement(itwinui_icons_react_1.SvgPlay, null);
-        let title = tooltip;
-        if (!title)
-            title = UiIModelComponents_1.UiIModelComponents.translate(this.state.isPlaying ? "timeline.pause" : "timeline.play");
-        return (React.createElement("button", { "data-testid": this.props.className, title: title, className: (0, classnames_1.default)("player-button", this.props.className), onClick: this._onClick },
-            React.createElement("span", { className: "icon", "data-testid": this.state.isPlaying ? "pause" : "play" },
-                React.createElement(core_react_1.Icon, { iconSpec: iconSpec, "data-testid": this.state.isPlaying ? "pause" : "play" }))));
-    }
-}
-exports.PlayButton = PlayButton;
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PlayButton = exports.PlayerButton = void 0;
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+require("./PlayerButton.scss");
+const classnames_1 = __importDefault(require("classnames"));
+const React = __importStar(require("react"));
+const core_react_1 = require("@itwin/core-react");
+const UiIModelComponents_1 = require("../UiIModelComponents");
+const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
+/** Player button used by buttons on timeline control
+ * @internal
+ */
+class PlayerButton extends React.PureComponent {
+    constructor() {
+        super(...arguments);
+        this._onClick = () => {
+            // istanbul ignore else
+            if (this.props.onClick)
+                this.props.onClick();
+        };
+    }
+    render() {
+        const { icon, title } = this.props;
+        return (React.createElement("button", { "data-testid": this.props.className, className: (0, classnames_1.default)("player-button", this.props.className), onClick: this._onClick, title: title },
+            React.createElement("span", { className: "icon" },
+                React.createElement(core_react_1.Icon, { iconSpec: icon }))));
+    }
+}
+exports.PlayerButton = PlayerButton;
+/** Play/Pause button used on timeline control
+ * @internal
+ */
+class PlayButton extends React.Component {
+    constructor(props, context) {
+        super(props, context);
+        this._onClick = () => {
+            const _isPlaying = !this.state.isPlaying;
+            this.setState({ isPlaying: _isPlaying });
+            if (_isPlaying) {
+                // istanbul ignore else
+                if (this.props.onPlay)
+                    this.props.onPlay();
+            }
+            else {
+                // istanbul ignore else
+                if (this.props.onPause)
+                    this.props.onPause();
+            }
+        };
+        this.state = { isPlaying: this.props.isPlaying };
+    }
+    /** @internal */
+    componentDidUpdate() {
+        if (this.props.isPlaying !== this.state.isPlaying) {
+            this.setState((_, props) => ({ isPlaying: props.isPlaying }));
+        }
+    }
+    render() {
+        const { tooltip } = this.props;
+        const iconSpec = this.state.isPlaying ? React.createElement(itwinui_icons_react_1.SvgPause, null) : React.createElement(itwinui_icons_react_1.SvgPlay, null);
+        let title = tooltip;
+        if (!title)
+            title = UiIModelComponents_1.UiIModelComponents.translate(this.state.isPlaying ? "timeline.pause" : "timeline.play");
+        return (React.createElement("button", { "data-testid": this.props.className, title: title, className: (0, classnames_1.default)("player-button", this.props.className), onClick: this._onClick },
+            React.createElement("span", { className: "icon", "data-testid": this.state.isPlaying ? "pause" : "play" },
+                React.createElement(core_react_1.Icon, { iconSpec: iconSpec, "data-testid": this.state.isPlaying ? "pause" : "play" }))));
+    }
+}
+exports.PlayButton = PlayButton;
 //# sourceMappingURL=PlayerButton.js.map

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

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

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

@@ -1,55 +1,55 @@
-import "./Scrubber.scss";
-import * as React from "react";
-import { CommonProps } from "@itwin/core-react";
-import { TimelineDateMarkerProps } from "./TimelineComponent";
-/**
- * @internal
- */
-export declare function getPercentageOfRectangle(rect: DOMRect, pointer: number): number;
-/**
- * @internal
- */
-export declare function RailMarkers({ showToolTip, percent, tooltipText, markDate }: {
-    showToolTip: boolean;
-    percent: number;
-    tooltipText: string;
-    markDate?: DateMarkerProps;
-}): JSX.Element;
-/**
- * Custom Timeline Thumb
- * @internal
- */
-export declare function CustomThumb(): JSX.Element;
-/**
- * @internal
- */
-export declare function useFocusedThumb(sliderContainer: HTMLDivElement | undefined): boolean;
-/** Properties for Scrubber/Slider used on timeline control
- * @internal
- */
-export interface ScrubberProps extends CommonProps {
-    currentDuration: number;
-    totalDuration: number;
-    isPlaying: boolean;
-    inMiniMode: boolean;
-    startDate?: Date;
-    endDate?: Date;
-    showTime?: boolean;
-    onChange?: (values: ReadonlyArray<number>) => void;
-    onUpdate?: (values: ReadonlyArray<number>) => void;
-    timeZoneOffset?: number;
-    markDate?: TimelineDateMarkerProps;
-}
-/** Properties for marking current date in RailMarkers
- * @internal
- */
-interface DateMarkerProps {
-    datePercentage: number;
-    dateMarker?: React.ReactNode;
-}
-/** Scrubber/Slider for timeline control
- * @internal
- */
-export declare function Scrubber(props: ScrubberProps): JSX.Element;
-export {};
+import "./Scrubber.scss";
+import * as React from "react";
+import { CommonProps } from "@itwin/core-react";
+import { TimelineDateMarkerProps } from "./TimelineComponent";
+/**
+ * @internal
+ */
+export declare function getPercentageOfRectangle(rect: DOMRect, pointer: number): number;
+/**
+ * @internal
+ */
+export declare function RailMarkers({ showToolTip, percent, tooltipText, markDate }: {
+    showToolTip: boolean;
+    percent: number;
+    tooltipText: string;
+    markDate?: DateMarkerProps;
+}): JSX.Element;
+/**
+ * Custom Timeline Thumb
+ * @internal
+ */
+export declare function CustomThumb(): JSX.Element;
+/**
+ * @internal
+ */
+export declare function useFocusedThumb(sliderContainer: HTMLDivElement | undefined): boolean;
+/** Properties for Scrubber/Slider used on timeline control
+ * @internal
+ */
+export interface ScrubberProps extends CommonProps {
+    currentDuration: number;
+    totalDuration: number;
+    isPlaying: boolean;
+    inMiniMode: boolean;
+    startDate?: Date;
+    endDate?: Date;
+    showTime?: boolean;
+    onChange?: (values: ReadonlyArray<number>) => void;
+    onUpdate?: (values: ReadonlyArray<number>) => void;
+    timeZoneOffset?: number;
+    markDate?: TimelineDateMarkerProps;
+}
+/** Properties for marking current date in RailMarkers
+ * @internal
+ */
+interface DateMarkerProps {
+    datePercentage: number;
+    dateMarker?: React.ReactNode;
+}
+/** Scrubber/Slider for timeline control
+ * @internal
+ */
+export declare function Scrubber(props: ScrubberProps): JSX.Element;
+export {};
 //# sourceMappingURL=Scrubber.d.ts.map