@itwin/core-react 3.0.0-dev.136 → 3.0.0-dev.138
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/lib/cjs/core-react/dialog/DialogButtonDef.d.ts +3 -3
- package/lib/cjs/core-react/dialog/DialogButtonDef.js +2 -2
- package/lib/cjs/core-react/dialog/DialogButtonDef.js.map +1 -1
- package/lib/cjs/core-react/messagebox/MessageSeverity.d.ts +1 -1
- package/lib/cjs/core-react/messagebox/MessageSeverity.js +1 -1
- package/lib/cjs/core-react/messagebox/MessageSeverity.js.map +1 -1
- package/lib/cjs/core-react/select/ThemedSelect.d.ts +1 -1
- package/lib/cjs/core-react/select/ThemedSelect.js +1 -1
- package/lib/cjs/core-react/select/ThemedSelect.js.map +1 -1
- package/lib/cjs/core-react/utils/UiEvent.d.ts +1 -1
- package/lib/cjs/core-react/utils/UiEvent.js +1 -1
- package/lib/cjs/core-react/utils/UiEvent.js.map +1 -1
- package/lib/esm/core-react/dialog/DialogButtonDef.d.ts +3 -3
- package/lib/esm/core-react/dialog/DialogButtonDef.js +2 -2
- package/lib/esm/core-react/dialog/DialogButtonDef.js.map +1 -1
- package/lib/esm/core-react/messagebox/MessageSeverity.d.ts +1 -1
- package/lib/esm/core-react/messagebox/MessageSeverity.js +1 -1
- package/lib/esm/core-react/messagebox/MessageSeverity.js.map +1 -1
- package/lib/esm/core-react/select/ThemedSelect.d.ts +1 -1
- package/lib/esm/core-react/select/ThemedSelect.js +1 -1
- package/lib/esm/core-react/select/ThemedSelect.js.map +1 -1
- package/lib/esm/core-react/utils/UiEvent.d.ts +1 -1
- package/lib/esm/core-react/utils/UiEvent.js +1 -1
- package/lib/esm/core-react/utils/UiEvent.js.map +1 -1
- package/package.json +10 -10
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
/** Enum for button types. Determines button label, and default button style.
|
|
5
5
|
* @public
|
|
6
|
-
* @deprecated Use DialogButtonType
|
|
6
|
+
* @deprecated Use [DialogButtonType]($appui-abstract) instead
|
|
7
7
|
*/
|
|
8
8
|
export declare enum DialogButtonType {
|
|
9
9
|
None = "",
|
|
@@ -18,7 +18,7 @@ export declare enum DialogButtonType {
|
|
|
18
18
|
}
|
|
19
19
|
/** Enum for button style.
|
|
20
20
|
* @public
|
|
21
|
-
* @deprecated Use DialogButtonStyle
|
|
21
|
+
* @deprecated Use [DialogButtonStyle]($appui-abstract) instead
|
|
22
22
|
*/
|
|
23
23
|
export declare enum DialogButtonStyle {
|
|
24
24
|
None = "",
|
|
@@ -28,7 +28,7 @@ export declare enum DialogButtonStyle {
|
|
|
28
28
|
}
|
|
29
29
|
/** Interface for a dialog button in a button cluster
|
|
30
30
|
* @public
|
|
31
|
-
* @deprecated Use DialogButtonDef
|
|
31
|
+
* @deprecated Use [DialogButtonDef]($appui-abstract) instead
|
|
32
32
|
*/
|
|
33
33
|
export interface DialogButtonDef {
|
|
34
34
|
/** type of button */
|
|
@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
10
10
|
exports.DialogButtonStyle = exports.DialogButtonType = void 0;
|
|
11
11
|
/** Enum for button types. Determines button label, and default button style.
|
|
12
12
|
* @public
|
|
13
|
-
* @deprecated Use DialogButtonType
|
|
13
|
+
* @deprecated Use [DialogButtonType]($appui-abstract) instead
|
|
14
14
|
*/
|
|
15
15
|
var DialogButtonType;
|
|
16
16
|
(function (DialogButtonType) {
|
|
@@ -26,7 +26,7 @@ var DialogButtonType;
|
|
|
26
26
|
})(DialogButtonType = exports.DialogButtonType || (exports.DialogButtonType = {}));
|
|
27
27
|
/** Enum for button style.
|
|
28
28
|
* @public
|
|
29
|
-
* @deprecated Use DialogButtonStyle
|
|
29
|
+
* @deprecated Use [DialogButtonStyle]($appui-abstract) instead
|
|
30
30
|
*/
|
|
31
31
|
var DialogButtonStyle;
|
|
32
32
|
(function (DialogButtonStyle) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogButtonDef.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/DialogButtonDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH;;;IAGI;AACJ,IAAY,gBAUX;AAVD,WAAY,gBAAgB;IAC1B,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,6BAAS,CAAA;IACT,qCAAiB,CAAA;IACjB,+BAAW,CAAA;IACX,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,iCAAa,CAAA;IACb,yCAAqB,CAAA;AACvB,CAAC,EAVW,gBAAgB,GAAhB,wBAAgB,KAAhB,wBAAgB,QAU3B;AAED;;;IAGI;AACJ,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,8BAAS,CAAA;IACT,wCAAmB,CAAA;IACnB,2CAAsB,CAAA;IACtB,iDAA4B,CAAA;AAC9B,CAAC,EALW,iBAAiB,GAAjB,yBAAiB,KAAjB,yBAAiB,QAK5B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Enum for button types. Determines button label, and default button style.\r\n * @public\r\n * @deprecated Use DialogButtonType
|
|
1
|
+
{"version":3,"file":"DialogButtonDef.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/DialogButtonDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH;;;IAGI;AACJ,IAAY,gBAUX;AAVD,WAAY,gBAAgB;IAC1B,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,6BAAS,CAAA;IACT,qCAAiB,CAAA;IACjB,+BAAW,CAAA;IACX,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,iCAAa,CAAA;IACb,yCAAqB,CAAA;AACvB,CAAC,EAVW,gBAAgB,GAAhB,wBAAgB,KAAhB,wBAAgB,QAU3B;AAED;;;IAGI;AACJ,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,8BAAS,CAAA;IACT,wCAAmB,CAAA;IACnB,2CAAsB,CAAA;IACtB,iDAA4B,CAAA;AAC9B,CAAC,EALW,iBAAiB,GAAjB,yBAAiB,KAAjB,yBAAiB,QAK5B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Enum for button types. Determines button label, and default button style.\r\n * @public\r\n * @deprecated Use [DialogButtonType]($appui-abstract) instead\r\n */\r\nexport enum DialogButtonType {\r\n None = \"\",\r\n Close = \"close\",\r\n OK = \"ok\",\r\n Cancel = \"cancel\",\r\n Yes = \"yes\",\r\n No = \"no\",\r\n Retry = \"retry\",\r\n Next = \"next\",\r\n Previous = \"previous\"\r\n}\r\n\r\n/** Enum for button style.\r\n * @public\r\n * @deprecated Use [DialogButtonStyle]($appui-abstract) instead\r\n */\r\nexport enum DialogButtonStyle {\r\n None = \"\",\r\n Primary = \"iui-cta\",\r\n Hollow = \"iui-default\",\r\n Blue = \"iui-high-visibility\",\r\n}\r\n\r\n/** Interface for a dialog button in a button cluster\r\n * @public\r\n * @deprecated Use [DialogButtonDef]($appui-abstract) instead\r\n */\r\nexport interface DialogButtonDef {\r\n /** type of button */\r\n type: DialogButtonType; // eslint-disable-line deprecation/deprecation\r\n /** Triggered on button click */\r\n onClick: () => void;\r\n /** Which button style to decorate button width */\r\n buttonStyle?: DialogButtonStyle; // eslint-disable-line deprecation/deprecation\r\n /** Disable the button */\r\n disabled?: boolean;\r\n /** Custom label */\r\n label?: string;\r\n /** Custom CSS class */\r\n className?: string;\r\n}\r\n"]}
|
|
@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
10
10
|
exports.MessageSeverity = void 0;
|
|
11
11
|
/** Message Severity enum.
|
|
12
12
|
* @public
|
|
13
|
-
* @deprecated Use [MessageSeverity]($appui-abstract)
|
|
13
|
+
* @deprecated Use [MessageSeverity]($appui-abstract) instead
|
|
14
14
|
*/
|
|
15
15
|
var MessageSeverity;
|
|
16
16
|
(function (MessageSeverity) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageSeverity.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageSeverity.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH;;;IAGI;AACJ,IAAY,eAOX;AAPD,WAAY,eAAe;IACzB,qDAAQ,CAAA;IACR,mEAAe,CAAA;IACf,6DAAY,CAAA;IACZ,2DAAW,CAAA;IACX,uDAAS,CAAA;IACT,uDAAS,CAAA;AACX,CAAC,EAPW,eAAe,GAAf,uBAAe,KAAf,uBAAe,QAO1B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Message Severity enum.\r\n * @public\r\n * @deprecated Use [MessageSeverity]($appui-abstract)
|
|
1
|
+
{"version":3,"file":"MessageSeverity.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageSeverity.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH;;;IAGI;AACJ,IAAY,eAOX;AAPD,WAAY,eAAe;IACzB,qDAAQ,CAAA;IACR,mEAAe,CAAA;IACf,6DAAY,CAAA;IACZ,2DAAW,CAAA;IACX,uDAAS,CAAA;IACT,uDAAS,CAAA;AACX,CAAC,EAPW,eAAe,GAAf,uBAAe,KAAf,uBAAe,QAO1B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Message Severity enum.\r\n * @public\r\n * @deprecated Use [MessageSeverity]($appui-abstract) instead\r\n */\r\nexport enum MessageSeverity {\r\n None = 0,\r\n Information = 1,\r\n Question = 2,\r\n Warning = 3,\r\n Error = 4,\r\n Fatal = 5,\r\n}\r\n"]}
|
|
@@ -95,7 +95,7 @@ export declare type ThemedSelectProps = {
|
|
|
95
95
|
tabSelectsValue?: boolean;
|
|
96
96
|
value?: ValueType<OptionType>;
|
|
97
97
|
};
|
|
98
|
-
/** ThemedSelect is a wrapper for react-select with
|
|
98
|
+
/** ThemedSelect is a wrapper for react-select with iTwin.js UI theming applied
|
|
99
99
|
* @beta
|
|
100
100
|
* @deprecated use Select from @itwin/itwinui-react
|
|
101
101
|
*/
|
|
@@ -20,7 +20,7 @@ const ThemedMenu = (props) => {
|
|
|
20
20
|
return (React.createElement("div", { className: "uicore-reactSelectTop" },
|
|
21
21
|
React.createElement(react_select_1.components.Menu, { ...props })));
|
|
22
22
|
};
|
|
23
|
-
/** ThemedSelect is a wrapper for react-select with
|
|
23
|
+
/** ThemedSelect is a wrapper for react-select with iTwin.js UI theming applied
|
|
24
24
|
* @beta
|
|
25
25
|
* @deprecated use Select from @itwin/itwinui-react
|
|
26
26
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemedSelect.js","sourceRoot":"","sources":["../../../../src/core-react/select/ThemedSelect.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;;;AAEH,gCAA8B;AAC9B,2CAAoC;AACpC,+BAA+B;AAC/B,+CAAqD;AAKrD,sCAAmC;AACnC,4DAAiE;AACjE,+CAAkD;AAqLlD,MAAM,UAAU,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC3C,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,yBAAU,CAAC,IAAI,OAAK,KAAK,GAAI,CAC1B,CACP,CAAC;AACJ,CAAC,CAAC;AACF;;;GAGG;AACH,gEAAgE;AAChE,SAAgB,YAAY,CAAC,KAAwB;;IACnD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,EAAsB,CAAC;IACzD,MAAM,oBAAoB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAClD,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YAC1B,aAAa,CAAC,OAAO,GAAG,eAAM,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;SACvE;QACD,OAAO,aAAa,CAAC,OAAO,CAAC;IAC/B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,MAAM,gBAAgB,GAAG,MAAA,KAAK,CAAC,gBAAgB,mCAAI,oBAAoB,CAAC;IACxE,MAAM,eAAe,GAAG,IAAA,oBAAU,EAAC,uBAAuB,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7E,MAAM,YAAY,GAAG,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAA,+BAAiB,GAAE,CAAC;IAC3E,MAAM;IACJ,6DAA6D;IAC7D,eAAe,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG;IAC5G,wCAAwC;IACxC,GAAG,UAAU,CAAC,qBAAqB;MACpC,GAAG,KAAY,CAAC;IACjB,MAAM,YAAY,GAAG;QACnB,GAAG,KAAK,CAAC,MAAM;QACf,UAAU,EAAE,CAAC,IAAyB,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,CAAC;KACjE,CAAC;IAEF,MAAM,MAAM,GAAG,IAAA,uCAAsB,EAAC,+BAA+B,CAAC,CAAC;IACvE,OAAO,CACL,6BAAK,SAAS,EAAE,eAAe,EAAE,GAAG,EAAE,MAAM;QAC1C,oBAAC,sBAAS,IACR,GAAG,EAAE,GAAG,EACR,eAAe,EAAC,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,YAAY,EAC9B,MAAM,EAAE,YAAY;YACpB,gEAAgE;YAChE,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,EAAE,KACjD,UAAU,GACd,CACE,CACP,CAAC;AACJ,CAAC;AArCD,oCAqCC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/* eslint-disable deprecation/deprecation */\r\n/** @packageDocumentation\r\n * @module Select\r\n */\r\n\r\nimport \"./themed-select.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport Component, { components } from \"react-select\";\r\nimport { formatGroupLabel, getOptionLabel, getOptionValue } from \"react-select/src/builtins\";\r\nimport { SelectComponentsConfig } from \"react-select/src/components/index\";\r\nimport { MenuProps } from \"react-select/src/components/Menu\";\r\nimport { ActionMeta, FocusEventHandler, InputActionMeta, KeyboardEventHandler, ValueType } from \"react-select/src/types\";\r\nimport { UiCore } from \"../UiCore\";\r\nimport { getCssVariableAsNumber } from \"../utils/getCssVariable\";\r\nimport { getParentSelector } from \"./modalHelper\";\r\n\r\n// cspell:ignore reactselect builtins\r\n\r\n/* eslint-disable @typescript-eslint/no-shadow, @typescript-eslint/consistent-type-definitions, @typescript-eslint/array-type */\r\ntype FormatOptionLabelContext = \"menu\" | \"value\";\r\ntype FormatOptionLabelMeta = {\r\n context: FormatOptionLabelContext;\r\n inputValue: string;\r\n selectValue: ValueType<OptionType>;\r\n};\r\n\r\n/** OptionType for react-select 2.0 and above. which only accepts pairs of value & label strings\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport interface OptionType {\r\n value: any;\r\n label: string;\r\n}\r\n/** OptionsType to match label/value pair OptionType\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n*/\r\nexport type OptionsType = Array<OptionType>;\r\n\r\n/** ThemedSelectProps to control specific features of ThemedSelect\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport type ThemedSelectProps = {\r\n /* Aria label (for assistive tech) */\r\n \"aria-label\"?: string;\r\n /* HTML ID of an element that should be used as the label (for assistive tech) */\r\n \"aria-labelledby\"?: string;\r\n /* Focus the control when it is mounted */\r\n autoFocus?: boolean;\r\n /* Remove the currently focused option when the user presses backspace */\r\n backspaceRemovesValue?: boolean;\r\n /* Remove focus from the input when the user selects an option (handy for dismissing the keyboard on touch devices) */\r\n blurInputOnSelect?: boolean;\r\n /* When the user reaches the top/bottom of the menu, prevent scroll on the scroll-parent */\r\n captureMenuScroll?: boolean;\r\n /* Sets a className attribute on the outer component */\r\n className?: string;\r\n /* Close the select menu when the user selects an option */\r\n closeMenuOnSelect?: boolean;\r\n /*\r\n If `true`, close the select menu when the user scrolls the document/body.\r\n\r\n If a function, takes a standard javascript `ScrollEvent` you return a boolean:\r\n\r\n `true` => The menu closes\r\n\r\n `false` => The menu stays open\r\n\r\n This is useful when you have a scrollable modal and want to portal the menu out,\r\n but want to avoid graphical issues.\r\n */\r\n closeMenuOnScroll?: boolean | EventListener;\r\n /*\r\n This complex object includes all the compositional components that are used\r\n in `react-select`. If you wish to overwrite a component, pass in an object\r\n with the appropriate namespace.\r\n\r\n If you only wish to restyle a component, we recommend using the `styles` prop\r\n instead. For a list of the components that can be passed in, and the shape\r\n that will be passed to them, see [the components docs](/components)\r\n */\r\n components?: SelectComponentsConfig<OptionType>;\r\n /* Whether the value of the select, e.g. SingleValue, should be displayed in the control. */\r\n controlShouldRenderValue?: boolean;\r\n /* Ff true, the menu is open immediately */\r\n defaultMenuIsOpen?: boolean;\r\n /* Value set in the control by default */\r\n defaultValue?: ValueType<OptionType>;\r\n /** Provides ability to return reference to the outer HTMLDivElement */\r\n divRef?: React.Ref<HTMLDivElement>;\r\n /* Clear all values when the user presses escape AND the menu is closed */\r\n escapeClearsValue?: boolean;\r\n /* Custom method to filter whether an option should be displayed in the menu */\r\n filterOption?: ((\r\n option: OptionType,\r\n rawInput: string,\r\n ) => boolean) | null;\r\n /*\r\n Formats group labels in the menu as React components\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n*/\r\n formatGroupLabel?: typeof formatGroupLabel;\r\n /* Formats option labels in the menu and control as React components */\r\n formatOptionLabel?: (optionType: OptionType, formatLabelMeta: FormatOptionLabelMeta) => React.ReactNode;\r\n /* Resolves option data to a string to be displayed as the label by components */\r\n getOptionLabel?: typeof getOptionLabel;\r\n /* Resolves option data to a string to compare options and specify value attributes */\r\n getOptionValue?: typeof getOptionValue;\r\n /* Hide the selected option from the menu */\r\n hideSelectedOptions?: boolean;\r\n /* The id to set on the SelectContainer component. */\r\n id?: string;\r\n /* The value of the search input */\r\n inputValue?: string;\r\n /* The id of the search input */\r\n inputId?: string;\r\n /* Define an id prefix for the select components e.g. {your-id}-value */\r\n instanceId?: number | string;\r\n /* Is the select value clearable */\r\n isClearable?: boolean;\r\n /* Is the select disabled */\r\n isDisabled?: boolean;\r\n /* Is the select in a state of loading (async) */\r\n isLoading?: boolean;\r\n /*\r\n Override the built-in logic to detect whether an option is disabled\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n */\r\n isOptionDisabled?: (option: OptionType, options: OptionsType) => boolean | false;\r\n /* Support multiple selected options */\r\n isMulti?: boolean;\r\n /* If true, menu will not be opened in a portal */\r\n isMenuFixed?: boolean;\r\n /* Is the select direction right-to-left */\r\n isRtl?: boolean;\r\n /* Whether to enable search functionality */\r\n isSearchable?: boolean;\r\n /* Minimum height of the menu before flipping */\r\n minMenuHeight?: number;\r\n /* Maximum height of the menu before scrolling */\r\n maxMenuHeight?: number;\r\n /* Whether the menu is open */\r\n menuIsOpen?: boolean;\r\n /* Whether to block scroll events when the menu is open */\r\n menuShouldBlockScroll?: boolean;\r\n /* Whether the menu should be scrolled into view when it opens */\r\n menuShouldScrollIntoView?: boolean;\r\n /* Name of the HTML Input (optional - without this, no input will be rendered) */\r\n name?: string;\r\n /* Text to display when there are no options */\r\n noOptionsMessage?: (obj: { inputValue: string }) => string | null;\r\n /* Handle blur events on the control */\r\n onBlur?: FocusEventHandler;\r\n /* Handle change events on the select */\r\n onChange?: (value: ValueType<OptionType>, action: ActionMeta<OptionType>) => void;\r\n /* Handle focus events on the control */\r\n onFocus?: FocusEventHandler;\r\n /* Handle change events on the input */\r\n onInputChange?: (newValue: string, actionMeta?: InputActionMeta) => void;\r\n /* Handle key down events on the select */\r\n onKeyDown?: KeyboardEventHandler;\r\n /* Handle the menu opening */\r\n onMenuOpen?: () => void;\r\n /* Handle the menu closing */\r\n onMenuClose?: () => void;\r\n /* Fired when the user scrolls to the top of the menu */\r\n onMenuScrollToTop?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Fired when the user scrolls to the bottom of the menu */\r\n onMenuScrollToBottom?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Allows control of whether the menu is opened when the Select is focused */\r\n openMenuOnFocus?: boolean;\r\n /* Allows control of whether the menu is opened when the Select is clicked */\r\n openMenuOnClick?: boolean;\r\n /* Array of options that populate the select menu */\r\n options: OptionsType;\r\n /* Number of options to jump in menu when page{up|down} keys are used */\r\n pageSize?: number;\r\n /* Placeholder for the select value */\r\n placeholder?: string;\r\n /** Provides ability to return reference to the ThemedSelect */\r\n ref?: React.Ref<Component>;\r\n /* Sets additional styling */\r\n styles?: React.CSSProperties;\r\n /* Sets the tabIndex attribute on the input */\r\n tabIndex?: string;\r\n /* Select the currently focused option when the user presses tab */\r\n tabSelectsValue?: boolean;\r\n /* The value of the select; reflected by the selected option */\r\n value?: ValueType<OptionType>;\r\n};\r\n\r\nconst ThemedMenu = (props: MenuProps<any>) => { // eslint-disable-line @typescript-eslint/naming-convention\r\n return (\r\n <div className=\"uicore-reactSelectTop\">\r\n <components.Menu {...props} />\r\n </div>\r\n );\r\n};\r\n/** ThemedSelect is a wrapper for react-select with iModel.js UI theming applied\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\n// eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport function ThemedSelect(props: ThemedSelectProps) {\r\n const noOptionLabel = React.useRef<string | undefined>();\r\n const defaultOptionMessage = React.useCallback(() => {\r\n if (!noOptionLabel.current) {\r\n noOptionLabel.current = UiCore.translate(\"reactelect.noSelectOption\");\r\n }\r\n return noOptionLabel.current;\r\n }, [noOptionLabel]);\r\n const noOptionFunction = props.noOptionsMessage ?? defaultOptionMessage;\r\n const selectClassName = classnames(\"uicore-reactSelectTop\", props.className);\r\n const portalTarget = !!props.isMenuFixed ? undefined : getParentSelector();\r\n const {\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n classNamePrefix, className, noOptionsMessage, menuPortalTarget, isMenuFixed, styles, components, divRef, ref,\r\n // eslint-disable-next-line comma-dangle\r\n ...otherProps // pass-through props\r\n } = props as any;\r\n const selectStyles = {\r\n ...props.styles,\r\n menuPortal: (base: React.CSSProperties) => ({ ...base, zIndex }),\r\n };\r\n\r\n const zIndex = getCssVariableAsNumber(\"--uicore-z-index-dialog-popup\");\r\n return (\r\n <div className={selectClassName} ref={divRef}>\r\n <Component\r\n ref={ref}\r\n classNamePrefix=\"react-select\"\r\n noOptionsMessage={noOptionFunction}\r\n menuPortalTarget={portalTarget}\r\n styles={selectStyles}\r\n // eslint-disable-next-line @typescript-eslint/naming-convention\r\n components={{ Menu: ThemedMenu, ...props.components }}\r\n {...otherProps}\r\n />\r\n </div>\r\n );\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"ThemedSelect.js","sourceRoot":"","sources":["../../../../src/core-react/select/ThemedSelect.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;;;AAEH,gCAA8B;AAC9B,2CAAoC;AACpC,+BAA+B;AAC/B,+CAAqD;AAKrD,sCAAmC;AACnC,4DAAiE;AACjE,+CAAkD;AAqLlD,MAAM,UAAU,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC3C,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,yBAAU,CAAC,IAAI,OAAK,KAAK,GAAI,CAC1B,CACP,CAAC;AACJ,CAAC,CAAC;AACF;;;GAGG;AACH,gEAAgE;AAChE,SAAgB,YAAY,CAAC,KAAwB;;IACnD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,EAAsB,CAAC;IACzD,MAAM,oBAAoB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAClD,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YAC1B,aAAa,CAAC,OAAO,GAAG,eAAM,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;SACvE;QACD,OAAO,aAAa,CAAC,OAAO,CAAC;IAC/B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,MAAM,gBAAgB,GAAG,MAAA,KAAK,CAAC,gBAAgB,mCAAI,oBAAoB,CAAC;IACxE,MAAM,eAAe,GAAG,IAAA,oBAAU,EAAC,uBAAuB,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7E,MAAM,YAAY,GAAG,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAA,+BAAiB,GAAE,CAAC;IAC3E,MAAM;IACJ,6DAA6D;IAC7D,eAAe,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG;IAC5G,wCAAwC;IACxC,GAAG,UAAU,CAAC,qBAAqB;MACpC,GAAG,KAAY,CAAC;IACjB,MAAM,YAAY,GAAG;QACnB,GAAG,KAAK,CAAC,MAAM;QACf,UAAU,EAAE,CAAC,IAAyB,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,CAAC;KACjE,CAAC;IAEF,MAAM,MAAM,GAAG,IAAA,uCAAsB,EAAC,+BAA+B,CAAC,CAAC;IACvE,OAAO,CACL,6BAAK,SAAS,EAAE,eAAe,EAAE,GAAG,EAAE,MAAM;QAC1C,oBAAC,sBAAS,IACR,GAAG,EAAE,GAAG,EACR,eAAe,EAAC,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,YAAY,EAC9B,MAAM,EAAE,YAAY;YACpB,gEAAgE;YAChE,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,EAAE,KACjD,UAAU,GACd,CACE,CACP,CAAC;AACJ,CAAC;AArCD,oCAqCC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/* eslint-disable deprecation/deprecation */\r\n/** @packageDocumentation\r\n * @module Select\r\n */\r\n\r\nimport \"./themed-select.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport Component, { components } from \"react-select\";\r\nimport { formatGroupLabel, getOptionLabel, getOptionValue } from \"react-select/src/builtins\";\r\nimport { SelectComponentsConfig } from \"react-select/src/components/index\";\r\nimport { MenuProps } from \"react-select/src/components/Menu\";\r\nimport { ActionMeta, FocusEventHandler, InputActionMeta, KeyboardEventHandler, ValueType } from \"react-select/src/types\";\r\nimport { UiCore } from \"../UiCore\";\r\nimport { getCssVariableAsNumber } from \"../utils/getCssVariable\";\r\nimport { getParentSelector } from \"./modalHelper\";\r\n\r\n// cspell:ignore reactselect builtins\r\n\r\n/* eslint-disable @typescript-eslint/no-shadow, @typescript-eslint/consistent-type-definitions, @typescript-eslint/array-type */\r\ntype FormatOptionLabelContext = \"menu\" | \"value\";\r\ntype FormatOptionLabelMeta = {\r\n context: FormatOptionLabelContext;\r\n inputValue: string;\r\n selectValue: ValueType<OptionType>;\r\n};\r\n\r\n/** OptionType for react-select 2.0 and above. which only accepts pairs of value & label strings\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport interface OptionType {\r\n value: any;\r\n label: string;\r\n}\r\n/** OptionsType to match label/value pair OptionType\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n*/\r\nexport type OptionsType = Array<OptionType>;\r\n\r\n/** ThemedSelectProps to control specific features of ThemedSelect\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport type ThemedSelectProps = {\r\n /* Aria label (for assistive tech) */\r\n \"aria-label\"?: string;\r\n /* HTML ID of an element that should be used as the label (for assistive tech) */\r\n \"aria-labelledby\"?: string;\r\n /* Focus the control when it is mounted */\r\n autoFocus?: boolean;\r\n /* Remove the currently focused option when the user presses backspace */\r\n backspaceRemovesValue?: boolean;\r\n /* Remove focus from the input when the user selects an option (handy for dismissing the keyboard on touch devices) */\r\n blurInputOnSelect?: boolean;\r\n /* When the user reaches the top/bottom of the menu, prevent scroll on the scroll-parent */\r\n captureMenuScroll?: boolean;\r\n /* Sets a className attribute on the outer component */\r\n className?: string;\r\n /* Close the select menu when the user selects an option */\r\n closeMenuOnSelect?: boolean;\r\n /*\r\n If `true`, close the select menu when the user scrolls the document/body.\r\n\r\n If a function, takes a standard javascript `ScrollEvent` you return a boolean:\r\n\r\n `true` => The menu closes\r\n\r\n `false` => The menu stays open\r\n\r\n This is useful when you have a scrollable modal and want to portal the menu out,\r\n but want to avoid graphical issues.\r\n */\r\n closeMenuOnScroll?: boolean | EventListener;\r\n /*\r\n This complex object includes all the compositional components that are used\r\n in `react-select`. If you wish to overwrite a component, pass in an object\r\n with the appropriate namespace.\r\n\r\n If you only wish to restyle a component, we recommend using the `styles` prop\r\n instead. For a list of the components that can be passed in, and the shape\r\n that will be passed to them, see [the components docs](/components)\r\n */\r\n components?: SelectComponentsConfig<OptionType>;\r\n /* Whether the value of the select, e.g. SingleValue, should be displayed in the control. */\r\n controlShouldRenderValue?: boolean;\r\n /* Ff true, the menu is open immediately */\r\n defaultMenuIsOpen?: boolean;\r\n /* Value set in the control by default */\r\n defaultValue?: ValueType<OptionType>;\r\n /** Provides ability to return reference to the outer HTMLDivElement */\r\n divRef?: React.Ref<HTMLDivElement>;\r\n /* Clear all values when the user presses escape AND the menu is closed */\r\n escapeClearsValue?: boolean;\r\n /* Custom method to filter whether an option should be displayed in the menu */\r\n filterOption?: ((\r\n option: OptionType,\r\n rawInput: string,\r\n ) => boolean) | null;\r\n /*\r\n Formats group labels in the menu as React components\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n*/\r\n formatGroupLabel?: typeof formatGroupLabel;\r\n /* Formats option labels in the menu and control as React components */\r\n formatOptionLabel?: (optionType: OptionType, formatLabelMeta: FormatOptionLabelMeta) => React.ReactNode;\r\n /* Resolves option data to a string to be displayed as the label by components */\r\n getOptionLabel?: typeof getOptionLabel;\r\n /* Resolves option data to a string to compare options and specify value attributes */\r\n getOptionValue?: typeof getOptionValue;\r\n /* Hide the selected option from the menu */\r\n hideSelectedOptions?: boolean;\r\n /* The id to set on the SelectContainer component. */\r\n id?: string;\r\n /* The value of the search input */\r\n inputValue?: string;\r\n /* The id of the search input */\r\n inputId?: string;\r\n /* Define an id prefix for the select components e.g. {your-id}-value */\r\n instanceId?: number | string;\r\n /* Is the select value clearable */\r\n isClearable?: boolean;\r\n /* Is the select disabled */\r\n isDisabled?: boolean;\r\n /* Is the select in a state of loading (async) */\r\n isLoading?: boolean;\r\n /*\r\n Override the built-in logic to detect whether an option is disabled\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n */\r\n isOptionDisabled?: (option: OptionType, options: OptionsType) => boolean | false;\r\n /* Support multiple selected options */\r\n isMulti?: boolean;\r\n /* If true, menu will not be opened in a portal */\r\n isMenuFixed?: boolean;\r\n /* Is the select direction right-to-left */\r\n isRtl?: boolean;\r\n /* Whether to enable search functionality */\r\n isSearchable?: boolean;\r\n /* Minimum height of the menu before flipping */\r\n minMenuHeight?: number;\r\n /* Maximum height of the menu before scrolling */\r\n maxMenuHeight?: number;\r\n /* Whether the menu is open */\r\n menuIsOpen?: boolean;\r\n /* Whether to block scroll events when the menu is open */\r\n menuShouldBlockScroll?: boolean;\r\n /* Whether the menu should be scrolled into view when it opens */\r\n menuShouldScrollIntoView?: boolean;\r\n /* Name of the HTML Input (optional - without this, no input will be rendered) */\r\n name?: string;\r\n /* Text to display when there are no options */\r\n noOptionsMessage?: (obj: { inputValue: string }) => string | null;\r\n /* Handle blur events on the control */\r\n onBlur?: FocusEventHandler;\r\n /* Handle change events on the select */\r\n onChange?: (value: ValueType<OptionType>, action: ActionMeta<OptionType>) => void;\r\n /* Handle focus events on the control */\r\n onFocus?: FocusEventHandler;\r\n /* Handle change events on the input */\r\n onInputChange?: (newValue: string, actionMeta?: InputActionMeta) => void;\r\n /* Handle key down events on the select */\r\n onKeyDown?: KeyboardEventHandler;\r\n /* Handle the menu opening */\r\n onMenuOpen?: () => void;\r\n /* Handle the menu closing */\r\n onMenuClose?: () => void;\r\n /* Fired when the user scrolls to the top of the menu */\r\n onMenuScrollToTop?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Fired when the user scrolls to the bottom of the menu */\r\n onMenuScrollToBottom?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Allows control of whether the menu is opened when the Select is focused */\r\n openMenuOnFocus?: boolean;\r\n /* Allows control of whether the menu is opened when the Select is clicked */\r\n openMenuOnClick?: boolean;\r\n /* Array of options that populate the select menu */\r\n options: OptionsType;\r\n /* Number of options to jump in menu when page{up|down} keys are used */\r\n pageSize?: number;\r\n /* Placeholder for the select value */\r\n placeholder?: string;\r\n /** Provides ability to return reference to the ThemedSelect */\r\n ref?: React.Ref<Component>;\r\n /* Sets additional styling */\r\n styles?: React.CSSProperties;\r\n /* Sets the tabIndex attribute on the input */\r\n tabIndex?: string;\r\n /* Select the currently focused option when the user presses tab */\r\n tabSelectsValue?: boolean;\r\n /* The value of the select; reflected by the selected option */\r\n value?: ValueType<OptionType>;\r\n};\r\n\r\nconst ThemedMenu = (props: MenuProps<any>) => { // eslint-disable-line @typescript-eslint/naming-convention\r\n return (\r\n <div className=\"uicore-reactSelectTop\">\r\n <components.Menu {...props} />\r\n </div>\r\n );\r\n};\r\n/** ThemedSelect is a wrapper for react-select with iTwin.js UI theming applied\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\n// eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport function ThemedSelect(props: ThemedSelectProps) {\r\n const noOptionLabel = React.useRef<string | undefined>();\r\n const defaultOptionMessage = React.useCallback(() => {\r\n if (!noOptionLabel.current) {\r\n noOptionLabel.current = UiCore.translate(\"reactelect.noSelectOption\");\r\n }\r\n return noOptionLabel.current;\r\n }, [noOptionLabel]);\r\n const noOptionFunction = props.noOptionsMessage ?? defaultOptionMessage;\r\n const selectClassName = classnames(\"uicore-reactSelectTop\", props.className);\r\n const portalTarget = !!props.isMenuFixed ? undefined : getParentSelector();\r\n const {\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n classNamePrefix, className, noOptionsMessage, menuPortalTarget, isMenuFixed, styles, components, divRef, ref,\r\n // eslint-disable-next-line comma-dangle\r\n ...otherProps // pass-through props\r\n } = props as any;\r\n const selectStyles = {\r\n ...props.styles,\r\n menuPortal: (base: React.CSSProperties) => ({ ...base, zIndex }),\r\n };\r\n\r\n const zIndex = getCssVariableAsNumber(\"--uicore-z-index-dialog-popup\");\r\n return (\r\n <div className={selectClassName} ref={divRef}>\r\n <Component\r\n ref={ref}\r\n classNamePrefix=\"react-select\"\r\n noOptionsMessage={noOptionFunction}\r\n menuPortalTarget={portalTarget}\r\n styles={selectStyles}\r\n // eslint-disable-next-line @typescript-eslint/naming-convention\r\n components={{ Menu: ThemedMenu, ...props.components }}\r\n {...otherProps}\r\n />\r\n </div>\r\n );\r\n}\r\n"]}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* @module Utilities
|
|
3
3
|
*/
|
|
4
4
|
import { BeUiEvent } from "@itwin/core-bentley";
|
|
5
|
-
/**
|
|
5
|
+
/** iTwin.js UI UiEvent class is a subclass of BeEvent with argument type safety.
|
|
6
6
|
* @public
|
|
7
7
|
*/
|
|
8
8
|
export declare class UiEvent<TEventArgs> extends BeUiEvent<TEventArgs> {
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
10
|
exports.UiEvent = void 0;
|
|
11
11
|
const core_bentley_1 = require("@itwin/core-bentley");
|
|
12
|
-
/**
|
|
12
|
+
/** iTwin.js UI UiEvent class is a subclass of BeEvent with argument type safety.
|
|
13
13
|
* @public
|
|
14
14
|
*/
|
|
15
15
|
class UiEvent extends core_bentley_1.BeUiEvent {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UiEvent.js","sourceRoot":"","sources":["../../../../src/core-react/utils/UiEvent.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,sDAAgD;AAEhD;;GAEG;AACH,MAAa,OAAoB,SAAQ,wBAAqB;CAAI;AAAlE,0BAAkE","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport { BeUiEvent } from \"@itwin/core-bentley\";\r\n\r\n/**
|
|
1
|
+
{"version":3,"file":"UiEvent.js","sourceRoot":"","sources":["../../../../src/core-react/utils/UiEvent.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,sDAAgD;AAEhD;;GAEG;AACH,MAAa,OAAoB,SAAQ,wBAAqB;CAAI;AAAlE,0BAAkE","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport { BeUiEvent } from \"@itwin/core-bentley\";\r\n\r\n/** iTwin.js UI UiEvent class is a subclass of BeEvent with argument type safety.\r\n * @public\r\n */\r\nexport class UiEvent<TEventArgs> extends BeUiEvent<TEventArgs> { }\r\n"]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
/** Enum for button types. Determines button label, and default button style.
|
|
5
5
|
* @public
|
|
6
|
-
* @deprecated Use DialogButtonType
|
|
6
|
+
* @deprecated Use [DialogButtonType]($appui-abstract) instead
|
|
7
7
|
*/
|
|
8
8
|
export declare enum DialogButtonType {
|
|
9
9
|
None = "",
|
|
@@ -18,7 +18,7 @@ export declare enum DialogButtonType {
|
|
|
18
18
|
}
|
|
19
19
|
/** Enum for button style.
|
|
20
20
|
* @public
|
|
21
|
-
* @deprecated Use DialogButtonStyle
|
|
21
|
+
* @deprecated Use [DialogButtonStyle]($appui-abstract) instead
|
|
22
22
|
*/
|
|
23
23
|
export declare enum DialogButtonStyle {
|
|
24
24
|
None = "",
|
|
@@ -28,7 +28,7 @@ export declare enum DialogButtonStyle {
|
|
|
28
28
|
}
|
|
29
29
|
/** Interface for a dialog button in a button cluster
|
|
30
30
|
* @public
|
|
31
|
-
* @deprecated Use DialogButtonDef
|
|
31
|
+
* @deprecated Use [DialogButtonDef]($appui-abstract) instead
|
|
32
32
|
*/
|
|
33
33
|
export interface DialogButtonDef {
|
|
34
34
|
/** type of button */
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*/
|
|
8
8
|
/** Enum for button types. Determines button label, and default button style.
|
|
9
9
|
* @public
|
|
10
|
-
* @deprecated Use DialogButtonType
|
|
10
|
+
* @deprecated Use [DialogButtonType]($appui-abstract) instead
|
|
11
11
|
*/
|
|
12
12
|
export var DialogButtonType;
|
|
13
13
|
(function (DialogButtonType) {
|
|
@@ -23,7 +23,7 @@ export var DialogButtonType;
|
|
|
23
23
|
})(DialogButtonType || (DialogButtonType = {}));
|
|
24
24
|
/** Enum for button style.
|
|
25
25
|
* @public
|
|
26
|
-
* @deprecated Use DialogButtonStyle
|
|
26
|
+
* @deprecated Use [DialogButtonStyle]($appui-abstract) instead
|
|
27
27
|
*/
|
|
28
28
|
export var DialogButtonStyle;
|
|
29
29
|
(function (DialogButtonStyle) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogButtonDef.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/DialogButtonDef.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH;;;IAGI;AACJ,MAAM,CAAN,IAAY,gBAUX;AAVD,WAAY,gBAAgB;IAC1B,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,6BAAS,CAAA;IACT,qCAAiB,CAAA;IACjB,+BAAW,CAAA;IACX,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,iCAAa,CAAA;IACb,yCAAqB,CAAA;AACvB,CAAC,EAVW,gBAAgB,KAAhB,gBAAgB,QAU3B;AAED;;;IAGI;AACJ,MAAM,CAAN,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,8BAAS,CAAA;IACT,wCAAmB,CAAA;IACnB,2CAAsB,CAAA;IACtB,iDAA4B,CAAA;AAC9B,CAAC,EALW,iBAAiB,KAAjB,iBAAiB,QAK5B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Enum for button types. Determines button label, and default button style.\r\n * @public\r\n * @deprecated Use DialogButtonType
|
|
1
|
+
{"version":3,"file":"DialogButtonDef.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/DialogButtonDef.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH;;;IAGI;AACJ,MAAM,CAAN,IAAY,gBAUX;AAVD,WAAY,gBAAgB;IAC1B,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,6BAAS,CAAA;IACT,qCAAiB,CAAA;IACjB,+BAAW,CAAA;IACX,6BAAS,CAAA;IACT,mCAAe,CAAA;IACf,iCAAa,CAAA;IACb,yCAAqB,CAAA;AACvB,CAAC,EAVW,gBAAgB,KAAhB,gBAAgB,QAU3B;AAED;;;IAGI;AACJ,MAAM,CAAN,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,8BAAS,CAAA;IACT,wCAAmB,CAAA;IACnB,2CAAsB,CAAA;IACtB,iDAA4B,CAAA;AAC9B,CAAC,EALW,iBAAiB,KAAjB,iBAAiB,QAK5B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Enum for button types. Determines button label, and default button style.\r\n * @public\r\n * @deprecated Use [DialogButtonType]($appui-abstract) instead\r\n */\r\nexport enum DialogButtonType {\r\n None = \"\",\r\n Close = \"close\",\r\n OK = \"ok\",\r\n Cancel = \"cancel\",\r\n Yes = \"yes\",\r\n No = \"no\",\r\n Retry = \"retry\",\r\n Next = \"next\",\r\n Previous = \"previous\"\r\n}\r\n\r\n/** Enum for button style.\r\n * @public\r\n * @deprecated Use [DialogButtonStyle]($appui-abstract) instead\r\n */\r\nexport enum DialogButtonStyle {\r\n None = \"\",\r\n Primary = \"iui-cta\",\r\n Hollow = \"iui-default\",\r\n Blue = \"iui-high-visibility\",\r\n}\r\n\r\n/** Interface for a dialog button in a button cluster\r\n * @public\r\n * @deprecated Use [DialogButtonDef]($appui-abstract) instead\r\n */\r\nexport interface DialogButtonDef {\r\n /** type of button */\r\n type: DialogButtonType; // eslint-disable-line deprecation/deprecation\r\n /** Triggered on button click */\r\n onClick: () => void;\r\n /** Which button style to decorate button width */\r\n buttonStyle?: DialogButtonStyle; // eslint-disable-line deprecation/deprecation\r\n /** Disable the button */\r\n disabled?: boolean;\r\n /** Custom label */\r\n label?: string;\r\n /** Custom CSS class */\r\n className?: string;\r\n}\r\n"]}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*/
|
|
8
8
|
/** Message Severity enum.
|
|
9
9
|
* @public
|
|
10
|
-
* @deprecated Use [MessageSeverity]($appui-abstract)
|
|
10
|
+
* @deprecated Use [MessageSeverity]($appui-abstract) instead
|
|
11
11
|
*/
|
|
12
12
|
export var MessageSeverity;
|
|
13
13
|
(function (MessageSeverity) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageSeverity.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageSeverity.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH;;;IAGI;AACJ,MAAM,CAAN,IAAY,eAOX;AAPD,WAAY,eAAe;IACzB,qDAAQ,CAAA;IACR,mEAAe,CAAA;IACf,6DAAY,CAAA;IACZ,2DAAW,CAAA;IACX,uDAAS,CAAA;IACT,uDAAS,CAAA;AACX,CAAC,EAPW,eAAe,KAAf,eAAe,QAO1B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Message Severity enum.\r\n * @public\r\n * @deprecated Use [MessageSeverity]($appui-abstract)
|
|
1
|
+
{"version":3,"file":"MessageSeverity.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageSeverity.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH;;;IAGI;AACJ,MAAM,CAAN,IAAY,eAOX;AAPD,WAAY,eAAe;IACzB,qDAAQ,CAAA;IACR,mEAAe,CAAA;IACf,6DAAY,CAAA;IACZ,2DAAW,CAAA;IACX,uDAAS,CAAA;IACT,uDAAS,CAAA;AACX,CAAC,EAPW,eAAe,KAAf,eAAe,QAO1B","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Dialog\r\n */\r\n\r\n/** Message Severity enum.\r\n * @public\r\n * @deprecated Use [MessageSeverity]($appui-abstract) instead\r\n */\r\nexport enum MessageSeverity {\r\n None = 0,\r\n Information = 1,\r\n Question = 2,\r\n Warning = 3,\r\n Error = 4,\r\n Fatal = 5,\r\n}\r\n"]}
|
|
@@ -95,7 +95,7 @@ export declare type ThemedSelectProps = {
|
|
|
95
95
|
tabSelectsValue?: boolean;
|
|
96
96
|
value?: ValueType<OptionType>;
|
|
97
97
|
};
|
|
98
|
-
/** ThemedSelect is a wrapper for react-select with
|
|
98
|
+
/** ThemedSelect is a wrapper for react-select with iTwin.js UI theming applied
|
|
99
99
|
* @beta
|
|
100
100
|
* @deprecated use Select from @itwin/itwinui-react
|
|
101
101
|
*/
|
|
@@ -17,7 +17,7 @@ const ThemedMenu = (props) => {
|
|
|
17
17
|
return (React.createElement("div", { className: "uicore-reactSelectTop" },
|
|
18
18
|
React.createElement(components.Menu, { ...props })));
|
|
19
19
|
};
|
|
20
|
-
/** ThemedSelect is a wrapper for react-select with
|
|
20
|
+
/** ThemedSelect is a wrapper for react-select with iTwin.js UI theming applied
|
|
21
21
|
* @beta
|
|
22
22
|
* @deprecated use Select from @itwin/itwinui-react
|
|
23
23
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemedSelect.js","sourceRoot":"","sources":["../../../../src/core-react/select/ThemedSelect.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAKrD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAqLlD,MAAM,UAAU,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC3C,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,UAAU,CAAC,IAAI,OAAK,KAAK,GAAI,CAC1B,CACP,CAAC;AACJ,CAAC,CAAC;AACF;;;GAGG;AACH,gEAAgE;AAChE,MAAM,UAAU,YAAY,CAAC,KAAwB;;IACnD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,EAAsB,CAAC;IACzD,MAAM,oBAAoB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAClD,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YAC1B,aAAa,CAAC,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;SACvE;QACD,OAAO,aAAa,CAAC,OAAO,CAAC;IAC/B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,MAAM,gBAAgB,GAAG,MAAA,KAAK,CAAC,gBAAgB,mCAAI,oBAAoB,CAAC;IACxE,MAAM,eAAe,GAAG,UAAU,CAAC,uBAAuB,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7E,MAAM,YAAY,GAAG,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC3E,MAAM;IACJ,6DAA6D;IAC7D,eAAe,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG;IAC5G,wCAAwC;IACxC,GAAG,UAAU,CAAC,qBAAqB;MACpC,GAAG,KAAY,CAAC;IACjB,MAAM,YAAY,GAAG;QACnB,GAAG,KAAK,CAAC,MAAM;QACf,UAAU,EAAE,CAAC,IAAyB,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,CAAC;KACjE,CAAC;IAEF,MAAM,MAAM,GAAG,sBAAsB,CAAC,+BAA+B,CAAC,CAAC;IACvE,OAAO,CACL,6BAAK,SAAS,EAAE,eAAe,EAAE,GAAG,EAAE,MAAM;QAC1C,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,eAAe,EAAC,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,YAAY,EAC9B,MAAM,EAAE,YAAY;YACpB,gEAAgE;YAChE,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,EAAE,KACjD,UAAU,GACd,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/* eslint-disable deprecation/deprecation */\r\n/** @packageDocumentation\r\n * @module Select\r\n */\r\n\r\nimport \"./themed-select.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport Component, { components } from \"react-select\";\r\nimport { formatGroupLabel, getOptionLabel, getOptionValue } from \"react-select/src/builtins\";\r\nimport { SelectComponentsConfig } from \"react-select/src/components/index\";\r\nimport { MenuProps } from \"react-select/src/components/Menu\";\r\nimport { ActionMeta, FocusEventHandler, InputActionMeta, KeyboardEventHandler, ValueType } from \"react-select/src/types\";\r\nimport { UiCore } from \"../UiCore\";\r\nimport { getCssVariableAsNumber } from \"../utils/getCssVariable\";\r\nimport { getParentSelector } from \"./modalHelper\";\r\n\r\n// cspell:ignore reactselect builtins\r\n\r\n/* eslint-disable @typescript-eslint/no-shadow, @typescript-eslint/consistent-type-definitions, @typescript-eslint/array-type */\r\ntype FormatOptionLabelContext = \"menu\" | \"value\";\r\ntype FormatOptionLabelMeta = {\r\n context: FormatOptionLabelContext;\r\n inputValue: string;\r\n selectValue: ValueType<OptionType>;\r\n};\r\n\r\n/** OptionType for react-select 2.0 and above. which only accepts pairs of value & label strings\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport interface OptionType {\r\n value: any;\r\n label: string;\r\n}\r\n/** OptionsType to match label/value pair OptionType\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n*/\r\nexport type OptionsType = Array<OptionType>;\r\n\r\n/** ThemedSelectProps to control specific features of ThemedSelect\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport type ThemedSelectProps = {\r\n /* Aria label (for assistive tech) */\r\n \"aria-label\"?: string;\r\n /* HTML ID of an element that should be used as the label (for assistive tech) */\r\n \"aria-labelledby\"?: string;\r\n /* Focus the control when it is mounted */\r\n autoFocus?: boolean;\r\n /* Remove the currently focused option when the user presses backspace */\r\n backspaceRemovesValue?: boolean;\r\n /* Remove focus from the input when the user selects an option (handy for dismissing the keyboard on touch devices) */\r\n blurInputOnSelect?: boolean;\r\n /* When the user reaches the top/bottom of the menu, prevent scroll on the scroll-parent */\r\n captureMenuScroll?: boolean;\r\n /* Sets a className attribute on the outer component */\r\n className?: string;\r\n /* Close the select menu when the user selects an option */\r\n closeMenuOnSelect?: boolean;\r\n /*\r\n If `true`, close the select menu when the user scrolls the document/body.\r\n\r\n If a function, takes a standard javascript `ScrollEvent` you return a boolean:\r\n\r\n `true` => The menu closes\r\n\r\n `false` => The menu stays open\r\n\r\n This is useful when you have a scrollable modal and want to portal the menu out,\r\n but want to avoid graphical issues.\r\n */\r\n closeMenuOnScroll?: boolean | EventListener;\r\n /*\r\n This complex object includes all the compositional components that are used\r\n in `react-select`. If you wish to overwrite a component, pass in an object\r\n with the appropriate namespace.\r\n\r\n If you only wish to restyle a component, we recommend using the `styles` prop\r\n instead. For a list of the components that can be passed in, and the shape\r\n that will be passed to them, see [the components docs](/components)\r\n */\r\n components?: SelectComponentsConfig<OptionType>;\r\n /* Whether the value of the select, e.g. SingleValue, should be displayed in the control. */\r\n controlShouldRenderValue?: boolean;\r\n /* Ff true, the menu is open immediately */\r\n defaultMenuIsOpen?: boolean;\r\n /* Value set in the control by default */\r\n defaultValue?: ValueType<OptionType>;\r\n /** Provides ability to return reference to the outer HTMLDivElement */\r\n divRef?: React.Ref<HTMLDivElement>;\r\n /* Clear all values when the user presses escape AND the menu is closed */\r\n escapeClearsValue?: boolean;\r\n /* Custom method to filter whether an option should be displayed in the menu */\r\n filterOption?: ((\r\n option: OptionType,\r\n rawInput: string,\r\n ) => boolean) | null;\r\n /*\r\n Formats group labels in the menu as React components\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n*/\r\n formatGroupLabel?: typeof formatGroupLabel;\r\n /* Formats option labels in the menu and control as React components */\r\n formatOptionLabel?: (optionType: OptionType, formatLabelMeta: FormatOptionLabelMeta) => React.ReactNode;\r\n /* Resolves option data to a string to be displayed as the label by components */\r\n getOptionLabel?: typeof getOptionLabel;\r\n /* Resolves option data to a string to compare options and specify value attributes */\r\n getOptionValue?: typeof getOptionValue;\r\n /* Hide the selected option from the menu */\r\n hideSelectedOptions?: boolean;\r\n /* The id to set on the SelectContainer component. */\r\n id?: string;\r\n /* The value of the search input */\r\n inputValue?: string;\r\n /* The id of the search input */\r\n inputId?: string;\r\n /* Define an id prefix for the select components e.g. {your-id}-value */\r\n instanceId?: number | string;\r\n /* Is the select value clearable */\r\n isClearable?: boolean;\r\n /* Is the select disabled */\r\n isDisabled?: boolean;\r\n /* Is the select in a state of loading (async) */\r\n isLoading?: boolean;\r\n /*\r\n Override the built-in logic to detect whether an option is disabled\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n */\r\n isOptionDisabled?: (option: OptionType, options: OptionsType) => boolean | false;\r\n /* Support multiple selected options */\r\n isMulti?: boolean;\r\n /* If true, menu will not be opened in a portal */\r\n isMenuFixed?: boolean;\r\n /* Is the select direction right-to-left */\r\n isRtl?: boolean;\r\n /* Whether to enable search functionality */\r\n isSearchable?: boolean;\r\n /* Minimum height of the menu before flipping */\r\n minMenuHeight?: number;\r\n /* Maximum height of the menu before scrolling */\r\n maxMenuHeight?: number;\r\n /* Whether the menu is open */\r\n menuIsOpen?: boolean;\r\n /* Whether to block scroll events when the menu is open */\r\n menuShouldBlockScroll?: boolean;\r\n /* Whether the menu should be scrolled into view when it opens */\r\n menuShouldScrollIntoView?: boolean;\r\n /* Name of the HTML Input (optional - without this, no input will be rendered) */\r\n name?: string;\r\n /* Text to display when there are no options */\r\n noOptionsMessage?: (obj: { inputValue: string }) => string | null;\r\n /* Handle blur events on the control */\r\n onBlur?: FocusEventHandler;\r\n /* Handle change events on the select */\r\n onChange?: (value: ValueType<OptionType>, action: ActionMeta<OptionType>) => void;\r\n /* Handle focus events on the control */\r\n onFocus?: FocusEventHandler;\r\n /* Handle change events on the input */\r\n onInputChange?: (newValue: string, actionMeta?: InputActionMeta) => void;\r\n /* Handle key down events on the select */\r\n onKeyDown?: KeyboardEventHandler;\r\n /* Handle the menu opening */\r\n onMenuOpen?: () => void;\r\n /* Handle the menu closing */\r\n onMenuClose?: () => void;\r\n /* Fired when the user scrolls to the top of the menu */\r\n onMenuScrollToTop?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Fired when the user scrolls to the bottom of the menu */\r\n onMenuScrollToBottom?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Allows control of whether the menu is opened when the Select is focused */\r\n openMenuOnFocus?: boolean;\r\n /* Allows control of whether the menu is opened when the Select is clicked */\r\n openMenuOnClick?: boolean;\r\n /* Array of options that populate the select menu */\r\n options: OptionsType;\r\n /* Number of options to jump in menu when page{up|down} keys are used */\r\n pageSize?: number;\r\n /* Placeholder for the select value */\r\n placeholder?: string;\r\n /** Provides ability to return reference to the ThemedSelect */\r\n ref?: React.Ref<Component>;\r\n /* Sets additional styling */\r\n styles?: React.CSSProperties;\r\n /* Sets the tabIndex attribute on the input */\r\n tabIndex?: string;\r\n /* Select the currently focused option when the user presses tab */\r\n tabSelectsValue?: boolean;\r\n /* The value of the select; reflected by the selected option */\r\n value?: ValueType<OptionType>;\r\n};\r\n\r\nconst ThemedMenu = (props: MenuProps<any>) => { // eslint-disable-line @typescript-eslint/naming-convention\r\n return (\r\n <div className=\"uicore-reactSelectTop\">\r\n <components.Menu {...props} />\r\n </div>\r\n );\r\n};\r\n/** ThemedSelect is a wrapper for react-select with iModel.js UI theming applied\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\n// eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport function ThemedSelect(props: ThemedSelectProps) {\r\n const noOptionLabel = React.useRef<string | undefined>();\r\n const defaultOptionMessage = React.useCallback(() => {\r\n if (!noOptionLabel.current) {\r\n noOptionLabel.current = UiCore.translate(\"reactelect.noSelectOption\");\r\n }\r\n return noOptionLabel.current;\r\n }, [noOptionLabel]);\r\n const noOptionFunction = props.noOptionsMessage ?? defaultOptionMessage;\r\n const selectClassName = classnames(\"uicore-reactSelectTop\", props.className);\r\n const portalTarget = !!props.isMenuFixed ? undefined : getParentSelector();\r\n const {\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n classNamePrefix, className, noOptionsMessage, menuPortalTarget, isMenuFixed, styles, components, divRef, ref,\r\n // eslint-disable-next-line comma-dangle\r\n ...otherProps // pass-through props\r\n } = props as any;\r\n const selectStyles = {\r\n ...props.styles,\r\n menuPortal: (base: React.CSSProperties) => ({ ...base, zIndex }),\r\n };\r\n\r\n const zIndex = getCssVariableAsNumber(\"--uicore-z-index-dialog-popup\");\r\n return (\r\n <div className={selectClassName} ref={divRef}>\r\n <Component\r\n ref={ref}\r\n classNamePrefix=\"react-select\"\r\n noOptionsMessage={noOptionFunction}\r\n menuPortalTarget={portalTarget}\r\n styles={selectStyles}\r\n // eslint-disable-next-line @typescript-eslint/naming-convention\r\n components={{ Menu: ThemedMenu, ...props.components }}\r\n {...otherProps}\r\n />\r\n </div>\r\n );\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"ThemedSelect.js","sourceRoot":"","sources":["../../../../src/core-react/select/ThemedSelect.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAKrD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAqLlD,MAAM,UAAU,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC3C,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,UAAU,CAAC,IAAI,OAAK,KAAK,GAAI,CAC1B,CACP,CAAC;AACJ,CAAC,CAAC;AACF;;;GAGG;AACH,gEAAgE;AAChE,MAAM,UAAU,YAAY,CAAC,KAAwB;;IACnD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,EAAsB,CAAC;IACzD,MAAM,oBAAoB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAClD,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YAC1B,aAAa,CAAC,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;SACvE;QACD,OAAO,aAAa,CAAC,OAAO,CAAC;IAC/B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,MAAM,gBAAgB,GAAG,MAAA,KAAK,CAAC,gBAAgB,mCAAI,oBAAoB,CAAC;IACxE,MAAM,eAAe,GAAG,UAAU,CAAC,uBAAuB,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7E,MAAM,YAAY,GAAG,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC3E,MAAM;IACJ,6DAA6D;IAC7D,eAAe,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG;IAC5G,wCAAwC;IACxC,GAAG,UAAU,CAAC,qBAAqB;MACpC,GAAG,KAAY,CAAC;IACjB,MAAM,YAAY,GAAG;QACnB,GAAG,KAAK,CAAC,MAAM;QACf,UAAU,EAAE,CAAC,IAAyB,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,CAAC;KACjE,CAAC;IAEF,MAAM,MAAM,GAAG,sBAAsB,CAAC,+BAA+B,CAAC,CAAC;IACvE,OAAO,CACL,6BAAK,SAAS,EAAE,eAAe,EAAE,GAAG,EAAE,MAAM;QAC1C,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,eAAe,EAAC,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,YAAY,EAC9B,MAAM,EAAE,YAAY;YACpB,gEAAgE;YAChE,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,EAAE,KACjD,UAAU,GACd,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/* eslint-disable deprecation/deprecation */\r\n/** @packageDocumentation\r\n * @module Select\r\n */\r\n\r\nimport \"./themed-select.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport Component, { components } from \"react-select\";\r\nimport { formatGroupLabel, getOptionLabel, getOptionValue } from \"react-select/src/builtins\";\r\nimport { SelectComponentsConfig } from \"react-select/src/components/index\";\r\nimport { MenuProps } from \"react-select/src/components/Menu\";\r\nimport { ActionMeta, FocusEventHandler, InputActionMeta, KeyboardEventHandler, ValueType } from \"react-select/src/types\";\r\nimport { UiCore } from \"../UiCore\";\r\nimport { getCssVariableAsNumber } from \"../utils/getCssVariable\";\r\nimport { getParentSelector } from \"./modalHelper\";\r\n\r\n// cspell:ignore reactselect builtins\r\n\r\n/* eslint-disable @typescript-eslint/no-shadow, @typescript-eslint/consistent-type-definitions, @typescript-eslint/array-type */\r\ntype FormatOptionLabelContext = \"menu\" | \"value\";\r\ntype FormatOptionLabelMeta = {\r\n context: FormatOptionLabelContext;\r\n inputValue: string;\r\n selectValue: ValueType<OptionType>;\r\n};\r\n\r\n/** OptionType for react-select 2.0 and above. which only accepts pairs of value & label strings\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport interface OptionType {\r\n value: any;\r\n label: string;\r\n}\r\n/** OptionsType to match label/value pair OptionType\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n*/\r\nexport type OptionsType = Array<OptionType>;\r\n\r\n/** ThemedSelectProps to control specific features of ThemedSelect\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\nexport type ThemedSelectProps = {\r\n /* Aria label (for assistive tech) */\r\n \"aria-label\"?: string;\r\n /* HTML ID of an element that should be used as the label (for assistive tech) */\r\n \"aria-labelledby\"?: string;\r\n /* Focus the control when it is mounted */\r\n autoFocus?: boolean;\r\n /* Remove the currently focused option when the user presses backspace */\r\n backspaceRemovesValue?: boolean;\r\n /* Remove focus from the input when the user selects an option (handy for dismissing the keyboard on touch devices) */\r\n blurInputOnSelect?: boolean;\r\n /* When the user reaches the top/bottom of the menu, prevent scroll on the scroll-parent */\r\n captureMenuScroll?: boolean;\r\n /* Sets a className attribute on the outer component */\r\n className?: string;\r\n /* Close the select menu when the user selects an option */\r\n closeMenuOnSelect?: boolean;\r\n /*\r\n If `true`, close the select menu when the user scrolls the document/body.\r\n\r\n If a function, takes a standard javascript `ScrollEvent` you return a boolean:\r\n\r\n `true` => The menu closes\r\n\r\n `false` => The menu stays open\r\n\r\n This is useful when you have a scrollable modal and want to portal the menu out,\r\n but want to avoid graphical issues.\r\n */\r\n closeMenuOnScroll?: boolean | EventListener;\r\n /*\r\n This complex object includes all the compositional components that are used\r\n in `react-select`. If you wish to overwrite a component, pass in an object\r\n with the appropriate namespace.\r\n\r\n If you only wish to restyle a component, we recommend using the `styles` prop\r\n instead. For a list of the components that can be passed in, and the shape\r\n that will be passed to them, see [the components docs](/components)\r\n */\r\n components?: SelectComponentsConfig<OptionType>;\r\n /* Whether the value of the select, e.g. SingleValue, should be displayed in the control. */\r\n controlShouldRenderValue?: boolean;\r\n /* Ff true, the menu is open immediately */\r\n defaultMenuIsOpen?: boolean;\r\n /* Value set in the control by default */\r\n defaultValue?: ValueType<OptionType>;\r\n /** Provides ability to return reference to the outer HTMLDivElement */\r\n divRef?: React.Ref<HTMLDivElement>;\r\n /* Clear all values when the user presses escape AND the menu is closed */\r\n escapeClearsValue?: boolean;\r\n /* Custom method to filter whether an option should be displayed in the menu */\r\n filterOption?: ((\r\n option: OptionType,\r\n rawInput: string,\r\n ) => boolean) | null;\r\n /*\r\n Formats group labels in the menu as React components\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n*/\r\n formatGroupLabel?: typeof formatGroupLabel;\r\n /* Formats option labels in the menu and control as React components */\r\n formatOptionLabel?: (optionType: OptionType, formatLabelMeta: FormatOptionLabelMeta) => React.ReactNode;\r\n /* Resolves option data to a string to be displayed as the label by components */\r\n getOptionLabel?: typeof getOptionLabel;\r\n /* Resolves option data to a string to compare options and specify value attributes */\r\n getOptionValue?: typeof getOptionValue;\r\n /* Hide the selected option from the menu */\r\n hideSelectedOptions?: boolean;\r\n /* The id to set on the SelectContainer component. */\r\n id?: string;\r\n /* The value of the search input */\r\n inputValue?: string;\r\n /* The id of the search input */\r\n inputId?: string;\r\n /* Define an id prefix for the select components e.g. {your-id}-value */\r\n instanceId?: number | string;\r\n /* Is the select value clearable */\r\n isClearable?: boolean;\r\n /* Is the select disabled */\r\n isDisabled?: boolean;\r\n /* Is the select in a state of loading (async) */\r\n isLoading?: boolean;\r\n /*\r\n Override the built-in logic to detect whether an option is disabled\r\n\r\n An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.\r\n */\r\n isOptionDisabled?: (option: OptionType, options: OptionsType) => boolean | false;\r\n /* Support multiple selected options */\r\n isMulti?: boolean;\r\n /* If true, menu will not be opened in a portal */\r\n isMenuFixed?: boolean;\r\n /* Is the select direction right-to-left */\r\n isRtl?: boolean;\r\n /* Whether to enable search functionality */\r\n isSearchable?: boolean;\r\n /* Minimum height of the menu before flipping */\r\n minMenuHeight?: number;\r\n /* Maximum height of the menu before scrolling */\r\n maxMenuHeight?: number;\r\n /* Whether the menu is open */\r\n menuIsOpen?: boolean;\r\n /* Whether to block scroll events when the menu is open */\r\n menuShouldBlockScroll?: boolean;\r\n /* Whether the menu should be scrolled into view when it opens */\r\n menuShouldScrollIntoView?: boolean;\r\n /* Name of the HTML Input (optional - without this, no input will be rendered) */\r\n name?: string;\r\n /* Text to display when there are no options */\r\n noOptionsMessage?: (obj: { inputValue: string }) => string | null;\r\n /* Handle blur events on the control */\r\n onBlur?: FocusEventHandler;\r\n /* Handle change events on the select */\r\n onChange?: (value: ValueType<OptionType>, action: ActionMeta<OptionType>) => void;\r\n /* Handle focus events on the control */\r\n onFocus?: FocusEventHandler;\r\n /* Handle change events on the input */\r\n onInputChange?: (newValue: string, actionMeta?: InputActionMeta) => void;\r\n /* Handle key down events on the select */\r\n onKeyDown?: KeyboardEventHandler;\r\n /* Handle the menu opening */\r\n onMenuOpen?: () => void;\r\n /* Handle the menu closing */\r\n onMenuClose?: () => void;\r\n /* Fired when the user scrolls to the top of the menu */\r\n onMenuScrollToTop?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Fired when the user scrolls to the bottom of the menu */\r\n onMenuScrollToBottom?: (e: React.SyntheticEvent<HTMLElement>) => void;\r\n /* Allows control of whether the menu is opened when the Select is focused */\r\n openMenuOnFocus?: boolean;\r\n /* Allows control of whether the menu is opened when the Select is clicked */\r\n openMenuOnClick?: boolean;\r\n /* Array of options that populate the select menu */\r\n options: OptionsType;\r\n /* Number of options to jump in menu when page{up|down} keys are used */\r\n pageSize?: number;\r\n /* Placeholder for the select value */\r\n placeholder?: string;\r\n /** Provides ability to return reference to the ThemedSelect */\r\n ref?: React.Ref<Component>;\r\n /* Sets additional styling */\r\n styles?: React.CSSProperties;\r\n /* Sets the tabIndex attribute on the input */\r\n tabIndex?: string;\r\n /* Select the currently focused option when the user presses tab */\r\n tabSelectsValue?: boolean;\r\n /* The value of the select; reflected by the selected option */\r\n value?: ValueType<OptionType>;\r\n};\r\n\r\nconst ThemedMenu = (props: MenuProps<any>) => { // eslint-disable-line @typescript-eslint/naming-convention\r\n return (\r\n <div className=\"uicore-reactSelectTop\">\r\n <components.Menu {...props} />\r\n </div>\r\n );\r\n};\r\n/** ThemedSelect is a wrapper for react-select with iTwin.js UI theming applied\r\n * @beta\r\n * @deprecated use Select from @itwin/itwinui-react\r\n */\r\n// eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport function ThemedSelect(props: ThemedSelectProps) {\r\n const noOptionLabel = React.useRef<string | undefined>();\r\n const defaultOptionMessage = React.useCallback(() => {\r\n if (!noOptionLabel.current) {\r\n noOptionLabel.current = UiCore.translate(\"reactelect.noSelectOption\");\r\n }\r\n return noOptionLabel.current;\r\n }, [noOptionLabel]);\r\n const noOptionFunction = props.noOptionsMessage ?? defaultOptionMessage;\r\n const selectClassName = classnames(\"uicore-reactSelectTop\", props.className);\r\n const portalTarget = !!props.isMenuFixed ? undefined : getParentSelector();\r\n const {\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n classNamePrefix, className, noOptionsMessage, menuPortalTarget, isMenuFixed, styles, components, divRef, ref,\r\n // eslint-disable-next-line comma-dangle\r\n ...otherProps // pass-through props\r\n } = props as any;\r\n const selectStyles = {\r\n ...props.styles,\r\n menuPortal: (base: React.CSSProperties) => ({ ...base, zIndex }),\r\n };\r\n\r\n const zIndex = getCssVariableAsNumber(\"--uicore-z-index-dialog-popup\");\r\n return (\r\n <div className={selectClassName} ref={divRef}>\r\n <Component\r\n ref={ref}\r\n classNamePrefix=\"react-select\"\r\n noOptionsMessage={noOptionFunction}\r\n menuPortalTarget={portalTarget}\r\n styles={selectStyles}\r\n // eslint-disable-next-line @typescript-eslint/naming-convention\r\n components={{ Menu: ThemedMenu, ...props.components }}\r\n {...otherProps}\r\n />\r\n </div>\r\n );\r\n}\r\n"]}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* @module Utilities
|
|
3
3
|
*/
|
|
4
4
|
import { BeUiEvent } from "@itwin/core-bentley";
|
|
5
|
-
/**
|
|
5
|
+
/** iTwin.js UI UiEvent class is a subclass of BeEvent with argument type safety.
|
|
6
6
|
* @public
|
|
7
7
|
*/
|
|
8
8
|
export declare class UiEvent<TEventArgs> extends BeUiEvent<TEventArgs> {
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* @module Utilities
|
|
7
7
|
*/
|
|
8
8
|
import { BeUiEvent } from "@itwin/core-bentley";
|
|
9
|
-
/**
|
|
9
|
+
/** iTwin.js UI UiEvent class is a subclass of BeEvent with argument type safety.
|
|
10
10
|
* @public
|
|
11
11
|
*/
|
|
12
12
|
export class UiEvent extends BeUiEvent {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UiEvent.js","sourceRoot":"","sources":["../../../../src/core-react/utils/UiEvent.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD;;GAEG;AACH,MAAM,OAAO,OAAoB,SAAQ,SAAqB;CAAI","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport { BeUiEvent } from \"@itwin/core-bentley\";\r\n\r\n/**
|
|
1
|
+
{"version":3,"file":"UiEvent.js","sourceRoot":"","sources":["../../../../src/core-react/utils/UiEvent.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD;;GAEG;AACH,MAAM,OAAO,OAAoB,SAAQ,SAAqB;CAAI","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport { BeUiEvent } from \"@itwin/core-bentley\";\r\n\r\n/** iTwin.js UI UiEvent class is a subclass of BeEvent with argument type safety.\r\n * @public\r\n */\r\nexport class UiEvent<TEventArgs> extends BeUiEvent<TEventArgs> { }\r\n"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@itwin/core-react",
|
|
3
|
-
"version": "3.0.0-dev.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "3.0.0-dev.138",
|
|
4
|
+
"description": "iTwin.js UI core components",
|
|
5
5
|
"main": "lib/cjs/core-react.js",
|
|
6
6
|
"module": "lib/esm/core-react.js",
|
|
7
7
|
"typings": "lib/cjs/core-react",
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
"url": "http://www.bentley.com"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
|
-
"@itwin/appui-abstract": "^3.0.0-dev.
|
|
27
|
-
"@itwin/core-bentley": "^3.0.0-dev.
|
|
26
|
+
"@itwin/appui-abstract": "^3.0.0-dev.138",
|
|
27
|
+
"@itwin/core-bentley": "^3.0.0-dev.138",
|
|
28
28
|
"react": "^17.0.0",
|
|
29
29
|
"react-dom": "^17.0.0"
|
|
30
30
|
},
|
|
@@ -33,12 +33,12 @@
|
|
|
33
33
|
"NOTE: All tools used by scripts in this package must be listed as devDependencies"
|
|
34
34
|
],
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@itwin/appui-abstract": "3.0.0-dev.
|
|
37
|
-
"@itwin/build-tools": "3.0.0-dev.
|
|
38
|
-
"@itwin/core-bentley": "3.0.0-dev.
|
|
39
|
-
"@itwin/core-common": "3.0.0-dev.
|
|
40
|
-
"@itwin/core-i18n": "3.0.0-dev.
|
|
41
|
-
"@itwin/eslint-plugin": "3.0.0-dev.
|
|
36
|
+
"@itwin/appui-abstract": "3.0.0-dev.138",
|
|
37
|
+
"@itwin/build-tools": "3.0.0-dev.138",
|
|
38
|
+
"@itwin/core-bentley": "3.0.0-dev.138",
|
|
39
|
+
"@itwin/core-common": "3.0.0-dev.138",
|
|
40
|
+
"@itwin/core-i18n": "3.0.0-dev.138",
|
|
41
|
+
"@itwin/eslint-plugin": "3.0.0-dev.138",
|
|
42
42
|
"@testing-library/react": "^12.0.0",
|
|
43
43
|
"@testing-library/react-hooks": "^7.0.2",
|
|
44
44
|
"@testing-library/user-event": "^13.2.1",
|