@itwin/appui-react 3.6.0-dev.7 → 3.6.0

package/lib/cjs/appui-react/popup/CardPopup.d.ts

@@ -1,49 +1,49 @@
-/** @packageDocumentation
- * @module Popup
- */
-import "./CardPopup.scss";
-import * as React from "react";
-import { CommonToolbarItem, OnCancelFunc, OnItemExecutedFunc, PropertyRecord, RelativePosition } from "@itwin/appui-abstract";
-import { Orientation, Size } from "@itwin/core-react";
-import { PopupContentType, PopupPropsBase } from "./PopupManager";
-/** Props for defining a CardPopup editor
- * @beta */
-export interface CardPopupProps extends PopupPropsBase {
-    content: PopupContentType;
-    title: string | PropertyRecord | undefined;
-    items: CommonToolbarItem[] | undefined;
-    relativePosition: RelativePosition;
-    orientation: Orientation;
-    onCancel: OnCancelFunc;
-    onItemExecuted: OnItemExecutedFunc;
-}
-/** @internal */
-interface CardPopupState {
-    size: Size;
-}
-/** Popup component for Input Editor
- * @beta
- */
-export declare class CardPopup extends React.PureComponent<CardPopupProps, CardPopupState> {
-    /** @internal */
-    readonly state: {
-        size: Size;
-    };
-    private _onSizeKnown;
-    private _handleKeyDown;
-    private _cancel;
-    render(): JSX.Element;
-}
-/** Props defining a Card component
- * @beta */
-export interface CardProps {
-    content: PopupContentType;
-    title: string | PropertyRecord | undefined;
-    items: CommonToolbarItem[] | undefined;
-    onItemExecuted: OnItemExecutedFunc;
-}
-/** Card component
- * @beta */
-export declare function Card(props: CardProps): JSX.Element;
-export {};
+/** @packageDocumentation
+ * @module Popup
+ */
+import "./CardPopup.scss";
+import * as React from "react";
+import { CommonToolbarItem, OnCancelFunc, OnItemExecutedFunc, PropertyRecord, RelativePosition } from "@itwin/appui-abstract";
+import { Orientation, Size } from "@itwin/core-react";
+import { PopupContentType, PopupPropsBase } from "./PopupManager";
+/** Props for defining a CardPopup editor
+ * @beta */
+export interface CardPopupProps extends PopupPropsBase {
+    content: PopupContentType;
+    title: string | PropertyRecord | undefined;
+    items: CommonToolbarItem[] | undefined;
+    relativePosition: RelativePosition;
+    orientation: Orientation;
+    onCancel: OnCancelFunc;
+    onItemExecuted: OnItemExecutedFunc;
+}
+/** @internal */
+interface CardPopupState {
+    size: Size;
+}
+/** Popup component for Input Editor
+ * @beta
+ */
+export declare class CardPopup extends React.PureComponent<CardPopupProps, CardPopupState> {
+    /** @internal */
+    readonly state: {
+        size: Size;
+    };
+    private _onSizeKnown;
+    private _handleKeyDown;
+    private _cancel;
+    render(): JSX.Element;
+}
+/** Props defining a Card component
+ * @beta */
+export interface CardProps {
+    content: PopupContentType;
+    title: string | PropertyRecord | undefined;
+    items: CommonToolbarItem[] | undefined;
+    onItemExecuted: OnItemExecutedFunc;
+}
+/** Card component
+ * @beta */
+export declare function Card(props: CardProps): JSX.Element;
+export {};
 //# sourceMappingURL=CardPopup.d.ts.map

package/lib/cjs/appui-react/popup/CardPopup.js

