@itwin/core-react 5.28.1 → 5.30.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/lib/core-react/imagecheckbox/ImageCheckBox.d.ts +2 -0
- package/lib/core-react/imagecheckbox/ImageCheckBox.d.ts.map +1 -1
- package/lib/core-react/imagecheckbox/ImageCheckBox.js +1 -1
- package/lib/core-react/imagecheckbox/ImageCheckBox.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -29,6 +29,8 @@ export interface ImageCheckBoxProps extends CommonProps {
|
|
|
29
29
|
border?: boolean;
|
|
30
30
|
/** Provides ability to return reference to HTMLInputElement */
|
|
31
31
|
inputRef?: React.Ref<HTMLInputElement>;
|
|
32
|
+
/** HTML id attribute for the checkbox input element */
|
|
33
|
+
id?: string;
|
|
32
34
|
}
|
|
33
35
|
/** ImageCheckBox React component shows a checked or unchecked image
|
|
34
36
|
* @public
|
|
@@ -1 +1 @@
|
|
|
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,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;;GAGG;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;
|
|
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,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;;GAGG;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;IACvC,uDAAuD;IACvD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED;;;GAGG;AACH,qBAAa,aAAc,SAAQ,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC;IACxE,OAAO,CAAC,SAAS,CAMf;IAEF,OAAO,CAAC,aAAa,CAEnB;IAEF,OAAO,CAAC,aAAa,CAEnB;IAEc,MAAM;CAsCvB"}
|
|
@@ -38,7 +38,7 @@ export class ImageCheckBox extends React.PureComponent {
|
|
|
38
38
|
return (
|
|
39
39
|
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
|
|
40
40
|
React.createElement("label", { className: checkBoxClass, style: this.props.style, onClick: this._onLabelClick, title: this.props.tooltip },
|
|
41
|
-
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 }),
|
|
41
|
+
React.createElement("input", { type: "checkbox", id: this.props.id, 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 }),
|
|
42
42
|
React.createElement("span", { className: imageClass },
|
|
43
43
|
React.createElement(Icon, { iconSpec: iconSpec }))));
|
|
44
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageCheckBox.js","sourceRoot":"","sources":["../../../src/core-react/imagecheckbox/ImageCheckBox.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;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,2BAA2B,CAAC;
|
|
1
|
+
{"version":3,"file":"ImageCheckBox.js","sourceRoot":"","sources":["../../../src/core-react/imagecheckbox/ImageCheckBox.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;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,2BAA2B,CAAC;AAkCjD;;;GAGG;AACH,MAAM,OAAO,aAAc,SAAQ,KAAK,CAAC,aAAiC;IAChE,SAAS,GAAG,CAAC,CAAsC,EAAE,EAAE;QAC7D,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe;YAAE,CAAC,CAAC,eAAe,EAAE,CAAC;QAEhD,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,CAAC;IAEM,aAAa,GAAG,CAAC,CAAqC,EAAE,EAAE;QAChE,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe;YAAE,CAAC,CAAC,eAAe,EAAE,CAAC;IAClD,CAAC,CAAC;IAEM,aAAa,GAAG,CAAC,CAAqC,EAAE,EAAE;QAChE,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe;YAAE,CAAC,CAAC,eAAe,EAAE,CAAC;IAClD,CAAC,CAAC;IAEc,MAAM;QACpB,MAAM,aAAa,GAAG,UAAU,CAC9B,qBAAqB,EACrB,IAAI,CAAC,KAAK,CAAC,SAAS,CACrB,CAAC;QACF,MAAM,UAAU,GAAG,UAAU,CAC3B,OAAO,EACP,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,uBAAuB,CAC7C,CAAC;QACF,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO;YACjC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO;YACpB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;QAExB,OAAO;QACL,kHAAkH;QAClH,+BACE,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO;YAEzB,+BACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,EACjB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,EACpC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAC5B,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAC3B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,GACxB;YACF,8BAAM,SAAS,EAAE,UAAU;gBACzB,oBAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,GAAI,CACvB,CACD,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.js\";\nimport type { CommonProps } from \"../utils/Props.js\";\n\n/* eslint-disable @typescript-eslint/no-deprecated */\n\n/** Properties for the [[ImageCheckBox]] component\n * @public\n * @deprecated in 4.12.0. Props of deprecated component {@link ImageCheckBox}.\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 /** HTML id attribute for the checkbox input element */\n id?: string;\n}\n\n/** ImageCheckBox React component shows a checked or unchecked image\n * @public\n * @deprecated in 4.12.0. Use {@link https://itwinui.bentley.com/docs/checkbox iTwinUI checkbox} instead (custom icons are not supported at the moment, but feel free to submit your use cases).\n */\nexport class ImageCheckBox extends React.PureComponent<ImageCheckBoxProps> {\n private _onChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (e && e.stopPropagation) e.stopPropagation();\n\n if (this.props.onClick) {\n this.props.onClick(e.target.checked);\n }\n };\n\n private _onInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n if (e && e.stopPropagation) e.stopPropagation();\n };\n\n private _onLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n if (e && e.stopPropagation) e.stopPropagation();\n };\n\n public override render() {\n const checkBoxClass = classnames(\n \"core-image-checkbox\",\n this.props.className\n );\n const imageClass = classnames(\n \"image\",\n this.props.border && \"image-checkbox-border\"\n );\n const iconSpec = this.props.checked\n ? this.props.imageOn\n : this.props.imageOff;\n\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions\n <label\n className={checkBoxClass}\n style={this.props.style}\n onClick={this._onLabelClick}\n title={this.props.tooltip}\n >\n <input\n type=\"checkbox\"\n id={this.props.id}\n className={this.props.inputClassName}\n style={this.props.inputStyle}\n checked={this.props.checked}\n disabled={this.props.disabled}\n onChange={this._onChange}\n onClick={this._onInputClick}\n ref={this.props.inputRef}\n />\n <span className={imageClass}>\n <Icon iconSpec={iconSpec} />\n </span>\n </label>\n );\n }\n}\n"]}
|