@itwin/components-react 3.4.4 → 3.4.5

package/lib/esm/components-react/editors/SliderEditor.js

@@ -1,222 +1,222 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module PropertyEditors
- */
-import "./SliderEditor.scss";
-import classnames from "classnames";
-import * as React from "react";
-import { PropertyEditorParamTypes, PropertyValueFormat, StandardEditorNames, StandardTypeNames, } from "@itwin/appui-abstract";
-import { Icon } from "@itwin/core-react";
-import { Slider } from "@itwin/itwinui-react";
-import { PropertyEditorBase, PropertyEditorManager } from "./PropertyEditorManager";
-import { PopupButton, PopupContent, PopupOkCancelButtons } from "./PopupButton";
-/** SliderEditor React component that is a property editor with numeric input & up/down buttons
- * @public
- */
-export class SliderEditor extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        this._isMounted = false;
-        this._enterKey = false;
-        this._divElement = React.createRef();
-        /** @internal */
-        this.state = {
-            value: 0,
-            min: 0,
-            max: 100,
-        };
-        this._handleChange = (values) => {
-            const newValue = values[0];
-            // istanbul ignore else
-            if (this._isMounted)
-                this.setState({
-                    value: newValue,
-                });
-        };
-        this.internalFormatTooltip = (value, step = 1) => {
-            if (Number.isInteger(step))
-                return value.toFixed(0);
-            const stepString = step.toString();
-            const decimalIndex = stepString.indexOf(".");
-            const numDecimals = step.toString().length - (decimalIndex + 1);
-            return value.toFixed(numDecimals);
-        };
-        this._handleEnter = async () => {
-            this._enterKey = true;
-            await this._handleCommit();
-        };
-        this._handleClose = async () => {
-            if (this._enterKey) {
-                this._enterKey = false;
-            }
-            else {
-                // istanbul ignore else
-                if (this.props.onCancel)
-                    this.props.onCancel();
-            }
-        };
-        this._handleOk = async (_event) => {
-            await this._handleCommit();
-        };
-        this._handleCancel = (_event) => {
-            // istanbul ignore else
-            if (this.props.onCancel) {
-                this.props.onCancel();
-            }
-        };
-        this._handleCommit = async () => {
-            // istanbul ignore else
-            if (this.props.propertyRecord && this.props.onCommit) {
-                const propertyValue = await this.getPropertyValue();
-                // istanbul ignore else
-                if (propertyValue !== undefined) {
-                    this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });
-                }
-            }
-        };
-        this.tooltipProps = (_index, val) => {
-            const content = this.state.formatTooltip ? this.state.formatTooltip(val) : this.internalFormatTooltip(val, this.state.step);
-            return { placement: this.state.tooltipBelow ? "bottom" : "top", content, visible: this.state.showTooltip };
-        };
-    }
-    async getPropertyValue() {
-        const record = this.props.propertyRecord;
-        let propertyValue;
-        // istanbul ignore else
-        if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {
-            propertyValue = {
-                valueFormat: PropertyValueFormat.Primitive,
-                value: this.state.value,
-                displayValue: "",
-            };
-        }
-        return propertyValue;
-    }
-    get htmlElement() {
-        return this._divElement.current;
-    }
-    get hasFocus() {
-        let containsFocus = false;
-        // istanbul ignore else
-        if (this.htmlElement)
-            containsFocus = this.htmlElement.contains(document.activeElement);
-        return containsFocus;
-    }
-    /** @internal */
-    componentDidMount() {
-        this._isMounted = true;
-        this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises
-    }
-    /** @internal */
-    componentWillUnmount() {
-        this._isMounted = false;
-    }
-    /** @internal */
-    componentDidUpdate(prevProps) {
-        if (this.props.propertyRecord !== prevProps.propertyRecord) {
-            this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises
-        }
-    }
-    async setStateFromProps() {
-        const record = this.props.propertyRecord;
-        let initialValue = 0;
-        // istanbul ignore else
-        if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {
-            initialValue = record.value.value;
-        }
-        let size;
-        let min = 0;
-        let max = 100;
-        let step;
-        let showTooltip;
-        let tooltipBelow;
-        let formatTooltip;
-        let tickLabels;
-        let minLabel;
-        let maxLabel;
-        let trackDisplayMode;
-        let thumbMode;
-        const isDisabled = record ? record.isDisabled : undefined;
-        if (record && record.property && record.property.editor && record.property.editor.params) {
-            const sliderParams = record.property.editor.params.find((param) => param.type === PropertyEditorParamTypes.Slider);
-            // istanbul ignore else
-            if (sliderParams) {
-                min = sliderParams.minimum;
-                max = sliderParams.maximum;
-                size = sliderParams.size;
-                step = sliderParams.step;
-                thumbMode = 1 === sliderParams.mode ? "allow-crossing" : "inhibit-crossing";
-                trackDisplayMode = !sliderParams.reversed ? "auto" : "odd-segments";
-                showTooltip = sliderParams.showTooltip;
-                tooltipBelow = sliderParams.tooltipBelow;
-                formatTooltip = sliderParams.formatTooltip;
-                minLabel = !sliderParams.showMinMax ? "" : sliderParams.minIconSpec ? React.createElement(Icon, { iconSpec: sliderParams.minIconSpec }) : undefined;
-                maxLabel = !sliderParams.showMinMax ? "" : sliderParams.maxIconSpec ? React.createElement(Icon, { iconSpec: sliderParams.maxIconSpec }) : undefined;
-                if (sliderParams.showTicks) {
-                    const count = sliderParams.getTickCount ? sliderParams.getTickCount() : 0;
-                    if (count) {
-                        tickLabels = [];
-                        const increment = (max - min) / count;
-                        for (let i = 0; i <= count; i++) {
-                            const value = (i * increment) + min;
-                            if (sliderParams.showTickLabels) {
-                                const label = sliderParams.formatTick ? sliderParams.formatTick(value) : this.internalFormatTooltip(value, step);
-                                tickLabels.push(label);
-                            }
-                            else {
-                                tickLabels.push("");
-                            }
-                        }
-                    }
-                    else if (sliderParams.getTickValues) {
-                        tickLabels = sliderParams.getTickValues().map((val) => sliderParams.formatTick ? sliderParams.formatTick(val) : this.internalFormatTooltip(val, step));
-                    }
-                }
-            }
-        }
-        // istanbul ignore else
-        if (this._isMounted)
-            this.setState({
-                value: initialValue, isDisabled,
-                size,
-                min, max, step, trackDisplayMode,
-                showTooltip, tooltipBelow, formatTooltip,
-                minLabel,
-                maxLabel,
-                tickLabels,
-                thumbMode,
-            });
-    }
-    /** @internal */
-    render() {
-        const className = classnames("components-cell-editor", "components-slider-editor", this.props.className);
-        const minSize = this.state.size ? this.state.size : 100;
-        const style = {
-            ...this.props.style,
-            minWidth: `${minSize}px`,
-        };
-        const popupContent = (React.createElement(Slider, { className: "components-slider-editor-slider", style: style, values: [this.state.value], min: this.state.min, max: this.state.max, step: this.state.step, thumbMode: this.state.thumbMode, trackDisplayMode: this.state.trackDisplayMode, disabled: this.state.isDisabled, minLabel: this.state.minLabel, maxLabel: this.state.maxLabel, tooltipProps: this.tooltipProps, tickLabels: this.state.tickLabels, onChange: this._handleChange }));
-        return (React.createElement("div", { className: className, ref: this._divElement },
-            React.createElement(PopupButton, { label: this.state.value, onClose: this._handleClose, onEnter: this._handleEnter, setFocus: this.props.setFocus, focusTarget: ".core-slider-handle" },
-                React.createElement(PopupContent, null,
-                    popupContent,
-                    React.createElement(PopupOkCancelButtons, { onOk: this._handleOk, onCancel: this._handleCancel })))));
-    }
-}
-/** Slider Property Editor registered for the "number" type name and "slider" editor name.
- * It uses the [[SliderEditor]] React component.
- * @public
- */
-export class SliderPropertyEditor extends PropertyEditorBase {
-    get reactNode() {
-        return React.createElement(SliderEditor, null);
-    }
-}
-PropertyEditorManager.registerEditor(StandardTypeNames.Number, SliderPropertyEditor, StandardEditorNames.Slider);
-PropertyEditorManager.registerEditor(StandardTypeNames.Int, SliderPropertyEditor, StandardEditorNames.Slider);
-PropertyEditorManager.registerEditor(StandardTypeNames.Float, SliderPropertyEditor, StandardEditorNames.Slider);
-PropertyEditorManager.registerEditor(StandardTypeNames.Double, SliderPropertyEditor, StandardEditorNames.Slider);
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import "./SliderEditor.scss";
+import classnames from "classnames";
+import * as React from "react";
+import { PropertyEditorParamTypes, PropertyValueFormat, StandardEditorNames, StandardTypeNames, } from "@itwin/appui-abstract";
+import { Icon } from "@itwin/core-react";
+import { Slider } from "@itwin/itwinui-react";
+import { PropertyEditorBase, PropertyEditorManager } from "./PropertyEditorManager";
+import { PopupButton, PopupContent, PopupOkCancelButtons } from "./PopupButton";
+/** SliderEditor React component that is a property editor with numeric input & up/down buttons
+ * @public
+ */
+export class SliderEditor extends React.PureComponent {
+    constructor() {
+        super(...arguments);
+        this._isMounted = false;
+        this._enterKey = false;
+        this._divElement = React.createRef();
+        /** @internal */
+        this.state = {
+            value: 0,
+            min: 0,
+            max: 100,
+        };
+        this._handleChange = (values) => {
+            const newValue = values[0];
+            // istanbul ignore else
+            if (this._isMounted)
+                this.setState({
+                    value: newValue,
+                });
+        };
+        this.internalFormatTooltip = (value, step = 1) => {
+            if (Number.isInteger(step))
+                return value.toFixed(0);
+            const stepString = step.toString();
+            const decimalIndex = stepString.indexOf(".");
+            const numDecimals = step.toString().length - (decimalIndex + 1);
+            return value.toFixed(numDecimals);
+        };
+        this._handleEnter = async () => {
+            this._enterKey = true;
+            await this._handleCommit();
+        };
+        this._handleClose = async () => {
+            if (this._enterKey) {
+                this._enterKey = false;
+            }
+            else {
+                // istanbul ignore else
+                if (this.props.onCancel)
+                    this.props.onCancel();
+            }
+        };
+        this._handleOk = async (_event) => {
+            await this._handleCommit();
+        };
+        this._handleCancel = (_event) => {
+            // istanbul ignore else
+            if (this.props.onCancel) {
+                this.props.onCancel();
+            }
+        };
+        this._handleCommit = async () => {
+            // istanbul ignore else
+            if (this.props.propertyRecord && this.props.onCommit) {
+                const propertyValue = await this.getPropertyValue();
+                // istanbul ignore else
+                if (propertyValue !== undefined) {
+                    this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });
+                }
+            }
+        };
+        this.tooltipProps = (_index, val) => {
+            const content = this.state.formatTooltip ? this.state.formatTooltip(val) : this.internalFormatTooltip(val, this.state.step);
+            return { placement: this.state.tooltipBelow ? "bottom" : "top", content, visible: this.state.showTooltip };
+        };
+    }
+    async getPropertyValue() {
+        const record = this.props.propertyRecord;
+        let propertyValue;
+        // istanbul ignore else
+        if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {
+            propertyValue = {
+                valueFormat: PropertyValueFormat.Primitive,
+                value: this.state.value,
+                displayValue: "",
+            };
+        }
+        return propertyValue;
+    }
+    get htmlElement() {
+        return this._divElement.current;
+    }
+    get hasFocus() {
+        let containsFocus = false;
+        // istanbul ignore else
+        if (this.htmlElement)
+            containsFocus = this.htmlElement.contains(document.activeElement);
+        return containsFocus;
+    }
+    /** @internal */
+    componentDidMount() {
+        this._isMounted = true;
+        this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises
+    }
+    /** @internal */
+    componentWillUnmount() {
+        this._isMounted = false;
+    }
+    /** @internal */
+    componentDidUpdate(prevProps) {
+        if (this.props.propertyRecord !== prevProps.propertyRecord) {
+            this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises
+        }
+    }
+    async setStateFromProps() {
+        const record = this.props.propertyRecord;
+        let initialValue = 0;
+        // istanbul ignore else
+        if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {
+            initialValue = record.value.value;
+        }
+        let size;
+        let min = 0;
+        let max = 100;
+        let step;
+        let showTooltip;
+        let tooltipBelow;
+        let formatTooltip;
+        let tickLabels;
+        let minLabel;
+        let maxLabel;
+        let trackDisplayMode;
+        let thumbMode;
+        const isDisabled = record ? record.isDisabled : undefined;
+        if (record && record.property && record.property.editor && record.property.editor.params) {
+            const sliderParams = record.property.editor.params.find((param) => param.type === PropertyEditorParamTypes.Slider);
+            // istanbul ignore else
+            if (sliderParams) {
+                min = sliderParams.minimum;
+                max = sliderParams.maximum;
+                size = sliderParams.size;
+                step = sliderParams.step;
+                thumbMode = 1 === sliderParams.mode ? "allow-crossing" : "inhibit-crossing";
+                trackDisplayMode = !sliderParams.reversed ? "auto" : "odd-segments";
+                showTooltip = sliderParams.showTooltip;
+                tooltipBelow = sliderParams.tooltipBelow;
+                formatTooltip = sliderParams.formatTooltip;
+                minLabel = !sliderParams.showMinMax ? "" : sliderParams.minIconSpec ? React.createElement(Icon, { iconSpec: sliderParams.minIconSpec }) : undefined;
+                maxLabel = !sliderParams.showMinMax ? "" : sliderParams.maxIconSpec ? React.createElement(Icon, { iconSpec: sliderParams.maxIconSpec }) : undefined;
+                if (sliderParams.showTicks) {
+                    const count = sliderParams.getTickCount ? sliderParams.getTickCount() : 0;
+                    if (count) {
+                        tickLabels = [];
+                        const increment = (max - min) / count;
+                        for (let i = 0; i <= count; i++) {
+                            const value = (i * increment) + min;
+                            if (sliderParams.showTickLabels) {
+                                const label = sliderParams.formatTick ? sliderParams.formatTick(value) : this.internalFormatTooltip(value, step);
+                                tickLabels.push(label);
+                            }
+                            else {
+                                tickLabels.push("");
+                            }
+                        }
+                    }
+                    else if (sliderParams.getTickValues) {
+                        tickLabels = sliderParams.getTickValues().map((val) => sliderParams.formatTick ? sliderParams.formatTick(val) : this.internalFormatTooltip(val, step));
+                    }
+                }
+            }
+        }
+        // istanbul ignore else
+        if (this._isMounted)
+            this.setState({
+                value: initialValue, isDisabled,
+                size,
+                min, max, step, trackDisplayMode,
+                showTooltip, tooltipBelow, formatTooltip,
+                minLabel,
+                maxLabel,
+                tickLabels,
+                thumbMode,
+            });
+    }
+    /** @internal */
+    render() {
+        const className = classnames("components-cell-editor", "components-slider-editor", this.props.className);
+        const minSize = this.state.size ? this.state.size : 100;
+        const style = {
+            ...this.props.style,
+            minWidth: `${minSize}px`,
+        };
+        const popupContent = (React.createElement(Slider, { className: "components-slider-editor-slider", style: style, values: [this.state.value], min: this.state.min, max: this.state.max, step: this.state.step, thumbMode: this.state.thumbMode, trackDisplayMode: this.state.trackDisplayMode, disabled: this.state.isDisabled, minLabel: this.state.minLabel, maxLabel: this.state.maxLabel, tooltipProps: this.tooltipProps, tickLabels: this.state.tickLabels, onChange: this._handleChange }));
+        return (React.createElement("div", { className: className, ref: this._divElement },
+            React.createElement(PopupButton, { label: this.state.value, onClose: this._handleClose, onEnter: this._handleEnter, setFocus: this.props.setFocus, focusTarget: ".core-slider-handle" },
+                React.createElement(PopupContent, null,
+                    popupContent,
+                    React.createElement(PopupOkCancelButtons, { onOk: this._handleOk, onCancel: this._handleCancel })))));
+    }
+}
+/** Slider Property Editor registered for the "number" type name and "slider" editor name.
+ * It uses the [[SliderEditor]] React component.
+ * @public
+ */
+export class SliderPropertyEditor extends PropertyEditorBase {
+    get reactNode() {
+        return React.createElement(SliderEditor, null);
+    }
+}
+PropertyEditorManager.registerEditor(StandardTypeNames.Number, SliderPropertyEditor, StandardEditorNames.Slider);
+PropertyEditorManager.registerEditor(StandardTypeNames.Int, SliderPropertyEditor, StandardEditorNames.Slider);
+PropertyEditorManager.registerEditor(StandardTypeNames.Float, SliderPropertyEditor, StandardEditorNames.Slider);
+PropertyEditorManager.registerEditor(StandardTypeNames.Double, SliderPropertyEditor, StandardEditorNames.Slider);
 //# sourceMappingURL=SliderEditor.js.map

