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

package/lib/esm/core-react/button/UnderlinedButton.d.ts

@@ -0,0 +1,25 @@
+/** @packageDocumentation
+ * @module Button
+ */
+import "./UnderlinedButton.scss";
+import * as React from "react";
+/** Properties for the [[UnderlinedButton]] React component
+ * @public
+ */
+export interface UnderlinedButtonProps {
+    /** String that will be rendered by the button */
+    children: string | React.ReactNode;
+    /** Additional className */
+    className?: string;
+    /** Title of the button */
+    title?: string;
+    /** Callback to onClick event */
+    onClick?: (e: React.MouseEvent) => void;
+    /** Callback to activate */
+    onActivate?: () => void;
+}
+/** A React component that makes text clickable and underlined
+ * @public
+ */
+export declare function UnderlinedButton(props: UnderlinedButtonProps): JSX.Element;
+//# sourceMappingURL=UnderlinedButton.d.ts.map

package/lib/esm/core-react/button/UnderlinedButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnderlinedButton.d.ts","sourceRoot":"","sources":["../../../../src/core-react/button/UnderlinedButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,yBAAyB,CAAC;AAEjC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,iDAAiD;IACjD,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0BAA0B;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,2BAA2B;IAC3B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,eAkC5D"}

package/lib/esm/core-react/button/UnderlinedButton.js

@@ -0,0 +1,32 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Button
+ */
+import "./UnderlinedButton.scss";
+import classnames from "classnames";
+import * as React from "react";
+import { SpecialKey } from "@itwin/appui-abstract";
+/** A React component that makes text clickable and underlined
+ * @public
+ */
+export function UnderlinedButton(props) {
+    const handleKeyUp = React.useCallback((event) => {
+        const key = event.key;
+        switch (key) {
+            case SpecialKey.Enter:
+            case SpecialKey.Space:
+                props.onActivate && props.onActivate();
+                break;
+        }
+    }, [props]);
+    const handleClick = React.useCallback((e) => {
+        props.onClick && props.onClick(e);
+        props.onActivate && props.onActivate();
+    }, [props]);
+    const className = classnames("core-underlined-button", props.className ? props.className : undefined);
+    return (React.createElement("span", { className: className, title: props.title, onClick: handleClick, onKeyUp: handleKeyUp, tabIndex: 0, role: "link" }, props.children));
+}
+//# sourceMappingURL=UnderlinedButton.js.map

package/lib/esm/core-react/button/UnderlinedButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnderlinedButton.js","sourceRoot":"","sources":["../../../../src/core-react/button/UnderlinedButton.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,yBAAyB,CAAC;AACjC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAkBnD;;GAEG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAA4B;IAC3D,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAA0B,EAAE,EAAE;QACnE,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;QAEtB,QAAQ,GAAG,EAAE;YACX,KAAK,UAAU,CAAC,KAAK,CAAC;YACtB,KAAK,UAAU,CAAC,KAAK;gBACnB,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;gBACvC,MAAM;SACT;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,CAAmB,EAAE,EAAE;QAC5D,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;IACzC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,SAAS,GAAG,UAAU,CAC1B,wBAAwB,EACxB,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAC9C,CAAC;IAEF,OAAO,CACL,8BACE,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,MAAM,IAEV,KAAK,CAAC,QAAQ,CACV,CACR,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 Button\n */\n\nimport \"./UnderlinedButton.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { SpecialKey } from \"@itwin/appui-abstract\";\n\n/** Properties for the [[UnderlinedButton]] React component\n * @public\n */\nexport interface UnderlinedButtonProps {\n  /** String that will be rendered by the button */\n  children: string | React.ReactNode;\n  /** Additional className */\n  className?: string;\n  /** Title of the button */\n  title?: string;\n  /** Callback to onClick event */\n  onClick?: (e: React.MouseEvent) => void;\n  /** Callback to activate */\n  onActivate?: () => void;\n}\n\n/** A React component that makes text clickable and underlined\n * @public\n */\nexport function UnderlinedButton(props: UnderlinedButtonProps) {\n  const handleKeyUp = React.useCallback((event: React.KeyboardEvent) => {\n    const key = event.key;\n\n    switch (key) {\n      case SpecialKey.Enter:\n      case SpecialKey.Space:\n        props.onActivate && props.onActivate();\n        break;\n    }\n  }, [props]);\n\n  const handleClick = React.useCallback((e: React.MouseEvent) => {\n    props.onClick && props.onClick(e);\n    props.onActivate && props.onActivate();\n  }, [props]);\n\n  const className = classnames(\n    \"core-underlined-button\",\n    props.className ? props.className : undefined,\n  );\n\n  return (\n    <span\n      className={className}\n      title={props.title}\n      onClick={handleClick}\n      onKeyUp={handleKeyUp}\n      tabIndex={0}\n      role=\"link\"\n    >\n      {props.children}\n    </span>\n  );\n}\n"]}

