@itwin/core-react 4.9.0 → 4.10.0

package/lib/esm/core-react/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/Dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Dialog\n */\n\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport type { DialogButtonDef } from \"@itwin/appui-abstract\";\nimport { DialogButtonType } from \"@itwin/appui-abstract\";\nimport { Dialog as BaseDialog, Button } from \"@itwin/itwinui-react\";\nimport type { ButtonProps } from \"@itwin/itwinui-react\";\nimport { DivWithOutsideClick } from \"../base/DivWithOutsideClick\";\nimport { UiCore } from \"../UiCore\";\nimport type { CommonProps } from \"../utils/Props\";\nimport type { Omit } from \"../utils/typeUtils\";\nimport \"./Dialog.scss\";\n\n// cspell:ignore focustrap\n\n/** Enum for dialog alignment\n * @public\n */\nexport enum DialogAlignment {\n  TopLeft = \"top-left\",\n  Top = \"top\",\n  TopRight = \"top-right\",\n  Left = \"left\",\n  Center = \"center\",\n  Right = \"right\",\n  BottomLeft = \"bottom-left\",\n  Bottom = \"bottom\",\n  BottomRight = \"bottom-right\",\n}\n\n/** Properties for the [[Dialog]] component\n * @public\n */\nexport interface DialogProps\n  extends Omit<React.AllHTMLAttributes<HTMLDivElement>, \"title\">,\n    CommonProps {\n  /** Indicates whether to show dialog or not */\n  opened: boolean;\n\n  /** Indicates whether the user can resize dialog with cursor. Default: false */\n  resizable?: boolean;\n  /** Indicates whether the user can move dialog with cursor. Default: false */\n  movable?: boolean;\n  /** Indicates whether the content should be inset. Default: true */\n  inset?: boolean;\n  /** Indicates whether the focus should be trapped within the dialog. Default: false */\n  trapFocus?: boolean;\n\n  /** Whether the hide the header. Default: false */\n  hideHeader?: boolean;\n  /** Override for the header */\n  header?: React.ReactNode;\n  /** Title to show in title bar of dialog */\n  title?: string | React.ReactElement;\n  /** Footer to show at bottom of dialog. Note: will override buttonCluster */\n  footer?: string | React.ReactElement;\n  /** List of DialogButtonDef objects specifying buttons and associated onClick events */\n  buttonCluster?: DialogButtonDef[];\n\n  /** Default alignment of dialog. */\n  alignment?: DialogAlignment;\n  /** Initial x/left position of dialog in px. */\n  x?: number;\n  /** Initial y/top position of dialog in px. */\n  y?: number;\n\n  /** onClick event for X button for dialog */\n  onClose?: () => void;\n  /** 'keyup' event for Esc key */\n  onEscape?: () => void;\n  /** Triggered when a click is triggered outside of this dialog. */\n  onOutsideClick?: (event: MouseEvent) => any;\n\n  /** Initial width of dialog. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: \"50%\" */\n  width?: string | number;\n  /** Initial height of dialog. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */\n  height?: string | number;\n  /** Minimum width that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 300px */\n  minWidth?: string | number;\n  /** Minimum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 135px */\n  minHeight?: string | number;\n  /** Maximum width that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 100% */\n  maxWidth?: string | number;\n  /** Maximum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */\n  maxHeight?: string | number;\n\n  /** Whether to show background overlay. Default: true.\n   * @note Modeless dialogs require an id and an implementation of onModelessPointerDown.\n   */\n  modal?: boolean;\n  /** An id for a modeless dialog */\n  modelessId?: string;\n  /** Pointer Down event handler when modeless (modal = false) */\n  onModelessPointerDown?: (event: React.PointerEvent, id: string) => void;\n\n  /** Custom CSS Style for overlay */\n  backgroundStyle?: React.CSSProperties;\n  /** Custom CSS Style for title */\n  titleStyle?: React.CSSProperties;\n  /** Custom CSS Style for footer */\n  footerStyle?: React.CSSProperties;\n  /** Custom CSS class name for the content */\n  contentClassName?: string;\n  /** Custom CSS Style for the content */\n  contentStyle?: React.CSSProperties;\n}\n\n/** @internal */\ninterface DialogState {\n  rightResizing: boolean;\n  downResizing: boolean;\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n}\n\n/**\n * Dialog React component with optional resizing and dragging functionality\n * @public\n */\nexport class Dialog extends React.Component<DialogProps, DialogState> {\n  private _parentDocument = document;\n  public static defaultProps: Partial<DialogProps> = {\n    maxWidth: \"100%\",\n    width: \"50%\",\n    hideHeader: false,\n    resizable: false,\n    movable: false,\n    modal: true,\n    inset: true,\n    trapFocus: false,\n  };\n\n  constructor(props: DialogProps) {\n    super(props);\n  }\n\n  public override componentWillUnmount(): void {\n    this._parentDocument.removeEventListener(\"keyup\", this._handleKeyUp, true);\n  }\n\n  public override componentDidMount(): void {\n    this._parentDocument.addEventListener(\"keyup\", this._handleKeyUp, true);\n  }\n\n  // istanbul ignore next\n  public handleRefSet = (containerDiv: HTMLDivElement | null) => {\n    if (containerDiv) this._parentDocument = containerDiv.ownerDocument;\n  };\n\n  public override render(): React.ReactElement {\n    const {\n      opened,\n      title,\n      footer,\n      buttonCluster,\n      onClose,\n      onEscape,\n      onOutsideClick,\n      minWidth,\n      minHeight,\n      x,\n      y,\n      width,\n      height,\n      maxHeight,\n      maxWidth,\n      backgroundStyle,\n      titleStyle,\n      footerStyle,\n      style,\n      contentStyle,\n      contentClassName,\n      modal,\n      resizable,\n      movable,\n      className,\n      alignment,\n      inset,\n      trapFocus,\n      modelessId,\n      onModelessPointerDown,\n      hideHeader,\n      header,\n      ...props\n    } = this.props;\n\n    let initialOffset: React.CSSProperties = {};\n    if (x || y) {\n      initialOffset = {\n        left: x ?? 0,\n        top: y ?? 0,\n        transform: \"none\",\n      };\n    }\n\n    const containerStyle: React.CSSProperties = {\n      ...initialOffset,\n      margin: \"\",\n      width,\n      height,\n    };\n\n    const minMaxStyle: React.CSSProperties = {\n      minWidth,\n      minHeight,\n      maxWidth,\n      maxHeight,\n    };\n    const dialogBaseContainerStyle: React.CSSProperties = {\n      ...containerStyle,\n      ...minMaxStyle,\n    };\n\n    const buttons = this.getFooterButtons(\n      buttonCluster,\n      \"high-visibility\",\n      true\n    );\n\n    return (\n      <BaseDialog\n        isOpen={opened}\n        onClose={onClose}\n        closeOnExternalClick={false}\n        closeOnEsc={false}\n        style={style}\n        className={classnames(\"core-dialog\", className)}\n        isDraggable={movable}\n        isResizable={resizable}\n        trapFocus={trapFocus && /* istanbul ignore next */ modal}\n        preventDocumentScroll={true}\n        data-testid=\"core-dialog-root\"\n        {...props}\n      >\n        {modal && <BaseDialog.Backdrop style={backgroundStyle} />}\n        <DivWithOutsideClick onOutsideClick={onOutsideClick}>\n          <BaseDialog.Main\n            className={classnames(\n              \"core-dialog-main\",\n              alignment && this.getCSSClassNameFromAlignment(alignment)\n            )}\n            data-testid=\"core-dialog-container\"\n            style={dialogBaseContainerStyle}\n            onPointerDown={this._handleContainerPointerDown}\n          >\n            {!hideHeader &&\n              (header || (\n                <BaseDialog.TitleBar\n                  titleText={title}\n                  style={titleStyle}\n                  data-testid=\"core-dialog-head\"\n                />\n              ))}\n            <BaseDialog.Content\n              className={contentClassName}\n              style={{ padding: inset ? undefined : 0, ...contentStyle }}\n            >\n              {this.props.children}\n            </BaseDialog.Content>\n            {footer || (\n              <BaseDialog.ButtonBar style={footerStyle}>\n                {buttons}\n              </BaseDialog.ButtonBar>\n            )}\n          </BaseDialog.Main>\n        </DivWithOutsideClick>\n      </BaseDialog>\n    );\n  }\n\n  private getCSSClassNameFromAlignment(alignment: DialogAlignment): string {\n    switch (alignment) {\n      case DialogAlignment.TopLeft:\n        return \"core-align-top-left\";\n      case DialogAlignment.Top:\n        return \"core-align-top\";\n      case DialogAlignment.TopRight:\n        return \"core-align-top-right\";\n      case DialogAlignment.Left:\n        return \"core-align-left\";\n      case DialogAlignment.Center:\n        return \"core-align-center\";\n      case DialogAlignment.Right:\n        return \"core-align-right\";\n      case DialogAlignment.BottomLeft:\n        return \"core-align-bottom-left\";\n      case DialogAlignment.Bottom:\n        return \"core-align-bottom\";\n      case DialogAlignment.BottomRight:\n        return \"core-align-bottom-right\";\n    }\n  }\n\n  protected getFooterButtons(\n    buttonCluster: DialogButtonDef[] | undefined,\n    /* istanbul ignore next */ primaryStyleType: ButtonProps[\"styleType\"] = \"cta\",\n    /* istanbul ignore next */ noCoreButtonClasses: boolean = false\n  ): React.ReactNode[] | undefined {\n    if (buttonCluster === undefined) return undefined;\n\n    const buttons: React.ReactNode[] = [];\n    buttonCluster.forEach((button: DialogButtonDef, index: number) => {\n      let buttonText = \"\";\n      // istanbul ignore next\n      let buttonClass = classnames(\n        !noCoreButtonClasses && \"core-dialog-button\",\n        !noCoreButtonClasses && `dialog-button-${button.type}`,\n        button.className\n      );\n      let usePrimaryStyleType = false;\n\n      switch (button.type) {\n        case DialogButtonType.OK:\n          buttonText = UiCore.translate(\"dialog.ok\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.Retry:\n          buttonText = UiCore.translate(\"dialog.retry\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.Yes:\n          buttonText = UiCore.translate(\"dialog.yes\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.No:\n          buttonText = UiCore.translate(\"dialog.no\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          break;\n        case DialogButtonType.Cancel:\n          buttonText = UiCore.translate(\"dialog.cancel\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          break;\n        case DialogButtonType.Close:\n          buttonText = UiCore.translate(\"dialog.close\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          break;\n        case DialogButtonType.Next:\n          buttonText = UiCore.translate(\"dialog.next\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.Previous:\n          buttonText = UiCore.translate(\"dialog.previous\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n      }\n\n      if (button.label) buttonText = button.label;\n\n      buttons.push(\n        <Button\n          className={buttonClass}\n          disabled={button.disabled}\n          styleType={usePrimaryStyleType ? primaryStyleType : undefined}\n          key={index.toString()}\n          onClick={button.onClick}\n        >\n          {buttonText}\n        </Button>\n      );\n    });\n    return buttons;\n  }\n\n  private _handleKeyUp = (event: KeyboardEvent) => {\n    if (event.key === Key.Escape && this.props.opened && this.props.onEscape) {\n      this.props.onEscape();\n    }\n  };\n\n  protected _handleContainerPointerDown = (event: React.PointerEvent): void => {\n    // istanbul ignore next\n    if (!this.props.modal) {\n      if (this.props.onModelessPointerDown && this.props.modelessId)\n        this.props.onModelessPointerDown(event, this.props.modelessId);\n    }\n  };\n}\n"]}
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/Dialog.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAGnC,OAAO,eAAe,CAAC;AAIvB,0BAA0B;AAE1B;;GAEG;AACH,MAAM,CAAN,IAAY,eAUX;AAVD,WAAY,eAAe;IACzB,uCAAoB,CAAA;IACpB,8BAAW,CAAA;IACX,yCAAsB,CAAA;IACtB,gCAAa,CAAA;IACb,oCAAiB,CAAA;IACjB,kCAAe,CAAA;IACf,6CAA0B,CAAA;IAC1B,oCAAiB,CAAA;IACjB,+CAA4B,CAAA;AAC9B,CAAC,EAVW,eAAe,KAAf,eAAe,QAU1B;AA+ED;;GAEG;AACH,MAAa,MAAO,SAAQ,KAAK,CAAC,SAAsB;IAatD,YAAY,KAAkB;QAC5B,KAAK,CAAC,KAAK,CAAC,CAAC;QAbP,oBAAe,GAAG,QAAQ,CAAC;QAwBnC,uBAAuB;QAChB,iBAAY,GAAG,CAAC,YAAmC,EAAE,EAAE;YAC5D,IAAI,YAAY;gBAAE,IAAI,CAAC,eAAe,GAAG,YAAY,CAAC,aAAa,CAAC;QACtE,CAAC,CAAC;QA+NM,iBAAY,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC9C,IACE,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE;gBAClC,IAAI,CAAC,KAAK,CAAC,MAAM;gBACjB,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB;gBACA,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;aACvB;QACH,CAAC,CAAC;QAEQ,gCAA2B,GAAG,CAAC,KAAyB,EAAQ,EAAE;YAC1E,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;gBACrB,IAAI,IAAI,CAAC,KAAK,CAAC,qBAAqB,IAAI,IAAI,CAAC,KAAK,CAAC,UAAU;oBAC3D,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;aAClE;QACH,CAAC,CAAC;IA5PF,CAAC;IAEe,oBAAoB;QAClC,IAAI,CAAC,eAAe,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;IAC7E,CAAC;IAEe,iBAAiB;QAC/B,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;IAC1E,CAAC;IAOe,MAAM;QACpB,MAAM,EACJ,MAAM,EACN,KAAK,EACL,MAAM,EACN,aAAa,EACb,OAAO,EACP,QAAQ,EACR,cAAc,EACd,QAAQ,EACR,SAAS,EACT,CAAC,EACD,CAAC,EACD,KAAK,EACL,MAAM,EACN,SAAS,EACT,QAAQ,EACR,eAAe,EACf,UAAU,EACV,WAAW,EACX,KAAK,EACL,YAAY,EACZ,gBAAgB,EAChB,KAAK,EACL,SAAS,EACT,OAAO,EACP,SAAS,EACT,SAAS,EACT,KAAK,EACL,SAAS,EACT,UAAU,EACV,qBAAqB,EACrB,UAAU,EACV,MAAM,EACN,EAAE,EACF,GAAG,KAAK,EACT,GAAG,IAAI,CAAC,KAAK,CAAC;QAEf,IAAI,aAAa,GAAwB,EAAE,CAAC;QAC5C,IAAI,CAAC,IAAI,CAAC,EAAE;YACV,aAAa,GAAG;gBACd,IAAI,EAAE,CAAC,IAAI,CAAC;gBACZ,GAAG,EAAE,CAAC,IAAI,CAAC;gBACX,SAAS,EAAE,MAAM;aAClB,CAAC;SACH;QAED,MAAM,cAAc,GAAwB;YAC1C,GAAG,aAAa;YAChB,MAAM,EAAE,EAAE;YACV,KAAK;YACL,MAAM;SACP,CAAC;QAEF,MAAM,WAAW,GAAwB;YACvC,QAAQ;YACR,SAAS;YACT,QAAQ;YACR,SAAS;SACV,CAAC;QACF,MAAM,wBAAwB,GAAwB;YACpD,GAAG,cAAc;YACjB,GAAG,WAAW;SACf,CAAC;QAEF,MAAM,OAAO,GAAG,IAAI,CAAC,gBAAgB,CACnC,aAAa,EACb,iBAAiB,EACjB,IAAI,CACL,CAAC;QAEF,OAAO,CACL,oBAAC,UAAU,IACT,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,oBAAoB,EAAE,KAAK,EAC3B,UAAU,EAAE,KAAK,EACjB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAU,CAAC,aAAa,EAAE,SAAS,CAAC,EAC/C,WAAW,EAAE,OAAO,EACpB,WAAW,EAAE,SAAS,EACtB,SAAS,EAAE,SAAS,IAAI,0BAA0B,CAAC,KAAK,EACxD,qBAAqB,EAAE,IAAI,iBACf,kBAAkB,KAC1B,KAAK;YAER,KAAK,IAAI,oBAAC,UAAU,CAAC,QAAQ,IAAC,KAAK,EAAE,eAAe,GAAI;YACzD,oBAAC,mBAAmB,IAAC,cAAc,EAAE,cAAc;gBACjD,oBAAC,UAAU,CAAC,IAAI,IACd,SAAS,EAAE,UAAU,CACnB,kBAAkB,EAClB,SAAS,IAAI,IAAI,CAAC,4BAA4B,CAAC,SAAS,CAAC,CAC1D,iBACW,uBAAuB,EACnC,KAAK,EAAE,wBAAwB,EAC/B,aAAa,EAAE,IAAI,CAAC,2BAA2B;oBAE9C,CAAC,UAAU;wBACV,CAAC,MAAM,IAAI,CACT,oBAAC,UAAU,CAAC,QAAQ,IAClB,SAAS,EAAE,KAAK,EAChB,KAAK,EAAE,UAAU,iBACL,kBAAkB,GAC9B,CACH,CAAC;oBACJ,oBAAC,UAAU,CAAC,OAAO,IACjB,SAAS,EAAE,gBAAgB,EAC3B,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,YAAY,EAAE,IAEzD,IAAI,CAAC,KAAK,CAAC,QAAQ,CACD;oBACpB,MAAM;wBACL,CAAC,OAAO,IAAI,CACV,oBAAC,UAAU,CAAC,SAAS,IAAC,KAAK,EAAE,WAAW,IACrC,OAAO,CACa,CACxB,CAAC,CACY,CACE,CACX,CACd,CAAC;IACJ,CAAC;IAEO,4BAA4B,CAAC,SAA0B;QAC7D,QAAQ,SAAS,EAAE;YACjB,KAAK,eAAe,CAAC,OAAO;gBAC1B,OAAO,qBAAqB,CAAC;YAC/B,KAAK,eAAe,CAAC,GAAG;gBACtB,OAAO,gBAAgB,CAAC;YAC1B,KAAK,eAAe,CAAC,QAAQ;gBAC3B,OAAO,sBAAsB,CAAC;YAChC,KAAK,eAAe,CAAC,IAAI;gBACvB,OAAO,iBAAiB,CAAC;YAC3B,KAAK,eAAe,CAAC,MAAM;gBACzB,OAAO,mBAAmB,CAAC;YAC7B,KAAK,eAAe,CAAC,KAAK;gBACxB,OAAO,kBAAkB,CAAC;YAC5B,KAAK,eAAe,CAAC,UAAU;gBAC7B,OAAO,wBAAwB,CAAC;YAClC,KAAK,eAAe,CAAC,MAAM;gBACzB,OAAO,mBAAmB,CAAC;YAC7B,KAAK,eAAe,CAAC,WAAW;gBAC9B,OAAO,yBAAyB,CAAC;SACpC;IACH,CAAC;IAES,gBAAgB,CACxB,aAA4C;IAC5C,0BAA0B,CAAC,mBAA6C,KAAK;IAC7E,0BAA0B,CAAC,sBAA+B,KAAK;QAE/D,IAAI,aAAa,KAAK,SAAS;YAAE,OAAO,SAAS,CAAC;QAElD,MAAM,OAAO,GAAsB,EAAE,CAAC;QACtC,aAAa,CAAC,OAAO,CAAC,CAAC,MAAuB,EAAE,KAAa,EAAE,EAAE;YAC/D,IAAI,UAAU,GAAG,EAAE,CAAC;YACpB,uBAAuB;YACvB,IAAI,WAAW,GAAG,UAAU,CAC1B,CAAC,mBAAmB,IAAI,oBAAoB,EAC5C,CAAC,mBAAmB,IAAI,iBAAiB,MAAM,CAAC,IAAI,EAAE,EACtD,MAAM,CAAC,SAAS,CACjB,CAAC;YACF,IAAI,mBAAmB,GAAG,KAAK,CAAC;YAEhC,QAAQ,MAAM,CAAC,IAAI,EAAE;gBACnB,KAAK,gBAAgB,CAAC,EAAE;oBACtB,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;oBAC3C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,mBAAmB,GAAG,IAAI,CAAC;oBAC3B,MAAM;gBACR,KAAK,gBAAgB,CAAC,KAAK;oBACzB,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;oBAC9C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,mBAAmB,GAAG,IAAI,CAAC;oBAC3B,MAAM;gBACR,KAAK,gBAAgB,CAAC,GAAG;oBACvB,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;oBAC5C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,mBAAmB,GAAG,IAAI,CAAC;oBAC3B,MAAM;gBACR,KAAK,gBAAgB,CAAC,EAAE;oBACtB,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;oBAC3C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,MAAM;gBACR,KAAK,gBAAgB,CAAC,MAAM;oBAC1B,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;oBAC/C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,MAAM;gBACR,KAAK,gBAAgB,CAAC,KAAK;oBACzB,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;oBAC9C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,MAAM;gBACR,KAAK,gBAAgB,CAAC,IAAI;oBACxB,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;oBAC7C,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,mBAAmB,GAAG,IAAI,CAAC;oBAC3B,MAAM;gBACR,KAAK,gBAAgB,CAAC,QAAQ;oBAC5B,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;oBACjD,WAAW,GAAG,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;oBAC1D,mBAAmB,GAAG,IAAI,CAAC;oBAC3B,MAAM;aACT;YAED,IAAI,MAAM,CAAC,KAAK;gBAAE,UAAU,GAAG,MAAM,CAAC,KAAK,CAAC;YAE5C,OAAO,CAAC,IAAI,CACV,oBAAC,MAAM,IACL,SAAS,EAAE,WAAW,EACtB,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,SAAS,EAAE,mBAAmB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,EAC7D,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE,EACrB,OAAO,EAAE,MAAM,CAAC,OAAO,IAEtB,UAAU,CACJ,CACV,CAAC;QACJ,CAAC,CAAC,CAAC;QACH,OAAO,OAAO,CAAC;IACjB,CAAC;;AAvPa,mBAAY,GAAyB;IACjD,QAAQ,EAAE,MAAM;IAChB,KAAK,EAAE,KAAK;IACZ,UAAU,EAAE,KAAK;IACjB,SAAS,EAAE,KAAK;IAChB,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,IAAI;IACX,KAAK,EAAE,IAAI;IACX,SAAS,EAAE,KAAK;CACjB,AATyB,CASxB;SAXS,MAAM","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Dialog\n */\n\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport type { DialogButtonDef } from \"@itwin/appui-abstract\";\nimport { DialogButtonType } from \"@itwin/appui-abstract\";\nimport { Dialog as BaseDialog, Button } from \"@itwin/itwinui-react\";\nimport { DivWithOutsideClick } from \"../base/DivWithOutsideClick\";\nimport { UiCore } from \"../UiCore\";\nimport type { CommonProps } from \"../utils/Props\";\nimport type { Omit } from \"../utils/typeUtils\";\nimport \"./Dialog.scss\";\n\ntype ButtonProps = React.ComponentPropsWithoutRef<typeof Button>;\n\n// cspell:ignore focustrap\n\n/** Enum for dialog alignment\n * @public\n */\nexport enum DialogAlignment {\n  TopLeft = \"top-left\",\n  Top = \"top\",\n  TopRight = \"top-right\",\n  Left = \"left\",\n  Center = \"center\",\n  Right = \"right\",\n  BottomLeft = \"bottom-left\",\n  Bottom = \"bottom\",\n  BottomRight = \"bottom-right\",\n}\n\n/** Properties for the [[Dialog]] component\n * @public\n */\nexport interface DialogProps\n  extends Omit<React.AllHTMLAttributes<HTMLDivElement>, \"title\">,\n    CommonProps {\n  /** Indicates whether to show dialog or not */\n  opened: boolean;\n\n  /** Indicates whether the user can resize dialog with cursor. Default: false */\n  resizable?: boolean;\n  /** Indicates whether the user can move dialog with cursor. Default: false */\n  movable?: boolean;\n  /** Indicates whether the content should be inset. Default: true */\n  inset?: boolean;\n  /** Indicates whether the focus should be trapped within the dialog. Default: false */\n  trapFocus?: boolean;\n\n  /** Whether the hide the header. Default: false */\n  hideHeader?: boolean;\n  /** Override for the header */\n  header?: React.ReactNode;\n  /** Title to show in title bar of dialog */\n  title?: string | React.ReactElement;\n  /** Footer to show at bottom of dialog. Note: will override buttonCluster */\n  footer?: string | React.ReactElement;\n  /** List of DialogButtonDef objects specifying buttons and associated onClick events */\n  buttonCluster?: DialogButtonDef[];\n\n  /** Default alignment of dialog. */\n  alignment?: DialogAlignment;\n  /** Initial x/left position of dialog in px. */\n  x?: number;\n  /** Initial y/top position of dialog in px. */\n  y?: number;\n\n  /** onClick event for X button for dialog */\n  onClose?: () => void;\n  /** 'keyup' event for Esc key */\n  onEscape?: () => void;\n  /** Triggered when a click is triggered outside of this dialog. */\n  onOutsideClick?: (event: MouseEvent) => any;\n\n  /** Initial width of dialog. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: \"50%\" */\n  width?: string | number;\n  /** Initial height of dialog. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */\n  height?: string | number;\n  /** Minimum width that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 300px */\n  minWidth?: string | number;\n  /** Minimum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 135px */\n  minHeight?: string | number;\n  /** Maximum width that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 100% */\n  maxWidth?: string | number;\n  /** Maximum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */\n  maxHeight?: string | number;\n\n  /** Whether to show background overlay. Default: true.\n   * @note Modeless dialogs require an id and an implementation of onModelessPointerDown.\n   */\n  modal?: boolean;\n  /** An id for a modeless dialog */\n  modelessId?: string;\n  /** Pointer Down event handler when modeless (modal = false) */\n  onModelessPointerDown?: (event: React.PointerEvent, id: string) => void;\n\n  /** Custom CSS Style for overlay */\n  backgroundStyle?: React.CSSProperties;\n  /** Custom CSS Style for title */\n  titleStyle?: React.CSSProperties;\n  /** Custom CSS Style for footer */\n  footerStyle?: React.CSSProperties;\n  /** Custom CSS class name for the content */\n  contentClassName?: string;\n  /** Custom CSS Style for the content */\n  contentStyle?: React.CSSProperties;\n}\n\n/** Dialog React component with optional resizing and dragging functionality\n * @public\n */\nexport class Dialog extends React.Component<DialogProps> {\n  private _parentDocument = document;\n  public static defaultProps: Partial<DialogProps> = {\n    maxWidth: \"100%\",\n    width: \"50%\",\n    hideHeader: false,\n    resizable: false,\n    movable: false,\n    modal: true,\n    inset: true,\n    trapFocus: false,\n  };\n\n  constructor(props: DialogProps) {\n    super(props);\n  }\n\n  public override componentWillUnmount(): void {\n    this._parentDocument.removeEventListener(\"keyup\", this._handleKeyUp, true);\n  }\n\n  public override componentDidMount(): void {\n    this._parentDocument.addEventListener(\"keyup\", this._handleKeyUp, true);\n  }\n\n  // istanbul ignore next\n  public handleRefSet = (containerDiv: HTMLDivElement | null) => {\n    if (containerDiv) this._parentDocument = containerDiv.ownerDocument;\n  };\n\n  public override render(): React.ReactElement {\n    const {\n      opened,\n      title,\n      footer,\n      buttonCluster,\n      onClose,\n      onEscape,\n      onOutsideClick,\n      minWidth,\n      minHeight,\n      x,\n      y,\n      width,\n      height,\n      maxHeight,\n      maxWidth,\n      backgroundStyle,\n      titleStyle,\n      footerStyle,\n      style,\n      contentStyle,\n      contentClassName,\n      modal,\n      resizable,\n      movable,\n      className,\n      alignment,\n      inset,\n      trapFocus,\n      modelessId,\n      onModelessPointerDown,\n      hideHeader,\n      header,\n      as,\n      ...props\n    } = this.props;\n\n    let initialOffset: React.CSSProperties = {};\n    if (x || y) {\n      initialOffset = {\n        left: x ?? 0,\n        top: y ?? 0,\n        transform: \"none\",\n      };\n    }\n\n    const containerStyle: React.CSSProperties = {\n      ...initialOffset,\n      margin: \"\",\n      width,\n      height,\n    };\n\n    const minMaxStyle: React.CSSProperties = {\n      minWidth,\n      minHeight,\n      maxWidth,\n      maxHeight,\n    };\n    const dialogBaseContainerStyle: React.CSSProperties = {\n      ...containerStyle,\n      ...minMaxStyle,\n    };\n\n    const buttons = this.getFooterButtons(\n      buttonCluster,\n      \"high-visibility\",\n      true\n    );\n\n    return (\n      <BaseDialog\n        isOpen={opened}\n        onClose={onClose}\n        closeOnExternalClick={false}\n        closeOnEsc={false}\n        style={style}\n        className={classnames(\"core-dialog\", className)}\n        isDraggable={movable}\n        isResizable={resizable}\n        trapFocus={trapFocus && /* istanbul ignore next */ modal}\n        preventDocumentScroll={true}\n        data-testid=\"core-dialog-root\"\n        {...props}\n      >\n        {modal && <BaseDialog.Backdrop style={backgroundStyle} />}\n        <DivWithOutsideClick onOutsideClick={onOutsideClick}>\n          <BaseDialog.Main\n            className={classnames(\n              \"core-dialog-main\",\n              alignment && this.getCSSClassNameFromAlignment(alignment)\n            )}\n            data-testid=\"core-dialog-container\"\n            style={dialogBaseContainerStyle}\n            onPointerDown={this._handleContainerPointerDown}\n          >\n            {!hideHeader &&\n              (header || (\n                <BaseDialog.TitleBar\n                  titleText={title}\n                  style={titleStyle}\n                  data-testid=\"core-dialog-head\"\n                />\n              ))}\n            <BaseDialog.Content\n              className={contentClassName}\n              style={{ padding: inset ? undefined : 0, ...contentStyle }}\n            >\n              {this.props.children}\n            </BaseDialog.Content>\n            {footer ||\n              (buttons && (\n                <BaseDialog.ButtonBar style={footerStyle}>\n                  {buttons}\n                </BaseDialog.ButtonBar>\n              ))}\n          </BaseDialog.Main>\n        </DivWithOutsideClick>\n      </BaseDialog>\n    );\n  }\n\n  private getCSSClassNameFromAlignment(alignment: DialogAlignment): string {\n    switch (alignment) {\n      case DialogAlignment.TopLeft:\n        return \"core-align-top-left\";\n      case DialogAlignment.Top:\n        return \"core-align-top\";\n      case DialogAlignment.TopRight:\n        return \"core-align-top-right\";\n      case DialogAlignment.Left:\n        return \"core-align-left\";\n      case DialogAlignment.Center:\n        return \"core-align-center\";\n      case DialogAlignment.Right:\n        return \"core-align-right\";\n      case DialogAlignment.BottomLeft:\n        return \"core-align-bottom-left\";\n      case DialogAlignment.Bottom:\n        return \"core-align-bottom\";\n      case DialogAlignment.BottomRight:\n        return \"core-align-bottom-right\";\n    }\n  }\n\n  protected getFooterButtons(\n    buttonCluster: DialogButtonDef[] | undefined,\n    /* istanbul ignore next */ primaryStyleType: ButtonProps[\"styleType\"] = \"cta\",\n    /* istanbul ignore next */ noCoreButtonClasses: boolean = false\n  ): React.ReactNode[] | undefined {\n    if (buttonCluster === undefined) return undefined;\n\n    const buttons: React.ReactNode[] = [];\n    buttonCluster.forEach((button: DialogButtonDef, index: number) => {\n      let buttonText = \"\";\n      // istanbul ignore next\n      let buttonClass = classnames(\n        !noCoreButtonClasses && \"core-dialog-button\",\n        !noCoreButtonClasses && `dialog-button-${button.type}`,\n        button.className\n      );\n      let usePrimaryStyleType = false;\n\n      switch (button.type) {\n        case DialogButtonType.OK:\n          buttonText = UiCore.translate(\"dialog.ok\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.Retry:\n          buttonText = UiCore.translate(\"dialog.retry\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.Yes:\n          buttonText = UiCore.translate(\"dialog.yes\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.No:\n          buttonText = UiCore.translate(\"dialog.no\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          break;\n        case DialogButtonType.Cancel:\n          buttonText = UiCore.translate(\"dialog.cancel\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          break;\n        case DialogButtonType.Close:\n          buttonText = UiCore.translate(\"dialog.close\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          break;\n        case DialogButtonType.Next:\n          buttonText = UiCore.translate(\"dialog.next\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n        case DialogButtonType.Previous:\n          buttonText = UiCore.translate(\"dialog.previous\");\n          buttonClass = classnames(buttonClass, button.buttonStyle);\n          usePrimaryStyleType = true;\n          break;\n      }\n\n      if (button.label) buttonText = button.label;\n\n      buttons.push(\n        <Button\n          className={buttonClass}\n          disabled={button.disabled}\n          styleType={usePrimaryStyleType ? primaryStyleType : undefined}\n          key={index.toString()}\n          onClick={button.onClick}\n        >\n          {buttonText}\n        </Button>\n      );\n    });\n    return buttons;\n  }\n\n  private _handleKeyUp = (event: KeyboardEvent) => {\n    if (\n      event.key === Key.Escape.valueOf() &&\n      this.props.opened &&\n      this.props.onEscape\n    ) {\n      this.props.onEscape();\n    }\n  };\n\n  protected _handleContainerPointerDown = (event: React.PointerEvent): void => {\n    // istanbul ignore next\n    if (!this.props.modal) {\n      if (this.props.onModelessPointerDown && this.props.modelessId)\n        this.props.onModelessPointerDown(event, this.props.modelessId);\n    }\n  };\n}\n"]}