package/lib/esm/components-react/editors/SliderEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/SliderEditor.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,qBAAqB,CAAC;AAC7B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACiB,wBAAwB,EAAiB,mBAAmB,EAAsB,mBAAmB,EAAE,iBAAiB,GAC/I,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAgB,MAAM,sBAAsB,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAoBhF;;GAEG;AACH,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,aAAqD;IAA7F;;QACU,eAAU,GAAG,KAAK,CAAC;QACnB,cAAS,GAAG,KAAK,CAAC;QAClB,gBAAW,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;QAExD,gBAAgB;QACS,UAAK,GAAgC;YAC5D,KAAK,EAAE,CAAC;YACR,GAAG,EAAE,CAAC;YACN,GAAG,EAAE,GAAG;SACT,CAAC;QA8BM,kBAAa,GAAG,CAAC,MAAyB,EAAQ,EAAE;YAC1D,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;YAE3B,uBAAuB;YACvB,IAAI,IAAI,CAAC,UAAU;gBACjB,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,QAAQ;iBAChB,CAAC,CAAC;QACP,CAAC,CAAC;QAoBM,0BAAqB,GAAG,CAAC,KAAa,EAAE,IAAI,GAAG,CAAC,EAAE,EAAE;YAC1D,IAAI,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC;gBACxB,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YAE1B,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnC,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;YAC7C,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;YAChE,OAAO,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QACpC,CAAC,CAAC;QA8EM,iBAAY,GAAG,KAAK,IAAmB,EAAE;YAC/C,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;QAC7B,CAAC,CAAC;QAEM,iBAAY,GAAG,KAAK,IAAmB,EAAE;YAC/C,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;aACxB;iBAAM;gBACL,uBAAuB;gBACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ;oBACrB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;aACzB;QACH,CAAC,CAAC;QAEM,cAAS,GAAG,KAAK,EAAE,MAAwB,EAAiB,EAAE;YACpE,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;QAC7B,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,MAAwB,EAAQ,EAAE;YACzD,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;gBACvB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;aACvB;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,KAAK,IAAmB,EAAE;YAChD,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;gBACpD,MAAM,aAAa,GAAG,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACpD,uBAAuB;gBACvB,IAAI,aAAa,KAAK,SAAS,EAAE;oBAC/B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,QAAQ,EAAE,aAAa,EAAE,CAAC,CAAC;iBAC7F;aACF;QACH,CAAC,CAAC;QAEM,iBAAY,GAAG,CAAC,MAAc,EAAE,GAAW,EAAE,EAAE;YACrD,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YAC5H,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,EAA6C,CAAC;QACxJ,CAAC,CAAC;IA0CJ,CAAC;IAhOQ,KAAK,CAAC,gBAAgB;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,aAAwC,CAAC;QAE7C,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,mBAAmB,CAAC,SAAS,EAAE;YACxE,aAAa,GAAG;gBACd,WAAW,EAAE,mBAAmB,CAAC,SAAS;gBAC1C,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;gBACvB,YAAY,EAAE,EAAE;aACjB,CAAC;SACH;QAED,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC;IAClC,CAAC;IAED,IAAW,QAAQ;QACjB,IAAI,aAAa,GAAG,KAAK,CAAC;QAC1B,uBAAuB;QACvB,IAAI,IAAI,CAAC,WAAW;YAClB,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;QACpE,OAAO,aAAa,CAAC;IACvB,CAAC;IAYD,gBAAgB;IACA,iBAAiB;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;IAC1F,CAAC;IAED,gBAAgB;IACA,oBAAoB;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA8B;QAC/D,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,KAAK,SAAS,CAAC,cAAc,EAAE;YAC1D,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;SACzF;IACH,CAAC;IAYO,KAAK,CAAC,iBAAiB;QAC7B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,YAAY,GAAG,CAAC,CAAC;QAErB,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,mBAAmB,CAAC,SAAS,EAAE;YACxE,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,KAAe,CAAC;SAC7C;QAED,IAAI,IAAwB,CAAC;QAC7B,IAAI,GAAG,GAAG,CAAC,CAAC;QACZ,IAAI,GAAG,GAAG,GAAG,CAAC;QACd,IAAI,IAAwB,CAAC;QAC7B,IAAI,WAAgC,CAAC;QACrC,IAAI,YAAiC,CAAC;QACtC,IAAI,aAAsD,CAAC;QAC3D,IAAI,UAAgC,CAAC;QACrC,IAAI,QAAqC,CAAC;QAC1C,IAAI,QAAqC,CAAC;QAC1C,IAAI,gBAAgF,CAAC;QACrF,IAAI,SAA4D,CAAC;QAEjE,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;QAE1D,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE;YACxF,MAAM,YAAY,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAA2B,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,wBAAwB,CAAC,MAAM,CAAuB,CAAC;YAC/J,uBAAuB;YACvB,IAAI,YAAY,EAAE;gBAChB,GAAG,GAAG,YAAY,CAAC,OAAO,CAAC;gBAC3B,GAAG,GAAG,YAAY,CAAC,OAAO,CAAC;gBAC3B,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC;gBACzB,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC;gBACzB,SAAS,GAAG,CAAC,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,kBAAkB,CAAC;gBAC5E,gBAAgB,GAAG,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC;gBACpE,WAAW,GAAG,YAAY,CAAC,WAAW,CAAC;gBACvC,YAAY,GAAG,YAAY,CAAC,YAAY,CAAC;gBACzC,aAAa,GAAG,YAAY,CAAC,aAAa,CAAC;gBAE3C,QAAQ,GAAG,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,CAAC,oBAAC,IAAI,IAAC,QAAQ,EAAE,YAAY,CAAC,WAAW,GAAI,CAAC,CAAC,CAAC,SAAS,CAAC;gBAC/H,QAAQ,GAAG,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,CAAC,oBAAC,IAAI,IAAC,QAAQ,EAAE,YAAY,CAAC,WAAW,GAAI,CAAC,CAAC,CAAC,SAAS,CAAC;gBAE/H,IAAI,YAAY,CAAC,SAAS,EAAE;oBAC1B,MAAM,KAAK,GAAG,YAAY,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;oBAC1E,IAAI,KAAK,EAAE;wBACT,UAAU,GAAG,EAAE,CAAC;wBAChB,MAAM,SAAS,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,KAAK,CAAC;wBACtC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,KAAK,EAAE,CAAC,EAAE,EAAE;4BAC/B,MAAM,KAAK,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC,GAAG,GAAG,CAAC;4BACpC,IAAI,YAAY,CAAC,cAAc,EAAE;gCAC/B,MAAM,KAAK,GAAG,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;gCACjH,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;6BACxB;iCAAM;gCACL,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;6BACrB;yBACF;qBACF;yBAAM,IAAI,YAAY,CAAC,aAAa,EAAE;wBACrC,UAAU,GAAG,YAAY,CAAC,aAAa,EAAE,CAAC,GAAG,CAAC,CAAC,GAAW,EAAE,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC;qBAChK;iBACF;aACF;SACF;QAED,uBAAuB;QACvB,IAAI,IAAI,CAAC,UAAU;YACjB,IAAI,CAAC,QAAQ,CAAC;gBACZ,KAAK,EAAE,YAAY,EAAE,UAAU;gBAC/B,IAAI;gBACJ,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,gBAAgB;gBAChC,WAAW,EAAE,YAAY,EAAE,aAAa;gBACxC,QAAQ;gBACR,QAAQ;gBACR,UAAU;gBACV,SAAS;aACV,CAAC,CAAC;IACP,CAAC;IA4CD,gBAAgB;IACA,MAAM;QACpB,MAAM,SAAS,GAAG,UAAU,CAAC,wBAAwB,EAAE,0BAA0B,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QACzG,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;QACxD,MAAM,KAAK,GAAwB;YACjC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK;YACnB,QAAQ,EAAE,GAAG,OAAO,IAAI;SACzB,CAAC;QAEF,MAAM,YAAY,GAAG,CACnB,oBAAC,MAAM,IACL,SAAS,EAAC,iCAAiC,EAC3C,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAC1B,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAC7C,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAC/B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,QAAQ,EAAE,IAAI,CAAC,aAAa,GAC5B,CACH,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,WAAW;YAC9C,oBAAC,WAAW,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1F,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,WAAW,EAAC,qBAAqB;gBAChE,oBAAC,YAAY;oBACV,YAAY;oBACb,oBAAC,oBAAoB,IAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,IAAI,CAAC,aAAa,GAAI,CAC/D,CACH,CACV,CACP,CAAC;IACJ,CAAC;CACF;AAED;;;GAGG;AACH,MAAM,OAAO,oBAAqB,SAAQ,kBAAkB;IAC1D,IAAW,SAAS;QAClB,OAAO,oBAAC,YAAY,OAAG,CAAC;IAC1B,CAAC;CACF;AAED,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,MAAM,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;AACjH,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;AAC9G,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;AAChH,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,MAAM,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport \"./SliderEditor.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport {\n  PropertyEditorParams, PropertyEditorParamTypes, PropertyValue, PropertyValueFormat, SliderEditorParams, StandardEditorNames, StandardTypeNames,\n} from \"@itwin/appui-abstract\";\nimport { Icon } from \"@itwin/core-react\";\nimport { Slider, TooltipProps } from \"@itwin/itwinui-react\";\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\nimport { PopupButton, PopupContent, PopupOkCancelButtons } from \"./PopupButton\";\n\n/** @internal */\ninterface SliderEditorState {\n  value: number;\n  isDisabled?: boolean;\n  min: number;\n  max: number;\n  size?: number;\n  step?: number;\n  showTooltip?: boolean;\n  tooltipBelow?: boolean;\n  formatTooltip?: (value: number) => string;\n  thumbMode?: \"allow-crossing\" | \"inhibit-crossing\";\n  trackDisplayMode?: \"auto\" | \"none\" | \"odd-segments\" | \"even-segments\";\n  minLabel?: React.ReactNode;\n  maxLabel?: React.ReactNode;\n  tickLabels?: React.ReactNode;\n}\n\n/** SliderEditor React component that is a property editor with numeric input & up/down buttons\n * @public\n */\nexport class SliderEditor extends React.PureComponent<PropertyEditorProps, SliderEditorState> implements TypeEditor {\n  private _isMounted = false;\n  private _enterKey = false;\n  private _divElement = React.createRef<HTMLDivElement>();\n\n  /** @internal */\n  public override readonly state: Readonly<SliderEditorState> = {\n    value: 0,\n    min: 0,\n    max: 100,\n  };\n\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\n    const record = this.props.propertyRecord;\n    let propertyValue: PropertyValue | undefined;\n\n    // istanbul ignore else\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n      propertyValue = {\n        valueFormat: PropertyValueFormat.Primitive,\n        value: this.state.value,\n        displayValue: \"\",\n      };\n    }\n\n    return propertyValue;\n  }\n\n  public get htmlElement(): HTMLElement | null {\n    return this._divElement.current;\n  }\n\n  public get hasFocus(): boolean {\n    let containsFocus = false;\n    // istanbul ignore else\n    if (this.htmlElement)\n      containsFocus = this.htmlElement.contains(document.activeElement);\n    return containsFocus;\n  }\n\n  private _handleChange = (values: readonly number[]): void => {\n    const newValue = values[0];\n\n    // istanbul ignore else\n    if (this._isMounted)\n      this.setState({\n        value: newValue,\n      });\n  };\n\n  /** @internal */\n  public override componentDidMount() {\n    this._isMounted = true;\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\n  }\n\n  /** @internal */\n  public override componentWillUnmount() {\n    this._isMounted = false;\n  }\n\n  /** @internal */\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\n    }\n  }\n\n  private internalFormatTooltip = (value: number, step = 1) => {\n    if (Number.isInteger(step))\n      return value.toFixed(0);\n\n    const stepString = step.toString();\n    const decimalIndex = stepString.indexOf(\".\");\n    const numDecimals = step.toString().length - (decimalIndex + 1);\n    return value.toFixed(numDecimals);\n  };\n\n  private async setStateFromProps() {\n    const record = this.props.propertyRecord;\n    let initialValue = 0;\n\n    // istanbul ignore else\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n      initialValue = record.value.value as number;\n    }\n\n    let size: number | undefined;\n    let min = 0;\n    let max = 100;\n    let step: number | undefined;\n    let showTooltip: boolean | undefined;\n    let tooltipBelow: boolean | undefined;\n    let formatTooltip: ((value: number) => string) | undefined;\n    let tickLabels: string[] | undefined;\n    let minLabel: React.ReactNode | undefined;\n    let maxLabel: React.ReactNode | undefined;\n    let trackDisplayMode: \"auto\" | \"none\" | \"odd-segments\" | \"even-segments\" | undefined;\n    let thumbMode: \"allow-crossing\" | \"inhibit-crossing\" | undefined;\n\n    const isDisabled = record ? record.isDisabled : undefined;\n\n    if (record && record.property && record.property.editor && record.property.editor.params) {\n      const sliderParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.Slider) as SliderEditorParams;\n      // istanbul ignore else\n      if (sliderParams) {\n        min = sliderParams.minimum;\n        max = sliderParams.maximum;\n        size = sliderParams.size;\n        step = sliderParams.step;\n        thumbMode = 1 === sliderParams.mode ? \"allow-crossing\" : \"inhibit-crossing\";\n        trackDisplayMode = !sliderParams.reversed ? \"auto\" : \"odd-segments\";\n        showTooltip = sliderParams.showTooltip;\n        tooltipBelow = sliderParams.tooltipBelow;\n        formatTooltip = sliderParams.formatTooltip;\n\n        minLabel = !sliderParams.showMinMax ? \"\" : sliderParams.minIconSpec ? <Icon iconSpec={sliderParams.minIconSpec} /> : undefined;\n        maxLabel = !sliderParams.showMinMax ? \"\" : sliderParams.maxIconSpec ? <Icon iconSpec={sliderParams.maxIconSpec} /> : undefined;\n\n        if (sliderParams.showTicks) {\n          const count = sliderParams.getTickCount ? sliderParams.getTickCount() : 0;\n          if (count) {\n            tickLabels = [];\n            const increment = (max - min) / count;\n            for (let i = 0; i <= count; i++) {\n              const value = (i * increment) + min;\n              if (sliderParams.showTickLabels) {\n                const label = sliderParams.formatTick ? sliderParams.formatTick(value) : this.internalFormatTooltip(value, step);\n                tickLabels.push(label);\n              } else {\n                tickLabels.push(\"\");\n              }\n            }\n          } else if (sliderParams.getTickValues) {\n            tickLabels = sliderParams.getTickValues().map((val: number) => sliderParams.formatTick ? sliderParams.formatTick(val) : this.internalFormatTooltip(val, step));\n          }\n        }\n      }\n    }\n\n    // istanbul ignore else\n    if (this._isMounted)\n      this.setState({\n        value: initialValue, isDisabled,\n        size,\n        min, max, step, trackDisplayMode,\n        showTooltip, tooltipBelow, formatTooltip,\n        minLabel,\n        maxLabel,\n        tickLabels,\n        thumbMode,\n      });\n  }\n\n  private _handleEnter = async (): Promise<void> => {\n    this._enterKey = true;\n    await this._handleCommit();\n  };\n\n  private _handleClose = async (): Promise<void> => {\n    if (this._enterKey) {\n      this._enterKey = false;\n    } else {\n      // istanbul ignore else\n      if (this.props.onCancel)\n        this.props.onCancel();\n    }\n  };\n\n  private _handleOk = async (_event: React.MouseEvent): Promise<void> => {\n    await this._handleCommit();\n  };\n\n  private _handleCancel = (_event: React.MouseEvent): void => {\n    // istanbul ignore else\n    if (this.props.onCancel) {\n      this.props.onCancel();\n    }\n  };\n\n  private _handleCommit = async (): Promise<void> => {\n    // istanbul ignore else\n    if (this.props.propertyRecord && this.props.onCommit) {\n      const propertyValue = await this.getPropertyValue();\n      // istanbul ignore else\n      if (propertyValue !== undefined) {\n        this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\n      }\n    }\n  };\n\n  private tooltipProps = (_index: number, val: number) => {\n    const content = this.state.formatTooltip ? this.state.formatTooltip(val) : this.internalFormatTooltip(val, this.state.step);\n    return { placement: this.state.tooltipBelow ? \"bottom\" : \"top\", content, visible: this.state.showTooltip } as Partial<Omit<TooltipProps, \"children\">>;\n  };\n\n  /** @internal */\n  public override render(): React.ReactNode {\n    const className = classnames(\"components-cell-editor\", \"components-slider-editor\", this.props.className);\n    const minSize = this.state.size ? this.state.size : 100;\n    const style: React.CSSProperties = {\n      ...this.props.style,\n      minWidth: `${minSize}px`,\n    };\n\n    const popupContent = (\n      <Slider\n        className=\"components-slider-editor-slider\"\n        style={style}\n        values={[this.state.value]}\n        min={this.state.min}\n        max={this.state.max}\n        step={this.state.step}\n        thumbMode={this.state.thumbMode}\n        trackDisplayMode={this.state.trackDisplayMode}\n        disabled={this.state.isDisabled}\n        minLabel={this.state.minLabel}\n        maxLabel={this.state.maxLabel}\n        tooltipProps={this.tooltipProps}\n        tickLabels={this.state.tickLabels}\n        onChange={this._handleChange}\n      />\n    );\n\n    return (\n      <div className={className} ref={this._divElement}>\n        <PopupButton label={this.state.value} onClose={this._handleClose} onEnter={this._handleEnter}\n          setFocus={this.props.setFocus} focusTarget=\".core-slider-handle\">\n          <PopupContent>\n            {popupContent}\n            <PopupOkCancelButtons onOk={this._handleOk} onCancel={this._handleCancel} />\n          </PopupContent>\n        </PopupButton>\n      </div>\n    );\n  }\n}\n\n/** Slider Property Editor registered for the \"number\" type name and \"slider\" editor name.\n * It uses the [[SliderEditor]] React component.\n * @public\n */\nexport class SliderPropertyEditor extends PropertyEditorBase {\n  public get reactNode(): React.ReactNode {\n    return <SliderEditor />;\n  }\n}\n\nPropertyEditorManager.registerEditor(StandardTypeNames.Number, SliderPropertyEditor, StandardEditorNames.Slider);\nPropertyEditorManager.registerEditor(StandardTypeNames.Int, SliderPropertyEditor, StandardEditorNames.Slider);\nPropertyEditorManager.registerEditor(StandardTypeNames.Float, SliderPropertyEditor, StandardEditorNames.Slider);\nPropertyEditorManager.registerEditor(StandardTypeNames.Double, SliderPropertyEditor, StandardEditorNames.Slider);\n"]}
+{"version":3,"file":"SliderEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/SliderEditor.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,qBAAqB,CAAC;AAC7B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACiB,wBAAwB,EAAiB,mBAAmB,EAAsB,mBAAmB,EAAE,iBAAiB,GAC/I,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAgB,MAAM,sBAAsB,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAoBhF;;GAEG;AACH,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,aAAqD;IAA7F;;QACU,eAAU,GAAG,KAAK,CAAC;QACnB,cAAS,GAAG,KAAK,CAAC;QAClB,gBAAW,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;QAExD,gBAAgB;QACS,UAAK,GAAgC;YAC5D,KAAK,EAAE,CAAC;YACR,GAAG,EAAE,CAAC;YACN,GAAG,EAAE,GAAG;SACT,CAAC;QA8BM,kBAAa,GAAG,CAAC,MAAyB,EAAQ,EAAE;YAC1D,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;YAE3B,uBAAuB;YACvB,IAAI,IAAI,CAAC,UAAU;gBACjB,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,QAAQ;iBAChB,CAAC,CAAC;QACP,CAAC,CAAC;QAoBM,0BAAqB,GAAG,CAAC,KAAa,EAAE,IAAI,GAAG,CAAC,EAAE,EAAE;YAC1D,IAAI,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC;gBACxB,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YAE1B,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnC,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;YAC7C,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;YAChE,OAAO,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QACpC,CAAC,CAAC;QA8EM,iBAAY,GAAG,KAAK,IAAmB,EAAE;YAC/C,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;QAC7B,CAAC,CAAC;QAEM,iBAAY,GAAG,KAAK,IAAmB,EAAE;YAC/C,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;aACxB;iBAAM;gBACL,uBAAuB;gBACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ;oBACrB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;aACzB;QACH,CAAC,CAAC;QAEM,cAAS,GAAG,KAAK,EAAE,MAAwB,EAAiB,EAAE;YACpE,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;QAC7B,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,MAAwB,EAAQ,EAAE;YACzD,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;gBACvB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;aACvB;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,KAAK,IAAmB,EAAE;YAChD,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;gBACpD,MAAM,aAAa,GAAG,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACpD,uBAAuB;gBACvB,IAAI,aAAa,KAAK,SAAS,EAAE;oBAC/B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,QAAQ,EAAE,aAAa,EAAE,CAAC,CAAC;iBAC7F;aACF;QACH,CAAC,CAAC;QAEM,iBAAY,GAAG,CAAC,MAAc,EAAE,GAAW,EAAE,EAAE;YACrD,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YAC5H,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,EAA6C,CAAC;QACxJ,CAAC,CAAC;IA0CJ,CAAC;IAhOQ,KAAK,CAAC,gBAAgB;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,aAAwC,CAAC;QAE7C,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,mBAAmB,CAAC,SAAS,EAAE;YACxE,aAAa,GAAG;gBACd,WAAW,EAAE,mBAAmB,CAAC,SAAS;gBAC1C,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;gBACvB,YAAY,EAAE,EAAE;aACjB,CAAC;SACH;QAED,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC;IAClC,CAAC;IAED,IAAW,QAAQ;QACjB,IAAI,aAAa,GAAG,KAAK,CAAC;QAC1B,uBAAuB;QACvB,IAAI,IAAI,CAAC,WAAW;YAClB,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;QACpE,OAAO,aAAa,CAAC;IACvB,CAAC;IAYD,gBAAgB;IACA,iBAAiB;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;IAC1F,CAAC;IAED,gBAAgB;IACA,oBAAoB;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA8B;QAC/D,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,KAAK,SAAS,CAAC,cAAc,EAAE;YAC1D,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;SACzF;IACH,CAAC;IAYO,KAAK,CAAC,iBAAiB;QAC7B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,YAAY,GAAG,CAAC,CAAC;QAErB,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,mBAAmB,CAAC,SAAS,EAAE;YACxE,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,KAAe,CAAC;SAC7C;QAED,IAAI,IAAwB,CAAC;QAC7B,IAAI,GAAG,GAAG,CAAC,CAAC;QACZ,IAAI,GAAG,GAAG,GAAG,CAAC;QACd,IAAI,IAAwB,CAAC;QAC7B,IAAI,WAAgC,CAAC;QACrC,IAAI,YAAiC,CAAC;QACtC,IAAI,aAAsD,CAAC;QAC3D,IAAI,UAAgC,CAAC;QACrC,IAAI,QAAqC,CAAC;QAC1C,IAAI,QAAqC,CAAC;QAC1C,IAAI,gBAAgF,CAAC;QACrF,IAAI,SAA4D,CAAC;QAEjE,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;QAE1D,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE;YACxF,MAAM,YAAY,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAA2B,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,wBAAwB,CAAC,MAAM,CAAuB,CAAC;YAC/J,uBAAuB;YACvB,IAAI,YAAY,EAAE;gBAChB,GAAG,GAAG,YAAY,CAAC,OAAO,CAAC;gBAC3B,GAAG,GAAG,YAAY,CAAC,OAAO,CAAC;gBAC3B,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC;gBACzB,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC;gBACzB,SAAS,GAAG,CAAC,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,kBAAkB,CAAC;gBAC5E,gBAAgB,GAAG,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC;gBACpE,WAAW,GAAG,YAAY,CAAC,WAAW,CAAC;gBACvC,YAAY,GAAG,YAAY,CAAC,YAAY,CAAC;gBACzC,aAAa,GAAG,YAAY,CAAC,aAAa,CAAC;gBAE3C,QAAQ,GAAG,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,CAAC,oBAAC,IAAI,IAAC,QAAQ,EAAE,YAAY,CAAC,WAAW,GAAI,CAAC,CAAC,CAAC,SAAS,CAAC;gBAC/H,QAAQ,GAAG,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,CAAC,oBAAC,IAAI,IAAC,QAAQ,EAAE,YAAY,CAAC,WAAW,GAAI,CAAC,CAAC,CAAC,SAAS,CAAC;gBAE/H,IAAI,YAAY,CAAC,SAAS,EAAE;oBAC1B,MAAM,KAAK,GAAG,YAAY,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;oBAC1E,IAAI,KAAK,EAAE;wBACT,UAAU,GAAG,EAAE,CAAC;wBAChB,MAAM,SAAS,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,KAAK,CAAC;wBACtC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,KAAK,EAAE,CAAC,EAAE,EAAE;4BAC/B,MAAM,KAAK,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC,GAAG,GAAG,CAAC;4BACpC,IAAI,YAAY,CAAC,cAAc,EAAE;gCAC/B,MAAM,KAAK,GAAG,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;gCACjH,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;6BACxB;iCAAM;gCACL,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;6BACrB;yBACF;qBACF;yBAAM,IAAI,YAAY,CAAC,aAAa,EAAE;wBACrC,UAAU,GAAG,YAAY,CAAC,aAAa,EAAE,CAAC,GAAG,CAAC,CAAC,GAAW,EAAE,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC;qBAChK;iBACF;aACF;SACF;QAED,uBAAuB;QACvB,IAAI,IAAI,CAAC,UAAU;YACjB,IAAI,CAAC,QAAQ,CAAC;gBACZ,KAAK,EAAE,YAAY,EAAE,UAAU;gBAC/B,IAAI;gBACJ,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,gBAAgB;gBAChC,WAAW,EAAE,YAAY,EAAE,aAAa;gBACxC,QAAQ;gBACR,QAAQ;gBACR,UAAU;gBACV,SAAS;aACV,CAAC,CAAC;IACP,CAAC;IA4CD,gBAAgB;IACA,MAAM;QACpB,MAAM,SAAS,GAAG,UAAU,CAAC,wBAAwB,EAAE,0BAA0B,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QACzG,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;QACxD,MAAM,KAAK,GAAwB;YACjC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK;YACnB,QAAQ,EAAE,GAAG,OAAO,IAAI;SACzB,CAAC;QAEF,MAAM,YAAY,GAAG,CACnB,oBAAC,MAAM,IACL,SAAS,EAAC,iCAAiC,EAC3C,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAC1B,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAC7C,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAC/B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,QAAQ,EAAE,IAAI,CAAC,aAAa,GAC5B,CACH,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,WAAW;YAC9C,oBAAC,WAAW,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1F,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,WAAW,EAAC,qBAAqB;gBAChE,oBAAC,YAAY;oBACV,YAAY;oBACb,oBAAC,oBAAoB,IAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,IAAI,CAAC,aAAa,GAAI,CAC/D,CACH,CACV,CACP,CAAC;IACJ,CAAC;CACF;AAED;;;GAGG;AACH,MAAM,OAAO,oBAAqB,SAAQ,kBAAkB;IAC1D,IAAW,SAAS;QAClB,OAAO,oBAAC,YAAY,OAAG,CAAC;IAC1B,CAAC;CACF;AAED,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,MAAM,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;AACjH,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;AAC9G,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;AAChH,qBAAqB,CAAC,cAAc,CAAC,iBAAiB,CAAC,MAAM,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module PropertyEditors\r\n */\r\n\r\nimport \"./SliderEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  PropertyEditorParams, PropertyEditorParamTypes, PropertyValue, PropertyValueFormat, SliderEditorParams, StandardEditorNames, StandardTypeNames,\r\n} from \"@itwin/appui-abstract\";\r\nimport { Icon } from \"@itwin/core-react\";\r\nimport { Slider, TooltipProps } from \"@itwin/itwinui-react\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\nimport { PopupButton, PopupContent, PopupOkCancelButtons } from \"./PopupButton\";\r\n\r\n/** @internal */\r\ninterface SliderEditorState {\r\n  value: number;\r\n  isDisabled?: boolean;\r\n  min: number;\r\n  max: number;\r\n  size?: number;\r\n  step?: number;\r\n  showTooltip?: boolean;\r\n  tooltipBelow?: boolean;\r\n  formatTooltip?: (value: number) => string;\r\n  thumbMode?: \"allow-crossing\" | \"inhibit-crossing\";\r\n  trackDisplayMode?: \"auto\" | \"none\" | \"odd-segments\" | \"even-segments\";\r\n  minLabel?: React.ReactNode;\r\n  maxLabel?: React.ReactNode;\r\n  tickLabels?: React.ReactNode;\r\n}\r\n\r\n/** SliderEditor React component that is a property editor with numeric input & up/down buttons\r\n * @public\r\n */\r\nexport class SliderEditor extends React.PureComponent<PropertyEditorProps, SliderEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _enterKey = false;\r\n  private _divElement = React.createRef<HTMLDivElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<SliderEditorState> = {\r\n    value: 0,\r\n    min: 0,\r\n    max: 100,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = {\r\n        valueFormat: PropertyValueFormat.Primitive,\r\n        value: this.state.value,\r\n        displayValue: \"\",\r\n      };\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._divElement.current;\r\n  }\r\n\r\n  public get hasFocus(): boolean {\r\n    let containsFocus = false;\r\n    // istanbul ignore else\r\n    if (this.htmlElement)\r\n      containsFocus = this.htmlElement.contains(document.activeElement);\r\n    return containsFocus;\r\n  }\r\n\r\n  private _handleChange = (values: readonly number[]): void => {\r\n    const newValue = values[0];\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        value: newValue,\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private internalFormatTooltip = (value: number, step = 1) => {\r\n    if (Number.isInteger(step))\r\n      return value.toFixed(0);\r\n\r\n    const stepString = step.toString();\r\n    const decimalIndex = stepString.indexOf(\".\");\r\n    const numDecimals = step.toString().length - (decimalIndex + 1);\r\n    return value.toFixed(numDecimals);\r\n  };\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = 0;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      initialValue = record.value.value as number;\r\n    }\r\n\r\n    let size: number | undefined;\r\n    let min = 0;\r\n    let max = 100;\r\n    let step: number | undefined;\r\n    let showTooltip: boolean | undefined;\r\n    let tooltipBelow: boolean | undefined;\r\n    let formatTooltip: ((value: number) => string) | undefined;\r\n    let tickLabels: string[] | undefined;\r\n    let minLabel: React.ReactNode | undefined;\r\n    let maxLabel: React.ReactNode | undefined;\r\n    let trackDisplayMode: \"auto\" | \"none\" | \"odd-segments\" | \"even-segments\" | undefined;\r\n    let thumbMode: \"allow-crossing\" | \"inhibit-crossing\" | undefined;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const sliderParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.Slider) as SliderEditorParams;\r\n      // istanbul ignore else\r\n      if (sliderParams) {\r\n        min = sliderParams.minimum;\r\n        max = sliderParams.maximum;\r\n        size = sliderParams.size;\r\n        step = sliderParams.step;\r\n        thumbMode = 1 === sliderParams.mode ? \"allow-crossing\" : \"inhibit-crossing\";\r\n        trackDisplayMode = !sliderParams.reversed ? \"auto\" : \"odd-segments\";\r\n        showTooltip = sliderParams.showTooltip;\r\n        tooltipBelow = sliderParams.tooltipBelow;\r\n        formatTooltip = sliderParams.formatTooltip;\r\n\r\n        minLabel = !sliderParams.showMinMax ? \"\" : sliderParams.minIconSpec ? <Icon iconSpec={sliderParams.minIconSpec} /> : undefined;\r\n        maxLabel = !sliderParams.showMinMax ? \"\" : sliderParams.maxIconSpec ? <Icon iconSpec={sliderParams.maxIconSpec} /> : undefined;\r\n\r\n        if (sliderParams.showTicks) {\r\n          const count = sliderParams.getTickCount ? sliderParams.getTickCount() : 0;\r\n          if (count) {\r\n            tickLabels = [];\r\n            const increment = (max - min) / count;\r\n            for (let i = 0; i <= count; i++) {\r\n              const value = (i * increment) + min;\r\n              if (sliderParams.showTickLabels) {\r\n                const label = sliderParams.formatTick ? sliderParams.formatTick(value) : this.internalFormatTooltip(value, step);\r\n                tickLabels.push(label);\r\n              } else {\r\n                tickLabels.push(\"\");\r\n              }\r\n            }\r\n          } else if (sliderParams.getTickValues) {\r\n            tickLabels = sliderParams.getTickValues().map((val: number) => sliderParams.formatTick ? sliderParams.formatTick(val) : this.internalFormatTooltip(val, step));\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        value: initialValue, isDisabled,\r\n        size,\r\n        min, max, step, trackDisplayMode,\r\n        showTooltip, tooltipBelow, formatTooltip,\r\n        minLabel,\r\n        maxLabel,\r\n        tickLabels,\r\n        thumbMode,\r\n      });\r\n  }\r\n\r\n  private _handleEnter = async (): Promise<void> => {\r\n    this._enterKey = true;\r\n    await this._handleCommit();\r\n  };\r\n\r\n  private _handleClose = async (): Promise<void> => {\r\n    if (this._enterKey) {\r\n      this._enterKey = false;\r\n    } else {\r\n      // istanbul ignore else\r\n      if (this.props.onCancel)\r\n        this.props.onCancel();\r\n    }\r\n  };\r\n\r\n  private _handleOk = async (_event: React.MouseEvent): Promise<void> => {\r\n    await this._handleCommit();\r\n  };\r\n\r\n  private _handleCancel = (_event: React.MouseEvent): void => {\r\n    // istanbul ignore else\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel();\r\n    }\r\n  };\r\n\r\n  private _handleCommit = async (): Promise<void> => {\r\n    // istanbul ignore else\r\n    if (this.props.propertyRecord && this.props.onCommit) {\r\n      const propertyValue = await this.getPropertyValue();\r\n      // istanbul ignore else\r\n      if (propertyValue !== undefined) {\r\n        this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n      }\r\n    }\r\n  };\r\n\r\n  private tooltipProps = (_index: number, val: number) => {\r\n    const content = this.state.formatTooltip ? this.state.formatTooltip(val) : this.internalFormatTooltip(val, this.state.step);\r\n    return { placement: this.state.tooltipBelow ? \"bottom\" : \"top\", content, visible: this.state.showTooltip } as Partial<Omit<TooltipProps, \"children\">>;\r\n  };\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-slider-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 100;\r\n    const style: React.CSSProperties = {\r\n      ...this.props.style,\r\n      minWidth: `${minSize}px`,\r\n    };\r\n\r\n    const popupContent = (\r\n      <Slider\r\n        className=\"components-slider-editor-slider\"\r\n        style={style}\r\n        values={[this.state.value]}\r\n        min={this.state.min}\r\n        max={this.state.max}\r\n        step={this.state.step}\r\n        thumbMode={this.state.thumbMode}\r\n        trackDisplayMode={this.state.trackDisplayMode}\r\n        disabled={this.state.isDisabled}\r\n        minLabel={this.state.minLabel}\r\n        maxLabel={this.state.maxLabel}\r\n        tooltipProps={this.tooltipProps}\r\n        tickLabels={this.state.tickLabels}\r\n        onChange={this._handleChange}\r\n      />\r\n    );\r\n\r\n    return (\r\n      <div className={className} ref={this._divElement}>\r\n        <PopupButton label={this.state.value} onClose={this._handleClose} onEnter={this._handleEnter}\r\n          setFocus={this.props.setFocus} focusTarget=\".core-slider-handle\">\r\n          <PopupContent>\r\n            {popupContent}\r\n            <PopupOkCancelButtons onOk={this._handleOk} onCancel={this._handleCancel} />\r\n          </PopupContent>\r\n        </PopupButton>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\n/** Slider Property Editor registered for the \"number\" type name and \"slider\" editor name.\r\n * It uses the [[SliderEditor]] React component.\r\n * @public\r\n */\r\nexport class SliderPropertyEditor extends PropertyEditorBase {\r\n  public get reactNode(): React.ReactNode {\r\n    return <SliderEditor />;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Number, SliderPropertyEditor, StandardEditorNames.Slider);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Int, SliderPropertyEditor, StandardEditorNames.Slider);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Float, SliderPropertyEditor, StandardEditorNames.Slider);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Double, SliderPropertyEditor, StandardEditorNames.Slider);\r\n"]}

package/lib/esm/components-react/editors/SliderEditor.scss

@@ -1,14 +1,14 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/style/variables";
-
-.components-slider-editor {
-  min-width: 100%;
-}
-
-.components-slider-editor-slider {
-  min-width: 100px;
-  min-height: $uicore-component-height-small;
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/style/variables";
+
+.components-slider-editor {
+  min-width: 100%;
+}
+
+.components-slider-editor-slider {
+  min-width: 100px;
+  min-height: $uicore-component-height-small;
 }