package/lib/esm/core-react/button/UnderlinedButton.scss

@@ -0,0 +1,33 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/index.scss";
+@import "../inputs/index.scss";
+
+$color: $buic-foreground-primary;
+$hoverColor: $buic-foreground-primary-tone;
+
+.core-underlined-button {
+  background: transparent;
+  color: $color;
+  border: 0px solid $color;
+  border-bottom-width: 1px;
+
+  width: fit-content;
+
+  cursor: pointer;
+
+  &:hover {
+    color: $hoverColor;
+    border-color: $hoverColor;
+  }
+
+  &:focus {
+    color: $hoverColor;
+    border-color: $hoverColor;
+    background-color: $buic-background-focus-overlay;
+    outline: none;
+  }
+
+}

package/lib/esm/core-react/button/blue-large.scss

@@ -0,0 +1,12 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./button";
+@import "./blue";
+
+@mixin uicore-buttons-blue-large {
+
+    @include uicore-buttons-blue;
+    @include uicore-buttons-large-size;
+}

package/lib/esm/core-react/button/blue.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 "../style/index";
+
+@import "./button";
+@import "./disabled";
+
+
+@mixin uicore-buttons-blue {
+
+  @include uicore-buttons-button;
+
+  background:         $buic-accessory-primary;
+  color:              $buic-accessory-hollow;
+
+  &:hover {
+    background-color:   $uicore-blue-5;
+  }
+
+  &:active {
+    background-color:   $uicore-blue-4;
+  }
+}

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