package/lib/esm/core-react/dialog/GlobalDialog.js

@@ -18,8 +18,7 @@ export class GlobalDialog extends React.Component {
             parentDocument: null,
         };
         this._handleRefSet = (popupDiv) => {
-            var _a;
-            const parentDocument = (_a = popupDiv === null || popupDiv === void 0 ? void 0 : popupDiv.ownerDocument) !== null && _a !== void 0 ? _a : null;
+            const parentDocument = popupDiv?.ownerDocument ?? null;
             if (parentDocument) {
                 this._container = parentDocument.createElement("div");
                 this._container.id =

package/lib/esm/core-react/dialog/GlobalDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalDialog.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/GlobalDialog.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAC;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAgBlC;;GAEG;AACH,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,SAGvC;IAOC,YAAY,KAAwB;QAClC,KAAK,CAAC,KAAK,CAAC,CAAC;QALU,UAAK,GAAsB;YAClD,cAAc,EAAE,IAAI;SACrB,CAAC;QAMM,kBAAa,GAAG,CAAC,QAA4B,EAAE,EAAE;;YACvD,MAAM,cAAc,GAAG,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,aAAa,mCAAI,IAAI,CAAC;YACvD,IAAI,cAAc,EAAE;gBAClB,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBACtD,IAAI,CAAC,UAAU,CAAC,EAAE;oBAChB,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,SAAS;wBACjC,CAAC,CAAC,UAAU,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE;wBACnC,CAAC,CAAC,aAAa,CAAC;gBACpB,IAAI,EAAE,GAAG,cAAc,CAAC,cAAc,CACpC,kBAAkB,CACD,CAAC;gBACpB,IAAI,CAAC,EAAE,EAAE;oBACP,EAAE,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;oBACzC,EAAE,CAAC,EAAE,GAAG,kBAAkB,CAAC;oBAC3B,cAAc,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;iBACrC;gBACD,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;gBAEhC,wDAAwD;gBACxD,IAAI,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC,CAAC;aACnC;QACH,CAAC,CAAC;IAvBF,CAAC;IAyBe,oBAAoB;QAClC,uBAAuB;QACvB,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE;YACpD,UAAU;YACV,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SAC5D;IACH,CAAC;IAEe,MAAM;QACpB,MAAM,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5C,OAAO,CACL,6BAAK,GAAG,EAAE,IAAI,CAAC,aAAa,IACzB,IAAI,CAAC,KAAK,CAAC,cAAc;YACxB,QAAQ,CAAC,YAAY,CACnB,oBAAC,MAAM,OAAK,KAAK,GAAI,EACrB,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAC/B,CACC,CACP,CAAC;IACJ,CAAC;CACF","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Dialog\n */\n\nimport * as React from \"react\";\nimport * as ReactDOM from \"react-dom\";\nimport type { DialogProps } from \"./Dialog\";\nimport { Dialog } from \"./Dialog\";\n\n/** Properties for the [[GlobalDialog]] component\n * @public\n */\nexport interface GlobalDialogProps extends DialogProps {\n  identifier?: string;\n}\n\n/** State properties for the [[GlobalDialog]] component\n * @public\n */\nexport interface GlobalDialogState {\n  parentDocument: Document | null;\n}\n\n/** GlobalDialog React component used to display a [[Dialog]] on the top of screen\n * @public\n */\nexport class GlobalDialog extends React.Component<\n  GlobalDialogProps,\n  GlobalDialogState\n> {\n  private _container?: HTMLDivElement;\n\n  public override readonly state: GlobalDialogState = {\n    parentDocument: null,\n  };\n\n  constructor(props: GlobalDialogProps) {\n    super(props);\n  }\n\n  private _handleRefSet = (popupDiv: HTMLElement | null) => {\n    const parentDocument = popupDiv?.ownerDocument ?? null;\n    if (parentDocument) {\n      this._container = parentDocument.createElement(\"div\");\n      this._container.id =\n        this.props.identifier !== undefined\n          ? `dialog-${this.props.identifier}`\n          : \"core-dialog\";\n      let rt = parentDocument.getElementById(\n        \"core-dialog-root\"\n      ) as HTMLDivElement;\n      if (!rt) {\n        rt = parentDocument.createElement(\"div\");\n        rt.id = \"core-dialog-root\";\n        parentDocument.body.appendChild(rt);\n      }\n      rt.appendChild(this._container);\n\n      // used to support component rendering in pop-out window\n      this.setState({ parentDocument });\n    }\n  };\n\n  public override componentWillUnmount() {\n    // istanbul ignore else\n    if (this._container && this._container.parentElement) {\n      // cleanup\n      this._container.parentElement.removeChild(this._container);\n    }\n  }\n\n  public override render(): React.ReactNode {\n    const { identifier, ...props } = this.props;\n    return (\n      <div ref={this._handleRefSet}>\n        {this.state.parentDocument &&\n          ReactDOM.createPortal(\n            <Dialog {...props} />,\n            this.state.parentDocument.body\n          )}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"GlobalDialog.js","sourceRoot":"","sources":["../../../../src/core-react/dialog/GlobalDialog.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAC;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAgBlC;;GAEG;AACH,MAAM,OAAO,YAAa,SAAQ,KAAK,CAAC,SAGvC;IAOC,YAAY,KAAwB;QAClC,KAAK,CAAC,KAAK,CAAC,CAAC;QALU,UAAK,GAAsB;YAClD,cAAc,EAAE,IAAI;SACrB,CAAC;QAMM,kBAAa,GAAG,CAAC,QAA4B,EAAE,EAAE;YACvD,MAAM,cAAc,GAAG,QAAQ,EAAE,aAAa,IAAI,IAAI,CAAC;YACvD,IAAI,cAAc,EAAE;gBAClB,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBACtD,IAAI,CAAC,UAAU,CAAC,EAAE;oBAChB,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,SAAS;wBACjC,CAAC,CAAC,UAAU,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE;wBACnC,CAAC,CAAC,aAAa,CAAC;gBACpB,IAAI,EAAE,GAAG,cAAc,CAAC,cAAc,CACpC,kBAAkB,CACD,CAAC;gBACpB,IAAI,CAAC,EAAE,EAAE;oBACP,EAAE,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;oBACzC,EAAE,CAAC,EAAE,GAAG,kBAAkB,CAAC;oBAC3B,cAAc,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;iBACrC;gBACD,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;gBAEhC,wDAAwD;gBACxD,IAAI,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC,CAAC;aACnC;QACH,CAAC,CAAC;IAvBF,CAAC;IAyBe,oBAAoB;QAClC,uBAAuB;QACvB,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE;YACpD,UAAU;YACV,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SAC5D;IACH,CAAC;IAEe,MAAM;QACpB,MAAM,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5C,OAAO,CACL,6BAAK,GAAG,EAAE,IAAI,CAAC,aAAa,IACzB,IAAI,CAAC,KAAK,CAAC,cAAc;YACxB,QAAQ,CAAC,YAAY,CACnB,oBAAC,MAAM,OAAK,KAAK,GAAI,EACrB,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAC/B,CACC,CACP,CAAC;IACJ,CAAC;CACF","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Dialog\n */\n\nimport * as React from \"react\";\nimport * as ReactDOM from \"react-dom\";\nimport type { DialogProps } from \"./Dialog\";\nimport { Dialog } from \"./Dialog\";\n\n/** Properties for the [[GlobalDialog]] component\n * @public\n */\nexport interface GlobalDialogProps extends DialogProps {\n  identifier?: string;\n}\n\n/** State properties for the [[GlobalDialog]] component\n * @public\n */\nexport interface GlobalDialogState {\n  parentDocument: Document | null;\n}\n\n/** GlobalDialog React component used to display a [[Dialog]] on the top of screen\n * @public\n */\nexport class GlobalDialog extends React.Component<\n  GlobalDialogProps,\n  GlobalDialogState\n> {\n  private _container?: HTMLDivElement;\n\n  public override readonly state: GlobalDialogState = {\n    parentDocument: null,\n  };\n\n  constructor(props: GlobalDialogProps) {\n    super(props);\n  }\n\n  private _handleRefSet = (popupDiv: HTMLElement | null) => {\n    const parentDocument = popupDiv?.ownerDocument ?? null;\n    if (parentDocument) {\n      this._container = parentDocument.createElement(\"div\");\n      this._container.id =\n        this.props.identifier !== undefined\n          ? `dialog-${this.props.identifier}`\n          : \"core-dialog\";\n      let rt = parentDocument.getElementById(\n        \"core-dialog-root\"\n      ) as HTMLDivElement;\n      if (!rt) {\n        rt = parentDocument.createElement(\"div\");\n        rt.id = \"core-dialog-root\";\n        parentDocument.body.appendChild(rt);\n      }\n      rt.appendChild(this._container);\n\n      // used to support component rendering in pop-out window\n      this.setState({ parentDocument });\n    }\n  };\n\n  public override componentWillUnmount() {\n    // istanbul ignore else\n    if (this._container && this._container.parentElement) {\n      // cleanup\n      this._container.parentElement.removeChild(this._container);\n    }\n  }\n\n  public override render(): React.ReactNode {\n    const { identifier, ...props } = this.props;\n    return (\n      <div ref={this._handleRefSet}>\n        {this.state.parentDocument &&\n          ReactDOM.createPortal(\n            <Dialog {...props} />,\n            this.state.parentDocument.body\n          )}\n      </div>\n    );\n  }\n}\n"]}

package/lib/esm/core-react/elementseparator/ElementSeparator.js

@@ -32,8 +32,8 @@ const useElementSeparatorPointerHandler = ({ onResizeHandleDragChanged, onResize
     const pointerOutOfBounds = useRef(false);
     const [isElementDragged, setIsDragged] = useState(false);
     const [isElementHovered, setIsHovered] = useState(false);
-    const isGroupDragged = isResizeHandleBeingDragged !== null && isResizeHandleBeingDragged !== void 0 ? isResizeHandleBeingDragged : isElementDragged;
-    const isGroupHovered = isResizeHandleHovered !== null && isResizeHandleHovered !== void 0 ? isResizeHandleHovered : isElementHovered;
+    const isGroupDragged = isResizeHandleBeingDragged ?? isElementDragged;
+    const isGroupHovered = isResizeHandleHovered ?? isElementHovered;
     useConditionalCleanup(isElementDragged && !!onResizeHandleDragChanged, () => onResizeHandleDragChanged(false));
     useConditionalCleanup(isElementHovered && !!onResizeHandleHoverChanged, () => onResizeHandleHoverChanged(false));
     if (isGroupHovered && pointerOutOfBounds.current)

package/lib/esm/core-react/elementseparator/ElementSeparator.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElementSeparator.js","sourceRoot":"","sources":["../../../../src/core-react/elementseparator/ElementSeparator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module ElementSeparator\n */\n\nimport \"./ElementSeparator.scss\";\nimport * as React from \"react\";\nimport {\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { Orientation } from \"../enums/Orientation\";\nimport type { CommonProps } from \"../utils/Props\";\nimport { useThrottledFn } from \"../utils/hooks/useThrottledFn\";\nimport { UiCore } from \"../UiCore\";\n\n/**\n * Results returned by onRatioChanged callback for determining new ratio and whether the ratio was updated.\n * @public\n */\nexport interface RatioChangeResult {\n  ratio: number;\n}\n\n/** Properties of [[ElementSeparator]] React component\n * @public\n */\nexport interface ElementSeparatorProps extends CommonProps {\n  /** Separator orientation */\n  orientation: Orientation;\n  /** Ratio between left cell and right cell */\n  ratio: number;\n  /** Area width or height (depending on orientation) in pixels */\n  movableArea?: number;\n  /** Separator width or height in pixels. 30 by default */\n  separatorSize?: number;\n  /** Callback to ratio changed event */\n  onRatioChanged?: (ratio: number) => void | RatioChangeResult;\n  /** Is resize handle hovered */\n  isResizeHandleHovered?: boolean;\n  /** Callback to hover event change */\n  onResizeHandleHoverChanged?: (isHovered: boolean) => void;\n  /** Is resize handle being dragged */\n  isResizeHandleBeingDragged?: boolean;\n  /** Callback to drag event change */\n  onResizeHandleDragChanged?: (isDragStarted: boolean) => void;\n}\n\nfunction getCurrentGlobalPosition(\n  orientation: Orientation,\n  e: PointerEvent | React.PointerEvent\n) {\n  return orientation === Orientation.Horizontal ? e.clientX : e.clientY;\n}\n\nconst useConditionalCleanup = (condition: boolean, cleanup: () => void) => {\n  const conditionRef = useRef(condition);\n  const cleanupRef = useRef(cleanup);\n\n  conditionRef.current = condition;\n  cleanupRef.current = cleanup;\n\n  useEffect(() => {\n    return () => {\n      if (conditionRef.current) cleanupRef.current();\n    };\n  }, []);\n};\n\nconst useElementSeparatorPointerHandler = ({\n  onResizeHandleDragChanged,\n  onResizeHandleHoverChanged,\n  isResizeHandleBeingDragged,\n  isResizeHandleHovered,\n  movableArea,\n  ratio,\n  orientation,\n  onRatioChanged,\n}: ElementSeparatorProps) => {\n  const globalPosition = useRef(0);\n  const pointerOutOfBounds = useRef(false);\n\n  const [isElementDragged, setIsDragged] = useState(false);\n  const [isElementHovered, setIsHovered] = useState(false);\n  const isGroupDragged = isResizeHandleBeingDragged ?? isElementDragged;\n  const isGroupHovered = isResizeHandleHovered ?? isElementHovered;\n\n  useConditionalCleanup(isElementDragged && !!onResizeHandleDragChanged, () =>\n    onResizeHandleDragChanged!(false)\n  );\n  useConditionalCleanup(isElementHovered && !!onResizeHandleHoverChanged, () =>\n    onResizeHandleHoverChanged!(false)\n  );\n\n  if (isGroupHovered && pointerOutOfBounds.current)\n    pointerOutOfBounds.current = false;\n\n  const stopDrag = useCallback(() => {\n    // istanbul ignore else\n    if (isGroupDragged) {\n      setIsDragged(false);\n      if (onResizeHandleDragChanged) onResizeHandleDragChanged(false);\n    }\n  }, [isGroupDragged, onResizeHandleDragChanged]);\n\n  const startDrag = useCallback(\n    (e: PointerEvent | React.PointerEvent) => {\n      globalPosition.current = getCurrentGlobalPosition(orientation, e);\n\n      // istanbul ignore else\n      if (!isGroupDragged) {\n        setIsDragged(true);\n        if (onResizeHandleDragChanged) onResizeHandleDragChanged(true);\n      }\n    },\n    [isGroupDragged, orientation, onResizeHandleDragChanged]\n  );\n\n  const onPointerUp = useCallback(() => {\n    stopDrag();\n  }, [stopDrag]);\n\n  const onThrottledPointerMove = useThrottledFn(\n    (e: PointerEvent | React.PointerEvent) => {\n      if (!movableArea) {\n        stopDrag();\n        return;\n      }\n\n      const currentPosition = getCurrentGlobalPosition(orientation, e);\n      const positionChange = currentPosition - globalPosition.current;\n\n      // Should not need to recalculate if position on our movement axis does not change\n      if (Math.abs(positionChange) < 1) return;\n\n      const currentLocalPosition = movableArea * ratio + positionChange;\n      const newRatio = currentLocalPosition / movableArea;\n\n      globalPosition.current = currentPosition;\n      if (pointerOutOfBounds.current || !onRatioChanged) return;\n\n      const result = onRatioChanged(newRatio);\n      if (\n        result &&\n        result.ratio === ratio &&\n        !isGroupHovered &&\n        !pointerOutOfBounds.current\n      )\n        pointerOutOfBounds.current = true;\n    },\n    16,\n    [stopDrag, isGroupHovered, ratio, movableArea, onRatioChanged, orientation]\n  );\n\n  useEffect(() => {\n    return () => onThrottledPointerMove.cancel();\n  }, [onThrottledPointerMove]);\n\n  useLayoutEffect(() => {\n    if (isElementDragged) {\n      document.addEventListener(\"pointerup\", onPointerUp);\n      document.addEventListener(\"pointermove\", onThrottledPointerMove);\n    }\n\n    return () => {\n      document.removeEventListener(\"pointerup\", onPointerUp);\n      document.removeEventListener(\"pointermove\", onThrottledPointerMove);\n    };\n  }, [isElementDragged, onPointerUp, onThrottledPointerMove]);\n\n  const onPointerDown = useCallback(\n    (e: PointerEvent | React.PointerEvent) => {\n      if (!isGroupDragged) {\n        startDrag(e);\n      } else {\n        stopDrag();\n      }\n    },\n    [isGroupDragged, startDrag, stopDrag]\n  );\n\n  const onPointerOver = useCallback(() => {\n    // istanbul ignore next\n    if (isGroupHovered) return;\n\n    setIsHovered(true);\n    if (onResizeHandleHoverChanged) onResizeHandleHoverChanged(true);\n  }, [isGroupHovered, onResizeHandleHoverChanged]);\n\n  const onPointerOut = useCallback(() => {\n    // istanbul ignore next\n    if (!isGroupHovered) return;\n\n    setIsHovered(false);\n    if (onResizeHandleHoverChanged) onResizeHandleHoverChanged(false);\n  }, [isGroupHovered, onResizeHandleHoverChanged]);\n\n  return {\n    isHovered: isGroupHovered,\n    isDragged: isGroupDragged,\n    onPointerDown,\n    onPointerOver,\n    onPointerOut,\n  };\n};\n\nfunction getStyle(\n  orientation: Orientation,\n  separatorSize?: number\n): React.CSSProperties {\n  separatorSize = separatorSize || 30;\n\n  if (orientation === Orientation.Horizontal)\n    return {\n      width: separatorSize,\n      margin: `0px ${-Math.floor(separatorSize / 2)}px`,\n    };\n  return {\n    height: separatorSize,\n    margin: `${-Math.floor(separatorSize / 2)}px 1px`,\n  };\n}\n\n/** A movable button, which allows to change the ratio between left element and right element\n * @public\n */\nexport const ElementSeparator = (props: ElementSeparatorProps) => {\n  const label = useRef(UiCore.translate(\"elementSeparator.label\"));\n  const [hasHoverHappened, setHasHoverHappened] = useState(false);\n  const { isDragged, isHovered, onPointerDown, onPointerOver, onPointerOut } =\n    useElementSeparatorPointerHandler(props);\n\n  const isHoverNeeded = isHovered || isDragged;\n  if (!hasHoverHappened && isHoverNeeded) setHasHoverHappened(isHoverNeeded);\n\n  // This is done to avoid fade-out animation when first rendering.\n  const unhoverClass = hasHoverHappened\n    ? \"core-element-separator-group-unhovered\"\n    : \"\";\n\n  const classNames = classnames(\n    \"core-element-separator\",\n    props.orientation === Orientation.Horizontal\n      ? \"core-element-separator--horizontal\"\n      : \"core-element-separator--vertical\",\n    props.className,\n    isHoverNeeded ? \"core-element-separator-group-hovered\" : unhoverClass\n  );\n\n  const orientation = props.orientation;\n  const separatorSize = props.separatorSize;\n  const style = useMemo(\n    () => getStyle(orientation, separatorSize),\n    [orientation, separatorSize]\n  );\n  const styles: React.CSSProperties = {\n    ...style,\n    ...props.style,\n  };\n\n  return (\n    <button\n      style={styles}\n      className={classNames}\n      onPointerDown={onPointerDown}\n      onPointerOver={onPointerOver}\n      onPointerOut={onPointerOut}\n      aria-label={label.current}\n    />\n  );\n};\n"]}
+{"version":3,"file":"ElementSeparator.js","sourceRoot":"","sources":["../../../../src/core-react/elementseparator/ElementSeparator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module ElementSeparator\n */\n\nimport \"./ElementSeparator.scss\";\nimport * as React from \"react\";\nimport {\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { Orientation } from \"../enums/Orientation\";\nimport type { CommonProps } from \"../utils/Props\";\nimport { useThrottledFn } from \"../utils/hooks/useThrottledFn\";\nimport { UiCore } from \"../UiCore\";\n\n/**\n * Results returned by onRatioChanged callback for determining new ratio and whether the ratio was updated.\n * @public\n */\nexport interface RatioChangeResult {\n  ratio: number;\n}\n\n/** Properties of [[ElementSeparator]] React component\n * @public\n */\nexport interface ElementSeparatorProps extends CommonProps {\n  /** Separator orientation */\n  orientation: Orientation;\n  /** Ratio between left cell and right cell */\n  ratio: number;\n  /** Area width or height (depending on orientation) in pixels */\n  movableArea?: number;\n  /** Separator width or height in pixels. 30 by default */\n  separatorSize?: number;\n  /** Callback to ratio changed event */\n  onRatioChanged?: (ratio: number) => void | RatioChangeResult;\n  /** Is resize handle hovered */\n  isResizeHandleHovered?: boolean;\n  /** Callback to hover event change */\n  onResizeHandleHoverChanged?: (isHovered: boolean) => void;\n  /** Is resize handle being dragged */\n  isResizeHandleBeingDragged?: boolean;\n  /** Callback to drag event change */\n  onResizeHandleDragChanged?: (isDragStarted: boolean) => void;\n}\n\nfunction getCurrentGlobalPosition(\n  orientation: Orientation,\n  e: PointerEvent | React.PointerEvent\n) {\n  return orientation === Orientation.Horizontal ? e.clientX : e.clientY;\n}\n\nconst useConditionalCleanup = (condition: boolean, cleanup: () => void) => {\n  const conditionRef = useRef(condition);\n  const cleanupRef = useRef(cleanup);\n\n  conditionRef.current = condition;\n  cleanupRef.current = cleanup;\n\n  useEffect(() => {\n    return () => {\n      if (conditionRef.current) cleanupRef.current();\n    };\n  }, []);\n};\n\nconst useElementSeparatorPointerHandler = ({\n  onResizeHandleDragChanged,\n  onResizeHandleHoverChanged,\n  isResizeHandleBeingDragged,\n  isResizeHandleHovered,\n  movableArea,\n  ratio,\n  orientation,\n  onRatioChanged,\n}: ElementSeparatorProps) => {\n  const globalPosition = useRef(0);\n  const pointerOutOfBounds = useRef(false);\n\n  const [isElementDragged, setIsDragged] = useState(false);\n  const [isElementHovered, setIsHovered] = useState(false);\n  const isGroupDragged = isResizeHandleBeingDragged ?? isElementDragged;\n  const isGroupHovered = isResizeHandleHovered ?? isElementHovered;\n\n  useConditionalCleanup(isElementDragged && !!onResizeHandleDragChanged, () =>\n    onResizeHandleDragChanged!(false)\n  );\n  useConditionalCleanup(isElementHovered && !!onResizeHandleHoverChanged, () =>\n    onResizeHandleHoverChanged!(false)\n  );\n\n  if (isGroupHovered && pointerOutOfBounds.current)\n    pointerOutOfBounds.current = false;\n\n  const stopDrag = useCallback(() => {\n    // istanbul ignore else\n    if (isGroupDragged) {\n      setIsDragged(false);\n      if (onResizeHandleDragChanged) onResizeHandleDragChanged(false);\n    }\n  }, [isGroupDragged, onResizeHandleDragChanged]);\n\n  const startDrag = useCallback(\n    (e: PointerEvent | React.PointerEvent) => {\n      globalPosition.current = getCurrentGlobalPosition(orientation, e);\n\n      // istanbul ignore else\n      if (!isGroupDragged) {\n        setIsDragged(true);\n        if (onResizeHandleDragChanged) onResizeHandleDragChanged(true);\n      }\n    },\n    [isGroupDragged, orientation, onResizeHandleDragChanged]\n  );\n\n  const onPointerUp = useCallback(() => {\n    stopDrag();\n  }, [stopDrag]);\n\n  const onThrottledPointerMove = useThrottledFn(\n    (e: PointerEvent | React.PointerEvent) => {\n      if (!movableArea) {\n        stopDrag();\n        return;\n      }\n\n      const currentPosition = getCurrentGlobalPosition(orientation, e);\n      const positionChange = currentPosition - globalPosition.current;\n\n      // Should not need to recalculate if position on our movement axis does not change\n      if (Math.abs(positionChange) < 1) return;\n\n      const currentLocalPosition = movableArea * ratio + positionChange;\n      const newRatio = currentLocalPosition / movableArea;\n\n      globalPosition.current = currentPosition;\n      if (pointerOutOfBounds.current || !onRatioChanged) return;\n\n      const result = onRatioChanged(newRatio);\n      if (\n        result &&\n        result.ratio === ratio &&\n        !isGroupHovered &&\n        !pointerOutOfBounds.current\n      )\n        pointerOutOfBounds.current = true;\n    },\n    16,\n    [stopDrag, isGroupHovered, ratio, movableArea, onRatioChanged, orientation]\n  );\n\n  useEffect(() => {\n    return () => onThrottledPointerMove.cancel();\n  }, [onThrottledPointerMove]);\n\n  useLayoutEffect(() => {\n    if (isElementDragged) {\n      document.addEventListener(\"pointerup\", onPointerUp);\n      document.addEventListener(\"pointermove\", onThrottledPointerMove);\n    }\n\n    return () => {\n      document.removeEventListener(\"pointerup\", onPointerUp);\n      document.removeEventListener(\"pointermove\", onThrottledPointerMove);\n    };\n  }, [isElementDragged, onPointerUp, onThrottledPointerMove]);\n\n  const onPointerDown = useCallback(\n    (e: PointerEvent | React.PointerEvent) => {\n      if (!isGroupDragged) {\n        startDrag(e);\n      } else {\n        stopDrag();\n      }\n    },\n    [isGroupDragged, startDrag, stopDrag]\n  );\n\n  const onPointerOver = useCallback(() => {\n    // istanbul ignore next\n    if (isGroupHovered) return;\n\n    setIsHovered(true);\n    if (onResizeHandleHoverChanged) onResizeHandleHoverChanged(true);\n  }, [isGroupHovered, onResizeHandleHoverChanged]);\n\n  const onPointerOut = useCallback(() => {\n    // istanbul ignore next\n    if (!isGroupHovered) return;\n\n    setIsHovered(false);\n    if (onResizeHandleHoverChanged) onResizeHandleHoverChanged(false);\n  }, [isGroupHovered, onResizeHandleHoverChanged]);\n\n  return {\n    isHovered: isGroupHovered,\n    isDragged: isGroupDragged,\n    onPointerDown,\n    onPointerOver,\n    onPointerOut,\n  };\n};\n\nfunction getStyle(\n  orientation: Orientation,\n  separatorSize?: number\n): React.CSSProperties {\n  separatorSize = separatorSize || 30;\n\n  if (orientation === Orientation.Horizontal)\n    return {\n      width: separatorSize,\n      margin: `0px ${-Math.floor(separatorSize / 2)}px`,\n    };\n  return {\n    height: separatorSize,\n    margin: `${-Math.floor(separatorSize / 2)}px 1px`,\n  };\n}\n\n/** A movable button, which allows to change the ratio between left element and right element\n * @public\n */\nexport const ElementSeparator = (props: ElementSeparatorProps) => {\n  const label = useRef(UiCore.translate(\"elementSeparator.label\"));\n  const [hasHoverHappened, setHasHoverHappened] = useState(false);\n  const { isDragged, isHovered, onPointerDown, onPointerOver, onPointerOut } =\n    useElementSeparatorPointerHandler(props);\n\n  const isHoverNeeded = isHovered || isDragged;\n  if (!hasHoverHappened && isHoverNeeded) setHasHoverHappened(isHoverNeeded);\n\n  // This is done to avoid fade-out animation when first rendering.\n  const unhoverClass = hasHoverHappened\n    ? \"core-element-separator-group-unhovered\"\n    : \"\";\n\n  const classNames = classnames(\n    \"core-element-separator\",\n    props.orientation === Orientation.Horizontal\n      ? \"core-element-separator--horizontal\"\n      : \"core-element-separator--vertical\",\n    props.className,\n    isHoverNeeded ? \"core-element-separator-group-hovered\" : unhoverClass\n  );\n\n  const orientation = props.orientation;\n  const separatorSize = props.separatorSize;\n  const style = useMemo(\n    () => getStyle(orientation, separatorSize),\n    [orientation, separatorSize]\n  );\n  const styles: React.CSSProperties = {\n    ...style,\n    ...props.style,\n  };\n\n  return (\n    <button\n      style={styles}\n      className={classNames}\n      onPointerDown={onPointerDown}\n      onPointerOver={onPointerOver}\n      onPointerOut={onPointerOut}\n      aria-label={label.current}\n    />\n  );\n};\n"]}

package/lib/esm/core-react/expandable/ExpandableList.d.ts

@@ -1,7 +1,6 @@
 /** @packageDocumentation
  * @module Expandable
  */
-import "./ExpandableList.scss";
 import * as React from "react";
 import type { CommonProps } from "../utils/Props";
 /** Properties for [[ExpandableList]] component

package/lib/esm/core-react/expandable/ExpandableList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableList.d.ts","sourceRoot":"","sources":["../../../../src/core-react/expandable/ExpandableList.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAE/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,iEAAiE;IACjE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,cAAc;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,gBAAgB;AAChB,UAAU,mBAAmB;IAC3B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED;;;GAGG;AACH,qBAAa,cAAe,SAAQ,KAAK,CAAC,aAAa,CACrD,mBAAmB,EACnB,mBAAmB,CACpB;gBACa,KAAK,EAAE,mBAAmB;IAMtC,OAAc,YAAY,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAGtD;IAGF,OAAO,CAAC,kBAAkB,CAexB;IAEF,OAAO,CAAC,YAAY;IAYpB,gBAAgB;IACA,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;IASjD,MAAM,IAAI,KAAK,CAAC,YAAY;CAa7C"}
+{"version":3,"file":"ExpandableList.d.ts","sourceRoot":"","sources":["../../../../src/core-react/expandable/ExpandableList.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,iEAAiE;IACjE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,cAAc;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,gBAAgB;AAChB,UAAU,mBAAmB;IAC3B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED;;;GAGG;AACH,qBAAa,cAAe,SAAQ,KAAK,CAAC,aAAa,CACrD,mBAAmB,EACnB,mBAAmB,CACpB;gBACa,KAAK,EAAE,mBAAmB;IAMtC,OAAc,YAAY,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAGtD;IAGF,OAAO,CAAC,kBAAkB,CAexB;IAEF,OAAO,CAAC,YAAY;IAYpB,gBAAgB;IACA,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;IASjD,MAAM,IAAI,KAAK,CAAC,YAAY;CAa7C"}

package/lib/esm/core-react/expandable/ExpandableList.js

@@ -5,7 +5,6 @@
 /** @packageDocumentation
  * @module Expandable
  */
