@itwin/core-react 3.2.0-dev.3 → 3.2.0-dev.34

package/CHANGELOG.md

@@ -1,6 +1,31 @@
 # Change Log - @itwin/core-react
 
-This log was last generated on Thu, 24 Feb 2022 15:26:55 GMT and should not be manually modified.
+This log was last generated on Thu, 31 Mar 2022 15:55:48 GMT and should not be manually modified.
+
+## 3.1.1
+Thu, 31 Mar 2022 15:55:48 GMT
+
+_Version update only_
+
+## 3.1.0
+Tue, 29 Mar 2022 20:53:47 GMT
+
+### Updates
+
+- Add ability to keep Dialog within application window.
+- Update to itwinui-css version "0.44.0".
+- Update to @itwin/itwinui-react: 1.32.0
+- Update to latest itwinui-react - requires new compile option allowSyntheticDefaultImports=true.
+
+## 3.0.3
+Fri, 25 Mar 2022 15:10:02 GMT
+
+_Version update only_
+
+## 3.0.2
+Thu, 10 Mar 2022 21:18:13 GMT
+
+_Version update only_
 
 ## 3.0.1
 Thu, 24 Feb 2022 15:26:55 GMT

package/lib/cjs/core-react/UiCore.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UiCore.d.ts","sourceRoot":"","sources":["../../../src/core-react/UiCore.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,4EAA4E;AAC5E,OAAO,oBAAoB,CAAC;AAC5B,OAAO,uBAAuB,CAAC;AAC/B,OAAO,yBAAyB,CAAC;AACjC,OAAO,gBAAgB,CAAC;AAGxB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAKvD;;;GAGG;AACH,qBAAa,MAAM;IACjB,OAAO,CAAC,MAAM,CAAC,YAAY,CAAS;IACpC,OAAO,CAAC,MAAM,CAAC,aAAa,CAAC,CAAe;IAE5C;;;OAGG;WACiB,UAAU,CAAC,YAAY,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC;IAWzE,oDAAoD;WACtC,SAAS;IAQvB,gDAAgD;IAChD,WAAkB,WAAW,IAAI,OAAO,CAAgC;IAExE;;OAEG;IACH,WAAkB,YAAY,IAAI,YAAY,CAM7C;IAED,kDAAkD;IAClD,WAAkB,qBAAqB,IAAI,MAAM,CAEhD;IAED;;OAEG;WACW,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM;IAQvD,gBAAgB;IAChB,WAAkB,WAAW,IAAI,MAAM,CAEtC;IAED,gBAAgB;WACF,cAAc,CAAC,GAAG,EAAE,GAAG,GAAG,MAAM;CAM/C"}
+{"version":3,"file":"UiCore.d.ts","sourceRoot":"","sources":["../../../src/core-react/UiCore.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,4EAA4E;AAC5E,OAAO,oBAAoB,CAAC;AAC5B,OAAO,uBAAuB,CAAC;AAC/B,OAAO,yBAAyB,CAAC;AACjC,OAAO,gBAAgB,CAAC;AAGxB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAKvD;;;GAGG;AACH,qBAAa,MAAM;IACjB,OAAO,CAAC,MAAM,CAAC,YAAY,CAAS;IACpC,OAAO,CAAC,MAAM,CAAC,aAAa,CAAC,CAAe;IAE5C;;;OAGG;WACiB,UAAU,CAAC,YAAY,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC;IAczE,oDAAoD;WACtC,SAAS;IAQvB,gDAAgD;IAChD,WAAkB,WAAW,IAAI,OAAO,CAAgC;IAExE;;OAEG;IACH,WAAkB,YAAY,IAAI,YAAY,CAM7C;IAED,kDAAkD;IAClD,WAAkB,qBAAqB,IAAI,MAAM,CAEhD;IAED;;OAEG;WACW,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM;IAQvD,gBAAgB;IAChB,WAAkB,WAAW,IAAI,MAAM,CAEtC;IAED,gBAAgB;WACF,cAAc,CAAC,GAAG,EAAE,GAAG,GAAG,MAAM;CAM/C"}

package/lib/cjs/core-react/UiCore.js

@@ -15,6 +15,7 @@ require("./layout-variables.scss");
 require("./classes.scss");
 const core_bentley_1 = require("@itwin/core-bentley");
 const appui_abstract_1 = require("@itwin/appui-abstract");
+const IconWebComponent_1 = require("./utils/IconWebComponent");
 // cSpell:ignore colorthemes colorvariables
 /**
  * Manages the Localization service for the core-react package.
@@ -32,6 +33,8 @@ class UiCore {
         }
         UiCore._localization = localization;
         await UiCore._localization.registerNamespace(UiCore.localizationNamespace);
+        if (window.customElements.get("svg-loader") === undefined)
+            window.customElements.define("svg-loader", IconWebComponent_1.IconWebComponent);
         UiCore._initialized = true;
     }
     /** Unregisters the UiCore localization namespace */

package/lib/cjs/core-react/UiCore.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiCore.js","sourceRoot":"","sources":["../../../src/core-react/UiCore.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,4EAA4E;AAC5E,8BAA4B;AAC5B,iCAA+B;AAC/B,mCAAiC;AACjC,0BAAwB;AAExB,sDAA6C;AAE7C,0DAA8D;AAE9D,2CAA2C;AAE3C;;;GAGG;AACH,MAAa,MAAM;IAIjB;;;OAGG;IACI,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC,YAA0B;QACvD,IAAI,MAAM,CAAC,YAAY,EAAE;YACvB,qBAAM,CAAC,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,kCAAkC,CAAC,CAAC;YAClF,OAAO;SACR;QAED,MAAM,CAAC,aAAa,GAAG,YAAY,CAAC;QACpC,MAAM,MAAM,CAAC,aAAa,CAAC,iBAAiB,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC;QAC3E,MAAM,CAAC,YAAY,GAAG,IAAI,CAAC;IAC7B,CAAC;IAED,oDAAoD;IAC7C,MAAM,CAAC,SAAS;QACrB,IAAI,MAAM,CAAC,aAAa;YACtB,MAAM,CAAC,aAAa,CAAC,mBAAmB,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC;QACzE,MAAM,CAAC,aAAa,GAAG,SAAS,CAAC;QAEjC,MAAM,CAAC,YAAY,GAAG,KAAK,CAAC;IAC9B,CAAC;IAED,gDAAgD;IACzC,MAAM,KAAK,WAAW,KAAc,OAAO,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;IAExE;;OAEG;IACI,MAAM,KAAK,YAAY;QAC5B,uBAAuB;QACvB,IAAI,CAAC,MAAM,CAAC,aAAa;YACvB,MAAM,IAAI,wBAAO,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,4FAA4F,CAAC,CAAC;QAC/I,uBAAuB;QACvB,OAAO,MAAM,CAAC,aAAa,CAAC;IAC9B,CAAC;IAED,kDAAkD;IAC3C,MAAM,KAAK,qBAAqB;QACrC,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED;;OAEG;IACI,MAAM,CAAC,SAAS,CAAC,GAAsB;QAC5C,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE;YACzB,qBAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,4FAA4F,CAAC,CAAC;YAC3I,OAAO,EAAE,CAAC;SACX;QACD,OAAO,MAAM,CAAC,aAAa,CAAC,+BAA+B,CAAC,MAAM,CAAC,qBAAqB,EAAE,GAAG,CAAC,CAAC;IACjG,CAAC;IAED,gBAAgB;IACT,MAAM,KAAK,WAAW;QAC3B,OAAO,YAAY,CAAC;IACtB,CAAC;IAED,gBAAgB;IACT,MAAM,CAAC,cAAc,CAAC,GAAQ;QACnC,MAAM,SAAS,GAAG,IAAA,6BAAY,EAAC,GAAG,CAAC,CAAC;QACpC,MAAM,QAAQ,GAAG,MAAM,CAAC,WAAW,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;QACzE,OAAO,QAAQ,CAAC;IAClB,CAAC;;AApEH,wBAsEC;AArEgB,mBAAY,GAAG,KAAK,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 Utilities\r\n */\r\n\r\n/** Import color variables, layout variables and Sass classes barrel file */\r\nimport \"./colorthemes.scss\";\r\nimport \"./colorvariables.scss\";\r\nimport \"./layout-variables.scss\";\r\nimport \"./classes.scss\";\r\n\r\nimport { Logger } from \"@itwin/core-bentley\";\r\nimport type { Localization } from \"@itwin/core-common\";\r\nimport { getClassName, UiError } from \"@itwin/appui-abstract\";\r\n\r\n// cSpell:ignore colorthemes colorvariables\r\n\r\n/**\r\n * Manages the Localization service for the core-react package.\r\n * @public\r\n */\r\nexport class UiCore {\r\n  private static _initialized = false;\r\n  private static _localization?: Localization;\r\n\r\n  /**\r\n   * Registers the Localization service namespace for UiCore.\r\n   * @param localization The internationalization service created by the host application.\r\n   */\r\n  public static async initialize(localization: Localization): Promise<void> {\r\n    if (UiCore._initialized) {\r\n      Logger.logInfo(UiCore.loggerCategory(UiCore), `UiCore.initialize already called`);\r\n      return;\r\n    }\r\n\r\n    UiCore._localization = localization;\r\n    await UiCore._localization.registerNamespace(UiCore.localizationNamespace);\r\n    UiCore._initialized = true;\r\n  }\r\n\r\n  /** Unregisters the UiCore localization namespace */\r\n  public static terminate() {\r\n    if (UiCore._localization)\r\n      UiCore._localization.unregisterNamespace(UiCore.localizationNamespace);\r\n    UiCore._localization = undefined;\r\n\r\n    UiCore._initialized = false;\r\n  }\r\n\r\n  /** Determines if UiCore has been initialized */\r\n  public static get initialized(): boolean { return UiCore._initialized; }\r\n\r\n  /** The internationalization service created by the host application.\r\n   * @internal\r\n   */\r\n  public static get localization(): Localization {\r\n    // istanbul ignore else\r\n    if (!UiCore._localization)\r\n      throw new UiError(UiCore.loggerCategory(this), \"localization: UiCore.initialize has not been called. Unable to return Localization object.\");\r\n    // istanbul ignore next\r\n    return UiCore._localization;\r\n  }\r\n\r\n  /** The internationalization service namespace. */\r\n  public static get localizationNamespace(): string {\r\n    return \"UiCore\";\r\n  }\r\n\r\n  /** Calls localization.getLocalizedStringWithNamespace with the \"UiCore\" namespace. Do NOT include the namespace in the key.\r\n   * @internal\r\n   */\r\n  public static translate(key: string | string[]): string {\r\n    if (!UiCore._localization) {\r\n      Logger.logError(UiCore.loggerCategory(this), `translate: UiCore must be initialize with a localization provider. Returning blank string.`);\r\n      return \"\";\r\n    }\r\n    return UiCore._localization.getLocalizedStringWithNamespace(UiCore.localizationNamespace, key);\r\n  }\r\n\r\n  /** @internal */\r\n  public static get packageName(): string {\r\n    return \"core-react\";\r\n  }\r\n\r\n  /** @internal */\r\n  public static loggerCategory(obj: any): string {\r\n    const className = getClassName(obj);\r\n    const category = UiCore.packageName + (className ? `.${className}` : \"\");\r\n    return category;\r\n  }\r\n\r\n}\r\n"]}
+{"version":3,"file":"UiCore.js","sourceRoot":"","sources":["../../../src/core-react/UiCore.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,4EAA4E;AAC5E,8BAA4B;AAC5B,iCAA+B;AAC/B,mCAAiC;AACjC,0BAAwB;AAExB,sDAA6C;AAE7C,0DAA8D;AAC9D,+DAA4D;AAC5D,2CAA2C;AAE3C;;;GAGG;AACH,MAAa,MAAM;IAIjB;;;OAGG;IACI,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC,YAA0B;QACvD,IAAI,MAAM,CAAC,YAAY,EAAE;YACvB,qBAAM,CAAC,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,kCAAkC,CAAC,CAAC;YAClF,OAAO;SACR;QAED,MAAM,CAAC,aAAa,GAAG,YAAY,CAAC;QACpC,MAAM,MAAM,CAAC,aAAa,CAAC,iBAAiB,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC;QAC3E,IAAI,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,YAAY,CAAC,KAAK,SAAS;YACvD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,YAAY,EAAE,mCAAgB,CAAC,CAAC;QAE/D,MAAM,CAAC,YAAY,GAAG,IAAI,CAAC;IAC7B,CAAC;IAED,oDAAoD;IAC7C,MAAM,CAAC,SAAS;QACrB,IAAI,MAAM,CAAC,aAAa;YACtB,MAAM,CAAC,aAAa,CAAC,mBAAmB,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC;QACzE,MAAM,CAAC,aAAa,GAAG,SAAS,CAAC;QAEjC,MAAM,CAAC,YAAY,GAAG,KAAK,CAAC;IAC9B,CAAC;IAED,gDAAgD;IACzC,MAAM,KAAK,WAAW,KAAc,OAAO,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;IAExE;;OAEG;IACI,MAAM,KAAK,YAAY;QAC5B,uBAAuB;QACvB,IAAI,CAAC,MAAM,CAAC,aAAa;YACvB,MAAM,IAAI,wBAAO,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,4FAA4F,CAAC,CAAC;QAC/I,uBAAuB;QACvB,OAAO,MAAM,CAAC,aAAa,CAAC;IAC9B,CAAC;IAED,kDAAkD;IAC3C,MAAM,KAAK,qBAAqB;QACrC,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED;;OAEG;IACI,MAAM,CAAC,SAAS,CAAC,GAAsB;QAC5C,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE;YACzB,qBAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,4FAA4F,CAAC,CAAC;YAC3I,OAAO,EAAE,CAAC;SACX;QACD,OAAO,MAAM,CAAC,aAAa,CAAC,+BAA+B,CAAC,MAAM,CAAC,qBAAqB,EAAE,GAAG,CAAC,CAAC;IACjG,CAAC;IAED,gBAAgB;IACT,MAAM,KAAK,WAAW;QAC3B,OAAO,YAAY,CAAC;IACtB,CAAC;IAED,gBAAgB;IACT,MAAM,CAAC,cAAc,CAAC,GAAQ;QACnC,MAAM,SAAS,GAAG,IAAA,6BAAY,EAAC,GAAG,CAAC,CAAC;QACpC,MAAM,QAAQ,GAAG,MAAM,CAAC,WAAW,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;QACzE,OAAO,QAAQ,CAAC;IAClB,CAAC;;AAvEH,wBAyEC;AAxEgB,mBAAY,GAAG,KAAK,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 Utilities\r\n */\r\n\r\n/** Import color variables, layout variables and Sass classes barrel file */\r\nimport \"./colorthemes.scss\";\r\nimport \"./colorvariables.scss\";\r\nimport \"./layout-variables.scss\";\r\nimport \"./classes.scss\";\r\n\r\nimport { Logger } from \"@itwin/core-bentley\";\r\nimport type { Localization } from \"@itwin/core-common\";\r\nimport { getClassName, UiError } from \"@itwin/appui-abstract\";\r\nimport { IconWebComponent } from \"./utils/IconWebComponent\";\r\n// cSpell:ignore colorthemes colorvariables\r\n\r\n/**\r\n * Manages the Localization service for the core-react package.\r\n * @public\r\n */\r\nexport class UiCore {\r\n  private static _initialized = false;\r\n  private static _localization?: Localization;\r\n\r\n  /**\r\n   * Registers the Localization service namespace for UiCore.\r\n   * @param localization The internationalization service created by the host application.\r\n   */\r\n  public static async initialize(localization: Localization): Promise<void> {\r\n    if (UiCore._initialized) {\r\n      Logger.logInfo(UiCore.loggerCategory(UiCore), `UiCore.initialize already called`);\r\n      return;\r\n    }\r\n\r\n    UiCore._localization = localization;\r\n    await UiCore._localization.registerNamespace(UiCore.localizationNamespace);\r\n    if (window.customElements.get(\"svg-loader\") === undefined)\r\n      window.customElements.define(\"svg-loader\", IconWebComponent);\r\n\r\n    UiCore._initialized = true;\r\n  }\r\n\r\n  /** Unregisters the UiCore localization namespace */\r\n  public static terminate() {\r\n    if (UiCore._localization)\r\n      UiCore._localization.unregisterNamespace(UiCore.localizationNamespace);\r\n    UiCore._localization = undefined;\r\n\r\n    UiCore._initialized = false;\r\n  }\r\n\r\n  /** Determines if UiCore has been initialized */\r\n  public static get initialized(): boolean { return UiCore._initialized; }\r\n\r\n  /** The internationalization service created by the host application.\r\n   * @internal\r\n   */\r\n  public static get localization(): Localization {\r\n    // istanbul ignore else\r\n    if (!UiCore._localization)\r\n      throw new UiError(UiCore.loggerCategory(this), \"localization: UiCore.initialize has not been called. Unable to return Localization object.\");\r\n    // istanbul ignore next\r\n    return UiCore._localization;\r\n  }\r\n\r\n  /** The internationalization service namespace. */\r\n  public static get localizationNamespace(): string {\r\n    return \"UiCore\";\r\n  }\r\n\r\n  /** Calls localization.getLocalizedStringWithNamespace with the \"UiCore\" namespace. Do NOT include the namespace in the key.\r\n   * @internal\r\n   */\r\n  public static translate(key: string | string[]): string {\r\n    if (!UiCore._localization) {\r\n      Logger.logError(UiCore.loggerCategory(this), `translate: UiCore must be initialize with a localization provider. Returning blank string.`);\r\n      return \"\";\r\n    }\r\n    return UiCore._localization.getLocalizedStringWithNamespace(UiCore.localizationNamespace, key);\r\n  }\r\n\r\n  /** @internal */\r\n  public static get packageName(): string {\r\n    return \"core-react\";\r\n  }\r\n\r\n  /** @internal */\r\n  public static loggerCategory(obj: any): string {\r\n    const className = getClassName(obj);\r\n    const category = UiCore.packageName + (className ? `.${className}` : \"\");\r\n    return category;\r\n  }\r\n\r\n}\r\n"]}