@@ -0,0 +1,81 @@
+/*---------------------------------------------------------------------------------------------
+* 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 "~@itwin/itwinui-css/scss/style/speed";
+@import "~@itwin/itwinui-css/scss/style/typography";
+@import "~@itwin/itwinui-css/scss/style/variables";
+
+// cspell:ignore unbordered
+
+/// Mixins ---------------------------------------------------------------------
+
+@mixin uicore-buttons-button {
+
+  display:                inline-block;
+
+  padding:                $uicore-button-padding $uicore-unbordered-padding;
+  margin:                 $uicore-inputs-margin 0;
+  border-radius:          $iui-border-radius;
+  line-height:            $uicore-button-line-height;
+  outline:                none;
+  font-family:            $iui-font-family;
+  font-size:              $iui-font-size;
+  text-decoration:        none;
+  cursor:                 pointer;
+  box-sizing:             border-box;
+  box-shadow:             transparent 0px 1px 1px inset;
+  border:                 1px solid transparent;
+  transition:             all $iui-speed-fast ease-in-out;
+
+  &:active,
+  &:focus {
+
+    @include uicore-buttons-button-focused;
+  }
+
+  &[disabled],
+  &[disabled]:hover,
+  &[disabled]:active,
+  &[disabled]:focus {
+
+    @include uicore-buttons-button-disabled;
+  }
+}
+
+@mixin uicore-buttons-button-focused {
+
+  box-shadow:           $uicore-button-focus-boxshadow;
+}
+
+@mixin uicore-buttons-button-unbordered {
+
+  border-color:         transparent;
+  box-shadow:           transparent 0px 1px 1px inset;
+}
+
+@mixin uicore-buttons-button-disabled {
+
+  opacity:                $uicore-opacity-disabled;
+  background-color:       $uicore-gray;
+  border:                 0;
+  color:                  $uicore-white;
+  cursor:                 not-allowed;
+}
+
+@mixin uicore-buttons-large-size {
+
+  padding:                $uicore-inputs-padding-large $uicore-unbordered-padding-large;
+  margin:                 $uicore-inputs-margin-large 0;
+  font-size:              $iui-font-size-leading;
+  font-weight:            $iui-font-weight-normal;
+}
+
+@mixin uicore-buttons-large-bordered-size {
+
+  padding:                $uicore-button-padding-bordered-large $uicore-bordered-padding-large;
+  margin:                 $uicore-inputs-margin-large 0;
+  font-size:              $iui-font-size-leading;
+  font-weight:            $iui-font-weight-normal;
+}

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

@@ -0,0 +1,14 @@
+/*---------------------------------------------------------------------------------------------
+* 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-buttons-blue { @include uicore-buttons-blue; }
+.uicore-buttons-blue-large { @include uicore-buttons-blue-large; }
+.uicore-buttons-disabled { @include uicore-buttons-disabled; }
+.uicore-buttons-disabled-large { @include uicore-buttons-disabled-large; }
+.uicore-buttons-hollow { @include uicore-buttons-hollow; }
+.uicore-buttons-hollow-large { @include uicore-buttons-hollow-large; }
+.uicore-buttons-primary { @include uicore-buttons-primary; }
+.uicore-buttons-primary-large { @include uicore-buttons-primary-large; }

package/lib/esm/core-react/button/disabled-large.scss

@@ -0,0 +1,12 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./button";
+@import "./disabled";
+
+@mixin uicore-buttons-disabled-large {
+
+    @include uicore-buttons-disabled;
+    @include uicore-buttons-large-size;
+}

package/lib/esm/core-react/button/disabled.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 "../style/index";
+@import "./button";
+
+
+@mixin uicore-buttons-disabled {
+
+    @include uicore-buttons-button;
+
+    &, &:active, &:focus, &:hover {
+
+        @include uicore-buttons-button-disabled;
+    }
+}

package/lib/esm/core-react/button/hollow-large.scss

@@ -0,0 +1,13 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./button";
+@import "./hollow";
+
+@mixin uicore-buttons-hollow-large {
+
+    @include uicore-buttons-hollow;
+    @include uicore-buttons-large-bordered-size;
+
+}

package/lib/esm/core-react/button/hollow.scss

@@ -0,0 +1,30 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/index";
+@import "../inputs/variables";
+
+@import "./button";
+@import "./disabled";
+
+@mixin uicore-buttons-hollow {
+
+    @include uicore-buttons-button;
+
+    padding:            $uicore-button-padding-bordered $uicore-bordered-padding;
+    border-color:       $buic-foreground-disabled;
+    background-color:   transparent;
+    color:              $buic-text-color;
+
+    &:hover {
+
+      border-color:       $buic-foreground-body;
+      color:              $buic-foreground-activehover;
+    }
+
+    &:active, &:focus {
+
+      border-color:       $buic-foreground-activehover;
+    }
+}

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

@@ -0,0 +1,14 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./button";
+
+@import "./blue";
+@import "./blue-large";
+@import "./disabled";
+@import "./disabled-large";
+@import "./hollow";
+@import "./hollow-large";
+@import "./primary";
+@import "./primary-large";

package/lib/esm/core-react/button/primary-large.scss

@@ -0,0 +1,12 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./button";
+@import "./primary";
+
+@mixin uicore-buttons-primary-large {
+
+    @include uicore-buttons-primary;
+    @include uicore-buttons-large-size;
+}

package/lib/esm/core-react/button/primary.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 "../style/index";
+
+@import "./button";
+@import "./disabled";
+
+
+@mixin uicore-buttons-primary {
+
+  @include uicore-buttons-button;
+
+  background:         $buic-accessory-success;
+  color:              $buic-accessory-hollow;
+
+  &:hover {
+    background-color:   $uicore-green-5;
+  }
+
+  &:active {
+    background-color:   $uicore-green-4;
+  }
+}

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

@@ -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.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/baseline";
+@import "../style/themecolors";
+@import "../inputs/variables";
+
+// cspell:ignore unbordered
+
+$uicore-button-height: 28px;
+$uicore-button-line-height: $uicore-baseline * 1.5;
+$uicore-button-padding: ($uicore-button-height - $uicore-button-line-height) *
+  0.5;
+$uicore-button-padding-bordered: $uicore-button-padding - 1px;
+$uicore-button-padding-bordered-large: $uicore-inputs-padding-large - 1px;
+$uicore-unbordered-padding: $uicore-baseline;
+$uicore-bordered-padding: $uicore-unbordered-padding - 1px;
+$uicore-button-focus-boxshadow: $buic-focus-boxshadow 0px 0px 0px 2px;

package/lib/esm/core-react/checkbox/Checkbox.d.ts

@@ -0,0 +1,57 @@
+/** @packageDocumentation
+ * @module Checkbox
+ */
+import * as React from "react";
+import { InputStatus } from "../inputs/InputStatus";
+import { CommonProps } from "../utils/Props";
+import { Omit } from "../utils/typeUtils";
+/** Properties for [[Checkbox]] React component
+ * @public
+ * @deprecated Use CheckboxProps in itwinui-react instead
+ */
+export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "onClick" | "onBlur">, CommonProps {
+    /** Text that will be shown next to the checkbox. */
+    label?: string;
+    /** Indicates checkbox is in an Indeterminate or Partial state, regardless of the `checked` state */
+    indeterminate?: boolean;
+    /** Input status like: "Success", "Warning" or "Error" */
+    status?: InputStatus;
+    /** Custom CSS class name for the checkbox input element */
+    inputClassName?: string;
+    /** Custom CSS Style for the checkbox input element */
+    inputStyle?: React.CSSProperties;
+    /** Custom CSS class name for the label element */
+    labelClassName?: string;
+    /** Custom CSS Style for the label element */
+    labelStyle?: React.CSSProperties;
+    /**
+     * Event called when checkbox is clicked on. This is a good event to
+     * use for preventing the action from bubbling to component's parents.
+     */
+    onClick?: (e: React.MouseEvent) => void;
+    /** Event called when checkbox loses focus. */
+    onBlur?: (e: React.FocusEvent) => void;
+    /** Indicates whether the checkbox should set focus */
+    setFocus?: boolean;
+    /** Provides ability to return reference to HTMLInputElement */
+    inputRef?: React.Ref<HTMLInputElement>;
+}
+/** A React component that renders a simple checkbox with label.
+ * It is a wrapper for the `<input type="checkbox">` HTML element.
+ * @public
+ * @deprecated Use Checkbox in itwinui-react instead
+ */
+export declare class Checkbox extends React.PureComponent<CheckboxProps> {
+    private _checkboxInput;
+    private _refs;
+    /** @internal */
+    constructor(props: CheckboxProps);
+    private _onCheckboxClick;
+    private _onCheckboxBlur;
+    private _setIndeterminate;
+    componentDidMount(): void;
+    /** @internal */
+    componentDidUpdate(_prevProps: CheckboxProps): void;
+    render(): JSX.Element;
+}
+//# sourceMappingURL=Checkbox.d.ts.map

