@oliasoft-open-source/react-ui-library 3.3.18 → 3.3.20

package/dist/global.css

@@ -1772,10 +1772,10 @@ html[data-theme='dark'] {
 /*
   Z-INDEX
 */
-._checkbox_11y8l_333 {
+._checkbox_1a5ed_333 {
   margin: 10px 0 11px 0;
   position: relative;
-  display: inline-flex;
+  display: flex;
   align-items: center;
   gap: 8px;
   backface-visibility: hidden;
@@ -1787,14 +1787,14 @@ html[data-theme='dark'] {
   min-width: 17px;
   outline: 0px;
 }
-._checkbox_11y8l_333._noLabel_11y8l_348 {
+._checkbox_1a5ed_333._noLabel_1a5ed_348 {
   width: 17px;
 }
-._checkbox_11y8l_333._small_11y8l_351 {
+._checkbox_1a5ed_333._small_1a5ed_351 {
   margin: 3px 0;
   font-size: 12px;
 }
-._checkbox_11y8l_333 input {
+._checkbox_1a5ed_333 input {
   cursor: pointer;
   position: absolute;
   top: 0px;
@@ -1805,18 +1805,17 @@ html[data-theme='dark'] {
   outline: 0px;
   z-index: -1;
 }
-._checkbox_11y8l_333 label {
+._checkbox_1a5ed_333 label {
   cursor: pointer;
   user-select: none;
   color: var(--color-text);
   transition: color 0.1s ease 0s;
-  position: relative;
   display: block;
   padding-left: 1.85714em;
   font-size: 1em;
   outline: 0px;
 }
-._checkbox_11y8l_333 label ._checkmark_11y8l_377 {
+._checkbox_1a5ed_333 label ._checkmark_1a5ed_376 {
   position: absolute;
   top: 0px;
   left: 0px;
@@ -1829,35 +1828,33 @@ html[data-theme='dark'] {
   border: 1px solid var(--color-border-checkbox);
   color: transparent;
 }
-._checkbox_11y8l_333 label ._checkmark_11y8l_377:hover {
+._checkbox_1a5ed_333 label ._checkmark_1a5ed_376:hover {
   border-color: var(--color-border-hover);
 }
-._checkbox_11y8l_333 input:checked ~ label ._checkmark_11y8l_377 {
+._checkbox_1a5ed_333 input:checked ~ label ._checkmark_1a5ed_376 {
   background: var(--color-background-primary);
   border-color: transparent;
   color: white;
 }
-._checkbox_11y8l_333._disabled_11y8l_398 {
+._checkbox_1a5ed_333._disabled_1a5ed_397 {
   cursor: default;
   pointer-events: none;
 }
-._checkbox_11y8l_333._disabled_11y8l_398 label {
+._checkbox_1a5ed_333._disabled_1a5ed_397 label {
   color: var(--color-text-muted);
 }
-._checkbox_11y8l_333._disabled_11y8l_398 ._checkmark_11y8l_377 {
+._checkbox_1a5ed_333._disabled_1a5ed_397 ._checkmark_1a5ed_376 {
   background: var(--color-background-disabled) !important;
   border-color: var(--color-border-checkbox) !important;
 }
-._checkbox_11y8l_333._disabled_11y8l_398 input:checked ~ label ._checkmark_11y8l_377 {
+._checkbox_1a5ed_333._disabled_1a5ed_397 input:checked ~ label ._checkmark_1a5ed_376 {
   color: var(--color-text-faint);
 }
-._noMargin_11y8l_412 {
+._noMargin_1a5ed_411 {
   margin: 0;
 }
-._isInTable_11y8l_415 {
+._isInTable_1a5ed_414 {
   margin: 0;
-  position: relative;
-  top: 1px;
 }
 /*
  This file has shared variables that are re-used in other LESS files/modules

package/dist/index.js

@@ -433,13 +433,13 @@ Accordion.propTypes = {
   squareBottom: PropTypes__default.bool,
   testId: PropTypes__default.string
 };
-const checkbox = "_checkbox_11y8l_333";
-const noLabel = "_noLabel_11y8l_348";
-const small$e = "_small_11y8l_351";
-const checkmark = "_checkmark_11y8l_377";
-const disabled$a = "_disabled_11y8l_398";
-const noMargin$2 = "_noMargin_11y8l_412";
-const isInTable$4 = "_isInTable_11y8l_415";
+const checkbox = "_checkbox_1a5ed_333";
+const noLabel = "_noLabel_1a5ed_348";
+const small$e = "_small_1a5ed_351";
+const checkmark = "_checkmark_1a5ed_376";
+const disabled$a = "_disabled_1a5ed_397";
+const noMargin$2 = "_noMargin_1a5ed_411";
+const isInTable$4 = "_isInTable_1a5ed_414";
 const styles$P = {
   checkbox,
   noLabel,
@@ -11969,6 +11969,7 @@ const styles$B = {
 };
 const Heading$2 = ({
   children,
+  helpText,
   onClickHelp,
   onClick,
   onIconClick,
@@ -11979,6 +11980,7 @@ const Heading$2 = ({
   testId
 }) => {
   var _a;
+  const isHelpIconDisplayed = !!helpText || !!onClickHelp;
   return /* @__PURE__ */ jsxs("div", {
     className: cx(styles$B.heading, top2 ? styles$B.top : ""),
     style: {
@@ -11995,7 +11997,8 @@ const Heading$2 = ({
       children: [icon2 && /* @__PURE__ */ jsx(HelpIcon, {
         onClick: onIconClick,
         icon: icon2
-      }), onClickHelp && /* @__PURE__ */ jsx(HelpIcon, {
+      }), isHelpIconDisplayed && /* @__PURE__ */ jsx(HelpIcon, {
+        text: helpText,
         onClick: onClickHelp
       }), libraryIcon && /* @__PURE__ */ jsx(HelpIcon, {
         text: (_a = libraryIcon == null ? void 0 : libraryIcon.tooltip) != null ? _a : "",
@@ -12006,6 +12009,7 @@ const Heading$2 = ({
   });
 };
 Heading$2.defaultProps = {
+  helpText: null,
   onClick: null,
   onClickHelp: null,
   onIconClick: null,
@@ -12016,6 +12020,7 @@ Heading$2.defaultProps = {
   testId: null
 };
 Heading$2.propTypes = {
+  helpText: PropTypes__default.string,
   onClick: PropTypes__default.func,
   onClickHelp: PropTypes__default.func,
   onIconClick: PropTypes__default.func,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/react-ui-library",
-  "version": "3.3.18",
+  "version": "3.3.20",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {