@itwin/imodel-components-react 4.15.5 → 4.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -1
- package/lib/cjs/imodel-components-react/color/AlphaSlider.d.ts +0 -2
- package/lib/cjs/imodel-components-react/color/AlphaSlider.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/color/AlphaSlider.js +0 -2
- package/lib/cjs/imodel-components-react/color/AlphaSlider.js.map +1 -1
- package/lib/cjs/imodel-components-react/color/ColorPickerButton.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/color/ColorPickerButton.js +3 -1
- package/lib/cjs/imodel-components-react/color/ColorPickerButton.js.map +1 -1
- package/lib/cjs/imodel-components-react/color/ColorPickerPopup.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/color/ColorPickerPopup.js +3 -1
- package/lib/cjs/imodel-components-react/color/ColorPickerPopup.js.map +1 -1
- package/lib/cjs/imodel-components-react/editors/ColorEditor.d.ts +0 -4
- package/lib/cjs/imodel-components-react/editors/ColorEditor.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/editors/ColorEditor.js +0 -4
- package/lib/cjs/imodel-components-react/editors/ColorEditor.js.map +1 -1
- package/lib/cjs/imodel-components-react/editors/WeightEditor.d.ts +0 -5
- package/lib/cjs/imodel-components-react/editors/WeightEditor.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/editors/WeightEditor.js +0 -5
- package/lib/cjs/imodel-components-react/editors/WeightEditor.js.map +1 -1
- package/lib/cjs/imodel-components-react/inputs/QuantityInput.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/inputs/QuantityInput.js +4 -12
- package/lib/cjs/imodel-components-react/inputs/QuantityInput.js.map +1 -1
- package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.js +4 -12
- package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.js.map +1 -1
- package/lib/cjs/imodel-components-react/lineweight/Swatch.d.ts +0 -1
- package/lib/cjs/imodel-components-react/lineweight/Swatch.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/lineweight/Swatch.js +0 -1
- package/lib/cjs/imodel-components-react/lineweight/Swatch.js.map +1 -1
- package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.d.ts +0 -2
- package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.js +0 -2
- package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.js.map +1 -1
- package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.d.ts +0 -3
- package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.js +3 -7
- package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.js.map +1 -1
- package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts +1 -4
- package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.js +2 -5
- package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.js.map +1 -1
- package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.scss +8 -9
- package/lib/cjs/imodel-components-react/quantityformat/FormatSample.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/quantityformat/FormatSample.js +3 -1
- package/lib/cjs/imodel-components-react/quantityformat/FormatSample.js.map +1 -1
- package/lib/cjs/imodel-components-react/timeline/InlineEdit.d.ts +0 -1
- package/lib/cjs/imodel-components-react/timeline/InlineEdit.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/timeline/InlineEdit.js +0 -1
- package/lib/cjs/imodel-components-react/timeline/InlineEdit.js.map +1 -1
- package/lib/cjs/imodel-components-react/timeline/Scrubber.d.ts +2 -0
- package/lib/cjs/imodel-components-react/timeline/Scrubber.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/timeline/Scrubber.js +2 -2
- package/lib/cjs/imodel-components-react/timeline/Scrubber.js.map +1 -1
- package/lib/cjs/imodel-components-react/timeline/TimelineComponent.d.ts +3 -0
- package/lib/cjs/imodel-components-react/timeline/TimelineComponent.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/timeline/TimelineComponent.js +1 -1
- package/lib/cjs/imodel-components-react/timeline/TimelineComponent.js.map +1 -1
- package/lib/cjs/imodel-components-react/viewport/ViewportComponent.d.ts +1 -2
- package/lib/cjs/imodel-components-react/viewport/ViewportComponent.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/viewport/ViewportComponent.js +3 -7
- package/lib/cjs/imodel-components-react/viewport/ViewportComponent.js.map +1 -1
- package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.d.ts +1 -1
- package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.d.ts.map +1 -1
- package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.js +5 -5
- package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.js.map +1 -1
- package/lib/esm/imodel-components-react/color/AlphaSlider.d.ts +0 -2
- package/lib/esm/imodel-components-react/color/AlphaSlider.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/color/AlphaSlider.js +0 -2
- package/lib/esm/imodel-components-react/color/AlphaSlider.js.map +1 -1
- package/lib/esm/imodel-components-react/color/ColorPickerButton.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/color/ColorPickerButton.js +3 -1
- package/lib/esm/imodel-components-react/color/ColorPickerButton.js.map +1 -1
- package/lib/esm/imodel-components-react/color/ColorPickerPopup.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/color/ColorPickerPopup.js +3 -1
- package/lib/esm/imodel-components-react/color/ColorPickerPopup.js.map +1 -1
- package/lib/esm/imodel-components-react/editors/ColorEditor.d.ts +0 -4
- package/lib/esm/imodel-components-react/editors/ColorEditor.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/editors/ColorEditor.js +0 -4
- package/lib/esm/imodel-components-react/editors/ColorEditor.js.map +1 -1
- package/lib/esm/imodel-components-react/editors/WeightEditor.d.ts +0 -5
- package/lib/esm/imodel-components-react/editors/WeightEditor.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/editors/WeightEditor.js +0 -5
- package/lib/esm/imodel-components-react/editors/WeightEditor.js.map +1 -1
- package/lib/esm/imodel-components-react/inputs/QuantityInput.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/inputs/QuantityInput.js +4 -12
- package/lib/esm/imodel-components-react/inputs/QuantityInput.js.map +1 -1
- package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.js +4 -12
- package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.js.map +1 -1
- package/lib/esm/imodel-components-react/lineweight/Swatch.d.ts +0 -1
- package/lib/esm/imodel-components-react/lineweight/Swatch.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/lineweight/Swatch.js +0 -1
- package/lib/esm/imodel-components-react/lineweight/Swatch.js.map +1 -1
- package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.d.ts +0 -2
- package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.js +0 -2
- package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.js.map +1 -1
- package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.d.ts +0 -3
- package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.js +3 -7
- package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.js.map +1 -1
- package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts +1 -4
- package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.js +2 -5
- package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.js.map +1 -1
- package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.scss +8 -9
- package/lib/esm/imodel-components-react/quantityformat/FormatSample.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/quantityformat/FormatSample.js +3 -1
- package/lib/esm/imodel-components-react/quantityformat/FormatSample.js.map +1 -1
- package/lib/esm/imodel-components-react/timeline/InlineEdit.d.ts +0 -1
- package/lib/esm/imodel-components-react/timeline/InlineEdit.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/timeline/InlineEdit.js +0 -1
- package/lib/esm/imodel-components-react/timeline/InlineEdit.js.map +1 -1
- package/lib/esm/imodel-components-react/timeline/Scrubber.d.ts +2 -0
- package/lib/esm/imodel-components-react/timeline/Scrubber.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/timeline/Scrubber.js +2 -2
- package/lib/esm/imodel-components-react/timeline/Scrubber.js.map +1 -1
- package/lib/esm/imodel-components-react/timeline/TimelineComponent.d.ts +3 -0
- package/lib/esm/imodel-components-react/timeline/TimelineComponent.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/timeline/TimelineComponent.js +1 -1
- package/lib/esm/imodel-components-react/timeline/TimelineComponent.js.map +1 -1
- package/lib/esm/imodel-components-react/viewport/ViewportComponent.d.ts +1 -2
- package/lib/esm/imodel-components-react/viewport/ViewportComponent.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/viewport/ViewportComponent.js +3 -7
- package/lib/esm/imodel-components-react/viewport/ViewportComponent.js.map +1 -1
- package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.d.ts +1 -1
- package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.d.ts.map +1 -1
- package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.js +5 -5
- package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.js.map +1 -1
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,14 @@
|
|
|
1
1
|
# Change Log - @itwin/imodel-components-react
|
|
2
2
|
|
|
3
|
-
This log was last generated on Wed,
|
|
3
|
+
This log was last generated on Wed, 07 Aug 2024 12:38:32 GMT and should not be manually modified.
|
|
4
|
+
|
|
5
|
+
## 4.16.0
|
|
6
|
+
Wed, 07 Aug 2024 12:38:32 GMT
|
|
7
|
+
|
|
8
|
+
### Updates
|
|
9
|
+
|
|
10
|
+
- Fix mixed-decls Sass warnings.
|
|
11
|
+
- Added `trackContainerProps` property to `TimelineComponent`.
|
|
4
12
|
|
|
5
13
|
## 4.15.5
|
|
6
14
|
Wed, 24 Jul 2024 16:09:26 GMT
|
|
@@ -32,6 +40,11 @@ Fri, 28 Jun 2024 09:09:37 GMT
|
|
|
32
40
|
|
|
33
41
|
_Version update only_
|
|
34
42
|
|
|
43
|
+
## 4.14.2
|
|
44
|
+
Mon, 22 Jul 2024 21:23:09 GMT
|
|
45
|
+
|
|
46
|
+
_Version update only_
|
|
47
|
+
|
|
35
48
|
## 4.14.1
|
|
36
49
|
Tue, 11 Jun 2024 15:58:29 GMT
|
|
37
50
|
|
|
@@ -25,14 +25,12 @@ export declare class AlphaSlider extends React.PureComponent<AlphaSliderProps> {
|
|
|
25
25
|
/** @internal */
|
|
26
26
|
constructor(props: AlphaSliderProps);
|
|
27
27
|
private _calculateChange;
|
|
28
|
-
/** @internal */
|
|
29
28
|
componentWillUnmount(): void;
|
|
30
29
|
private _onChange;
|
|
31
30
|
private _onMouseDown;
|
|
32
31
|
private _onKeyDown;
|
|
33
32
|
private _onMouseUp;
|
|
34
33
|
private _unbindEventListeners;
|
|
35
|
-
/** @internal */
|
|
36
34
|
render(): React.ReactNode;
|
|
37
35
|
}
|
|
38
36
|
//# sourceMappingURL=AlphaSlider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlphaSlider.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/AlphaSlider.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD;;;GAGG;AACH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAE1C,WAAW;IACb,kFAAkF;IAClF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qDAAqD;IACrD,aAAa,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtD,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;GAGG;AAEH,qBAAa,WAAY,SAAQ,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC;IACpE,OAAO,CAAC,UAAU,CAA+B;IAEjD,gBAAgB;gBAEJ,KAAK,EAAE,gBAAgB;IAInC,OAAO,CAAC,gBAAgB,CAuDtB;
|
|
1
|
+
{"version":3,"file":"AlphaSlider.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/AlphaSlider.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD;;;GAGG;AACH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAE1C,WAAW;IACb,kFAAkF;IAClF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qDAAqD;IACrD,aAAa,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtD,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;GAGG;AAEH,qBAAa,WAAY,SAAQ,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC;IACpE,OAAO,CAAC,UAAU,CAA+B;IAEjD,gBAAgB;gBAEJ,KAAK,EAAE,gBAAgB;IAInC,OAAO,CAAC,gBAAgB,CAuDtB;IAEc,oBAAoB;IAIpC,OAAO,CAAC,SAAS,CAcf;IAEF,OAAO,CAAC,YAAY,CAKlB;IAEF,OAAO,CAAC,UAAU,CA6BhB;IAEF,OAAO,CAAC,UAAU,CAEhB;IAEF,OAAO,CAAC,qBAAqB;IAKb,MAAM,IAAI,KAAK,CAAC,SAAS;CA0C1C"}
|
|
@@ -159,7 +159,6 @@ class AlphaSlider extends React.PureComponent {
|
|
|
159
159
|
this._unbindEventListeners();
|
|
160
160
|
};
|
|
161
161
|
}
|
|
162
|
-
/** @internal */
|
|
163
162
|
componentWillUnmount() {
|
|
164
163
|
this._unbindEventListeners();
|
|
165
164
|
}
|
|
@@ -167,7 +166,6 @@ class AlphaSlider extends React.PureComponent {
|
|
|
167
166
|
window.removeEventListener("mousemove", this._onChange);
|
|
168
167
|
window.removeEventListener("mouseup", this._onMouseUp);
|
|
169
168
|
}
|
|
170
|
-
/** @internal */
|
|
171
169
|
render() {
|
|
172
170
|
const containerClasses = (0, classnames_1.default)(this.props.isHorizontal
|
|
173
171
|
? "components-alpha-container-horizontal"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlphaSlider.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/AlphaSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Color\n */\n\nimport \"./AlphaSlider.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\n\n/** Properties for the [[AlphaSlider]] React component\n * @public\n * @deprecated in 4.11.0. Props of deprecated component {@link AlphaSlider}.\n */\nexport interface AlphaSliderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n // eslint-disable-next-line deprecation/deprecation\n CommonProps {\n /** true if slider is oriented horizontal, else vertical orientation is assumed */\n isHorizontal?: boolean;\n /** function to run when user selects color swatch */\n onAlphaChange?: ((alpha: number) => void) | undefined;\n /** Alpha value between 0 (transparent) and 1 (opaque) */\n alpha: number;\n}\n\n/** AlphaSlider component used to set the alpha value.\n * @public\n * @deprecated in 4.11.0. Use {@link https://itwinui.bentley.com/docs/colorpicker iTwinUI color picker} instead.\n */\n// eslint-disable-next-line deprecation/deprecation\nexport class AlphaSlider extends React.PureComponent<AlphaSliderProps> {\n private _container: HTMLDivElement | null = null;\n\n /** @internal */\n // eslint-disable-next-line deprecation/deprecation\n constructor(props: AlphaSliderProps) {\n super(props);\n }\n\n private _calculateChange = (\n e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>,\n isHorizontal: boolean,\n alpha: number,\n container: HTMLDivElement\n ): number | undefined => {\n e.preventDefault();\n const { width: containerWidth, height: containerHeight } =\n container.getBoundingClientRect();\n\n let x = 0;\n if (\"pageX\" in e) {\n x = e.pageX;\n } else {\n if (undefined === e.touches) return undefined;\n x = e.touches[0].pageX;\n }\n if (undefined === x) return undefined;\n\n let y = 0;\n if (\"pageY\" in e) {\n y = e.pageY;\n } else {\n if (undefined === e.touches) return;\n y = e.touches[0].pageY;\n }\n if (undefined === y) return undefined;\n\n const left = x - (container.getBoundingClientRect().left + window.scrollX);\n const top = y - (container.getBoundingClientRect().top + window.scrollY);\n\n let t = 0;\n\n if (!isHorizontal) {\n if (top < 0) {\n t = 1;\n } else if (top > containerHeight) {\n t = 0;\n } else {\n t = 1 - top / containerHeight;\n }\n } else {\n // horizontal\n if (left < 0) {\n t = 0;\n } else if (left > containerWidth) {\n t = 1;\n } else {\n t = left / containerWidth;\n }\n }\n\n if (t < 0) t = 0;\n if (t > 1) t = 1;\n return alpha !== t ? t : undefined;\n };\n\n /** @internal */\n public override componentWillUnmount() {\n this._unbindEventListeners();\n }\n\n private _onChange = (\n e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>\n ) => {\n if (this._container && this.props.onAlphaChange) {\n const change = this._calculateChange(\n e,\n this.props.isHorizontal ? this.props.isHorizontal : false,\n this.props.alpha,\n this._container\n );\n undefined !== change &&\n typeof this.props.onAlphaChange === \"function\" &&\n this.props.onAlphaChange(change);\n }\n };\n\n private _onMouseDown = (e: React.MouseEvent<HTMLDivElement>) => {\n this._onChange(e);\n if (this._container) this._container.focus();\n window.addEventListener(\"mousemove\", this._onChange as any);\n window.addEventListener(\"mouseup\", this._onMouseUp);\n };\n\n private _onKeyDown = (evt: React.KeyboardEvent<HTMLDivElement>) => {\n let newTransparency: number | undefined;\n if (\n evt.key === Key.ArrowLeft.valueOf() ||\n evt.key === Key.ArrowDown.valueOf()\n ) {\n newTransparency = this.props.alpha - (evt.ctrlKey ? 0.1 : 0.05);\n } else if (\n evt.key === Key.ArrowRight.valueOf() ||\n evt.key === Key.ArrowUp.valueOf()\n ) {\n newTransparency = this.props.alpha + (evt.ctrlKey ? 0.1 : 0.05);\n } else if (evt.key === Key.PageDown.valueOf()) {\n newTransparency = this.props.alpha - (evt.ctrlKey ? 0.5 : 0.25);\n } else if (evt.key === Key.PageUp.valueOf()) {\n newTransparency = this.props.alpha + (evt.ctrlKey ? 0.5 : 0.25);\n } else if (evt.key === Key.Home.valueOf()) {\n newTransparency = 0;\n } else {\n if (evt.key === Key.End.valueOf()) {\n newTransparency = 1;\n }\n }\n\n if (undefined !== newTransparency) {\n if (newTransparency > 1) newTransparency = 1;\n if (newTransparency < 0) newTransparency = 0;\n if (this.props.onAlphaChange) this.props.onAlphaChange(newTransparency);\n }\n };\n\n private _onMouseUp = () => {\n this._unbindEventListeners();\n };\n\n private _unbindEventListeners() {\n window.removeEventListener(\"mousemove\", this._onChange as any);\n window.removeEventListener(\"mouseup\", this._onMouseUp);\n }\n\n /** @internal */\n public override render(): React.ReactNode {\n const containerClasses = classnames(\n this.props.isHorizontal\n ? \"components-alpha-container-horizontal\"\n : \"components-alpha-container-vertical\",\n this.props.className\n );\n\n const pointerStyle: React.CSSProperties = this.props.isHorizontal\n ? { left: `${this.props.alpha * 100}%` }\n : { left: `0px`, top: `${-(this.props.alpha * 100) + 100}%` };\n\n return (\n <div\n className={containerClasses}\n style={this.props.style}\n data-testid=\"alpha-container\"\n >\n <div\n data-testid=\"alpha-slider\"\n role=\"slider\"\n aria-label={UiIModelComponents.translate(\"color.transparency\")}\n aria-valuemin={0}\n aria-valuemax={1}\n aria-valuenow={this.props.alpha}\n className=\"components-alpha-slider\"\n ref={(container) => (this._container = container)}\n onMouseDown={this._onMouseDown}\n onTouchMove={this._onChange}\n onTouchStart={this._onChange}\n tabIndex={0}\n onKeyDown={this._onKeyDown}\n >\n <div\n style={pointerStyle}\n className=\"components-alpha-pointer\"\n data-testid=\"alpha-pointer\"\n />\n </div>\n </div>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"AlphaSlider.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/AlphaSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Color\n */\n\nimport \"./AlphaSlider.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { UiIModelComponents } from \"../UiIModelComponents\";\n\n/** Properties for the [[AlphaSlider]] React component\n * @public\n * @deprecated in 4.11.0. Props of deprecated component {@link AlphaSlider}.\n */\nexport interface AlphaSliderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n // eslint-disable-next-line deprecation/deprecation\n CommonProps {\n /** true if slider is oriented horizontal, else vertical orientation is assumed */\n isHorizontal?: boolean;\n /** function to run when user selects color swatch */\n onAlphaChange?: ((alpha: number) => void) | undefined;\n /** Alpha value between 0 (transparent) and 1 (opaque) */\n alpha: number;\n}\n\n/** AlphaSlider component used to set the alpha value.\n * @public\n * @deprecated in 4.11.0. Use {@link https://itwinui.bentley.com/docs/colorpicker iTwinUI color picker} instead.\n */\n// eslint-disable-next-line deprecation/deprecation\nexport class AlphaSlider extends React.PureComponent<AlphaSliderProps> {\n private _container: HTMLDivElement | null = null;\n\n /** @internal */\n // eslint-disable-next-line deprecation/deprecation\n constructor(props: AlphaSliderProps) {\n super(props);\n }\n\n private _calculateChange = (\n e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>,\n isHorizontal: boolean,\n alpha: number,\n container: HTMLDivElement\n ): number | undefined => {\n e.preventDefault();\n const { width: containerWidth, height: containerHeight } =\n container.getBoundingClientRect();\n\n let x = 0;\n if (\"pageX\" in e) {\n x = e.pageX;\n } else {\n if (undefined === e.touches) return undefined;\n x = e.touches[0].pageX;\n }\n if (undefined === x) return undefined;\n\n let y = 0;\n if (\"pageY\" in e) {\n y = e.pageY;\n } else {\n if (undefined === e.touches) return;\n y = e.touches[0].pageY;\n }\n if (undefined === y) return undefined;\n\n const left = x - (container.getBoundingClientRect().left + window.scrollX);\n const top = y - (container.getBoundingClientRect().top + window.scrollY);\n\n let t = 0;\n\n if (!isHorizontal) {\n if (top < 0) {\n t = 1;\n } else if (top > containerHeight) {\n t = 0;\n } else {\n t = 1 - top / containerHeight;\n }\n } else {\n // horizontal\n if (left < 0) {\n t = 0;\n } else if (left > containerWidth) {\n t = 1;\n } else {\n t = left / containerWidth;\n }\n }\n\n if (t < 0) t = 0;\n if (t > 1) t = 1;\n return alpha !== t ? t : undefined;\n };\n\n public override componentWillUnmount() {\n this._unbindEventListeners();\n }\n\n private _onChange = (\n e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>\n ) => {\n if (this._container && this.props.onAlphaChange) {\n const change = this._calculateChange(\n e,\n this.props.isHorizontal ? this.props.isHorizontal : false,\n this.props.alpha,\n this._container\n );\n undefined !== change &&\n typeof this.props.onAlphaChange === \"function\" &&\n this.props.onAlphaChange(change);\n }\n };\n\n private _onMouseDown = (e: React.MouseEvent<HTMLDivElement>) => {\n this._onChange(e);\n if (this._container) this._container.focus();\n window.addEventListener(\"mousemove\", this._onChange as any);\n window.addEventListener(\"mouseup\", this._onMouseUp);\n };\n\n private _onKeyDown = (evt: React.KeyboardEvent<HTMLDivElement>) => {\n let newTransparency: number | undefined;\n if (\n evt.key === Key.ArrowLeft.valueOf() ||\n evt.key === Key.ArrowDown.valueOf()\n ) {\n newTransparency = this.props.alpha - (evt.ctrlKey ? 0.1 : 0.05);\n } else if (\n evt.key === Key.ArrowRight.valueOf() ||\n evt.key === Key.ArrowUp.valueOf()\n ) {\n newTransparency = this.props.alpha + (evt.ctrlKey ? 0.1 : 0.05);\n } else if (evt.key === Key.PageDown.valueOf()) {\n newTransparency = this.props.alpha - (evt.ctrlKey ? 0.5 : 0.25);\n } else if (evt.key === Key.PageUp.valueOf()) {\n newTransparency = this.props.alpha + (evt.ctrlKey ? 0.5 : 0.25);\n } else if (evt.key === Key.Home.valueOf()) {\n newTransparency = 0;\n } else {\n if (evt.key === Key.End.valueOf()) {\n newTransparency = 1;\n }\n }\n\n if (undefined !== newTransparency) {\n if (newTransparency > 1) newTransparency = 1;\n if (newTransparency < 0) newTransparency = 0;\n if (this.props.onAlphaChange) this.props.onAlphaChange(newTransparency);\n }\n };\n\n private _onMouseUp = () => {\n this._unbindEventListeners();\n };\n\n private _unbindEventListeners() {\n window.removeEventListener(\"mousemove\", this._onChange as any);\n window.removeEventListener(\"mouseup\", this._onMouseUp);\n }\n\n public override render(): React.ReactNode {\n const containerClasses = classnames(\n this.props.isHorizontal\n ? \"components-alpha-container-horizontal\"\n : \"components-alpha-container-vertical\",\n this.props.className\n );\n\n const pointerStyle: React.CSSProperties = this.props.isHorizontal\n ? { left: `${this.props.alpha * 100}%` }\n : { left: `0px`, top: `${-(this.props.alpha * 100) + 100}%` };\n\n return (\n <div\n className={containerClasses}\n style={this.props.style}\n data-testid=\"alpha-container\"\n >\n <div\n data-testid=\"alpha-slider\"\n role=\"slider\"\n aria-label={UiIModelComponents.translate(\"color.transparency\")}\n aria-valuemin={0}\n aria-valuemax={1}\n aria-valuenow={this.props.alpha}\n className=\"components-alpha-slider\"\n ref={(container) => (this._container = container)}\n onMouseDown={this._onMouseDown}\n onTouchMove={this._onChange}\n onTouchStart={this._onChange}\n tabIndex={0}\n onKeyDown={this._onKeyDown}\n >\n <div\n style={pointerStyle}\n className=\"components-alpha-pointer\"\n data-testid=\"alpha-pointer\"\n />\n </div>\n </div>\n );\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorPickerButton.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,0BAA0B,CAAC;AAElC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AA+CrD;;;GAGG;AACH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAEnD,WAAW;IACb,mBAAmB;IACnB,YAAY,EAAE,QAAQ,CAAC;IACvB,uBAAuB;IACvB,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB,qDAAqD;IACrD,WAAW,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtD,2DAA2D;IAC3D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wBAAwB;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gEAAgE;IAChE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,gDAAgD;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;
|
|
1
|
+
{"version":3,"file":"ColorPickerButton.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,0BAA0B,CAAC;AAElC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AA+CrD;;;GAGG;AACH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAEnD,WAAW;IACb,mBAAmB;IACnB,YAAY,EAAE,QAAQ,CAAC;IACvB,uBAAuB;IACvB,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB,qDAAqD;IACrD,WAAW,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtD,2DAA2D;IAC3D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wBAAwB;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gEAAgE;IAChE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,gDAAgD;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAqID;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,CAE9B,KAAK,EAAE,gBAAgB,KACpB,KAAK,CAAC,SAAuC,CAAC"}
|
|
@@ -104,7 +104,9 @@ const ForwardRefColorPickerButton = React.forwardRef(function ForwardRefColorPic
|
|
|
104
104
|
React.createElement("button", { "data-testid": "components-colorpicker-button", "data-value": rgbaString, onClick: togglePopup, className: buttonClassNames, style: buttonStyle, disabled: disabled, ref: refs },
|
|
105
105
|
React.createElement("div", { className: "components-colorpicker-button-container" },
|
|
106
106
|
React.createElement("div", { className: "components-colorpicker-button-color-swatch", style: swatchStyle, "data-testid": showPopup ? "caret-up" : "caret-down" }),
|
|
107
|
-
showCaret && (
|
|
107
|
+
showCaret && (
|
|
108
|
+
// eslint-disable-next-line deprecation/deprecation
|
|
109
|
+
React.createElement(core_react_1.Icon, { className: "components-caret", iconSpec: showPopup ? React.createElement(itwinui_icons_react_1.SvgCaretUpSmall, null) : React.createElement(itwinui_icons_react_1.SvgCaretDownSmall, null) })))),
|
|
108
110
|
React.createElement(core_react_1.Popup, { className: "components-colorpicker-popup", isOpen: showPopup, position: appui_abstract_1.RelativePosition.BottomLeft, onClose: closePopup, target: target.current, closeOnNestedPopupOutsideClick: true },
|
|
109
111
|
React.createElement(ColorOptions, { handleColorPicked: handleColorPicked, options: colorOptions, numColumns: numColumns ?? 4, round: !!round, title: dropDownTitle }))));
|
|
110
112
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorPickerButton.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerButton.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEH,oCAAkC;AAClC,4DAAoC;AACpC,6CAA+B;AAC/B,oDAA2D;AAC3D,0DAAyD;AAEzD,kDAAyD;AACzD,qCAAuC;AACvC,6DAA0D;AAC1D,oEAAgF;AAEhF,4BAA4B;AAE5B,SAAS,YAAY,CAAC,EACpB,iBAAiB,EACjB,OAAO,EACP,UAAU,EACV,KAAK,EACL,KAAK,GAON;IACC,MAAM,cAAc,GAAwB;QAC1C,mBAAmB,EAAE,UAAU,UAAU,QAAQ;KAClD,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,wCAAwC;QACpD,KAAK,IAAI,gCAAK,KAAK,CAAM;QAC1B,4CACc,qCAAqC,EACjD,SAAS,EAAC,qCAAqC,EAC/C,KAAK,EAAE,cAAc,IAEpB,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC;QAC7B,mDAAmD;QACnD,oBAAC,oBAAW,IACV,SAAS,EAAC,+BAA+B,EACzC,GAAG,EAAE,KAAK,EACV,QAAQ,EAAE,KAAK,EACf,WAAW,EAAE,iBAAiB,EAC9B,KAAK,EAAE,KAAK,GACZ,CACH,CAAC,CACE,CACF,CACP,CAAC;AACJ,CAAC;AAgCD,sHAAsH;AACtH,MAAM,2BAA2B,GAAG,KAAK,CAAC,UAAU,CAIlD,SAAS,2BAA2B,CACpC,EACE,SAAS,EACT,SAAS,EACT,QAAQ,EACR,aAAa,EACb,YAAY,EACZ,UAAU,EACV,WAAW,EACX,QAAQ,EACR,KAAK,EACL,SAAS,EACT,KAAK,GACN,EACD,GAAG;IAEH,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAC;IACrD,MAAM,IAAI,GAAG,IAAA,oBAAO,EAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,uGAAuG;IAC1I,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;IAE7D,qEAAqE;IACrE,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,WAAW,CAAC,YAAY,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC;QACjC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,GAAG,CAAC;QAChC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,MAAM,CAAC;QACnC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,MAAM,CAAC;QACnC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,KAAK,CAAC;QAClC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,IAAI,CAAC;QACjC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,MAAM,CAAC;QACnC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,MAAM,CAAC;QACnC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,KAAK,CAAC;QAClC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,KAAK,CAAC;QAClC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,IAAI,CAAC;QACjC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,OAAO,CAAC;QACpC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,GAAG,CAAC;QAChC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,IAAI,CAAC;QACjC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,KAAK,CAAC;QAClC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,MAAM,CAAC;QACnC,sBAAQ,CAAC,MAAM,CAAC,yBAAW,CAAC,KAAK,CAAC;KACnC,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,YAAY,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CACzC,CAAC,KAAe,EAAE,EAAE;QAClB,UAAU,EAAE,CAAC;QAEb,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC5B,WAAW,CAAC,KAAK,CAAC,CAAC;YACnB,WAAW,IAAI,WAAW,CAAC,KAAK,CAAC,CAAC;QACpC,CAAC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,QAAQ,EAAE,WAAW,CAAC,CACpC,CAAC;IAEF,MAAM,UAAU,GAAG,IAAA,uCAAkB,EAAC,QAAQ,CAAC,CAAC;IAEhD,MAAM,WAAW,GAAG,EAAE,GAAG,KAAK,EAAyB,CAAC;IACxD,MAAM,WAAW,GAAG,EAAE,eAAe,EAAE,UAAU,EAAyB,CAAC;IAE3E,MAAM,gBAAgB,GAAG,IAAA,oBAAU,EACjC,+BAA+B,EAC/B,KAAK,IAAI,OAAO,EAChB,QAAQ,IAAI,UAAU,EACtB,SAAS,CACV,CAAC;IAEF,MAAM,YAAY,GAChB,SAAS,IAAI,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC;IACpE,OAAO,CACL;QACE,+CACc,+BAA+B,gBAC/B,UAAU,EACtB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,gBAAgB,EAC3B,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,IAAI;YAET,6BAAK,SAAS,EAAC,yCAAyC;gBACtD,6BACE,SAAS,EAAC,4CAA4C,EACtD,KAAK,EAAE,WAAW,iBACL,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,GAClD;gBACD,SAAS,IAAI,CACZ,oBAAC,iBAAI,IACH,SAAS,EAAC,kBAAkB,EAC5B,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,oBAAC,qCAAe,OAAG,CAAC,CAAC,CAAC,oBAAC,uCAAiB,OAAG,GACjE,CACH,CACG,CACC;QAET,oBAAC,kBAAK,IACJ,SAAS,EAAC,8BAA8B,EACxC,MAAM,EAAE,SAAS,EACjB,QAAQ,EAAE,iCAAgB,CAAC,UAAU,EACrC,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,MAAM,CAAC,OAAO,EACtB,8BAA8B;YAE9B,oBAAC,YAAY,IACX,iBAAiB,EAAE,iBAAiB,EACpC,OAAO,EAAE,YAAY,EACrB,UAAU,EAAE,UAAU,IAAI,CAAC,EAC3B,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,KAAK,EAAE,aAAa,GACpB,CACI,CACP,CACJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH;;;;GAIG;AACU,QAAA,iBAAiB,GAGP,2BAA2B,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 Color\n */\n\nimport \"./ColorPickerButton.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon, Popup, useRefs } from \"@itwin/core-react\";\nimport { ColorSwatch } from \"./Swatch\";\nimport { getCSSColorFromDef } from \"./getCSSColorFromDef\";\nimport { SvgCaretDownSmall, SvgCaretUpSmall } from \"@itwin/itwinui-icons-react\";\n\n// cSpell:ignore colorpicker\n\nfunction ColorOptions({\n handleColorPicked,\n options,\n numColumns,\n round,\n title,\n}: {\n handleColorPicked: (color: ColorDef) => void;\n options: ColorDef[];\n numColumns: number;\n round: boolean;\n title?: string;\n}) {\n const containerStyle: React.CSSProperties = {\n gridTemplateColumns: `repeat(${numColumns}, 1fr)`,\n };\n return (\n <div className=\"components-colorpicker-popup-container\">\n {title && <h4>{title}</h4>}\n <div\n data-testid=\"components-colorpicker-popup-colors\"\n className=\"components-colorpicker-popup-colors\"\n style={containerStyle}\n >\n {options.map((color, index) => (\n // eslint-disable-next-line deprecation/deprecation\n <ColorSwatch\n className=\"components-colorpicker-swatch\"\n key={index}\n colorDef={color}\n onColorPick={handleColorPicked}\n round={round}\n />\n ))}\n </div>\n </div>\n );\n}\n\n/** Properties for the [[ColorPickerButton]] React component\n * @beta\n * @deprecated in 4.11.0. Props of deprecated component {@link ColorPickerButton}.\n */\nexport interface ColorPickerProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n // eslint-disable-next-line deprecation/deprecation\n CommonProps {\n /** Active color */\n initialColor: ColorDef;\n /** Available colors */\n colorDefs?: ColorDef[];\n /** Function to run when user selects color swatch */\n onColorPick?: ((color: ColorDef) => void) | undefined;\n /** Show swatches as squares unless round is set to true */\n round?: boolean;\n /** Disabled or not */\n disabled?: boolean;\n /** Readonly or not */\n readonly?: boolean;\n /** Title to show at top of DropDown */\n dropDownTitle?: string;\n /** Number of columns */\n numColumns?: number;\n /** Provides ability to return reference to HTMLButtonElement */\n ref?: React.Ref<HTMLButtonElement>;\n /** If true show up/down caret next to color */\n showCaret?: boolean;\n}\n\n// Defined using following pattern (const ColorPickerButton at bottom) to ensure useful API documentation is extracted\nconst ForwardRefColorPickerButton = React.forwardRef<\n HTMLButtonElement,\n // eslint-disable-next-line deprecation/deprecation\n ColorPickerProps\n>(function ForwardRefColorPickerButton(\n {\n className,\n colorDefs,\n disabled,\n dropDownTitle,\n initialColor,\n numColumns,\n onColorPick,\n readonly,\n round,\n showCaret,\n style,\n },\n ref\n) {\n const target = React.useRef<HTMLButtonElement>(null);\n const refs = useRefs(target, ref); // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.\n const [showPopup, setShowPopup] = React.useState(false);\n const [colorDef, setColorDef] = React.useState(initialColor);\n\n // See if new initialColor props have changed since component mounted\n React.useEffect(() => {\n setColorDef(initialColor);\n }, [initialColor]);\n\n const defaultColors = React.useRef([\n ColorDef.create(ColorByName.red),\n ColorDef.create(ColorByName.orange),\n ColorDef.create(ColorByName.yellow),\n ColorDef.create(ColorByName.green),\n ColorDef.create(ColorByName.blue),\n ColorDef.create(ColorByName.indigo),\n ColorDef.create(ColorByName.violet),\n ColorDef.create(ColorByName.black),\n ColorDef.create(ColorByName.white),\n ColorDef.create(ColorByName.cyan),\n ColorDef.create(ColorByName.fuchsia),\n ColorDef.create(ColorByName.tan),\n ColorDef.create(ColorByName.gray),\n ColorDef.create(ColorByName.brown),\n ColorDef.create(ColorByName.purple),\n ColorDef.create(ColorByName.olive),\n ]);\n\n const closePopup = React.useCallback(() => {\n setShowPopup(false);\n }, []);\n\n const togglePopup = React.useCallback(() => {\n setShowPopup(!showPopup);\n }, [showPopup]);\n\n const handleColorPicked = React.useCallback(\n (color: ColorDef) => {\n closePopup();\n\n if (!color.equals(colorDef)) {\n setColorDef(color);\n onColorPick && onColorPick(color);\n }\n },\n [closePopup, colorDef, onColorPick]\n );\n\n const rgbaString = getCSSColorFromDef(colorDef);\n\n const buttonStyle = { ...style } as React.CSSProperties;\n const swatchStyle = { backgroundColor: rgbaString } as React.CSSProperties;\n\n const buttonClassNames = classnames(\n \"components-colorpicker-button\",\n round && \"round\",\n readonly && \"readonly\",\n className\n );\n\n const colorOptions =\n colorDefs && colorDefs.length ? colorDefs : defaultColors.current;\n return (\n <>\n <button\n data-testid=\"components-colorpicker-button\"\n data-value={rgbaString}\n onClick={togglePopup}\n className={buttonClassNames}\n style={buttonStyle}\n disabled={disabled}\n ref={refs}\n >\n <div className=\"components-colorpicker-button-container\">\n <div\n className=\"components-colorpicker-button-color-swatch\"\n style={swatchStyle}\n data-testid={showPopup ? \"caret-up\" : \"caret-down\"}\n />\n {showCaret && (\n <Icon\n className=\"components-caret\"\n iconSpec={showPopup ? <SvgCaretUpSmall /> : <SvgCaretDownSmall />}\n />\n )}\n </div>\n </button>\n {/* eslint-disable-next-line deprecation/deprecation */}\n <Popup\n className=\"components-colorpicker-popup\"\n isOpen={showPopup}\n position={RelativePosition.BottomLeft}\n onClose={closePopup}\n target={target.current}\n closeOnNestedPopupOutsideClick\n >\n <ColorOptions\n handleColorPicked={handleColorPicked}\n options={colorOptions}\n numColumns={numColumns ?? 4}\n round={!!round}\n title={dropDownTitle}\n />\n </Popup>\n </>\n );\n});\n\n/** ColorPickerButton component\n * @note Using forwardRef so the ColorEditor (Type Editor) can access the ref of the button element inside this component.\n * @beta\n * @deprecated in 4.11.0. Use {@link https://itwinui.bentley.com/docs/colorpicker iTwinUI color picker} instead.\n */\nexport const ColorPickerButton: (\n // eslint-disable-next-line deprecation/deprecation\n props: ColorPickerProps\n) => React.ReactNode = ForwardRefColorPickerButton;\n"]}
|
|
1
|
+
{"version":3,"file":"ColorPickerButton.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerButton.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Color\n */\n\nimport \"./ColorPickerButton.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon, Popup, useRefs } from \"@itwin/core-react\";\nimport { ColorSwatch } from \"./Swatch\";\nimport { getCSSColorFromDef } from \"./getCSSColorFromDef\";\nimport { SvgCaretDownSmall, SvgCaretUpSmall } from \"@itwin/itwinui-icons-react\";\n\n// cSpell:ignore colorpicker\n\nfunction ColorOptions({\n handleColorPicked,\n options,\n numColumns,\n round,\n title,\n}: {\n handleColorPicked: (color: ColorDef) => void;\n options: ColorDef[];\n numColumns: number;\n round: boolean;\n title?: string;\n}) {\n const containerStyle: React.CSSProperties = {\n gridTemplateColumns: `repeat(${numColumns}, 1fr)`,\n };\n return (\n <div className=\"components-colorpicker-popup-container\">\n {title && <h4>{title}</h4>}\n <div\n data-testid=\"components-colorpicker-popup-colors\"\n className=\"components-colorpicker-popup-colors\"\n style={containerStyle}\n >\n {options.map((color, index) => (\n // eslint-disable-next-line deprecation/deprecation\n <ColorSwatch\n className=\"components-colorpicker-swatch\"\n key={index}\n colorDef={color}\n onColorPick={handleColorPicked}\n round={round}\n />\n ))}\n </div>\n </div>\n );\n}\n\n/** Properties for the [[ColorPickerButton]] React component\n * @beta\n * @deprecated in 4.11.0. Props of deprecated component {@link ColorPickerButton}.\n */\nexport interface ColorPickerProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n // eslint-disable-next-line deprecation/deprecation\n CommonProps {\n /** Active color */\n initialColor: ColorDef;\n /** Available colors */\n colorDefs?: ColorDef[];\n /** Function to run when user selects color swatch */\n onColorPick?: ((color: ColorDef) => void) | undefined;\n /** Show swatches as squares unless round is set to true */\n round?: boolean;\n /** Disabled or not */\n disabled?: boolean;\n /** Readonly or not */\n readonly?: boolean;\n /** Title to show at top of DropDown */\n dropDownTitle?: string;\n /** Number of columns */\n numColumns?: number;\n /** Provides ability to return reference to HTMLButtonElement */\n ref?: React.Ref<HTMLButtonElement>;\n /** If true show up/down caret next to color */\n showCaret?: boolean;\n}\n\n// Defined using following pattern (const ColorPickerButton at bottom) to ensure useful API documentation is extracted\nconst ForwardRefColorPickerButton = React.forwardRef<\n HTMLButtonElement,\n // eslint-disable-next-line deprecation/deprecation\n ColorPickerProps\n>(function ForwardRefColorPickerButton(\n {\n className,\n colorDefs,\n disabled,\n dropDownTitle,\n initialColor,\n numColumns,\n onColorPick,\n readonly,\n round,\n showCaret,\n style,\n },\n ref\n) {\n const target = React.useRef<HTMLButtonElement>(null);\n const refs = useRefs(target, ref); // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.\n const [showPopup, setShowPopup] = React.useState(false);\n const [colorDef, setColorDef] = React.useState(initialColor);\n\n // See if new initialColor props have changed since component mounted\n React.useEffect(() => {\n setColorDef(initialColor);\n }, [initialColor]);\n\n const defaultColors = React.useRef([\n ColorDef.create(ColorByName.red),\n ColorDef.create(ColorByName.orange),\n ColorDef.create(ColorByName.yellow),\n ColorDef.create(ColorByName.green),\n ColorDef.create(ColorByName.blue),\n ColorDef.create(ColorByName.indigo),\n ColorDef.create(ColorByName.violet),\n ColorDef.create(ColorByName.black),\n ColorDef.create(ColorByName.white),\n ColorDef.create(ColorByName.cyan),\n ColorDef.create(ColorByName.fuchsia),\n ColorDef.create(ColorByName.tan),\n ColorDef.create(ColorByName.gray),\n ColorDef.create(ColorByName.brown),\n ColorDef.create(ColorByName.purple),\n ColorDef.create(ColorByName.olive),\n ]);\n\n const closePopup = React.useCallback(() => {\n setShowPopup(false);\n }, []);\n\n const togglePopup = React.useCallback(() => {\n setShowPopup(!showPopup);\n }, [showPopup]);\n\n const handleColorPicked = React.useCallback(\n (color: ColorDef) => {\n closePopup();\n\n if (!color.equals(colorDef)) {\n setColorDef(color);\n onColorPick && onColorPick(color);\n }\n },\n [closePopup, colorDef, onColorPick]\n );\n\n const rgbaString = getCSSColorFromDef(colorDef);\n\n const buttonStyle = { ...style } as React.CSSProperties;\n const swatchStyle = { backgroundColor: rgbaString } as React.CSSProperties;\n\n const buttonClassNames = classnames(\n \"components-colorpicker-button\",\n round && \"round\",\n readonly && \"readonly\",\n className\n );\n\n const colorOptions =\n colorDefs && colorDefs.length ? colorDefs : defaultColors.current;\n return (\n <>\n <button\n data-testid=\"components-colorpicker-button\"\n data-value={rgbaString}\n onClick={togglePopup}\n className={buttonClassNames}\n style={buttonStyle}\n disabled={disabled}\n ref={refs}\n >\n <div className=\"components-colorpicker-button-container\">\n <div\n className=\"components-colorpicker-button-color-swatch\"\n style={swatchStyle}\n data-testid={showPopup ? \"caret-up\" : \"caret-down\"}\n />\n {showCaret && (\n // eslint-disable-next-line deprecation/deprecation\n <Icon\n className=\"components-caret\"\n iconSpec={showPopup ? <SvgCaretUpSmall /> : <SvgCaretDownSmall />}\n />\n )}\n </div>\n </button>\n {/* eslint-disable-next-line deprecation/deprecation */}\n <Popup\n className=\"components-colorpicker-popup\"\n isOpen={showPopup}\n position={RelativePosition.BottomLeft}\n onClose={closePopup}\n target={target.current}\n closeOnNestedPopupOutsideClick\n >\n <ColorOptions\n handleColorPicked={handleColorPicked}\n options={colorOptions}\n numColumns={numColumns ?? 4}\n round={!!round}\n title={dropDownTitle}\n />\n </Popup>\n </>\n );\n});\n\n/** ColorPickerButton component\n * @note Using forwardRef so the ColorEditor (Type Editor) can access the ref of the button element inside this component.\n * @beta\n * @deprecated in 4.11.0. Use {@link https://itwinui.bentley.com/docs/colorpicker iTwinUI color picker} instead.\n */\nexport const ColorPickerButton: (\n // eslint-disable-next-line deprecation/deprecation\n props: ColorPickerProps\n) => React.ReactNode = ForwardRefColorPickerButton;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorPickerPopup.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerPopup.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AASrD,OAAO,yBAAyB,CAAC;AASjC;;;GAGG;AACH,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAEnD,WAAW;IACb,oBAAoB;IACpB,YAAY,EAAE,QAAQ,CAAC;IACvB;uCACmC;IACnC,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB,uDAAuD;IACvD,aAAa,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC3D,gDAAgD;IAChD,OAAO,CAAC,EAAE,CAAC,CAAC,UAAU,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACvD,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC,gEAAgE;IAChE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,gDAAgD;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6DAA6D;IAC7D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+BAA+B;IAC/B,cAAc,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;CACxC;
|
|
1
|
+
{"version":3,"file":"ColorPickerPopup.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerPopup.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAe,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AASrD,OAAO,yBAAyB,CAAC;AASjC;;;GAGG;AACH,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAEnD,WAAW;IACb,oBAAoB;IACpB,YAAY,EAAE,QAAQ,CAAC;IACvB;uCACmC;IACnC,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB,uDAAuD;IACvD,aAAa,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC3D,gDAAgD;IAChD,OAAO,CAAC,EAAE,CAAC,CAAC,UAAU,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACvD,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC,gEAAgE;IAChE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,gDAAgD;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6DAA6D;IAC7D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+BAA+B;IAC/B,cAAc,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;CACxC;AAgKD;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,EAAE,CAE7B,KAAK,EAAE,qBAAqB,KACzB,KAAK,CAAC,SAAsC,CAAC"}
|
|
@@ -119,7 +119,9 @@ const ForwardRefColorPickerPopup = React.forwardRef(function ForwardRefColorPick
|
|
|
119
119
|
React.createElement("button", { "data-testid": "components-colorpicker-popup-button", onClick: togglePopup, className: buttonClassNames, style: buttonStyle, disabled: props.disabled, ref: refs, title: togglePopupLabel },
|
|
120
120
|
React.createElement("div", { className: "components-colorpicker-button-container" },
|
|
121
121
|
React.createElement("div", { className: "components-colorpicker-button-color-swatch", style: swatchStyle, "data-testid": showPopup ? "caret-up" : "caret-down" }),
|
|
122
|
-
props.showCaret && (
|
|
122
|
+
props.showCaret && (
|
|
123
|
+
// eslint-disable-next-line deprecation/deprecation
|
|
124
|
+
React.createElement(core_react_1.Icon, { className: "components-caret", iconSpec: showPopup ? React.createElement(itwinui_icons_react_1.SvgCaretUpSmall, null) : React.createElement(itwinui_icons_react_1.SvgCaretDownSmall, null) })))),
|
|
123
125
|
React.createElement(core_react_1.Popup, { className: "components-colorpicker-popup", isOpen: showPopup, position: popupPosition, onClose: closePopup, target: target.current, closeOnNestedPopupOutsideClick: true },
|
|
124
126
|
React.createElement("div", { className: "components-colorpicker-popup-panel-padding" },
|
|
125
127
|
!props.hideCloseButton && (React.createElement("button", { title: closeLabel, className: "core-focus-trap-ignore-initial core-dialog-close icon", "data-testid": "core-dialog-close", onClick: togglePopup },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorPickerPopup.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerPopup.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Color\n */\n\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon, Popup, useRefs } from \"@itwin/core-react\";\nimport {\n ColorBuilder,\n ColorInputPanel,\n ColorPalette,\n ColorPicker,\n ColorValue,\n} from \"@itwin/itwinui-react\";\nimport \"./ColorPickerPopup.scss\";\nimport { getCSSColorFromDef } from \"./getCSSColorFromDef\";\nimport {\n SvgCaretDownSmall,\n SvgCaretUpSmall,\n SvgClose,\n} from \"@itwin/itwinui-icons-react\";\nimport { useTranslation } from \"../useTranslation\";\n\n/** Properties for the [[ColorPickerPopup]] React component\n * @public\n * @deprecated in 4.11.0. Props of deprecated component {@link ColorPickerPopup}.\n */\nexport interface ColorPickerPopupProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n // eslint-disable-next-line deprecation/deprecation\n CommonProps {\n /** Current color */\n initialColor: ColorDef;\n /** Preset colors. Pass undefined to show default preset colors. Pass empty array to show no presets.\n * Displayed in rows of 9 items */\n colorDefs?: ColorDef[];\n /** Function to call when the color value is changed */\n onColorChange?: ((newColor: ColorDef) => void) | undefined;\n /** Function to call when the popup is closed */\n onClose?: ((colorValue: ColorDef) => void) | undefined;\n /** Disabled or not */\n disabled?: boolean;\n /** Readonly or not, color displayed on button but button will not trigger pop-up */\n readonly?: boolean;\n /** popup position. If not set RelativePosition.BottomLeft is used */\n popupPosition?: RelativePosition;\n /** Provides ability to return reference to HTMLButtonElement */\n ref?: React.Ref<HTMLButtonElement>;\n /** If true show up/down caret next to color */\n showCaret?: boolean;\n /** If true, don't propagate clicks out of the ColorPicker */\n captureClicks?: boolean;\n /** If true, don't show close button at top */\n hideCloseButton?: boolean;\n /** If set show input values */\n colorInputType?: \"hsl\" | \"rgb\" | \"hex\";\n}\n\n// Defined using following pattern (const ColorPickerPopup at bottom) to ensure useful API documentation is extracted\n\nconst ForwardRefColorPickerPopup = React.forwardRef<\n HTMLButtonElement,\n // eslint-disable-next-line deprecation/deprecation\n ColorPickerPopupProps\n>(function ForwardRefColorPickerPopup(props, ref) {\n const { translate } = useTranslation();\n const target = React.useRef<HTMLButtonElement>(null);\n const refs = useRefs(target, ref); // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.\n const [showPopup, setShowPopup] = React.useState(false);\n const [colorDef, setColorDef] = React.useState(props.initialColor);\n const initialColorRef = React.useRef(props.initialColor);\n\n React.useEffect(() => {\n if (props.initialColor !== initialColorRef.current) {\n initialColorRef.current = props.initialColor;\n setColorDef(props.initialColor);\n }\n }, [props.initialColor]);\n\n const defaultColors = React.useRef([\n ColorValue.fromTbgr(ColorByName.red),\n ColorValue.fromTbgr(ColorByName.orange),\n ColorValue.fromTbgr(ColorByName.yellow),\n ColorValue.fromTbgr(ColorByName.green),\n ColorValue.fromTbgr(ColorByName.blue),\n ColorValue.fromTbgr(ColorByName.mediumBlue),\n ColorValue.fromTbgr(ColorByName.indigo),\n ColorValue.fromTbgr(ColorByName.violet),\n ColorValue.fromTbgr(ColorByName.black),\n ColorValue.fromTbgr(ColorByName.white),\n ColorValue.fromTbgr(ColorByName.cyan),\n ColorValue.fromTbgr(ColorByName.fuchsia),\n ColorValue.fromTbgr(ColorByName.tan),\n ColorValue.fromTbgr(ColorByName.gray),\n ColorValue.fromTbgr(ColorByName.brown),\n ColorValue.fromTbgr(ColorByName.purple),\n ColorValue.fromTbgr(ColorByName.olive),\n ColorValue.fromTbgr(ColorByName.darkGreen),\n ]);\n\n const closePopup = React.useCallback(() => {\n props.onClose && props.onClose(colorDef);\n setShowPopup(false);\n }, [colorDef, props]);\n\n const togglePopup = React.useCallback(() => {\n setShowPopup(!showPopup);\n }, [showPopup]);\n\n const handleColorChanged = React.useCallback(\n (newColorValue: ColorValue) => {\n const newColor = ColorDef.fromTbgr(newColorValue.toTbgr());\n if (!newColor.equals(colorDef)) {\n setColorDef(newColor);\n\n props.onColorChange && props.onColorChange(newColor);\n }\n },\n [colorDef, props]\n );\n\n const rgbaString = getCSSColorFromDef(colorDef);\n\n const buttonStyle = { ...props.style } as React.CSSProperties;\n const swatchStyle = { backgroundColor: rgbaString } as React.CSSProperties;\n const buttonClassNames = classnames(\n \"components-colorpicker-popup-button\",\n props.readonly && \"readonly\",\n props.className\n );\n\n const clickHandler = (event: React.MouseEvent) => {\n if (props.captureClicks) event.stopPropagation();\n };\n\n const colorOptions = React.useMemo(() => {\n if (props.colorDefs && props.colorDefs.length) {\n return props.colorDefs.map((def) => ColorValue.fromTbgr(def.tbgr));\n }\n if (props.colorDefs && 0 === props.colorDefs.length) return undefined;\n return defaultColors.current;\n }, [props.colorDefs]);\n const popupPosition =\n undefined !== props.popupPosition\n ? props.popupPosition\n : RelativePosition.BottomLeft;\n\n const closeLabel = translate(\"color.close\");\n const togglePopupLabel = translate(\"color.toggleColorPopup\");\n\n return (\n /* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n <div onClick={clickHandler}>\n <button\n data-testid=\"components-colorpicker-popup-button\"\n onClick={togglePopup}\n className={buttonClassNames}\n style={buttonStyle}\n disabled={props.disabled}\n ref={refs}\n title={togglePopupLabel}\n >\n <div className=\"components-colorpicker-button-container\">\n <div\n className=\"components-colorpicker-button-color-swatch\"\n style={swatchStyle}\n data-testid={showPopup ? \"caret-up\" : \"caret-down\"}\n />\n {props.showCaret && (\n <Icon\n className=\"components-caret\"\n iconSpec={showPopup ? <SvgCaretUpSmall /> : <SvgCaretDownSmall />}\n />\n )}\n </div>\n </button>\n {/* eslint-disable-next-line deprecation/deprecation */}\n <Popup\n className=\"components-colorpicker-popup\"\n isOpen={showPopup}\n position={popupPosition}\n onClose={closePopup}\n target={target.current}\n closeOnNestedPopupOutsideClick\n >\n <div className=\"components-colorpicker-popup-panel-padding\">\n {!props.hideCloseButton && (\n <button\n title={closeLabel}\n className={\n \"core-focus-trap-ignore-initial core-dialog-close icon\"\n }\n data-testid=\"core-dialog-close\"\n onClick={togglePopup}\n >\n <Icon iconSpec={<SvgClose />} />\n </button>\n )}\n <ColorPicker\n selectedColor={ColorValue.fromTbgr(colorDef.tbgr)}\n onChangeComplete={handleColorChanged}\n >\n <ColorBuilder />\n {props.colorInputType && (\n <ColorInputPanel defaultColorFormat={props.colorInputType} />\n )}\n {colorOptions && <ColorPalette colors={colorOptions} />}\n </ColorPicker>\n </div>\n </Popup>\n </div>\n );\n});\n\n/**\n * ColorPickerButton component that allows user to select a color from a set of color swatches or to define a new color.\n * @note Using forwardRef so the ColorEditor (Type Editor) can access the ref of the button element inside this component.\n * @public\n * @deprecated in 4.11.0. Use {@link https://itwinui.bentley.com/docs/colorpicker iTwinUI color picker} instead.\n */\nexport const ColorPickerPopup: (\n // eslint-disable-next-line deprecation/deprecation\n props: ColorPickerPopupProps\n) => React.ReactNode = ForwardRefColorPickerPopup;\n"]}
|
|
1
|
+
{"version":3,"file":"ColorPickerPopup.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/color/ColorPickerPopup.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Color\n */\n\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { ColorByName, ColorDef } from \"@itwin/core-common\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon, Popup, useRefs } from \"@itwin/core-react\";\nimport {\n ColorBuilder,\n ColorInputPanel,\n ColorPalette,\n ColorPicker,\n ColorValue,\n} from \"@itwin/itwinui-react\";\nimport \"./ColorPickerPopup.scss\";\nimport { getCSSColorFromDef } from \"./getCSSColorFromDef\";\nimport {\n SvgCaretDownSmall,\n SvgCaretUpSmall,\n SvgClose,\n} from \"@itwin/itwinui-icons-react\";\nimport { useTranslation } from \"../useTranslation\";\n\n/** Properties for the [[ColorPickerPopup]] React component\n * @public\n * @deprecated in 4.11.0. Props of deprecated component {@link ColorPickerPopup}.\n */\nexport interface ColorPickerPopupProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n // eslint-disable-next-line deprecation/deprecation\n CommonProps {\n /** Current color */\n initialColor: ColorDef;\n /** Preset colors. Pass undefined to show default preset colors. Pass empty array to show no presets.\n * Displayed in rows of 9 items */\n colorDefs?: ColorDef[];\n /** Function to call when the color value is changed */\n onColorChange?: ((newColor: ColorDef) => void) | undefined;\n /** Function to call when the popup is closed */\n onClose?: ((colorValue: ColorDef) => void) | undefined;\n /** Disabled or not */\n disabled?: boolean;\n /** Readonly or not, color displayed on button but button will not trigger pop-up */\n readonly?: boolean;\n /** popup position. If not set RelativePosition.BottomLeft is used */\n popupPosition?: RelativePosition;\n /** Provides ability to return reference to HTMLButtonElement */\n ref?: React.Ref<HTMLButtonElement>;\n /** If true show up/down caret next to color */\n showCaret?: boolean;\n /** If true, don't propagate clicks out of the ColorPicker */\n captureClicks?: boolean;\n /** If true, don't show close button at top */\n hideCloseButton?: boolean;\n /** If set show input values */\n colorInputType?: \"hsl\" | \"rgb\" | \"hex\";\n}\n\n// Defined using following pattern (const ColorPickerPopup at bottom) to ensure useful API documentation is extracted\n\nconst ForwardRefColorPickerPopup = React.forwardRef<\n HTMLButtonElement,\n // eslint-disable-next-line deprecation/deprecation\n ColorPickerPopupProps\n>(function ForwardRefColorPickerPopup(props, ref) {\n const { translate } = useTranslation();\n const target = React.useRef<HTMLButtonElement>(null);\n const refs = useRefs(target, ref); // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.\n const [showPopup, setShowPopup] = React.useState(false);\n const [colorDef, setColorDef] = React.useState(props.initialColor);\n const initialColorRef = React.useRef(props.initialColor);\n\n React.useEffect(() => {\n if (props.initialColor !== initialColorRef.current) {\n initialColorRef.current = props.initialColor;\n setColorDef(props.initialColor);\n }\n }, [props.initialColor]);\n\n const defaultColors = React.useRef([\n ColorValue.fromTbgr(ColorByName.red),\n ColorValue.fromTbgr(ColorByName.orange),\n ColorValue.fromTbgr(ColorByName.yellow),\n ColorValue.fromTbgr(ColorByName.green),\n ColorValue.fromTbgr(ColorByName.blue),\n ColorValue.fromTbgr(ColorByName.mediumBlue),\n ColorValue.fromTbgr(ColorByName.indigo),\n ColorValue.fromTbgr(ColorByName.violet),\n ColorValue.fromTbgr(ColorByName.black),\n ColorValue.fromTbgr(ColorByName.white),\n ColorValue.fromTbgr(ColorByName.cyan),\n ColorValue.fromTbgr(ColorByName.fuchsia),\n ColorValue.fromTbgr(ColorByName.tan),\n ColorValue.fromTbgr(ColorByName.gray),\n ColorValue.fromTbgr(ColorByName.brown),\n ColorValue.fromTbgr(ColorByName.purple),\n ColorValue.fromTbgr(ColorByName.olive),\n ColorValue.fromTbgr(ColorByName.darkGreen),\n ]);\n\n const closePopup = React.useCallback(() => {\n props.onClose && props.onClose(colorDef);\n setShowPopup(false);\n }, [colorDef, props]);\n\n const togglePopup = React.useCallback(() => {\n setShowPopup(!showPopup);\n }, [showPopup]);\n\n const handleColorChanged = React.useCallback(\n (newColorValue: ColorValue) => {\n const newColor = ColorDef.fromTbgr(newColorValue.toTbgr());\n if (!newColor.equals(colorDef)) {\n setColorDef(newColor);\n\n props.onColorChange && props.onColorChange(newColor);\n }\n },\n [colorDef, props]\n );\n\n const rgbaString = getCSSColorFromDef(colorDef);\n\n const buttonStyle = { ...props.style } as React.CSSProperties;\n const swatchStyle = { backgroundColor: rgbaString } as React.CSSProperties;\n const buttonClassNames = classnames(\n \"components-colorpicker-popup-button\",\n props.readonly && \"readonly\",\n props.className\n );\n\n const clickHandler = (event: React.MouseEvent) => {\n if (props.captureClicks) event.stopPropagation();\n };\n\n const colorOptions = React.useMemo(() => {\n if (props.colorDefs && props.colorDefs.length) {\n return props.colorDefs.map((def) => ColorValue.fromTbgr(def.tbgr));\n }\n if (props.colorDefs && 0 === props.colorDefs.length) return undefined;\n return defaultColors.current;\n }, [props.colorDefs]);\n const popupPosition =\n undefined !== props.popupPosition\n ? props.popupPosition\n : RelativePosition.BottomLeft;\n\n const closeLabel = translate(\"color.close\");\n const togglePopupLabel = translate(\"color.toggleColorPopup\");\n\n return (\n /* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n <div onClick={clickHandler}>\n <button\n data-testid=\"components-colorpicker-popup-button\"\n onClick={togglePopup}\n className={buttonClassNames}\n style={buttonStyle}\n disabled={props.disabled}\n ref={refs}\n title={togglePopupLabel}\n >\n <div className=\"components-colorpicker-button-container\">\n <div\n className=\"components-colorpicker-button-color-swatch\"\n style={swatchStyle}\n data-testid={showPopup ? \"caret-up\" : \"caret-down\"}\n />\n {props.showCaret && (\n // eslint-disable-next-line deprecation/deprecation\n <Icon\n className=\"components-caret\"\n iconSpec={showPopup ? <SvgCaretUpSmall /> : <SvgCaretDownSmall />}\n />\n )}\n </div>\n </button>\n {/* eslint-disable-next-line deprecation/deprecation */}\n <Popup\n className=\"components-colorpicker-popup\"\n isOpen={showPopup}\n position={popupPosition}\n onClose={closePopup}\n target={target.current}\n closeOnNestedPopupOutsideClick\n >\n <div className=\"components-colorpicker-popup-panel-padding\">\n {!props.hideCloseButton && (\n <button\n title={closeLabel}\n className={\n \"core-focus-trap-ignore-initial core-dialog-close icon\"\n }\n data-testid=\"core-dialog-close\"\n onClick={togglePopup}\n >\n {/* eslint-disable-next-line deprecation/deprecation */}\n <Icon iconSpec={<SvgClose />} />\n </button>\n )}\n <ColorPicker\n selectedColor={ColorValue.fromTbgr(colorDef.tbgr)}\n onChangeComplete={handleColorChanged}\n >\n <ColorBuilder />\n {props.colorInputType && (\n <ColorInputPanel defaultColorFormat={props.colorInputType} />\n )}\n {colorOptions && <ColorPalette colors={colorOptions} />}\n </ColorPicker>\n </div>\n </Popup>\n </div>\n );\n});\n\n/**\n * ColorPickerButton component that allows user to select a color from a set of color swatches or to define a new color.\n * @note Using forwardRef so the ColorEditor (Type Editor) can access the ref of the button element inside this component.\n * @public\n * @deprecated in 4.11.0. Use {@link https://itwinui.bentley.com/docs/colorpicker iTwinUI color picker} instead.\n */\nexport const ColorPickerPopup: (\n // eslint-disable-next-line deprecation/deprecation\n props: ColorPickerPopupProps\n) => React.ReactNode = ForwardRefColorPickerPopup;\n"]}
|
|
@@ -20,19 +20,15 @@ interface ColorEditorState {
|
|
|
20
20
|
*/
|
|
21
21
|
export declare class ColorEditor extends React.PureComponent<PropertyEditorProps, ColorEditorState> implements TypeEditor {
|
|
22
22
|
private _buttonElement;
|
|
23
|
-
/** @internal */
|
|
24
23
|
readonly state: Readonly<ColorEditorState>;
|
|
25
24
|
getPropertyValue(): Promise<PropertyValue | undefined>;
|
|
26
25
|
get htmlElement(): HTMLElement | null;
|
|
27
26
|
get hasFocus(): boolean;
|
|
28
27
|
private setFocus;
|
|
29
28
|
private _onColorPick;
|
|
30
|
-
/** @internal */
|
|
31
29
|
componentDidMount(): void;
|
|
32
|
-
/** @internal */
|
|
33
30
|
componentDidUpdate(prevProps: PropertyEditorProps): void;
|
|
34
31
|
private setStateFromProps;
|
|
35
|
-
/** @internal */
|
|
36
32
|
render(): React.JSX.Element;
|
|
37
33
|
}
|
|
38
34
|
/** Color Property Editor registered for the "number" type name and "color-picker" editor name.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorEditor.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/ColorEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,KAAK,EAIV,aAAa,EACd,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,EACL,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AAGjC,gBAAgB;AAChB,UAAU,gBAAgB;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,QAAQ,EAAE,CAAC;CAC7B;AAED;;GAEG;AACH,qBAAa,WACX,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,gBAAgB,CACjE,YAAW,UAAU;IAErB,OAAO,CAAC,cAAc,CACF;IAEpB,
|
|
1
|
+
{"version":3,"file":"ColorEditor.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/ColorEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,KAAK,EAIV,aAAa,EACd,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,EACL,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AAGjC,gBAAgB;AAChB,UAAU,gBAAgB;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,QAAQ,EAAE,CAAC;CAC7B;AAED;;GAEG;AACH,qBAAa,WACX,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,gBAAgB,CACjE,YAAW,UAAU;IAErB,OAAO,CAAC,cAAc,CACF;IAEpB,SAAyB,KAAK,EAAE,QAAQ,CAAC,gBAAgB,CAAC,CAKxD;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAenE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,QAAQ;IAUhB,OAAO,CAAC,YAAY,CAgBlB;IAEc,iBAAiB;IAIjB,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;YAMnD,iBAAiB;IAkCf,MAAM;CAwBvB;AAED;;;GAGG;AACH,qBAAa,mBAAoB,SAAQ,kBAAkB;IACzD,IAAW,SAAS,IAAI,KAAK,CAAC,SAAS,CAEtC;CACF"}
|
|
@@ -48,7 +48,6 @@ class ColorEditor extends React.PureComponent {
|
|
|
48
48
|
constructor() {
|
|
49
49
|
super(...arguments);
|
|
50
50
|
this._buttonElement = React.createRef();
|
|
51
|
-
/** @internal */
|
|
52
51
|
this.state = {
|
|
53
52
|
colorValue: 0,
|
|
54
53
|
readonly: false,
|
|
@@ -94,11 +93,9 @@ class ColorEditor extends React.PureComponent {
|
|
|
94
93
|
this._buttonElement.current.focus();
|
|
95
94
|
}
|
|
96
95
|
}
|
|
97
|
-
/** @internal */
|
|
98
96
|
componentDidMount() {
|
|
99
97
|
void this.setStateFromProps();
|
|
100
98
|
}
|
|
101
|
-
/** @internal */
|
|
102
99
|
componentDidUpdate(prevProps) {
|
|
103
100
|
if (this.props.propertyRecord !== prevProps.propertyRecord) {
|
|
104
101
|
void this.setStateFromProps();
|
|
@@ -129,7 +126,6 @@ class ColorEditor extends React.PureComponent {
|
|
|
129
126
|
});
|
|
130
127
|
}
|
|
131
128
|
}
|
|
132
|
-
/** @internal */
|
|
133
129
|
render() {
|
|
134
130
|
const colorDef = core_common_1.ColorDef.create(this.state.colorValue);
|
|
135
131
|
return (React.createElement("div", { className: (0, classnames_1.default)("components-color-editor", this.props.className), style: this.props.style },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorEditor.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/ColorEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport \"./ColorEditor.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { ColorDef } from \"@itwin/core-common\";\nimport type {\n ColorEditorParams,\n PropertyEditorParams,\n PropertyRecord,\n PropertyValue,\n} from \"@itwin/appui-abstract\";\nimport {\n PropertyEditorParamTypes,\n PropertyValueFormat,\n StandardEditorNames,\n StandardTypeNames,\n} from \"@itwin/appui-abstract\";\nimport type { PropertyEditorProps, TypeEditor } from \"@itwin/components-react\";\nimport {\n PropertyEditorBase,\n PropertyEditorManager,\n} from \"@itwin/components-react\";\nimport { ColorPickerButton } from \"../color/ColorPickerButton\";\n\n/** @internal */\ninterface ColorEditorState {\n colorValue: number;\n readonly: boolean;\n isDisabled?: boolean;\n numColumns: number;\n availableColors: ColorDef[];\n}\n\n/** ColorEditor React component that is a property editor with text input\n * @beta\n */\nexport class ColorEditor\n extends React.PureComponent<PropertyEditorProps, ColorEditorState>\n implements TypeEditor\n{\n private _buttonElement: React.RefObject<HTMLButtonElement> =\n React.createRef();\n\n /** @internal */\n public override readonly state: Readonly<ColorEditorState> = {\n colorValue: 0,\n readonly: false,\n numColumns: 4,\n availableColors: [],\n };\n\n public async getPropertyValue(): Promise<PropertyValue | undefined> {\n const record = this.props.propertyRecord;\n let propertyValue: PropertyValue | undefined;\n\n if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n propertyValue = {\n valueFormat: PropertyValueFormat.Primitive,\n value: this.state.colorValue,\n displayValue: \"\",\n };\n }\n\n return propertyValue;\n }\n\n public get htmlElement(): HTMLElement | null {\n return this._buttonElement.current;\n }\n\n public get hasFocus(): boolean {\n return document.activeElement === this._buttonElement.current;\n }\n\n private setFocus(): void {\n if (\n this._buttonElement &&\n this._buttonElement.current &&\n !this.state.isDisabled\n ) {\n this._buttonElement.current.focus();\n }\n }\n\n private _onColorPick = (color: ColorDef) => {\n const propertyRecord = this.props.propertyRecord as PropertyRecord;\n\n this.setState(\n {\n colorValue: color.tbgr,\n },\n async () => {\n if (propertyRecord && this.props.onCommit) {\n const propertyValue = await this.getPropertyValue();\n if (propertyValue !== undefined) {\n this.props.onCommit({ propertyRecord, newValue: propertyValue });\n }\n }\n }\n );\n };\n\n /** @internal */\n public override componentDidMount() {\n void this.setStateFromProps();\n }\n\n /** @internal */\n public override componentDidUpdate(prevProps: PropertyEditorProps) {\n if (this.props.propertyRecord !== prevProps.propertyRecord) {\n void this.setStateFromProps();\n }\n }\n\n private async setStateFromProps() {\n const record = this.props.propertyRecord;\n\n if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n const colorValue = record.value.value as number;\n let numColumns = 4;\n const availableColors = new Array<ColorDef>();\n const readonly =\n record && undefined !== record.isReadonly ? record.isReadonly : false;\n const isDisabled = record ? record.isDisabled : undefined;\n\n if (record.property.editor && record.property.editor.params) {\n const colorParams = record.property.editor.params.find(\n (param: PropertyEditorParams) =>\n param.type === PropertyEditorParamTypes.ColorData.valueOf()\n ) as ColorEditorParams;\n if (colorParams) {\n colorParams.colorValues.forEach((colorNumber: number) => {\n availableColors.push(ColorDef.create(colorNumber));\n });\n if (colorParams.numColumns) numColumns = colorParams.numColumns;\n }\n }\n this.setState(\n { colorValue, readonly, isDisabled, numColumns, availableColors },\n () => {\n if (this.props.setFocus) {\n this.setFocus();\n }\n }\n );\n }\n }\n\n /** @internal */\n public override render() {\n const colorDef = ColorDef.create(this.state.colorValue);\n return (\n <div\n className={classnames(\"components-color-editor\", this.props.className)}\n style={this.props.style}\n >\n <ColorPickerButton // eslint-disable-line deprecation/deprecation\n ref={this._buttonElement}\n initialColor={colorDef}\n colorDefs={\n this.state.availableColors.length > 0\n ? this.state.availableColors\n : [colorDef]\n }\n numColumns={this.state.numColumns}\n disabled={this.state.isDisabled ? true : false}\n readonly={this.state.readonly}\n onColorPick={this._onColorPick}\n data-testid=\"components-color-editor\"\n />\n </div>\n );\n }\n}\n\n/** Color Property Editor registered for the \"number\" type name and \"color-picker\" editor name.\n * It uses the [[ColorEditor]] React component.\n * @beta\n */\nexport class ColorPropertyEditor extends PropertyEditorBase {\n public get reactNode(): React.ReactNode {\n return <ColorEditor />;\n }\n}\n\nPropertyEditorManager.registerEditor(\n StandardTypeNames.Number,\n ColorPropertyEditor,\n StandardEditorNames.ColorPicker\n);\n"]}
|
|
1
|
+
{"version":3,"file":"ColorEditor.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/ColorEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport \"./ColorEditor.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { ColorDef } from \"@itwin/core-common\";\nimport type {\n ColorEditorParams,\n PropertyEditorParams,\n PropertyRecord,\n PropertyValue,\n} from \"@itwin/appui-abstract\";\nimport {\n PropertyEditorParamTypes,\n PropertyValueFormat,\n StandardEditorNames,\n StandardTypeNames,\n} from \"@itwin/appui-abstract\";\nimport type { PropertyEditorProps, TypeEditor } from \"@itwin/components-react\";\nimport {\n PropertyEditorBase,\n PropertyEditorManager,\n} from \"@itwin/components-react\";\nimport { ColorPickerButton } from \"../color/ColorPickerButton\";\n\n/** @internal */\ninterface ColorEditorState {\n colorValue: number;\n readonly: boolean;\n isDisabled?: boolean;\n numColumns: number;\n availableColors: ColorDef[];\n}\n\n/** ColorEditor React component that is a property editor with text input\n * @beta\n */\nexport class ColorEditor\n extends React.PureComponent<PropertyEditorProps, ColorEditorState>\n implements TypeEditor\n{\n private _buttonElement: React.RefObject<HTMLButtonElement> =\n React.createRef();\n\n public override readonly state: Readonly<ColorEditorState> = {\n colorValue: 0,\n readonly: false,\n numColumns: 4,\n availableColors: [],\n };\n\n public async getPropertyValue(): Promise<PropertyValue | undefined> {\n const record = this.props.propertyRecord;\n let propertyValue: PropertyValue | undefined;\n\n if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n propertyValue = {\n valueFormat: PropertyValueFormat.Primitive,\n value: this.state.colorValue,\n displayValue: \"\",\n };\n }\n\n return propertyValue;\n }\n\n public get htmlElement(): HTMLElement | null {\n return this._buttonElement.current;\n }\n\n public get hasFocus(): boolean {\n return document.activeElement === this._buttonElement.current;\n }\n\n private setFocus(): void {\n if (\n this._buttonElement &&\n this._buttonElement.current &&\n !this.state.isDisabled\n ) {\n this._buttonElement.current.focus();\n }\n }\n\n private _onColorPick = (color: ColorDef) => {\n const propertyRecord = this.props.propertyRecord as PropertyRecord;\n\n this.setState(\n {\n colorValue: color.tbgr,\n },\n async () => {\n if (propertyRecord && this.props.onCommit) {\n const propertyValue = await this.getPropertyValue();\n if (propertyValue !== undefined) {\n this.props.onCommit({ propertyRecord, newValue: propertyValue });\n }\n }\n }\n );\n };\n\n public override componentDidMount() {\n void this.setStateFromProps();\n }\n\n public override componentDidUpdate(prevProps: PropertyEditorProps) {\n if (this.props.propertyRecord !== prevProps.propertyRecord) {\n void this.setStateFromProps();\n }\n }\n\n private async setStateFromProps() {\n const record = this.props.propertyRecord;\n\n if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n const colorValue = record.value.value as number;\n let numColumns = 4;\n const availableColors = new Array<ColorDef>();\n const readonly =\n record && undefined !== record.isReadonly ? record.isReadonly : false;\n const isDisabled = record ? record.isDisabled : undefined;\n\n if (record.property.editor && record.property.editor.params) {\n const colorParams = record.property.editor.params.find(\n (param: PropertyEditorParams) =>\n param.type === PropertyEditorParamTypes.ColorData.valueOf()\n ) as ColorEditorParams;\n if (colorParams) {\n colorParams.colorValues.forEach((colorNumber: number) => {\n availableColors.push(ColorDef.create(colorNumber));\n });\n if (colorParams.numColumns) numColumns = colorParams.numColumns;\n }\n }\n this.setState(\n { colorValue, readonly, isDisabled, numColumns, availableColors },\n () => {\n if (this.props.setFocus) {\n this.setFocus();\n }\n }\n );\n }\n }\n\n public override render() {\n const colorDef = ColorDef.create(this.state.colorValue);\n return (\n <div\n className={classnames(\"components-color-editor\", this.props.className)}\n style={this.props.style}\n >\n <ColorPickerButton // eslint-disable-line deprecation/deprecation\n ref={this._buttonElement}\n initialColor={colorDef}\n colorDefs={\n this.state.availableColors.length > 0\n ? this.state.availableColors\n : [colorDef]\n }\n numColumns={this.state.numColumns}\n disabled={this.state.isDisabled ? true : false}\n readonly={this.state.readonly}\n onColorPick={this._onColorPick}\n data-testid=\"components-color-editor\"\n />\n </div>\n );\n }\n}\n\n/** Color Property Editor registered for the \"number\" type name and \"color-picker\" editor name.\n * It uses the [[ColorEditor]] React component.\n * @beta\n */\nexport class ColorPropertyEditor extends PropertyEditorBase {\n public get reactNode(): React.ReactNode {\n return <ColorEditor />;\n }\n}\n\nPropertyEditorManager.registerEditor(\n StandardTypeNames.Number,\n ColorPropertyEditor,\n StandardEditorNames.ColorPicker\n);\n"]}
|
|
@@ -20,7 +20,6 @@ export declare class WeightEditor extends React.PureComponent<PropertyEditorProp
|
|
|
20
20
|
private _isMounted;
|
|
21
21
|
private _availableWeights;
|
|
22
22
|
private _divElement;
|
|
23
|
-
/** @internal */
|
|
24
23
|
readonly state: Readonly<WeightEditorState>;
|
|
25
24
|
constructor(props: PropertyEditorProps);
|
|
26
25
|
getPropertyValue(): Promise<PropertyValue | undefined>;
|
|
@@ -28,14 +27,10 @@ export declare class WeightEditor extends React.PureComponent<PropertyEditorProp
|
|
|
28
27
|
get hasFocus(): boolean;
|
|
29
28
|
private setFocus;
|
|
30
29
|
private _onLineWeightPick;
|
|
31
|
-
/** @internal */
|
|
32
30
|
componentDidMount(): void;
|
|
33
|
-
/** @internal */
|
|
34
31
|
componentWillUnmount(): void;
|
|
35
|
-
/** @internal */
|
|
36
32
|
componentDidUpdate(prevProps: PropertyEditorProps): void;
|
|
37
33
|
private setStateFromProps;
|
|
38
|
-
/** @internal */
|
|
39
34
|
render(): React.JSX.Element;
|
|
40
35
|
}
|
|
41
36
|
/** Weight Property Editor registered for the "number" type name and "weight-picker" editor name.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WeightEditor.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/WeightEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAkB,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAM3E,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,EACL,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AAKjC,gBAAgB;AAChB,UAAU,iBAAiB;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,qBAAa,YACX,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,iBAAiB,CAClE,YAAW,UAAU;IAErB,OAAO,CAAC,QAAQ,CAAa;IAC7B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,iBAAiB,CAAgB;IACzC,OAAO,CAAC,WAAW,CAAqC;IAExD,
|
|
1
|
+
{"version":3,"file":"WeightEditor.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/WeightEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAkB,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAM3E,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,EACL,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AAKjC,gBAAgB;AAChB,UAAU,iBAAiB;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,qBAAa,YACX,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,iBAAiB,CAClE,YAAW,UAAU;IAErB,OAAO,CAAC,QAAQ,CAAa;IAC7B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,iBAAiB,CAAgB;IACzC,OAAO,CAAC,WAAW,CAAqC;IAExD,SAAyB,KAAK,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAGzD;gBAEU,KAAK,EAAE,mBAAmB;IAezB,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAenE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAK7B;IAED,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,iBAAiB,CAgBvB;IAEc,iBAAiB;IAKjB,oBAAoB;IAIpB,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;YAMnD,iBAAiB;IAoBf,MAAM;CAuBvB;AAED;;;GAGG;AACH,qBAAa,oBAAqB,SAAQ,kBAAkB;IAC1D,IAAW,SAAS,IAAI,KAAK,CAAC,SAAS,CAEtC;CACF"}
|
|
@@ -50,7 +50,6 @@ class WeightEditor extends React.PureComponent {
|
|
|
50
50
|
this._isMounted = false;
|
|
51
51
|
this._availableWeights = [];
|
|
52
52
|
this._divElement = React.createRef();
|
|
53
|
-
/** @internal */
|
|
54
53
|
this.state = {
|
|
55
54
|
weightValue: 0,
|
|
56
55
|
readonly: false,
|
|
@@ -105,16 +104,13 @@ class WeightEditor extends React.PureComponent {
|
|
|
105
104
|
this._control.setFocus();
|
|
106
105
|
}
|
|
107
106
|
}
|
|
108
|
-
/** @internal */
|
|
109
107
|
componentDidMount() {
|
|
110
108
|
this._isMounted = true;
|
|
111
109
|
void this.setStateFromProps();
|
|
112
110
|
}
|
|
113
|
-
/** @internal */
|
|
114
111
|
componentWillUnmount() {
|
|
115
112
|
this._isMounted = false;
|
|
116
113
|
}
|
|
117
|
-
/** @internal */
|
|
118
114
|
componentDidUpdate(prevProps) {
|
|
119
115
|
if (this.props.propertyRecord !== prevProps.propertyRecord) {
|
|
120
116
|
void this.setStateFromProps();
|
|
@@ -135,7 +131,6 @@ class WeightEditor extends React.PureComponent {
|
|
|
135
131
|
}
|
|
136
132
|
});
|
|
137
133
|
}
|
|
138
|
-
/** @internal */
|
|
139
134
|
render() {
|
|
140
135
|
return (React.createElement("div", { className: (0, classnames_1.default)("components-weight-editor", this.props.className), style: this.props.style, ref: this._divElement },
|
|
141
136
|
React.createElement(WeightPickerButton_1.WeightPickerButton, { ref: (control) => (this._control = control), activeWeight: this.state.weightValue, weights: this._availableWeights.length > 0
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WeightEditor.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/WeightEditor.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEH,+BAA6B;AAC7B,4DAAoC;AACpC,6CAA+B;AAE/B,0DAI+B;AAE/B,8DAGiC;AACjC,yEAAsE;AAWtE;;GAEG;AACH,MAAa,YACX,SAAQ,KAAK,CAAC,aAAqD;
|
|
1
|
+
{"version":3,"file":"WeightEditor.js","sourceRoot":"","sources":["../../../../src/imodel-components-react/editors/WeightEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport \"./WeightEditor.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { PropertyRecord, PropertyValue } from \"@itwin/appui-abstract\";\nimport {\n PropertyValueFormat,\n StandardEditorNames,\n StandardTypeNames,\n} from \"@itwin/appui-abstract\";\nimport type { PropertyEditorProps, TypeEditor } from \"@itwin/components-react\";\nimport {\n PropertyEditorBase,\n PropertyEditorManager,\n} from \"@itwin/components-react\";\nimport { WeightPickerButton } from \"../lineweight/WeightPickerButton\";\n\n// cspell:ignore lineweight\n\n/** @internal */\ninterface WeightEditorState {\n weightValue: number;\n readonly: boolean;\n isDisabled?: boolean;\n}\n\n/** WeightEditor React component that is a property editor for picking a weight using a [[WeightPickerButton]] component\n * @public\n */\nexport class WeightEditor\n extends React.PureComponent<PropertyEditorProps, WeightEditorState>\n implements TypeEditor\n{\n private _control: any = null;\n private _isMounted = false;\n private _availableWeights: number[] = [];\n private _divElement = React.createRef<HTMLDivElement>();\n\n public override readonly state: Readonly<WeightEditorState> = {\n weightValue: 0,\n readonly: false,\n };\n\n constructor(props: PropertyEditorProps) {\n super(props);\n\n // TODO: add support for following if we need to specify set of weights to display\n // const record = this.props.propertyRecord;\n // if (record && record.property && record.property.editor && record.property.editor.params) {\n // const weightParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.ColorData) as WeightEditorParams;\n // // if (weightParams) {\n // weightParams.weightValues.forEach((weight: number) => {\n // this._availableWeights.push(weight);\n // });\n // }\n // }\n }\n\n public async getPropertyValue(): Promise<PropertyValue | undefined> {\n const record = this.props.propertyRecord;\n let propertyValue: PropertyValue | undefined;\n\n if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n propertyValue = {\n valueFormat: PropertyValueFormat.Primitive,\n value: this.state.weightValue,\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 if (this._divElement.current)\n containsFocus = this._divElement.current.contains(document.activeElement);\n return containsFocus;\n }\n\n private setFocus(): void {\n if (this._control && !this.state.isDisabled) {\n this._control.setFocus();\n }\n }\n\n private _onLineWeightPick = (weight: number) => {\n const propertyRecord = this.props.propertyRecord as PropertyRecord;\n\n this.setState(\n {\n weightValue: weight,\n },\n async () => {\n if (propertyRecord && this.props.onCommit) {\n const propertyValue = await this.getPropertyValue();\n if (propertyValue !== undefined) {\n this.props.onCommit({ propertyRecord, newValue: propertyValue });\n }\n }\n }\n );\n };\n\n public override componentDidMount() {\n this._isMounted = true;\n void this.setStateFromProps();\n }\n\n public override componentWillUnmount() {\n this._isMounted = false;\n }\n\n public override componentDidUpdate(prevProps: PropertyEditorProps) {\n if (this.props.propertyRecord !== prevProps.propertyRecord) {\n void this.setStateFromProps();\n }\n }\n\n private async setStateFromProps() {\n const record = this.props.propertyRecord;\n let initialValue = 0;\n\n if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n initialValue = record.value.value as number;\n }\n\n const readonly =\n record && undefined !== record.isReadonly ? record.isReadonly : false;\n const isDisabled = record ? record.isDisabled : undefined;\n\n if (this._isMounted)\n this.setState({ weightValue: initialValue, readonly, isDisabled }, () => {\n if (this.props.setFocus) {\n this.setFocus();\n }\n });\n }\n\n public override render() {\n return (\n <div\n className={classnames(\"components-weight-editor\", this.props.className)}\n style={this.props.style}\n ref={this._divElement}\n >\n <WeightPickerButton\n ref={(control) => (this._control = control)}\n activeWeight={this.state.weightValue}\n weights={\n this._availableWeights.length > 0\n ? this._availableWeights\n : undefined\n }\n disabled={this.state.isDisabled ? true : false}\n readonly={this.state.readonly}\n onLineWeightPick={this._onLineWeightPick}\n data-testid=\"components-weight-editor\"\n />\n </div>\n );\n }\n}\n\n/** Weight Property Editor registered for the \"number\" type name and \"weight-picker\" editor name.\n * It uses the [[WeightEditor]] React component.\n * @public\n */\nexport class WeightPropertyEditor extends PropertyEditorBase {\n public get reactNode(): React.ReactNode {\n return <WeightEditor />;\n }\n}\n\nPropertyEditorManager.registerEditor(\n StandardTypeNames.Number,\n WeightPropertyEditor,\n StandardEditorNames.WeightPicker\n);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuantityInput.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/inputs/QuantityInput.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"QuantityInput.d.ts","sourceRoot":"","sources":["../../../../src/imodel-components-react/inputs/QuantityInput.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAI5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;GAEG;AAEH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,8HAA8H;IAC9H,YAAY,EAAE,MAAM,CAAC;IACrB,oCAAoC;IACpC,YAAY,EAAE,eAAe,CAAC;IAC9B,4GAA4G;IAC5G,gBAAgB,EAAE,CAAC,gBAAgB,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,iDAAiD;IACjD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,KAAK,EACL,gBAAgB,EAChB,GAAG,GACJ,EAAE,aAAa,qBAiGf"}
|
|
@@ -74,27 +74,19 @@ function QuantityInput({ initialValue, quantityType, readonly, className, style,
|
|
|
74
74
|
}, [parserSpec, translate]);
|
|
75
75
|
const classNames = (0, classnames_1.default)(className, "components-quantity-input");
|
|
76
76
|
React.useEffect(() => {
|
|
77
|
-
|
|
77
|
+
return core_frontend_1.IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.addListener(() => {
|
|
78
78
|
setFormatterSpec(core_frontend_1.IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType));
|
|
79
79
|
setParserSpec(core_frontend_1.IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
|
|
80
|
-
};
|
|
81
|
-
core_frontend_1.IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.addListener(handleUnitSystemChanged);
|
|
82
|
-
return () => {
|
|
83
|
-
core_frontend_1.IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.removeListener(handleUnitSystemChanged);
|
|
84
|
-
};
|
|
80
|
+
});
|
|
85
81
|
}, [quantityType]);
|
|
86
82
|
React.useEffect(() => {
|
|
87
|
-
|
|
83
|
+
return core_frontend_1.IModelApp.quantityFormatter.onQuantityFormatsChanged.addListener((args) => {
|
|
88
84
|
const quantityKey = core_frontend_1.IModelApp.quantityFormatter.getQuantityTypeKey(quantityType);
|
|
89
85
|
if (args.quantityType === quantityKey) {
|
|
90
86
|
setFormatterSpec(core_frontend_1.IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType));
|
|
91
87
|
setParserSpec(core_frontend_1.IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
|
|
92
88
|
}
|
|
93
|
-
};
|
|
94
|
-
core_frontend_1.IModelApp.quantityFormatter.onQuantityFormatsChanged.addListener(handleUnitSystemChanged);
|
|
95
|
-
return () => {
|
|
96
|
-
core_frontend_1.IModelApp.quantityFormatter.onQuantityFormatsChanged.removeListener(handleUnitSystemChanged);
|
|
97
|
-
};
|
|
89
|
+
});
|
|
98
90
|
}, [quantityType]);
|
|
99
91
|
return (React.createElement(components_react_1.ParsedInput, { "data-testid": "components-quantity-input", ref: ref, style: style, className: classNames, onChange: onQuantityChange, initialValue: initialValue, readonly: readonly, formatValue: formatValue, parseString: parseString }));
|
|
100
92
|
}
|