-import "./ExpandableList.scss";
 import classnames from "classnames";
 import * as React from "react";
 /**

package/lib/esm/core-react/expandable/ExpandableList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableList.js","sourceRoot":"","sources":["../../../../src/core-react/expandable/ExpandableList.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B;;;GAGG;AACH,MAAa,cAAe,SAAQ,KAAK,CAAC,aAGzC;IACC,YAAY,KAA0B;QACpC,KAAK,CAAC,KAAK,CAAC,CAAC;QAUf,mBAAmB;QACX,uBAAkB,GAAG,CAC3B,KAAa,EACb,QAAuC,EACvC,EAAE;YACF,IAAI,WAAW,GAAG,KAAK,CAAC;YAExB,IAAI,IAAI,CAAC,KAAK,CAAC,mBAAmB,IAAI,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW;gBACpE,WAAW,GAAG,CAAC,CAAC,CAAC;YAEnB,IAAI,CAAC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC,CAAC;YAE/B,uBAAuB;YACvB,IAAI,QAAQ,EAAE;gBACZ,QAAQ,CAAC,WAAW,KAAK,KAAK,CAAC,CAAC,CAAC,oCAAoC;aACtE;QACH,CAAC,CAAC;QAxBA,IAAI,CAAC,KAAK,GAAG,EAAE,WAAW,EAAE,IAAI,CAAC,KAAK,CAAC,kBAAmB,EAAE,CAAC;IAC/D,CAAC;IAyBO,YAAY;QAClB,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAU,EAAE,CAAC,EAAE,EAAE;YAC/D,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;gBAC/B,GAAG,EAAE,CAAC;gBACN,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB;oBACrC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW;oBAC9B,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU;gBAC1B,QAAQ,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;aACtE,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA8B;QAC/D,IACE,IAAI,CAAC,KAAK,CAAC,kBAAkB,KAAK,SAAS,CAAC,kBAAkB;YAC9D,IAAI,CAAC,KAAK,CAAC,kBAAkB,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW,EACxD;YACA,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,kBAAmB,EAAE,CAAC,CAAC,CAAC;SAC3E;IACH,CAAC;IAEe,MAAM;QACpB,OAAO,CACL,6BACE,SAAS,EAAE,UAAU,CACnB,+BAA+B,EAC/B,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,EACD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAEtB,IAAI,CAAC,YAAY,EAAE,CAChB,CACP,CAAC;IACJ,CAAC;;AAzDa,2BAAY,GAAiC;IACzD,gBAAgB,EAAE,KAAK;IACvB,kBAAkB,EAAE,CAAC;CACtB,AAHyB,CAGxB;SAbS,cAAc","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Expandable\n */\n\nimport \"./ExpandableList.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { CommonProps } from \"../utils/Props\";\n\n/** Properties for [[ExpandableList]] component\n * @public\n */\nexport interface ExpandableListProps extends CommonProps {\n  /** Index of the default active block */\n  defaultActiveBlock?: number;\n  /** Indicates whether to allow only one expanded block */\n  singleExpandOnly?: boolean;\n  /** Indicates whether the single expanded block is collapsible */\n  singleIsCollapsible?: boolean;\n  /** Content */\n  children?: React.ReactNode;\n}\n\n/** @internal */\ninterface ExpandableListState {\n  activeBlock: number;\n}\n\n/**\n * ExpandableList React component is a container for ExpandableBlock components.\n * @public\n */\nexport class ExpandableList extends React.PureComponent<\n  ExpandableListProps,\n  ExpandableListState\n> {\n  constructor(props: ExpandableListProps) {\n    super(props);\n\n    this.state = { activeBlock: this.props.defaultActiveBlock! };\n  }\n\n  public static defaultProps: Partial<ExpandableListProps> = {\n    singleExpandOnly: false,\n    defaultActiveBlock: 0,\n  };\n\n  // set active block\n  private _handleBlockToggle = (\n    index: number,\n    onToggle: (isExpanding: boolean) => any\n  ) => {\n    let activeBlock = index;\n\n    if (this.props.singleIsCollapsible && index === this.state.activeBlock)\n      activeBlock = -1;\n\n    this.setState({ activeBlock });\n\n    // istanbul ignore else\n    if (onToggle) {\n      onToggle(activeBlock === index); // fire the ExpandableBlock onToggle\n    }\n  };\n\n  private renderBlocks() {\n    return React.Children.map(this.props.children, (child: any, i) => {\n      return React.cloneElement(child, {\n        key: i,\n        isExpanded: this.props.singleExpandOnly\n          ? i === this.state.activeBlock\n          : child.props.isExpanded,\n        onToggle: this._handleBlockToggle.bind(this, i, child.props.onToggle),\n      });\n    });\n  }\n\n  /** @internal */\n  public override componentDidUpdate(prevProps: ExpandableListProps) {\n    if (\n      this.props.defaultActiveBlock !== prevProps.defaultActiveBlock &&\n      this.props.defaultActiveBlock !== this.state.activeBlock\n    ) {\n      this.setState((_, props) => ({ activeBlock: props.defaultActiveBlock! }));\n    }\n  }\n\n  public override render(): React.ReactElement {\n    return (\n      <div\n        className={classnames(\n          \"uicore-expandable-blocks-list\",\n          this.props.className\n        )}\n        style={this.props.style}\n      >\n        {this.renderBlocks()}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"ExpandableList.js","sourceRoot":"","sources":["../../../../src/core-react/expandable/ExpandableList.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B;;;GAGG;AACH,MAAa,cAAe,SAAQ,KAAK,CAAC,aAGzC;IACC,YAAY,KAA0B;QACpC,KAAK,CAAC,KAAK,CAAC,CAAC;QAUf,mBAAmB;QACX,uBAAkB,GAAG,CAC3B,KAAa,EACb,QAAuC,EACvC,EAAE;YACF,IAAI,WAAW,GAAG,KAAK,CAAC;YAExB,IAAI,IAAI,CAAC,KAAK,CAAC,mBAAmB,IAAI,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW;gBACpE,WAAW,GAAG,CAAC,CAAC,CAAC;YAEnB,IAAI,CAAC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC,CAAC;YAE/B,uBAAuB;YACvB,IAAI,QAAQ,EAAE;gBACZ,QAAQ,CAAC,WAAW,KAAK,KAAK,CAAC,CAAC,CAAC,oCAAoC;aACtE;QACH,CAAC,CAAC;QAxBA,IAAI,CAAC,KAAK,GAAG,EAAE,WAAW,EAAE,IAAI,CAAC,KAAK,CAAC,kBAAmB,EAAE,CAAC;IAC/D,CAAC;IAyBO,YAAY;QAClB,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAU,EAAE,CAAC,EAAE,EAAE;YAC/D,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;gBAC/B,GAAG,EAAE,CAAC;gBACN,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB;oBACrC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW;oBAC9B,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU;gBAC1B,QAAQ,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;aACtE,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA8B;QAC/D,IACE,IAAI,CAAC,KAAK,CAAC,kBAAkB,KAAK,SAAS,CAAC,kBAAkB;YAC9D,IAAI,CAAC,KAAK,CAAC,kBAAkB,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW,EACxD;YACA,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,kBAAmB,EAAE,CAAC,CAAC,CAAC;SAC3E;IACH,CAAC;IAEe,MAAM;QACpB,OAAO,CACL,6BACE,SAAS,EAAE,UAAU,CACnB,+BAA+B,EAC/B,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,EACD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAEtB,IAAI,CAAC,YAAY,EAAE,CAChB,CACP,CAAC;IACJ,CAAC;;AAzDa,2BAAY,GAAiC;IACzD,gBAAgB,EAAE,KAAK;IACvB,kBAAkB,EAAE,CAAC;CACtB,AAHyB,CAGxB;SAbS,cAAc","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Expandable\n */\n\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { CommonProps } from \"../utils/Props\";\n\n/** Properties for [[ExpandableList]] component\n * @public\n */\nexport interface ExpandableListProps extends CommonProps {\n  /** Index of the default active block */\n  defaultActiveBlock?: number;\n  /** Indicates whether to allow only one expanded block */\n  singleExpandOnly?: boolean;\n  /** Indicates whether the single expanded block is collapsible */\n  singleIsCollapsible?: boolean;\n  /** Content */\n  children?: React.ReactNode;\n}\n\n/** @internal */\ninterface ExpandableListState {\n  activeBlock: number;\n}\n\n/**\n * ExpandableList React component is a container for ExpandableBlock components.\n * @public\n */\nexport class ExpandableList extends React.PureComponent<\n  ExpandableListProps,\n  ExpandableListState\n> {\n  constructor(props: ExpandableListProps) {\n    super(props);\n\n    this.state = { activeBlock: this.props.defaultActiveBlock! };\n  }\n\n  public static defaultProps: Partial<ExpandableListProps> = {\n    singleExpandOnly: false,\n    defaultActiveBlock: 0,\n  };\n\n  // set active block\n  private _handleBlockToggle = (\n    index: number,\n    onToggle: (isExpanding: boolean) => any\n  ) => {\n    let activeBlock = index;\n\n    if (this.props.singleIsCollapsible && index === this.state.activeBlock)\n      activeBlock = -1;\n\n    this.setState({ activeBlock });\n\n    // istanbul ignore else\n    if (onToggle) {\n      onToggle(activeBlock === index); // fire the ExpandableBlock onToggle\n    }\n  };\n\n  private renderBlocks() {\n    return React.Children.map(this.props.children, (child: any, i) => {\n      return React.cloneElement(child, {\n        key: i,\n        isExpanded: this.props.singleExpandOnly\n          ? i === this.state.activeBlock\n          : child.props.isExpanded,\n        onToggle: this._handleBlockToggle.bind(this, i, child.props.onToggle),\n      });\n    });\n  }\n\n  /** @internal */\n  public override componentDidUpdate(prevProps: ExpandableListProps) {\n    if (\n      this.props.defaultActiveBlock !== prevProps.defaultActiveBlock &&\n      this.props.defaultActiveBlock !== this.state.activeBlock\n    ) {\n      this.setState((_, props) => ({ activeBlock: props.defaultActiveBlock! }));\n    }\n  }\n\n  public override render(): React.ReactElement {\n    return (\n      <div\n        className={classnames(\n          \"uicore-expandable-blocks-list\",\n          this.props.className\n        )}\n        style={this.props.style}\n      >\n        {this.renderBlocks()}\n      </div>\n    );\n  }\n}\n"]}

