@itwin/appui-react 4.0.0-dev.10 → 4.0.0-dev.11

package/lib/esm/appui-react/accudraw/AccuDrawInputField.scss

@@ -15,7 +15,7 @@
   font-size: var(--iui-font-size-2);
   font-weight: var(--iui-font-weight-bold);
   line-height: var(--iui-size-l);
-  color: $buic-text-color;
+  color: var(--iui-color-text);
 
   &.uifw-label-centered {
     justify-content: center;
@@ -41,21 +41,15 @@
 
 .uifw-accudraw-x-value {
   background-color: $buic-accessory-alert;
-  color: $buic-accessory-hollow;
+  color: var(--iui-color-white);
 }
 
 .uifw-accudraw-y-value {
   background-color: $buic-accessory-success;
-  color: $buic-accessory-hollow;
+  color: var(--iui-color-white);
 }
 
 .uifw-accudraw-z-value {
   background-color: $buic-accessory-primary;
-  color: $buic-accessory-hollow;
-}
-
-.uifw-accudraw-angle-value {
-}
-
-.uifw-accudraw-distance-value {
+  color: var(--iui-color-white);
 }

package/lib/esm/appui-react/accudraw/Calculator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Calculator.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/Calculator.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAqB,YAAY,EAAE,kBAAkB,EAAc,MAAM,uBAAuB,CAAC;AACxG,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAsB,MAAM,oBAAoB,CAAC;AAO1E,aAAa;AACb,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,oBAAoB;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mDAAmD;IACnD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,yDAAyD;IACzD,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,YAAY,CAAC;IAExB,2CAA2C;IAC3C,MAAM,EAAE,gBAAgB,CAAC;CAC1B;AAED,UAAU,eAAe;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,gBAAgB;AAChB,oBAAY,oBAAoB,GAAG,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;AAEnE,aAAa;AACb,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,EAAE,eAAe,CAAC;IACnF,OAAO,CAAC,QAAQ,CAAqC;IACrD,OAAO,CAAC,cAAc,CAAS;IAE/B,gBAAgB;IAChB,gBAAuB,YAAY,EAAE,oBAAoB,CAEvD;gBAEU,KAAK,EAAE,eAAe;IAYlC,OAAO,CAAC,mBAAmB,CAIzB;IAEF,OAAO,CAAC,sBAAsB,CAY5B;IAEF,OAAO,CAAC,SAAS,CAEf;IAEF,OAAO,CAAC,GAAG;IAQX,OAAO,CAAC,aAAa,CAEnB;IAEF,OAAO,CAAC,OAAO;IAQf,OAAO,CAAC,SAAS;IAKD,iBAAiB;IAIjC,OAAO,CAAC,aAAa;IAKL,MAAM;IAwCtB,OAAO,CAAC,cAAc,CA0DpB;CAEH"}
+{"version":3,"file":"Calculator.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/Calculator.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAqB,YAAY,EAAE,kBAAkB,EAAc,MAAM,uBAAuB,CAAC;AACxG,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAsB,MAAM,oBAAoB,CAAC;AAQ1E,aAAa;AACb,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,oBAAoB;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mDAAmD;IACnD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,yDAAyD;IACzD,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,YAAY,CAAC;IAExB,2CAA2C;IAC3C,MAAM,EAAE,gBAAgB,CAAC;CAC1B;AAED,UAAU,eAAe;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,gBAAgB;AAChB,oBAAY,oBAAoB,GAAG,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;AAEnE,aAAa;AACb,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,EAAE,eAAe,CAAC;IACnF,OAAO,CAAC,QAAQ,CAAqC;IACrD,OAAO,CAAC,cAAc,CAAS;IAE/B,gBAAgB;IAChB,gBAAuB,YAAY,EAAE,oBAAoB,CAEvD;gBAEU,KAAK,EAAE,eAAe;IAYlC,OAAO,CAAC,mBAAmB,CAIzB;IAEF,OAAO,CAAC,sBAAsB,CAY5B;IAEF,OAAO,CAAC,SAAS,CAEf;IAEF,OAAO,CAAC,GAAG;IAQX,OAAO,CAAC,aAAa,CAEnB;IAEF,OAAO,CAAC,OAAO;IAQf,OAAO,CAAC,SAAS;IAKD,iBAAiB;IAIjC,OAAO,CAAC,aAAa;IAKL,MAAM;IAwCtB,OAAO,CAAC,cAAc,CA0DpB;CAEH"}

package/lib/esm/appui-react/accudraw/Calculator.js

@@ -13,6 +13,7 @@ import { Icon, IconInput } from "@itwin/core-react";
 import { Button, Input } from "@itwin/itwinui-react";
 import { CalculatorEngine, CalculatorOperator } from "./CalculatorEngine";
 import { SquareButton } from "./SquareButton";
+import { SvgCheckmark, SvgRemove } from "@itwin/itwinui-icons-react";
 import backspaceIcon from "./backspace.svg";
 /** @alpha */
 export class Calculator extends React.PureComponent {
@@ -147,9 +148,9 @@ export class Calculator extends React.PureComponent {
             React.createElement(CalculatorKeyPad, { onValueClick: this._onValueButtonClick, onOperatorClick: this._onOperatorButtonClick }),
             React.createElement("div", { className: "uifw-calculator-bottom-buttons" },
                 React.createElement(Button, { className: classnames("uifw-calculator-large-button", "uifw-calculator-ok-button"), styleType: "cta", onClick: this._handleOk },
-                    React.createElement(Icon, { iconSpec: "icon-checkmark" })),
+                    React.createElement(Icon, { iconSpec: React.createElement(SvgCheckmark, null) })),
                 React.createElement(Button, { className: classnames("uifw-calculator-large-button", "uifw-calculator-cancel-button"), onClick: this._handleCancel },
-                    React.createElement(Icon, { iconSpec: "icon-remove" })))));
+                    React.createElement(Icon, { iconSpec: React.createElement(SvgRemove, null) })))));
     }
 }
 /** @internal */

package/lib/esm/appui-react/accudraw/Calculator.js.map