package/lib/cjs/core-react/badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../src/core-react/badge/Badge.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,cAAc,CAAC;AAEtB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,WAAW;IAC7C,GAAG,EAAE,GAAG,CAAC;CACV;AAED;;GAEG;AACH,qBAAa,KAAM,SAAQ,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC;IACxC,MAAM,IAAI,GAAG,CAAC,OAAO;CAOtC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../src/core-react/badge/Badge.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,cAAc,CAAC;AAEtB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAI7C;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,WAAW;IAC7C,GAAG,EAAE,GAAG,CAAC;CACV;AAED;;GAEG;AACH,qBAAa,KAAM,SAAQ,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC;IACxC,MAAM,IAAI,GAAG,CAAC,OAAO;CAQtC"}

package/lib/cjs/core-react/badge/Badge.js

@@ -11,14 +11,16 @@ exports.Badge = void 0;
 require("./Badge.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
-const SvgSprite_1 = require("../icons/SvgSprite");
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const IconComponent_1 = require("../icons/IconComponent");
 /** Beta Badge React component
  * @internal
  */
 class Badge extends React.PureComponent {
     render() {
+        const iconSpec = appui_abstract_1.IconSpecUtilities.createWebComponentIconSpec(this.props.svg);
         return (React.createElement("div", { className: (0, classnames_1.default)("core-badge", this.props.className), style: this.props.style },
-            React.createElement(SvgSprite_1.SvgSprite, { src: this.props.svg })));
+            React.createElement(IconComponent_1.Icon, { iconSpec: iconSpec })));
     }
 }
 exports.Badge = Badge;