package/lib/esm/core-react/checkbox/Checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/checkbox/Checkbox.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C;;;GAGG;AACH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC,EAAE,WAAW;IAClI,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oGAAoG;IACpG,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yDAAyD;IACzD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,2DAA2D;IAC3D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,sDAAsD;IACtD,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACjC,kDAAkD;IAClD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,8CAA8C;IAC9C,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACvC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACxC;AAED;;;;GAIG;AACH,qBAAa,QAAS,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IAC9D,OAAO,CAAC,cAAc,CAAuC;IAC7D,OAAO,CAAC,KAAK,CAAkC;IAE/C,gBAAgB;gBACJ,KAAK,EAAE,aAAa;IAOhC,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,eAAe,CAErB;IAEF,OAAO,CAAC,iBAAiB;IAMT,iBAAiB;IAQjC,gBAAgB;IACA,kBAAkB,CAAC,UAAU,EAAE,aAAa;IAK5C,MAAM;CAuBvB"}

package/lib/esm/core-react/checkbox/Checkbox.js

@@ -0,0 +1,61 @@
+/*---------------------------------------------------------------------------------------------
+* 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 classnames from "classnames";
+import * as React from "react";
+import { mergeRefs } from "../utils/hooks/useRefs";
+/** A React component that renders a simple checkbox with label.
+ * It is a wrapper for the `<input type="checkbox">` HTML element.
+ * @public
+ * @deprecated Use Checkbox in itwinui-react instead
+ */
+export class Checkbox extends React.PureComponent {
+    /** @internal */
+    constructor(props) {
+        super(props);
+        this._checkboxInput = React.createRef();
+        this._refs = mergeRefs(this._checkboxInput);
+        this._onCheckboxClick = (e) => {
+            e.stopPropagation();
+        };
+        this._onCheckboxBlur = (e) => {
+            e.stopPropagation();
+        };
+        if (props.inputRef)
+            this._refs = mergeRefs(this._checkboxInput, props.inputRef);
+    }
+    _setIndeterminate(indeterminate) {
+        // istanbul ignore else
+        if (this._checkboxInput.current)
+            this._checkboxInput.current.indeterminate = indeterminate;
+    }
+    componentDidMount() {
+        if (this.props.indeterminate !== undefined)
+            this._setIndeterminate(this.props.indeterminate);
+        if (this.props.setFocus && this._checkboxInput.current)
+            this._checkboxInput.current.focus();
+    }
+    /** @internal */
+    componentDidUpdate(_prevProps) {
+        if (this.props.indeterminate !== undefined)
+            this._setIndeterminate(this.props.indeterminate);
+    }
+    render() {
+        const { status, disabled, label, indeterminate, className, inputClassName, inputStyle, labelClassName, labelStyle, // eslint-disable-line @typescript-eslint/no-unused-vars
+        onClick, onBlur, setFocus, inputRef, ...inputProps } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars
+        const checkBoxClass = classnames("core-checkbox", disabled && "core-disabled", !label && "core-checkbox-no-label", status, className);
+        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, onClick: onClick, onBlur: onBlur },
+            label &&
+                React.createElement("span", { className: "core-checkbox-label" }, label),
+            React.createElement("input", { type: "checkbox", ref: this._refs, ...inputProps, disabled: disabled, className: inputClassName, style: inputStyle, onClick: this._onCheckboxClick, onBlur: this._onCheckboxBlur }),
+            React.createElement("span", { className: "core-checkbox-checkmark" })));
+    }
+}
+//# sourceMappingURL=Checkbox.js.map

