@itwin/core-react 3.0.0-dev.77 → 3.0.0-dev.81

package/lib/esm/core-react/hocs/withTimeout.d.ts

@@ -0,0 +1,75 @@
+/** @packageDocumentation
+ * @module Common
+ */
+import * as React from "react";
+import { Timer } from "../utils/Timer";
+/** Properties for [[withTimeout]] React higher-order component
+ * @public
+ */
+export interface WithTimeoutProps {
+    /** Timeout duration in milliseconds */
+    timeout: number;
+    /** Callback function for timeout */
+    onTimeout?: () => void;
+}
+/** withTimeout is a React higher-order component that adds timeout support.
+ * @public
+ */
+export declare const withTimeout: <ComponentProps extends {}>(Component: React.ComponentType<ComponentProps>) => {
+    new (props: (ComponentProps & WithTimeoutProps) | Readonly<ComponentProps & WithTimeoutProps>): {
+        timer: Timer;
+        componentDidMount(): void;
+        componentDidUpdate(_prevProps: Readonly<ComponentProps & WithTimeoutProps>): void;
+        componentWillUnmount(): void;
+        render(): JSX.Element;
+        startTimer(timeout: number): void;
+        context: any;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<ComponentProps & WithTimeoutProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<ComponentProps & WithTimeoutProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<ComponentProps & WithTimeoutProps>, prevState: Readonly<{}>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    new (props: ComponentProps & WithTimeoutProps, context: any): {
+        timer: Timer;
+        componentDidMount(): void;
+        componentDidUpdate(_prevProps: Readonly<ComponentProps & WithTimeoutProps>): void;
+        componentWillUnmount(): void;
+        render(): JSX.Element;
+        startTimer(timeout: number): void;
+        context: any;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<ComponentProps & WithTimeoutProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<ComponentProps & WithTimeoutProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<ComponentProps & WithTimeoutProps>, prevState: Readonly<{}>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<ComponentProps & WithTimeoutProps>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    contextType?: React.Context<any> | undefined;
+};
+//# sourceMappingURL=withTimeout.d.ts.map

package/lib/esm/core-react/hocs/withTimeout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"withTimeout.d.ts","sourceRoot":"","sources":["../../../../src/core-react/hocs/withTimeout.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAEvC;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,uCAAuC;IACvC,OAAO,EAAE,MAAM,CAAC;IAChB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,WAAW;;eAKN,KAAK;6BAEkB,IAAI;qFAKoD,IAAI;gCAIzD,IAAI;;4BAWjB,MAAM;;;;;;;;;;;;;;;;;;;;;;eAtBnB,KAAK;6BAEkB,IAAI;qFAKoD,IAAI;gCAIzD,IAAI;;4BAWjB,MAAM;;;;;;;;;;;;;;;;;;;;;;CAQpC,CAAC"}

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

@@ -0,0 +1,43 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Common
+ */
+import * as React from "react";
+import { Timer } from "../utils/Timer";
+/** withTimeout is a React higher-order component that adds timeout support.
+ * @public
+ */
+export const withTimeout = (
+// eslint-disable-next-line @typescript-eslint/naming-convention
+Component) => {
+    return class WithTimeout extends React.PureComponent {
+        constructor() {
+            super(...arguments);
+            this.timer = new Timer(0);
+        }
+        componentDidMount() {
+            this.timer.setOnExecute(() => this.props.onTimeout && this.props.onTimeout());
+            this.startTimer(this.props.timeout);
+        }
+        componentDidUpdate(_prevProps) {
+            this.startTimer(this.props.timeout);
+        }
+        componentWillUnmount() {
+            this.timer.stop();
+        }
+        render() {
+            const { timeout, onTimeout, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars
+            return (React.createElement(Component, { ...props, ...this.state }));
+        }
+        startTimer(timeout) {
+            if (this.timer.isRunning)
+                return;
+            this.timer.delay = timeout;
+            this.timer.start();
+        }
+    };
+};
+//# sourceMappingURL=withTimeout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"withTimeout.js","sourceRoot":"","sources":["../../../../src/core-react/hocs/withTimeout.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAYvC;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG;AACzB,gEAAgE;AAChE,SAA8C,EAC9C,EAAE;IACF,OAAO,MAAM,WAAY,SAAQ,KAAK,CAAC,aAAgD;QAAhF;;YACE,UAAK,GAAU,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QA6BrC,CAAC;QA3BiB,iBAAiB;YAC/B,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC;YAC9E,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACtC,CAAC;QAEe,kBAAkB,CAAC,UAAuD;YACxF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACtC,CAAC;QAEe,oBAAoB;YAClC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QACpB,CAAC;QAEe,MAAM;YACpB,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;YAC7G,OAAO,CACL,oBAAC,SAAS,OAAK,KAAuB,KAAM,IAAI,CAAC,KAAK,GAAI,CAC3D,CAAC;QACJ,CAAC;QAEM,UAAU,CAAC,OAAe;YAC/B,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS;gBACtB,OAAO;YAET,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;QACrB,CAAC;KACF,CAAC;AACJ,CAAC,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 Common\n */\n\nimport * as React from \"react\";\nimport { Timer } from \"../utils/Timer\";\n\n/** Properties for [[withTimeout]] React higher-order component\n * @public\n */\nexport interface WithTimeoutProps {\n  /** Timeout duration in milliseconds */\n  timeout: number;\n  /** Callback function for timeout */\n  onTimeout?: () => void;\n}\n\n/** withTimeout is a React higher-order component that adds timeout support.\n * @public\n */\nexport const withTimeout = <ComponentProps extends {}>(\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  Component: React.ComponentType<ComponentProps>,\n) => {\n  return class WithTimeout extends React.PureComponent<ComponentProps & WithTimeoutProps> {\n    public timer: Timer = new Timer(0);\n\n    public override componentDidMount(): void {\n      this.timer.setOnExecute(() => this.props.onTimeout && this.props.onTimeout());\n      this.startTimer(this.props.timeout);\n    }\n\n    public override componentDidUpdate(_prevProps: Readonly<ComponentProps & WithTimeoutProps>): void {\n      this.startTimer(this.props.timeout);\n    }\n\n    public override componentWillUnmount(): void {\n      this.timer.stop();\n    }\n\n    public override render() {\n      const { timeout, onTimeout, ...props } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\n      return (\n        <Component {...props as ComponentProps} {...this.state} />\n      );\n    }\n\n    public startTimer(timeout: number) {\n      if (this.timer.isRunning)\n        return;\n\n      this.timer.delay = timeout;\n      this.timer.start();\n    }\n  };\n};\n"]}

package/lib/esm/core-react/icons/IconComponent.d.ts

@@ -0,0 +1,23 @@
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./IconComponent.scss";
+import * as React from "react";
+import { ConditionalStringValue } from "@itwin/appui-abstract";
+import { CommonProps } from "../utils/Props";
+/** Prototype for an IconSpec which can be a string, ReactNode or ConditionalStringValue.
+ * @public
+ */
+export declare type IconSpec = string | ConditionalStringValue | React.ReactNode;
+/** Properties for the [[Icon]] React component
+ * @public
+ */
+export interface IconProps extends CommonProps {
+    /** CSS class name or SvgSprite/SvgPath for icon */
+    iconSpec?: IconSpec;
+}
+/** Icon Functional component displays an icon based on an [[IconSpec]].
+ * @public
+ */
+export declare function Icon(props: IconProps): JSX.Element | null;
+//# sourceMappingURL=IconComponent.d.ts.map

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

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

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

@@ -0,0 +1,31 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./IconComponent.scss";
+import * as React from "react";
+import classnames from "classnames";
+import { ConditionalStringValue, IconSpecUtilities } from "@itwin/appui-abstract";
+import { SvgSprite } from "./SvgSprite";
+/** Icon Functional component displays an icon based on an [[IconSpec]].
+ * @public
+ */
+export function Icon(props) {
+    if (!props.iconSpec)
+        return null;
+    const iconString = (typeof props.iconSpec === "string" || props.iconSpec instanceof ConditionalStringValue) ?
+        ConditionalStringValue.getValue(props.iconSpec) : undefined;
+    if (iconString) {
+        const svgSource = IconSpecUtilities.getSvgSource(iconString);
+        // if string begins with "svg:" then we assume it was imported (into extension source file) using webpack loader svg-sprite-loader
+        if (svgSource !== undefined)
+            return (React.createElement("i", { className: classnames("icon", "core-svg-icon", props.className), style: props.style },
+                React.createElement(SvgSprite, { src: svgSource })));
+        return (React.createElement("i", { className: classnames("icon", iconString, props.className), style: props.style }));
+    }
+    return (React.createElement("i", { className: classnames("icon", "core-svg-icon", props.className), style: props.style }, props.iconSpec));
+}
+//# sourceMappingURL=IconComponent.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IconComponent.js","sourceRoot":"","sources":["../../../../src/core-react/icons/IconComponent.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAClF,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAgBxC;;GAEG;AACH,MAAM,UAAU,IAAI,CAAC,KAAgB;IACnC,IAAI,CAAC,KAAK,CAAC,QAAQ;QACjB,OAAO,IAAI,CAAC;IACd,MAAM,UAAU,GAAG,CAAC,OAAO,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,KAAK,CAAC,QAAQ,YAAY,sBAAsB,CAAC,CAAC,CAAC;QAC3G,sBAAsB,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9D,IAAI,UAAU,EAAE;QACd,MAAM,SAAS,GAAG,iBAAiB,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QAC7D,kIAAkI;QAClI,IAAI,SAAS,KAAK,SAAS;YACzB,OAAO,CACL,2BAAG,SAAS,EAAE,UAAU,CAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK;gBACpF,oBAAC,SAAS,IAAC,GAAG,EAAE,SAAS,GAAI,CAC3B,CACL,CAAC;QAEJ,OAAO,CAAC,2BAAG,SAAS,EAAE,UAAU,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,CAAC,CAAC;KAChG;IAED,OAAO,CACL,2BAAG,SAAS,EAAE,UAAU,CAAC,MAAM,EAAE,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,IACnF,KAAK,CAAC,QAAQ,CACb,CACL,CAAC;AACJ,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 Icon\n */\n\nimport \"./IconComponent.scss\";\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { ConditionalStringValue, IconSpecUtilities } from \"@itwin/appui-abstract\";\nimport { SvgSprite } from \"./SvgSprite\";\nimport { CommonProps } from \"../utils/Props\";\n\n/** Prototype for an IconSpec which can be a string, ReactNode or ConditionalStringValue.\n * @public\n */\nexport type IconSpec = string | ConditionalStringValue | React.ReactNode;\n\n/** Properties for the [[Icon]] React component\n * @public\n */\nexport interface IconProps extends CommonProps {\n  /** CSS class name or SvgSprite/SvgPath for icon */\n  iconSpec?: IconSpec;\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)\n    return null;\n  const iconString = (typeof props.iconSpec === \"string\" || props.iconSpec instanceof ConditionalStringValue) ?\n    ConditionalStringValue.getValue(props.iconSpec) : undefined;\n\n  if (iconString) {\n    const svgSource = IconSpecUtilities.getSvgSource(iconString);\n    // if string begins with \"svg:\" then we assume it was imported (into extension source file) using webpack loader svg-sprite-loader\n    if (svgSource !== undefined)\n      return (\n        <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} style={props.style}>\n          <SvgSprite src={svgSource} />\n        </i>\n      );\n\n    return (<i className={classnames(\"icon\", iconString, props.className)} style={props.style} />);\n  }\n\n  return (\n    <i className={classnames(\"icon\", \"core-svg-icon\", props.className)} style={props.style}>\n      {props.iconSpec}\n    </i>\n  );\n}\n"]}

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

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./variables";
+
+.core-svg-icon {
+  width:  $uicore-icons-small;
+  height: $uicore-icons-small;
+}

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

@@ -0,0 +1,24 @@
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./SvgSprite.scss";
+import * as React from "react";
+import { CommonProps } from "../utils/Props";
+/** Properties of [[SvgPath]] component.
+ * @public
+ */
+export interface SvgPathProps extends CommonProps {
+    /** Svg graphics paths */
+    paths: string[];
+    /** Svg viewBox width */
+    viewBoxWidth: number;
+    /** Svg viewBox height */
+    viewBoxHeight: number;
+}
+/** Svg element wrapper with specified Svg paths.
+ * @public
+ */
+export declare class SvgPath extends React.PureComponent<SvgPathProps> {
+    render(): JSX.Element;
+}
+//# sourceMappingURL=SvgPath.d.ts.map

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

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

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

@@ -0,0 +1,24 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./SvgSprite.scss";
+import classnames from "classnames";
+import * as React from "react";
+/** Svg element wrapper with specified Svg paths.
+ * @public
+ */
+export class SvgPath extends React.PureComponent {
+    render() {
+        const className = classnames("core-icons-svgSprite", this.props.className);
+        const viewBox = `0 0 ${this.props.viewBoxWidth} ${this.props.viewBoxHeight}`;
+        return (React.createElement("svg", { className: className, style: this.props.style, width: "100%", height: "100%", viewBox: viewBox },
+            React.createElement("g", null, this.props.paths.map((path, index) => {
+                return (React.createElement("path", { d: path, key: index }));
+            }))));
+    }
+}
+//# sourceMappingURL=SvgPath.js.map

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

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

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

@@ -0,0 +1,20 @@
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./SvgSprite.scss";
+import * as React from "react";
+import { CommonProps } from "../utils/Props";
+/** Properties of [[SvgSprite]] component.
+ * @public
+ */
+export interface SvgSpriteProps extends CommonProps {
+    /** Source for the Svg */
+    src: string;
+}
+/** Svg element wrapper.
+ * @public
+ */
+export declare class SvgSprite extends React.PureComponent<SvgSpriteProps> {
+    render(): JSX.Element;
+}
+//# sourceMappingURL=SvgSprite.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SvgSprite.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgSprite.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAE1B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,yBAAyB;IACzB,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;GAEG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC;IAChD,MAAM;CAYvB"}

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

@@ -0,0 +1,21 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./SvgSprite.scss";
+import classnames from "classnames";
+import * as React from "react";
+/** Svg element wrapper.
+ * @public
+ */
+export class SvgSprite extends React.PureComponent {
+    render() {
+        const className = classnames("core-icons-svgSprite", this.props.className);
+        return (React.createElement("svg", { className: className, style: this.props.style, width: "100%", height: "100%" },
+            React.createElement("use", { xmlnsXlink: "http://www.w3.org/1999/xlink", xlinkHref: this.props.src })));
+    }
+}
+//# sourceMappingURL=SvgSprite.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SvgSprite.js","sourceRoot":"","sources":["../../../../src/core-react/icons/SvgSprite.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,kBAAkB,CAAC;AAC1B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B;;GAEG;AACH,MAAM,OAAO,SAAU,SAAQ,KAAK,CAAC,aAA6B;IAChD,MAAM;QACpB,MAAM,SAAS,GAAG,UAAU,CAC1B,sBAAsB,EACtB,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM;YAC5E,6BAAK,UAAU,EAAC,8BAA8B,EAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,GAAI,CACxE,CACP,CAAC;IACJ,CAAC;CACF","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 \"./SvgSprite.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { CommonProps } from \"../utils/Props\";\n\n/** Properties of [[SvgSprite]] component.\n * @public\n */\nexport interface SvgSpriteProps extends CommonProps {\n  /** Source for the Svg */\n  src: string;\n}\n\n/** Svg element wrapper.\n * @public\n */\nexport class SvgSprite extends React.PureComponent<SvgSpriteProps> {\n  public override render() {\n    const className = classnames(\n      \"core-icons-svgSprite\",\n      this.props.className,\n    );\n\n    return (\n      <svg className={className} style={this.props.style} width=\"100%\" height=\"100%\">\n        <use xmlnsXlink=\"http://www.w3.org/1999/xlink\" xlinkHref={this.props.src} />\n      </svg>\n    );\n  }\n}\n"]}

package/lib/esm/core-react/icons/SvgSprite.scss

@@ -0,0 +1,15 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+.core-icons-svgSprite {
+  display: inline-block;
+  box-sizing: border-box;
+  background-color: transparent;
+  border: none;
+  padding: auto;
+  overflow: hidden;
+  vertical-align: top;
+  fill: currentColor;
+  stroke: transparent;
+}

package/lib/esm/core-react/icons/WebFontIcon.d.ts

@@ -0,0 +1,27 @@
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./WebFontIcon.scss";
+import "@bentley/icons-generic-webfont/dist/bentley-icons-generic-webfont.css";
+import * as React from "react";
+import { CommonProps } from "../utils/Props";
+/** Properties for the [[WebFontIcon]] React component
+ * @public
+ */
+export interface WebFontIconProps extends CommonProps {
+    /** Bentley Web Font icon name */
+    iconName: string;
+    /** Click event handler */
+    onClick?: React.MouseEventHandler<HTMLSpanElement>;
+    /** Text that will be shown when hovered on the icon. */
+    title?: string;
+    /** Size of the icon */
+    iconSize?: "x-small" | "small" | "medium" | "large" | "x-large";
+    /** Class name of icon used for custom font-family icons */
+    iconClassName?: string;
+}
+/** WebFontIcon React component
+ * @public
+ */
+export declare function WebFontIcon(props: WebFontIconProps): JSX.Element;
+//# sourceMappingURL=WebFontIcon.d.ts.map

package/lib/esm/core-react/icons/WebFontIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebFontIcon.d.ts","sourceRoot":"","sources":["../../../../src/core-react/icons/WebFontIcon.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAC5B,OAAO,uEAAuE,CAAC;AAE/E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD,iCAAiC;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,0BAA0B;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACnD,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAChE,2DAA2D;IAC3D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,eAiBlD"}

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

@@ -0,0 +1,19 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Icon
+ */
+import "./WebFontIcon.scss";
+import "@bentley/icons-generic-webfont/dist/bentley-icons-generic-webfont.css";
+import classnames from "classnames";
+import * as React from "react";
+/** WebFontIcon React component
+ * @public
+ */
+export function WebFontIcon(props) {
+    const className = classnames(props.iconClassName || "bui-webfont-icon", props.iconName, props.iconSize ? `uicore-icons-${props.iconSize}` : undefined, props.className);
+    return (React.createElement("span", { className: className, title: props.title, style: props.style, onClick: props.onClick, role: "presentation" }));
+}
+//# sourceMappingURL=WebFontIcon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"WebFontIcon.js","sourceRoot":"","sources":["../../../../src/core-react/icons/WebFontIcon.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAC5B,OAAO,uEAAuE,CAAC;AAC/E,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAmB/B;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,KAAuB;IACjD,MAAM,SAAS,GAAG,UAAU,CAC1B,KAAK,CAAC,aAAa,IAAI,kBAAkB,EACzC,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,gBAAgB,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,EAC7D,KAAK,CAAC,SAAS,CAChB,CAAC;IAEF,OAAO,CACL,8BACE,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,IAAI,EAAC,cAAc,GACnB,CACH,CAAC;AACJ,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 Icon\n */\n\nimport \"./WebFontIcon.scss\";\nimport \"@bentley/icons-generic-webfont/dist/bentley-icons-generic-webfont.css\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { CommonProps } from \"../utils/Props\";\n\n/** Properties for the [[WebFontIcon]] React component\n * @public\n */\nexport interface WebFontIconProps extends CommonProps {\n  /** Bentley Web Font icon name */\n  iconName: string;\n  /** Click event handler */\n  onClick?: React.MouseEventHandler<HTMLSpanElement>;\n  /** Text that will be shown when hovered on the icon. */\n  title?: string;\n  /** Size of the icon */\n  iconSize?: \"x-small\" | \"small\" | \"medium\" | \"large\" | \"x-large\";\n  /** Class name of icon used for custom font-family icons */\n  iconClassName?: string;\n}\n\n/** WebFontIcon React component\n * @public\n */\nexport function WebFontIcon(props: WebFontIconProps) {\n  const className = classnames(\n    props.iconClassName || \"bui-webfont-icon\",\n    props.iconName,\n    props.iconSize ? `uicore-icons-${props.iconSize}` : undefined,\n    props.className,\n  );\n\n  return (\n    <span\n      className={className}\n      title={props.title}\n      style={props.style}\n      onClick={props.onClick}\n      role=\"presentation\"\n    />\n  );\n}\n"]}

package/lib/esm/core-react/icons/WebFontIcon.scss

@@ -0,0 +1,17 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./index";
+
+.bui-webfont-icon {
+  font-family: bentley-icons-generic-webfont !important;
+  speak: none;
+  font-style: normal;
+  font-weight: normal !important;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}

package/lib/esm/core-react/icons/classes.scss

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./index";
+
+.uicore-icons-large { @include uicore-icons-large; }
+.uicore-icons-medium { @include uicore-icons-medium; }
+.uicore-icons-small { @include uicore-icons-small; }
+.uicore-icons-x-large { @include uicore-icons-x-large; }

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

@@ -0,0 +1,6 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./variables";
+@import "./mixins";

package/lib/esm/core-react/icons/mixins.scss

@@ -0,0 +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 "./variables";
+
+@mixin uicore-icons-small {
+  width: $uicore-icons-small;
+  height: $uicore-icons-small;
+}
+
+@mixin uicore-icons-medium {
+  width: $uicore-icons-medium;
+  height: $uicore-icons-medium;
+}
+
+@mixin uicore-icons-large {
+  width: $uicore-icons-large;
+  height: $uicore-icons-large;
+}
+
+@mixin uicore-icons-x-large {
+  width: $uicore-icons-x-large;
+  height: $uicore-icons-x-large;
+}

package/lib/esm/core-react/icons/variables.scss

@@ -0,0 +1,21 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/colors";
+
+// Sizes
+$uicore-icons-x-small: 12px;
+$uicore-icons-smaller: 14px;
+$uicore-icons-small: 16px;
+$uicore-icons-medium: 2 * $uicore-icons-small;
+$uicore-icons-large: 3 * $uicore-icons-small;
+$uicore-icons-x-large: 4 * $uicore-icons-small;
+
+// Colors
+$uicore-icons-light: $uicore-gray;
+$uicore-icons-dark: $uicore-gray-5;
+$uicore-icons-green: $uicore-green;
+$uicore-icons-red: $uicore-red;
+$uicore-icons-orange: $uicore-orange;
+$uicore-icons-blue: $uicore-teal-b;

package/lib/esm/core-react/imagecheckbox/ImageCheckBox.d.ts

@@ -0,0 +1,43 @@
+/** @packageDocumentation
+ * @module Checkbox
+ */
+import "./ImageCheckBox.scss";
+import * as React from "react";
+import { CommonProps } from "../utils/Props";
+/** Properties for the [[ImageCheckBox]] component
+ * @public
+ */
+export interface ImageCheckBoxProps extends CommonProps {
+    /** Image for the "checked" state */
+    imageOn: string | React.ReactNode;
+    /** Image for the "unchecked" (default) state */
+    imageOff: string | React.ReactNode;
+    /** Determine if the item is checked or not */
+    checked?: boolean;
+    /** Determine if the item is disabled or not */
+    disabled?: boolean;
+    /** Function called when item is clicked. */
+    onClick?: (checked: boolean) => any;
+    /** Custom CSS class name for the checkbox input element */
+    inputClassName?: string;
+    /** Custom CSS Style for the checkbox input element */
+    inputStyle?: React.CSSProperties;
+    /** Tooltip to be displayed when mouse is hovered over the checkbox */
+    tooltip?: string;
+    /** If true, draw a border around the image checkbox */
+    border?: boolean;
+    /** Provides ability to return reference to HTMLInputElement */
+    inputRef?: React.Ref<HTMLInputElement>;
+}
+/**
+ * ImageCheckBox React component shows a checked or unchecked image
+ * @public
+ */
+export declare class ImageCheckBox extends React.PureComponent<ImageCheckBoxProps> {
+    private _onChange;
+    private _onInputClick;
+    private _onLabelClick;
+    /** @internal */
+    render(): JSX.Element;
+}
+//# sourceMappingURL=ImageCheckBox.d.ts.map

package/lib/esm/core-react/imagecheckbox/ImageCheckBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageCheckBox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/imagecheckbox/ImageCheckBox.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD,oCAAoC;IACpC,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,gDAAgD;IAChD,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,GAAG,CAAC;IACpC,2DAA2D;IAC3D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,sDAAsD;IACtD,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACjC,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uDAAuD;IACvD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACxC;AAED;;;GAGG;AACH,qBAAa,aAAc,SAAQ,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC;IAExE,OAAO,CAAC,SAAS,CASf;IAEF,OAAO,CAAC,aAAa,CAInB;IAEF,OAAO,CAAC,aAAa,CAInB;IAEF,gBAAgB;IACA,MAAM;CAgBvB"}

package/lib/esm/core-react/imagecheckbox/ImageCheckBox.js

@@ -0,0 +1,53 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Checkbox
+ */
+import "./ImageCheckBox.scss";
+import classnames from "classnames";
+import * as React from "react";
+import { Icon } from "../icons/IconComponent";
+/**
+ * ImageCheckBox React component shows a checked or unchecked image
+ * @public
+ */
+export class ImageCheckBox extends React.PureComponent {
+    constructor() {
+        super(...arguments);
+        this._onChange = (e) => {
+            // istanbul ignore next
+            if (e && e.stopPropagation)
+                e.stopPropagation();
+            // istanbul ignore else
+            if (this.props.onClick) {
+                this.props.onClick(e.target.checked);
+            }
+        };
+        this._onInputClick = (e) => {
+            // istanbul ignore next
+            if (e && e.stopPropagation)
+                e.stopPropagation();
+        };
+        this._onLabelClick = (e) => {
+            // istanbul ignore next
+            if (e && e.stopPropagation)
+                e.stopPropagation();
+        };
+    }
+    /** @internal */
+    render() {
+        const checkBoxClass = classnames("core-image-checkbox", this.props.className);
+        const imageClass = classnames("image", this.props.border && "image-checkbox-border");
+        const iconSpec = this.props.checked ? this.props.imageOn : this.props.imageOff;
+        return (
+        /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
+        /* eslint-disable-next-line jsx-a11y/click-events-have-key-events */
+        React.createElement("label", { className: checkBoxClass, style: this.props.style, onClick: this._onLabelClick, title: this.props.tooltip },
+            React.createElement("input", { type: "checkbox", className: this.props.inputClassName, style: this.props.inputStyle, checked: this.props.checked, disabled: this.props.disabled, onChange: this._onChange, onClick: this._onInputClick, ref: this.props.inputRef }),
+            React.createElement("span", { className: imageClass },
+                React.createElement(Icon, { iconSpec: iconSpec }))));
+    }
+}
+//# sourceMappingURL=ImageCheckBox.js.map

package/lib/esm/core-react/imagecheckbox/ImageCheckBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageCheckBox.js","sourceRoot":"","sources":["../../../../src/core-react/imagecheckbox/ImageCheckBox.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AA6B9C;;;GAGG;AACH,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,aAAiC;IAA1E;;QAEU,cAAS,GAAG,CAAC,CAAsC,EAAE,EAAE;YAC7D,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe;gBACxB,CAAC,CAAC,eAAe,EAAE,CAAC;YAEtB,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;gBACtB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;aACtC;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,CAAqC,EAAE,EAAE;YAChE,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe;gBACxB,CAAC,CAAC,eAAe,EAAE,CAAC;QACxB,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,CAAqC,EAAE,EAAE;YAChE,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe;gBACxB,CAAC,CAAC,eAAe,EAAE,CAAC;QACxB,CAAC,CAAC;IAmBJ,CAAC;IAjBC,gBAAgB;IACA,MAAM;QACpB,MAAM,aAAa,GAAG,UAAU,CAAC,qBAAqB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QAC9E,MAAM,UAAU,GAAG,UAAU,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,uBAAuB,CAAC,CAAC;QACrF,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;QAE/E,OAAO;QACL,oEAAoE;QACpE,oEAAoE;QACpE,+BAAO,SAAS,EAAE,aAAa,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO;YAC9G,+BAAO,IAAI,EAAC,UAAU,EAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACvF,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,SAAS,EAAE,OAAO,EAAE,IAAI,CAAC,aAAa,EACjH,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAI;YAC9B,8BAAM,SAAS,EAAE,UAAU;gBAAE,oBAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,GAAI,CAAO,CAC1D,CACT,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 Checkbox\n */\n\nimport \"./ImageCheckBox.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Icon } from \"../icons/IconComponent\";\nimport { CommonProps } from \"../utils/Props\";\n\n/** Properties for the [[ImageCheckBox]] component\n * @public\n */\nexport interface ImageCheckBoxProps extends CommonProps {\n  /** Image for the \"checked\" state */\n  imageOn: string | React.ReactNode;\n  /** Image for the \"unchecked\" (default) state */\n  imageOff: string | React.ReactNode;\n  /** Determine if the item is checked or not */\n  checked?: boolean;\n  /** Determine if the item is disabled or not */\n  disabled?: boolean;\n  /** Function called when item is clicked. */\n  onClick?: (checked: boolean) => any;\n  /** Custom CSS class name for the checkbox input element */\n  inputClassName?: string;\n  /** Custom CSS Style for the checkbox input element */\n  inputStyle?: React.CSSProperties;\n  /** Tooltip to be displayed when mouse is hovered over the checkbox */\n  tooltip?: string;\n  /** If true, draw a border around the image checkbox */\n  border?: boolean;\n  /** Provides ability to return reference to HTMLInputElement */\n  inputRef?: React.Ref<HTMLInputElement>;\n}\n\n/**\n * ImageCheckBox React component shows a checked or unchecked image\n * @public\n */\nexport class ImageCheckBox extends React.PureComponent<ImageCheckBoxProps> {\n\n  private _onChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    // istanbul ignore next\n    if (e && e.stopPropagation)\n      e.stopPropagation();\n\n    // istanbul ignore else\n    if (this.props.onClick) {\n      this.props.onClick(e.target.checked);\n    }\n  };\n\n  private _onInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n    // istanbul ignore next\n    if (e && e.stopPropagation)\n      e.stopPropagation();\n  };\n\n  private _onLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n    // istanbul ignore next\n    if (e && e.stopPropagation)\n      e.stopPropagation();\n  };\n\n  /** @internal */\n  public override render() {\n    const checkBoxClass = classnames(\"core-image-checkbox\", this.props.className);\n    const imageClass = classnames(\"image\", this.props.border && \"image-checkbox-border\");\n    const iconSpec = this.props.checked ? this.props.imageOn : this.props.imageOff;\n\n    return (\n      /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\n      /* eslint-disable-next-line jsx-a11y/click-events-have-key-events */\n      <label className={checkBoxClass} style={this.props.style} onClick={this._onLabelClick} title={this.props.tooltip}>\n        <input type=\"checkbox\" className={this.props.inputClassName} style={this.props.inputStyle}\n          checked={this.props.checked} disabled={this.props.disabled} onChange={this._onChange} onClick={this._onInputClick}\n          ref={this.props.inputRef} />\n        <span className={imageClass}><Icon iconSpec={iconSpec} /></span>\n      </label>\n    );\n  }\n}\n"]}