package/lib/cjs/core-react/badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../../src/core-react/badge/Badge.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,wBAAsB;AACtB,2CAAoC;AACpC,+BAA+B;AAC/B,kDAA+C;AAU/C;;GAEG;AACH,MAAa,KAAM,SAAQ,KAAK,CAAC,aAAyB;IACxC,MAAM;QACpB,OAAO,CACL,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACrF,oBAAC,qBAAS,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,GAAI,CAC9B,CACP,CAAC;IACJ,CAAC;CACF;AARD,sBAQC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport \"./Badge.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { SvgSprite } from \"../icons/SvgSprite\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[Badge]] React component\r\n * @internal\r\n */\r\nexport interface BadgeProps extends CommonProps {\r\n  svg: any;\r\n}\r\n\r\n/** Beta Badge React component\r\n * @internal\r\n */\r\nexport class Badge extends React.PureComponent<BadgeProps> {\r\n  public override render(): JSX.Element {\r\n    return (\r\n      <div className={classnames(\"core-badge\", this.props.className)} style={this.props.style}>\r\n        <SvgSprite src={this.props.svg} />\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../../src/core-react/badge/Badge.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,wBAAsB;AACtB,2CAAoC;AACpC,+BAA+B;AAE/B,0DAA0D;AAC1D,0DAA8C;AAS9C;;GAEG;AACH,MAAa,KAAM,SAAQ,KAAK,CAAC,aAAyB;IACxC,MAAM;QACpB,MAAM,QAAQ,GAAG,kCAAiB,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC9E,OAAO,CACL,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACrF,oBAAC,oBAAI,IAAC,QAAQ,EAAE,QAAQ,GAAI,CACxB,CACP,CAAC;IACJ,CAAC;CACF;AATD,sBASC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport \"./Badge.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { IconSpecUtilities } from \"@itwin/appui-abstract\";\r\nimport { Icon } from \"../icons/IconComponent\";\r\n\r\n/** Properties for the [[Badge]] React component\r\n * @internal\r\n */\r\nexport interface BadgeProps extends CommonProps {\r\n  svg: any;\r\n}\r\n\r\n/** Beta Badge React component\r\n * @internal\r\n */\r\nexport class Badge extends React.PureComponent<BadgeProps> {\r\n  public override render(): JSX.Element {\r\n    const iconSpec = IconSpecUtilities.createWebComponentIconSpec(this.props.svg);\r\n    return (\r\n      <div className={classnames(\"core-badge\", this.props.className)} style={this.props.style}>\r\n        <Icon iconSpec={iconSpec} />\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/cjs/core-react/badge/BetaBadge.js

@@ -12,13 +12,13 @@ require("./BetaBadge.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
 const Badge_1 = require("./Badge");
-const technical_preview_badge_svg_sprite_1 = require("./technical-preview-badge.svg?sprite");
+const technical_preview_badge_svg_1 = require("./technical-preview-badge.svg");
 /** Beta Badge React component
  * @internal
  */
 function BetaBadge(props) {
     const className = (0, classnames_1.default)("core-badge-betaBadge", props.className);
-    return React.createElement(Badge_1.Badge, { ...props, svg: technical_preview_badge_svg_sprite_1.default, className: className });
+    return React.createElement(Badge_1.Badge, { ...props, svg: technical_preview_badge_svg_1.default, className: className });
 }
 exports.BetaBadge = BetaBadge;
 //# sourceMappingURL=BetaBadge.js.map

package/lib/cjs/core-react/badge/BetaBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"BetaBadge.js","sourceRoot":"","sources":["../../../../src/core-react/badge/BetaBadge.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAE/B,mCAAgC;AAChC,6FAAiE;AAEjE;;GAEG;AACH,SAAgB,SAAS,CAAC,KAAkB;IAC1C,MAAM,SAAS,GAAG,IAAA,oBAAU,EAAC,sBAAsB,EACjD,KAAK,CAAC,SAAS,CAChB,CAAC;IACF,OAAO,oBAAC,aAAK,OACP,KAAK,EACT,GAAG,EAAE,4CAAa,EAClB,SAAS,EAAE,SAAS,GACpB,CAAC;AACL,CAAC;AATD,8BASC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport \"./BetaBadge.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Badge } from \"./Badge\";\r\nimport betaBadgeIcon from \"./technical-preview-badge.svg?sprite\";\r\n\r\n/** Beta Badge React component\r\n * @internal\r\n */\r\nexport function BetaBadge(props: CommonProps) {\r\n  const className = classnames(\"core-badge-betaBadge\",\r\n    props.className,\r\n  );\r\n  return <Badge\r\n    {...props}\r\n    svg={betaBadgeIcon}\r\n    className={className}\r\n  />;\r\n}\r\n"]}
+{"version":3,"file":"BetaBadge.js","sourceRoot":"","sources":["../../../../src/core-react/badge/BetaBadge.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAE/B,mCAAgC;AAChC,+EAA0D;AAE1D;;GAEG;AACH,SAAgB,SAAS,CAAC,KAAkB;IAC1C,MAAM,SAAS,GAAG,IAAA,oBAAU,EAAC,sBAAsB,EACjD,KAAK,CAAC,SAAS,CAChB,CAAC;IACF,OAAO,oBAAC,aAAK,OACP,KAAK,EACT,GAAG,EAAE,qCAAa,EAClB,SAAS,EAAE,SAAS,GACpB,CAAC;AACL,CAAC;AATD,8BASC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport \"./BetaBadge.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Badge } from \"./Badge\";\r\nimport betaBadgeIcon from \"./technical-preview-badge.svg\";\r\n\r\n/** Beta Badge React component\r\n * @internal\r\n */\r\nexport function BetaBadge(props: CommonProps) {\r\n  const className = classnames(\"core-badge-betaBadge\",\r\n    props.className,\r\n  );\r\n  return <Badge\r\n    {...props}\r\n    svg={betaBadgeIcon}\r\n    className={className}\r\n  />;\r\n}\r\n"]}

package/lib/cjs/core-react/badge/NewBadge.js