@@ -1,90 +1,90 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Popup
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = exports.CardPopup = void 0;
-require("./CardPopup.scss");
-const React = require("react");
-const classnames_1 = require("classnames");
-const appui_abstract_1 = require("@itwin/appui-abstract");
-const core_react_1 = require("@itwin/core-react");
-const itwinui_react_1 = require("@itwin/itwinui-react");
-const CursorPopup_1 = require("../cursor/cursorpopup/CursorPopup");
-const PopupManager_1 = require("./PopupManager");
-const PositionPopup_1 = require("./PositionPopup");
-const MessageSpan_1 = require("../messages/MessageSpan");
-const components_react_1 = require("@itwin/components-react");
-/** Popup component for Input Editor
- * @beta
- */
-class CardPopup extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        /** @internal */
-        this.state = {
-            size: new core_react_1.Size(-1, -1),
-        };
-        this._onSizeKnown = (newSize) => {
-            // istanbul ignore else
-            if (!this.state.size.equals(newSize))
-                this.setState({ size: core_react_1.Size.create(newSize) });
-        };
-        this._handleKeyDown = (event) => {
-            switch (event.key) {
-                case appui_abstract_1.SpecialKey.Escape:
-                    this._cancel();
-                    break;
-            }
-        };
-    }
-    _cancel() {
-        // istanbul ignore else
-        if (this.props.onCancel) {
-            this.props.onCancel();
-        }
-    }
-    render() {
-        let point = PopupManager_1.PopupManager.getPopupPosition(this.props.el, this.props.pt, new core_react_1.Point(), this.state.size);
-        const popupRect = CursorPopup_1.CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);
-        point = new core_react_1.Point(popupRect.left, popupRect.top);
-        return (React.createElement(PositionPopup_1.PositionPopup, { key: this.props.id, className: (0, classnames_1.default)("uifw-no-border", "uifw-card"), point: point, onSizeKnown: this._onSizeKnown },
-            React.createElement(core_react_1.DivWithOutsideClick, { onOutsideClick: this.props.onCancel, onKeyDown: this._handleKeyDown },
-                React.createElement(core_react_1.FocusTrap, { active: true, returnFocusOnDeactivate: true },
-                    React.createElement(Card, { content: this.props.content, title: this.props.title, items: this.props.items, onItemExecuted: this.props.onItemExecuted })))));
-    }
-}
-exports.CardPopup = CardPopup;
-/** Card component
- * @beta */
-function Card(props) {
-    let titleNode;
-    // istanbul ignore else
-    if (props.title) {
-        if (typeof props.title === "string")
-            titleNode = React.createElement(itwinui_react_1.Leading, null, props.title);
-        else {
-            const propertyValueRendererManager = components_react_1.PropertyValueRendererManager.defaultManager;
-            const titleValue = propertyValueRendererManager.render(props.title);
-            titleNode = React.createElement(itwinui_react_1.Leading, null, titleValue);
-        }
-    }
-    const content = (0, PopupManager_1.isReactContent)(props.content) ? props.content.reactNode : React.createElement(MessageSpan_1.MessageDiv, { message: props.content });
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "uifw-card-content" },
-            props.title &&
-                React.createElement(React.Fragment, null,
-                    titleNode,
-                    React.createElement("div", { className: "uifw-card-gap" })),
-            content),
-        props.items &&
-            React.createElement(React.Fragment, null,
-                React.createElement("div", { className: "uifw-card-separator" }),
-                React.createElement(components_react_1.ToolbarWithOverflow, { expandsTo: components_react_1.Direction.Bottom, panelAlignment: components_react_1.ToolbarPanelAlignment.Start, items: props.items, useDragInteraction: true, toolbarOpacitySetting: components_react_1.ToolbarOpacitySetting.Transparent, onItemExecuted: props.onItemExecuted }))));
-}
-exports.Card = Card;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Popup
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card = exports.CardPopup = void 0;
+require("./CardPopup.scss");
+const React = require("react");
+const classnames_1 = require("classnames");
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const core_react_1 = require("@itwin/core-react");
+const itwinui_react_1 = require("@itwin/itwinui-react");
+const CursorPopup_1 = require("../cursor/cursorpopup/CursorPopup");
+const PopupManager_1 = require("./PopupManager");
+const PositionPopup_1 = require("./PositionPopup");
+const MessageSpan_1 = require("../messages/MessageSpan");
+const components_react_1 = require("@itwin/components-react");
+/** Popup component for Input Editor
+ * @beta
+ */
+class CardPopup extends React.PureComponent {
+    constructor() {
+        super(...arguments);
+        /** @internal */
+        this.state = {
+            size: new core_react_1.Size(-1, -1),
+        };
+        this._onSizeKnown = (newSize) => {
+            // istanbul ignore else
+            if (!this.state.size.equals(newSize))
+                this.setState({ size: core_react_1.Size.create(newSize) });
+        };
+        this._handleKeyDown = (event) => {
+            switch (event.key) {
+                case appui_abstract_1.SpecialKey.Escape:
+                    this._cancel();
+                    break;
+            }
+        };
+    }
+    _cancel() {
+        // istanbul ignore else
+        if (this.props.onCancel) {
+            this.props.onCancel();
+        }
+    }
+    render() {
+        let point = PopupManager_1.PopupManager.getPopupPosition(this.props.el, this.props.pt, new core_react_1.Point(), this.state.size);
+        const popupRect = CursorPopup_1.CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);
+        point = new core_react_1.Point(popupRect.left, popupRect.top);
+        return (React.createElement(PositionPopup_1.PositionPopup, { key: this.props.id, className: (0, classnames_1.default)("uifw-no-border", "uifw-card"), point: point, onSizeKnown: this._onSizeKnown },
+            React.createElement(core_react_1.DivWithOutsideClick, { onOutsideClick: this.props.onCancel, onKeyDown: this._handleKeyDown },
+                React.createElement(core_react_1.FocusTrap, { active: true, returnFocusOnDeactivate: true },
+                    React.createElement(Card, { content: this.props.content, title: this.props.title, items: this.props.items, onItemExecuted: this.props.onItemExecuted })))));
+    }
+}
+exports.CardPopup = CardPopup;
+/** Card component
+ * @beta */
+function Card(props) {
+    let titleNode;
+    // istanbul ignore else
+    if (props.title) {
+        if (typeof props.title === "string")
+            titleNode = React.createElement(itwinui_react_1.Leading, null, props.title);
+        else {
+            const propertyValueRendererManager = components_react_1.PropertyValueRendererManager.defaultManager;
+            const titleValue = propertyValueRendererManager.render(props.title);
+            titleNode = React.createElement(itwinui_react_1.Leading, null, titleValue);
+        }
+    }
+    const content = (0, PopupManager_1.isReactContent)(props.content) ? props.content.reactNode : React.createElement(MessageSpan_1.MessageDiv, { message: props.content });
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "uifw-card-content" },
+            props.title &&
+                React.createElement(React.Fragment, null,
+                    titleNode,
+                    React.createElement("div", { className: "uifw-card-gap" })),
+            content),
+        props.items &&
+            React.createElement(React.Fragment, null,
+                React.createElement("div", { className: "uifw-card-separator" }),
+                React.createElement(components_react_1.ToolbarWithOverflow, { expandsTo: components_react_1.Direction.Bottom, panelAlignment: components_react_1.ToolbarPanelAlignment.Start, items: props.items, useDragInteraction: true, toolbarOpacitySetting: components_react_1.ToolbarOpacitySetting.Transparent, onItemExecuted: props.onItemExecuted }))));
+}
+exports.Card = Card;
 //# sourceMappingURL=CardPopup.js.map