@@ -1 +1 @@
-{"version":3,"file":"Calculator.js","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/Calculator.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAoC,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACxG,OAAO,EAAe,IAAI,EAAE,SAAS,EAAQ,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AAEjE,OAAO,aAAa,MAAM,iBAAiB,CAAC;AA0B5C,aAAa;AACb,MAAM,OAAO,UAAW,SAAQ,KAAK,CAAC,aAA+C;IASnF,YAAY,KAAsB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QATP,aAAQ,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;QAC7C,mBAAc,GAAG,KAAK,CAAC;QAmBvB,wBAAmB,GAAG,CAAC,OAAe,EAAE,EAAE;YAChD,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;YAC7D,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC,CAAC;QAClC,CAAC,CAAC;QAEM,2BAAsB,GAAG,CAAC,QAA4B,EAAE,EAAE;YAChE,IAAI,QAAQ,KAAK,kBAAkB,CAAC,KAAK,IAAI,IAAI,CAAC,cAAc;gBAC9D,QAAQ,GAAG,kBAAkB,CAAC,QAAQ,CAAC;YAEzC,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;YACjE,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC,CAAC;YAEhC,IAAI,QAAQ,KAAK,kBAAkB,CAAC,MAAM;gBACxC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;iBACxB,IAAI,QAAQ,KAAK,kBAAkB,CAAC,QAAQ;gBAC/C,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAChC,CAAC,CAAC;QAEM,cAAS,GAAG,CAAC,MAAwB,EAAQ,EAAE;YACrD,IAAI,CAAC,GAAG,EAAE,CAAC;QACb,CAAC,CAAC;QAUM,kBAAa,GAAG,CAAC,MAAwB,EAAQ,EAAE;YACzD,IAAI,CAAC,OAAO,EAAE,CAAC;QACjB,CAAC,CAAC;QAgEM,mBAAc,GAAG,CAAC,KAA0C,EAAQ,EAAE;YAC5E,QAAQ,KAAK,CAAC,GAAG,EAAE;gBACjB,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG;oBACN,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;oBACpC,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG;oBACN,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;oBACzD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,KAAK;oBACnB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;oBACtD,MAAM;gBACR,KAAK,UAAU,CAAC,MAAM;oBACpB,IAAI,CAAC,OAAO,EAAE,CAAC;oBACf,MAAM;gBACR,KAAK,UAAU,CAAC,SAAS;oBACvB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC;oBAC1D,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,MAAM;oBACpB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;oBACvD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,QAAQ;oBACtB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;oBACzD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,QAAQ;oBACtB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;oBACzD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,GAAG;oBACjB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC;oBACpD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,OAAO;oBACrB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;oBACxD,MAAM;gBACR,KAAK,GAAG;oBACN,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;oBACvD,MAAM;gBACR,KAAK,UAAU,CAAC,KAAK;oBACnB,IAAI,CAAC,IAAI,CAAC,cAAc;wBACtB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;oBACzD,IAAI,CAAC,GAAG,EAAE,CAAC;oBACX,MAAM;aACT;QACH,CAAC,CAAC;QArKA,IAAI,YAAY,GAAG,GAAG,CAAC;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY;YACzB,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEpF,IAAI,CAAC,KAAK,GAAG;YACX,YAAY;SACb,CAAC;IACJ,CAAC;IA0BO,GAAG;QACT,uBAAuB;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;YACnB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;SAC3C;QACD,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAMO,OAAO;QACb,uBAAuB;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;YACvB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;SACvB;QACD,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAEO,SAAS;QACf,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;QAC7B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IAC9B,CAAC;IAEe,iBAAiB;QAC/B,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAEO,aAAa;QACnB,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO;YACvB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAClC,CAAC;IAEe,MAAM;QACpB,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAE9I,MAAM,UAAU,GAAG,UAAU,CAC3B,iBAAiB,EACjB,SAAS,CACV,CAAC;QAEF,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;YACxC,oBAAC,SAAS,IAAC,kBAAkB,EAAC,2BAA2B,EACvD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,GAAI,CAAC,CAAC;YACnF,oBAAC,KAAK,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAC,OAAO,GAAG,CAAC;QAEzE,OAAO;QACL,iEAAiE;QACjE,mEAAmE;QACnE,gCAAS,KAAK,EAAE,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc;YACrG,6BAAK,SAAS,EAAC,qBAAqB,IACjC,UAAU,CACP;YACN,oBAAC,gBAAgB,IAAC,YAAY,EAAE,IAAI,CAAC,mBAAmB,EAAE,eAAe,EAAE,IAAI,CAAC,sBAAsB,GAAI;YAC1G,6BAAK,SAAS,EAAC,gCAAgC;gBAC7C,oBAAC,MAAM,IACL,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,2BAA2B,CAAC,EAClF,SAAS,EAAC,KAAK,EACf,OAAO,EAAE,IAAI,CAAC,SAAS;oBAEvB,oBAAC,IAAI,IAAC,QAAQ,EAAC,gBAAgB,GAAG,CAC3B;gBACT,oBAAC,MAAM,IACL,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,+BAA+B,CAAC,EACtF,OAAO,EAAE,IAAI,CAAC,aAAa;oBAE3B,oBAAC,IAAI,IAAC,QAAQ,EAAC,aAAa,GAAG,CACxB,CACL,CACF,CACP,CAAC;IACJ,CAAC;;AAjHD,gBAAgB;AACO,uBAAY,GAAyB;IAC1D,MAAM,EAAE,IAAI,gBAAgB,EAAE;CAC/B,CAAC;AAqLJ,MAAM,gBAAiB,SAAQ,KAAK,CAAC,aAAoC;IACvD,MAAM;QACpB,MAAM,QAAQ,GAAG,iBAAiB,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC;QAE7E,OAAO,CACL,6BAAK,SAAS,EAAE,UAAU,CAAC,6BAA6B,CAAC;YACvD,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,SAAqB;YAC/G,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,QAAoB;YAC3G,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,SAAS,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe;gBACzF,6BAAK,SAAS,EAAC,4BAA4B;oBACzC,oBAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,GAAI,CACxB,CACS;YACjB,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACtF,SAAS,EAAC,4BAA4B,aAA0B;YAElE,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACxF,SAAS,EAAC,4BAA4B,aAAyB;YAEjE,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACxF,SAAS,EAAC,4BAA4B,aAAyB;YAEjE,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,GAAG,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACnF,SAAS,EAAC,4BAA4B,QAAuB;YAE/D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACtF,SAAS,EAAC,4BAA4B,aAA0B;YAClE,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACvF,SAAS,EAAC,4BAA4B,QAAmB;YAC3D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACtF,SAAS,EAAC,4BAA4B,QAAuB;YAC/D,iCAAQ,CACJ,CACP,CAAC;IACJ,CAAC;CACF;AASD,MAAM,WAAY,SAAQ,KAAK,CAAC,aAA+B;IAA/D;;QAEU,mBAAc,GAAG,CAAC,MAAuD,EAAE,EAAE;YACnF,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACzC,CAAC,CAAC;IAgBJ,CAAC;IAdiB,MAAM;QACpB,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAEtH,MAAM,cAAc,GAAG,UAAU,CAC/B,sBAAsB,EACtB,SAAS,CACV,CAAC;QAEF,OAAO,CACL,oBAAC,YAAY,OAAK,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,IAC7E,OAAO,CACM,CACjB,CAAC;IACJ,CAAC;CACF;AASD,MAAM,cAAe,SAAQ,KAAK,CAAC,aAAkC;IAArE;;QAEU,mBAAc,GAAG,CAAC,MAAuD,EAAE,EAAE;YACnF,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC1C,CAAC,CAAC;IAgBJ,CAAC;IAdiB,MAAM;QACpB,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAEjI,MAAM,cAAc,GAAG,UAAU,CAC/B,sBAAsB,EACtB,SAAS,CACV,CAAC;QAEF,OAAO,CACL,oBAAC,YAAY,OAAK,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,IAC7E,QAAQ,CACI,CAChB,CAAC;IACJ,CAAC;CACF","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 AccuDraw\r\n */\r\n\r\nimport \"./Calculator.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { IconSpecUtilities, OnCancelFunc, OnNumberCommitFunc, SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { CommonProps, Icon, IconInput, Omit } from \"@itwin/core-react\";\r\nimport { Button, Input } from \"@itwin/itwinui-react\";\r\nimport { CalculatorEngine, CalculatorOperator } from \"./CalculatorEngine\";\r\nimport { SquareButton, SquareButtonProps } from \"./SquareButton\";\r\n\r\nimport backspaceIcon from \"./backspace.svg\";\r\n\r\n// cSpell:ignore plusmn\r\n\r\n/** @alpha */\r\nexport interface CalculatorProps extends CommonProps {\r\n  /** Initial value */\r\n  initialValue?: number;\r\n  /** Icon to display beside the calculated result */\r\n  resultIcon?: React.ReactNode;\r\n  /** A function to be run when the OK button is clicked */\r\n  onOk?: OnNumberCommitFunc;\r\n  /** A function to be run when the Cancel button is clicked */\r\n  onCancel?: OnCancelFunc;\r\n\r\n  /** @internal  Calculator state machine. */\r\n  engine: CalculatorEngine;\r\n}\r\n\r\ninterface CalculatorState {\r\n  displayValue: string;\r\n}\r\n\r\n/** @internal */\r\nexport type CalculatorPropsProps = Pick<CalculatorProps, \"engine\">;\r\n\r\n/** @alpha */\r\nexport class Calculator extends React.PureComponent<CalculatorProps, CalculatorState> {\r\n  private _mainDiv = React.createRef<HTMLDivElement>();\r\n  private _equalsClicked = false;\r\n\r\n  /** @internal */\r\n  public static readonly defaultProps: CalculatorPropsProps = {\r\n    engine: new CalculatorEngine(),\r\n  };\r\n\r\n  constructor(props: CalculatorProps) {\r\n    super(props);\r\n\r\n    let displayValue = \"0\";\r\n    if (this.props.initialValue)\r\n      displayValue = this.props.engine.processValue(this.props.initialValue.toString());\r\n\r\n    this.state = {\r\n      displayValue,\r\n    };\r\n  }\r\n\r\n  private _onValueButtonClick = (keyChar: string) => {\r\n    const displayValue = this.props.engine.processValue(keyChar);\r\n    this._mainDivFocus();\r\n    this.setState({ displayValue });\r\n  };\r\n\r\n  private _onOperatorButtonClick = (operator: CalculatorOperator) => {\r\n    if (operator === CalculatorOperator.Clear && this._equalsClicked)\r\n      operator = CalculatorOperator.ClearAll;\r\n\r\n    const displayValue = this.props.engine.processOperator(operator);\r\n    this._mainDivFocus();\r\n    this.setState({ displayValue });\r\n\r\n    if (operator === CalculatorOperator.Equals)\r\n      this._equalsClicked = true;\r\n    else if (operator === CalculatorOperator.ClearAll)\r\n      this._equalsClicked = false;\r\n  };\r\n\r\n  private _handleOk = (_event: React.MouseEvent): void => {\r\n    this._ok();\r\n  };\r\n\r\n  private _ok() {\r\n    // istanbul ignore else\r\n    if (this.props.onOk) {\r\n      this.props.onOk(this.props.engine.result);\r\n    }\r\n    this._clearAll();\r\n  }\r\n\r\n  private _handleCancel = (_event: React.MouseEvent): void => {\r\n    this._cancel();\r\n  };\r\n\r\n  private _cancel() {\r\n    // istanbul ignore else\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel();\r\n    }\r\n    this._clearAll();\r\n  }\r\n\r\n  private _clearAll() {\r\n    this.props.engine.clearAll();\r\n    this._equalsClicked = false;\r\n  }\r\n\r\n  public override componentDidMount() {\r\n    this._mainDivFocus();\r\n  }\r\n\r\n  private _mainDivFocus() {\r\n    if (this._mainDiv.current)\r\n      this._mainDiv.current.focus();\r\n  }\r\n\r\n  public override render() {\r\n    const { className, resultIcon, onOk, onCancel, initialValue, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const classNames = classnames(\r\n      \"uifw-calculator\",\r\n      className,\r\n    );\r\n\r\n    const topSection = this.props.resultIcon ?\r\n      <IconInput containerClassName=\"uifw-calculator-top-input\"\r\n        value={this.state.displayValue} readOnly={true} icon={this.props.resultIcon} /> :\r\n      <Input value={this.state.displayValue} readOnly={true} size=\"small\" />;\r\n\r\n    return (\r\n      // The event handler is only being used to capture bubbled events\r\n      // eslint-disable-next-line jsx-a11y/no-static-element-interactions\r\n      <div {...props} ref={this._mainDiv} tabIndex={-1} className={classNames} onKeyDown={this._handleKeyDown}>\r\n        <div className=\"uifw-calculator-top\">\r\n          {topSection}\r\n        </div>\r\n        <CalculatorKeyPad onValueClick={this._onValueButtonClick} onOperatorClick={this._onOperatorButtonClick} />\r\n        <div className=\"uifw-calculator-bottom-buttons\">\r\n          <Button\r\n            className={classnames(\"uifw-calculator-large-button\", \"uifw-calculator-ok-button\")}\r\n            styleType=\"cta\"\r\n            onClick={this._handleOk}\r\n          >\r\n            <Icon iconSpec=\"icon-checkmark\" />\r\n          </Button>\r\n          <Button\r\n            className={classnames(\"uifw-calculator-large-button\", \"uifw-calculator-cancel-button\")}\r\n            onClick={this._handleCancel}\r\n          >\r\n            <Icon iconSpec=\"icon-remove\" />\r\n          </Button>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private _handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\r\n    switch (event.key) {\r\n      case \"0\":\r\n      case \"1\":\r\n      case \"2\":\r\n      case \"3\":\r\n      case \"4\":\r\n      case \"5\":\r\n      case \"6\":\r\n      case \"7\":\r\n      case \"8\":\r\n      case \"9\":\r\n        this._onValueButtonClick(event.key);\r\n        break;\r\n      case \"a\":\r\n      case \"A\":\r\n        this._onOperatorButtonClick(CalculatorOperator.ClearAll);\r\n        break;\r\n      case \"c\":\r\n      case \"C\":\r\n      case SpecialKey.Clear:\r\n        this._onOperatorButtonClick(CalculatorOperator.Clear);\r\n        break;\r\n      case SpecialKey.Escape:\r\n        this._cancel();\r\n        break;\r\n      case SpecialKey.Backspace:\r\n        this._onOperatorButtonClick(CalculatorOperator.Backspace);\r\n        break;\r\n      case \"/\":\r\n      case SpecialKey.Divide:\r\n        this._onOperatorButtonClick(CalculatorOperator.Divide);\r\n        break;\r\n      case \"*\":\r\n      case SpecialKey.Multiply:\r\n        this._onOperatorButtonClick(CalculatorOperator.Multiply);\r\n        break;\r\n      case \"-\":\r\n      case SpecialKey.Subtract:\r\n        this._onOperatorButtonClick(CalculatorOperator.Subtract);\r\n        break;\r\n      case \"+\":\r\n      case SpecialKey.Add:\r\n        this._onOperatorButtonClick(CalculatorOperator.Add);\r\n        break;\r\n      case \".\":\r\n      case SpecialKey.Decimal:\r\n        this._onOperatorButtonClick(CalculatorOperator.Decimal);\r\n        break;\r\n      case \"=\":\r\n        this._onOperatorButtonClick(CalculatorOperator.Equals);\r\n        break;\r\n      case SpecialKey.Enter:\r\n        if (!this._equalsClicked)\r\n          this._onOperatorButtonClick(CalculatorOperator.Equals);\r\n        this._ok();\r\n        break;\r\n    }\r\n  };\r\n\r\n}\r\n\r\ninterface CalculatorKeyPadProps extends CommonProps {\r\n  /** A function to be run when a value is clicked */\r\n  onValueClick: (key: string) => void;\r\n  /** A function to be run when a value is clicked */\r\n  onOperatorClick: (operator: CalculatorOperator) => void;\r\n}\r\n\r\nclass CalculatorKeyPad extends React.PureComponent<CalculatorKeyPadProps> {\r\n  public override render() {\r\n    const iconSpec = IconSpecUtilities.createWebComponentIconSpec(backspaceIcon);\r\n\r\n    return (\r\n      <div className={classnames(\"uifw-calculator-button-grid\")}>\r\n        <OperatorButton operator={CalculatorOperator.ClearAll} onClick={this.props.onOperatorClick}>AC</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Clear} onClick={this.props.onOperatorClick}>C</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Backspace} onClick={this.props.onOperatorClick}>\r\n          <div className=\"uifw-calculator-button-svg\">\r\n            <Icon iconSpec={iconSpec} />\r\n          </div>\r\n        </OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Divide} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&divide;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"7\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"8\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"9\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.Multiply} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&times;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"4\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"5\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"6\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.Subtract} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&minus;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"1\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"2\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"3\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.Add} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&#43;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"0\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.NegPos} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&plusmn;</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Decimal} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">.</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Equals} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&#61;</OperatorButton>\r\n        <span />\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\ninterface ValueButtonProps extends Omit<SquareButtonProps, \"onClick\"> {\r\n  /** Key to display */\r\n  keyChar: string;\r\n  /** A function to be run when the element is clicked */\r\n  onClick: (key: string) => void;\r\n}\r\n\r\nclass ValueButton extends React.PureComponent<ValueButtonProps> {\r\n\r\n  private _handleOnClick = (_event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\r\n    this.props.onClick(this.props.keyChar);\r\n  };\r\n\r\n  public override render() {\r\n    const { className, keyChar, onClick, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const itemClassNames = classnames(\r\n      \"uifw-calculator-item\",\r\n      className,\r\n    );\r\n\r\n    return (\r\n      <SquareButton {...props} className={itemClassNames} onClick={this._handleOnClick} >\r\n        {keyChar}\r\n      </SquareButton >\r\n    );\r\n  }\r\n}\r\n\r\ninterface OperatorButtonProps extends Omit<SquareButtonProps, \"onClick\"> {\r\n  /** Key to display */\r\n  operator: CalculatorOperator;\r\n  /** A function to be run when the element is clicked */\r\n  onClick: (operator: CalculatorOperator) => void;\r\n}\r\n\r\nclass OperatorButton extends React.PureComponent<OperatorButtonProps> {\r\n\r\n  private _handleOnClick = (_event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\r\n    this.props.onClick(this.props.operator);\r\n  };\r\n\r\n  public override render() {\r\n    const { className, children, operator, onClick, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const itemClassNames = classnames(\r\n      \"uifw-calculator-item\",\r\n      className,\r\n    );\r\n\r\n    return (\r\n      <SquareButton {...props} className={itemClassNames} onClick={this._handleOnClick}>\r\n        {children}\r\n      </SquareButton>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"Calculator.js","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/Calculator.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAoC,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACxG,OAAO,EAAe,IAAI,EAAE,SAAS,EAAQ,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAErE,OAAO,aAAa,MAAM,iBAAiB,CAAC;AA0B5C,aAAa;AACb,MAAM,OAAO,UAAW,SAAQ,KAAK,CAAC,aAA+C;IASnF,YAAY,KAAsB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QATP,aAAQ,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;QAC7C,mBAAc,GAAG,KAAK,CAAC;QAmBvB,wBAAmB,GAAG,CAAC,OAAe,EAAE,EAAE;YAChD,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;YAC7D,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC,CAAC;QAClC,CAAC,CAAC;QAEM,2BAAsB,GAAG,CAAC,QAA4B,EAAE,EAAE;YAChE,IAAI,QAAQ,KAAK,kBAAkB,CAAC,KAAK,IAAI,IAAI,CAAC,cAAc;gBAC9D,QAAQ,GAAG,kBAAkB,CAAC,QAAQ,CAAC;YAEzC,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;YACjE,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC,CAAC;YAEhC,IAAI,QAAQ,KAAK,kBAAkB,CAAC,MAAM;gBACxC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;iBACxB,IAAI,QAAQ,KAAK,kBAAkB,CAAC,QAAQ;gBAC/C,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAChC,CAAC,CAAC;QAEM,cAAS,GAAG,CAAC,MAAwB,EAAQ,EAAE;YACrD,IAAI,CAAC,GAAG,EAAE,CAAC;QACb,CAAC,CAAC;QAUM,kBAAa,GAAG,CAAC,MAAwB,EAAQ,EAAE;YACzD,IAAI,CAAC,OAAO,EAAE,CAAC;QACjB,CAAC,CAAC;QAgEM,mBAAc,GAAG,CAAC,KAA0C,EAAQ,EAAE;YAC5E,QAAQ,KAAK,CAAC,GAAG,EAAE;gBACjB,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG;oBACN,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;oBACpC,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG;oBACN,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;oBACzD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,KAAK;oBACnB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;oBACtD,MAAM;gBACR,KAAK,UAAU,CAAC,MAAM;oBACpB,IAAI,CAAC,OAAO,EAAE,CAAC;oBACf,MAAM;gBACR,KAAK,UAAU,CAAC,SAAS;oBACvB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC;oBAC1D,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,MAAM;oBACpB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;oBACvD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,QAAQ;oBACtB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;oBACzD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,QAAQ;oBACtB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;oBACzD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,GAAG;oBACjB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC;oBACpD,MAAM;gBACR,KAAK,GAAG,CAAC;gBACT,KAAK,UAAU,CAAC,OAAO;oBACrB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;oBACxD,MAAM;gBACR,KAAK,GAAG;oBACN,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;oBACvD,MAAM;gBACR,KAAK,UAAU,CAAC,KAAK;oBACnB,IAAI,CAAC,IAAI,CAAC,cAAc;wBACtB,IAAI,CAAC,sBAAsB,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;oBACzD,IAAI,CAAC,GAAG,EAAE,CAAC;oBACX,MAAM;aACT;QACH,CAAC,CAAC;QArKA,IAAI,YAAY,GAAG,GAAG,CAAC;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY;YACzB,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEpF,IAAI,CAAC,KAAK,GAAG;YACX,YAAY;SACb,CAAC;IACJ,CAAC;IA0BO,GAAG;QACT,uBAAuB;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;YACnB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;SAC3C;QACD,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAMO,OAAO;QACb,uBAAuB;QACvB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;YACvB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;SACvB;QACD,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAEO,SAAS;QACf,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;QAC7B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IAC9B,CAAC;IAEe,iBAAiB;QAC/B,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAEO,aAAa;QACnB,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO;YACvB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAClC,CAAC;IAEe,MAAM;QACpB,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAE9I,MAAM,UAAU,GAAG,UAAU,CAC3B,iBAAiB,EACjB,SAAS,CACV,CAAC;QAEF,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;YACxC,oBAAC,SAAS,IAAC,kBAAkB,EAAC,2BAA2B,EACvD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,GAAI,CAAC,CAAC;YACnF,oBAAC,KAAK,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAC,OAAO,GAAG,CAAC;QAEzE,OAAO;QACL,iEAAiE;QACjE,mEAAmE;QACnE,gCAAS,KAAK,EAAE,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc;YACrG,6BAAK,SAAS,EAAC,qBAAqB,IACjC,UAAU,CACP;YACN,oBAAC,gBAAgB,IAAC,YAAY,EAAE,IAAI,CAAC,mBAAmB,EAAE,eAAe,EAAE,IAAI,CAAC,sBAAsB,GAAI;YAC1G,6BAAK,SAAS,EAAC,gCAAgC;gBAC7C,oBAAC,MAAM,IACL,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,2BAA2B,CAAC,EAClF,SAAS,EAAC,KAAK,EACf,OAAO,EAAE,IAAI,CAAC,SAAS;oBAEvB,oBAAC,IAAI,IAAC,QAAQ,EAAE,oBAAC,YAAY,OAAG,GAAI,CAC7B;gBACT,oBAAC,MAAM,IACL,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,+BAA+B,CAAC,EACtF,OAAO,EAAE,IAAI,CAAC,aAAa;oBAE3B,oBAAC,IAAI,IAAC,QAAQ,EAAE,oBAAC,SAAS,OAAG,GAAI,CAC1B,CACL,CACF,CACP,CAAC;IACJ,CAAC;;AAjHD,gBAAgB;AACO,uBAAY,GAAyB;IAC1D,MAAM,EAAE,IAAI,gBAAgB,EAAE;CAC/B,CAAC;AAqLJ,MAAM,gBAAiB,SAAQ,KAAK,CAAC,aAAoC;IACvD,MAAM;QACpB,MAAM,QAAQ,GAAG,iBAAiB,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC;QAE7E,OAAO,CACL,6BAAK,SAAS,EAAE,UAAU,CAAC,6BAA6B,CAAC;YACvD,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,SAAqB;YAC/G,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,QAAoB;YAC3G,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,SAAS,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe;gBACzF,6BAAK,SAAS,EAAC,4BAA4B;oBACzC,oBAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,GAAI,CACxB,CACS;YACjB,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACtF,SAAS,EAAC,4BAA4B,aAA0B;YAElE,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACxF,SAAS,EAAC,4BAA4B,aAAyB;YAEjE,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACxF,SAAS,EAAC,4BAA4B,aAAyB;YAEjE,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,GAAG,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACnF,SAAS,EAAC,4BAA4B,QAAuB;YAE/D,oBAAC,WAAW,IAAC,OAAO,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,GAAI;YAC7D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACtF,SAAS,EAAC,4BAA4B,aAA0B;YAClE,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACvF,SAAS,EAAC,4BAA4B,QAAmB;YAC3D,oBAAC,cAAc,IAAC,QAAQ,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,eAAe,EACtF,SAAS,EAAC,4BAA4B,QAAuB;YAC/D,iCAAQ,CACJ,CACP,CAAC;IACJ,CAAC;CACF;AASD,MAAM,WAAY,SAAQ,KAAK,CAAC,aAA+B;IAA/D;;QAEU,mBAAc,GAAG,CAAC,MAAuD,EAAE,EAAE;YACnF,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACzC,CAAC,CAAC;IAgBJ,CAAC;IAdiB,MAAM;QACpB,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAEtH,MAAM,cAAc,GAAG,UAAU,CAC/B,sBAAsB,EACtB,SAAS,CACV,CAAC;QAEF,OAAO,CACL,oBAAC,YAAY,OAAK,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,IAC7E,OAAO,CACM,CACjB,CAAC;IACJ,CAAC;CACF;AASD,MAAM,cAAe,SAAQ,KAAK,CAAC,aAAkC;IAArE;;QAEU,mBAAc,GAAG,CAAC,MAAuD,EAAE,EAAE;YACnF,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC1C,CAAC,CAAC;IAgBJ,CAAC;IAdiB,MAAM;QACpB,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAEjI,MAAM,cAAc,GAAG,UAAU,CAC/B,sBAAsB,EACtB,SAAS,CACV,CAAC;QAEF,OAAO,CACL,oBAAC,YAAY,OAAK,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,IAC7E,QAAQ,CACI,CAChB,CAAC;IACJ,CAAC;CACF","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 AccuDraw\r\n */\r\n\r\nimport \"./Calculator.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { IconSpecUtilities, OnCancelFunc, OnNumberCommitFunc, SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { CommonProps, Icon, IconInput, Omit } from \"@itwin/core-react\";\r\nimport { Button, Input } from \"@itwin/itwinui-react\";\r\nimport { CalculatorEngine, CalculatorOperator } from \"./CalculatorEngine\";\r\nimport { SquareButton, SquareButtonProps } from \"./SquareButton\";\r\nimport { SvgCheckmark, SvgRemove } from \"@itwin/itwinui-icons-react\";\r\n\r\nimport backspaceIcon from \"./backspace.svg\";\r\n\r\n// cSpell:ignore plusmn\r\n\r\n/** @alpha */\r\nexport interface CalculatorProps extends CommonProps {\r\n  /** Initial value */\r\n  initialValue?: number;\r\n  /** Icon to display beside the calculated result */\r\n  resultIcon?: React.ReactNode;\r\n  /** A function to be run when the OK button is clicked */\r\n  onOk?: OnNumberCommitFunc;\r\n  /** A function to be run when the Cancel button is clicked */\r\n  onCancel?: OnCancelFunc;\r\n\r\n  /** @internal  Calculator state machine. */\r\n  engine: CalculatorEngine;\r\n}\r\n\r\ninterface CalculatorState {\r\n  displayValue: string;\r\n}\r\n\r\n/** @internal */\r\nexport type CalculatorPropsProps = Pick<CalculatorProps, \"engine\">;\r\n\r\n/** @alpha */\r\nexport class Calculator extends React.PureComponent<CalculatorProps, CalculatorState> {\r\n  private _mainDiv = React.createRef<HTMLDivElement>();\r\n  private _equalsClicked = false;\r\n\r\n  /** @internal */\r\n  public static readonly defaultProps: CalculatorPropsProps = {\r\n    engine: new CalculatorEngine(),\r\n  };\r\n\r\n  constructor(props: CalculatorProps) {\r\n    super(props);\r\n\r\n    let displayValue = \"0\";\r\n    if (this.props.initialValue)\r\n      displayValue = this.props.engine.processValue(this.props.initialValue.toString());\r\n\r\n    this.state = {\r\n      displayValue,\r\n    };\r\n  }\r\n\r\n  private _onValueButtonClick = (keyChar: string) => {\r\n    const displayValue = this.props.engine.processValue(keyChar);\r\n    this._mainDivFocus();\r\n    this.setState({ displayValue });\r\n  };\r\n\r\n  private _onOperatorButtonClick = (operator: CalculatorOperator) => {\r\n    if (operator === CalculatorOperator.Clear && this._equalsClicked)\r\n      operator = CalculatorOperator.ClearAll;\r\n\r\n    const displayValue = this.props.engine.processOperator(operator);\r\n    this._mainDivFocus();\r\n    this.setState({ displayValue });\r\n\r\n    if (operator === CalculatorOperator.Equals)\r\n      this._equalsClicked = true;\r\n    else if (operator === CalculatorOperator.ClearAll)\r\n      this._equalsClicked = false;\r\n  };\r\n\r\n  private _handleOk = (_event: React.MouseEvent): void => {\r\n    this._ok();\r\n  };\r\n\r\n  private _ok() {\r\n    // istanbul ignore else\r\n    if (this.props.onOk) {\r\n      this.props.onOk(this.props.engine.result);\r\n    }\r\n    this._clearAll();\r\n  }\r\n\r\n  private _handleCancel = (_event: React.MouseEvent): void => {\r\n    this._cancel();\r\n  };\r\n\r\n  private _cancel() {\r\n    // istanbul ignore else\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel();\r\n    }\r\n    this._clearAll();\r\n  }\r\n\r\n  private _clearAll() {\r\n    this.props.engine.clearAll();\r\n    this._equalsClicked = false;\r\n  }\r\n\r\n  public override componentDidMount() {\r\n    this._mainDivFocus();\r\n  }\r\n\r\n  private _mainDivFocus() {\r\n    if (this._mainDiv.current)\r\n      this._mainDiv.current.focus();\r\n  }\r\n\r\n  public override render() {\r\n    const { className, resultIcon, onOk, onCancel, initialValue, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const classNames = classnames(\r\n      \"uifw-calculator\",\r\n      className,\r\n    );\r\n\r\n    const topSection = this.props.resultIcon ?\r\n      <IconInput containerClassName=\"uifw-calculator-top-input\"\r\n        value={this.state.displayValue} readOnly={true} icon={this.props.resultIcon} /> :\r\n      <Input value={this.state.displayValue} readOnly={true} size=\"small\" />;\r\n\r\n    return (\r\n      // The event handler is only being used to capture bubbled events\r\n      // eslint-disable-next-line jsx-a11y/no-static-element-interactions\r\n      <div {...props} ref={this._mainDiv} tabIndex={-1} className={classNames} onKeyDown={this._handleKeyDown}>\r\n        <div className=\"uifw-calculator-top\">\r\n          {topSection}\r\n        </div>\r\n        <CalculatorKeyPad onValueClick={this._onValueButtonClick} onOperatorClick={this._onOperatorButtonClick} />\r\n        <div className=\"uifw-calculator-bottom-buttons\">\r\n          <Button\r\n            className={classnames(\"uifw-calculator-large-button\", \"uifw-calculator-ok-button\")}\r\n            styleType=\"cta\"\r\n            onClick={this._handleOk}\r\n          >\r\n            <Icon iconSpec={<SvgCheckmark />} />\r\n          </Button>\r\n          <Button\r\n            className={classnames(\"uifw-calculator-large-button\", \"uifw-calculator-cancel-button\")}\r\n            onClick={this._handleCancel}\r\n          >\r\n            <Icon iconSpec={<SvgRemove />} />\r\n          </Button>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private _handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\r\n    switch (event.key) {\r\n      case \"0\":\r\n      case \"1\":\r\n      case \"2\":\r\n      case \"3\":\r\n      case \"4\":\r\n      case \"5\":\r\n      case \"6\":\r\n      case \"7\":\r\n      case \"8\":\r\n      case \"9\":\r\n        this._onValueButtonClick(event.key);\r\n        break;\r\n      case \"a\":\r\n      case \"A\":\r\n        this._onOperatorButtonClick(CalculatorOperator.ClearAll);\r\n        break;\r\n      case \"c\":\r\n      case \"C\":\r\n      case SpecialKey.Clear:\r\n        this._onOperatorButtonClick(CalculatorOperator.Clear);\r\n        break;\r\n      case SpecialKey.Escape:\r\n        this._cancel();\r\n        break;\r\n      case SpecialKey.Backspace:\r\n        this._onOperatorButtonClick(CalculatorOperator.Backspace);\r\n        break;\r\n      case \"/\":\r\n      case SpecialKey.Divide:\r\n        this._onOperatorButtonClick(CalculatorOperator.Divide);\r\n        break;\r\n      case \"*\":\r\n      case SpecialKey.Multiply:\r\n        this._onOperatorButtonClick(CalculatorOperator.Multiply);\r\n        break;\r\n      case \"-\":\r\n      case SpecialKey.Subtract:\r\n        this._onOperatorButtonClick(CalculatorOperator.Subtract);\r\n        break;\r\n      case \"+\":\r\n      case SpecialKey.Add:\r\n        this._onOperatorButtonClick(CalculatorOperator.Add);\r\n        break;\r\n      case \".\":\r\n      case SpecialKey.Decimal:\r\n        this._onOperatorButtonClick(CalculatorOperator.Decimal);\r\n        break;\r\n      case \"=\":\r\n        this._onOperatorButtonClick(CalculatorOperator.Equals);\r\n        break;\r\n      case SpecialKey.Enter:\r\n        if (!this._equalsClicked)\r\n          this._onOperatorButtonClick(CalculatorOperator.Equals);\r\n        this._ok();\r\n        break;\r\n    }\r\n  };\r\n\r\n}\r\n\r\ninterface CalculatorKeyPadProps extends CommonProps {\r\n  /** A function to be run when a value is clicked */\r\n  onValueClick: (key: string) => void;\r\n  /** A function to be run when a value is clicked */\r\n  onOperatorClick: (operator: CalculatorOperator) => void;\r\n}\r\n\r\nclass CalculatorKeyPad extends React.PureComponent<CalculatorKeyPadProps> {\r\n  public override render() {\r\n    const iconSpec = IconSpecUtilities.createWebComponentIconSpec(backspaceIcon);\r\n\r\n    return (\r\n      <div className={classnames(\"uifw-calculator-button-grid\")}>\r\n        <OperatorButton operator={CalculatorOperator.ClearAll} onClick={this.props.onOperatorClick}>AC</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Clear} onClick={this.props.onOperatorClick}>C</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Backspace} onClick={this.props.onOperatorClick}>\r\n          <div className=\"uifw-calculator-button-svg\">\r\n            <Icon iconSpec={iconSpec} />\r\n          </div>\r\n        </OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Divide} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&divide;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"7\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"8\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"9\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.Multiply} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&times;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"4\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"5\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"6\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.Subtract} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&minus;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"1\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"2\" onClick={this.props.onValueClick} />\r\n        <ValueButton keyChar=\"3\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.Add} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&#43;</OperatorButton>\r\n\r\n        <ValueButton keyChar=\"0\" onClick={this.props.onValueClick} />\r\n        <OperatorButton operator={CalculatorOperator.NegPos} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&plusmn;</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Decimal} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">.</OperatorButton>\r\n        <OperatorButton operator={CalculatorOperator.Equals} onClick={this.props.onOperatorClick}\r\n          className=\"uifw-calculator-large-font\">&#61;</OperatorButton>\r\n        <span />\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\ninterface ValueButtonProps extends Omit<SquareButtonProps, \"onClick\"> {\r\n  /** Key to display */\r\n  keyChar: string;\r\n  /** A function to be run when the element is clicked */\r\n  onClick: (key: string) => void;\r\n}\r\n\r\nclass ValueButton extends React.PureComponent<ValueButtonProps> {\r\n\r\n  private _handleOnClick = (_event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\r\n    this.props.onClick(this.props.keyChar);\r\n  };\r\n\r\n  public override render() {\r\n    const { className, keyChar, onClick, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const itemClassNames = classnames(\r\n      \"uifw-calculator-item\",\r\n      className,\r\n    );\r\n\r\n    return (\r\n      <SquareButton {...props} className={itemClassNames} onClick={this._handleOnClick} >\r\n        {keyChar}\r\n      </SquareButton >\r\n    );\r\n  }\r\n}\r\n\r\ninterface OperatorButtonProps extends Omit<SquareButtonProps, \"onClick\"> {\r\n  /** Key to display */\r\n  operator: CalculatorOperator;\r\n  /** A function to be run when the element is clicked */\r\n  onClick: (operator: CalculatorOperator) => void;\r\n}\r\n\r\nclass OperatorButton extends React.PureComponent<OperatorButtonProps> {\r\n\r\n  private _handleOnClick = (_event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\r\n    this.props.onClick(this.props.operator);\r\n  };\r\n\r\n  public override render() {\r\n    const { className, children, operator, onClick, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const itemClassNames = classnames(\r\n      \"uifw-calculator-item\",\r\n      className,\r\n    );\r\n\r\n    return (\r\n      <SquareButton {...props} className={itemClassNames} onClick={this._handleOnClick}>\r\n        {children}\r\n      </SquareButton>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/esm/appui-react/accudraw/Calculator.scss

@@ -5,7 +5,7 @@
 @import "~@itwin/core-react/lib/cjs/core-react/style/index";
 
 $button-size: 36px;
-$button-operator-size: $button-size+10px;
+$button-operator-size: $button-size + 10px;
 
 .uifw-position-popup.uifw-calculator-host {
   background-color: $buic-background-window;
@@ -19,22 +19,22 @@ $button-operator-size: $button-size+10px;
     outline: 0px;
   }
 
-  >.uifw-calculator-top {
+  > .uifw-calculator-top {
     margin-bottom: 8px;
 
-    >.uifw-calculator-top-input {
+    > .uifw-calculator-top-input {
       width: 100%;
     }
 
     input {
       text-align: right;
-      color: $buic-text-color;
+      color: var(--iui-color-text);
       background-color: $buic-background-control;
       cursor: default;
     }
   }
 
-  >.uifw-calculator-button-grid {
+  > .uifw-calculator-button-grid {
     display: grid;
     grid-template-columns: $button-size $button-size $button-size $button-operator-size;
     grid-gap: 6px;
@@ -47,31 +47,29 @@ $button-operator-size: $button-size+10px;
     }
   }
 
-  >.uifw-calculator-bottom-buttons {
+  > .uifw-calculator-bottom-buttons {
     display: flex;
     justify-content: space-between;
     margin-top: 0;
 
-    >.uifw-calculator-large-button {
+    > .uifw-calculator-large-button {
       width: 70px;
       font-size: 20px;
     }
 
-    >.uifw-calculator-cancel-button {
-
+    > .uifw-calculator-cancel-button {
       &,
       &:active,
       &:focus {
         border: none;
-        background-color: $uicore-gray;
-        color: $uicore-white;
+        background-color: var(--iui-color-background-negative);
+        color: var(--iui-color-white);
       }
 
       &:hover {
-        background-color: $uicore-gray-5;
-        color: $uicore-white;
+        background-color: var(--iui-color-background-negative-hover);
+        color: var(--iui-color-white);
       }
-
     }
   }
 

package/lib/esm/appui-react/accudraw/MenuButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuButton.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/MenuButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAA2B,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAgB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEjE,aAAa;AACb,MAAM,WAAW,eAAgB,SAAQ,iBAAiB;IACxD,mBAAmB;IACnB,KAAK,EAAE,UAAU,CAAC;IAClB,0CAA0C;IAC1C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CACzC;AAED,gBAAgB;AAChB,UAAU,eAAe;IACvB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,aAAa;AACb,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,EAAE,eAAe,CAAC;IACnF,OAAO,CAAC,KAAK,CAA4B;gBAE7B,KAAK,EAAE,eAAe;IAQlB,MAAM;IA2BtB,OAAO,CAAC,SAAS;IAYjB,OAAO,CAAC,KAAK,CAQX;IAEF,OAAO,CAAC,YAAY,CAOlB;IAGF,OAAO,CAAC,YAAY,CAElB;CAEH"}
+{"version":3,"file":"MenuButton.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/MenuButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAA2B,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAgB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGjE,aAAa;AACb,MAAM,WAAW,eAAgB,SAAQ,iBAAiB;IACxD,mBAAmB;IACnB,KAAK,EAAE,UAAU,CAAC;IAClB,0CAA0C;IAC1C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CACzC;AAED,gBAAgB;AAChB,UAAU,eAAe;IACvB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,aAAa;AACb,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,EAAE,eAAe,CAAC;IACnF,OAAO,CAAC,KAAK,CAA4B;gBAE7B,KAAK,EAAE,eAAe;IAQlB,MAAM;IA2BtB,OAAO,CAAC,SAAS;IAYjB,OAAO,CAAC,KAAK,CAQX;IAEF,OAAO,CAAC,YAAY,CAOlB;IAGF,OAAO,CAAC,YAAY,CAElB;CAEH"}

package/lib/esm/appui-react/accudraw/MenuButton.js

@@ -9,6 +9,7 @@ import "./MenuButton.scss";
 import * as React from "react";
 import { ContextMenu, Icon, Size } from "@itwin/core-react";
 import { SquareButton } from "./SquareButton";
+import { SvgMore } from "@itwin/itwinui-icons-react";
 /** @alpha */
 export class MenuButton extends React.PureComponent {
     constructor(props) {
@@ -46,7 +47,7 @@ export class MenuButton extends React.PureComponent {
         };
         return (React.createElement("div", { className: "uifw-menu-button", style: divStyle, ref: (e) => this.setDivRef(e) },
             React.createElement(SquareButton, { ...buttonProps, className: className, style: style, onClick: this._handleClick },
-                React.createElement(Icon, { iconSpec: "icon-more-2" })),
+                React.createElement(Icon, { iconSpec: React.createElement(SvgMore, null) })),
             React.createElement(ContextMenu, { ref: (el) => { this._menu = el; }, selectedIndex: 0, onSelect: this._handleClose, onOutsideClick: this._handleClose, onEsc: this._handleClose, opened: this.state.expanded, autoflip: false }, this.props.children)));
     }
     setDivRef(div) {

package/lib/esm/appui-react/accudraw/MenuButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuButton.js","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/MenuButton.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\n/** @packageDocumentation\r\n * @module AccuDraw\r\n */\r\n\r\nimport \"./MenuButton.scss\";\r\nimport * as React from \"react\";\r\nimport { PointProps } from \"@itwin/appui-abstract\";\r\nimport { ContextMenu, Icon, Size, SizeProps } from \"@itwin/core-react\";\r\nimport { SquareButton, SquareButtonProps } from \"./SquareButton\";\r\n\r\n/** @alpha */\r\nexport interface MenuButtonProps extends SquareButtonProps {\r\n  /** Center point */\r\n  point: PointProps;\r\n  /** Function called when size is known. */\r\n  onSizeKnown?: (size: SizeProps) => void;\r\n}\r\n\r\n/** @internal */\r\ninterface MenuButtonState {\r\n  expanded: boolean;\r\n}\r\n\r\n/** @alpha */\r\nexport class MenuButton extends React.PureComponent<MenuButtonProps, MenuButtonState> {\r\n  private _menu: ContextMenu | null = null;\r\n\r\n  constructor(props: MenuButtonProps) {\r\n    super(props);\r\n\r\n    this.state = {\r\n      expanded: false,\r\n    };\r\n  }\r\n\r\n  public override render() {\r\n    const { point, className, style, onSizeKnown, ...buttonProps } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const divStyle: React.CSSProperties = {\r\n      top: point.y,\r\n      left: point.x,\r\n    };\r\n\r\n    return (\r\n      <div className=\"uifw-menu-button\" style={divStyle} ref={(e) => this.setDivRef(e)}>\r\n        <SquareButton {...buttonProps} className={className} style={style} onClick={this._handleClick}>\r\n          <Icon iconSpec=\"icon-more-2\" />\r\n        </SquareButton>\r\n        <ContextMenu\r\n          ref={(el) => { this._menu = el; }}\r\n          selectedIndex={0}\r\n          onSelect={this._handleClose}\r\n          onOutsideClick={this._handleClose}\r\n          onEsc={this._handleClose}\r\n          opened={this.state.expanded}\r\n          autoflip={false}>\r\n          {this.props.children}\r\n        </ContextMenu>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private setDivRef(div: HTMLDivElement | null) {\r\n    // istanbul ignore else\r\n    if (div) {\r\n      const rect = div.getBoundingClientRect();\r\n      const size = new Size(rect.width, rect.height);\r\n\r\n      // istanbul ignore else\r\n      if (this.props.onSizeKnown)\r\n        this.props.onSizeKnown(size);\r\n    }\r\n  }\r\n\r\n  private _open = () => {\r\n    this.setState(\r\n      { expanded: true },\r\n      () => {\r\n        // istanbul ignore else\r\n        if (this._menu)\r\n          this._menu.focus();\r\n      });\r\n  };\r\n\r\n  private _handleClick = (event: any) => {\r\n    if (this.state.expanded) {\r\n      event.stopPropagation();\r\n      this.setState({ expanded: false });\r\n    } else {\r\n      this._open();\r\n    }\r\n  };\r\n\r\n  // istanbul ignore next\r\n  private _handleClose = () => {\r\n    this.setState({ expanded: false });\r\n  };\r\n\r\n}\r\n"]}
+{"version":3,"file":"MenuButton.js","sourceRoot":"","sources":["../../../../src/appui-react/accudraw/MenuButton.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\n/** @packageDocumentation\r\n * @module AccuDraw\r\n */\r\n\r\nimport \"./MenuButton.scss\";\r\nimport * as React from \"react\";\r\nimport { PointProps } from \"@itwin/appui-abstract\";\r\nimport { ContextMenu, Icon, Size, SizeProps } from \"@itwin/core-react\";\r\nimport { SquareButton, SquareButtonProps } from \"./SquareButton\";\r\nimport { SvgMore } from \"@itwin/itwinui-icons-react\";\r\n\r\n/** @alpha */\r\nexport interface MenuButtonProps extends SquareButtonProps {\r\n  /** Center point */\r\n  point: PointProps;\r\n  /** Function called when size is known. */\r\n  onSizeKnown?: (size: SizeProps) => void;\r\n}\r\n\r\n/** @internal */\r\ninterface MenuButtonState {\r\n  expanded: boolean;\r\n}\r\n\r\n/** @alpha */\r\nexport class MenuButton extends React.PureComponent<MenuButtonProps, MenuButtonState> {\r\n  private _menu: ContextMenu | null = null;\r\n\r\n  constructor(props: MenuButtonProps) {\r\n    super(props);\r\n\r\n    this.state = {\r\n      expanded: false,\r\n    };\r\n  }\r\n\r\n  public override render() {\r\n    const { point, className, style, onSizeKnown, ...buttonProps } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\r\n\r\n    const divStyle: React.CSSProperties = {\r\n      top: point.y,\r\n      left: point.x,\r\n    };\r\n\r\n    return (\r\n      <div className=\"uifw-menu-button\" style={divStyle} ref={(e) => this.setDivRef(e)}>\r\n        <SquareButton {...buttonProps} className={className} style={style} onClick={this._handleClick}>\r\n          <Icon iconSpec={<SvgMore />} />\r\n        </SquareButton>\r\n        <ContextMenu\r\n          ref={(el) => { this._menu = el; }}\r\n          selectedIndex={0}\r\n          onSelect={this._handleClose}\r\n          onOutsideClick={this._handleClose}\r\n          onEsc={this._handleClose}\r\n          opened={this.state.expanded}\r\n          autoflip={false}>\r\n          {this.props.children}\r\n        </ContextMenu>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private setDivRef(div: HTMLDivElement | null) {\r\n    // istanbul ignore else\r\n    if (div) {\r\n      const rect = div.getBoundingClientRect();\r\n      const size = new Size(rect.width, rect.height);\r\n\r\n      // istanbul ignore else\r\n      if (this.props.onSizeKnown)\r\n        this.props.onSizeKnown(size);\r\n    }\r\n  }\r\n\r\n  private _open = () => {\r\n    this.setState(\r\n      { expanded: true },\r\n      () => {\r\n        // istanbul ignore else\r\n        if (this._menu)\r\n          this._menu.focus();\r\n      });\r\n  };\r\n\r\n  private _handleClick = (event: any) => {\r\n    if (this.state.expanded) {\r\n      event.stopPropagation();\r\n      this.setState({ expanded: false });\r\n    } else {\r\n      this._open();\r\n    }\r\n  };\r\n\r\n  // istanbul ignore next\r\n  private _handleClose = () => {\r\n    this.setState({ expanded: false });\r\n  };\r\n\r\n}\r\n"]}

package/lib/esm/appui-react/accudraw/SquareButton.scss

@@ -2,44 +2,29 @@
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
 
 $button-size: 32px;
 
 .uifw-square-button {
   display: flex;
   justify-content: center;
-  background-color: $buic-background-tab-inactive;
-  color: $buic-foreground-body;
-  border-color: $buic-background-toolbutton-stroke;
-  border-radius: 5px;
+  background-color: var(--iui-color-background);
+  color: var(--iui-color-text);
+  border-color: var(--iui-color-border-foreground);
+  border-radius: var(--iui-border-radius-1);
   border-width: 1px;
   border-style: solid;
-  opacity: 0.95;
+  opacity: var(--iui-opacity-2);
   pointer-events: auto;
   margin: 0;
   width: $button-size;
   height: $button-size;
 
-  &:focus {
-    background-color: $buic-background-tab-active;
-    color: $buic-foreground-body;
-    border-color: $buic-background-toolbutton-stroke;
-    opacity: 1.0;
-  }
-
+  &:focus,
   &:hover {
-    background-color: $buic-background-tab-active;
-    color: $buic-foreground-primary;
-    border-color: $buic-background-toolbutton-stroke;
-    opacity: 1.0;
+    background-color: var(--iui-color-background-hover);
+    color: var(--iui-color-text-hover);
+    border-color: var(--iui-color-border-foreground-hover);
+    opacity: var(--iui-opacity-1);
   }
-
-  &:active {
-    background-color: $buic-background-4;
-    color: $buic-foreground-primary;
-    border-color: $buic-background-toolbutton-stroke;
-    opacity: 1.0;
-  }
-
 }

package/lib/esm/appui-react/backstage/BackstageComposer.d.ts

@@ -2,8 +2,8 @@
  * @module Backstage
  */
 import * as React from "react";
-import { BackstageItem } from "@itwin/appui-abstract";
 import { CommonProps } from "@itwin/core-react";
+import { BackstageItem } from "./BackstageItem";
 /** @internal */
 export declare type GroupedItems = ReadonlyArray<ReadonlyArray<BackstageItem>>;
 /** @internal */

package/lib/esm/appui-react/backstage/BackstageComposer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BackstageComposer.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposer.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAoF,MAAM,uBAAuB,CAAC;AACxI,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAyEhD,gBAAgB;AAChB,oBAAY,YAAY,GAAG,aAAa,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC;AAEvE,gBAAgB;AAChB,eAAO,MAAM,eAAe,UAAW,cAAc,aAAa,CAAC,iBA+BlE,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,WAAW;IACzD,6CAA6C;IAC7C,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,gGAAgG;IAChG,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,mHAAmH;IACnH,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACjC,wFAAwF;IACxF,QAAQ,CAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CACvC;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eA0D9D"}
+{"version":3,"file":"BackstageComposer.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposer.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAShD,OAAO,EAAE,aAAa,EAA4B,MAAM,iBAAiB,CAAC;AA2D1E,gBAAgB;AAChB,oBAAY,YAAY,GAAG,aAAa,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC;AAEvE,gBAAgB;AAChB,eAAO,MAAM,eAAe,UAAW,cAAc,aAAa,CAAC,iBA+BlE,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,WAAW;IACzD,6CAA6C;IAC7C,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,gGAAgG;IAChG,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,mHAAmH;IACnH,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACjC,wFAAwF;IACxF,QAAQ,CAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CACvC;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAyD9D"}

package/lib/esm/appui-react/backstage/BackstageComposer.js

@@ -6,7 +6,7 @@
  * @module Backstage
  */
 import * as React from "react";
-import { BackstageItemsManager, ConditionalBooleanValue, isStageLauncher } from "@itwin/appui-abstract";
+import { ConditionalBooleanValue } from "@itwin/appui-abstract";
 import { BackstageSeparator, Backstage as NZ_Backstage } from "@itwin/appui-layout-react";
 import { SafeAreaContext } from "../safearea/SafeAreaContext";
 import { SyncUiEventDispatcher } from "../syncui/SyncUiEventDispatcher";
@@ -15,13 +15,19 @@ import { useBackstageManager, useIsBackstageOpen } from "./BackstageManager";
 import { useDefaultBackstageItems } from "./useDefaultBackstageItems";
 import { useUiItemsProviderBackstageItems } from "./useUiItemsProviderBackstageItems";
 import { toLayoutSafeAreaInsets } from "../safearea/SafeAreaHelpers";
+import { isBackstageStageLauncher } from "./BackstageItem";
+import { BackstageItemsManager } from "./BackstageItemsManager";
 // cSpell:ignore safearea
-/* eslint-disable deprecation/deprecation */
 /** Private function to set up sync event monitoring of backstage items */
 function useBackstageItemSyncEffect(itemsManager, syncIdsOfInterest) {
     const isInitialMount = React.useRef(true);
     React.useEffect(() => {
-        const handleSyncUiEvent = (args) => {
+        if (isInitialMount.current) {
+            isInitialMount.current = false;
+            // initialize the display state of any items with syncIds/condition defined
+            itemsManager.refreshAffectedItems(new Set(syncIdsOfInterest));
+        }
+        return SyncUiEventDispatcher.onSyncUiEvent.addListener((args) => {
             if (0 === syncIdsOfInterest.length)
                 return;
             // istanbul ignore else
@@ -29,16 +35,7 @@ function useBackstageItemSyncEffect(itemsManager, syncIdsOfInterest) {
                 // process each item that has interest
                 itemsManager.refreshAffectedItems(args.eventIds);
             }
-        };
-        if (isInitialMount.current) {
-            isInitialMount.current = false;
-            // initialize the display state of any items with syncIds/condition defined
-            itemsManager.refreshAffectedItems(new Set(syncIdsOfInterest));
-        }
-        SyncUiEventDispatcher.onSyncUiEvent.addListener(handleSyncUiEvent);
-        return () => {
-            SyncUiEventDispatcher.onSyncUiEvent.removeListener(handleSyncUiEvent);
-        };
+        });
     }, [itemsManager, itemsManager.items, syncIdsOfInterest]);
 }
 /** local function to combine items from Stage and from Extensions */
@@ -62,9 +59,9 @@ function combineItems(stageItems, addonItems, hideSoloStageEntry) {
     }
     if (hideSoloStageEntry) {
         // per user request don't show stage launcher if only one stage is available
-        const numberOfFrontstageItems = items.reduce((accumulator, item) => accumulator + (isStageLauncher(item) ? 1 : 0), 0);
+        const numberOfFrontstageItems = items.reduce((accumulator, item) => accumulator + (isBackstageStageLauncher(item) ? 1 : 0), 0);
         if (1 === numberOfFrontstageItems)
-            items = items.filter((item) => !isStageLauncher(item));
+            items = items.filter((item) => !isBackstageStageLauncher(item));
     }
     return items;
 }

package/lib/esm/appui-react/backstage/BackstageComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackstageComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposer.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\n/** @packageDocumentation\r\n * @module Backstage\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { BackstageItem, BackstageItemsManager, ConditionalBooleanValue, isStageLauncher, UiSyncEventArgs } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { BackstageSeparator, Backstage as NZ_Backstage } from \"@itwin/appui-layout-react\";\r\nimport { SafeAreaContext } from \"../safearea/SafeAreaContext\";\r\nimport { SyncUiEventDispatcher } from \"../syncui/SyncUiEventDispatcher\";\r\nimport { BackstageComposerItem } from \"./BackstageComposerItem\";\r\nimport { useBackstageManager, useIsBackstageOpen } from \"./BackstageManager\";\r\nimport { useDefaultBackstageItems } from \"./useDefaultBackstageItems\";\r\nimport { useUiItemsProviderBackstageItems } from \"./useUiItemsProviderBackstageItems\";\r\nimport { toLayoutSafeAreaInsets } from \"../safearea/SafeAreaHelpers\";\r\n\r\n// cSpell:ignore safearea\r\n\r\n/* eslint-disable deprecation/deprecation */\r\n\r\n/** Private function to set up sync event monitoring of backstage items */\r\nfunction useBackstageItemSyncEffect(itemsManager: BackstageItemsManager, syncIdsOfInterest: string[]) {\r\n  const isInitialMount = React.useRef(true);\r\n\r\n  React.useEffect(() => {\r\n    const handleSyncUiEvent = (args: UiSyncEventArgs) => {\r\n      if (0 === syncIdsOfInterest.length)\r\n        return;\r\n\r\n      // istanbul ignore else\r\n      if (syncIdsOfInterest.some((value: string): boolean => args.eventIds.has(value.toLowerCase()))) {\r\n        // process each item that has interest\r\n        itemsManager.refreshAffectedItems(args.eventIds);\r\n      }\r\n    };\r\n\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n      // initialize the display state of any items with syncIds/condition defined\r\n      itemsManager.refreshAffectedItems(new Set(syncIdsOfInterest));\r\n    }\r\n\r\n    SyncUiEventDispatcher.onSyncUiEvent.addListener(handleSyncUiEvent);\r\n    return () => {\r\n      SyncUiEventDispatcher.onSyncUiEvent.removeListener(handleSyncUiEvent);\r\n    };\r\n  }, [itemsManager, itemsManager.items, syncIdsOfInterest]);\r\n}\r\n\r\n/** local function to combine items from Stage and from Extensions */\r\nfunction combineItems(stageItems: ReadonlyArray<BackstageItem>, addonItems: ReadonlyArray<BackstageItem>, hideSoloStageEntry: boolean) {\r\n  let items: BackstageItem[] = [];\r\n  if (stageItems.length) {\r\n    // Walk through each and ensure no duplicate ids are added.\r\n    stageItems.forEach((srcItem) => {\r\n      if (-1 === items.findIndex((item) => item.id === srcItem.id)) {\r\n        items.push(srcItem);\r\n      }\r\n    });\r\n  }\r\n  if (addonItems.length) {\r\n    // Walk through each and ensure no duplicate ids are added.\r\n    addonItems.forEach((srcItem) => {\r\n      if (-1 === items.findIndex((item) => item.id === srcItem.id)) {\r\n        items.push(srcItem);\r\n      }\r\n    });\r\n  }\r\n\r\n  if (hideSoloStageEntry) {\r\n    // per user request don't show stage launcher if only one stage is available\r\n    const numberOfFrontstageItems = items.reduce((accumulator, item) => accumulator + (isStageLauncher(item) ? 1 : 0), 0);\r\n    if (1 === numberOfFrontstageItems)\r\n      items = items.filter((item) => !isStageLauncher(item));\r\n  }\r\n\r\n  return items;\r\n}\r\n\r\n/** @internal */\r\nexport type GroupedItems = ReadonlyArray<ReadonlyArray<BackstageItem>>;\r\n\r\n/** @internal */\r\nexport const useGroupedItems = (items: ReadonlyArray<BackstageItem>): GroupedItems => {\r\n  return React.useMemo(() => {\r\n    const grouped = items.reduce<GroupedItems>((acc, item) => {\r\n      if (ConditionalBooleanValue.getValue(item.isHidden))\r\n        return acc;\r\n      const groupIndex = acc.findIndex((group) => group[0].groupPriority === item.groupPriority);\r\n      if (groupIndex >= 0)\r\n        return [\r\n          ...acc.slice(0, groupIndex),\r\n          [\r\n            ...acc[groupIndex],\r\n            item,\r\n          ],\r\n          ...acc.slice(groupIndex + 1),\r\n        ];\r\n      return [\r\n        ...acc,\r\n        [\r\n          item,\r\n        ],\r\n      ];\r\n    }, []);\r\n    const sortedGroups = grouped.reduce<GroupedItems>((acc, group) => {\r\n      const sortedGroup = [...group].sort((a, b) => a.itemPriority - b.itemPriority);\r\n      return [\r\n        ...acc,\r\n        sortedGroup,\r\n      ];\r\n    }, []);\r\n    return [...sortedGroups].sort((a, b) => a[0].groupPriority - b[0].groupPriority);\r\n  }, [items]);\r\n};\r\n\r\n/** Props of [[BackstageComposer]] component.\r\n * @public\r\n */\r\nexport interface BackstageComposerProps extends CommonProps {\r\n  /** React node for an optional header item */\r\n  readonly header?: React.ReactNode;\r\n  /** Indicates whether to place an overlay over the frontstage when the backstage is displayed */\r\n  readonly showOverlay?: boolean;\r\n  /** List of static backstage items to show. Can be undefined in UiItemsProviders are used to populate backstage. */\r\n  readonly items?: BackstageItem[];\r\n  /** If true and only one stage launcher item is found, do not show entry in backstage */\r\n  readonly hideSoloStageEntry?: boolean;\r\n}\r\n\r\n/** Backstage component composed from [[UiFramework.backstage]] items.\r\n * @public\r\n */\r\nexport function BackstageComposer(props: BackstageComposerProps) {\r\n  const [defaultItemsManager, setDefaultItemsManager] = React.useState(new BackstageItemsManager(props.items));\r\n  const initialItems = React.useRef(props.items);\r\n\r\n  React.useEffect(() => {\r\n    if (initialItems.current !== props.items) {\r\n      initialItems.current = props.items;\r\n      setDefaultItemsManager(new BackstageItemsManager(props.items));\r\n    }\r\n  }, [props.items]);\r\n\r\n  const manager = useBackstageManager();\r\n  const isOpen = useIsBackstageOpen(manager);\r\n  const safeAreaInsets = React.useContext(SafeAreaContext);\r\n  const handleClose = React.useCallback(() => {\r\n    manager.close();\r\n  }, [manager]);\r\n\r\n  const defaultItems = useDefaultBackstageItems(defaultItemsManager);\r\n  const syncIdsOfInterest = React.useMemo(() => BackstageItemsManager.getSyncIdsOfInterest(defaultItems), [defaultItems]);\r\n  useBackstageItemSyncEffect(defaultItemsManager, syncIdsOfInterest);\r\n\r\n  const [addonItemsManager] = React.useState(new BackstageItemsManager());\r\n  const addonItems = useUiItemsProviderBackstageItems(addonItemsManager);\r\n  const addonSyncIdsOfInterest = React.useMemo(() => BackstageItemsManager.getSyncIdsOfInterest(addonItems), [addonItems]);\r\n  useBackstageItemSyncEffect(addonItemsManager, addonSyncIdsOfInterest);\r\n\r\n  const combinedBackstageItems = React.useMemo(() => combineItems(defaultItems, addonItems, !!props.hideSoloStageEntry), [defaultItems, addonItems, props.hideSoloStageEntry]);\r\n  const groups = useGroupedItems(combinedBackstageItems);\r\n\r\n  return (\r\n    <NZ_Backstage\r\n      className={props.className}\r\n      header={props.header}\r\n      isOpen={isOpen}\r\n      onClose={handleClose}\r\n      safeAreaInsets={toLayoutSafeAreaInsets(safeAreaInsets)}\r\n      showOverlay={props.showOverlay}\r\n      style={props.style}\r\n    >\r\n      {groups.map((group, groupIndex) => (\r\n        group.map((item, itemIndex) => {\r\n          const composerItem = (\r\n            <BackstageComposerItem\r\n              item={item}\r\n              key={item.id}\r\n            />\r\n          );\r\n          return itemIndex === 0 && groupIndex > 0 ? (\r\n            <React.Fragment key={groupIndex}>\r\n              <BackstageSeparator />\r\n              {composerItem}\r\n            </React.Fragment>\r\n          ) : composerItem;\r\n        })\r\n      ))}\r\n    </NZ_Backstage>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"BackstageComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposer.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\n/** @packageDocumentation\r\n * @module Backstage\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { ConditionalBooleanValue } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { BackstageSeparator, Backstage as NZ_Backstage } from \"@itwin/appui-layout-react\";\r\nimport { SafeAreaContext } from \"../safearea/SafeAreaContext\";\r\nimport { SyncUiEventDispatcher } from \"../syncui/SyncUiEventDispatcher\";\r\nimport { BackstageComposerItem } from \"./BackstageComposerItem\";\r\nimport { useBackstageManager, useIsBackstageOpen } from \"./BackstageManager\";\r\nimport { useDefaultBackstageItems } from \"./useDefaultBackstageItems\";\r\nimport { useUiItemsProviderBackstageItems } from \"./useUiItemsProviderBackstageItems\";\r\nimport { toLayoutSafeAreaInsets } from \"../safearea/SafeAreaHelpers\";\r\nimport { BackstageItem, isBackstageStageLauncher } from \"./BackstageItem\";\r\nimport { BackstageItemsManager } from \"./BackstageItemsManager\";\r\n\r\n// cSpell:ignore safearea\r\n\r\n/** Private function to set up sync event monitoring of backstage items */\r\nfunction useBackstageItemSyncEffect(itemsManager: BackstageItemsManager, syncIdsOfInterest: string[]) {\r\n  const isInitialMount = React.useRef(true);\r\n\r\n  React.useEffect(() => {\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n      // initialize the display state of any items with syncIds/condition defined\r\n      itemsManager.refreshAffectedItems(new Set(syncIdsOfInterest));\r\n    }\r\n\r\n    return SyncUiEventDispatcher.onSyncUiEvent.addListener((args) => {\r\n      if (0 === syncIdsOfInterest.length)\r\n        return;\r\n\r\n      // istanbul ignore else\r\n      if (syncIdsOfInterest.some((value: string): boolean => args.eventIds.has(value.toLowerCase()))) {\r\n        // process each item that has interest\r\n        itemsManager.refreshAffectedItems(args.eventIds);\r\n      }\r\n    });\r\n  }, [itemsManager, itemsManager.items, syncIdsOfInterest]);\r\n}\r\n\r\n/** local function to combine items from Stage and from Extensions */\r\nfunction combineItems(stageItems: ReadonlyArray<BackstageItem>, addonItems: ReadonlyArray<BackstageItem>, hideSoloStageEntry: boolean): ReadonlyArray<BackstageItem> {\r\n  let items: Array<BackstageItem> = [];\r\n  if (stageItems.length) {\r\n    // Walk through each and ensure no duplicate ids are added.\r\n    stageItems.forEach((srcItem) => {\r\n      if (-1 === items.findIndex((item) => item.id === srcItem.id)) {\r\n        items.push(srcItem);\r\n      }\r\n    });\r\n  }\r\n  if (addonItems.length) {\r\n    // Walk through each and ensure no duplicate ids are added.\r\n    addonItems.forEach((srcItem) => {\r\n      if (-1 === items.findIndex((item) => item.id === srcItem.id)) {\r\n        items.push(srcItem);\r\n      }\r\n    });\r\n  }\r\n\r\n  if (hideSoloStageEntry) {\r\n    // per user request don't show stage launcher if only one stage is available\r\n    const numberOfFrontstageItems = items.reduce((accumulator, item) => accumulator + (isBackstageStageLauncher(item) ? 1 : 0), 0);\r\n    if (1 === numberOfFrontstageItems)\r\n      items = items.filter((item) => !isBackstageStageLauncher(item));\r\n  }\r\n\r\n  return items;\r\n}\r\n\r\n/** @internal */\r\nexport type GroupedItems = ReadonlyArray<ReadonlyArray<BackstageItem>>;\r\n\r\n/** @internal */\r\nexport const useGroupedItems = (items: ReadonlyArray<BackstageItem>): GroupedItems => {\r\n  return React.useMemo(() => {\r\n    const grouped = items.reduce<GroupedItems>((acc, item) => {\r\n      if (ConditionalBooleanValue.getValue(item.isHidden))\r\n        return acc;\r\n      const groupIndex = acc.findIndex((group) => group[0].groupPriority === item.groupPriority);\r\n      if (groupIndex >= 0)\r\n        return [\r\n          ...acc.slice(0, groupIndex),\r\n          [\r\n            ...acc[groupIndex],\r\n            item,\r\n          ],\r\n          ...acc.slice(groupIndex + 1),\r\n        ];\r\n      return [\r\n        ...acc,\r\n        [\r\n          item,\r\n        ],\r\n      ];\r\n    }, []);\r\n    const sortedGroups = grouped.reduce<GroupedItems>((acc, group) => {\r\n      const sortedGroup = [...group].sort((a, b) => a.itemPriority - b.itemPriority);\r\n      return [\r\n        ...acc,\r\n        sortedGroup,\r\n      ];\r\n    }, []);\r\n    return [...sortedGroups].sort((a, b) => a[0].groupPriority - b[0].groupPriority);\r\n  }, [items]);\r\n};\r\n\r\n/** Props of [[BackstageComposer]] component.\r\n * @public\r\n */\r\nexport interface BackstageComposerProps extends CommonProps {\r\n  /** React node for an optional header item */\r\n  readonly header?: React.ReactNode;\r\n  /** Indicates whether to place an overlay over the frontstage when the backstage is displayed */\r\n  readonly showOverlay?: boolean;\r\n  /** List of static backstage items to show. Can be undefined in UiItemsProviders are used to populate backstage. */\r\n  readonly items?: BackstageItem[];\r\n  /** If true and only one stage launcher item is found, do not show entry in backstage */\r\n  readonly hideSoloStageEntry?: boolean;\r\n}\r\n\r\n/** Backstage component composed from [[UiFramework.backstage]] items.\r\n * @public\r\n */\r\nexport function BackstageComposer(props: BackstageComposerProps) {\r\n  const [defaultItemsManager, setDefaultItemsManager] = React.useState(new BackstageItemsManager(props.items));\r\n  const initialItems = React.useRef(props.items);\r\n\r\n  React.useEffect(() => {\r\n    if (initialItems.current !== props.items) {\r\n      initialItems.current = props.items;\r\n      setDefaultItemsManager(new BackstageItemsManager(props.items));\r\n    }\r\n  }, [props.items]);\r\n\r\n  const manager = useBackstageManager();\r\n  const isOpen = useIsBackstageOpen(manager);\r\n  const safeAreaInsets = React.useContext(SafeAreaContext);\r\n  const handleClose = React.useCallback(() => {\r\n    manager.close();\r\n  }, [manager]);\r\n\r\n  const defaultItems = useDefaultBackstageItems(defaultItemsManager);\r\n  const syncIdsOfInterest = React.useMemo(() => BackstageItemsManager.getSyncIdsOfInterest(defaultItems), [defaultItems]);\r\n  useBackstageItemSyncEffect(defaultItemsManager, syncIdsOfInterest);\r\n\r\n  const [addonItemsManager] = React.useState(new BackstageItemsManager());\r\n  const addonItems = useUiItemsProviderBackstageItems(addonItemsManager);\r\n  const addonSyncIdsOfInterest = React.useMemo(() => BackstageItemsManager.getSyncIdsOfInterest(addonItems), [addonItems]);\r\n  useBackstageItemSyncEffect(addonItemsManager, addonSyncIdsOfInterest);\r\n\r\n  const combinedBackstageItems = React.useMemo(() => combineItems(defaultItems, addonItems, !!props.hideSoloStageEntry), [defaultItems, addonItems, props.hideSoloStageEntry]);\r\n  const groups = useGroupedItems(combinedBackstageItems);\r\n  return (\r\n    <NZ_Backstage\r\n      className={props.className}\r\n      header={props.header}\r\n      isOpen={isOpen}\r\n      onClose={handleClose}\r\n      safeAreaInsets={toLayoutSafeAreaInsets(safeAreaInsets)}\r\n      showOverlay={props.showOverlay}\r\n      style={props.style}\r\n    >\r\n      {groups.map((group, groupIndex) => (\r\n        group.map((item, itemIndex) => {\r\n          const composerItem = (\r\n            <BackstageComposerItem\r\n              item={item}\r\n              key={item.id}\r\n            />\r\n          );\r\n          return itemIndex === 0 && groupIndex > 0 ? (\r\n            <React.Fragment key={groupIndex}>\r\n              <BackstageSeparator />\r\n              {composerItem}\r\n            </React.Fragment>\r\n          ) : composerItem;\r\n        })\r\n      ))}\r\n    </NZ_Backstage>\r\n  );\r\n}\r\n"]}

package/lib/esm/appui-react/backstage/BackstageComposerItem.d.ts

@@ -2,7 +2,7 @@
  * @module Backstage
  */
 /// <reference types="react" />
-import { BackstageActionItem, BackstageItem, BackstageStageLauncher } from "@itwin/appui-abstract";
+import { BackstageActionItem, BackstageItem, BackstageStageLauncher } from "./BackstageItem";
 /** @internal */
 export interface BackstageComposerActionItemProps {
     readonly item: BackstageActionItem;
@@ -21,7 +21,6 @@ export declare function BackstageComposerStageLauncher({ item }: BackstageCompos
 export interface BackstageComposerItemProps {
     /** Backstage item to render */
     readonly item: BackstageItem;
-    readonly providerId?: string;
 }
 /** Item of [[BackstageComposer]].
  * @internal

package/lib/esm/appui-react/backstage/BackstageComposerItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BackstageComposerItem.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposerItem.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAIH,OAAO,EACL,mBAAmB,EAAE,aAAa,EAAE,sBAAsB,EAC3D,MAAM,uBAAuB,CAAC;AAO/B,gBAAgB;AAChB,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,CAAC,IAAI,EAAE,mBAAmB,CAAC;CACpC;AAED,gBAAgB;AAChB,wBAAgB,2BAA2B,CAAC,EAAE,IAAI,EAAE,EAAE,gCAAgC,eAuBrF;AAED,gBAAgB;AAChB,MAAM,WAAW,mCAAmC;IAClD,QAAQ,CAAC,IAAI,EAAE,sBAAsB,CAAC;CACvC;AAED,gBAAgB;AAChB,wBAAgB,8BAA8B,CAAC,EAAE,IAAI,EAAE,EAAE,mCAAmC,eA2B3F;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,+BAA+B;IAC/B,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;IAC7B,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,IAAI,EAAE,EAAE,0BAA0B,eAazE"}
+{"version":3,"file":"BackstageComposerItem.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposerItem.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAUH,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,sBAAsB,EAA4B,MAAM,iBAAiB,CAAC;AAGvH,gBAAgB;AAChB,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,CAAC,IAAI,EAAE,mBAAmB,CAAC;CACpC;AAED,gBAAgB;AAChB,wBAAgB,2BAA2B,CAAC,EAAE,IAAI,EAAE,EAAE,gCAAgC,eAsBrF;AAED,gBAAgB;AAChB,MAAM,WAAW,mCAAmC;IAClD,QAAQ,CAAC,IAAI,EAAE,sBAAsB,CAAC;CACvC;AAED,gBAAgB;AAChB,wBAAgB,8BAA8B,CAAC,EAAE,IAAI,EAAE,EAAE,mCAAmC,eA0B3F;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,+BAA+B;IAC/B,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;CAC9B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,IAAI,EAAE,EAAE,0BAA0B,eAazE"}

package/lib/esm/appui-react/backstage/BackstageComposerItem.js

@@ -7,21 +7,22 @@
  */
 import * as React from "react";
 import { Logger } from "@itwin/core-bentley";
-import { ConditionalBooleanValue, ConditionalStringValue, isStageLauncher, } from "@itwin/appui-abstract";
-import { BadgeUtilities, Icon, IconHelper } from "@itwin/core-react";
+import { ConditionalBooleanValue, ConditionalStringValue } from "@itwin/appui-abstract";
+import { BadgeUtilities, Icon } from "@itwin/core-react";
 import { BackstageItem as NZ_BackstageItem } from "@itwin/appui-layout-react";
 import { useBackstageManager } from "./BackstageManager";
 import { UiFramework } from "../UiFramework";
 import { useActiveFrontstageId } from "../frontstage/FrontstageDef";
+import { isBackstageStageLauncher } from "./BackstageItem";
+import { isProviderItem } from "../ui-items-provider/isProviderItem";
 /** @internal */
 export function BackstageComposerActionItem({ item }) {
     const manager = useBackstageManager();
-    const iconSpec = IconHelper.getIconReactNode(item.icon, item.internalData);
     const handleClick = React.useCallback(() => {
         manager.close();
         item.execute();
     }, [manager, item]);
-    return (React.createElement(NZ_BackstageItem, { itemId: item.id, providerId: item.providerId, itemPriority: item.itemPriority, groupPriority: item.groupPriority, icon: React.createElement(Icon, { iconSpec: iconSpec }), isActive: ConditionalBooleanValue.getValue(item.isActive), isDisabled: ConditionalBooleanValue.getValue(item.isDisabled), onClick: handleClick, subtitle: ConditionalStringValue.getValue(item.subtitle), badge: BadgeUtilities.getComponentForBadgeType(item.badgeType) }, ConditionalStringValue.getValue(item.label)));
+    return (React.createElement(NZ_BackstageItem, { itemId: item.id, providerId: isProviderItem(item) ? item.providerId : undefined, itemPriority: item.itemPriority, groupPriority: item.groupPriority, icon: React.createElement(Icon, { iconSpec: item.icon }), isActive: ConditionalBooleanValue.getValue(item.isActive), isDisabled: ConditionalBooleanValue.getValue(item.isDisabled), onClick: handleClick, subtitle: ConditionalStringValue.getValue(item.subtitle), badge: BadgeUtilities.getComponentForBadgeType(item.badge) }, ConditionalStringValue.getValue(item.label)));
 }
 /** @internal */
 export function BackstageComposerStageLauncher({ item }) {
@@ -35,14 +36,13 @@ export function BackstageComposerStageLauncher({ item }) {
     }, [manager, item.stageId]);
     const activeFrontstageId = useActiveFrontstageId();
     const isActive = ConditionalBooleanValue.getValue((_a = item.isActive) !== null && _a !== void 0 ? _a : item.stageId === activeFrontstageId);
-    const iconSpec = IconHelper.getIconReactNode(item.icon, item.internalData);
-    return (React.createElement(NZ_BackstageItem, { itemId: item.id, providerId: item.providerId, itemPriority: item.itemPriority, groupPriority: item.groupPriority, icon: React.createElement(Icon, { iconSpec: iconSpec }), isActive: isActive, isDisabled: ConditionalBooleanValue.getValue(item.isDisabled), onClick: handleClick, subtitle: ConditionalStringValue.getValue(item.subtitle), badge: BadgeUtilities.getComponentForBadgeType(item.badgeType) }, ConditionalStringValue.getValue(item.label)));
+    return (React.createElement(NZ_BackstageItem, { itemId: item.id, providerId: isProviderItem(item) ? item.providerId : undefined, itemPriority: item.itemPriority, groupPriority: item.groupPriority, icon: React.createElement(Icon, { iconSpec: item.icon }), isActive: isActive, isDisabled: ConditionalBooleanValue.getValue(item.isDisabled), onClick: handleClick, subtitle: ConditionalStringValue.getValue(item.subtitle), badge: BadgeUtilities.getComponentForBadgeType(item.badge) }, ConditionalStringValue.getValue(item.label)));
 }
 /** Item of [[BackstageComposer]].
  * @internal
  */
 export function BackstageComposerItem({ item }) {
-    if (isStageLauncher(item)) { // eslint-disable-line deprecation/deprecation
+    if (isBackstageStageLauncher(item)) {
         return (React.createElement(BackstageComposerStageLauncher, { item: item }));
     }
     return (React.createElement(BackstageComposerActionItem, { item: item }));