@@ -12,13 +12,13 @@ require("./NewBadge.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
 const Badge_1 = require("./Badge");
-const new_feature_badge_svg_sprite_1 = require("./new-feature-badge.svg?sprite");
+const new_feature_badge_svg_1 = require("./new-feature-badge.svg");
 /** New Badge React component
  * @internal
  */
 function NewBadge(props) {
     const { className, ...badgeProps } = props;
-    return React.createElement(Badge_1.Badge, { ...badgeProps, className: (0, classnames_1.default)("core-new-badge", className), svg: new_feature_badge_svg_sprite_1.default });
+    return React.createElement(Badge_1.Badge, { ...badgeProps, className: (0, classnames_1.default)("core-new-badge", className), svg: new_feature_badge_svg_1.default });
 }
 exports.NewBadge = NewBadge;
 //# sourceMappingURL=NewBadge.js.map

package/lib/cjs/core-react/badge/NewBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"NewBadge.js","sourceRoot":"","sources":["../../../../src/core-react/badge/NewBadge.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2BAAyB;AACzB,2CAAoC;AACpC,+BAA+B;AAE/B,mCAAgC;AAChC,iFAA0D;AAE1D;;GAEG;AACH,SAAgB,QAAQ,CAAC,KAAkB;IACzC,MAAM,EAAE,SAAS,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IAC3C,OAAO,oBAAC,aAAK,OAAK,UAAU,EAAE,SAAS,EAAE,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE,sCAAY,GAAI,CAAC;AAC1G,CAAC;AAHD,4BAGC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport \"./NewBadge.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Badge } from \"./Badge\";\r\nimport newBadgeIcon from \"./new-feature-badge.svg?sprite\";\r\n\r\n/** New Badge React component\r\n * @internal\r\n */\r\nexport function NewBadge(props: CommonProps) {\r\n  const { className, ...badgeProps } = props;\r\n  return <Badge {...badgeProps} className={classnames(\"core-new-badge\", className)} svg={newBadgeIcon} />;\r\n}\r\n"]}
+{"version":3,"file":"NewBadge.js","sourceRoot":"","sources":["../../../../src/core-react/badge/NewBadge.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2BAAyB;AACzB,2CAAoC;AACpC,+BAA+B;AAE/B,mCAAgC;AAChC,mEAAmD;AAEnD;;GAEG;AACH,SAAgB,QAAQ,CAAC,KAAkB;IACzC,MAAM,EAAE,SAAS,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IAC3C,OAAO,oBAAC,aAAK,OAAK,UAAU,EAAE,SAAS,EAAE,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE,+BAAY,GAAI,CAAC;AAC1G,CAAC;AAHD,4BAGC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Utilities\r\n */\r\n\r\nimport \"./NewBadge.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Badge } from \"./Badge\";\r\nimport newBadgeIcon from \"./new-feature-badge.svg\";\r\n\r\n/** New Badge React component\r\n * @internal\r\n */\r\nexport function NewBadge(props: CommonProps) {\r\n  const { className, ...badgeProps } = props;\r\n  return <Badge {...badgeProps} className={classnames(\"core-new-badge\", className)} svg={newBadgeIcon} />;\r\n}\r\n"]}

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

@@ -57,6 +57,10 @@
   --buic-foreground-focus-border:             var(--buic-inputs-border);
   --buic-focus-boxshadow:                     rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-4));
 
+  // The following two are still in use by DatePicker and there is no itwinui equivalent
+  --buic-focus-boxshadow-gradient1: rgba(var(--buic-foreground-primary-tone-rgb), 0);
+  --buic-focus-boxshadow-gradient2: rgba(var(--buic-foreground-primary-rgb), 0.65);
+
   --buic-foreground-accessory:                var(--iui-color-foreground-accessory);
   --buic-foreground-success:                  var(--iui-color-foreground-positive);
   --buic-foreground-positive:                 var(--iui-color-foreground-positive);

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

@@ -1 +1 @@
-{"version":3,"file":"IconComponent.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,sBAAsB,EAAqB,MAAM,uBAAuB,CAAC;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,oBAAY,QAAQ,GAAG,MAAM,GAAG,sBAAsB,GAAG,KAAK,CAAC,SAAS,CAAC;AAEzE;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,WAAW;IAC5C;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,sBAyBpC"}
+{"version":3,"file":"IconComponent.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":"AAKA;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,sBAAsB,EAAqB,MAAM,uBAAuB,CAAC;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C;;GAEG;AACH,oBAAY,QAAQ,GAAG,MAAM,GAAG,sBAAsB,GAAG,KAAK,CAAC,SAAS,CAAC;AAEzE;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,WAAW;IAC5C;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,sBA0CpC"}

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

@@ -3,6 +3,7 @@
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
+/* eslint-disable deprecation/deprecation */
 /** @packageDocumentation
  * @module Icon
  */
@@ -13,6 +14,7 @@ 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
  */