package/lib/cjs/appui-react/popup/CardPopup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardPopup.js","sourceRoot":"","sources":["../../../../src/appui-react/popup/CardPopup.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Popup\r\n */\r\n\r\nimport \"./CardPopup.scss\";\r\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\nimport { CommonToolbarItem, OnCancelFunc, OnItemExecutedFunc, PropertyRecord, RelativePosition, SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { DivWithOutsideClick, FocusTrap, Orientation, Point, Size, SizeProps } from \"@itwin/core-react\";\r\nimport { Leading } from \"@itwin/itwinui-react\";\r\nimport { CursorPopup } from \"../cursor/cursorpopup/CursorPopup\";\r\nimport { isReactContent, PopupContentType, PopupManager, PopupPropsBase } from \"./PopupManager\";\r\nimport { PositionPopup } from \"./PositionPopup\";\r\nimport { MessageDiv } from \"../messages/MessageSpan\";\r\nimport { Direction, PropertyValueRendererManager, ToolbarOpacitySetting, ToolbarPanelAlignment, ToolbarWithOverflow } from \"@itwin/components-react\";\r\n\r\n/** Props for defining a CardPopup editor\r\n * @beta */\r\nexport interface CardPopupProps extends PopupPropsBase {\r\n  content: PopupContentType;\r\n  title: string | PropertyRecord | undefined;\r\n  items: CommonToolbarItem[] | undefined;\r\n  relativePosition: RelativePosition;\r\n  orientation: Orientation;\r\n  onCancel: OnCancelFunc;\r\n  onItemExecuted: OnItemExecutedFunc;\r\n}\r\n\r\n/** @internal */\r\ninterface CardPopupState {\r\n  size: Size;\r\n}\r\n\r\n/** Popup component for Input Editor\r\n * @beta\r\n */\r\nexport class CardPopup extends React.PureComponent<CardPopupProps, CardPopupState> {\r\n  /** @internal */\r\n  public override readonly state = {\r\n    size: new Size(-1, -1),\r\n  };\r\n\r\n  private _onSizeKnown = (newSize: SizeProps) => {\r\n    // istanbul ignore else\r\n    if (!this.state.size.equals(newSize))\r\n      this.setState({ size: Size.create(newSize) });\r\n  };\r\n\r\n  private _handleKeyDown = (event: React.KeyboardEvent): void => {\r\n    switch (event.key) {\r\n      case SpecialKey.Escape:\r\n        this._cancel();\r\n        break;\r\n    }\r\n  };\r\n\r\n  private _cancel() {\r\n    // istanbul ignore else\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel();\r\n    }\r\n  }\r\n\r\n  public override render() {\r\n    let point = PopupManager.getPopupPosition(this.props.el, this.props.pt, new Point(), this.state.size);\r\n    const popupRect = CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);\r\n    point = new Point(popupRect.left, popupRect.top);\r\n\r\n    return (\r\n      <PositionPopup key={this.props.id}\r\n        className={classnames(\"uifw-no-border\", \"uifw-card\")}\r\n        point={point}\r\n        onSizeKnown={this._onSizeKnown}\r\n      >\r\n        <DivWithOutsideClick onOutsideClick={this.props.onCancel} onKeyDown={this._handleKeyDown}>\r\n          <FocusTrap active={true} returnFocusOnDeactivate={true}>\r\n            <Card content={this.props.content} title={this.props.title} items={this.props.items}\r\n              onItemExecuted={this.props.onItemExecuted} />\r\n          </FocusTrap>\r\n        </DivWithOutsideClick>\r\n      </PositionPopup>\r\n    );\r\n  }\r\n}\r\n\r\n/** Props defining a Card component\r\n * @beta */\r\nexport interface CardProps {\r\n  content: PopupContentType;\r\n  title: string | PropertyRecord | undefined;\r\n  items: CommonToolbarItem[] | undefined;\r\n  onItemExecuted: OnItemExecutedFunc;\r\n}\r\n\r\n/** Card component\r\n * @beta */\r\nexport function Card(props: CardProps) {\r\n  let titleNode: React.ReactNode;\r\n  // istanbul ignore else\r\n  if (props.title) {\r\n    if (typeof props.title === \"string\")\r\n      titleNode = <Leading>{props.title}</Leading>;\r\n    else {\r\n      const propertyValueRendererManager = PropertyValueRendererManager.defaultManager;\r\n      const titleValue = propertyValueRendererManager.render(props.title);\r\n      titleNode = <Leading>{titleValue}</Leading>;\r\n    }\r\n  }\r\n\r\n  const content = isReactContent(props.content) ? props.content.reactNode : <MessageDiv message={props.content} />;\r\n\r\n  return (\r\n    <>\r\n      <div className=\"uifw-card-content\">\r\n        {props.title &&\r\n          <>\r\n            {titleNode}\r\n            <div className=\"uifw-card-gap\" />\r\n          </>\r\n        }\r\n        {content}\r\n      </div>\r\n      {props.items &&\r\n        <>\r\n          <div className=\"uifw-card-separator\" />\r\n          <ToolbarWithOverflow\r\n            expandsTo={Direction.Bottom}\r\n            panelAlignment={ToolbarPanelAlignment.Start}\r\n            items={props.items}\r\n            useDragInteraction={true}\r\n            toolbarOpacitySetting={ToolbarOpacitySetting.Transparent}\r\n            onItemExecuted={props.onItemExecuted}\r\n          />\r\n        </>\r\n      }\r\n    </>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"CardPopup.js","sourceRoot":"","sources":["../../../../src/appui-react/popup/CardPopup.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 Popup\n */\n\nimport \"./CardPopup.scss\";\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { CommonToolbarItem, OnCancelFunc, OnItemExecutedFunc, PropertyRecord, RelativePosition, SpecialKey } from \"@itwin/appui-abstract\";\nimport { DivWithOutsideClick, FocusTrap, Orientation, Point, Size, SizeProps } from \"@itwin/core-react\";\nimport { Leading } from \"@itwin/itwinui-react\";\nimport { CursorPopup } from \"../cursor/cursorpopup/CursorPopup\";\nimport { isReactContent, PopupContentType, PopupManager, PopupPropsBase } from \"./PopupManager\";\nimport { PositionPopup } from \"./PositionPopup\";\nimport { MessageDiv } from \"../messages/MessageSpan\";\nimport { Direction, PropertyValueRendererManager, ToolbarOpacitySetting, ToolbarPanelAlignment, ToolbarWithOverflow } from \"@itwin/components-react\";\n\n/** Props for defining a CardPopup editor\n * @beta */\nexport interface CardPopupProps extends PopupPropsBase {\n  content: PopupContentType;\n  title: string | PropertyRecord | undefined;\n  items: CommonToolbarItem[] | undefined;\n  relativePosition: RelativePosition;\n  orientation: Orientation;\n  onCancel: OnCancelFunc;\n  onItemExecuted: OnItemExecutedFunc;\n}\n\n/** @internal */\ninterface CardPopupState {\n  size: Size;\n}\n\n/** Popup component for Input Editor\n * @beta\n */\nexport class CardPopup extends React.PureComponent<CardPopupProps, CardPopupState> {\n  /** @internal */\n  public override readonly state = {\n    size: new Size(-1, -1),\n  };\n\n  private _onSizeKnown = (newSize: SizeProps) => {\n    // istanbul ignore else\n    if (!this.state.size.equals(newSize))\n      this.setState({ size: Size.create(newSize) });\n  };\n\n  private _handleKeyDown = (event: React.KeyboardEvent): void => {\n    switch (event.key) {\n      case SpecialKey.Escape:\n        this._cancel();\n        break;\n    }\n  };\n\n  private _cancel() {\n    // istanbul ignore else\n    if (this.props.onCancel) {\n      this.props.onCancel();\n    }\n  }\n\n  public override render() {\n    let point = PopupManager.getPopupPosition(this.props.el, this.props.pt, new Point(), this.state.size);\n    const popupRect = CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);\n    point = new Point(popupRect.left, popupRect.top);\n\n    return (\n      <PositionPopup key={this.props.id}\n        className={classnames(\"uifw-no-border\", \"uifw-card\")}\n        point={point}\n        onSizeKnown={this._onSizeKnown}\n      >\n        <DivWithOutsideClick onOutsideClick={this.props.onCancel} onKeyDown={this._handleKeyDown}>\n          <FocusTrap active={true} returnFocusOnDeactivate={true}>\n            <Card content={this.props.content} title={this.props.title} items={this.props.items}\n              onItemExecuted={this.props.onItemExecuted} />\n          </FocusTrap>\n        </DivWithOutsideClick>\n      </PositionPopup>\n    );\n  }\n}\n\n/** Props defining a Card component\n * @beta */\nexport interface CardProps {\n  content: PopupContentType;\n  title: string | PropertyRecord | undefined;\n  items: CommonToolbarItem[] | undefined;\n  onItemExecuted: OnItemExecutedFunc;\n}\n\n/** Card component\n * @beta */\nexport function Card(props: CardProps) {\n  let titleNode: React.ReactNode;\n  // istanbul ignore else\n  if (props.title) {\n    if (typeof props.title === \"string\")\n      titleNode = <Leading>{props.title}</Leading>;\n    else {\n      const propertyValueRendererManager = PropertyValueRendererManager.defaultManager;\n      const titleValue = propertyValueRendererManager.render(props.title);\n      titleNode = <Leading>{titleValue}</Leading>;\n    }\n  }\n\n  const content = isReactContent(props.content) ? props.content.reactNode : <MessageDiv message={props.content} />;\n\n  return (\n    <>\n      <div className=\"uifw-card-content\">\n        {props.title &&\n          <>\n            {titleNode}\n            <div className=\"uifw-card-gap\" />\n          </>\n        }\n        {content}\n      </div>\n      {props.items &&\n        <>\n          <div className=\"uifw-card-separator\" />\n          <ToolbarWithOverflow\n            expandsTo={Direction.Bottom}\n            panelAlignment={ToolbarPanelAlignment.Start}\n            items={props.items}\n            useDragInteraction={true}\n            toolbarOpacitySetting={ToolbarOpacitySetting.Transparent}\n            onItemExecuted={props.onItemExecuted}\n          />\n        </>\n      }\n    </>\n  );\n}\n"]}