package/lib/esm/core-react/checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/core-react/checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAkCnD;;;;GAIG;AACH,MAAM,OAAO,QAAS,SAAQ,KAAK,CAAC,aAA4B;IAI9D,gBAAgB;IAChB,YAAY,KAAoB;QAC9B,KAAK,CAAC,KAAK,CAAC,CAAC;QALP,mBAAc,GAAG,KAAK,CAAC,SAAS,EAAoB,CAAC;QACrD,UAAK,GAAG,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAUvC,qBAAgB,GAAG,CAAC,CAAmB,EAAE,EAAE;YACjD,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC,CAAC;QAEM,oBAAe,GAAG,CAAC,CAAmB,EAAE,EAAE;YAChD,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC,CAAC;QAVA,IAAI,KAAK,CAAC,QAAQ;YAChB,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;IAChE,CAAC;IAUO,iBAAiB,CAAC,aAAsB;QAC9C,uBAAuB;QACvB,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO;YAC7B,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,aAAa,GAAG,aAAa,CAAC;IAC9D,CAAC;IAEe,iBAAiB;QAC/B,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,KAAK,SAAS;YACxC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;QAEnD,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO;YACpD,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACxC,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,UAAyB;QAC1D,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,KAAK,SAAS;YACxC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;IACrD,CAAC;IAEe,MAAM;QACpB,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,wDAAwD;QACzK,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,wDAAwD;QAC7H,MAAM,aAAa,GAAG,UAAU,CAAC,eAAe,EAC9C,QAAQ,IAAI,eAAe,EAC3B,CAAC,KAAK,IAAI,wBAAwB,EAClC,MAAM,EACN,SAAS,CAAC,CAAC;QAEb,OAAO;QACL,oEAAoE;QACpE,oEAAoE;QACpE,+BAAO,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM;YAC9D,KAAK;gBACJ,8BAAM,SAAS,EAAC,qBAAqB,IAAE,KAAK,CAAQ;YAEtD,+BAAO,IAAI,EAAC,UAAU,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,KAAM,UAAU,EACpD,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,UAAU,EAChE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,MAAM,EAAE,IAAI,CAAC,eAAe,GAAI;YAClE,8BAAM,SAAS,EAAC,yBAAyB,GAAQ,CAC1C,CACV,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 classnames from \"classnames\";\nimport * as React from \"react\";\nimport { InputStatus } from \"../inputs/InputStatus\";\nimport { CommonProps } from \"../utils/Props\";\nimport { Omit } from \"../utils/typeUtils\";\nimport { mergeRefs } from \"../utils/hooks/useRefs\";\n\n/** Properties for [[Checkbox]] React component\n * @public\n * @deprecated Use CheckboxProps in itwinui-react instead\n */\nexport interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"type\" | \"onClick\" | \"onBlur\">, CommonProps {\n  /** Text that will be shown next to the checkbox. */\n  label?: string;\n  /** Indicates checkbox is in an Indeterminate or Partial state, regardless of the `checked` state */\n  indeterminate?: boolean;\n  /** Input status like: \"Success\", \"Warning\" or \"Error\" */\n  status?: InputStatus;\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  /** Custom CSS class name for the label element */\n  labelClassName?: string;\n  /** Custom CSS Style for the label element */\n  labelStyle?: React.CSSProperties;\n  /**\n   * Event called when checkbox is clicked on. This is a good event to\n   * use for preventing the action from bubbling to component's parents.\n   */\n  onClick?: (e: React.MouseEvent) => void;\n  /** Event called when checkbox loses focus. */\n  onBlur?: (e: React.FocusEvent) => void;\n  /** Indicates whether the checkbox should set focus */\n  setFocus?: boolean;\n  /** Provides ability to return reference to HTMLInputElement */\n  inputRef?: React.Ref<HTMLInputElement>;\n}\n\n/** A React component that renders a simple checkbox with label.\n * It is a wrapper for the `<input type=\"checkbox\">` HTML element.\n * @public\n * @deprecated Use Checkbox in itwinui-react instead\n */\nexport class Checkbox extends React.PureComponent<CheckboxProps> {  // eslint-disable-line deprecation/deprecation\n  private _checkboxInput = React.createRef<HTMLInputElement>();\n  private _refs = mergeRefs(this._checkboxInput);\n\n  /** @internal */\n  constructor(props: CheckboxProps) { // eslint-disable-line deprecation/deprecation\n    super(props);\n\n    if (props.inputRef)\n      this._refs = mergeRefs(this._checkboxInput, props.inputRef);\n  }\n\n  private _onCheckboxClick = (e: React.MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  private _onCheckboxBlur = (e: React.FocusEvent) => {\n    e.stopPropagation();\n  };\n\n  private _setIndeterminate(indeterminate: boolean) {\n    // istanbul ignore else\n    if (this._checkboxInput.current)\n      this._checkboxInput.current.indeterminate = indeterminate;\n  }\n\n  public override componentDidMount() {\n    if (this.props.indeterminate !== undefined)\n      this._setIndeterminate(this.props.indeterminate);\n\n    if (this.props.setFocus && this._checkboxInput.current)\n      this._checkboxInput.current.focus();\n  }\n\n  /** @internal */\n  public override componentDidUpdate(_prevProps: CheckboxProps) {  // eslint-disable-line deprecation/deprecation\n    if (this.props.indeterminate !== undefined)\n      this._setIndeterminate(this.props.indeterminate);\n  }\n\n  public override render() {\n    const { status, disabled, label, indeterminate, className, inputClassName, inputStyle, labelClassName, labelStyle, // eslint-disable-line @typescript-eslint/no-unused-vars\n      onClick, onBlur, setFocus, inputRef, ...inputProps } = this.props; // eslint-disable-line @typescript-eslint/no-unused-vars\n    const checkBoxClass = classnames(\"core-checkbox\",\n      disabled && \"core-disabled\",\n      !label && \"core-checkbox-no-label\",\n      status,\n      className);\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} onClick={onClick} onBlur={onBlur}>\n        {label &&\n          <span className=\"core-checkbox-label\">{label}</span>\n        }\n        <input type=\"checkbox\" ref={this._refs} {...inputProps}\n          disabled={disabled} className={inputClassName} style={inputStyle}\n          onClick={this._onCheckboxClick} onBlur={this._onCheckboxBlur} />\n        <span className=\"core-checkbox-checkmark\"></span>\n      </label >\n    );\n  }\n}\n"]}