@@ -27,6 +29,20 @@ function Icon(props) {
         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} id="svg-id"></svg-loader>`;
+            const svgDiv = `<div>${svgLoader}</div>`;
+            // the esm build of dompurify has a default import but the cjs build does not
+            // if there is a default export, use it (likely esm), otherwise use the namespace
+            // istanbul ignore next
+            const sanitizer = dompurify_1.default !== null && dompurify_1.default !== void 0 ? dompurify_1.default : DOMPurifyNS;
+            const sanitizedIconString = sanitizer.sanitize(svgDiv, { ALLOWED_TAGS: ["svg-loader"] });
+            // we can safely disable jam3/no-sanitizer-with-danger as we are sanitizing above
+            // eslint-disable-next-line @typescript-eslint/naming-convention, jam3/no-sanitizer-with-danger
+            const webComponentNode = React.createElement("div", { dangerouslySetInnerHTML: { __html: sanitizedIconString } });
+            return (React.createElement("i", { className: (0, classnames_1.default)("icon", "core-svg-icon", props.className) }, webComponentNode));
+        }
         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));

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;;GAEG;;;AAEH,gCAA8B;AAC9B,+BAA+B;AAC/B,2CAAoC;AACpC,0DAAkF;AAClF,2CAAwC;AAkBxC;;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;QAEJ,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;AAzBD,oBAyBC","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 \"./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\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\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;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,EAAC;YACrB,MAAM,SAAS,GAAG,mBAAmB,kBAAkB,4BAA4B,CAAC;YACpF,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;YAC3C,MAAM,mBAAmB,GAAG,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,EAAC,YAAY,EAAE,CAAC,YAAY,CAAC,EAAC,CAAC,CAAC;YACvF,iFAAiF;YACjF,+FAA+F;YAC/F,MAAM,gBAAgB,GAAG,6BAAK,uBAAuB,EAAE,EAAC,MAAM,EAAC,mBAAmB,EAAC,GAAQ,CAAC;YAC5F,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;AA1CD,oBA0CC","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} id=\"svg-id\"></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      const sanitizedIconString = sanitizer.sanitize(svgDiv, {ALLOWED_TAGS: [\"svg-loader\"]});\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"]}

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

@@ -13,3 +13,8 @@
     fill: currentColor;
   }
 }
+
+.icon.core-menuitem-icon {
+  font-size: 16px;
+}
+

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

@@ -5,14 +5,15 @@ import "./SvgSprite.scss";
 import * as React from "react";
 import { CommonProps } from "../utils/Props";
 /** Properties of [[SvgSprite]] component.
- * @public
+ * @public @deprecated
  */
 export interface SvgSpriteProps extends CommonProps {
     /** Source for the Svg */
     src: string;
 }
 /** Svg element wrapper.
- * @public
+ * This component is deprecate -- use IconComponent
+ * @public @deprecated
  */
 export declare class SvgSprite extends React.PureComponent<SvgSpriteProps> {
     render(): JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"SvgSprite.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgSprite.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,cAAe,SAAQ,WAAW;IACjD,yBAAyB;IACzB,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;GAEG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC;IAChD,MAAM;CAYvB"}
+{"version":3,"file":"SvgSprite.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgSprite.tsx"],"names":[],"mappings":"AAKA;;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,cAAe,SAAQ,WAAW;IACjD,yBAAyB;IACzB,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;;GAGG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC;IAChD,MAAM;CAYvB"}

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

@@ -3,6 +3,7 @@
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
+/* eslint-disable deprecation/deprecation */
 /** @packageDocumentation
  * @module Icon
  */
@@ -12,7 +13,8 @@ require("./SvgSprite.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
 /** Svg element wrapper.
- * @public
+ * This component is deprecate -- use IconComponent
+ * @public @deprecated
  */
 class SvgSprite extends React.PureComponent {
     render() {

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

@@ -1 +1 @@
-{"version":3,"file":"SvgSprite.js","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgSprite.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAW/B;;GAEG;AACH,MAAa,SAAU,SAAQ,KAAK,CAAC,aAA6B;IAChD,MAAM;QACpB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,sBAAsB,EACtB,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM;YAC5E,6BAAK,UAAU,EAAC,8BAA8B,EAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,GAAI,CACxE,CACP,CAAC;IACJ,CAAC;CACF;AAbD,8BAaC","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 [[SvgSprite]] component.\r\n * @public\r\n */\r\nexport interface SvgSpriteProps extends CommonProps {\r\n  /** Source for the Svg */\r\n  src: string;\r\n}\r\n\r\n/** Svg element wrapper.\r\n * @public\r\n */\r\nexport class SvgSprite extends React.PureComponent<SvgSpriteProps> {\r\n  public override render() {\r\n    const className = classnames(\r\n      \"core-icons-svgSprite\",\r\n      this.props.className,\r\n    );\r\n\r\n    return (\r\n      <svg className={className} style={this.props.style} width=\"100%\" height=\"100%\">\r\n        <use xmlnsXlink=\"http://www.w3.org/1999/xlink\" xlinkHref={this.props.src} />\r\n      </svg>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"SvgSprite.js","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgSprite.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;;;AAEH,4BAA0B;AAC1B,2CAAoC;AACpC,+BAA+B;AAW/B;;;GAGG;AACH,MAAa,SAAU,SAAQ,KAAK,CAAC,aAA6B;IAChD,MAAM;QACpB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,sBAAsB,EACtB,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM;YAC5E,6BAAK,UAAU,EAAC,8BAA8B,EAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,GAAI,CACxE,CACP,CAAC;IACJ,CAAC;CACF;AAbD,8BAaC","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 \"./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 [[SvgSprite]] component.\r\n * @public @deprecated\r\n */\r\nexport interface SvgSpriteProps extends CommonProps {\r\n  /** Source for the Svg */\r\n  src: string;\r\n}\r\n\r\n/** Svg element wrapper.\r\n * This component is deprecate -- use IconComponent\r\n * @public @deprecated\r\n */\r\nexport class SvgSprite extends React.PureComponent<SvgSpriteProps> {\r\n  public override render() {\r\n    const className = classnames(\r\n      \"core-icons-svgSprite\",\r\n      this.props.className,\r\n    );\r\n\r\n    return (\r\n      <svg className={className} style={this.props.style} width=\"100%\" height=\"100%\">\r\n        <use xmlnsXlink=\"http://www.w3.org/1999/xlink\" xlinkHref={this.props.src} />\r\n      </svg>\r\n    );\r\n  }\r\n}\r\n"]}

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

@@ -16,7 +16,7 @@ const useRefs_1 = require("../utils/hooks/useRefs");
 const ForwardRefInput = React.forwardRef(// eslint-disable-line deprecation/deprecation
 function ForwardRefInput(props, ref) {
     const { className, style, setFocus, nativeKeyHandler, size, ...otherProps } = props; // eslint-disable-line @typescript-eslint/no-unused-vars
-    const inputElementRef = React.useRef();
+    const inputElementRef = React.useRef(null);
     const refs = (0, useRefs_1.useRefs)(inputElementRef, ref); // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.
     React.useEffect(() => {
         const currentElement = inputElementRef.current;

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,EAAoB,CAAC;IACzD,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 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>();\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 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;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 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 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"]}

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

@@ -17,7 +17,7 @@ const ForwardRefTextarea = React.forwardRef(// eslint-disable-line deprecation/d
 function ForwardRefTextarea(props, ref) {
     const { className, style, rows, setFocus, ...otherProps } = props; // eslint-disable-line @typescript-eslint/no-unused-vars
     const textRows = undefined !== rows ? rows : 3;
-    const textAreaElementRef = React.useRef();
+    const textAreaElementRef = React.useRef(null);
     const refs = (0, useRefs_1.useRefs)(textAreaElementRef, ref); // combine ref needed for target with the forwardRef needed by the Parent when parent is a Type Editor.
     React.useEffect(() => {
         if (textAreaElementRef.current && setFocus)

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

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../../../src/core-react/inputs/Textarea.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,wDAAoE;AACpE,oDAAiD;AAgBjD,0GAA0G;AAC1G,MAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAyC,8CAA8C;AAChI,SAAS,kBAAkB,CAAC,KAAK,EAAE,GAAG;IACpC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC,CAAC,wDAAwD;IAC3H,MAAM,QAAQ,GAAG,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/C,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,EAAuB,CAAC;IAC/D,MAAM,IAAI,GAAG,IAAA,iBAAO,EAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC,CAAE,uGAAuG;IAEvJ,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,kBAAkB,CAAC,OAAO,IAAI,QAAQ;YACxC,kBAAkB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACvC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAA4C,EAAE,EAAE;QACrF,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,oBAAC,wBAAgB,OAAK,UAAU,EAC9B,GAAG,EAAE,IAAI,EACT,IAAI,EAAE,QAAQ,EACd,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,IAAA,oBAAU,EAAC,wBAAwB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,GAAI,CAC/E,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;;GAGG;AACU,QAAA,QAAQ,GAAiD,kBAAkB,CAAC,CAAG,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 { Textarea as ITwinUI_Textarea } from \"@itwin/itwinui-react\";\r\nimport { useRefs } from \"../utils/hooks/useRefs\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for [[Textarea]] component\r\n * @public\r\n * @deprecated Use TextareaProps in itwinui-react instead\r\n */\r\nexport interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, CommonProps {\r\n  /** Number of textarea rows. Default is 3. */\r\n  rows?: number;\r\n  /** Indicates whether to set focus to the textarea element */\r\n  setFocus?: boolean;\r\n  /** Provides ability to return reference to HTMLInputElement */\r\n  ref?: React.Ref<HTMLTextAreaElement>;\r\n}\r\n\r\n// Defined using following pattern (const Input at bottom) to ensure useful API documentation is extracted\r\nconst ForwardRefTextarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(    // eslint-disable-line deprecation/deprecation\r\n  function ForwardRefTextarea(props, ref) {\r\n    const { className, style, rows, setFocus, ...otherProps } = props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n    const textRows = undefined !== rows ? rows : 3;\r\n    const textAreaElementRef = React.useRef<HTMLTextAreaElement>();\r\n    const refs = useRefs(textAreaElementRef, 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      if (textAreaElementRef.current && setFocus)\r\n        textAreaElementRef.current.focus();\r\n    }, [setFocus]);\r\n\r\n    const handleFocus = React.useCallback((event: React.FocusEvent<HTMLTextAreaElement>) => {\r\n      event.currentTarget.select();\r\n    }, []);\r\n\r\n    return (\r\n      <ITwinUI_Textarea {...otherProps}\r\n        ref={refs}\r\n        rows={textRows}\r\n        onFocus={handleFocus}\r\n        className={classnames(\"uicore-inputs-textarea\", className)} style={style} />\r\n    );\r\n  }\r\n);\r\n\r\n/** Basic textarea component\r\n * @public\r\n * @deprecated Use Textarea in itwinui-react instead\r\n */\r\nexport const Textarea: (props: TextareaProps) => JSX.Element | null = ForwardRefTextarea;   // eslint-disable-line deprecation/deprecation\r\n"]}
+{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../../../src/core-react/inputs/Textarea.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,wDAAoE;AACpE,oDAAiD;AAgBjD,0GAA0G;AAC1G,MAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAyC,8CAA8C;AAChI,SAAS,kBAAkB,CAAC,KAAK,EAAE,GAAG;IACpC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC,CAAC,wDAAwD;IAC3H,MAAM,QAAQ,GAAG,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/C,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAsB,IAAI,CAAC,CAAC;IACnE,MAAM,IAAI,GAAG,IAAA,iBAAO,EAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC,CAAE,uGAAuG;IAEvJ,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,kBAAkB,CAAC,OAAO,IAAI,QAAQ;YACxC,kBAAkB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACvC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAA4C,EAAE,EAAE;QACrF,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,oBAAC,wBAAgB,OAAK,UAAU,EAC9B,GAAG,EAAE,IAAI,EACT,IAAI,EAAE,QAAQ,EACd,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,IAAA,oBAAU,EAAC,wBAAwB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,GAAI,CAC/E,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;;GAGG;AACU,QAAA,QAAQ,GAAiD,kBAAkB,CAAC,CAAG,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 { Textarea as ITwinUI_Textarea } from \"@itwin/itwinui-react\";\r\nimport { useRefs } from \"../utils/hooks/useRefs\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for [[Textarea]] component\r\n * @public\r\n * @deprecated Use TextareaProps in itwinui-react instead\r\n */\r\nexport interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, CommonProps {\r\n  /** Number of textarea rows. Default is 3. */\r\n  rows?: number;\r\n  /** Indicates whether to set focus to the textarea element */\r\n  setFocus?: boolean;\r\n  /** Provides ability to return reference to HTMLInputElement */\r\n  ref?: React.Ref<HTMLTextAreaElement>;\r\n}\r\n\r\n// Defined using following pattern (const Input at bottom) to ensure useful API documentation is extracted\r\nconst ForwardRefTextarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(    // eslint-disable-line deprecation/deprecation\r\n  function ForwardRefTextarea(props, ref) {\r\n    const { className, style, rows, setFocus, ...otherProps } = props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n    const textRows = undefined !== rows ? rows : 3;\r\n    const textAreaElementRef = React.useRef<HTMLTextAreaElement>(null);\r\n    const refs = useRefs(textAreaElementRef, 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      if (textAreaElementRef.current && setFocus)\r\n        textAreaElementRef.current.focus();\r\n    }, [setFocus]);\r\n\r\n    const handleFocus = React.useCallback((event: React.FocusEvent<HTMLTextAreaElement>) => {\r\n      event.currentTarget.select();\r\n    }, []);\r\n\r\n    return (\r\n      <ITwinUI_Textarea {...otherProps}\r\n        ref={refs}\r\n        rows={textRows}\r\n        onFocus={handleFocus}\r\n        className={classnames(\"uicore-inputs-textarea\", className)} style={style} />\r\n    );\r\n  }\r\n);\r\n\r\n/** Basic textarea component\r\n * @public\r\n * @deprecated Use Textarea in itwinui-react instead\r\n */\r\nexport const Textarea: (props: TextareaProps) => JSX.Element | null = ForwardRefTextarea;   // eslint-disable-line deprecation/deprecation\r\n"]}

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

@@ -69,7 +69,7 @@ function processKeyboardNavigation(optionValues, itemIndex, key) {
  * @alpha
  */
 function Listbox(props) {
-    const { ariaLabel, ariaLabelledBy, id, children, selectedValue, className, onListboxValueChange, onKeyPress, ...otherProps } = props;
+    const { ariaLabel, ariaLabelledBy, id, children, selectedValue, className, onListboxValueChange, onKeyDown, ...otherProps } = props;
     const listRef = React.useRef(null);
     const [listId] = React.useState(() => { return id !== null && id !== void 0 ? id : core_bentley_1.Guid.createValue(); });
     const optionValues = React.useMemo(() => getOptionValueArray(children), [children]);
@@ -137,9 +137,9 @@ function Listbox(props) {
             }
         }
         // istanbul ignore else
-        if (onKeyPress)
-            onKeyPress(event);
-    }, [focusValue, optionValues, focusOption, onKeyPress, handleValueChange]);
+        if (onKeyDown)
+            onKeyDown(event);
+    }, [focusValue, optionValues, focusOption, onKeyDown, handleValueChange]);
     const isInitialMount = React.useRef(true);
     React.useEffect(() => {
         const list = listRef.current;

package/lib/cjs/core-react/listbox/Listbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Listbox.js","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"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","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\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\n\r\nimport \"./Listbox.scss\";\r\nimport { Guid } from \"@itwin/core-bentley\";\r\nimport { SpecialKey } from \"@itwin/appui-abstract\";\r\n\r\n/** Ideas borrowed from  https://reacttraining.com/reach-ui/listbox */\r\n\r\n/**\r\n * `Listbox` value.\r\n * @alpha\r\n */\r\nexport type ListboxValue = string;\r\n\r\n/**\r\n * `Listbox` Props.\r\n * @alpha\r\n */\r\nexport interface ListboxProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement> {\r\n  id?: string;\r\n  selectedValue?: ListboxValue;\r\n  ariaLabel?: any;\r\n  ariaLabelledBy?: any;\r\n  onListboxValueChange?: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\r\n}\r\n\r\n/**\r\n * `ListboxItem` Props.\r\n * @alpha\r\n */\r\nexport interface ListboxItemProps extends React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement> {\r\n  /** The unique item's value. */\r\n  value: ListboxValue;\r\n  /** set if item is disabled. */\r\n  disabled?: boolean;\r\n}\r\n\r\n/**\r\n * `Listbox` Context.\r\n * @alpha\r\n */\r\nexport interface ListboxContextProps {\r\n  listboxId?: string;\r\n  listboxValue?: ListboxValue;\r\n  focusValue?: ListboxValue;\r\n  onListboxValueChange: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\r\n  listboxRef?: React.RefObject<HTMLUListElement>;\r\n}\r\n\r\n/**\r\n * Context set up by listbox for use by `ListboxItems` .\r\n * @alpha\r\n */\r\n// istanbul ignore next\r\nexport const ListboxContext = React.createContext<ListboxContextProps>({ onListboxValueChange: (_newValue: ListboxValue | undefined) => { } }); // eslint-disable-line @typescript-eslint/naming-convention\r\n\r\nfunction makeId(...args: Array<string | number | null | undefined>) {\r\n  return args.filter((val) => val != null).join(\"--\");\r\n}\r\n\r\nfunction getOptionValueArray(childNodes: React.ReactNode): ListboxItemProps[] {\r\n  return React.Children.toArray(childNodes).filter((node) => React.isValidElement(node) && node.props.value).map((optionNode) => ((optionNode as React.ReactElement).props as ListboxItemProps));\r\n}\r\n\r\nfunction processKeyboardNavigation(optionValues: ListboxItemProps[], itemIndex: number, key: string): [number, boolean] {\r\n  let keyProcessed = false;\r\n  let newIndex = itemIndex >= 0 ? itemIndex : 0;\r\n\r\n  // Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js\r\n  if (key === SpecialKey.ArrowDown || key === SpecialKey.PageDown) {\r\n    for (let i = itemIndex + 1; i < optionValues.length; i++) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  } else if (key === SpecialKey.ArrowUp || key === SpecialKey.PageUp) {\r\n    for (let i = itemIndex - 1; i >= 0; i--) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  } else if (key === SpecialKey.Home) {\r\n    for (let i = 0; i < optionValues.length; i++) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  } else if (key === SpecialKey.End) {\r\n    for (let i = optionValues.length - 1; i >= 0; i--) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  }\r\n  return [newIndex, keyProcessed];\r\n}\r\n\r\n/**\r\n * Single select `Listbox` component\r\n * @alpha\r\n */\r\nexport function Listbox(props: ListboxProps) {\r\n  const { ariaLabel, ariaLabelledBy, id, children, selectedValue, className, onListboxValueChange, onKeyPress, ...otherProps } = props;\r\n  const listRef = React.useRef<HTMLUListElement>(null);\r\n  const [listId] = React.useState(() => { return id ?? Guid.createValue(); });\r\n  const optionValues = React.useMemo(() => getOptionValueArray(children), [children]);\r\n  const classes = React.useMemo(() => classnames(\"core-listbox\", className), [className]);\r\n  const [currentValue, setCurrentValue] = React.useState<ListboxValue | undefined>(selectedValue);\r\n  const [focusValue, setFocusValue] = React.useState<ListboxValue | undefined>(currentValue);\r\n\r\n  React.useEffect(() => {\r\n    setCurrentValue(selectedValue);\r\n    setFocusValue(selectedValue);\r\n  }, [selectedValue]);\r\n\r\n  const scrollTopRef = React.useRef(0);\r\n  const handleValueChange = React.useCallback((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => {\r\n    // istanbul ignore else\r\n    if (newValue !== currentValue) {\r\n      setCurrentValue(newValue);\r\n      setFocusValue(newValue);\r\n      if (onListboxValueChange)\r\n        onListboxValueChange(newValue, isControlOrCommandPressed);\r\n    }\r\n  }, [setCurrentValue, currentValue, onListboxValueChange]);\r\n\r\n  const focusOption = React.useCallback((itemIndex: number) => {\r\n    // istanbul ignore else\r\n    if (itemIndex >= 0 && itemIndex < optionValues.length) {\r\n      const newSelection = optionValues[itemIndex];\r\n      const listElement = listRef.current as HTMLUListElement;\r\n      // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\r\n      const optionToFocus = listElement.querySelector(`li[data-value=\"${newSelection.value}\"]`) as HTMLLIElement | null;\r\n      // istanbul ignore else\r\n      if (optionToFocus && listElement) {\r\n        let newScrollTop = listElement.scrollTop;\r\n\r\n        // istanbul ignore next\r\n        if (listElement.scrollHeight > listElement.clientHeight) {\r\n          const scrollBottom = listElement.clientHeight + listElement.scrollTop;\r\n          const elementBottom = optionToFocus.offsetTop + optionToFocus.offsetHeight;\r\n          if (elementBottom > scrollBottom) {\r\n            newScrollTop = elementBottom - listElement.clientHeight;\r\n          } else if (optionToFocus.offsetTop < listElement.scrollTop) {\r\n            newScrollTop = optionToFocus.offsetTop;\r\n          }\r\n          scrollTopRef.current = newScrollTop;\r\n        }\r\n        setFocusValue(newSelection.value);\r\n      }\r\n    }\r\n  }, [optionValues]);\r\n\r\n  const handleKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLUListElement>) => {\r\n    if (optionValues.length < 1)\r\n      return;\r\n\r\n    const itemIndex = (undefined === focusValue) ? -1 : optionValues.findIndex((optionValue) => ((optionValue.value === focusValue)));\r\n\r\n    if (event.key === SpecialKey.Space) {\r\n      event.preventDefault();\r\n      // istanbul ignore else\r\n      if (focusValue)\r\n        handleValueChange(focusValue, event.getModifierState(\"Control\") || event.getModifierState(\"Meta\"));  // Control or Command\r\n      return;\r\n    } else {\r\n      const [newItemIndex, keyProcessed] = processKeyboardNavigation(optionValues, itemIndex, event.key);\r\n      // istanbul ignore else\r\n      if (keyProcessed) {\r\n        event.preventDefault();\r\n        focusOption(newItemIndex);\r\n        return;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (onKeyPress)\r\n      onKeyPress(event);\r\n  }, [focusValue, optionValues, focusOption, onKeyPress, handleValueChange]);\r\n\r\n  const isInitialMount = React.useRef(true);\r\n\r\n  React.useEffect(() => {\r\n    const list = listRef.current as HTMLUListElement;\r\n\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n\r\n      if (undefined !== focusValue) {\r\n        const itemIndex = optionValues.findIndex((optionValue) => (optionValue.value === focusValue));\r\n        focusOption(itemIndex);\r\n      }\r\n    } else {\r\n      list.scrollTop = scrollTopRef.current;\r\n    }\r\n  }, [focusValue, focusOption, optionValues]);\r\n\r\n  // istanbul ignore next\r\n  const handleOnScroll = React.useCallback((_event: React.UIEvent<HTMLUListElement, UIEvent>) => {\r\n    if (listRef.current)\r\n      scrollTopRef.current = listRef.current.scrollTop;\r\n  }, []);\r\n\r\n  // istanbul ignore next\r\n  const handleOnFocus = React.useCallback((_event: React.FocusEvent<HTMLUListElement>) => {\r\n    if (!focusValue || 0 === focusValue.length) {\r\n      if (currentValue) {\r\n        setFocusValue(currentValue);\r\n      } else {\r\n        if (optionValues.length > 0)\r\n          setFocusValue(optionValues[0].value);\r\n      }\r\n    }\r\n  }, [currentValue, focusValue, optionValues]);\r\n\r\n  return <ul\r\n    className={classes}\r\n    // If the listbox is not part of another widget, then it has a visible\r\n    // label referenced by `aria-labelledby` on the element with role\r\n    // `listbox`.\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n    // If an `aria-label` is passed, we should skip `aria-labelledby` to\r\n    // avoid confusion.\r\n    aria-labelledby={ariaLabel ? undefined : ariaLabelledBy}\r\n    aria-label={ariaLabel}\r\n    // An element that contains or owns all the listbox options has role\r\n    // listbox.\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n    role=\"listbox\"\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-collapsible.html\r\n    tabIndex={0}\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-scrollable.html\r\n    aria-activedescendant={makeId(currentValue, listId)}\r\n    {...otherProps}\r\n    ref={listRef}\r\n    id={listId}\r\n    onKeyDown={handleKeyDown}\r\n    onScroll={handleOnScroll}\r\n    data-value={currentValue}\r\n    data-focusvalue={focusValue}\r\n    onFocus={handleOnFocus}\r\n  >\r\n    <ListboxContext.Provider\r\n      value={{\r\n        listboxValue: currentValue,\r\n        focusValue,\r\n        listboxId: listId,\r\n        onListboxValueChange: handleValueChange,\r\n        listboxRef: listRef,\r\n      }}\r\n    >\r\n      {children}\r\n    </ListboxContext.Provider>\r\n  </ul>;\r\n}\r\n\r\n/**\r\n * `ListboxItem` component.\r\n * @alpha\r\n */\r\nexport function ListboxItem(props: ListboxItemProps) {\r\n  const {\r\n    children,\r\n    value,\r\n    className,\r\n    disabled,\r\n    ...otherProps\r\n  } = props;\r\n\r\n  const {\r\n    listboxValue,\r\n    focusValue,\r\n    listboxId,\r\n    onListboxValueChange,\r\n  } = React.useContext(ListboxContext);\r\n\r\n  const hasFocus = focusValue === value;\r\n\r\n  const classes = React.useMemo(() => classnames(\"core-listbox-item\", hasFocus && \"focused\", className), [className, hasFocus]);\r\n  const itemRef = React.useRef<HTMLLIElement>(null);\r\n  const isSelected = listboxValue === value;\r\n\r\n  const handleClick = React.useCallback((event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\r\n    event.preventDefault();\r\n    // istanbul ignore next\r\n    const selectedValue = event.currentTarget?.dataset?.value;\r\n    // istanbul ignore else\r\n    if (undefined !== selectedValue) {\r\n      onListboxValueChange(selectedValue, event.ctrlKey);\r\n    }\r\n  }, [onListboxValueChange]);\r\n\r\n  const getItemId = React.useCallback(() => {\r\n    return makeId(value, listboxId);\r\n  }, [listboxId, value]);\r\n\r\n  return (\r\n    // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n    <li\r\n      // In a single-select listbox, the selected option has `aria-selected`\r\n      // set to `true`.\r\n      // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n      aria-selected={isSelected}\r\n      // Applicable to all host language elements regardless of whether a\r\n      // `role` is applied.\r\n      // https://www.w3.org/WAI/PF/aria/states_and_properties#global_states_header\r\n      aria-disabled={disabled || undefined}\r\n      // Each option in the listbox has role `option` and is a DOM descendant\r\n      // of the element with role `listbox`.\r\n      // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n      role=\"option\"\r\n      className={classes}\r\n      {...otherProps}\r\n      ref={itemRef}\r\n      id={getItemId()}\r\n      // used for css styling\r\n      data-value={value}\r\n      onClick={handleClick}\r\n    >\r\n      {children}\r\n    </li>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"Listbox.js","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"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","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\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\n\r\nimport \"./Listbox.scss\";\r\nimport { Guid } from \"@itwin/core-bentley\";\r\nimport { SpecialKey } from \"@itwin/appui-abstract\";\r\n\r\n/** Ideas borrowed from  https://reacttraining.com/reach-ui/listbox */\r\n\r\n/**\r\n * `Listbox` value.\r\n * @alpha\r\n */\r\nexport type ListboxValue = string;\r\n\r\n/**\r\n * `Listbox` Props.\r\n * @alpha\r\n */\r\nexport interface ListboxProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement> {\r\n  id?: string;\r\n  selectedValue?: ListboxValue;\r\n  ariaLabel?: any;\r\n  ariaLabelledBy?: any;\r\n  onListboxValueChange?: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\r\n}\r\n\r\n/**\r\n * `ListboxItem` Props.\r\n * @alpha\r\n */\r\nexport interface ListboxItemProps extends React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement> {\r\n  /** The unique item's value. */\r\n  value: ListboxValue;\r\n  /** set if item is disabled. */\r\n  disabled?: boolean;\r\n}\r\n\r\n/**\r\n * `Listbox` Context.\r\n * @alpha\r\n */\r\nexport interface ListboxContextProps {\r\n  listboxId?: string;\r\n  listboxValue?: ListboxValue;\r\n  focusValue?: ListboxValue;\r\n  onListboxValueChange: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\r\n  listboxRef?: React.RefObject<HTMLUListElement>;\r\n}\r\n\r\n/**\r\n * Context set up by listbox for use by `ListboxItems` .\r\n * @alpha\r\n */\r\n// istanbul ignore next\r\nexport const ListboxContext = React.createContext<ListboxContextProps>({ onListboxValueChange: (_newValue: ListboxValue | undefined) => { } }); // eslint-disable-line @typescript-eslint/naming-convention\r\n\r\nfunction makeId(...args: Array<string | number | null | undefined>) {\r\n  return args.filter((val) => val != null).join(\"--\");\r\n}\r\n\r\nfunction getOptionValueArray(childNodes: React.ReactNode): ListboxItemProps[] {\r\n  return React.Children.toArray(childNodes).filter((node) => React.isValidElement(node) && node.props.value).map((optionNode) => ((optionNode as React.ReactElement).props as ListboxItemProps));\r\n}\r\n\r\nfunction processKeyboardNavigation(optionValues: ListboxItemProps[], itemIndex: number, key: string): [number, boolean] {\r\n  let keyProcessed = false;\r\n  let newIndex = itemIndex >= 0 ? itemIndex : 0;\r\n\r\n  // Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js\r\n  if (key === SpecialKey.ArrowDown || key === SpecialKey.PageDown) {\r\n    for (let i = itemIndex + 1; i < optionValues.length; i++) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  } else if (key === SpecialKey.ArrowUp || key === SpecialKey.PageUp) {\r\n    for (let i = itemIndex - 1; i >= 0; i--) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  } else if (key === SpecialKey.Home) {\r\n    for (let i = 0; i < optionValues.length; i++) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  } else if (key === SpecialKey.End) {\r\n    for (let i = optionValues.length - 1; i >= 0; i--) {\r\n      if (!optionValues[i].disabled) {\r\n        newIndex = i;\r\n        break;\r\n      }\r\n    }\r\n    keyProcessed = true;\r\n  }\r\n  return [newIndex, keyProcessed];\r\n}\r\n\r\n/**\r\n * Single select `Listbox` component\r\n * @alpha\r\n */\r\nexport function Listbox(props: ListboxProps) {\r\n  const { ariaLabel, ariaLabelledBy, id, children, selectedValue, className, onListboxValueChange, onKeyDown, ...otherProps } = props;\r\n  const listRef = React.useRef<HTMLUListElement>(null);\r\n  const [listId] = React.useState(() => { return id ?? Guid.createValue(); });\r\n  const optionValues = React.useMemo(() => getOptionValueArray(children), [children]);\r\n  const classes = React.useMemo(() => classnames(\"core-listbox\", className), [className]);\r\n  const [currentValue, setCurrentValue] = React.useState<ListboxValue | undefined>(selectedValue);\r\n  const [focusValue, setFocusValue] = React.useState<ListboxValue | undefined>(currentValue);\r\n\r\n  React.useEffect(() => {\r\n    setCurrentValue(selectedValue);\r\n    setFocusValue(selectedValue);\r\n  }, [selectedValue]);\r\n\r\n  const scrollTopRef = React.useRef(0);\r\n  const handleValueChange = React.useCallback((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => {\r\n    // istanbul ignore else\r\n    if (newValue !== currentValue) {\r\n      setCurrentValue(newValue);\r\n      setFocusValue(newValue);\r\n      if (onListboxValueChange)\r\n        onListboxValueChange(newValue, isControlOrCommandPressed);\r\n    }\r\n  }, [setCurrentValue, currentValue, onListboxValueChange]);\r\n\r\n  const focusOption = React.useCallback((itemIndex: number) => {\r\n    // istanbul ignore else\r\n    if (itemIndex >= 0 && itemIndex < optionValues.length) {\r\n      const newSelection = optionValues[itemIndex];\r\n      const listElement = listRef.current as HTMLUListElement;\r\n      // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\r\n      const optionToFocus = listElement.querySelector(`li[data-value=\"${newSelection.value}\"]`) as HTMLLIElement | null;\r\n      // istanbul ignore else\r\n      if (optionToFocus && listElement) {\r\n        let newScrollTop = listElement.scrollTop;\r\n\r\n        // istanbul ignore next\r\n        if (listElement.scrollHeight > listElement.clientHeight) {\r\n          const scrollBottom = listElement.clientHeight + listElement.scrollTop;\r\n          const elementBottom = optionToFocus.offsetTop + optionToFocus.offsetHeight;\r\n          if (elementBottom > scrollBottom) {\r\n            newScrollTop = elementBottom - listElement.clientHeight;\r\n          } else if (optionToFocus.offsetTop < listElement.scrollTop) {\r\n            newScrollTop = optionToFocus.offsetTop;\r\n          }\r\n          scrollTopRef.current = newScrollTop;\r\n        }\r\n        setFocusValue(newSelection.value);\r\n      }\r\n    }\r\n  }, [optionValues]);\r\n\r\n  const handleKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLUListElement>) => {\r\n    if (optionValues.length < 1)\r\n      return;\r\n\r\n    const itemIndex = (undefined === focusValue) ? -1 : optionValues.findIndex((optionValue) => ((optionValue.value === focusValue)));\r\n\r\n    if (event.key === SpecialKey.Space) {\r\n      event.preventDefault();\r\n      // istanbul ignore else\r\n      if (focusValue)\r\n        handleValueChange(focusValue, event.getModifierState(\"Control\") || event.getModifierState(\"Meta\"));  // Control or Command\r\n      return;\r\n    } else {\r\n      const [newItemIndex, keyProcessed] = processKeyboardNavigation(optionValues, itemIndex, event.key);\r\n      // istanbul ignore else\r\n      if (keyProcessed) {\r\n        event.preventDefault();\r\n        focusOption(newItemIndex);\r\n        return;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (onKeyDown)\r\n      onKeyDown(event);\r\n  }, [focusValue, optionValues, focusOption, onKeyDown, handleValueChange]);\r\n\r\n  const isInitialMount = React.useRef(true);\r\n\r\n  React.useEffect(() => {\r\n    const list = listRef.current as HTMLUListElement;\r\n\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n\r\n      if (undefined !== focusValue) {\r\n        const itemIndex = optionValues.findIndex((optionValue) => (optionValue.value === focusValue));\r\n        focusOption(itemIndex);\r\n      }\r\n    } else {\r\n      list.scrollTop = scrollTopRef.current;\r\n    }\r\n  }, [focusValue, focusOption, optionValues]);\r\n\r\n  // istanbul ignore next\r\n  const handleOnScroll = React.useCallback((_event: React.UIEvent<HTMLUListElement, UIEvent>) => {\r\n    if (listRef.current)\r\n      scrollTopRef.current = listRef.current.scrollTop;\r\n  }, []);\r\n\r\n  // istanbul ignore next\r\n  const handleOnFocus = React.useCallback((_event: React.FocusEvent<HTMLUListElement>) => {\r\n    if (!focusValue || 0 === focusValue.length) {\r\n      if (currentValue) {\r\n        setFocusValue(currentValue);\r\n      } else {\r\n        if (optionValues.length > 0)\r\n          setFocusValue(optionValues[0].value);\r\n      }\r\n    }\r\n  }, [currentValue, focusValue, optionValues]);\r\n\r\n  return <ul\r\n    className={classes}\r\n    // If the listbox is not part of another widget, then it has a visible\r\n    // label referenced by `aria-labelledby` on the element with role\r\n    // `listbox`.\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n    // If an `aria-label` is passed, we should skip `aria-labelledby` to\r\n    // avoid confusion.\r\n    aria-labelledby={ariaLabel ? undefined : ariaLabelledBy}\r\n    aria-label={ariaLabel}\r\n    // An element that contains or owns all the listbox options has role\r\n    // listbox.\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n    role=\"listbox\"\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-collapsible.html\r\n    tabIndex={0}\r\n    // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-scrollable.html\r\n    aria-activedescendant={makeId(currentValue, listId)}\r\n    {...otherProps}\r\n    ref={listRef}\r\n    id={listId}\r\n    onKeyDown={handleKeyDown}\r\n    onScroll={handleOnScroll}\r\n    data-value={currentValue}\r\n    data-focusvalue={focusValue}\r\n    onFocus={handleOnFocus}\r\n  >\r\n    <ListboxContext.Provider\r\n      value={{\r\n        listboxValue: currentValue,\r\n        focusValue,\r\n        listboxId: listId,\r\n        onListboxValueChange: handleValueChange,\r\n        listboxRef: listRef,\r\n      }}\r\n    >\r\n      {children}\r\n    </ListboxContext.Provider>\r\n  </ul>;\r\n}\r\n\r\n/**\r\n * `ListboxItem` component.\r\n * @alpha\r\n */\r\nexport function ListboxItem(props: ListboxItemProps) {\r\n  const {\r\n    children,\r\n    value,\r\n    className,\r\n    disabled,\r\n    ...otherProps\r\n  } = props;\r\n\r\n  const {\r\n    listboxValue,\r\n    focusValue,\r\n    listboxId,\r\n    onListboxValueChange,\r\n  } = React.useContext(ListboxContext);\r\n\r\n  const hasFocus = focusValue === value;\r\n\r\n  const classes = React.useMemo(() => classnames(\"core-listbox-item\", hasFocus && \"focused\", className), [className, hasFocus]);\r\n  const itemRef = React.useRef<HTMLLIElement>(null);\r\n  const isSelected = listboxValue === value;\r\n\r\n  const handleClick = React.useCallback((event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\r\n    event.preventDefault();\r\n    // istanbul ignore next\r\n    const selectedValue = event.currentTarget?.dataset?.value;\r\n    // istanbul ignore else\r\n    if (undefined !== selectedValue) {\r\n      onListboxValueChange(selectedValue, event.ctrlKey);\r\n    }\r\n  }, [onListboxValueChange]);\r\n\r\n  const getItemId = React.useCallback(() => {\r\n    return makeId(value, listboxId);\r\n  }, [listboxId, value]);\r\n\r\n  return (\r\n    // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n    <li\r\n      // In a single-select listbox, the selected option has `aria-selected`\r\n      // set to `true`.\r\n      // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n      aria-selected={isSelected}\r\n      // Applicable to all host language elements regardless of whether a\r\n      // `role` is applied.\r\n      // https://www.w3.org/WAI/PF/aria/states_and_properties#global_states_header\r\n      aria-disabled={disabled || undefined}\r\n      // Each option in the listbox has role `option` and is a DOM descendant\r\n      // of the element with role `listbox`.\r\n      // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n      role=\"option\"\r\n      className={classes}\r\n      {...otherProps}\r\n      ref={itemRef}\r\n      id={getItemId()}\r\n      // used for css styling\r\n      data-value={value}\r\n      onClick={handleClick}\r\n    >\r\n      {children}\r\n    </li>\r\n  );\r\n}\r\n"]}

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,EAAiC,WAAW,EAAE,MAAM,eAAe,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAIhD;;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,sBAgE1D"}
+{"version":3,"file":"MessageRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core-react/notification/MessageRenderer.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAIH,OAAO,EAAiC,WAAW,EAAE,MAAM,eAAe,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAIhD;;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,sBAmE1D"}

