@itwin/imodel-components-react 4.0.0-dev.8 → 4.0.0

package/lib/esm/imodel-components-react/quantityformat/misc/FractionPrecision.js

@@ -1,32 +1,32 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module QuantityFormat
- */
-import * as React from "react";
-import { UiIModelComponents } from "../../UiIModelComponents";
-import { Select } from "@itwin/itwinui-react";
-/** Component use to set Fraction precision
- * @internal
- */
-export function FractionPrecisionSelector(props) {
-    const { precision, onChange, ...otherProps } = props;
-    const options = React.useRef([
-        { value: 1, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.whole") },
-        { value: 2, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.half") },
-        { value: 4, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.quarter") },
-        { value: 8, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.eighth") },
-        { value: 16, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.sixteenth") },
-        { value: 32, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over32") },
-        { value: 64, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over64") },
-        { value: 128, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over128") },
-        { value: 256, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over256") },
-    ]);
-    const handleOnChange = React.useCallback((newValue) => {
-        onChange && onChange(newValue);
-    }, [onChange]);
-    return (React.createElement(Select, { options: options.current, value: precision, onChange: handleOnChange, size: "small", ...otherProps }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+import * as React from "react";
+import { UiIModelComponents } from "../../UiIModelComponents";
+import { Select } from "@itwin/itwinui-react";
+/** Component use to set Fraction precision
+ * @internal
+ */
+export function FractionPrecisionSelector(props) {
+    const { precision, onChange, ...otherProps } = props;
+    const options = React.useRef([
+        { value: 1, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.whole") },
+        { value: 2, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.half") },
+        { value: 4, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.quarter") },
+        { value: 8, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.eighth") },
+        { value: 16, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.sixteenth") },
+        { value: 32, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over32") },
+        { value: 64, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over64") },
+        { value: 128, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over128") },
+        { value: 256, label: UiIModelComponents.translate("QuantityFormat.fraction_precision.over256") },
+    ]);
+    const handleOnChange = React.useCallback((newValue) => {
+        onChange && onChange(newValue);
+    }, [onChange]);
+    return (React.createElement(Select, { options: options.current, value: precision, onChange: handleOnChange, size: "small", ...otherProps }));
+}
 //# sourceMappingURL=FractionPrecision.js.map

package/lib/esm/imodel-components-react/quantityformat/misc/ScientificType.d.ts

@@ -1,19 +1,19 @@
-/** @packageDocumentation
- * @module QuantityFormat
- */
-/// <reference types="react" />
-import { CommonProps } from "@itwin/core-react";
-import { ScientificType } from "@itwin/core-quantity";
-/** Properties of [[ScientificTypeSelector]] component.
- * @internal
- */
-export interface ScientificTypeSelectorProps extends CommonProps {
-    type: ScientificType;
-    onChange: (value: ScientificType) => void;
-    disabled?: boolean;
-}
-/** Component use to set Scientific type.
- * @internal
- */
-export declare function ScientificTypeSelector(props: ScientificTypeSelectorProps): JSX.Element;
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
+import { ScientificType } from "@itwin/core-quantity";
+/** Properties of [[ScientificTypeSelector]] component.
+ * @internal
+ */
+export interface ScientificTypeSelectorProps extends CommonProps {
+    type: ScientificType;
+    onChange: (value: ScientificType) => void;
+    disabled?: boolean;
+}
+/** Component use to set Scientific type.
+ * @internal
+ */
+export declare function ScientificTypeSelector(props: ScientificTypeSelectorProps): JSX.Element;
 //# sourceMappingURL=ScientificType.d.ts.map

package/lib/esm/imodel-components-react/quantityformat/misc/ScientificType.js

@@ -1,26 +1,26 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module QuantityFormat
- */
-import * as React from "react";
-import { UiIModelComponents } from "../../UiIModelComponents";
-import { ScientificType } from "@itwin/core-quantity";
-import { Select } from "@itwin/itwinui-react";
-/** Component use to set Scientific type.
- * @internal
- */
-export function ScientificTypeSelector(props) {
-    const { type, onChange, ...otherProps } = props;
-    const formatOptions = React.useRef([
-        { value: ScientificType.Normalized, label: UiIModelComponents.translate("QuantityFormat.scientific-type.normalized") },
-        { value: ScientificType.ZeroNormalized, label: UiIModelComponents.translate("QuantityFormat.scientific-type.zero-normalized") },
-    ]);
-    const handleOnChange = React.useCallback((newValue) => {
-        onChange && onChange(newValue);
-    }, [onChange]);
-    return (React.createElement(Select, { options: formatOptions.current, value: type, onChange: handleOnChange, size: "small", ...otherProps }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+import * as React from "react";
+import { UiIModelComponents } from "../../UiIModelComponents";
+import { ScientificType } from "@itwin/core-quantity";
+import { Select } from "@itwin/itwinui-react";
+/** Component use to set Scientific type.
+ * @internal
+ */
+export function ScientificTypeSelector(props) {
+    const { type, onChange, ...otherProps } = props;
+    const formatOptions = React.useRef([
+        { value: ScientificType.Normalized, label: UiIModelComponents.translate("QuantityFormat.scientific-type.normalized") },
+        { value: ScientificType.ZeroNormalized, label: UiIModelComponents.translate("QuantityFormat.scientific-type.zero-normalized") },
+    ]);
+    const handleOnChange = React.useCallback((newValue) => {
+        onChange && onChange(newValue);
+    }, [onChange]);
+    return (React.createElement(Select, { options: formatOptions.current, value: type, onChange: handleOnChange, size: "small", ...otherProps }));
+}
 //# sourceMappingURL=ScientificType.js.map

package/lib/esm/imodel-components-react/quantityformat/misc/SignOption.d.ts

@@ -1,18 +1,18 @@
-/** @packageDocumentation
- * @module QuantityFormat
- */
-/// <reference types="react" />
-import { CommonProps } from "@itwin/core-react";
-import { ShowSignOption } from "@itwin/core-quantity";
-/** Properties of [[SignOptionSelector]] component.
- * @internal
- */
-export interface SignOptionSelectorProps extends CommonProps {
-    signOption: ShowSignOption;
-    onChange: (value: ShowSignOption) => void;
-}
-/** Component use to set Sign option.
- * @internal
- */
-export declare function SignOptionSelector(props: SignOptionSelectorProps): JSX.Element;
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
+import { ShowSignOption } from "@itwin/core-quantity";
+/** Properties of [[SignOptionSelector]] component.
+ * @internal
+ */
+export interface SignOptionSelectorProps extends CommonProps {
+    signOption: ShowSignOption;
+    onChange: (value: ShowSignOption) => void;
+}
+/** Component use to set Sign option.
+ * @internal
+ */
+export declare function SignOptionSelector(props: SignOptionSelectorProps): JSX.Element;
 //# sourceMappingURL=SignOption.d.ts.map

package/lib/esm/imodel-components-react/quantityformat/misc/SignOption.js

@@ -1,28 +1,28 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module QuantityFormat
- */
-import * as React from "react";
-import { UiIModelComponents } from "../../UiIModelComponents";
-import { ShowSignOption } from "@itwin/core-quantity";
-import { Select } from "@itwin/itwinui-react";
-/** Component use to set Sign option.
- * @internal
- */
-export function SignOptionSelector(props) {
-    const { signOption, onChange, ...otherProps } = props;
-    const options = React.useRef([
-        { value: ShowSignOption.NoSign, label: UiIModelComponents.translate("QuantityFormat.sign_option.noSign") },
-        { value: ShowSignOption.OnlyNegative, label: UiIModelComponents.translate("QuantityFormat.sign_option.onlyNegative") },
-        { value: ShowSignOption.SignAlways, label: UiIModelComponents.translate("QuantityFormat.sign_option.signAlways") },
-        { value: ShowSignOption.NegativeParentheses, label: UiIModelComponents.translate("QuantityFormat.sign_option.negativeParentheses") },
-    ]);
-    const handleOnChange = React.useCallback((newValue) => {
-        onChange && onChange(newValue);
-    }, [onChange]);
-    return (React.createElement(Select, { options: options.current, value: signOption, onChange: handleOnChange, size: "small", ...otherProps }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+import * as React from "react";
+import { UiIModelComponents } from "../../UiIModelComponents";
+import { ShowSignOption } from "@itwin/core-quantity";
+import { Select } from "@itwin/itwinui-react";
+/** Component use to set Sign option.
+ * @internal
+ */
+export function SignOptionSelector(props) {
+    const { signOption, onChange, ...otherProps } = props;
+    const options = React.useRef([
+        { value: ShowSignOption.NoSign, label: UiIModelComponents.translate("QuantityFormat.sign_option.noSign") },
+        { value: ShowSignOption.OnlyNegative, label: UiIModelComponents.translate("QuantityFormat.sign_option.onlyNegative") },
+        { value: ShowSignOption.SignAlways, label: UiIModelComponents.translate("QuantityFormat.sign_option.signAlways") },
+        { value: ShowSignOption.NegativeParentheses, label: UiIModelComponents.translate("QuantityFormat.sign_option.negativeParentheses") },
+    ]);
+    const handleOnChange = React.useCallback((newValue) => {
+        onChange && onChange(newValue);
+    }, [onChange]);
+    return (React.createElement(Select, { options: options.current, value: signOption, onChange: handleOnChange, size: "small", ...otherProps }));
+}
 //# sourceMappingURL=SignOption.js.map

package/lib/esm/imodel-components-react/quantityformat/misc/StationSeparatorSelector.d.ts

@@ -1,18 +1,18 @@
-/** @packageDocumentation
- * @module QuantityFormat
- */
-/// <reference types="react" />
-import { CommonProps } from "@itwin/core-react";
-/** Properties of [[StationSeparatorSelector]] component.
- * @internal
- */
-export interface StationSeparatorSelectorProps extends CommonProps {
-    separator: string;
-    disabled: boolean;
-    onChange: (value: string) => void;
-}
-/** Component use to setStation separator.
- * @internal
- */
-export declare function StationSeparatorSelector(props: StationSeparatorSelectorProps): JSX.Element;
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
+/** Properties of [[StationSeparatorSelector]] component.
+ * @internal
+ */
+export interface StationSeparatorSelectorProps extends CommonProps {
+    separator: string;
+    disabled: boolean;
+    onChange: (value: string) => void;
+}
+/** Component use to setStation separator.
+ * @internal
+ */
+export declare function StationSeparatorSelector(props: StationSeparatorSelectorProps): JSX.Element;
 //# sourceMappingURL=StationSeparatorSelector.d.ts.map

package/lib/esm/imodel-components-react/quantityformat/misc/StationSeparatorSelector.js

@@ -1,36 +1,36 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module QuantityFormat
- */
-import * as React from "react";
-import { UiIModelComponents } from "../../UiIModelComponents";
-import { Select } from "@itwin/itwinui-react";
-/** Component use to setStation separator.
- * @internal
- */
-export function StationSeparatorSelector(props) {
-    const { separator, disabled, onChange, ...otherProps } = props;
-    const uomDefaultEntries = React.useRef([
-        { value: "+", label: UiIModelComponents.translate("QuantityFormat.station_separator.plus") },
-        { value: "-", label: UiIModelComponents.translate("QuantityFormat.station_separator.minus") },
-        { value: " ", label: UiIModelComponents.translate("QuantityFormat.station_separator.blank") },
-        { value: "^", label: UiIModelComponents.translate("QuantityFormat.station_separator.caret") },
-    ]);
-    const handleOnChange = React.useCallback((newValue) => {
-        onChange && onChange(newValue);
-    }, [onChange]);
-    const separatorOptions = React.useMemo(() => {
-        const completeListOfEntries = [];
-        // istanbul ignore next (only used if format already has a character that does not match standard options)
-        if (undefined === uomDefaultEntries.current.find((option) => option.value === separator)) {
-            completeListOfEntries.push({ value: separator, label: separator });
-        }
-        completeListOfEntries.push(...uomDefaultEntries.current);
-        return completeListOfEntries;
-    }, [separator]);
-    return (React.createElement(Select, { options: separatorOptions, disabled: disabled, value: separator, onChange: handleOnChange, size: "small", ...otherProps }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+import * as React from "react";
+import { UiIModelComponents } from "../../UiIModelComponents";
+import { Select } from "@itwin/itwinui-react";
+/** Component use to setStation separator.
+ * @internal
+ */
+export function StationSeparatorSelector(props) {
+    const { separator, disabled, onChange, ...otherProps } = props;
+    const uomDefaultEntries = React.useRef([
+        { value: "+", label: UiIModelComponents.translate("QuantityFormat.station_separator.plus") },
+        { value: "-", label: UiIModelComponents.translate("QuantityFormat.station_separator.minus") },
+        { value: " ", label: UiIModelComponents.translate("QuantityFormat.station_separator.blank") },
+        { value: "^", label: UiIModelComponents.translate("QuantityFormat.station_separator.caret") },
+    ]);
+    const handleOnChange = React.useCallback((newValue) => {
+        onChange && onChange(newValue);
+    }, [onChange]);
+    const separatorOptions = React.useMemo(() => {
+        const completeListOfEntries = [];
+        // istanbul ignore next (only used if format already has a character that does not match standard options)
+        if (undefined === uomDefaultEntries.current.find((option) => option.value === separator)) {
+            completeListOfEntries.push({ value: separator, label: separator });
+        }
+        completeListOfEntries.push(...uomDefaultEntries.current);
+        return completeListOfEntries;
+    }, [separator]);
+    return (React.createElement(Select, { options: separatorOptions, disabled: disabled, value: separator, onChange: handleOnChange, size: "small", ...otherProps }));
+}
 //# sourceMappingURL=StationSeparatorSelector.js.map

package/lib/esm/imodel-components-react/quantityformat/misc/StationSizeSelector.d.ts

@@ -1,18 +1,18 @@
-/** @packageDocumentation
- * @module QuantityFormat
- */
-/// <reference types="react" />
-import { CommonProps } from "@itwin/core-react";
-/** Properties of [[StationSizeSelector]] component.
- * @internal
- */
-export interface StationSizeSelectorProps extends CommonProps {
-    value: number;
-    disabled: boolean;
-    onChange: (value: number) => void;
-}
-/** Component use to set Station size (number of digits from right until '+').
- * @internal
- */
-export declare function StationSizeSelector(props: StationSizeSelectorProps): JSX.Element;
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
+/** Properties of [[StationSizeSelector]] component.
+ * @internal
+ */
+export interface StationSizeSelectorProps extends CommonProps {
+    value: number;
+    disabled: boolean;
+    onChange: (value: number) => void;
+}
+/** Component use to set Station size (number of digits from right until '+').
+ * @internal
+ */
+export declare function StationSizeSelector(props: StationSizeSelectorProps): JSX.Element;
 //# sourceMappingURL=StationSizeSelector.d.ts.map

package/lib/esm/imodel-components-react/quantityformat/misc/StationSizeSelector.js

@@ -1,25 +1,25 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module QuantityFormat
- */
-import * as React from "react";
-import { UiIModelComponents } from "../../UiIModelComponents";
-import { Select } from "@itwin/itwinui-react";
-/** Component use to set Station size (number of digits from right until '+').
- * @internal
- */
-export function StationSizeSelector(props) {
-    const { value, disabled, onChange, ...otherProps } = props;
-    const separatorOptions = React.useRef([
-        { value: 2, label: UiIModelComponents.translate("QuantityFormat.station_size.two") },
-        { value: 3, label: UiIModelComponents.translate("QuantityFormat.station_size.three") },
-    ]);
-    const handleOnChange = React.useCallback((newValue) => {
-        onChange && onChange(newValue);
-    }, [onChange]);
-    return (React.createElement(Select, { options: separatorOptions.current, disabled: disabled, value: value, onChange: handleOnChange, size: "small", ...otherProps }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+import * as React from "react";
+import { UiIModelComponents } from "../../UiIModelComponents";
+import { Select } from "@itwin/itwinui-react";
+/** Component use to set Station size (number of digits from right until '+').
+ * @internal
+ */
+export function StationSizeSelector(props) {
+    const { value, disabled, onChange, ...otherProps } = props;
+    const separatorOptions = React.useRef([
+        { value: 2, label: UiIModelComponents.translate("QuantityFormat.station_size.two") },
+        { value: 3, label: UiIModelComponents.translate("QuantityFormat.station_size.three") },
+    ]);
+    const handleOnChange = React.useCallback((newValue) => {
+        onChange && onChange(newValue);
+    }, [onChange]);
+    return (React.createElement(Select, { options: separatorOptions.current, disabled: disabled, value: value, onChange: handleOnChange, size: "small", ...otherProps }));
+}
 //# sourceMappingURL=StationSizeSelector.js.map

package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSelector.d.ts

@@ -1,18 +1,18 @@
-/** @packageDocumentation
- * @module QuantityFormat
- */
-/// <reference types="react" />
-import { CommonProps } from "@itwin/core-react";
-/** Properties of [[ThousandsSelector]] component.
- * @internal
- */
-export interface ThousandsSelectorProps extends CommonProps {
-    separator: string;
-    disabled: boolean;
-    onChange: (value: string) => void;
-}
-/** Component use to set Quantity Format thousand group separator.
- * @internal
- */
-export declare function ThousandsSelector(props: ThousandsSelectorProps): JSX.Element;
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
+/** Properties of [[ThousandsSelector]] component.
+ * @internal
+ */
+export interface ThousandsSelectorProps extends CommonProps {
+    separator: string;
+    disabled: boolean;
+    onChange: (value: string) => void;
+}
+/** Component use to set Quantity Format thousand group separator.
+ * @internal
+ */
+export declare function ThousandsSelector(props: ThousandsSelectorProps): JSX.Element;
 //# sourceMappingURL=ThousandsSelector.d.ts.map

package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSelector.js

@@ -1,34 +1,34 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module QuantityFormat
- */
-import * as React from "react";
-import { UiIModelComponents } from "../../UiIModelComponents";
-import { Select } from "@itwin/itwinui-react";
-/** Component use to set Quantity Format thousand group separator.
- * @internal
- */
-export function ThousandsSelector(props) {
-    const { separator, disabled, onChange, ...otherProps } = props;
-    const uomDefaultEntries = React.useRef([
-        { value: ",", label: UiIModelComponents.translate("QuantityFormat.thousand_separator.comma") },
-        { value: ".", label: UiIModelComponents.translate("QuantityFormat.thousand_separator.point") },
-    ]);
-    const handleOnChange = React.useCallback((newValue) => {
-        onChange && onChange(newValue);
-    }, [onChange]);
-    const separatorOptions = React.useMemo(() => {
-        const completeListOfEntries = [];
-        // istanbul ignore next (only used if format already has a character that does not match standard options)
-        if (undefined === uomDefaultEntries.current.find((option) => option.value === separator)) {
-            completeListOfEntries.push({ value: separator, label: separator });
-        }
-        completeListOfEntries.push(...uomDefaultEntries.current);
-        return completeListOfEntries;
-    }, [separator]);
-    return (React.createElement(Select, { options: separatorOptions, disabled: disabled, value: separator, onChange: handleOnChange, size: "small", ...otherProps }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+import * as React from "react";
+import { UiIModelComponents } from "../../UiIModelComponents";
+import { Select } from "@itwin/itwinui-react";
+/** Component use to set Quantity Format thousand group separator.
+ * @internal
+ */
+export function ThousandsSelector(props) {
+    const { separator, disabled, onChange, ...otherProps } = props;
+    const uomDefaultEntries = React.useRef([
+        { value: ",", label: UiIModelComponents.translate("QuantityFormat.thousand_separator.comma") },
+        { value: ".", label: UiIModelComponents.translate("QuantityFormat.thousand_separator.point") },
+    ]);
+    const handleOnChange = React.useCallback((newValue) => {
+        onChange && onChange(newValue);
+    }, [onChange]);
+    const separatorOptions = React.useMemo(() => {
+        const completeListOfEntries = [];
+        // istanbul ignore next (only used if format already has a character that does not match standard options)
+        if (undefined === uomDefaultEntries.current.find((option) => option.value === separator)) {
+            completeListOfEntries.push({ value: separator, label: separator });
+        }
+        completeListOfEntries.push(...uomDefaultEntries.current);
+        return completeListOfEntries;
+    }, [separator]);
+    return (React.createElement(Select, { options: separatorOptions, disabled: disabled, value: separator, onChange: handleOnChange, size: "small", ...otherProps }));
+}
 //# sourceMappingURL=ThousandsSelector.js.map

package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSeparator.d.ts

@@ -1,18 +1,18 @@
-/** @packageDocumentation
- * @module QuantityFormat
- */
-/// <reference types="react" />
-import { CommonProps } from "@itwin/core-react";
-import { FormatProps } from "@itwin/core-quantity";
-/** Properties of [[ThousandsSeparator]] component.
- * @internal
- */
-export interface ThousandsSeparatorProps extends CommonProps {
-    formatProps: FormatProps;
-    onChange?: (format: FormatProps) => void;
-}
-/** Component use to set Quantity Format thousand group separator.
- * @internal
- */
-export declare function ThousandsSeparator(props: ThousandsSeparatorProps): JSX.Element;
+/** @packageDocumentation
+ * @module QuantityFormat
+ */
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
+import { FormatProps } from "@itwin/core-quantity";
+/** Properties of [[ThousandsSeparator]] component.
+ * @internal
+ */
+export interface ThousandsSeparatorProps extends CommonProps {
+    formatProps: FormatProps;
+    onChange?: (format: FormatProps) => void;
+}
+/** Component use to set Quantity Format thousand group separator.
+ * @internal
+ */
+export declare function ThousandsSeparator(props: ThousandsSeparatorProps): JSX.Element;
 //# sourceMappingURL=ThousandsSeparator.d.ts.map