package/lib/esm/core-react/focus/ItemKeyboardNavigator.d.ts

@@ -1,7 +1,6 @@
 /** @packageDocumentation
  * @module Focus
  */
-/// <reference types="react" />
 import { Orientation } from "../enums/Orientation";
 /** Cross-Axis Arrow Key Callback
  * @internal

package/lib/esm/core-react/focus/ItemKeyboardNavigator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ItemKeyboardNavigator.d.ts","sourceRoot":"","sources":["../../../../src/core-react/focus/ItemKeyboardNavigator.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAGH,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;AAE/D;;GAEG;AACH,qBAAa,qBAAqB;IAQvB,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;IACpC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;IARhD,OAAO,CAAC,UAAU,CAAsB;IACxC,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,YAAY,CAA0B;IAC9C,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,yBAAyB,CAAC,CAAwB;gBAGjD,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EACpC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;IAUhD,qBAAqB;IACrB,IAAW,SAAS,IAAI,MAAM,CAE7B;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,MAAM,EAEjC;IAED,8BAA8B;IAC9B,IAAW,WAAW,IAAI,WAAW,CAEpC;IACD,IAAW,WAAW,CAAC,WAAW,EAAE,WAAW,EAE9C;IAED,2GAA2G;IAC3G,IAAW,SAAS,IAAI,OAAO,CAE9B;IACD,IAAW,SAAS,CAAC,CAAC,EAAE,OAAO,EAE9B;IAED,+FAA+F;IAC/F,IAAW,wBAAwB,IAAI,qBAAqB,GAAG,SAAS,CAEvE;IACD,IAAW,wBAAwB,CAAC,CAAC,EAAE,qBAAqB,GAAG,SAAS,EAEvE;IAED,8BAA8B;IACvB,kBAAkB,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IA6B1E,4BAA4B;IACrB,gBAAgB,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAWxE,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,aAAa;IAKrB;;;OAGG;IACH,OAAO,CAAC,oBAAoB;IAkC5B;OACG;IACH,OAAO,CAAC,sBAAsB;IA2B9B,OAAO,CAAC,YAAY;CAGrB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAQpD"}
+{"version":3,"file":"ItemKeyboardNavigator.d.ts","sourceRoot":"","sources":["../../../../src/core-react/focus/ItemKeyboardNavigator.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;AAE/D;;GAEG;AACH,qBAAa,qBAAqB;IAQvB,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;IACpC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;IARhD,OAAO,CAAC,UAAU,CAAsB;IACxC,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,YAAY,CAA0B;IAC9C,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,yBAAyB,CAAC,CAAwB;gBAGjD,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EACpC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;IAUhD,qBAAqB;IACrB,IAAW,SAAS,IAAI,MAAM,CAE7B;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,MAAM,EAEjC;IAED,8BAA8B;IAC9B,IAAW,WAAW,IAAI,WAAW,CAEpC;IACD,IAAW,WAAW,CAAC,WAAW,EAAE,WAAW,EAE9C;IAED,2GAA2G;IAC3G,IAAW,SAAS,IAAI,OAAO,CAE9B;IACD,IAAW,SAAS,CAAC,CAAC,EAAE,OAAO,EAE9B;IAED,+FAA+F;IAC/F,IAAW,wBAAwB,IAAI,qBAAqB,GAAG,SAAS,CAEvE;IACD,IAAW,wBAAwB,CAAC,CAAC,EAAE,qBAAqB,GAAG,SAAS,EAEvE;IAED,8BAA8B;IACvB,kBAAkB,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IA6B1E,4BAA4B;IACrB,gBAAgB,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAWxE,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,aAAa;IAKrB;;;OAGG;IACH,OAAO,CAAC,oBAAoB;IAkC5B;OACG;IACH,OAAO,CAAC,sBAAsB;IA8B9B,OAAO,CAAC,YAAY;CAGrB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAQpD"}

package/lib/esm/core-react/focus/ItemKeyboardNavigator.js

@@ -56,23 +56,23 @@ export class ItemKeyboardNavigator {
     handleKeyDownEvent(event, index) {
         const key = event.key;
         switch (key) {
-            case Key.Home:
+            case Key.Home.valueOf():
                 event.preventDefault();
                 // Activate first item
                 this.focusFirstItem();
                 break;
-            case Key.End:
+            case Key.End.valueOf():
                 event.preventDefault();
                 // Activate last item
                 this.focusLastItem();
                 break;
             // Up and down are in keydown
             // because we need to prevent page scroll >:)
-            case Key.ArrowUp:
-            case Key.ArrowDown:
+            case Key.ArrowUp.valueOf():
+            case Key.ArrowDown.valueOf():
                 this.determineOrientation(event, index);
                 break;
-            case Key.Enter:
+            case Key.Enter.valueOf():
             case " ":
                 this.activateItem(index);
                 break;
@@ -82,8 +82,8 @@ export class ItemKeyboardNavigator {
     handleKeyUpEvent(event, index) {
         const key = event.key;
         switch (key) {
-            case Key.ArrowLeft:
-            case Key.ArrowRight:
+            case Key.ArrowLeft.valueOf():
+            case Key.ArrowRight.valueOf():
                 this.determineOrientation(event, index);
                 break;
         }
@@ -104,22 +104,22 @@ export class ItemKeyboardNavigator {
         const vertical = this._orientation === Orientation.Vertical;
         let proceed = false;
         if (vertical) {
-            if (key === Key.ArrowUp || key === Key.ArrowDown) {
+            if (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf()) {
                 event.preventDefault();
                 proceed = true;
             }
             else if (this.crossAxisArrowKeyHandler &&
-                (key === Key.ArrowLeft || key === Key.ArrowRight)) {
-                this.crossAxisArrowKeyHandler(key === Key.ArrowRight);
+                (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf())) {
+                this.crossAxisArrowKeyHandler(key === Key.ArrowRight.valueOf());
             }
         }
         else {
-            if (key === Key.ArrowLeft || key === Key.ArrowRight) {
+            if (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf()) {
                 proceed = true;
             }
             else if (this.crossAxisArrowKeyHandler &&
-                (key === Key.ArrowUp || key === Key.ArrowDown)) {
-                this.crossAxisArrowKeyHandler(key === Key.ArrowDown);
+                (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf())) {
+                this.crossAxisArrowKeyHandler(key === Key.ArrowDown.valueOf());
             }
         }
         if (proceed) {
@@ -141,7 +141,8 @@ export class ItemKeyboardNavigator {
             else {
                 // istanbul ignore else
                 if (this._allowWrap) {
-                    if (pressed === Key.ArrowLeft || pressed === Key.ArrowUp) {
+                    if (pressed === Key.ArrowLeft.valueOf() ||
+                        pressed === Key.ArrowUp.valueOf()) {
                         this.focusLastItem();
                     }
                     else {
@@ -160,15 +161,15 @@ export class ItemKeyboardNavigator {
  */
 export function isNavigationKey(key) {
     return (isArrowKey(key) ||
-        key === Key.Home ||
-        key === Key.End ||
+        key === Key.Home.valueOf() ||
+        key === Key.End.valueOf() ||
         key === " " ||
-        key === Key.Enter);
+        key === Key.Enter.valueOf());
 }
 function isArrowKey(key) {
-    return (key === Key.ArrowLeft ||
-        key === Key.ArrowRight ||
-        key === Key.ArrowUp ||
-        key === Key.ArrowDown);
+    return (key === Key.ArrowLeft.valueOf() ||
+        key === Key.ArrowRight.valueOf() ||
+        key === Key.ArrowUp.valueOf() ||
+        key === Key.ArrowDown.valueOf());
 }
 //# sourceMappingURL=ItemKeyboardNavigator.js.map

package/lib/esm/core-react/focus/ItemKeyboardNavigator.js.map