package/lib/cjs/core-react/notification/MessageRenderer.js

@@ -9,7 +9,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MessageRenderer = void 0;
 const React = require("react");
-const DOMPurify = require("dompurify");
+const dompurify_1 = require("dompurify"), DOMPurifyNS = dompurify_1;
 const MessageType_1 = require("./MessageType");
 /** React component renders a string, HTMLElement or React node in a `div` or `span`
  * @public
@@ -21,7 +21,10 @@ function MessageRenderer(props) {
         messageNode = React.createElement(OutElement, { className: props.className }, props.message);
     }
     else if ((0, MessageType_1.isHTMLElement)(props.message)) {
-        const sanitizer = DOMPurify.sanitize; // `sanitizer` is default function name for "jam3/no-sanitizer-with-danger" ESLint rule
+        // the esm build of dompurify has a default import but the cjs build does not
+        // if there is a default export, use it (likely esm), otherwise use the namespace
+        // istanbul ignore next
+        const sanitizer = dompurify_1.default !== null && dompurify_1.default !== void 0 ? dompurify_1.default : DOMPurifyNS; // `sanitizer` is default function name for "jam3/no-sanitizer-with-danger" ESLint rule
         let validAnchors = false;
         let hasAnchors = false;
         // verify that the tag has proper relationships
@@ -59,10 +62,10 @@ function MessageRenderer(props) {
         let sanitizedHtml;
         if (hasAnchors && validAnchors) {
             // all anchors are valid. do not remove the target attr
-            sanitizedHtml = sanitizer(props.message.outerHTML, { ADD_ATTR: ["target"] });
+            sanitizedHtml = sanitizer.sanitize(props.message.outerHTML, { ADD_ATTR: ["target"] });
         }
         else {
-            sanitizedHtml = sanitizer(props.message.outerHTML);
+            sanitizedHtml = sanitizer.sanitize(props.message.outerHTML);
         }
         // we can safely disable jam3/no-sanitizer-with-danger as we are sanitizing above
         // eslint-disable-next-line @typescript-eslint/naming-convention, jam3/no-sanitizer-with-danger