@itwin/core-react 4.0.0-dev.8 → 4.0.0-dev.9

package/lib/cjs/core-react/icons/IconComponent.js

@@ -13,7 +13,6 @@ require("./IconComponent.scss");
 const React = require("react");
 const classnames_1 = require("classnames");
 const appui_abstract_1 = require("@itwin/appui-abstract");
-const SvgSprite_1 = require("./SvgSprite");
 const dompurify_1 = require("dompurify"), DOMPurifyNS = dompurify_1;
 /** Icon Functional component displays an icon based on an [[IconSpec]].
  * @public
@@ -24,11 +23,6 @@ function Icon(props) {
     const iconString = (typeof props.iconSpec === "string" || props.iconSpec instanceof appui_abstract_1.ConditionalStringValue) ?
         appui_abstract_1.ConditionalStringValue.getValue(props.iconSpec) : undefined;
     if (iconString) {
-        const svgSource = appui_abstract_1.IconSpecUtilities.getSvgSource(iconString);
-        // if string begins with "svg:" then we assume it was imported (into extension source file) using webpack loader svg-sprite-loader
-        if (svgSource !== undefined)
-            return (React.createElement("i", { className: (0, classnames_1.default)("icon", "core-svg-icon", props.className), style: props.style },
-                React.createElement(SvgSprite_1.SvgSprite, { src: svgSource })));
         const webComponentString = appui_abstract_1.IconSpecUtilities.getWebComponentSource(iconString);
         if (webComponentString) {
             const svgLoader = `<svg-loader src="${webComponentString}"></svg-loader>`;
@@ -49,7 +43,7 @@ function Icon(props) {
         }
         return (React.createElement("i", { className: (0, classnames_1.default)("icon", iconString, props.className), style: props.style }));
     }
-    return (React.createElement("i", { className: (0, classnames_1.default)("icon", "core-svg-icon", props.className), style: props.style }, props.iconSpec));
+    return (React.createElement("i", { className: (0, classnames_1.default)("icon", "core-svg-icon", props.className), style: props.style }, props.iconSpec instanceof appui_abstract_1.ConditionalStringValue ? undefined : props.iconSpec));
 }
 exports.Icon = Icon;
 //# sourceMappingURL=IconComponent.js.map

package/lib/cjs/core-react/icons/IconComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconComponent.js","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;;;AAEH,gCAA8B;AAC9B,+BAA+B;AAC/B,2CAAoC;AACpC,0DAAkF;AAClF,2CAAwC;AAExC,oEAAoD;AAiBpD;;GAEG;AACH,SAAgB,IAAI,CAAC,KAAgB;IACnC,IAAI,CAAC,KAAK,CAAC,QAAQ;QACjB,OAAO,IAAI,CAAC;IAEd,MAAM,UAAU,GAAG,CAAC,OAAO,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,KAAK,CAAC,QAAQ,YAAY,uCAAsB,CAAC,CAAC,CAAC;QAC3G,uCAAsB,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9D,IAAI,UAAU,EAAE;QACd,MAAM,SAAS,GAAG,kCAAiB,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QAC7D,kIAAkI;QAClI,IAAI,SAAS,KAAK,SAAS;YACzB,OAAO,CACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK;gBACpF,oBAAC,qBAAS,IAAC,GAAG,EAAE,SAAS,GAAI,CAC3B,CACL,CAAC;QACJ,MAAM,kBAAkB,GAAG,kCAAiB,CAAC,qBAAqB,CAAC,UAAU,CAAC,CAAC;QAC/E,IAAI,kBAAkB,EAAE;YACtB,MAAM,SAAS,GAAG,oBAAoB,kBAAkB,iBAAiB,CAAC;YAC1E,MAAM,MAAM,GAAG,QAAQ,SAAS,QAAQ,CAAC;YACzC,6EAA6E;YAC7E,iFAAiF;YACjF,uBAAuB;YACvB,MAAM,SAAS,GAAG,mBAAS,aAAT,mBAAS,cAAT,mBAAS,GAAI,WAAW,CAAC;YAE3C,MAAM,eAAe,GAAG;gBACtB,YAAY,EAAE,CAAC,YAAY,CAAC;gBAC5B,iBAAiB,EAAE,kBAAkB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;aACzE,CAAC;YAEF,MAAM,mBAAmB,GAAG,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;YACxE,iFAAiF;YACjF,+FAA+F;YAC/F,MAAM,gBAAgB,GAAG,6BAAK,uBAAuB,EAAE,EAAE,MAAM,EAAE,mBAAmB,EAAE,GAAQ,CAAC;YAC/F,OAAO,CACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,IAC/D,gBAAgB,CACf,CACL,CAAC;SACH;QACD,OAAO,CAAC,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,CAAC,CAAC;KAChG;IAED,OAAO,CACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,IACnF,KAAK,CAAC,QAAQ,CACb,CACL,CAAC;AACJ,CAAC;AAhDD,oBAgDC","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 Icon\r\n */\r\n\r\nimport \"./IconComponent.scss\";\r\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\nimport { ConditionalStringValue, IconSpecUtilities } from \"@itwin/appui-abstract\";\r\nimport { SvgSprite } from \"./SvgSprite\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport DOMPurify, * as DOMPurifyNS from \"dompurify\";\r\n\r\n/** Prototype for an IconSpec which can be a string, ReactNode or ConditionalStringValue.\r\n * @public\r\n */\r\nexport type IconSpec = string | ConditionalStringValue | React.ReactNode;\r\n\r\n/** Properties for the [[Icon]] React component\r\n * @public\r\n */\r\nexport interface IconProps extends CommonProps {\r\n  /** CSS class name or SvgSprite/SvgPath for icon. This is optional because it is improperly\r\n   * used to extend other interfaces and changing it would break existing API.\r\n   */\r\n  iconSpec?: IconSpec;\r\n}\r\n\r\n/** Icon Functional component displays an icon based on an [[IconSpec]].\r\n * @public\r\n */\r\nexport function Icon(props: IconProps) {\r\n  if (!props.iconSpec)\r\n    return null;\r\n\r\n  const iconString = (typeof props.iconSpec === \"string\" || props.iconSpec instanceof ConditionalStringValue) ?\r\n    ConditionalStringValue.getValue(props.iconSpec) : undefined;\r\n\r\n  if (iconString) {\r\n    const svgSource = IconSpecUtilities.getSvgSource(iconString);\r\n    // if string begins with \"svg:\" then we assume it was imported (into extension source file) using webpack loader svg-sprite-loader\r\n    if (svgSource !== undefined)\r\n      return (\r\n        <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} style={props.style}>\r\n          <SvgSprite src={svgSource} />\r\n        </i>\r\n      );\r\n    const webComponentString = IconSpecUtilities.getWebComponentSource(iconString);\r\n    if (webComponentString) {\r\n      const svgLoader = `<svg-loader src=\"${webComponentString}\"></svg-loader>`;\r\n      const svgDiv = `<div>${svgLoader}</div>`;\r\n      // the esm build of dompurify has a default import but the cjs build does not\r\n      // if there is a default export, use it (likely esm), otherwise use the namespace\r\n      // istanbul ignore next\r\n      const sanitizer = DOMPurify ?? DOMPurifyNS;\r\n\r\n      const sanitizerConfig = {\r\n        ALLOWED_TAGS: [\"svg-loader\"],\r\n        ADD_URI_SAFE_ATTR: webComponentString.startsWith(\"data:\") ? [\"src\"] : [],\r\n      };\r\n\r\n      const sanitizedIconString = sanitizer.sanitize(svgDiv, sanitizerConfig);\r\n      // we can safely disable jam3/no-sanitizer-with-danger as we are sanitizing above\r\n      // eslint-disable-next-line @typescript-eslint/naming-convention, jam3/no-sanitizer-with-danger\r\n      const webComponentNode = <div dangerouslySetInnerHTML={{ __html: sanitizedIconString }}></div>;\r\n      return (\r\n        <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} >\r\n          {webComponentNode}\r\n        </i>\r\n      );\r\n    }\r\n    return (<i className={classnames(\"icon\", iconString, props.className)} style={props.style} />);\r\n  }\r\n\r\n  return (\r\n    <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} style={props.style}>\r\n      {props.iconSpec}\r\n    </i>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"IconComponent.js","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;;;AAEH,gCAA8B;AAC9B,+BAA+B;AAC/B,2CAAoC;AACpC,0DAAkF;AAElF,oEAAoD;AAiBpD;;GAEG;AACH,SAAgB,IAAI,CAAC,KAAgB;IACnC,IAAI,CAAC,KAAK,CAAC,QAAQ;QACjB,OAAO,IAAI,CAAC;IAEd,MAAM,UAAU,GAAG,CAAC,OAAO,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,KAAK,CAAC,QAAQ,YAAY,uCAAsB,CAAC,CAAC,CAAC;QAC3G,uCAAsB,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9D,IAAI,UAAU,EAAE;QACd,MAAM,kBAAkB,GAAG,kCAAiB,CAAC,qBAAqB,CAAC,UAAU,CAAC,CAAC;QAC/E,IAAI,kBAAkB,EAAE;YACtB,MAAM,SAAS,GAAG,oBAAoB,kBAAkB,iBAAiB,CAAC;YAC1E,MAAM,MAAM,GAAG,QAAQ,SAAS,QAAQ,CAAC;YACzC,6EAA6E;YAC7E,iFAAiF;YACjF,uBAAuB;YACvB,MAAM,SAAS,GAAG,mBAAS,aAAT,mBAAS,cAAT,mBAAS,GAAI,WAAW,CAAC;YAE3C,MAAM,eAAe,GAAG;gBACtB,YAAY,EAAE,CAAC,YAAY,CAAC;gBAC5B,iBAAiB,EAAE,kBAAkB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;aACzE,CAAC;YAEF,MAAM,mBAAmB,GAAG,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;YACxE,iFAAiF;YACjF,+FAA+F;YAC/F,MAAM,gBAAgB,GAAG,6BAAK,uBAAuB,EAAE,EAAE,MAAM,EAAE,mBAAmB,EAAE,GAAQ,CAAC;YAC/F,OAAO,CACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,IAC/D,gBAAgB,CACf,CACL,CAAC;SACH;QACD,OAAO,CAAC,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,CAAC,CAAC;KAChG;IAED,OAAO,CACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,IACnF,KAAK,CAAC,QAAQ,YAAY,uCAAsB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAC5E,CACL,CAAC;AACJ,CAAC;AAxCD,oBAwCC","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 Icon\r\n */\r\n\r\nimport \"./IconComponent.scss\";\r\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\nimport { ConditionalStringValue, IconSpecUtilities } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport DOMPurify, * as DOMPurifyNS from \"dompurify\";\r\n\r\n/** Prototype for an IconSpec which can be a string, ReactNode or ConditionalStringValue.\r\n * @public\r\n */\r\nexport type IconSpec = string | ConditionalStringValue | React.ReactNode;\r\n\r\n/** Properties for the [[Icon]] React component\r\n * @public\r\n */\r\nexport interface IconProps extends CommonProps {\r\n  /** CSS class name or SvgPath for icon. This is optional because it is improperly\r\n   * used to extend other interfaces and changing it would break existing API.\r\n   */\r\n  iconSpec?: IconSpec;\r\n}\r\n\r\n/** Icon Functional component displays an icon based on an [[IconSpec]].\r\n * @public\r\n */\r\nexport function Icon(props: IconProps) {\r\n  if (!props.iconSpec)\r\n    return null;\r\n\r\n  const iconString = (typeof props.iconSpec === \"string\" || props.iconSpec instanceof ConditionalStringValue) ?\r\n    ConditionalStringValue.getValue(props.iconSpec) : undefined;\r\n\r\n  if (iconString) {\r\n    const webComponentString = IconSpecUtilities.getWebComponentSource(iconString);\r\n    if (webComponentString) {\r\n      const svgLoader = `<svg-loader src=\"${webComponentString}\"></svg-loader>`;\r\n      const svgDiv = `<div>${svgLoader}</div>`;\r\n      // the esm build of dompurify has a default import but the cjs build does not\r\n      // if there is a default export, use it (likely esm), otherwise use the namespace\r\n      // istanbul ignore next\r\n      const sanitizer = DOMPurify ?? DOMPurifyNS;\r\n\r\n      const sanitizerConfig = {\r\n        ALLOWED_TAGS: [\"svg-loader\"],\r\n        ADD_URI_SAFE_ATTR: webComponentString.startsWith(\"data:\") ? [\"src\"] : [],\r\n      };\r\n\r\n      const sanitizedIconString = sanitizer.sanitize(svgDiv, sanitizerConfig);\r\n      // we can safely disable jam3/no-sanitizer-with-danger as we are sanitizing above\r\n      // eslint-disable-next-line @typescript-eslint/naming-convention, jam3/no-sanitizer-with-danger\r\n      const webComponentNode = <div dangerouslySetInnerHTML={{ __html: sanitizedIconString }}></div>;\r\n      return (\r\n        <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} >\r\n          {webComponentNode}\r\n        </i>\r\n      );\r\n    }\r\n    return (<i className={classnames(\"icon\", iconString, props.className)} style={props.style} />);\r\n  }\r\n\r\n  return (\r\n    <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} style={props.style}>\r\n      {props.iconSpec instanceof ConditionalStringValue ? undefined : props.iconSpec}\r\n    </i>\r\n  );\r\n}\r\n"]}