@@ -1 +1 @@
-{"version":3,"file":"ItemKeyboardNavigator.js","sourceRoot":"","sources":["../../../../src/core-react/focus/ItemKeyboardNavigator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Focus\n */\n\nimport { Key } from \"ts-key-enum\";\nimport { Orientation } from \"../enums/Orientation\";\n\n/** Cross-Axis Arrow Key Callback\n * @internal\n */\nexport type CrossAxisArrowKeyFunc = (forward: boolean) => void;\n\n/** Keyboard Navigator for parent components\n * @internal\n */\nexport class ItemKeyboardNavigator {\n  private _direction: Map<string, number>;\n  private _itemCount = 0;\n  private _orientation = Orientation.Horizontal;\n  private _allowWrap = true;\n  private _crossAxisArrowKeyHandler?: CrossAxisArrowKeyFunc;\n\n  constructor(\n    public onFocusItem: (index: number) => void,\n    public onActivateItem: (index: number) => void\n  ) {\n    this._direction = new Map<string, number>([\n      [Key.ArrowLeft, -1],\n      [Key.ArrowUp, -1],\n      [Key.ArrowRight, 1],\n      [Key.ArrowDown, 1],\n    ]);\n  }\n\n  /** The item count */\n  public get itemCount(): number {\n    return this._itemCount;\n  }\n  public set itemCount(count: number) {\n    this._itemCount = count;\n  }\n\n  /** The primary orientation */\n  public get orientation(): Orientation {\n    return this._orientation;\n  }\n  public set orientation(orientation: Orientation) {\n    this._orientation = orientation;\n  }\n\n  /** The allow wrap property controls whether the movement will stop at the first and last items or wrap  */\n  public get allowWrap(): boolean {\n    return this._allowWrap;\n  }\n  public set allowWrap(v: boolean) {\n    this._allowWrap = v;\n  }\n\n  /** Called when the arrow keys that run perpendicular to the primary orientation are pressed */\n  public get crossAxisArrowKeyHandler(): CrossAxisArrowKeyFunc | undefined {\n    return this._crossAxisArrowKeyHandler;\n  }\n  public set crossAxisArrowKeyHandler(v: CrossAxisArrowKeyFunc | undefined) {\n    this._crossAxisArrowKeyHandler = v;\n  }\n\n  /** Handle KeyDown on items */\n  public handleKeyDownEvent(event: React.KeyboardEvent, index: number): void {\n    const key = event.key;\n\n    switch (key) {\n      case Key.Home:\n        event.preventDefault();\n        // Activate first item\n        this.focusFirstItem();\n        break;\n      case Key.End:\n        event.preventDefault();\n        // Activate last item\n        this.focusLastItem();\n        break;\n\n      // Up and down are in keydown\n      // because we need to prevent page scroll >:)\n      case Key.ArrowUp:\n      case Key.ArrowDown:\n        this.determineOrientation(event, index);\n        break;\n\n      case Key.Enter:\n      case \" \":\n        this.activateItem(index);\n        break;\n    }\n  }\n\n  /** Handle KeyUp on items */\n  public handleKeyUpEvent(event: React.KeyboardEvent, index: number): void {\n    const key = event.key;\n\n    switch (key) {\n      case Key.ArrowLeft:\n      case Key.ArrowRight:\n        this.determineOrientation(event, index);\n        break;\n    }\n  }\n\n  private focusFirstItem(): void {\n    this.onFocusItem(0);\n  }\n\n  private focusLastItem(): void {\n    const index = this._itemCount - 1;\n    this.onFocusItem(index);\n  }\n\n  /** When an item list's orientation is set to vertical,\n   * only up and down arrow should function.\n   * In all other cases only left and right arrow function.\n   */\n  private determineOrientation(\n    event: React.KeyboardEvent,\n    index: number\n  ): void {\n    const key = event.key;\n    const vertical = this._orientation === Orientation.Vertical;\n    let proceed = false;\n\n    if (vertical) {\n      if (key === Key.ArrowUp || key === Key.ArrowDown) {\n        event.preventDefault();\n        proceed = true;\n      } else if (\n        this.crossAxisArrowKeyHandler &&\n        (key === Key.ArrowLeft || key === Key.ArrowRight)\n      ) {\n        this.crossAxisArrowKeyHandler(key === Key.ArrowRight);\n      }\n    } else {\n      if (key === Key.ArrowLeft || key === Key.ArrowRight) {\n        proceed = true;\n      } else if (\n        this.crossAxisArrowKeyHandler &&\n        (key === Key.ArrowUp || key === Key.ArrowDown)\n      ) {\n        this.crossAxisArrowKeyHandler(key === Key.ArrowDown);\n      }\n    }\n\n    if (proceed) {\n      this.switchItemOnArrowPress(event, index);\n    }\n  }\n\n  /** Either focus the next, previous, first, or last item depending on key pressed\n   */\n  private switchItemOnArrowPress(\n    event: React.KeyboardEvent,\n    index: number\n  ): void {\n    // Add or subtract depending on key pressed\n    const pressed = event.key;\n    const targetDirection = this._direction.get(pressed);\n\n    // istanbul ignore else\n    if (targetDirection) {\n      const newIndex = index + targetDirection;\n\n      if (0 <= newIndex && newIndex < this._itemCount) {\n        this.onFocusItem(newIndex);\n      } else {\n        // istanbul ignore else\n        if (this._allowWrap) {\n          if (pressed === Key.ArrowLeft || pressed === Key.ArrowUp) {\n            this.focusLastItem();\n          } else {\n            this.focusFirstItem();\n          }\n        }\n      }\n    }\n  }\n\n  private activateItem(index: number): void {\n    this.onActivateItem(index);\n  }\n}\n\n/** Determines if a KeyboardEvent.key is an Item Navigation key\n * @internal\n */\nexport function isNavigationKey(key: string): boolean {\n  return (\n    isArrowKey(key) ||\n    key === Key.Home ||\n    key === Key.End ||\n    key === \" \" ||\n    key === Key.Enter\n  );\n}\n\nfunction isArrowKey(key: string): boolean {\n  return (\n    key === Key.ArrowLeft ||\n    key === Key.ArrowRight ||\n    key === Key.ArrowUp ||\n    key === Key.ArrowDown\n  );\n}\n"]}
+{"version":3,"file":"ItemKeyboardNavigator.js","sourceRoot":"","sources":["../../../../src/core-react/focus/ItemKeyboardNavigator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Focus\n */\n\nimport { Key } from \"ts-key-enum\";\nimport { Orientation } from \"../enums/Orientation\";\n\n/** Cross-Axis Arrow Key Callback\n * @internal\n */\nexport type CrossAxisArrowKeyFunc = (forward: boolean) => void;\n\n/** Keyboard Navigator for parent components\n * @internal\n */\nexport class ItemKeyboardNavigator {\n  private _direction: Map<string, number>;\n  private _itemCount = 0;\n  private _orientation = Orientation.Horizontal;\n  private _allowWrap = true;\n  private _crossAxisArrowKeyHandler?: CrossAxisArrowKeyFunc;\n\n  constructor(\n    public onFocusItem: (index: number) => void,\n    public onActivateItem: (index: number) => void\n  ) {\n    this._direction = new Map<string, number>([\n      [Key.ArrowLeft, -1],\n      [Key.ArrowUp, -1],\n      [Key.ArrowRight, 1],\n      [Key.ArrowDown, 1],\n    ]);\n  }\n\n  /** The item count */\n  public get itemCount(): number {\n    return this._itemCount;\n  }\n  public set itemCount(count: number) {\n    this._itemCount = count;\n  }\n\n  /** The primary orientation */\n  public get orientation(): Orientation {\n    return this._orientation;\n  }\n  public set orientation(orientation: Orientation) {\n    this._orientation = orientation;\n  }\n\n  /** The allow wrap property controls whether the movement will stop at the first and last items or wrap  */\n  public get allowWrap(): boolean {\n    return this._allowWrap;\n  }\n  public set allowWrap(v: boolean) {\n    this._allowWrap = v;\n  }\n\n  /** Called when the arrow keys that run perpendicular to the primary orientation are pressed */\n  public get crossAxisArrowKeyHandler(): CrossAxisArrowKeyFunc | undefined {\n    return this._crossAxisArrowKeyHandler;\n  }\n  public set crossAxisArrowKeyHandler(v: CrossAxisArrowKeyFunc | undefined) {\n    this._crossAxisArrowKeyHandler = v;\n  }\n\n  /** Handle KeyDown on items */\n  public handleKeyDownEvent(event: React.KeyboardEvent, index: number): void {\n    const key = event.key;\n\n    switch (key) {\n      case Key.Home.valueOf():\n        event.preventDefault();\n        // Activate first item\n        this.focusFirstItem();\n        break;\n      case Key.End.valueOf():\n        event.preventDefault();\n        // Activate last item\n        this.focusLastItem();\n        break;\n\n      // Up and down are in keydown\n      // because we need to prevent page scroll >:)\n      case Key.ArrowUp.valueOf():\n      case Key.ArrowDown.valueOf():\n        this.determineOrientation(event, index);\n        break;\n\n      case Key.Enter.valueOf():\n      case \" \":\n        this.activateItem(index);\n        break;\n    }\n  }\n\n  /** Handle KeyUp on items */\n  public handleKeyUpEvent(event: React.KeyboardEvent, index: number): void {\n    const key = event.key;\n\n    switch (key) {\n      case Key.ArrowLeft.valueOf():\n      case Key.ArrowRight.valueOf():\n        this.determineOrientation(event, index);\n        break;\n    }\n  }\n\n  private focusFirstItem(): void {\n    this.onFocusItem(0);\n  }\n\n  private focusLastItem(): void {\n    const index = this._itemCount - 1;\n    this.onFocusItem(index);\n  }\n\n  /** When an item list's orientation is set to vertical,\n   * only up and down arrow should function.\n   * In all other cases only left and right arrow function.\n   */\n  private determineOrientation(\n    event: React.KeyboardEvent,\n    index: number\n  ): void {\n    const key = event.key;\n    const vertical = this._orientation === Orientation.Vertical;\n    let proceed = false;\n\n    if (vertical) {\n      if (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf()) {\n        event.preventDefault();\n        proceed = true;\n      } else if (\n        this.crossAxisArrowKeyHandler &&\n        (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf())\n      ) {\n        this.crossAxisArrowKeyHandler(key === Key.ArrowRight.valueOf());\n      }\n    } else {\n      if (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf()) {\n        proceed = true;\n      } else if (\n        this.crossAxisArrowKeyHandler &&\n        (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf())\n      ) {\n        this.crossAxisArrowKeyHandler(key === Key.ArrowDown.valueOf());\n      }\n    }\n\n    if (proceed) {\n      this.switchItemOnArrowPress(event, index);\n    }\n  }\n\n  /** Either focus the next, previous, first, or last item depending on key pressed\n   */\n  private switchItemOnArrowPress(\n    event: React.KeyboardEvent,\n    index: number\n  ): void {\n    // Add or subtract depending on key pressed\n    const pressed = event.key;\n    const targetDirection = this._direction.get(pressed);\n\n    // istanbul ignore else\n    if (targetDirection) {\n      const newIndex = index + targetDirection;\n\n      if (0 <= newIndex && newIndex < this._itemCount) {\n        this.onFocusItem(newIndex);\n      } else {\n        // istanbul ignore else\n        if (this._allowWrap) {\n          if (\n            pressed === Key.ArrowLeft.valueOf() ||\n            pressed === Key.ArrowUp.valueOf()\n          ) {\n            this.focusLastItem();\n          } else {\n            this.focusFirstItem();\n          }\n        }\n      }\n    }\n  }\n\n  private activateItem(index: number): void {\n    this.onActivateItem(index);\n  }\n}\n\n/** Determines if a KeyboardEvent.key is an Item Navigation key\n * @internal\n */\nexport function isNavigationKey(key: string): boolean {\n  return (\n    isArrowKey(key) ||\n    key === Key.Home.valueOf() ||\n    key === Key.End.valueOf() ||\n    key === \" \" ||\n    key === Key.Enter.valueOf()\n  );\n}\n\nfunction isArrowKey(key: string): boolean {\n  return (\n    key === Key.ArrowLeft.valueOf() ||\n    key === Key.ArrowRight.valueOf() ||\n    key === Key.ArrowUp.valueOf() ||\n    key === Key.ArrowDown.valueOf()\n  );\n}\n"]}

package/lib/esm/core-react/hocs/withOnOutsideClick.js

