@itwin/core-react 4.9.0-dev.1 → 4.9.0

package/lib/cjs/core-react/index.scss

@@ -13,6 +13,7 @@
 @import "./_typography";
 
 @import "./base/index";
+@import "./expandable/index";
 @import "./icons/index";
 @import "./inputs/index";
 @import "./loading/index";

package/lib/cjs/core-react/inputs/iconinput/IconInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconInput.d.ts","sourceRoot":"","sources":["../../../../../src/core-react/inputs/iconinput/IconInput.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC;IAC9D,mFAAmF;IACnF,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,+DAA+D;IAC/D,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,+DAA+D;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;CAC1B;AAyBD;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,KAAK,CAAC,YAAY,GAAG,IACnD,CAAC"}
+{"version":3,"file":"IconInput.d.ts","sourceRoot":"","sources":["../../../../../src/core-react/inputs/iconinput/IconInput.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC;IAC9D,mFAAmF;IACnF,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,+DAA+D;IAC/D,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,+DAA+D;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;CAC1B;AAqBD;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,KAAK,CAAC,YAAY,GAAG,IACnD,CAAC"}

package/lib/cjs/core-react/inputs/iconinput/IconInput.js

@@ -16,10 +16,10 @@ const Input_1 = require("../Input"); // NEEDSWORK - for nativeKeyHandler
  * @public
  */
 const ForwardRefIconInput = React.forwardRef(function ForwardRefIconInput(props, ref) {
-    const { className, icon, containerClassName, size, ...otherProps } = props;
+    const { icon, containerClassName, size, ...otherProps } = props;
     // NEEDSWORK: still using core-react Input component because of `nativeKeyHandler` prop
     return (React.createElement("div", { className: (0, classnames_1.default)("core-iconInput-container", containerClassName) },
-        React.createElement(Input_1.Input, { ref: ref, className: (0, classnames_1.default)("core-input", className), ...otherProps }),
+        React.createElement(Input_1.Input, { ref: ref, ...otherProps }),
         React.createElement("div", { className: "core-iconInput-icon" }, icon)));
 });
 /** Input component with icon to the left of the input field

package/lib/cjs/core-react/inputs/iconinput/IconInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/iconinput/IconInput.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAE/B,oCAAiC,CAAC,mCAAmC;AAgBrE;;GAEG;AACH,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,SAAS,mBAAmB,CAAC,KAAK,EAAE,GAAG;IACrC,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IAE3E,uFAAuF;IACvF,OAAO,CACL,6BACE,SAAS,EAAE,IAAA,oBAAU,EAAC,0BAA0B,EAAE,kBAAkB,CAAC;QAErE,oBAAC,aAAK,IACJ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,oBAAU,EAAC,YAAY,EAAE,SAAS,CAAC,KAC1C,UAAU,GACd;QACF,6BAAK,SAAS,EAAC,qBAAqB,IAAE,IAAI,CAAO,CAC7C,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;GAEG;AACU,QAAA,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 { className, 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\n          ref={ref}\n          className={classnames(\"core-input\", className)}\n          {...otherProps}\n        />\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"]}
+{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/iconinput/IconInput.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAE/B,oCAAiC,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,IAAA,oBAAU,EAAC,0BAA0B,EAAE,kBAAkB,CAAC;QAErE,oBAAC,aAAK,IAAC,GAAG,EAAE,GAAG,KAAM,UAAU,GAAI;QACnC,6BAAK,SAAS,EAAC,qBAAqB,IAAE,IAAI,CAAO,CAC7C,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;GAEG;AACU,QAAA,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"]}

package/lib/cjs/core-react/inputs/iconinput/IconInput.scss

@@ -10,7 +10,7 @@
   padding: 0;
   margin: 0;
 
-  .core-input {
+  .iui-input {
     margin: 0;
     padding-left: 30px;
   }

package/lib/cjs/core-react/inputs/input.scss

@@ -8,7 +8,7 @@
 @mixin uicore-inputs-input {
   display: block;
   width: 100%;
-  padding: $uicore-iui-input-padding;
+  padding: $uicore-inputs-padding-bordered $uicore-bordered-padding;
   margin: $uicore-inputs-margin 0;
   font-family: var(--iui-font-sans);
   font-size: var(--iui-font-size-1);
@@ -51,4 +51,8 @@
     border-color: $buic-foreground-focus-border;
     box-shadow: $uicore-inputs-focus-boxshadow;
   }
+
+  &.iui-input {
+    padding: $uicore-iui-input-padding;
+  }
 }

package/lib/cjs/core-react/inputs/numberinput/NumberInput.d.ts

@@ -3,8 +3,7 @@
  */
 import "./NumberInput.scss";
 import * as React from "react";
-import { Input } from "@itwin/itwinui-react";
-type InputProps = React.ComponentPropsWithoutRef<typeof Input>;
+import type { InputProps } from "@itwin/itwinui-react";
 /** Step function prototype for [[NumberInput]] component
  * @public
  */
@@ -49,5 +48,4 @@ export interface NumberInputProps extends Omit<InputProps, "min" | "max" | "step
  * @public
  */
 export declare const NumberInput: (props: NumberInputProps) => React.ReactElement | null;
-export {};
 //# sourceMappingURL=NumberInput.d.ts.map

package/lib/cjs/core-react/inputs/numberinput/NumberInput.d.ts.map

@@ -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,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAS7C,KAAK,UAAU,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,KAAK,CAAC,CAAC;AAE/D;;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;AAyQD;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,CACxB,KAAK,EAAE,gBAAgB,KACpB,KAAK,CAAC,YAAY,GAAG,IAA4B,CAAC"}
+{"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"}

package/lib/cjs/core-react/inputs/numberinput/NumberInput.js

@@ -16,7 +16,7 @@ const itwinui_react_1 = require("@itwin/itwinui-react");
 const IconComponent_1 = require("../../icons/IconComponent");
 const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 const ForwardRefNumberInput = React.forwardRef(function ForwardRefNumberInput(props, ref) {
-    const { containerClassName, className, value, min, max, precision, format, parse, onChange, onBlur, onKeyDown, step, snap, showTouchButtons, containerStyle, isControlled, ...otherProps } = props;
+    const { containerClassName, value, min, max, precision, format, parse, onChange, onBlur, onKeyDown, step, snap, showTouchButtons, containerStyle, isControlled, ...otherProps } = props;
     const currentValueRef = React.useRef(value);
     /**
      * Used internally to parse the argument x to it's numeric representation.
@@ -149,7 +149,7 @@ const ForwardRefNumberInput = React.forwardRef(function ForwardRefNumberInput(pr
     const caretUp = showTouchButtons ? React.createElement(itwinui_icons_react_1.SvgCaretUp, null) : React.createElement(itwinui_icons_react_1.SvgCaretUpSmall, null);
     const caretDown = showTouchButtons ? React.createElement(itwinui_icons_react_1.SvgCaretDown, null) : React.createElement(itwinui_icons_react_1.SvgCaretDownSmall, null);
     return (React.createElement("div", { className: containerClasses, style: containerStyle },
-        React.createElement(itwinui_react_1.Input, { ref: ref, value: formattedValue, onChange: handleChange, onKeyDown: handleKeyDown, onFocus: handleFocus, onBlur: handleBlur, size: "small", className: (0, classnames_1.default)("core-input", className), ...otherProps }),
+        React.createElement(itwinui_react_1.Input, { ref: ref, value: formattedValue, onChange: handleChange, onKeyDown: handleKeyDown, onFocus: handleFocus, onBlur: handleBlur, size: "small", ...otherProps }),
         React.createElement("div", { className: (0, classnames_1.default)("core-number-input-buttons-container", showTouchButtons && "core-number-buttons-for-touch") },
             React.createElement("div", { className: "core-number-input-button core-number-input-button-up", tabIndex: -1, onClick: handleUpClick, role: "presentation" },
                 React.createElement(IconComponent_1.Icon, { iconSpec: caretUp })),

package/lib/cjs/core-react/inputs/numberinput/NumberInput.js.map

@@ -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"]}
+{"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"]}

package/lib/cjs/core-react/inputs/numberinput/NumberInput.scss

@@ -15,7 +15,7 @@
     margin: 0;
     padding-right: 1.5em;
 
-    &.core-input {
+    &.iui-input {
       padding: $uicore-iui-input-padding;
     }
   }

package/lib/cjs/core-react/listbox/Listbox.d.ts

@@ -47,10 +47,10 @@ export declare const ListboxContext: React.Context<ListboxContextProps>;
  * Single select `Listbox` component
  * @alpha
  */
-export declare function Listbox(props: ListboxProps): JSX.Element;
+export declare function Listbox(props: ListboxProps): React.JSX.Element;
 /**
  * `ListboxItem` component.
  * @alpha
  */
-export declare function ListboxItem(props: ListboxItemProps): JSX.Element;
+export declare function ListboxItem(props: ListboxItemProps): React.JSX.Element;
 //# sourceMappingURL=Listbox.d.ts.map

package/lib/cjs/core-react/listbox/Listbox.d.ts.map

@@ -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,eA6M1C;AAED;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,eA0DlD"}
+{"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"}

package/lib/cjs/core-react/loading/LoadingBar.d.ts

@@ -21,7 +21,7 @@ export interface LoadingBarProps extends CommonProps {
  */
 export declare class LoadingBar extends React.PureComponent<LoadingBarProps> {
     static defaultProps: Partial<LoadingBarProps>;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 /** Sanity check to keep percentage between 0 & 100
  * @internal

package/lib/cjs/core-react/loading/LoadingPrompt.d.ts

@@ -35,6 +35,6 @@ export interface LoadingPromptProps extends CommonProps {
  */
 export declare class LoadingPrompt extends React.PureComponent<LoadingPromptProps> {
     static defaultProps: Partial<LoadingPromptProps>;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 //# sourceMappingURL=LoadingPrompt.d.ts.map

package/lib/cjs/core-react/loading/LoadingSpinner.d.ts

@@ -3,8 +3,7 @@
  */
 import "./LoadingSpinner.scss";
 import * as React from "react";
-import { ProgressRadial } from "@itwin/itwinui-react";
-type ProgressRadialProps = React.ComponentPropsWithoutRef<typeof ProgressRadial>;
+import type { ProgressRadialProps } from "@itwin/itwinui-react";
 /** Type for ProgressRadialProps.size
  * @public
  */
@@ -29,7 +28,6 @@ export interface LoadingSpinnerProps extends Omit<ProgressRadialProps, "size"> {
  */
 export declare class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {
     static defaultProps: Partial<LoadingSpinnerProps>;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
-export {};
 //# sourceMappingURL=LoadingSpinner.d.ts.map

package/lib/cjs/core-react/loading/LoadingSpinner.d.ts.map

@@ -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,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,KAAK,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CACvD,OAAO,cAAc,CACtB,CAAC;AAEF;;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"}
+{"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"}

package/lib/cjs/core-react/loading/LoadingSpinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,iCAA+B;AAC/B,+BAA+B;AAC/B,wDAAsD;AA0BtD;;;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,8BAAc,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;AAHS,wCAAc","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 { ProgressRadial } from \"@itwin/itwinui-react\";\n\ntype ProgressRadialProps = React.ComponentPropsWithoutRef<\n  typeof ProgressRadial\n>;\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"]}
+{"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,iCAA+B;AAC/B,+BAA+B;AAE/B,wDAAsD;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,8BAAc,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;AAHS,wCAAc","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"]}

package/lib/cjs/core-react/loading/LoadingStatus.d.ts

@@ -20,6 +20,6 @@ export interface LoadingStatusProps extends CommonProps {
 export declare class LoadingStatus extends React.PureComponent<LoadingStatusProps> {
     static defaultProps: Partial<LoadingStatusProps>;
     private inRange;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 //# sourceMappingURL=LoadingStatus.d.ts.map

package/lib/cjs/core-react/notification/MessageRenderer.d.ts

@@ -1,7 +1,7 @@
 /** @packageDocumentation
  * @module Notification
  */
-/// <reference types="react" />
+import * as React from "react";
 import type { MessageType } from "./MessageType";
 import type { ClassNameProps } from "../utils/Props";
 /** Properties for the [[MessageRenderer]] component
@@ -16,5 +16,5 @@ export interface MessageRendererProps extends ClassNameProps {
 /** React component renders a string, HTMLElement or React node in a `div` or `span`
  * @public
  */
-export declare function MessageRenderer(props: MessageRendererProps): JSX.Element | null;
+export declare function MessageRenderer(props: MessageRendererProps): React.JSX.Element | null;
 //# sourceMappingURL=MessageRenderer.d.ts.map

package/lib/cjs/core-react/notification/MessageRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core-react/notification/MessageRenderer.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAIH,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,sBAyF1D"}
+{"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"}

package/lib/cjs/core-react/popup/Popup.d.ts

@@ -107,6 +107,7 @@ export declare class Popup extends React.Component<PopupProps, PopupState> {
     private _fitPopup;
     private _handleAnimationEnd;
     render(): React.ReactPortal | null;
+    private getContainer;
 }
 export {};
 //# sourceMappingURL=Popup.d.ts.map

package/lib/cjs/core-react/popup/Popup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/core-react/popup/Popup.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/core-react/popup/Popup.tsx"],"names":[],"mappings":"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"}

package/lib/cjs/core-react/popup/Popup.js

@@ -15,6 +15,7 @@ const ReactDOM = require("react-dom");
 const ts_key_enum_1 = require("ts-key-enum");
 const appui_abstract_1 = require("@itwin/appui-abstract");
 const FocusTrap_1 = require("../focustrap/FocusTrap");
+const Rectangle_1 = require("../utils/Rectangle");
 /** Popup React component displays a popup relative to an optional target element.
  * @public
  */
@@ -120,13 +121,21 @@ class Popup extends React.Component {
             // relative position
             const scrollY = activeWindow.scrollY;
             const scrollX = activeWindow.scrollX;
-            const targetRect = target.getBoundingClientRect();
+            const container = this.getContainer();
+            const containerBounds = container.getBoundingClientRect();
+            const targetRect = Rectangle_1.Rectangle.create(target.getBoundingClientRect()).offset({
+                x: -containerBounds.left,
+                y: -containerBounds.top,
+            });
             const { popupWidth, popupHeight } = this._getPopupDimensions();
             switch (position) {
                 case appui_abstract_1.RelativePosition.Top:
                     point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
                     point.x =
-                        scrollX + targetRect.left + targetRect.width / 2 - popupWidth / 2;
+                        scrollX +
+                            targetRect.left +
+                            targetRect.getWidth() / 2 -
+                            popupWidth / 2;
                     break;
                 case appui_abstract_1.RelativePosition.TopLeft:
                     point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
@@ -139,7 +148,10 @@ class Popup extends React.Component {
                 case appui_abstract_1.RelativePosition.Bottom:
                     point.y = scrollY + targetRect.bottom + offset + offsetArrow;
                     point.x =
-                        scrollX + targetRect.left + targetRect.width / 2 - popupWidth / 2;
+                        scrollX +
+                            targetRect.left +
+                            targetRect.getWidth() / 2 -
+                            popupWidth / 2;
                     break;
                 case appui_abstract_1.RelativePosition.BottomLeft:
                     point.y = scrollY + targetRect.bottom + offset + offsetArrow;
@@ -151,7 +163,10 @@ class Popup extends React.Component {
                     break;
                 case appui_abstract_1.RelativePosition.Left:
                     point.y =
-                        scrollY + targetRect.top + targetRect.height / 2 - popupHeight / 2;
+                        scrollY +
+                            targetRect.top +
+                            targetRect.getHeight() / 2 -
+                            popupHeight / 2;
                     point.x = scrollX + targetRect.left - popupWidth - offset - offsetArrow;
                     break;
                 case appui_abstract_1.RelativePosition.LeftTop:
@@ -160,7 +175,10 @@ class Popup extends React.Component {
                     break;
                 case appui_abstract_1.RelativePosition.Right:
                     point.y =
-                        scrollY + targetRect.top + targetRect.height / 2 - popupHeight / 2;
+                        scrollY +
+                            targetRect.top +
+                            targetRect.getHeight() / 2 -
+                            popupHeight / 2;
                     point.x = scrollX + targetRect.right + offset + offsetArrow;
                     break;
                 case appui_abstract_1.RelativePosition.RightTop:
@@ -405,7 +423,6 @@ class Popup extends React.Component {
         return newPosition;
     }
     render() {
-        var _a;
         const animate = this.props.animate !== undefined ? this.props.animate : true;
         const className = (0, classnames_1.default)("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 &&
             this.props.keepContentsMounted &&
@@ -422,9 +439,12 @@ class Popup extends React.Component {
         return ReactDOM.createPortal(React.createElement("div", { className: className, "data-testid": "core-popup", ref: (element) => {
                 this._popup = element;
             }, style: style, role: role, "aria-modal": true, tabIndex: -1, "aria-label": this.props.ariaLabel, onAnimationEnd: this._handleAnimationEnd },
-            React.createElement(FocusTrap_1.FocusTrap, { active: !!this.props.moveFocus, initialFocusElement: this.props.focusTarget, returnFocusOnDeactivate: true }, this.props.children)), 
+            React.createElement(FocusTrap_1.FocusTrap, { active: !!this.props.moveFocus, initialFocusElement: this.props.focusTarget, returnFocusOnDeactivate: true }, this.props.children)), this.getContainer());
+    }
+    getContainer() {
+        var _a;
         // istanbul ignore next
-        (_a = this.state.parentDocument.body.querySelector('[data-root-container="appui-root-id"]')) !== null && _a !== void 0 ? _a : this.state.parentDocument.body);
+        return ((_a = this.state.parentDocument.body.querySelector('[data-root-container="iui-root-id"]')) !== null && _a !== void 0 ? _a : this.state.parentDocument.body);
     }
 }
 Popup.defaultProps = {