package/lib/cjs/core-react/icons/SvgPath.d.ts

@@ -1,7 +1,7 @@
 /** @packageDocumentation
  * @module Icon
  */
-import "./SvgSprite.scss";
+import "./SvgPath.scss";
 import * as React from "react";
 import { CommonProps } from "../utils/Props";
 /** Properties of [[SvgPath]] component.

package/lib/cjs/core-react/icons/SvgPath.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SvgPath.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgPath.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,yBAAyB;IACzB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,wBAAwB;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,yBAAyB;IACzB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,qBAAa,OAAQ,SAAQ,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC;IAC5C,MAAM;CAqBvB"}
+{"version":3,"file":"SvgPath.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgPath.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,gBAAgB,CAAC;AAExB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,yBAAyB;IACzB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,wBAAwB;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,yBAAyB;IACzB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,qBAAa,OAAQ,SAAQ,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC;IAC5C,MAAM;CAqBvB"}

package/lib/cjs/core-react/icons/SvgPath.js

@@ -8,7 +8,7 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SvgPath = void 0;
-require("./SvgSprite.scss");
+require("./SvgPath.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
 /** Svg element wrapper with specified Svg paths.
@@ -16,7 +16,7 @@ const React = require("react");
  */
 class SvgPath extends React.PureComponent {
     render() {
-        const className = (0, classnames_1.default)("core-icons-svgSprite", this.props.className);
+        const className = (0, classnames_1.default)("core-icons-svgPath", this.props.className);
         const viewBox = `0 0 ${this.props.viewBoxWidth} ${this.props.viewBoxHeight}`;
         return (React.createElement("svg", { className: className, style: this.props.style, width: "100%", height: "100%", viewBox: viewBox },
             React.createElement("g", null, this.props.paths.map((path, index) => {

package/lib/cjs/core-react/icons/SvgPath.js.map

@@ -1 +1 @@
-{"version":3,"file":"SvgPath.js","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgPath.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAe/B;;GAEG;AACH,MAAa,OAAQ,SAAQ,KAAK,CAAC,aAA2B;IAC5C,MAAM;QACpB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,sBAAsB,EACtB,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,CAAC;QACF,MAAM,OAAO,GAAG,OAAO,IAAI,CAAC,KAAK,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC;QAE7E,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAE,OAAO;YAC7F,+BAEI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAY,EAAE,KAAa,EAAE,EAAE;gBACnD,OAAO,CACL,8BAAM,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,GAAI,CAC9B,CAAC;YACJ,CAAC,CAAC,CAEF,CACA,CACP,CAAC;IACJ,CAAC;CACF;AAtBD,0BAsBC","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 Icon\r\n */\r\n\r\nimport \"./SvgSprite.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties of [[SvgPath]] component.\r\n * @public\r\n */\r\nexport interface SvgPathProps extends CommonProps {\r\n  /** Svg graphics paths */\r\n  paths: string[];\r\n  /** Svg viewBox width */\r\n  viewBoxWidth: number;\r\n  /** Svg viewBox height */\r\n  viewBoxHeight: number;\r\n}\r\n\r\n/** Svg element wrapper with specified Svg paths.\r\n * @public\r\n */\r\nexport class SvgPath extends React.PureComponent<SvgPathProps> {\r\n  public override render() {\r\n    const className = classnames(\r\n      \"core-icons-svgSprite\",\r\n      this.props.className,\r\n    );\r\n    const viewBox = `0 0 ${this.props.viewBoxWidth} ${this.props.viewBoxHeight}`;\r\n\r\n    return (\r\n      <svg className={className} style={this.props.style} width=\"100%\" height=\"100%\" viewBox={viewBox}>\r\n        <g>\r\n          {\r\n            this.props.paths.map((path: string, index: number) => {\r\n              return (\r\n                <path d={path} key={index} />\r\n              );\r\n            })\r\n          }\r\n        </g>\r\n      </svg>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"SvgPath.js","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgPath.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,0BAAwB;AACxB,2CAAoC;AACpC,+BAA+B;AAe/B;;GAEG;AACH,MAAa,OAAQ,SAAQ,KAAK,CAAC,aAA2B;IAC5C,MAAM;QACpB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,oBAAoB,EACpB,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,CAAC;QACF,MAAM,OAAO,GAAG,OAAO,IAAI,CAAC,KAAK,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC;QAE7E,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAE,OAAO;YAC7F,+BAEI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAY,EAAE,KAAa,EAAE,EAAE;gBACnD,OAAO,CACL,8BAAM,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,GAAI,CAC9B,CAAC;YACJ,CAAC,CAAC,CAEF,CACA,CACP,CAAC;IACJ,CAAC;CACF;AAtBD,0BAsBC","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 Icon\r\n */\r\n\r\nimport \"./SvgPath.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties of [[SvgPath]] component.\r\n * @public\r\n */\r\nexport interface SvgPathProps extends CommonProps {\r\n  /** Svg graphics paths */\r\n  paths: string[];\r\n  /** Svg viewBox width */\r\n  viewBoxWidth: number;\r\n  /** Svg viewBox height */\r\n  viewBoxHeight: number;\r\n}\r\n\r\n/** Svg element wrapper with specified Svg paths.\r\n * @public\r\n */\r\nexport class SvgPath extends React.PureComponent<SvgPathProps> {\r\n  public override render() {\r\n    const className = classnames(\r\n      \"core-icons-svgPath\",\r\n      this.props.className,\r\n    );\r\n    const viewBox = `0 0 ${this.props.viewBoxWidth} ${this.props.viewBoxHeight}`;\r\n\r\n    return (\r\n      <svg className={className} style={this.props.style} width=\"100%\" height=\"100%\" viewBox={viewBox}>\r\n        <g>\r\n          {\r\n            this.props.paths.map((path: string, index: number) => {\r\n              return (\r\n                <path d={path} key={index} />\r\n              );\r\n            })\r\n          }\r\n        </g>\r\n      </svg>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/{esm/core-react/icons/SvgSprite.scss → cjs/core-react/icons/SvgPath.scss}

@@ -2,7 +2,7 @@
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
-.core-icons-svgSprite {
+.core-icons-svgPath {
   display: inline-block;
   box-sizing: border-box;
   background-color: transparent;

package/lib/cjs/core-react/imagecheckbox/ImageCheckBox.scss

@@ -4,7 +4,6 @@
 *--------------------------------------------------------------------------------------------*/
 @import "../style/index.scss";
 @import "../icons/variables.scss";
-@import "~@itwin/itwinui-css/scss/style/variables";
 
 .core-image-checkbox {
   display: inline-block;
@@ -39,7 +38,7 @@
 
   input[type="checkbox"]:disabled:not(:checked) + .image,
   input[type="checkbox"]:disabled:checked + .image {
-    opacity: .25;
+    opacity: 0.25;
   }
 
   /* accessibility */
@@ -49,7 +48,7 @@
 }
 .image-checkbox-border {
   border: 1px solid $buic-foreground-disabled;
-  background-color:  $buic-background-control;
-  border-radius: $iui-border-radius;
+  background-color: $buic-background-control;
+  border-radius: var(--iui-border-radius-1);
   padding: 1px 3px 0 2px;
-}
+}

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

@@ -19,9 +19,5 @@
 @import "./icons/index";
 @import "./inputs/index";
 @import "./loading/index";
-@import "./progress-indicators/index";
-@import "./radio/index";
-@import "./select/index";
 @import "./tabs/index";
 @import "./text/index";
-@import "./tiles/index";

package/lib/cjs/core-react/inputs/Input.d.ts

@@ -4,8 +4,7 @@
 import * as React from "react";
 import { CommonProps } from "../utils/Props";
 /** Properties for the [[Input]] component
- * @public
- * @deprecated in 3.0. Use InputProps in itwinui-react instead
+ * @internal
  */
 export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, CommonProps {
     /** Indicates whether to set focus to the input element */
@@ -16,8 +15,7 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>,
     ref?: React.Ref<HTMLInputElement>;
 }
 /** Basic text input, is a wrapper for the `<input type="text">` HTML element.
- * @public
- * @deprecated in 3.0. Use Input in itwinui-react instead
+ * @internal
  */
 export declare const Input: (props: InputProps) => JSX.Element | null;
 //# sourceMappingURL=Input.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/core-react/inputs/Input.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;;GAGG;AACH,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,WAAW;IAC1F,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,+DAA+D;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAuCD;;;GAGG;AACH,eAAO,MAAM,KAAK,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,GAAG,CAAC,OAAO,GAAG,IAAsB,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/core-react/inputs/Input.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,WAAW;IAC1F,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,+DAA+D;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAuCD;;GAEG;AACH,eAAO,MAAM,KAAK,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,GAAG,CAAC,OAAO,GAAG,IAAsB,CAAC"}

package/lib/cjs/core-react/inputs/Input.js

@@ -40,8 +40,7 @@ function ForwardRefInput(props, ref) {
     return (React.createElement(itwinui_react_1.Input, { ref: refs, type: "text", ...otherProps, onFocus: handleFocus, className: (0, classnames_1.default)("uicore-inputs-input", className), style: style }));
 });
 /** Basic text input, is a wrapper for the `<input type="text">` HTML element.
- * @public
- * @deprecated in 3.0. Use Input in itwinui-react instead
+ * @internal
  */
 exports.Input = ForwardRefInput; // eslint-disable-line deprecation/deprecation
 //# sourceMappingURL=Input.js.map

package/lib/cjs/core-react/inputs/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/core-react/inputs/Input.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,wDAA8D;AAC9D,oDAAiD;AAgBjD,0GAA0G;AAC1G,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAAkC,8CAA8C;AACtH,SAAS,eAAe,CAAC,KAAK,EAAE,GAAG;IACjC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC,CAAC,wDAAwD;IAC7I,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC7D,MAAM,IAAI,GAAG,IAAA,iBAAO,EAAC,eAAe,EAAE,GAAG,CAAC,CAAC,CAAE,uGAAuG;IAEpJ,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,cAAc,GAAG,eAAe,CAAC,OAAO,CAAC;QAC/C,MAAM,cAAc,GAAG,gBAAgB,CAAC;QAExC,IAAI,cAAc,IAAI,cAAc,EAAE;YACpC,cAAc,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;SAC5D;QACD,OAAO,GAAG,EAAE;YACV,IAAI,cAAc,IAAI,cAAc,EAAE;gBACpC,cAAc,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;aAC/D;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,eAAe,CAAC,OAAO,IAAI,QAAQ;YACrC,eAAe,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACpC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAyC,EAAE,EAAE;QAClF,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,oBAAC,qBAAa,IAAC,GAAG,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,KAAK,UAAU,EAAE,OAAO,EAAE,WAAW,EACxE,SAAS,EAAE,IAAA,oBAAU,EAAC,qBAAqB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,GAAI,CAC5E,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;;GAGG;AACU,QAAA,KAAK,GAA8C,eAAe,CAAC,CAAE,8CAA8C","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 Inputs\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Input as ITwinUI_Input } from \"@itwin/itwinui-react\";\r\nimport { useRefs } from \"../utils/hooks/useRefs\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[Input]] component\r\n * @public\r\n * @deprecated in 3.0. Use InputProps in itwinui-react instead\r\n */\r\nexport interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, CommonProps {\r\n  /** Indicates whether to set focus to the input element */\r\n  setFocus?: boolean;\r\n  /** Native keydown event handler */\r\n  nativeKeyHandler?: (e: KeyboardEvent) => void;\r\n  /** Provides ability to return reference to HTMLInputElement */\r\n  ref?: React.Ref<HTMLInputElement>;\r\n}\r\n\r\n// Defined using following pattern (const Input at bottom) to ensure useful API documentation is extracted\r\nconst ForwardRefInput = React.forwardRef<HTMLInputElement, InputProps>(   // eslint-disable-line deprecation/deprecation\r\n  function ForwardRefInput(props, ref) {\r\n    const { className, style, setFocus, nativeKeyHandler, size, ...otherProps } = props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n    const inputElementRef = React.useRef<HTMLInputElement>(null);\r\n    const refs = useRefs(inputElementRef, ref);  // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.\r\n\r\n    React.useEffect(() => {\r\n      const currentElement = inputElementRef.current;\r\n      const currentHandler = nativeKeyHandler;\r\n\r\n      if (currentElement && currentHandler) {\r\n        currentElement.addEventListener(\"keydown\", currentHandler);\r\n      }\r\n      return () => {\r\n        if (currentHandler && currentElement) {\r\n          currentElement.removeEventListener(\"keydown\", currentHandler);\r\n        }\r\n      };\r\n    }, [nativeKeyHandler]);\r\n\r\n    React.useEffect(() => {\r\n      if (inputElementRef.current && setFocus)\r\n        inputElementRef.current.focus();\r\n    }, [setFocus]);\r\n\r\n    const handleFocus = React.useCallback((event: React.FocusEvent<HTMLInputElement>) => {\r\n      event.currentTarget.select();\r\n    }, []);\r\n\r\n    return (\r\n      <ITwinUI_Input ref={refs} type=\"text\" {...otherProps} onFocus={handleFocus}\r\n        className={classnames(\"uicore-inputs-input\", className)} style={style} />\r\n    );\r\n  }\r\n);\r\n\r\n/** Basic text input, is a wrapper for the `<input type=\"text\">` HTML element.\r\n * @public\r\n * @deprecated in 3.0. Use Input in itwinui-react instead\r\n */\r\nexport const Input: (props: InputProps) => JSX.Element | null = ForwardRefInput;  // eslint-disable-line deprecation/deprecation\r\n"]}
+{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/core-react/inputs/Input.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,wDAA8D;AAC9D,oDAAiD;AAejD,0GAA0G;AAC1G,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAAkC,8CAA8C;AACtH,SAAS,eAAe,CAAC,KAAK,EAAE,GAAG;IACjC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC,CAAC,wDAAwD;IAC7I,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC7D,MAAM,IAAI,GAAG,IAAA,iBAAO,EAAC,eAAe,EAAE,GAAG,CAAC,CAAC,CAAE,uGAAuG;IAEpJ,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,cAAc,GAAG,eAAe,CAAC,OAAO,CAAC;QAC/C,MAAM,cAAc,GAAG,gBAAgB,CAAC;QAExC,IAAI,cAAc,IAAI,cAAc,EAAE;YACpC,cAAc,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;SAC5D;QACD,OAAO,GAAG,EAAE;YACV,IAAI,cAAc,IAAI,cAAc,EAAE;gBACpC,cAAc,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;aAC/D;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,eAAe,CAAC,OAAO,IAAI,QAAQ;YACrC,eAAe,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACpC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAyC,EAAE,EAAE;QAClF,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,oBAAC,qBAAa,IAAC,GAAG,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,KAAK,UAAU,EAAE,OAAO,EAAE,WAAW,EACxE,SAAS,EAAE,IAAA,oBAAU,EAAC,qBAAqB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,GAAI,CAC5E,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;GAEG;AACU,QAAA,KAAK,GAA8C,eAAe,CAAC,CAAE,8CAA8C","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 Inputs\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Input as ITwinUI_Input } from \"@itwin/itwinui-react\";\r\nimport { useRefs } from \"../utils/hooks/useRefs\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[Input]] component\r\n * @internal\r\n */\r\nexport interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, CommonProps {\r\n  /** Indicates whether to set focus to the input element */\r\n  setFocus?: boolean;\r\n  /** Native keydown event handler */\r\n  nativeKeyHandler?: (e: KeyboardEvent) => void;\r\n  /** Provides ability to return reference to HTMLInputElement */\r\n  ref?: React.Ref<HTMLInputElement>;\r\n}\r\n\r\n// Defined using following pattern (const Input at bottom) to ensure useful API documentation is extracted\r\nconst ForwardRefInput = React.forwardRef<HTMLInputElement, InputProps>(   // eslint-disable-line deprecation/deprecation\r\n  function ForwardRefInput(props, ref) {\r\n    const { className, style, setFocus, nativeKeyHandler, size, ...otherProps } = props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n    const inputElementRef = React.useRef<HTMLInputElement>(null);\r\n    const refs = useRefs(inputElementRef, ref);  // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.\r\n\r\n    React.useEffect(() => {\r\n      const currentElement = inputElementRef.current;\r\n      const currentHandler = nativeKeyHandler;\r\n\r\n      if (currentElement && currentHandler) {\r\n        currentElement.addEventListener(\"keydown\", currentHandler);\r\n      }\r\n      return () => {\r\n        if (currentHandler && currentElement) {\r\n          currentElement.removeEventListener(\"keydown\", currentHandler);\r\n        }\r\n      };\r\n    }, [nativeKeyHandler]);\r\n\r\n    React.useEffect(() => {\r\n      if (inputElementRef.current && setFocus)\r\n        inputElementRef.current.focus();\r\n    }, [setFocus]);\r\n\r\n    const handleFocus = React.useCallback((event: React.FocusEvent<HTMLInputElement>) => {\r\n      event.currentTarget.select();\r\n    }, []);\r\n\r\n    return (\r\n      <ITwinUI_Input ref={refs} type=\"text\" {...otherProps} onFocus={handleFocus}\r\n        className={classnames(\"uicore-inputs-input\", className)} style={style} />\r\n    );\r\n  }\r\n);\r\n\r\n/** Basic text input, is a wrapper for the `<input type=\"text\">` HTML element.\r\n * @internal\r\n */\r\nexport const Input: (props: InputProps) => JSX.Element | null = ForwardRefInput;  // eslint-disable-line deprecation/deprecation\r\n"]}

package/lib/cjs/core-react/inputs/InputLabel.d.ts

@@ -9,6 +9,8 @@ import { LabeledComponentProps, MessagedComponentProps } from "./LabeledComponen
  */
 export interface InputLabelProps extends LabeledComponentProps, MessagedComponentProps, CommonProps {
     disabled?: boolean;
+    /** Labeled content */
+    children?: React.ReactNode;
 }
 /** Text input wrapper that provides additional styling and labeling
  * @public

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

@@ -1 +1 @@
-{"version":3,"file":"InputLabel.d.ts","sourceRoot":"","sources":["../../../../src/core-react/inputs/InputLabel.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAExF;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,qBAAqB,EAAE,sBAAsB,EAAE,WAAW;IACjG,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAClD,MAAM,IAAI,GAAG,CAAC,OAAO;CA2BtC"}
+{"version":3,"file":"InputLabel.d.ts","sourceRoot":"","sources":["../../../../src/core-react/inputs/InputLabel.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAExF;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,qBAAqB,EAAE,sBAAsB,EAAE,WAAW;IACjG,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAClD,MAAM,IAAI,GAAG,CAAC,OAAO;CA2BtC"}

package/lib/cjs/core-react/inputs/InputLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputLabel.js","sourceRoot":"","sources":["../../../../src/core-react/inputs/InputLabel.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAW/B;;GAEG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,aAA8B;IAClD,MAAM;QACpB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EACrC,cAAc,EAAE,UAAU,EAC1B,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAEzD,OAAO,CACL,+BAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,IAAA,oBAAU,EACxC,6BAA6B,EAC7B,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,iBAAiB,EACxC,MAAM,EACN,SAAS,CACV;YACE,KAAK;gBACJ,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,cAAc,EAAE,cAAc,CAAC,EAAE,KAAK,EAAE,UAAU;;oBAAI,KAAK;wBAAQ;YAEhG,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,OAAO,EAAE,EAAE,WAAW,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC;gBAC3D,IAAI,CAAC,KAAK,CAAC,QAAQ;gBACnB,MAAM;oBACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,MAAM,EAAE,CAAC,GAAI,CAE3D;YACL,OAAO;gBACN,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,gBAAgB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,IAAG,OAAO,CAAO,CAEhG,CACT,CAAC;IACJ,CAAC;CACF;AA5BD,gCA4BC","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 Inputs\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { LabeledComponentProps, MessagedComponentProps } from \"./LabeledComponentProps\";\r\n\r\n/** Properties for [[InputLabel]] components\r\n * @public\r\n */\r\nexport interface InputLabelProps extends LabeledComponentProps, MessagedComponentProps, CommonProps {\r\n  disabled?: boolean;\r\n}\r\n\r\n/** Text input wrapper that provides additional styling and labeling\r\n * @public\r\n */\r\nexport class InputLabel extends React.PureComponent<InputLabelProps> {\r\n  public override render(): JSX.Element {\r\n    const { label, status, className, style,\r\n      labelClassName, labelStyle,\r\n      message, messageClassName, messageStyle } = this.props;\r\n\r\n    return (\r\n      <label style={style} className={classnames(\r\n        \"uicore-inputs-labeled-input\",\r\n        this.props.disabled && \"uicore-disabled\",\r\n        status,\r\n        className,\r\n      )}>\r\n        {label &&\r\n          <div className={classnames(\"uicore-label\", labelClassName)} style={labelStyle}> {label} </div>\r\n        }\r\n        <div className={classnames(\"input\", { \"with-icon\": !!status })}>\r\n          {this.props.children}\r\n          {status &&\r\n            <i className={classnames(\"icon\", `icon-status-${status}`)} />\r\n          }\r\n        </div>\r\n        {message &&\r\n          <div className={classnames(\"uicore-message\", messageClassName)} style={messageStyle}>{message}</div>\r\n        }\r\n      </label>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"InputLabel.js","sourceRoot":"","sources":["../../../../src/core-react/inputs/InputLabel.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAa/B;;GAEG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,aAA8B;IAClD,MAAM;QACpB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EACrC,cAAc,EAAE,UAAU,EAC1B,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAEzD,OAAO,CACL,+BAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,IAAA,oBAAU,EACxC,6BAA6B,EAC7B,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,iBAAiB,EACxC,MAAM,EACN,SAAS,CACV;YACE,KAAK;gBACJ,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,cAAc,EAAE,cAAc,CAAC,EAAE,KAAK,EAAE,UAAU;;oBAAI,KAAK;wBAAQ;YAEhG,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,OAAO,EAAE,EAAE,WAAW,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC;gBAC3D,IAAI,CAAC,KAAK,CAAC,QAAQ;gBACnB,MAAM;oBACL,2BAAG,SAAS,EAAE,IAAA,oBAAU,EAAC,MAAM,EAAE,eAAe,MAAM,EAAE,CAAC,GAAI,CAE3D;YACL,OAAO;gBACN,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,gBAAgB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,IAAG,OAAO,CAAO,CAEhG,CACT,CAAC;IACJ,CAAC;CACF;AA5BD,gCA4BC","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 Inputs\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { LabeledComponentProps, MessagedComponentProps } from \"./LabeledComponentProps\";\r\n\r\n/** Properties for [[InputLabel]] components\r\n * @public\r\n */\r\nexport interface InputLabelProps extends LabeledComponentProps, MessagedComponentProps, CommonProps {\r\n  disabled?: boolean;\r\n  /** Labeled content */\r\n  children?: React.ReactNode;\r\n}\r\n\r\n/** Text input wrapper that provides additional styling and labeling\r\n * @public\r\n */\r\nexport class InputLabel extends React.PureComponent<InputLabelProps> {\r\n  public override render(): JSX.Element {\r\n    const { label, status, className, style,\r\n      labelClassName, labelStyle,\r\n      message, messageClassName, messageStyle } = this.props;\r\n\r\n    return (\r\n      <label style={style} className={classnames(\r\n        \"uicore-inputs-labeled-input\",\r\n        this.props.disabled && \"uicore-disabled\",\r\n        status,\r\n        className,\r\n      )}>\r\n        {label &&\r\n          <div className={classnames(\"uicore-label\", labelClassName)} style={labelStyle}> {label} </div>\r\n        }\r\n        <div className={classnames(\"input\", { \"with-icon\": !!status })}>\r\n          {this.props.children}\r\n          {status &&\r\n            <i className={classnames(\"icon\", `icon-status-${status}`)} />\r\n          }\r\n        </div>\r\n        {message &&\r\n          <div className={classnames(\"uicore-message\", messageClassName)} style={messageStyle}>{message}</div>\r\n        }\r\n      </label>\r\n    );\r\n  }\r\n}\r\n"]}

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

@@ -6,5 +6,3 @@
 
 .uicore-inputs-input { @include uicore-inputs-input; }
 .uicore-inputs-labeled-input { @include uicore-inputs-labeled-input; }
-.uicore-inputs-labeled-textarea { @include uicore-inputs-labeled-textarea; }
-.uicore-inputs-textarea { @include uicore-inputs-textarea; }

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

@@ -6,6 +6,4 @@
 
 @import "./variables";
 @import "./input";
-@import "./labeled-input";
-@import "./labeled-textarea";
-@import "./textarea";
+@import "./input-label";

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

@@ -0,0 +1,90 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/index";
+
+@mixin uicore-inputs-labeled-input {
+  display: block;
+  padding: 0;
+  margin: 0 0 $uicore-unbordered-padding;
+  text-align: left;
+  font-size: var(--iui-font-size-1);
+  font-weight: var(--iui-font-weight-normal);
+  cursor: pointer;
+
+  > .uicore-label {
+    padding: 0;
+    margin: 0;
+    border: 0 none transparent;
+    display: block;
+    font-size: var(--iui-font-size-1);
+    font-weight: var(--iui-font-weight-semibold);
+    line-height: var(--iui-size-l);
+    text-align: left;
+    color: $buic-text-color;
+  }
+
+  > .input {
+    position: relative;
+    /// Needed to vertically align the icon:
+    display: inline-block;
+    width: 100%;
+
+    &.with-icon {
+      > input,
+      > .bwx-inputs-input {
+        padding-right: calc(#{$uicore-bordered-padding} + var(--iui-size-l));
+        margin-right: calc(#{$uicore-bordered-padding} + var(--iui-size-l));
+      }
+    }
+
+    > .icon {
+      display: flex;
+      align-items: center;
+      position: absolute;
+      right: 0;
+      top: 0;
+      bottom: 0;
+      padding: $uicore-bordered-padding;
+
+      font-size: var(--iui-font-size-1);
+      font-weight: normal;
+    }
+  }
+
+  > .uicore-message {
+    display: block;
+    font-size: var(--iui-font-size-0);
+    line-height: var(--iui-size-l);
+    color: $buic-text-color-muted;
+  }
+
+  /// Status colors ----------------------------------------------------------
+
+  $status-colors: (
+    success: $buic-foreground-positive-rgb,
+    warning: $buic-foreground-warning-rgb,
+    error: $buic-foreground-negative-rgb,
+  );
+
+  @each $status, $color in $status-colors {
+    &.#{$status},
+    &.#{$status} > .uicore-message {
+      color: rgb($color);
+    }
+
+    &.#{$status} > .input {
+      > input,
+      > .uicore-inputs-input {
+        border-color: rgb($color);
+        box-shadow: $buic-inputs-boxshadow 0px 1px 1px inset;
+
+        &:focus {
+          border-color: rgb($color);
+          box-shadow: rgba($color, $uicore-opacity-boxshadow) 0px 0px 0px 2px;
+        }
+      }
+    }
+  }
+}

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

@@ -4,57 +4,55 @@
 *--------------------------------------------------------------------------------------------*/
 @import "../style/index";
 @import "./variables";
-@import "~@itwin/itwinui-css/scss/style/space";
-@import "~@itwin/itwinui-css/scss/style/speed";
-@import "~@itwin/itwinui-css/scss/style/typography";
-@import "~@itwin/itwinui-css/scss/style/variables";
 
 @mixin uicore-inputs-input {
-
-  display:                block;
-  width:                  100%;
-  padding:                $uicore-inputs-padding-bordered $uicore-bordered-padding;
-  margin:                 $uicore-inputs-margin 0;
-  font-family:            $iui-font-family;
-  font-size:              $iui-font-size;
-  line-height:            normal;
-  color:                  $buic-text-color;
-  background-color:       $buic-background-control;
-  background-image:       none;
-  border:                 1px solid $buic-inputs-border;
-  border-radius:          $iui-border-radius;
-  box-shadow:             $buic-inputs-boxshadow 0px 1px 1px inset;
-  box-sizing:             border-box;
-  transition:             border-color $iui-speed-fast ease-in-out, box-shadow $iui-speed-fast ease-in-out;
-
-  &:-ms-input-placeholder {       color: $buic-foreground-disabled; }
-  &::-webkit-input-placeholder {  color: $buic-foreground-disabled; }
-  &::placeholder {                color: $buic-foreground-disabled; }
+  display: block;
+  width: 100%;
+  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);
+  line-height: normal;
+  color: $buic-text-color;
+  background-color: $buic-background-control;
+  background-image: none;
+  border: 1px solid $buic-inputs-border;
+  border-radius: var(--iui-border-radius-1);
+  box-shadow: $buic-inputs-boxshadow 0px 1px 1px inset;
+  box-sizing: border-box;
+  transition: border-color var(--iui-duration-1) ease-in-out,
+    box-shadow var(--iui-duration-1) ease-in-out;
+
+  &:-ms-input-placeholder {
+    color: $buic-foreground-disabled;
+  }
+  &::-webkit-input-placeholder {
+    color: $buic-foreground-disabled;
+  }
+  &::placeholder {
+    color: $buic-foreground-disabled;
+  }
 
   &[disabled] {
-
-    background-color:   $buic-background-control-disabled;
-    border-color:       $buic-foreground-disabled;
-    color:              $buic-foreground-disabled;
-    cursor:             not-allowed;
-    opacity:            $uicore-opacity-disabled;
+    background-color: $buic-background-control-disabled;
+    border-color: $buic-foreground-disabled;
+    color: $buic-foreground-disabled;
+    cursor: not-allowed;
+    opacity: $uicore-opacity-disabled;
   }
 
   &[readonly] {
-
-    color:              $buic-foreground-muted;
-    cursor:             default;
+    color: $buic-foreground-muted;
+    cursor: default;
   }
 
   &:focus {
-
-    outline:            0px;
-    border-color:       $buic-foreground-focus-border;
-    box-shadow:         $uicore-inputs-focus-boxshadow;
+    outline: 0px;
+    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/variables.scss

@@ -4,30 +4,35 @@
 *--------------------------------------------------------------------------------------------*/
 @import "../style/baseline";
 @import "../style/themecolors";
-@import "~@itwin/itwinui-css/scss/style/space";
 
 // cspell:ignore unbordered
 
 $uicore-inputs-height: 22px;
 $uicore-inputs-height-large: 40px;
-$uicore-line-height: $uicore-baseline * 1.4;
-$uicore-bordered-padding: $uicore-bordered-padding * 0.5;
-$uicore-unbordered-padding: $uicore-unbordered-padding * 0.5;
+$uicore-line-height: calc(var(--iui-size-s) * 1.4);
+$uicore-bordered-padding: calc(#{$uicore-bordered-padding} * 0.5);
+$uicore-unbordered-padding: calc(#{$uicore-unbordered-padding} * 0.5);
 
-$uicore-inputs-padding: ($uicore-inputs-height - $uicore-line-height) * 0.5;
-$uicore-inputs-padding-large: (
-    $uicore-inputs-height-large - $uicore-line-height
-  ) * 0.5;
-$uicore-inputs-padding-bordered: $uicore-inputs-padding - 2px;
-$uicore-inputs-padding-bordered-large: $uicore-inputs-padding-large - 2px;
+$uicore-inputs-padding: calc(
+  (#{$uicore-inputs-height} - #{$uicore-line-height}) * 0.5
+); // TODO: What should we do here?
+$uicore-inputs-padding-large: calc(
+  (#{$uicore-inputs-height-large} - #{$uicore-line-height}) * 0.5
+); // TODO: What should we do here?
+$uicore-inputs-padding-bordered: calc(#{$uicore-inputs-padding} - 2px);
+$uicore-inputs-padding-bordered-large: calc(
+  #{$uicore-inputs-padding-large} - 2px
+);
 
-$uicore-inputs-margin: ($uicore-line-height * 2 - $uicore-inputs-height) * 0.5;
-$uicore-inputs-margin-large: (
-    $uicore-line-height * 3 - $uicore-inputs-height-large
-  ) * 0.5;
+$uicore-inputs-margin: calc(
+  (#{$uicore-line-height} * 2 - #{$uicore-inputs-height}) * 0.5
+);
+$uicore-inputs-margin-large: calc(
+  (#{$uicore-line-height} * 3 - #{$uicore-inputs-height-large}) * 0.5
+); // TODO: What should we do here?
 
 $uicore-inputs-border-color: $buic-inputs-border;
 
 $uicore-inputs-focus-boxshadow: $buic-focus-boxshadow 0px 0px 0px 2px;
 
-$uicore-iui-input-padding: $iui-xxs $iui-s;
+$uicore-iui-input-padding: var(--iui-size-3xs) var(--iui-size-xs);

package/lib/cjs/core-react/listbox/Listbox.scss

@@ -4,7 +4,7 @@
 *--------------------------------------------------------------------------------------------*/
 @import "../index";
 
-$uicore-list-item-height: $uicore-baseline * 2; ///  22px; /// ~1.618;
+$uicore-list-item-height: calc(var(--iui-size-s) * 2);
 
 ul.core-listbox {
   list-style: none;
@@ -38,7 +38,7 @@ ul.core-listbox {
     line-height: $uicore-list-item-height;
     padding-left: 4px;
 
-    &[aria-selected='true'] {
+    &[aria-selected="true"] {
       background-color: $buic-row-selection;
     }
 
@@ -51,4 +51,4 @@ ul.core-listbox {
       background-color: $buic-row-hover;
     }
   }
-}
+}

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

@@ -4,7 +4,6 @@
 import "./LoadingSpinner.scss";
 import * as React from "react";
 import { ProgressRadialProps } from "@itwin/itwinui-react";
-import { SpinnerSize } from "./Spinner";
 /** Type for ProgressRadialProps.size
  * @public
  */
@@ -21,7 +20,7 @@ export interface LoadingSpinnerProps extends Omit<ProgressRadialProps, "size"> {
        * Size of the progress indicator. Defaults to medium size.
        * @default ''
        */
-    size?: RadialSizeType | SpinnerSize;
+    size?: RadialSizeType;
 }
 /**
  * A loading spinner component that optionally shows a text message.

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,EAAkB,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAExC;;GAEG;AACH,oBAAY,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;;;SAGK;IACL,IAAI,CAAC,EAAE,cAAc,GAAG,WAAW,CAAC;CACrC;AAED;;;GAGG;AACH,qBAAa,cAAe,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC;IAC1E,OAAc,YAAY,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAEtD;IAEc,MAAM;CA0BvB"}
+{"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,EAAkB,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAE3E;;GAEG;AACH,oBAAY,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;;;SAGK;IACL,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;CAUvB"}

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

@@ -11,7 +11,6 @@ exports.LoadingSpinner = void 0;
 require("./LoadingSpinner.scss");
 const React = require("react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
-const Spinner_1 = require("./Spinner");
 /**
  * A loading spinner component that optionally shows a text message.
  * @public
@@ -19,23 +18,9 @@ const Spinner_1 = require("./Spinner");
 class LoadingSpinner extends React.PureComponent {
     render() {
         const { message, messageOnTop, size, ...rest } = this.props;
-        const getRadialSize = (sizeProp) => {
-            if (sizeProp === undefined || typeof sizeProp === "string")
-                return sizeProp;
-            else {
-                switch (sizeProp) {
-                    case Spinner_1.SpinnerSize.Large: // eslint-disable-line deprecation/deprecation
-                    case Spinner_1.SpinnerSize.XLarge: // eslint-disable-line deprecation/deprecation
-                        return "large";
-                    case Spinner_1.SpinnerSize.Small: // eslint-disable-line deprecation/deprecation
-                        return "x-small";
-                }
-            }
-            return undefined;
-        };
         return (React.createElement("div", { className: "core-ls" },
             (message && messageOnTop) && React.createElement("span", { className: "ls-message-top" }, message),
-            React.createElement(itwinui_react_1.ProgressRadial, { size: getRadialSize(size), ...rest, indeterminate: true }),
+            React.createElement(itwinui_react_1.ProgressRadial, { size: size, ...rest, indeterminate: true }),
             (message && !messageOnTop) && React.createElement("span", { className: "ls-message-bottom" }, message)));
     }
 }

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;;;+FAG+F;AAC/F;;GAEG;;;AAEH,iCAA+B;AAC/B,+BAA+B;AAC/B,wDAA2E;AAC3E,uCAAwC;AAsBxC;;;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;QAE5D,MAAM,aAAa,GAAG,CAAC,QAAkB,EAAE,EAAE;YAC3C,IAAI,QAAQ,KAAK,SAAS,IAAI,OAAO,QAAQ,KAAK,QAAQ;gBACxD,OAAO,QAAQ,CAAC;iBACb;gBACH,QAAQ,QAAQ,EAAE;oBAChB,KAAK,qBAAW,CAAC,KAAK,CAAC,CAAG,8CAA8C;oBACxE,KAAK,qBAAW,CAAC,MAAM,EAAG,8CAA8C;wBACtE,OAAO,OAAO,CAAC;oBACjB,KAAK,qBAAW,CAAC,KAAK,EAAI,8CAA8C;wBACtE,OAAO,SAAS,CAAC;iBACpB;aACF;YACD,OAAO,SAAS,CAAC;QACnB,CAAC,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS;YACrB,CAAC,OAAO,IAAI,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,gBAAgB,IAAE,OAAO,CAAQ;YAC/E,oBAAC,8BAAc,IAAC,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,KAAM,IAAI,EAAE,aAAa,SAAG;YACpE,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,OAAO,CAAQ,CAC/E,CACP,CAAC;IACJ,CAAC;;AA9BH,wCA+BC;AA9Be,2BAAY,GAAiC;IACzD,YAAY,EAAE,KAAK;CACpB,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/** @packageDocumentation\r\n * @module Loading\r\n */\r\n\r\nimport \"./LoadingSpinner.scss\";\r\nimport * as React from \"react\";\r\nimport { ProgressRadial, ProgressRadialProps } from \"@itwin/itwinui-react\";\r\nimport { SpinnerSize } from \"./Spinner\";\r\n\r\n/** Type for ProgressRadialProps.size\r\n * @public\r\n */\r\nexport type RadialSizeType = ProgressRadialProps[\"size\"];\r\n\r\n/** Properties for [[LoadingSpinner]] component\r\n * @public\r\n */\r\nexport interface LoadingSpinnerProps extends Omit<ProgressRadialProps, \"size\"> {\r\n  /** Message (text) displayed */\r\n  message?: string;\r\n  /** Position the message above or below the spinner (defaults to bottom) */\r\n  messageOnTop?: boolean;\r\n  /**\r\n     * Size of the progress indicator. Defaults to medium size.\r\n     * @default ''\r\n     */\r\n  size?: RadialSizeType | SpinnerSize; // eslint-disable-line deprecation/deprecation\r\n}\r\n\r\n/**\r\n * A loading spinner component that optionally shows a text message.\r\n * @public\r\n */\r\nexport class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {\r\n  public static defaultProps: Partial<LoadingSpinnerProps> = {\r\n    messageOnTop: false,\r\n  };\r\n\r\n  public override render() {\r\n    const { message, messageOnTop, size, ...rest } = this.props;\r\n    type SizeType = LoadingSpinnerProps[\"size\"];\r\n    const getRadialSize = (sizeProp: SizeType) => {\r\n      if (sizeProp === undefined || typeof sizeProp === \"string\")\r\n        return sizeProp;\r\n      else {\r\n        switch (sizeProp) {\r\n          case SpinnerSize.Large:   // eslint-disable-line deprecation/deprecation\r\n          case SpinnerSize.XLarge:  // eslint-disable-line deprecation/deprecation\r\n            return \"large\";\r\n          case SpinnerSize.Small:   // eslint-disable-line deprecation/deprecation\r\n            return \"x-small\";\r\n        }\r\n      }\r\n      return undefined;\r\n    };\r\n\r\n    return (\r\n      <div className=\"core-ls\">\r\n        {(message && messageOnTop) && <span className=\"ls-message-top\">{message}</span>}\r\n        <ProgressRadial size={getRadialSize(size)} {...rest} indeterminate />\r\n        {(message && !messageOnTop) && <span className=\"ls-message-bottom\">{message}</span>}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,iCAA+B;AAC/B,+BAA+B;AAC/B,wDAA2E;AAsB3E;;;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,CAAC,OAAO,IAAI,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,gBAAgB,IAAE,OAAO,CAAQ;YAC/E,oBAAC,8BAAc,IAAC,IAAI,EAAE,IAAI,KAAM,IAAI,EAAE,aAAa,SAAG;YACrD,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,OAAO,CAAQ,CAC/E,CACP,CAAC;IACJ,CAAC;;AAdH,wCAeC;AAde,2BAAY,GAAiC;IACzD,YAAY,EAAE,KAAK;CACpB,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/** @packageDocumentation\r\n * @module Loading\r\n */\r\n\r\nimport \"./LoadingSpinner.scss\";\r\nimport * as React from \"react\";\r\nimport { ProgressRadial, ProgressRadialProps } from \"@itwin/itwinui-react\";\r\n\r\n/** Type for ProgressRadialProps.size\r\n * @public\r\n */\r\nexport type RadialSizeType = ProgressRadialProps[\"size\"];\r\n\r\n/** Properties for [[LoadingSpinner]] component\r\n * @public\r\n */\r\nexport interface LoadingSpinnerProps extends Omit<ProgressRadialProps, \"size\"> {\r\n  /** Message (text) displayed */\r\n  message?: string;\r\n  /** Position the message above or below the spinner (defaults to bottom) */\r\n  messageOnTop?: boolean;\r\n  /**\r\n     * Size of the progress indicator. Defaults to medium size.\r\n     * @default ''\r\n     */\r\n  size?: RadialSizeType;\r\n}\r\n\r\n/**\r\n * A loading spinner component that optionally shows a text message.\r\n * @public\r\n */\r\nexport class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {\r\n  public static defaultProps: Partial<LoadingSpinnerProps> = {\r\n    messageOnTop: false,\r\n  };\r\n\r\n  public override render() {\r\n    const { message, messageOnTop, size, ...rest } = this.props;\r\n    return (\r\n      <div className=\"core-ls\">\r\n        {(message && messageOnTop) && <span className=\"ls-message-top\">{message}</span>}\r\n        <ProgressRadial size={size} {...rest} indeterminate />\r\n        {(message && !messageOnTop) && <span className=\"ls-message-bottom\">{message}</span>}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}