@@ -84,9 +84,8 @@ export const withOnOutsideClick = (Component, defaultOnOutsideClick, useCapture
                 return defaultOnOutsideClick(e);
         }
         getParentDocument() {
-            var _a, _b;
             // istanbul ignore next
-            return (_b = (_a = this.outsideClickContainerDiv) === null || _a === void 0 ? void 0 : _a.ownerDocument) !== null && _b !== void 0 ? _b : document;
+            return this.outsideClickContainerDiv?.ownerDocument ?? document;
         }
         componentDidMount() {
             const outsideClickParentDocument = this.getParentDocument();

package/lib/esm/core-react/hocs/withOnOutsideClick.js.map

@@ -1 +1 @@
-{"version":3,"file":"withOnOutsideClick.js","sourceRoot":"","sources":["../../../../src/core-react/hocs/withOnOutsideClick.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Common\n */\n\nimport * as React from \"react\";\n\n/** Properties for [[withOnOutsideClick]] React higher-order component\n * @public\n */\nexport interface WithOnOutsideClickProps {\n  /** Outside click callback function */\n  onOutsideClick?: (event: MouseEvent) => any;\n  /** If false outside click processing and closing are skipped if click occurs in another Popup component, default to false. */\n  closeOnNestedPopupOutsideClick?: boolean;\n}\n\n/** withOnOutsideClick is a React higher-order component that adds outside click support.\n * @public\n */\nexport const withOnOutsideClick = <ComponentProps extends {}>(\n  Component: React.ComponentType<ComponentProps>,\n  defaultOnOutsideClick?: (event: MouseEvent) => any,\n  useCapture: boolean = true,\n  usePointerEvents: boolean = true\n) => {\n  return class WithOnOutsideClick extends React.PureComponent<\n    ComponentProps & WithOnOutsideClickProps\n  > {\n    /** @internal */\n    public outsideClickContainerDiv?: HTMLDivElement | null = null;\n    /** @internal */\n    public isDownOutside = false;\n\n    /** @internal */\n    public isInCorePopup(element: HTMLElement): boolean {\n      if (element.nodeName === \"DIV\") {\n        if (element.classList && element.classList.contains(\"core-popup\"))\n          return true;\n        if (element.parentElement && this.isInCorePopup(element.parentElement))\n          return true;\n      } else {\n        // istanbul ignore else\n        if (element.parentElement && this.isInCorePopup(element.parentElement))\n          return true;\n      }\n      return false;\n    }\n\n    /** @internal */\n    public onOutsideClick(e: MouseEvent) {\n      // istanbul ignore else\n      if (e.target instanceof Node && e.target.nodeType === Node.ELEMENT_NODE) {\n        // istanbul ignore else\n        if (\n          !this.props.closeOnNestedPopupOutsideClick &&\n          this.isInCorePopup(e.target as HTMLElement)\n        )\n          return;\n      }\n\n      if (this.props.onOutsideClick) return this.props.onOutsideClick(e);\n      else if (defaultOnOutsideClick) return defaultOnOutsideClick(e);\n    }\n\n    /** @internal */\n    public handleDocumentClick = (e: MouseEvent) => {\n      if (\n        !this.outsideClickContainerDiv ||\n        !(e.target instanceof Node) ||\n        this.outsideClickContainerDiv.contains(e.target)\n      )\n        return;\n\n      return this.onOutsideClick(e);\n    };\n\n    /** @internal */\n    public handleDocumentPointerDown = (e: PointerEvent) => {\n      this.isDownOutside = true;\n      // istanbul ignore else\n      if (this.outsideClickContainerDiv) {\n        // typically e.target test for instance of Node, but this is not working from pop out windows\n        this.isDownOutside =\n          !!e.target &&\n          !this.outsideClickContainerDiv.contains(e.target as any);\n      }\n    };\n\n    /** @internal */\n    public handleDocumentPointerUp = (e: PointerEvent) => {\n      let isUpOutside = true;\n      // istanbul ignore else\n      if (this.outsideClickContainerDiv) {\n        // typically e.target test for instance of Node, but this is not working from pop out windows\n        isUpOutside =\n          !!e.target &&\n          !this.outsideClickContainerDiv.contains(e.target as any);\n      }\n\n      const isOutsideClick = isUpOutside && this.isDownOutside;\n      this.isDownOutside = false;\n      isOutsideClick && this.onOutsideClick(e);\n    };\n\n    public handleOutsideClickContainerDivSet = (\n      outsideClickContainerDiv: HTMLDivElement | null\n    ) => {\n      this.outsideClickContainerDiv = outsideClickContainerDiv;\n    };\n\n    public getParentDocument() {\n      // istanbul ignore next\n      return this.outsideClickContainerDiv?.ownerDocument ?? document;\n    }\n\n    public override componentDidMount() {\n      const outsideClickParentDocument = this.getParentDocument();\n      if (usePointerEvents) {\n        outsideClickParentDocument.addEventListener(\n          \"pointerdown\",\n          this.handleDocumentPointerDown,\n          useCapture\n        );\n        outsideClickParentDocument.addEventListener(\n          \"pointerup\",\n          this.handleDocumentPointerUp,\n          useCapture\n        );\n      } else\n        outsideClickParentDocument.addEventListener(\n          \"click\",\n          this.handleDocumentClick,\n          useCapture\n        );\n    }\n\n    /** @internal */\n    public override componentWillUnmount() {\n      const outsideClickParentDocument = this.getParentDocument();\n      if (usePointerEvents) {\n        outsideClickParentDocument.removeEventListener(\n          \"pointerdown\",\n          this.handleDocumentPointerDown,\n          useCapture\n        );\n        outsideClickParentDocument.removeEventListener(\n          \"pointerup\",\n          this.handleDocumentPointerUp,\n          useCapture\n        );\n      } else\n        outsideClickParentDocument.removeEventListener(\n          \"click\",\n          this.handleDocumentClick,\n          useCapture\n        );\n    }\n\n    public override render() {\n      const { onOutsideClick, closeOnNestedPopupOutsideClick, ...props } =\n        this.props;\n      return (\n        <div ref={this.handleOutsideClickContainerDivSet}>\n          <Component {...(props as ComponentProps)} />\n        </div>\n      );\n    }\n  };\n};\n"]}
+{"version":3,"file":"withOnOutsideClick.js","sourceRoot":"","sources":["../../../../src/core-react/hocs/withOnOutsideClick.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Common\n */\n\nimport * as React from \"react\";\n\n/** Properties for [[withOnOutsideClick]] React higher-order component\n * @public\n */\nexport interface WithOnOutsideClickProps {\n  /** Outside click callback function */\n  onOutsideClick?: (event: MouseEvent) => any;\n  /** If false outside click processing and closing are skipped if click occurs in another Popup component, default to false. */\n  closeOnNestedPopupOutsideClick?: boolean;\n}\n\n/** withOnOutsideClick is a React higher-order component that adds outside click support.\n * @public\n */\nexport const withOnOutsideClick = <ComponentProps extends {}>(\n  Component: React.ComponentType<ComponentProps>,\n  defaultOnOutsideClick?: (event: MouseEvent) => any,\n  useCapture: boolean = true,\n  usePointerEvents: boolean = true\n) => {\n  return class WithOnOutsideClick extends React.PureComponent<\n    ComponentProps & WithOnOutsideClickProps\n  > {\n    /** @internal */\n    public outsideClickContainerDiv?: HTMLDivElement | null = null;\n    /** @internal */\n    public isDownOutside = false;\n\n    /** @internal */\n    public isInCorePopup(element: HTMLElement): boolean {\n      if (element.nodeName === \"DIV\") {\n        if (element.classList && element.classList.contains(\"core-popup\"))\n          return true;\n        if (element.parentElement && this.isInCorePopup(element.parentElement))\n          return true;\n      } else {\n        // istanbul ignore else\n        if (element.parentElement && this.isInCorePopup(element.parentElement))\n          return true;\n      }\n      return false;\n    }\n\n    /** @internal */\n    public onOutsideClick(e: MouseEvent) {\n      // istanbul ignore else\n      if (e.target instanceof Node && e.target.nodeType === Node.ELEMENT_NODE) {\n        // istanbul ignore else\n        if (\n          !this.props.closeOnNestedPopupOutsideClick &&\n          this.isInCorePopup(e.target as HTMLElement)\n        )\n          return;\n      }\n\n      if (this.props.onOutsideClick) return this.props.onOutsideClick(e);\n      else if (defaultOnOutsideClick) return defaultOnOutsideClick(e);\n    }\n\n    /** @internal */\n    public handleDocumentClick = (e: MouseEvent) => {\n      if (\n        !this.outsideClickContainerDiv ||\n        !(e.target instanceof Node) ||\n        this.outsideClickContainerDiv.contains(e.target)\n      )\n        return;\n\n      return this.onOutsideClick(e);\n    };\n\n    /** @internal */\n    public handleDocumentPointerDown = (e: PointerEvent) => {\n      this.isDownOutside = true;\n      // istanbul ignore else\n      if (this.outsideClickContainerDiv) {\n        // typically e.target test for instance of Node, but this is not working from pop out windows\n        this.isDownOutside =\n          !!e.target &&\n          !this.outsideClickContainerDiv.contains(e.target as any);\n      }\n    };\n\n    /** @internal */\n    public handleDocumentPointerUp = (e: PointerEvent) => {\n      let isUpOutside = true;\n      // istanbul ignore else\n      if (this.outsideClickContainerDiv) {\n        // typically e.target test for instance of Node, but this is not working from pop out windows\n        isUpOutside =\n          !!e.target &&\n          !this.outsideClickContainerDiv.contains(e.target as any);\n      }\n\n      const isOutsideClick = isUpOutside && this.isDownOutside;\n      this.isDownOutside = false;\n      isOutsideClick && this.onOutsideClick(e);\n    };\n\n    public handleOutsideClickContainerDivSet = (\n      outsideClickContainerDiv: HTMLDivElement | null\n    ) => {\n      this.outsideClickContainerDiv = outsideClickContainerDiv;\n    };\n\n    public getParentDocument() {\n      // istanbul ignore next\n      return this.outsideClickContainerDiv?.ownerDocument ?? document;\n    }\n\n    public override componentDidMount() {\n      const outsideClickParentDocument = this.getParentDocument();\n      if (usePointerEvents) {\n        outsideClickParentDocument.addEventListener(\n          \"pointerdown\",\n          this.handleDocumentPointerDown,\n          useCapture\n        );\n        outsideClickParentDocument.addEventListener(\n          \"pointerup\",\n          this.handleDocumentPointerUp,\n          useCapture\n        );\n      } else\n        outsideClickParentDocument.addEventListener(\n          \"click\",\n          this.handleDocumentClick,\n          useCapture\n        );\n    }\n\n    /** @internal */\n    public override componentWillUnmount() {\n      const outsideClickParentDocument = this.getParentDocument();\n      if (usePointerEvents) {\n        outsideClickParentDocument.removeEventListener(\n          \"pointerdown\",\n          this.handleDocumentPointerDown,\n          useCapture\n        );\n        outsideClickParentDocument.removeEventListener(\n          \"pointerup\",\n          this.handleDocumentPointerUp,\n          useCapture\n        );\n      } else\n        outsideClickParentDocument.removeEventListener(\n          \"click\",\n          this.handleDocumentClick,\n          useCapture\n        );\n    }\n\n    public override render() {\n      const { onOutsideClick, closeOnNestedPopupOutsideClick, ...props } =\n        this.props;\n      return (\n        <div ref={this.handleOutsideClickContainerDivSet}>\n          <Component {...(props as ComponentProps)} />\n        </div>\n      );\n    }\n  };\n};\n"]}

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

@@ -41,7 +41,7 @@ export function Icon(props) {
             // 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 !== null && DOMPurify !== void 0 ? DOMPurify : DOMPurifyNS;
+            const sanitizer = DOMPurify ?? DOMPurifyNS;
             const sanitizerConfig = {
                 ALLOWED_TAGS: ["svg-loader"],
                 ADD_URI_SAFE_ATTR: definitiveIconString.startsWith("data:")

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

@@ -1 +1 @@
-{"version":3,"file":"IconComponent.js","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Icon\n */\n\nimport \"./IconComponent.scss\";\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { ConditionalStringValue } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"../utils/Props\";\nimport DOMPurify, * as DOMPurifyNS from \"dompurify\";\nimport { ConditionalIconItem } from \"./ConditionalIconItem\";\n\n/** Prototype for an IconSpec which can be a string, ReactNode or ConditionalStringValue.\n * Strings are expected to be one of the following:\n *  - Created by `IconSpecUtilities.createWebComponentIconSpec` in appui-abstract (deprecated).\n *  - A URL to a SVG file (must end with \".svg\").\n *  - A dataURI with MimeTypes `image/svg+xml` (ensure valid dataURI encoding) or `image/svg+xml;base64`;\n *  - Anything else will be treated as a class name and be directly added to the `class` attribute.\n * @public\n */\nexport type IconSpec =\n  | string\n  | ConditionalStringValue\n  | React.ReactNode\n  | ConditionalIconItem;\n\n/** Properties for the [[Icon]] React component\n * @public\n */\nexport interface IconProps extends CommonProps {\n  /** CSS class name or SvgPath for icon. This is optional because it is improperly\n   * used to extend other interfaces and changing it would break existing API.\n   */\n  iconSpec?: IconSpec;\n}\n\n/** Get the SVG Source from an svg-loader IconSpec */\nfunction getWebComponentSource(iconSpec: string): string | undefined {\n  if (iconSpec.startsWith(\"webSvg:\") && iconSpec.length > 7) {\n    return iconSpec.slice(7);\n  }\n\n  return undefined;\n}\n\n/** Icon Functional component displays an icon based on an [[IconSpec]].\n * @public\n */\nexport function Icon(props: IconProps) {\n  if (!props.iconSpec) return null;\n\n  const iconString =\n    typeof props.iconSpec === \"string\" ||\n    props.iconSpec instanceof ConditionalStringValue\n      ? ConditionalStringValue.getValue(props.iconSpec)\n      : undefined;\n\n  if (iconString) {\n    const webComponentString = getWebComponentSource(iconString);\n\n    if (\n      iconString.startsWith(\"data:\") ||\n      iconString.endsWith(\".svg\") ||\n      webComponentString\n    ) {\n      const definitiveIconString = webComponentString\n        ? webComponentString\n        : iconString;\n      const svgLoader = `<svg-loader src=\"${definitiveIconString}\"></svg-loader>`;\n      const svgDiv = `<div>${svgLoader}</div>`;\n      // the esm build of dompurify has a default import but the cjs build does not\n      // if there is a default export, use it (likely esm), otherwise use the namespace\n      // istanbul ignore next\n      const sanitizer = DOMPurify ?? DOMPurifyNS;\n\n      const sanitizerConfig = {\n        ALLOWED_TAGS: [\"svg-loader\"],\n        ADD_URI_SAFE_ATTR: definitiveIconString.startsWith(\"data:\")\n          ? [\"src\"]\n          : [],\n      };\n\n      const sanitizedIconString = sanitizer.sanitize(svgDiv, sanitizerConfig);\n      const webComponentNode = (\n        // we can safely disable jam3/no-sanitizer-with-danger as we are sanitizing above\n        // eslint-disable-next-line jam3/no-sanitizer-with-danger\n        <div dangerouslySetInnerHTML={{ __html: sanitizedIconString }}></div>\n      );\n      return (\n        <i className={classnames(\"icon\", \"core-svg-icon\", props.className)}>\n          {webComponentNode}\n        </i>\n      );\n    }\n    return (\n      <i\n        className={classnames(\"icon\", iconString, props.className)}\n        style={props.style}\n      />\n    );\n  }\n\n  if (ConditionalIconItem.isConditionalIconItem(props.iconSpec)) {\n    return (\n      <i\n        className={classnames(\"icon\", \"core-svg-icon\", props.className)}\n        style={props.style}\n      >\n        {ConditionalIconItem.getValue(props.iconSpec)}\n      </i>\n    );\n  }\n\n  return (\n    <i\n      className={classnames(\"icon\", \"core-svg-icon\", props.className)}\n      style={props.style}\n    >\n      {props.iconSpec instanceof ConditionalStringValue\n        ? undefined\n        : props.iconSpec}\n    </i>\n  );\n}\n"]}
+{"version":3,"file":"IconComponent.js","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Icon\n */\n\nimport \"./IconComponent.scss\";\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { ConditionalStringValue } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"../utils/Props\";\nimport DOMPurify, * as DOMPurifyNS from \"dompurify\";\nimport { ConditionalIconItem } from \"./ConditionalIconItem\";\n\n/** Prototype for an IconSpec which can be a string, ReactNode or ConditionalStringValue.\n * Strings are expected to be one of the following:\n *  - Created by `IconSpecUtilities.createWebComponentIconSpec` in appui-abstract (deprecated).\n *  - A URL to a SVG file (must end with \".svg\").\n *  - A dataURI with MimeTypes `image/svg+xml` (ensure valid dataURI encoding) or `image/svg+xml;base64`;\n *  - Anything else will be treated as a class name and be directly added to the `class` attribute.\n * @public\n */\nexport type IconSpec =\n  | string\n  | ConditionalStringValue\n  | React.ReactNode\n  | ConditionalIconItem;\n\n/** Properties for the [[Icon]] React component\n * @public\n */\nexport interface IconProps extends CommonProps {\n  /** CSS class name or SvgPath for icon. This is optional because it is improperly\n   * used to extend other interfaces and changing it would break existing API.\n   */\n  iconSpec?: IconSpec;\n}\n\n/** Get the SVG Source from an svg-loader IconSpec */\nfunction getWebComponentSource(iconSpec: string): string | undefined {\n  if (iconSpec.startsWith(\"webSvg:\") && iconSpec.length > 7) {\n    return iconSpec.slice(7);\n  }\n\n  return undefined;\n}\n\n/** Icon Functional component displays an icon based on an [[IconSpec]].\n * @public\n */\nexport function Icon(props: IconProps) {\n  if (!props.iconSpec) return null;\n\n  const iconString =\n    typeof props.iconSpec === \"string\" ||\n    props.iconSpec instanceof ConditionalStringValue\n      ? ConditionalStringValue.getValue(props.iconSpec)\n      : undefined;\n\n  if (iconString) {\n    const webComponentString = getWebComponentSource(iconString);\n\n    if (\n      iconString.startsWith(\"data:\") ||\n      iconString.endsWith(\".svg\") ||\n      webComponentString\n    ) {\n      const definitiveIconString = webComponentString\n        ? webComponentString\n        : iconString;\n      const svgLoader = `<svg-loader src=\"${definitiveIconString}\"></svg-loader>`;\n      const svgDiv = `<div>${svgLoader}</div>`;\n      // the esm build of dompurify has a default import but the cjs build does not\n      // if there is a default export, use it (likely esm), otherwise use the namespace\n      // istanbul ignore next\n      const sanitizer = DOMPurify ?? DOMPurifyNS;\n\n      const sanitizerConfig = {\n        ALLOWED_TAGS: [\"svg-loader\"],\n        ADD_URI_SAFE_ATTR: definitiveIconString.startsWith(\"data:\")\n          ? [\"src\"]\n          : [],\n      };\n\n      const sanitizedIconString = sanitizer.sanitize(svgDiv, sanitizerConfig);\n      const webComponentNode = (\n        // we can safely disable jam3/no-sanitizer-with-danger as we are sanitizing above\n        // eslint-disable-next-line jam3/no-sanitizer-with-danger\n        <div dangerouslySetInnerHTML={{ __html: sanitizedIconString }}></div>\n      );\n      return (\n        <i className={classnames(\"icon\", \"core-svg-icon\", props.className)}>\n          {webComponentNode}\n        </i>\n      );\n    }\n    return (\n      <i\n        className={classnames(\"icon\", iconString, props.className)}\n        style={props.style}\n      />\n    );\n  }\n\n  if (ConditionalIconItem.isConditionalIconItem(props.iconSpec)) {\n    return (\n      <i\n        className={classnames(\"icon\", \"core-svg-icon\", props.className)}\n        style={props.style}\n      >\n        {ConditionalIconItem.getValue(props.iconSpec)}\n      </i>\n    );\n  }\n\n  return (\n    <i\n      className={classnames(\"icon\", \"core-svg-icon\", props.className)}\n      style={props.style}\n    >\n      {props.iconSpec instanceof ConditionalStringValue\n        ? undefined\n        : props.iconSpec}\n    </i>\n  );\n}\n"]}

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

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

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

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

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

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