package/lib/cjs/appui-react/popup/CardPopup.scss

@@ -1,25 +1,25 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
-@import "~@itwin/core-react/lib/cjs/core-react/z-index";
-
-.uifw-card {
-  background-color: $buic-background-card;
-  @include uicore-z-index(content-card-popup);
-
-  .uifw-card-content {
-    padding: 6px 10px;
-  }
-
-  .uifw-card-separator {
-    height: 2px;
-    margin-bottom: 1px;
-    background: rgba($buic-foreground-body-reverse-rgb, 0.45);
-  }
-}
-
-.uifw-card-gap {
-  height: 4px;
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
+@import "~@itwin/core-react/lib/cjs/core-react/z-index";
+
+.uifw-card {
+  background-color: $buic-background-card;
+  @include uicore-z-index(content-card-popup);
+
+  .uifw-card-content {
+    padding: 6px 10px;
+  }
+
+  .uifw-card-separator {
+    height: 2px;
+    margin-bottom: 1px;
+    background: rgba($buic-foreground-body-reverse-rgb, 0.45);
+  }
+}
+
+.uifw-card-gap {
+  height: 4px;
+}

package/lib/cjs/appui-react/popup/HTMLElementPopup.d.ts

@@ -1,31 +1,31 @@
-/** @packageDocumentation
- * @module Popup
- */
-import * as React from "react";
-import { OnCancelFunc, RelativePosition } from "@itwin/appui-abstract";
-import { Orientation, Size } from "@itwin/core-react";
-import { PopupPropsBase } from "./PopupManager";
-/** @alpha */
-export interface HTMLElementPopupProps extends PopupPropsBase {
-    element: HTMLElement;
-    relativePosition: RelativePosition;
-    orientation: Orientation;
-    onCancel: OnCancelFunc;
-}
-/** @internal */
-interface HTMLElementPopupState {
-    size: Size;
-}
-/** Popup component for HTMLElement
- * @alpha
- */
-export declare class HTMLElementPopup extends React.PureComponent<HTMLElementPopupProps, HTMLElementPopupState> {
-    /** @internal */
-    readonly state: {
-        size: Size;
-    };
-    private _onSizeKnown;
-    render(): JSX.Element;
-}
-export {};
+/** @packageDocumentation
+ * @module Popup
+ */
+import * as React from "react";
+import { OnCancelFunc, RelativePosition } from "@itwin/appui-abstract";
+import { Orientation, Size } from "@itwin/core-react";
+import { PopupPropsBase } from "./PopupManager";
+/** @alpha */
+export interface HTMLElementPopupProps extends PopupPropsBase {
+    element: HTMLElement;
+    relativePosition: RelativePosition;
+    orientation: Orientation;
+    onCancel: OnCancelFunc;
+}
+/** @internal */
+interface HTMLElementPopupState {
+    size: Size;
+}
+/** Popup component for HTMLElement
+ * @alpha
+ */
+export declare class HTMLElementPopup extends React.PureComponent<HTMLElementPopupProps, HTMLElementPopupState> {
+    /** @internal */
+    readonly state: {
+        size: Size;
+    };
+    private _onSizeKnown;
+    render(): JSX.Element;
+}
+export {};
 //# sourceMappingURL=HTMLElementPopup.d.ts.map

package/lib/cjs/appui-react/popup/HTMLElementPopup.js

@@ -1,43 +1,43 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Popup
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HTMLElementPopup = void 0;
-const React = require("react");
-const core_react_1 = require("@itwin/core-react");
-const CursorPopup_1 = require("../cursor/cursorpopup/CursorPopup");
-const PopupManager_1 = require("./PopupManager");
-const PositionPopup_1 = require("./PositionPopup");
-const MessageSpan_1 = require("../messages/MessageSpan");
-/** Popup component for HTMLElement
- * @alpha
- */
-class HTMLElementPopup extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        /** @internal */
-        this.state = {
-            size: new core_react_1.Size(-1, -1),
-        };
-        this._onSizeKnown = (newSize) => {
-            // istanbul ignore else
-            if (!this.state.size.equals(newSize))
-                this.setState({ size: core_react_1.Size.create(newSize) });
-        };
-    }
-    render() {
-        let point = PopupManager_1.PopupManager.getPopupPosition(this.props.el, this.props.pt, new core_react_1.Point(), this.state.size);
-        const popupRect = CursorPopup_1.CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);
-        point = new core_react_1.Point(popupRect.left, popupRect.top);
-        return (React.createElement(PositionPopup_1.PositionPopup, { key: this.props.id, className: "uifw-no-border", point: point, onSizeKnown: this._onSizeKnown },
-            React.createElement(core_react_1.DivWithOutsideClick, { onOutsideClick: this.props.onCancel },
-                React.createElement(MessageSpan_1.MessageDiv, { message: this.props.element }))));
-    }
-}
-exports.HTMLElementPopup = HTMLElementPopup;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Popup
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HTMLElementPopup = void 0;
+const React = require("react");
+const core_react_1 = require("@itwin/core-react");
+const CursorPopup_1 = require("../cursor/cursorpopup/CursorPopup");
+const PopupManager_1 = require("./PopupManager");
+const PositionPopup_1 = require("./PositionPopup");
+const MessageSpan_1 = require("../messages/MessageSpan");
+/** Popup component for HTMLElement
+ * @alpha
+ */
+class HTMLElementPopup extends React.PureComponent {
+    constructor() {
+        super(...arguments);
+        /** @internal */
+        this.state = {
+            size: new core_react_1.Size(-1, -1),
+        };
+        this._onSizeKnown = (newSize) => {
+            // istanbul ignore else
+            if (!this.state.size.equals(newSize))
+                this.setState({ size: core_react_1.Size.create(newSize) });
+        };
+    }
+    render() {
+        let point = PopupManager_1.PopupManager.getPopupPosition(this.props.el, this.props.pt, new core_react_1.Point(), this.state.size);
+        const popupRect = CursorPopup_1.CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);
+        point = new core_react_1.Point(popupRect.left, popupRect.top);
+        return (React.createElement(PositionPopup_1.PositionPopup, { key: this.props.id, className: "uifw-no-border", point: point, onSizeKnown: this._onSizeKnown },
+            React.createElement(core_react_1.DivWithOutsideClick, { onOutsideClick: this.props.onCancel },
+                React.createElement(MessageSpan_1.MessageDiv, { message: this.props.element }))));
+    }
+}
+exports.HTMLElementPopup = HTMLElementPopup;
 //# sourceMappingURL=HTMLElementPopup.js.map

package/lib/cjs/appui-react/popup/HTMLElementPopup.js.map

@@ -1 +1 @@
-{"version":3,"file":"HTMLElementPopup.js","sourceRoot":"","sources":["../../../../src/appui-react/popup/HTMLElementPopup.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,+BAA+B;AAE/B,kDAA6F;AAC7F,mEAAgE;AAChE,iDAA8D;AAC9D,mDAAgD;AAChD,yDAAqD;AAerD;;GAEG;AACH,MAAa,gBAAiB,SAAQ,KAAK,CAAC,aAA2D;IAAvG;;QACE,gBAAgB;QACS,UAAK,GAAG;YAC/B,IAAI,EAAE,IAAI,iBAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;SACvB,CAAC;QAEM,iBAAY,GAAG,CAAC,OAAkB,EAAE,EAAE;YAC5C,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;gBAClC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAI,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClD,CAAC,CAAC;IAmBJ,CAAC;IAjBiB,MAAM;QACpB,IAAI,KAAK,GAAG,2BAAY,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,kBAAK,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACtG,MAAM,SAAS,GAAG,yBAAW,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;QACnH,KAAK,GAAG,IAAI,kBAAK,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;QAEjD,OAAO,CACL,oBAAC,6BAAa,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EAC/B,SAAS,EAAC,gBAAgB,EAC1B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,YAAY;YAE9B,oBAAC,gCAAmB,IAAC,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ;gBACtD,oBAAC,wBAAU,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAI,CACvB,CACR,CACjB,CAAC;IACJ,CAAC;CACF;AA7BD,4CA6BC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Popup\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { OnCancelFunc, RelativePosition } from \"@itwin/appui-abstract\";\r\nimport { DivWithOutsideClick, Orientation, Point, Size, SizeProps } from \"@itwin/core-react\";\r\nimport { CursorPopup } from \"../cursor/cursorpopup/CursorPopup\";\r\nimport { PopupManager, PopupPropsBase } from \"./PopupManager\";\r\nimport { PositionPopup } from \"./PositionPopup\";\r\nimport { MessageDiv } from \"../messages/MessageSpan\";\r\n\r\n/** @alpha */\r\nexport interface HTMLElementPopupProps extends PopupPropsBase {\r\n  element: HTMLElement;\r\n  relativePosition: RelativePosition;\r\n  orientation: Orientation;\r\n  onCancel: OnCancelFunc;\r\n}\r\n\r\n/** @internal */\r\ninterface HTMLElementPopupState {\r\n  size: Size;\r\n}\r\n\r\n/** Popup component for HTMLElement\r\n * @alpha\r\n */\r\nexport class HTMLElementPopup extends React.PureComponent<HTMLElementPopupProps, HTMLElementPopupState> {\r\n  /** @internal */\r\n  public override readonly state = {\r\n    size: new Size(-1, -1),\r\n  };\r\n\r\n  private _onSizeKnown = (newSize: SizeProps) => {\r\n    // istanbul ignore else\r\n    if (!this.state.size.equals(newSize))\r\n      this.setState({ size: Size.create(newSize) });\r\n  };\r\n\r\n  public override render() {\r\n    let point = PopupManager.getPopupPosition(this.props.el, this.props.pt, new Point(), this.state.size);\r\n    const popupRect = CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);\r\n    point = new Point(popupRect.left, popupRect.top);\r\n\r\n    return (\r\n      <PositionPopup key={this.props.id}\r\n        className=\"uifw-no-border\"\r\n        point={point}\r\n        onSizeKnown={this._onSizeKnown}\r\n      >\r\n        <DivWithOutsideClick onOutsideClick={this.props.onCancel}>\r\n          <MessageDiv message={this.props.element} />\r\n        </DivWithOutsideClick>\r\n      </PositionPopup>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"HTMLElementPopup.js","sourceRoot":"","sources":["../../../../src/appui-react/popup/HTMLElementPopup.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,+BAA+B;AAE/B,kDAA6F;AAC7F,mEAAgE;AAChE,iDAA8D;AAC9D,mDAAgD;AAChD,yDAAqD;AAerD;;GAEG;AACH,MAAa,gBAAiB,SAAQ,KAAK,CAAC,aAA2D;IAAvG;;QACE,gBAAgB;QACS,UAAK,GAAG;YAC/B,IAAI,EAAE,IAAI,iBAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;SACvB,CAAC;QAEM,iBAAY,GAAG,CAAC,OAAkB,EAAE,EAAE;YAC5C,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;gBAClC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAI,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClD,CAAC,CAAC;IAmBJ,CAAC;IAjBiB,MAAM;QACpB,IAAI,KAAK,GAAG,2BAAY,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,kBAAK,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACtG,MAAM,SAAS,GAAG,yBAAW,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;QACnH,KAAK,GAAG,IAAI,kBAAK,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;QAEjD,OAAO,CACL,oBAAC,6BAAa,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EAC/B,SAAS,EAAC,gBAAgB,EAC1B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,CAAC,YAAY;YAE9B,oBAAC,gCAAmB,IAAC,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ;gBACtD,oBAAC,wBAAU,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAI,CACvB,CACR,CACjB,CAAC;IACJ,CAAC;CACF;AA7BD,4CA6BC","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 Popup\n */\n\nimport * as React from \"react\";\nimport { OnCancelFunc, RelativePosition } from \"@itwin/appui-abstract\";\nimport { DivWithOutsideClick, Orientation, Point, Size, SizeProps } from \"@itwin/core-react\";\nimport { CursorPopup } from \"../cursor/cursorpopup/CursorPopup\";\nimport { PopupManager, PopupPropsBase } from \"./PopupManager\";\nimport { PositionPopup } from \"./PositionPopup\";\nimport { MessageDiv } from \"../messages/MessageSpan\";\n\n/** @alpha */\nexport interface HTMLElementPopupProps extends PopupPropsBase {\n  element: HTMLElement;\n  relativePosition: RelativePosition;\n  orientation: Orientation;\n  onCancel: OnCancelFunc;\n}\n\n/** @internal */\ninterface HTMLElementPopupState {\n  size: Size;\n}\n\n/** Popup component for HTMLElement\n * @alpha\n */\nexport class HTMLElementPopup extends React.PureComponent<HTMLElementPopupProps, HTMLElementPopupState> {\n  /** @internal */\n  public override readonly state = {\n    size: new Size(-1, -1),\n  };\n\n  private _onSizeKnown = (newSize: SizeProps) => {\n    // istanbul ignore else\n    if (!this.state.size.equals(newSize))\n      this.setState({ size: Size.create(newSize) });\n  };\n\n  public override render() {\n    let point = PopupManager.getPopupPosition(this.props.el, this.props.pt, new Point(), this.state.size);\n    const popupRect = CursorPopup.getPopupRect(point, this.props.offset, this.state.size, this.props.relativePosition);\n    point = new Point(popupRect.left, popupRect.top);\n\n    return (\n      <PositionPopup key={this.props.id}\n        className=\"uifw-no-border\"\n        point={point}\n        onSizeKnown={this._onSizeKnown}\n      >\n        <DivWithOutsideClick onOutsideClick={this.props.onCancel}>\n          <MessageDiv message={this.props.element} />\n        </DivWithOutsideClick>\n      </PositionPopup>\n    );\n  }\n}\n"]}

package/lib/cjs/appui-react/popup/InputEditorPopup.d.ts

@@ -1,39 +1,39 @@
-/** @packageDocumentation
- * @module Popup
- */
-import * as React from "react";
-import { OnCancelFunc, OnValueCommitFunc, PropertyRecord } from "@itwin/appui-abstract";
-import { PropertyUpdatedArgs } from "@itwin/components-react";
-import { Size } from "@itwin/core-react";
-import { PopupPropsBase } from "./PopupManager";
-/** @beta */
-export declare class InputEditorCommitHandler {
-    readonly onCommit: OnValueCommitFunc;
-    constructor(onCommit: OnValueCommitFunc);
-    handleCommit: (args: PropertyUpdatedArgs) => void;
-}
-/** Props for popup editor
- * @beta */
-export interface InputEditorPopupProps extends PopupPropsBase {
-    record: PropertyRecord;
-    onCancel: OnCancelFunc;
-    commitHandler: InputEditorCommitHandler;
-}
-/** @internal */
-interface InputEditorPopupState {
-    size: Size;
-}
-/** Popup component for Input Editor
- * @alpha
- */
-export declare class InputEditorPopup extends React.PureComponent<InputEditorPopupProps, InputEditorPopupState> {
-    /** @internal */
-    readonly state: {
-        size: Size;
-    };
-    private _onSizeKnown;
-    /** @internal */
-    render(): JSX.Element;
-}
-export {};
+/** @packageDocumentation
+ * @module Popup
+ */
+import * as React from "react";
+import { OnCancelFunc, OnValueCommitFunc, PropertyRecord } from "@itwin/appui-abstract";
+import { PropertyUpdatedArgs } from "@itwin/components-react";
+import { Size } from "@itwin/core-react";
+import { PopupPropsBase } from "./PopupManager";
+/** @beta */
+export declare class InputEditorCommitHandler {
+    readonly onCommit: OnValueCommitFunc;
+    constructor(onCommit: OnValueCommitFunc);
+    handleCommit: (args: PropertyUpdatedArgs) => void;
+}
+/** Props for popup editor
+ * @beta */
+export interface InputEditorPopupProps extends PopupPropsBase {
+    record: PropertyRecord;
+    onCancel: OnCancelFunc;
+    commitHandler: InputEditorCommitHandler;
+}
+/** @internal */
+interface InputEditorPopupState {
+    size: Size;
+}
+/** Popup component for Input Editor
+ * @alpha
+ */
+export declare class InputEditorPopup extends React.PureComponent<InputEditorPopupProps, InputEditorPopupState> {
+    /** @internal */
+    readonly state: {
+        size: Size;
+    };
+    private _onSizeKnown;
+    /** @internal */
+    render(): JSX.Element;
+}
+export {};
 //# sourceMappingURL=InputEditorPopup.d.ts.map