@itwin/core-react 4.9.0-dev.1 → 4.9.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 +28 -1
- package/ContributeGuidelines.md +2 -3
- package/lib/cjs/core-react/autosuggest/AutoSuggest.d.ts.map +1 -1
- package/lib/cjs/core-react/autosuggest/AutoSuggest.js +3 -8
- package/lib/cjs/core-react/autosuggest/AutoSuggest.js.map +1 -1
- package/lib/cjs/core-react/autosuggest/AutoSuggest.scss +1 -1
- package/lib/cjs/core-react/badge/BetaBadge.d.ts +2 -2
- package/lib/cjs/core-react/badge/BetaBadge.d.ts.map +1 -1
- package/lib/cjs/core-react/badge/NewBadge.d.ts +2 -2
- package/lib/cjs/core-react/badge/NewBadge.d.ts.map +1 -1
- package/lib/cjs/core-react/base/Centered.d.ts +2 -2
- package/lib/cjs/core-react/base/Centered.d.ts.map +1 -1
- package/lib/cjs/core-react/base/Div.d.ts +2 -2
- package/lib/cjs/core-react/base/Div.d.ts.map +1 -1
- package/lib/cjs/core-react/base/DivWithOutsideClick.d.ts +2 -2
- package/lib/cjs/core-react/base/FillCentered.d.ts +2 -2
- package/lib/cjs/core-react/base/FillCentered.d.ts.map +1 -1
- package/lib/cjs/core-react/base/FlexWrapContainer.d.ts +2 -2
- package/lib/cjs/core-react/base/FlexWrapContainer.d.ts.map +1 -1
- package/lib/cjs/core-react/base/Gap.d.ts +2 -2
- package/lib/cjs/core-react/base/Gap.d.ts.map +1 -1
- package/lib/cjs/core-react/base/ScrollView.d.ts +2 -2
- package/lib/cjs/core-react/base/ScrollView.d.ts.map +1 -1
- package/lib/cjs/core-react/button/UnderlinedButton.d.ts +1 -1
- package/lib/cjs/core-react/button/UnderlinedButton.d.ts.map +1 -1
- package/lib/cjs/core-react/checklistbox/CheckListBox.d.ts +3 -3
- package/lib/cjs/core-react/checklistbox/CheckListBox.d.ts.map +1 -1
- package/lib/cjs/core-react/checklistbox/CheckListBox.js +1 -4
- package/lib/cjs/core-react/checklistbox/CheckListBox.js.map +1 -1
- package/lib/cjs/core-react/classes.scss +1 -0
- package/lib/cjs/core-react/colorvariables.scss +1 -1
- package/lib/cjs/core-react/contextmenu/ContextSubMenu.js +3 -3
- package/lib/cjs/core-react/contextmenu/ContextSubMenu.js.map +1 -1
- package/lib/cjs/core-react/contextmenu/GlobalContextMenu.js +2 -2
- package/lib/cjs/core-react/contextmenu/GlobalContextMenu.js.map +1 -1
- package/lib/cjs/core-react/contextmenu/PopupContextMenu.d.ts +1 -1
- package/lib/cjs/core-react/contextmenu/PopupContextMenu.d.ts.map +1 -1
- package/lib/cjs/core-react/dialog/Dialog.d.ts +14 -5
- package/lib/cjs/core-react/dialog/Dialog.d.ts.map +1 -1
- package/lib/cjs/core-react/dialog/Dialog.js +7 -8
- package/lib/cjs/core-react/dialog/Dialog.js.map +1 -1
- package/lib/cjs/core-react/elementseparator/ElementSeparator.d.ts +2 -2
- package/lib/cjs/core-react/elementseparator/ElementSeparator.d.ts.map +1 -1
- package/lib/cjs/core-react/expandable/ExpandableList.d.ts +1 -0
- package/lib/cjs/core-react/expandable/ExpandableList.d.ts.map +1 -1
- package/lib/cjs/core-react/expandable/ExpandableList.js +1 -0
- package/lib/cjs/core-react/expandable/ExpandableList.js.map +1 -1
- package/lib/cjs/core-react/expandable/ExpandableList.scss +9 -0
- package/lib/cjs/core-react/expandable/classes.scss +9 -0
- package/lib/cjs/core-react/expandable/index.scss +5 -0
- package/lib/cjs/core-react/expandable/list.scss +35 -0
- package/lib/cjs/core-react/focustrap/FocusTrap.d.ts +1 -1
- package/lib/cjs/core-react/focustrap/FocusTrap.d.ts.map +1 -1
- package/lib/cjs/core-react/hocs/withIsPressed.d.ts +2 -2
- package/lib/cjs/core-react/hocs/withOnOutsideClick.d.ts +2 -2
- package/lib/cjs/core-react/hocs/withTimeout.d.ts +2 -2
- package/lib/cjs/core-react/icons/IconComponent.d.ts +1 -1
- package/lib/cjs/core-react/icons/IconComponent.d.ts.map +1 -1
- package/lib/cjs/core-react/icons/SvgPath.d.ts +1 -1
- package/lib/cjs/core-react/icons/WebFontIcon.d.ts +1 -1
- package/lib/cjs/core-react/icons/WebFontIcon.d.ts.map +1 -1
- package/lib/cjs/core-react/imagecheckbox/ImageCheckBox.d.ts +1 -1
- package/lib/cjs/core-react/imagecheckbox/ImageCheckBox.d.ts.map +1 -1
- package/lib/cjs/core-react/imagecheckbox/ImageCheckBox.js +1 -2
- package/lib/cjs/core-react/imagecheckbox/ImageCheckBox.js.map +1 -1
- package/lib/cjs/core-react/index.scss +1 -0
- package/lib/cjs/core-react/inputs/iconinput/IconInput.d.ts.map +1 -1
- package/lib/cjs/core-react/inputs/iconinput/IconInput.js +2 -2
- package/lib/cjs/core-react/inputs/iconinput/IconInput.js.map +1 -1
- package/lib/cjs/core-react/inputs/iconinput/IconInput.scss +1 -1
- package/lib/cjs/core-react/inputs/input.scss +5 -1
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.d.ts +1 -3
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.d.ts.map +1 -1
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.js +2 -2
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.js.map +1 -1
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.scss +1 -1
- package/lib/cjs/core-react/listbox/Listbox.d.ts +2 -2
- package/lib/cjs/core-react/listbox/Listbox.d.ts.map +1 -1
- package/lib/cjs/core-react/loading/LoadingBar.d.ts +1 -1
- package/lib/cjs/core-react/loading/LoadingPrompt.d.ts +1 -1
- package/lib/cjs/core-react/loading/LoadingSpinner.d.ts +2 -4
- package/lib/cjs/core-react/loading/LoadingSpinner.d.ts.map +1 -1
- package/lib/cjs/core-react/loading/LoadingSpinner.js.map +1 -1
- package/lib/cjs/core-react/loading/LoadingStatus.d.ts +1 -1
- package/lib/cjs/core-react/notification/MessageRenderer.d.ts +2 -2
- package/lib/cjs/core-react/notification/MessageRenderer.d.ts.map +1 -1
- package/lib/cjs/core-react/popup/Popup.d.ts +1 -0
- package/lib/cjs/core-react/popup/Popup.d.ts.map +1 -1
- package/lib/cjs/core-react/popup/Popup.js +28 -8
- package/lib/cjs/core-react/popup/Popup.js.map +1 -1
- package/lib/cjs/core-react/settings/SettingsContainer.d.ts +2 -2
- package/lib/cjs/core-react/settings/SettingsContainer.d.ts.map +1 -1
- package/lib/cjs/core-react/tabs/VerticalTabs.d.ts +2 -2
- package/lib/cjs/core-react/tabs/VerticalTabs.d.ts.map +1 -1
- package/lib/cjs/core-react/text/BlockText.d.ts +2 -2
- package/lib/cjs/core-react/text/BlockText.d.ts.map +1 -1
- package/lib/cjs/core-react/text/BodyText.d.ts +2 -2
- package/lib/cjs/core-react/text/BodyText.d.ts.map +1 -1
- package/lib/cjs/core-react/text/DisabledText.d.ts +5 -2
- package/lib/cjs/core-react/text/DisabledText.d.ts.map +1 -1
- package/lib/cjs/core-react/text/FilteredText.d.ts +1 -1
- package/lib/cjs/core-react/text/FilteredText.d.ts.map +1 -1
- package/lib/cjs/core-react/text/MutedText.d.ts +2 -2
- package/lib/cjs/core-react/text/MutedText.d.ts.map +1 -1
- package/lib/cjs/core-react/text/StyledText.d.ts +2 -2
- package/lib/cjs/core-react/text/StyledText.d.ts.map +1 -1
- package/lib/cjs/core-react/tree/Branch.d.ts +1 -1
- package/lib/cjs/core-react/tree/ExpansionToggle.d.ts +1 -1
- package/lib/cjs/core-react/tree/Node.d.ts +2 -4
- package/lib/cjs/core-react/tree/Node.d.ts.map +1 -1
- package/lib/cjs/core-react/tree/Node.js +1 -1
- package/lib/cjs/core-react/tree/Node.js.map +1 -1
- package/lib/cjs/core-react/tree/Node.scss +1 -1
- package/lib/cjs/core-react/tree/Placeholder.d.ts +1 -1
- package/lib/cjs/core-react/tree/Tree.d.ts +1 -1
- package/lib/cjs/core-react/utils/hooks/useDisposable.d.ts +2 -0
- package/lib/cjs/core-react/utils/hooks/useDisposable.d.ts.map +1 -1
- package/lib/cjs/core-react/utils/hooks/useDisposable.js +22 -11
- package/lib/cjs/core-react/utils/hooks/useDisposable.js.map +1 -1
- package/lib/cjs/core-react/utils/hooks/useResizeObserver.d.ts +1 -1
- package/lib/cjs/core-react/utils/hooks/useResizeObserver.d.ts.map +1 -1
- package/lib/esm/core-react/autosuggest/AutoSuggest.d.ts.map +1 -1
- package/lib/esm/core-react/autosuggest/AutoSuggest.js +3 -8
- package/lib/esm/core-react/autosuggest/AutoSuggest.js.map +1 -1
- package/lib/esm/core-react/autosuggest/AutoSuggest.scss +1 -1
- package/lib/esm/core-react/badge/BetaBadge.d.ts +2 -2
- package/lib/esm/core-react/badge/BetaBadge.d.ts.map +1 -1
- package/lib/esm/core-react/badge/NewBadge.d.ts +2 -2
- package/lib/esm/core-react/badge/NewBadge.d.ts.map +1 -1
- package/lib/esm/core-react/base/Centered.d.ts +2 -2
- package/lib/esm/core-react/base/Centered.d.ts.map +1 -1
- package/lib/esm/core-react/base/Div.d.ts +2 -2
- package/lib/esm/core-react/base/Div.d.ts.map +1 -1
- package/lib/esm/core-react/base/DivWithOutsideClick.d.ts +2 -2
- package/lib/esm/core-react/base/FillCentered.d.ts +2 -2
- package/lib/esm/core-react/base/FillCentered.d.ts.map +1 -1
- package/lib/esm/core-react/base/FlexWrapContainer.d.ts +2 -2
- package/lib/esm/core-react/base/FlexWrapContainer.d.ts.map +1 -1
- package/lib/esm/core-react/base/Gap.d.ts +2 -2
- package/lib/esm/core-react/base/Gap.d.ts.map +1 -1
- package/lib/esm/core-react/base/ScrollView.d.ts +2 -2
- package/lib/esm/core-react/base/ScrollView.d.ts.map +1 -1
- package/lib/esm/core-react/button/UnderlinedButton.d.ts +1 -1
- package/lib/esm/core-react/button/UnderlinedButton.d.ts.map +1 -1
- package/lib/esm/core-react/checklistbox/CheckListBox.d.ts +3 -3
- package/lib/esm/core-react/checklistbox/CheckListBox.d.ts.map +1 -1
- package/lib/esm/core-react/checklistbox/CheckListBox.js +1 -4
- package/lib/esm/core-react/checklistbox/CheckListBox.js.map +1 -1
- package/lib/esm/core-react/classes.scss +1 -0
- package/lib/esm/core-react/colorvariables.scss +1 -1
- package/lib/esm/core-react/contextmenu/ContextSubMenu.js +3 -3
- package/lib/esm/core-react/contextmenu/ContextSubMenu.js.map +1 -1
- package/lib/esm/core-react/contextmenu/GlobalContextMenu.js +2 -2
- package/lib/esm/core-react/contextmenu/GlobalContextMenu.js.map +1 -1
- package/lib/esm/core-react/contextmenu/PopupContextMenu.d.ts +1 -1
- package/lib/esm/core-react/contextmenu/PopupContextMenu.d.ts.map +1 -1
- package/lib/esm/core-react/dialog/Dialog.d.ts +14 -5
- package/lib/esm/core-react/dialog/Dialog.d.ts.map +1 -1
- package/lib/esm/core-react/dialog/Dialog.js +6 -7
- package/lib/esm/core-react/dialog/Dialog.js.map +1 -1
- package/lib/esm/core-react/elementseparator/ElementSeparator.d.ts +2 -2
- package/lib/esm/core-react/elementseparator/ElementSeparator.d.ts.map +1 -1
- package/lib/esm/core-react/expandable/ExpandableList.d.ts +1 -0
- package/lib/esm/core-react/expandable/ExpandableList.d.ts.map +1 -1
- package/lib/esm/core-react/expandable/ExpandableList.js +1 -0
- package/lib/esm/core-react/expandable/ExpandableList.js.map +1 -1
- package/lib/esm/core-react/expandable/ExpandableList.scss +9 -0
- package/lib/esm/core-react/expandable/classes.scss +9 -0
- package/lib/esm/core-react/expandable/index.scss +5 -0
- package/lib/esm/core-react/expandable/list.scss +35 -0
- package/lib/esm/core-react/focustrap/FocusTrap.d.ts +1 -1
- package/lib/esm/core-react/focustrap/FocusTrap.d.ts.map +1 -1
- package/lib/esm/core-react/hocs/withIsPressed.d.ts +2 -2
- package/lib/esm/core-react/hocs/withOnOutsideClick.d.ts +2 -2
- package/lib/esm/core-react/hocs/withTimeout.d.ts +2 -2
- package/lib/esm/core-react/icons/IconComponent.d.ts +1 -1
- package/lib/esm/core-react/icons/IconComponent.d.ts.map +1 -1
- package/lib/esm/core-react/icons/SvgPath.d.ts +1 -1
- package/lib/esm/core-react/icons/WebFontIcon.d.ts +1 -1
- package/lib/esm/core-react/icons/WebFontIcon.d.ts.map +1 -1
- package/lib/esm/core-react/imagecheckbox/ImageCheckBox.d.ts +1 -1
- package/lib/esm/core-react/imagecheckbox/ImageCheckBox.d.ts.map +1 -1
- package/lib/esm/core-react/imagecheckbox/ImageCheckBox.js +1 -2
- package/lib/esm/core-react/imagecheckbox/ImageCheckBox.js.map +1 -1
- package/lib/esm/core-react/index.scss +1 -0
- package/lib/esm/core-react/inputs/iconinput/IconInput.d.ts.map +1 -1
- package/lib/esm/core-react/inputs/iconinput/IconInput.js +2 -2
- package/lib/esm/core-react/inputs/iconinput/IconInput.js.map +1 -1
- package/lib/esm/core-react/inputs/iconinput/IconInput.scss +1 -1
- package/lib/esm/core-react/inputs/input.scss +5 -1
- package/lib/esm/core-react/inputs/numberinput/NumberInput.d.ts +1 -3
- package/lib/esm/core-react/inputs/numberinput/NumberInput.d.ts.map +1 -1
- package/lib/esm/core-react/inputs/numberinput/NumberInput.js +2 -2
- package/lib/esm/core-react/inputs/numberinput/NumberInput.js.map +1 -1
- package/lib/esm/core-react/inputs/numberinput/NumberInput.scss +1 -1
- package/lib/esm/core-react/listbox/Listbox.d.ts +2 -2
- package/lib/esm/core-react/listbox/Listbox.d.ts.map +1 -1
- package/lib/esm/core-react/loading/LoadingBar.d.ts +1 -1
- package/lib/esm/core-react/loading/LoadingPrompt.d.ts +1 -1
- package/lib/esm/core-react/loading/LoadingSpinner.d.ts +2 -4
- package/lib/esm/core-react/loading/LoadingSpinner.d.ts.map +1 -1
- package/lib/esm/core-react/loading/LoadingSpinner.js.map +1 -1
- package/lib/esm/core-react/loading/LoadingStatus.d.ts +1 -1
- package/lib/esm/core-react/notification/MessageRenderer.d.ts +2 -2
- package/lib/esm/core-react/notification/MessageRenderer.d.ts.map +1 -1
- package/lib/esm/core-react/popup/Popup.d.ts +1 -0
- package/lib/esm/core-react/popup/Popup.d.ts.map +1 -1
- package/lib/esm/core-react/popup/Popup.js +28 -8
- package/lib/esm/core-react/popup/Popup.js.map +1 -1
- package/lib/esm/core-react/settings/SettingsContainer.d.ts +2 -2
- package/lib/esm/core-react/settings/SettingsContainer.d.ts.map +1 -1
- package/lib/esm/core-react/tabs/VerticalTabs.d.ts +2 -2
- package/lib/esm/core-react/tabs/VerticalTabs.d.ts.map +1 -1
- package/lib/esm/core-react/text/BlockText.d.ts +2 -2
- package/lib/esm/core-react/text/BlockText.d.ts.map +1 -1
- package/lib/esm/core-react/text/BodyText.d.ts +2 -2
- package/lib/esm/core-react/text/BodyText.d.ts.map +1 -1
- package/lib/esm/core-react/text/DisabledText.d.ts +5 -2
- package/lib/esm/core-react/text/DisabledText.d.ts.map +1 -1
- package/lib/esm/core-react/text/FilteredText.d.ts +1 -1
- package/lib/esm/core-react/text/FilteredText.d.ts.map +1 -1
- package/lib/esm/core-react/text/MutedText.d.ts +2 -2
- package/lib/esm/core-react/text/MutedText.d.ts.map +1 -1
- package/lib/esm/core-react/text/StyledText.d.ts +2 -2
- package/lib/esm/core-react/text/StyledText.d.ts.map +1 -1
- package/lib/esm/core-react/tree/Branch.d.ts +1 -1
- package/lib/esm/core-react/tree/ExpansionToggle.d.ts +1 -1
- package/lib/esm/core-react/tree/Node.d.ts +2 -4
- package/lib/esm/core-react/tree/Node.d.ts.map +1 -1
- package/lib/esm/core-react/tree/Node.js +1 -1
- package/lib/esm/core-react/tree/Node.js.map +1 -1
- package/lib/esm/core-react/tree/Node.scss +1 -1
- package/lib/esm/core-react/tree/Placeholder.d.ts +1 -1
- package/lib/esm/core-react/tree/Tree.d.ts +1 -1
- package/lib/esm/core-react/utils/hooks/useDisposable.d.ts +2 -0
- package/lib/esm/core-react/utils/hooks/useDisposable.d.ts.map +1 -1
- package/lib/esm/core-react/utils/hooks/useDisposable.js +22 -11
- package/lib/esm/core-react/utils/hooks/useDisposable.js.map +1 -1
- package/lib/esm/core-react/utils/hooks/useResizeObserver.d.ts +1 -1
- package/lib/esm/core-react/utils/hooks/useResizeObserver.d.ts.map +1 -1
- package/package.json +10 -11
|
@@ -13,10 +13,10 @@ import { Input } from "../Input"; // NEEDSWORK - for nativeKeyHandler
|
|
|
13
13
|
* @public
|
|
14
14
|
*/
|
|
15
15
|
const ForwardRefIconInput = React.forwardRef(function ForwardRefIconInput(props, ref) {
|
|
16
|
-
const {
|
|
16
|
+
const { icon, containerClassName, size, ...otherProps } = props;
|
|
17
17
|
// NEEDSWORK: still using core-react Input component because of `nativeKeyHandler` prop
|
|
18
18
|
return (React.createElement("div", { className: classnames("core-iconInput-container", containerClassName) },
|
|
19
|
-
React.createElement(Input, { ref: ref,
|
|
19
|
+
React.createElement(Input, { ref: ref, ...otherProps }),
|
|
20
20
|
React.createElement("div", { className: "core-iconInput-icon" }, icon)));
|
|
21
21
|
});
|
|
22
22
|
/** Input component with icon to the left of the input field
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/iconinput/IconInput.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAC1B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC,CAAC,mCAAmC;AAgBrE;;GAEG;AACH,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,SAAS,mBAAmB,CAAC,KAAK,EAAE,GAAG;IACrC,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/iconinput/IconInput.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAC1B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC,CAAC,mCAAmC;AAgBrE;;GAEG;AACH,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,SAAS,mBAAmB,CAAC,KAAK,EAAE,GAAG;IACrC,MAAM,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IAEhE,uFAAuF;IACvF,OAAO,CACL,6BACE,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE,kBAAkB,CAAC;QAErE,oBAAC,KAAK,IAAC,GAAG,EAAE,GAAG,KAAM,UAAU,GAAI;QACnC,6BAAK,SAAS,EAAC,qBAAqB,IAAE,IAAI,CAAO,CAC7C,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,SAAS,GACpB,mBAAmB,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 Inputs\n */\n\nimport \"./IconInput.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { InputProps } from \"../Input\";\nimport { Input } from \"../Input\"; // NEEDSWORK - for nativeKeyHandler\n\n/** Properties for the [[IconInput]] component\n * @public\n */\nexport interface IconInputProps extends Omit<InputProps, \"size\"> {\n /** Icon displayed to the left of the Input field within the IconInput component */\n icon: React.ReactNode;\n /** CSS class name for the IconInput component container div */\n containerClassName?: string;\n /** Provides ability to return reference to HTMLInputElement */\n ref?: React.Ref<HTMLInputElement>;\n /** Modify size of the input. */\n size?: \"small\" | \"large\";\n}\n\n/** Input component with icon to the left of the input field\n * @public\n */\nconst ForwardRefIconInput = React.forwardRef<HTMLInputElement, IconInputProps>(\n function ForwardRefIconInput(props, ref) {\n const { icon, containerClassName, size, ...otherProps } = props;\n\n // NEEDSWORK: still using core-react Input component because of `nativeKeyHandler` prop\n return (\n <div\n className={classnames(\"core-iconInput-container\", containerClassName)}\n >\n <Input ref={ref} {...otherProps} />\n <div className=\"core-iconInput-icon\">{icon}</div>\n </div>\n );\n }\n);\n\n/** Input component with icon to the left of the input field\n * @public\n */\nexport const IconInput: (props: IconInputProps) => React.ReactElement | null =\n ForwardRefIconInput;\n"]}
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
@mixin uicore-inputs-input {
|
|
9
9
|
display: block;
|
|
10
10
|
width: 100%;
|
|
11
|
-
padding: $uicore-
|
|
11
|
+
padding: $uicore-inputs-padding-bordered $uicore-bordered-padding;
|
|
12
12
|
margin: $uicore-inputs-margin 0;
|
|
13
13
|
font-family: var(--iui-font-sans);
|
|
14
14
|
font-size: var(--iui-font-size-1);
|
|
@@ -51,4 +51,8 @@
|
|
|
51
51
|
border-color: $buic-foreground-focus-border;
|
|
52
52
|
box-shadow: $uicore-inputs-focus-boxshadow;
|
|
53
53
|
}
|
|
54
|
+
|
|
55
|
+
&.iui-input {
|
|
56
|
+
padding: $uicore-iui-input-padding;
|
|
57
|
+
}
|
|
54
58
|
}
|
|
@@ -3,8 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import "./NumberInput.scss";
|
|
5
5
|
import * as React from "react";
|
|
6
|
-
import {
|
|
7
|
-
type InputProps = React.ComponentPropsWithoutRef<typeof Input>;
|
|
6
|
+
import type { InputProps } from "@itwin/itwinui-react";
|
|
8
7
|
/** Step function prototype for [[NumberInput]] component
|
|
9
8
|
* @public
|
|
10
9
|
*/
|
|
@@ -49,5 +48,4 @@ export interface NumberInputProps extends Omit<InputProps, "min" | "max" | "step
|
|
|
49
48
|
* @public
|
|
50
49
|
*/
|
|
51
50
|
export declare const NumberInput: (props: NumberInputProps) => React.ReactElement | null;
|
|
52
|
-
export {};
|
|
53
51
|
//# sourceMappingURL=NumberInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../../../src/core-react/inputs/numberinput/NumberInput.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../../../src/core-react/inputs/numberinput/NumberInput.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAUvD;;GAEG;AACH,MAAM,MAAM,gBAAgB,GACxB,MAAM,GACN,CAAC,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,UAAU,CAAC;IAC7D,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yCAAyC;IACzC,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,iDAAiD;IACjD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6DAA6D;IAC7D,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kHAAkH;IAClH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0BAA0B;IAC1B,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACrD,sJAAsJ;IACtJ,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,cAAc,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5E,0HAA0H;IAC1H,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IACpE,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+DAA+D;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAuQD;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,CACxB,KAAK,EAAE,gBAAgB,KACpB,KAAK,CAAC,YAAY,GAAG,IAA4B,CAAC"}
|
|
@@ -13,7 +13,7 @@ import { Input } from "@itwin/itwinui-react";
|
|
|
13
13
|
import { Icon } from "../../icons/IconComponent";
|
|
14
14
|
import { SvgCaretDown, SvgCaretDownSmall, SvgCaretUp, SvgCaretUpSmall, } from "@itwin/itwinui-icons-react";
|
|
15
15
|
const ForwardRefNumberInput = React.forwardRef(function ForwardRefNumberInput(props, ref) {
|
|
16
|
-
const { containerClassName,
|
|
16
|
+
const { containerClassName, value, min, max, precision, format, parse, onChange, onBlur, onKeyDown, step, snap, showTouchButtons, containerStyle, isControlled, ...otherProps } = props;
|
|
17
17
|
const currentValueRef = React.useRef(value);
|
|
18
18
|
/**
|
|
19
19
|
* Used internally to parse the argument x to it's numeric representation.
|
|
@@ -146,7 +146,7 @@ const ForwardRefNumberInput = React.forwardRef(function ForwardRefNumberInput(pr
|
|
|
146
146
|
const caretUp = showTouchButtons ? React.createElement(SvgCaretUp, null) : React.createElement(SvgCaretUpSmall, null);
|
|
147
147
|
const caretDown = showTouchButtons ? React.createElement(SvgCaretDown, null) : React.createElement(SvgCaretDownSmall, null);
|
|
148
148
|
return (React.createElement("div", { className: containerClasses, style: containerStyle },
|
|
149
|
-
React.createElement(Input, { ref: ref, value: formattedValue, onChange: handleChange, onKeyDown: handleKeyDown, onFocus: handleFocus, onBlur: handleBlur, size: "small",
|
|
149
|
+
React.createElement(Input, { ref: ref, value: formattedValue, onChange: handleChange, onKeyDown: handleKeyDown, onFocus: handleFocus, onBlur: handleBlur, size: "small", ...otherProps }),
|
|
150
150
|
React.createElement("div", { className: classnames("core-number-input-buttons-container", showTouchButtons && "core-number-buttons-for-touch") },
|
|
151
151
|
React.createElement("div", { className: "core-number-input-button core-number-input-button-up", tabIndex: -1, onClick: handleUpClick, role: "presentation" },
|
|
152
152
|
React.createElement(Icon, { iconSpec: caretUp })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/numberinput/NumberInput.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 Inputs\n */\n\nimport \"./NumberInput.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport { Icon } from \"../../icons/IconComponent\";\nimport {\n SvgCaretDown,\n SvgCaretDownSmall,\n SvgCaretUp,\n SvgCaretUpSmall,\n} from \"@itwin/itwinui-icons-react\";\n\ntype InputProps = React.ComponentPropsWithoutRef<typeof Input>;\n\n/** Step function prototype for [[NumberInput]] component\n * @public\n */\nexport type StepFunctionProp =\n | number\n | ((direction: string) => number | undefined);\n\n/** Properties for the [[NumberInput]] component\n * @public\n */\nexport interface NumberInputProps\n extends Omit<InputProps, \"min\" | \"max\" | \"step\" | \"onChange\"> {\n /** Numeric value, set to `undefined` to show placeholder text */\n value?: number;\n /** CSS class name for the NumberInput component container div */\n containerClassName?: string;\n /** Style for component container div. */\n containerStyle?: React.CSSProperties;\n /** number or function\tNumber.MIN_SAFE_INTEGER */\n min?: number;\n /** number or function\tdefaults to Number.MAX_SAFE_INTEGER */\n max?: number;\n /** increment step value used while incrementing or decrementing (up/down buttons or arrow keys) defaults to 1. */\n step?: StepFunctionProp;\n /** number of decimal places, defaults to 0 */\n precision?: number;\n /** function parseFloat */\n parse?: (value: string) => number | null | undefined;\n /** function optional formatting function that takes the number value and the internal formatted value in case function just adds prefix or suffix. */\n format?: (num: number | null | undefined, formattedValue: string) => string;\n /** Set to true to \"snap\" to the closest step value while incrementing or decrementing (up/down buttons or arrow keys). */\n snap?: boolean;\n /** Function to call when value is changed. */\n onChange?: (value: number | undefined, stringValue: string) => void;\n /** if true up/down buttons are shown larger and side by side */\n showTouchButtons?: boolean;\n /** Provides ability to return reference to HTMLInputElement */\n ref?: React.Ref<HTMLInputElement>;\n /**\n * Makes this component behave as controlled component.\n * @internal\n */\n isControlled?: boolean;\n}\n\nconst ForwardRefNumberInput = React.forwardRef<\n HTMLInputElement,\n NumberInputProps\n>(function ForwardRefNumberInput(props, ref) {\n const {\n containerClassName,\n className,\n value,\n min,\n max,\n precision,\n format,\n parse,\n onChange,\n onBlur,\n onKeyDown,\n step,\n snap,\n showTouchButtons,\n containerStyle,\n isControlled,\n ...otherProps\n } = props;\n const currentValueRef = React.useRef(value);\n\n /**\n * Used internally to parse the argument x to it's numeric representation.\n * If the argument cannot be converted to finite number returns 0; If a\n * \"precision\" prop is specified uses it round the number with that\n * precision (no fixed precision here because the return value is float, not\n * string).\n */\n const parseInternal = React.useCallback(\n (x: string) => {\n let n: number | undefined | null;\n\n if (parse) n = parse(x);\n if (undefined === n || null === n) {\n n = parseFloat(x);\n if (isNaN(n) || !isFinite(n)) {\n n = 0;\n }\n }\n\n const localPrecision = undefined === precision ? 10 : precision;\n const q = Math.pow(10, localPrecision);\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n n = Math.min(Math.max(n, localMin), localMax);\n n = Math.round(n * q) / q;\n\n return n;\n },\n [parse, precision, min, max]\n );\n\n /**\n * This is used internally to format a number to its display representation.\n * It will invoke the format function if one is provided.\n */\n const formatInternal = React.useCallback(\n (num: number | undefined | null) => {\n const localPrecision =\n undefined === precision || null === precision ? 0 : precision;\n const str =\n undefined === num || null === num ? \"\" : num.toFixed(localPrecision);\n\n if (format) return format(num, str);\n\n return str;\n },\n [format, precision]\n );\n\n const [formattedValue, setFormattedValue] = React.useState(() =>\n formatInternal(value)\n );\n\n // See if new initialValue props have changed since component mounted\n React.useEffect(() => {\n currentValueRef.current = value;\n const currentFormattedValue = formatInternal(currentValueRef.current);\n setFormattedValue(currentFormattedValue);\n }, [formatInternal, value]);\n\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newVal = event.currentTarget.value;\n setFormattedValue(newVal);\n isControlled && onChange && onChange(parseInternal(newVal), newVal);\n },\n [isControlled, onChange, parseInternal]\n );\n\n const updateValue = React.useCallback(\n (newVal: number) => {\n const newFormattedVal = formatInternal(newVal);\n onChange && onChange(newVal, newFormattedVal);\n setFormattedValue(newFormattedVal);\n },\n [onChange, formatInternal]\n );\n\n const updateValueFromString = React.useCallback(\n (strValue: string) => {\n const newVal = parseInternal(strValue);\n updateValue(newVal);\n },\n [parseInternal, updateValue]\n );\n\n const handleBlur = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n const newVal = parseInternal(event.target.value);\n onBlur && onBlur(event);\n updateValue(newVal);\n },\n [parseInternal, updateValue, onBlur]\n );\n\n const getIncrementValue = React.useCallback(\n (increment: boolean) => {\n if (typeof step === \"function\") {\n const stepVal = step(increment ? \"up\" : \"down\");\n return stepVal ? stepVal : 1;\n }\n\n return !step ? 1 : step;\n },\n [step]\n );\n\n /**\n * The internal method that actually sets the new value on the input\n */\n const applyStep = React.useCallback(\n (increment: boolean) => {\n const incrementValue = getIncrementValue(increment);\n\n let num =\n parseInternal(formattedValue) +\n (increment ? incrementValue : -incrementValue);\n if (snap) {\n num = Math.round(num / incrementValue) * incrementValue;\n }\n\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n num = Math.min(Math.max(num, localMin), localMax);\n\n updateValue(num);\n },\n [\n formattedValue,\n getIncrementValue,\n max,\n min,\n parseInternal,\n snap,\n updateValue,\n ]\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n // istanbul ignore else\n if (event.key === Key.Enter) {\n updateValueFromString(event.currentTarget.value);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.Escape) {\n setFormattedValue(formatInternal(currentValueRef.current));\n event.preventDefault();\n } else if (event.key === Key.ArrowDown) {\n applyStep(false);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.ArrowUp) {\n applyStep(true);\n event.preventDefault();\n event.stopPropagation();\n }\n onKeyDown && onKeyDown(event);\n },\n [applyStep, formatInternal, updateValueFromString, onKeyDown]\n );\n\n const handleDownClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(false);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleUpClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(true);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n event.currentTarget.select();\n },\n []\n );\n\n const isDisabled = !!otherProps.disabled;\n const containerClasses = classnames(\n \"core-number-input-container\",\n containerClassName,\n showTouchButtons && \"core-number-buttons-for-touch\",\n isDisabled && \"core-number-input-disabled\"\n );\n\n const caretUp = showTouchButtons ? <SvgCaretUp /> : <SvgCaretUpSmall />;\n const caretDown = showTouchButtons ? <SvgCaretDown /> : <SvgCaretDownSmall />;\n\n return (\n <div className={containerClasses} style={containerStyle}>\n <Input\n ref={ref}\n value={formattedValue}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n size=\"small\"\n className={classnames(\"core-input\", className)}\n {...otherProps}\n />\n <div\n className={classnames(\n \"core-number-input-buttons-container\",\n showTouchButtons && \"core-number-buttons-for-touch\"\n )}\n >\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-up\"\n tabIndex={-1}\n onClick={handleUpClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretUp} />\n </div>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-down\"\n tabIndex={-1}\n onClick={handleDownClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretDown} />\n </div>\n </div>\n </div>\n );\n});\n\n/** Input component for numbers with up and down buttons to increment and decrement the value.\n * @public\n */\nexport const NumberInput: (\n props: NumberInputProps\n) => React.ReactElement | null = ForwardRefNumberInput;\n"]}
|
|
1
|
+
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/numberinput/NumberInput.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 Inputs\n */\n\nimport \"./NumberInput.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport type { InputProps } from \"@itwin/itwinui-react\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport { Icon } from \"../../icons/IconComponent\";\nimport {\n SvgCaretDown,\n SvgCaretDownSmall,\n SvgCaretUp,\n SvgCaretUpSmall,\n} from \"@itwin/itwinui-icons-react\";\n\n/** Step function prototype for [[NumberInput]] component\n * @public\n */\nexport type StepFunctionProp =\n | number\n | ((direction: string) => number | undefined);\n\n/** Properties for the [[NumberInput]] component\n * @public\n */\nexport interface NumberInputProps\n extends Omit<InputProps, \"min\" | \"max\" | \"step\" | \"onChange\"> {\n /** Numeric value, set to `undefined` to show placeholder text */\n value?: number;\n /** CSS class name for the NumberInput component container div */\n containerClassName?: string;\n /** Style for component container div. */\n containerStyle?: React.CSSProperties;\n /** number or function\tNumber.MIN_SAFE_INTEGER */\n min?: number;\n /** number or function\tdefaults to Number.MAX_SAFE_INTEGER */\n max?: number;\n /** increment step value used while incrementing or decrementing (up/down buttons or arrow keys) defaults to 1. */\n step?: StepFunctionProp;\n /** number of decimal places, defaults to 0 */\n precision?: number;\n /** function parseFloat */\n parse?: (value: string) => number | null | undefined;\n /** function optional formatting function that takes the number value and the internal formatted value in case function just adds prefix or suffix. */\n format?: (num: number | null | undefined, formattedValue: string) => string;\n /** Set to true to \"snap\" to the closest step value while incrementing or decrementing (up/down buttons or arrow keys). */\n snap?: boolean;\n /** Function to call when value is changed. */\n onChange?: (value: number | undefined, stringValue: string) => void;\n /** if true up/down buttons are shown larger and side by side */\n showTouchButtons?: boolean;\n /** Provides ability to return reference to HTMLInputElement */\n ref?: React.Ref<HTMLInputElement>;\n /**\n * Makes this component behave as controlled component.\n * @internal\n */\n isControlled?: boolean;\n}\n\nconst ForwardRefNumberInput = React.forwardRef<\n HTMLInputElement,\n NumberInputProps\n>(function ForwardRefNumberInput(props, ref) {\n const {\n containerClassName,\n value,\n min,\n max,\n precision,\n format,\n parse,\n onChange,\n onBlur,\n onKeyDown,\n step,\n snap,\n showTouchButtons,\n containerStyle,\n isControlled,\n ...otherProps\n } = props;\n const currentValueRef = React.useRef(value);\n\n /**\n * Used internally to parse the argument x to it's numeric representation.\n * If the argument cannot be converted to finite number returns 0; If a\n * \"precision\" prop is specified uses it round the number with that\n * precision (no fixed precision here because the return value is float, not\n * string).\n */\n const parseInternal = React.useCallback(\n (x: string) => {\n let n: number | undefined | null;\n\n if (parse) n = parse(x);\n if (undefined === n || null === n) {\n n = parseFloat(x);\n if (isNaN(n) || !isFinite(n)) {\n n = 0;\n }\n }\n\n const localPrecision = undefined === precision ? 10 : precision;\n const q = Math.pow(10, localPrecision);\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n n = Math.min(Math.max(n, localMin), localMax);\n n = Math.round(n * q) / q;\n\n return n;\n },\n [parse, precision, min, max]\n );\n\n /**\n * This is used internally to format a number to its display representation.\n * It will invoke the format function if one is provided.\n */\n const formatInternal = React.useCallback(\n (num: number | undefined | null) => {\n const localPrecision =\n undefined === precision || null === precision ? 0 : precision;\n const str =\n undefined === num || null === num ? \"\" : num.toFixed(localPrecision);\n\n if (format) return format(num, str);\n\n return str;\n },\n [format, precision]\n );\n\n const [formattedValue, setFormattedValue] = React.useState(() =>\n formatInternal(value)\n );\n\n // See if new initialValue props have changed since component mounted\n React.useEffect(() => {\n currentValueRef.current = value;\n const currentFormattedValue = formatInternal(currentValueRef.current);\n setFormattedValue(currentFormattedValue);\n }, [formatInternal, value]);\n\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newVal = event.currentTarget.value;\n setFormattedValue(newVal);\n isControlled && onChange && onChange(parseInternal(newVal), newVal);\n },\n [isControlled, onChange, parseInternal]\n );\n\n const updateValue = React.useCallback(\n (newVal: number) => {\n const newFormattedVal = formatInternal(newVal);\n onChange && onChange(newVal, newFormattedVal);\n setFormattedValue(newFormattedVal);\n },\n [onChange, formatInternal]\n );\n\n const updateValueFromString = React.useCallback(\n (strValue: string) => {\n const newVal = parseInternal(strValue);\n updateValue(newVal);\n },\n [parseInternal, updateValue]\n );\n\n const handleBlur = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n const newVal = parseInternal(event.target.value);\n onBlur && onBlur(event);\n updateValue(newVal);\n },\n [parseInternal, updateValue, onBlur]\n );\n\n const getIncrementValue = React.useCallback(\n (increment: boolean) => {\n if (typeof step === \"function\") {\n const stepVal = step(increment ? \"up\" : \"down\");\n return stepVal ? stepVal : 1;\n }\n\n return !step ? 1 : step;\n },\n [step]\n );\n\n /**\n * The internal method that actually sets the new value on the input\n */\n const applyStep = React.useCallback(\n (increment: boolean) => {\n const incrementValue = getIncrementValue(increment);\n\n let num =\n parseInternal(formattedValue) +\n (increment ? incrementValue : -incrementValue);\n if (snap) {\n num = Math.round(num / incrementValue) * incrementValue;\n }\n\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n num = Math.min(Math.max(num, localMin), localMax);\n\n updateValue(num);\n },\n [\n formattedValue,\n getIncrementValue,\n max,\n min,\n parseInternal,\n snap,\n updateValue,\n ]\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n // istanbul ignore else\n if (event.key === Key.Enter) {\n updateValueFromString(event.currentTarget.value);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.Escape) {\n setFormattedValue(formatInternal(currentValueRef.current));\n event.preventDefault();\n } else if (event.key === Key.ArrowDown) {\n applyStep(false);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.ArrowUp) {\n applyStep(true);\n event.preventDefault();\n event.stopPropagation();\n }\n onKeyDown && onKeyDown(event);\n },\n [applyStep, formatInternal, updateValueFromString, onKeyDown]\n );\n\n const handleDownClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(false);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleUpClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(true);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n event.currentTarget.select();\n },\n []\n );\n\n const isDisabled = !!otherProps.disabled;\n const containerClasses = classnames(\n \"core-number-input-container\",\n containerClassName,\n showTouchButtons && \"core-number-buttons-for-touch\",\n isDisabled && \"core-number-input-disabled\"\n );\n\n const caretUp = showTouchButtons ? <SvgCaretUp /> : <SvgCaretUpSmall />;\n const caretDown = showTouchButtons ? <SvgCaretDown /> : <SvgCaretDownSmall />;\n\n return (\n <div className={containerClasses} style={containerStyle}>\n <Input\n ref={ref}\n value={formattedValue}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n size=\"small\"\n {...otherProps}\n />\n <div\n className={classnames(\n \"core-number-input-buttons-container\",\n showTouchButtons && \"core-number-buttons-for-touch\"\n )}\n >\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-up\"\n tabIndex={-1}\n onClick={handleUpClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretUp} />\n </div>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-down\"\n tabIndex={-1}\n onClick={handleDownClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretDown} />\n </div>\n </div>\n </div>\n );\n});\n\n/** Input component for numbers with up and down buttons to increment and decrement the value.\n * @public\n */\nexport const NumberInput: (\n props: NumberInputProps\n) => React.ReactElement | null = ForwardRefNumberInput;\n"]}
|
|
@@ -47,10 +47,10 @@ export declare const ListboxContext: React.Context<ListboxContextProps>;
|
|
|
47
47
|
* Single select `Listbox` component
|
|
48
48
|
* @alpha
|
|
49
49
|
*/
|
|
50
|
-
export declare function Listbox(props: ListboxProps): JSX.Element;
|
|
50
|
+
export declare function Listbox(props: ListboxProps): React.JSX.Element;
|
|
51
51
|
/**
|
|
52
52
|
* `ListboxItem` component.
|
|
53
53
|
* @alpha
|
|
54
54
|
*/
|
|
55
|
-
export declare function ListboxItem(props: ListboxItemProps): JSX.Element;
|
|
55
|
+
export declare function ListboxItem(props: ListboxItemProps): React.JSX.Element;
|
|
56
56
|
//# sourceMappingURL=Listbox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Listbox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,gBAAgB,CAAC;AAGxB,sEAAsE;AAEtE;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC;AAElC;;;GAGG;AACH,MAAM,WAAW,YACf,SAAQ,KAAK,CAAC,iBAAiB,CAC7B,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EACtC,gBAAgB,CACjB;IACD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,oBAAoB,CAAC,EAAE,CACrB,QAAQ,EAAE,YAAY,EACtB,yBAAyB,CAAC,EAAE,OAAO,KAChC,IAAI,CAAC;CACX;AAED;;;GAGG;AACH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,iBAAiB,CAC7B,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC,EACrC,aAAa,CACd;IACD,+BAA+B;IAC/B,KAAK,EAAE,YAAY,CAAC;IACpB,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,oBAAoB,EAAE,CACpB,QAAQ,EAAE,YAAY,EACtB,yBAAyB,CAAC,EAAE,OAAO,KAChC,IAAI,CAAC;IACV,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;CAChD;AAED;;;GAGG;AAEH,eAAO,MAAM,cAAc,oCAEzB,CAAC;AA4DH;;;GAGG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"Listbox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,gBAAgB,CAAC;AAGxB,sEAAsE;AAEtE;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC;AAElC;;;GAGG;AACH,MAAM,WAAW,YACf,SAAQ,KAAK,CAAC,iBAAiB,CAC7B,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EACtC,gBAAgB,CACjB;IACD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,oBAAoB,CAAC,EAAE,CACrB,QAAQ,EAAE,YAAY,EACtB,yBAAyB,CAAC,EAAE,OAAO,KAChC,IAAI,CAAC;CACX;AAED;;;GAGG;AACH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,iBAAiB,CAC7B,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC,EACrC,aAAa,CACd;IACD,+BAA+B;IAC/B,KAAK,EAAE,YAAY,CAAC;IACpB,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,oBAAoB,EAAE,CACpB,QAAQ,EAAE,YAAY,EACtB,yBAAyB,CAAC,EAAE,OAAO,KAChC,IAAI,CAAC;IACV,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;CAChD;AAED;;;GAGG;AAEH,eAAO,MAAM,cAAc,oCAEzB,CAAC;AA4DH;;;GAGG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,qBA6M1C;AAED;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,qBA0DlD"}
|
|
@@ -21,7 +21,7 @@ export interface LoadingBarProps extends CommonProps {
|
|
|
21
21
|
*/
|
|
22
22
|
export declare class LoadingBar extends React.PureComponent<LoadingBarProps> {
|
|
23
23
|
static defaultProps: Partial<LoadingBarProps>;
|
|
24
|
-
render(): JSX.Element;
|
|
24
|
+
render(): React.JSX.Element;
|
|
25
25
|
}
|
|
26
26
|
/** Sanity check to keep percentage between 0 & 100
|
|
27
27
|
* @internal
|
|
@@ -35,6 +35,6 @@ export interface LoadingPromptProps extends CommonProps {
|
|
|
35
35
|
*/
|
|
36
36
|
export declare class LoadingPrompt extends React.PureComponent<LoadingPromptProps> {
|
|
37
37
|
static defaultProps: Partial<LoadingPromptProps>;
|
|
38
|
-
render(): JSX.Element;
|
|
38
|
+
render(): React.JSX.Element;
|
|
39
39
|
}
|
|
40
40
|
//# sourceMappingURL=LoadingPrompt.d.ts.map
|
|
@@ -3,8 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import "./LoadingSpinner.scss";
|
|
5
5
|
import * as React from "react";
|
|
6
|
-
import {
|
|
7
|
-
type ProgressRadialProps = React.ComponentPropsWithoutRef<typeof ProgressRadial>;
|
|
6
|
+
import type { ProgressRadialProps } from "@itwin/itwinui-react";
|
|
8
7
|
/** Type for ProgressRadialProps.size
|
|
9
8
|
* @public
|
|
10
9
|
*/
|
|
@@ -29,7 +28,6 @@ export interface LoadingSpinnerProps extends Omit<ProgressRadialProps, "size"> {
|
|
|
29
28
|
*/
|
|
30
29
|
export declare class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {
|
|
31
30
|
static defaultProps: Partial<LoadingSpinnerProps>;
|
|
32
|
-
render(): JSX.Element;
|
|
31
|
+
render(): React.JSX.Element;
|
|
33
32
|
}
|
|
34
|
-
export {};
|
|
35
33
|
//# sourceMappingURL=LoadingSpinner.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingSpinner.d.ts","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"LoadingSpinner.d.ts","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,mBAAmB,CAAC,MAAM,CAAC,CAAC;AAEzD;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,MAAM,CAAC;IAC5E,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;CACvB;AAED;;;GAGG;AACH,qBAAa,cAAe,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC;IAC1E,OAAc,YAAY,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAEtD;IAEc,MAAM;CAcvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAsBtD;;;GAGG;AACH,MAAa,cAAe,SAAQ,KAAK,CAAC,aAAkC;IAK1D,MAAM;QACpB,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5D,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS;YACrB,OAAO,IAAI,YAAY,IAAI,CAC1B,8BAAM,SAAS,EAAC,gBAAgB,IAAE,OAAO,CAAQ,CAClD;YACD,oBAAC,cAAc,IAAC,IAAI,EAAE,IAAI,KAAM,IAAI,EAAE,aAAa,SAAG;YACrD,OAAO,IAAI,CAAC,YAAY,IAAI,CAC3B,8BAAM,SAAS,EAAC,mBAAmB,IAAE,OAAO,CAAQ,CACrD,CACG,CACP,CAAC;IACJ,CAAC;;AAjBa,2BAAY,GAAiC;IACzD,YAAY,EAAE,KAAK;CACpB,CAAC;SAHS,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 Loading\n */\n\nimport \"./LoadingSpinner.scss\";\nimport * as React from \"react\";\nimport type { ProgressRadialProps } from \"@itwin/itwinui-react\";\nimport { ProgressRadial } from \"@itwin/itwinui-react\";\n\n/** Type for ProgressRadialProps.size\n * @public\n */\nexport type RadialSizeType = ProgressRadialProps[\"size\"];\n\n/** Properties for [[LoadingSpinner]] component\n * @public\n */\nexport interface LoadingSpinnerProps extends Omit<ProgressRadialProps, \"size\"> {\n /** Message (text) displayed */\n message?: string;\n /** Position the message above or below the spinner (defaults to bottom) */\n messageOnTop?: boolean;\n /**\n * Size of the progress indicator. Defaults to medium size.\n * @default ''\n */\n size?: RadialSizeType;\n}\n\n/**\n * A loading spinner component that optionally shows a text message.\n * @public\n */\nexport class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {\n public static defaultProps: Partial<LoadingSpinnerProps> = {\n messageOnTop: false,\n };\n\n public override render() {\n const { message, messageOnTop, size, ...rest } = this.props;\n return (\n <div className=\"core-ls\">\n {message && messageOnTop && (\n <span className=\"ls-message-top\">{message}</span>\n )}\n <ProgressRadial size={size} {...rest} indeterminate />\n {message && !messageOnTop && (\n <span className=\"ls-message-bottom\">{message}</span>\n )}\n </div>\n );\n }\n}\n"]}
|
|
@@ -20,6 +20,6 @@ export interface LoadingStatusProps extends CommonProps {
|
|
|
20
20
|
export declare class LoadingStatus extends React.PureComponent<LoadingStatusProps> {
|
|
21
21
|
static defaultProps: Partial<LoadingStatusProps>;
|
|
22
22
|
private inRange;
|
|
23
|
-
render(): JSX.Element;
|
|
23
|
+
render(): React.JSX.Element;
|
|
24
24
|
}
|
|
25
25
|
//# sourceMappingURL=LoadingStatus.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/** @packageDocumentation
|
|
2
2
|
* @module Notification
|
|
3
3
|
*/
|
|
4
|
-
|
|
4
|
+
import * as React from "react";
|
|
5
5
|
import type { MessageType } from "./MessageType";
|
|
6
6
|
import type { ClassNameProps } from "../utils/Props";
|
|
7
7
|
/** Properties for the [[MessageRenderer]] component
|
|
@@ -16,5 +16,5 @@ export interface MessageRendererProps extends ClassNameProps {
|
|
|
16
16
|
/** React component renders a string, HTMLElement or React node in a `div` or `span`
|
|
17
17
|
* @public
|
|
18
18
|
*/
|
|
19
|
-
export declare function MessageRenderer(props: MessageRendererProps): JSX.Element | null;
|
|
19
|
+
export declare function MessageRenderer(props: MessageRendererProps): React.JSX.Element | null;
|
|
20
20
|
//# sourceMappingURL=MessageRenderer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core-react/notification/MessageRenderer.tsx"],"names":[],"mappings":"AAIA;;GAEG
|
|
1
|
+
{"version":3,"file":"MessageRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core-react/notification/MessageRenderer.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAIrD;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,cAAc;IAC1D,wBAAwB;IACxB,OAAO,EAAE,WAAW,CAAC;IACrB,uEAAuE;IACvE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,4BAyF1D"}
|
|
@@ -107,6 +107,7 @@ export declare class Popup extends React.Component<PopupProps, PopupState> {
|
|
|
107
107
|
private _fitPopup;
|
|
108
108
|
private _handleAnimationEnd;
|
|
109
109
|
render(): React.ReactPortal | null;
|
|
110
|
+
private getContainer;
|
|
110
111
|
}
|
|
111
112
|
export {};
|
|
112
113
|
//# sourceMappingURL=Popup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/core-react/popup/Popup.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,cAAc,CAAC;AAEtB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/core-react/popup/Popup.tsx"],"names":[],"mappings":"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"}
|
|
@@ -12,6 +12,7 @@ import * as ReactDOM from "react-dom";
|
|
|
12
12
|
import { Key } from "ts-key-enum";
|
|
13
13
|
import { RelativePosition } from "@itwin/appui-abstract";
|
|
14
14
|
import { FocusTrap } from "../focustrap/FocusTrap";
|
|
15
|
+
import { Rectangle } from "../utils/Rectangle";
|
|
15
16
|
/** Popup React component displays a popup relative to an optional target element.
|
|
16
17
|
* @public
|
|
17
18
|
*/
|
|
@@ -117,13 +118,21 @@ class Popup extends React.Component {
|
|
|
117
118
|
// relative position
|
|
118
119
|
const scrollY = activeWindow.scrollY;
|
|
119
120
|
const scrollX = activeWindow.scrollX;
|
|
120
|
-
const
|
|
121
|
+
const container = this.getContainer();
|
|
122
|
+
const containerBounds = container.getBoundingClientRect();
|
|
123
|
+
const targetRect = Rectangle.create(target.getBoundingClientRect()).offset({
|
|
124
|
+
x: -containerBounds.left,
|
|
125
|
+
y: -containerBounds.top,
|
|
126
|
+
});
|
|
121
127
|
const { popupWidth, popupHeight } = this._getPopupDimensions();
|
|
122
128
|
switch (position) {
|
|
123
129
|
case RelativePosition.Top:
|
|
124
130
|
point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
|
|
125
131
|
point.x =
|
|
126
|
-
scrollX +
|
|
132
|
+
scrollX +
|
|
133
|
+
targetRect.left +
|
|
134
|
+
targetRect.getWidth() / 2 -
|
|
135
|
+
popupWidth / 2;
|
|
127
136
|
break;
|
|
128
137
|
case RelativePosition.TopLeft:
|
|
129
138
|
point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
|
|
@@ -136,7 +145,10 @@ class Popup extends React.Component {
|
|
|
136
145
|
case RelativePosition.Bottom:
|
|
137
146
|
point.y = scrollY + targetRect.bottom + offset + offsetArrow;
|
|
138
147
|
point.x =
|
|
139
|
-
scrollX +
|
|
148
|
+
scrollX +
|
|
149
|
+
targetRect.left +
|
|
150
|
+
targetRect.getWidth() / 2 -
|
|
151
|
+
popupWidth / 2;
|
|
140
152
|
break;
|
|
141
153
|
case RelativePosition.BottomLeft:
|
|
142
154
|
point.y = scrollY + targetRect.bottom + offset + offsetArrow;
|
|
@@ -148,7 +160,10 @@ class Popup extends React.Component {
|
|
|
148
160
|
break;
|
|
149
161
|
case RelativePosition.Left:
|
|
150
162
|
point.y =
|
|
151
|
-
scrollY +
|
|
163
|
+
scrollY +
|
|
164
|
+
targetRect.top +
|
|
165
|
+
targetRect.getHeight() / 2 -
|
|
166
|
+
popupHeight / 2;
|
|
152
167
|
point.x = scrollX + targetRect.left - popupWidth - offset - offsetArrow;
|
|
153
168
|
break;
|
|
154
169
|
case RelativePosition.LeftTop:
|
|
@@ -157,7 +172,10 @@ class Popup extends React.Component {
|
|
|
157
172
|
break;
|
|
158
173
|
case RelativePosition.Right:
|
|
159
174
|
point.y =
|
|
160
|
-
scrollY +
|
|
175
|
+
scrollY +
|
|
176
|
+
targetRect.top +
|
|
177
|
+
targetRect.getHeight() / 2 -
|
|
178
|
+
popupHeight / 2;
|
|
161
179
|
point.x = scrollX + targetRect.right + offset + offsetArrow;
|
|
162
180
|
break;
|
|
163
181
|
case RelativePosition.RightTop:
|
|
@@ -402,7 +420,6 @@ class Popup extends React.Component {
|
|
|
402
420
|
return newPosition;
|
|
403
421
|
}
|
|
404
422
|
render() {
|
|
405
|
-
var _a;
|
|
406
423
|
const animate = this.props.animate !== undefined ? this.props.animate : true;
|
|
407
424
|
const className = classnames("core-popup", this._getClassNameByPosition(this.state.position), this.props.showShadow && "core-popup-shadow", this.props.showArrow && "arrow", !animate && "core-popup-animation-none", this.props.className, this.state.animationEnded && "core-animation-ended", !this.props.isOpen &&
|
|
408
425
|
this.props.keepContentsMounted &&
|
|
@@ -419,9 +436,12 @@ class Popup extends React.Component {
|
|
|
419
436
|
return ReactDOM.createPortal(React.createElement("div", { className: className, "data-testid": "core-popup", ref: (element) => {
|
|
420
437
|
this._popup = element;
|
|
421
438
|
}, style: style, role: role, "aria-modal": true, tabIndex: -1, "aria-label": this.props.ariaLabel, onAnimationEnd: this._handleAnimationEnd },
|
|
422
|
-
React.createElement(FocusTrap, { active: !!this.props.moveFocus, initialFocusElement: this.props.focusTarget, returnFocusOnDeactivate: true }, this.props.children)),
|
|
439
|
+
React.createElement(FocusTrap, { active: !!this.props.moveFocus, initialFocusElement: this.props.focusTarget, returnFocusOnDeactivate: true }, this.props.children)), this.getContainer());
|
|
440
|
+
}
|
|
441
|
+
getContainer() {
|
|
442
|
+
var _a;
|
|
423
443
|
// istanbul ignore next
|
|
424
|
-
(_a = this.state.parentDocument.body.querySelector('[data-root-container="
|
|
444
|
+
return ((_a = this.state.parentDocument.body.querySelector('[data-root-container="iui-root-id"]')) !== null && _a !== void 0 ? _a : this.state.parentDocument.body);
|
|
425
445
|
}
|
|
426
446
|
}
|
|
427
447
|
Popup.defaultProps = {
|