@oliasoft-open-source/react-ui-library 4.13.0 → 4.13.2

package/dist/global.css

@@ -1411,17 +1411,17 @@ html[data-theme='dark'] {
 ._actionComponentContainer_1t7vd_14._active_1t7vd_36 {
   color: var(--color-text-primary-active);
 }
-._wrapper_1f7k2_1 {
+._wrapper_8cxhw_1 {
   display: inline-flex;
   max-width: 100%;
 }
-._layer_1f7k2_5 ._wrapper_1f7k2_1 {
+._layer_8cxhw_5 ._wrapper_8cxhw_1 {
   width: 100%;
 }
-._layerContainer_1f7k2_8 {
+._layerContainer_8cxhw_8 {
   z-index: var(--zindex-dropdown);
 }
-._layer_1f7k2_5 {
+._layer_8cxhw_5 {
   border: 1px solid var(--color-border);
   border-radius: var(--border-radius);
   overflow: hidden;
@@ -1434,97 +1434,98 @@ html[data-theme='dark'] {
   overflow-y: auto;
   max-height: 40vh;
 }
-._layer_1f7k2_5._nested_1f7k2_24 {
+._layer_8cxhw_5._nested_8cxhw_24 {
   margin: -1px 2px;
 }
-._layer_1f7k2_5 ul {
+._layer_8cxhw_5 ul {
   margin: 0;
   padding: 0;
   list-style-type: none;
 }
-._layer_1f7k2_5 ul li {
+._layer_8cxhw_5 ul li {
   list-style: none;
   display: block;
 }
-._fileInput_1f7k2_36 {
+._fileInput_8cxhw_36 {
   opacity: 0;
   position: absolute;
   inset: 0;
 }
-._trigger_1f7k2_41 {
+._trigger_8cxhw_41 {
   display: inline-flex;
   align-items: center;
   cursor: pointer;
   max-width: 100%;
 }
-._layer_1f7k2_5 ._trigger_1f7k2_41 {
+._layer_8cxhw_5 ._trigger_8cxhw_41 {
   width: 100%;
 }
-._middleAlignedInline_1f7k2_50 {
+._middleAlignedInline_8cxhw_50 {
   display: flex;
   align-items: center;
   overflow: hidden;
   width: 100%;
 }
-._heading_1f7k2_56 {
+._heading_8cxhw_56 {
   color: var(--color-text-muted);
   letter-spacing: var(--letter-spacing-wide);
   text-transform: uppercase;
   font-weight: bold;
 }
-._heading_1f7k2_56 ._headingIcon_1f7k2_62 {
+._heading_8cxhw_56 ._headingIcon_8cxhw_62 {
   float: right;
 }
-._heading_1f7k2_56 ._headingIcon_1f7k2_62 svg {
+._heading_8cxhw_56 ._headingIcon_8cxhw_62 svg {
   color: var(--color-text-faint);
 }
-._heading_1f7k2_56 ._headingIcon_1f7k2_62:hover {
+._heading_8cxhw_56 ._headingIcon_8cxhw_62:hover {
   cursor: pointer;
 }
-._heading_1f7k2_56 ._headingIcon_1f7k2_62:hover svg {
+._heading_8cxhw_56 ._headingIcon_8cxhw_62:hover svg {
   color: var(--color-text-primary-hover);
 }
-._option_1f7k2_74 {
+._option_8cxhw_74 {
   color: inherit;
   display: block;
   position: relative;
 }
-._heading_1f7k2_56,
-._option_1f7k2_74,
-._layer_1f7k2_5 ._trigger_1f7k2_41 {
+._heading_8cxhw_56,
+._option_8cxhw_74,
+._layer_8cxhw_5 ._trigger_8cxhw_41 {
   padding: var(--padding-input);
   border: 1px solid transparent;
 }
-._option_1f7k2_74,
-._layer_1f7k2_5 ._trigger_1f7k2_41 {
+._option_8cxhw_74,
+._layer_8cxhw_5 ._trigger_8cxhw_41 {
   line-height: var(--line-height);
   display: flex;
   align-items: flex-start;
 }
-._option_1f7k2_74:hover,
-._layer_1f7k2_5 ._trigger_1f7k2_41:hover,
-._option_1f7k2_74._active_1f7k2_93,
-._layer_1f7k2_5 ._trigger_1f7k2_41._active_1f7k2_93 {
+._option_8cxhw_74:hover,
+._layer_8cxhw_5 ._trigger_8cxhw_41:hover,
+._option_8cxhw_74._active_8cxhw_93,
+._layer_8cxhw_5 ._trigger_8cxhw_41._active_8cxhw_93 {
   background-color: var(--color-background-listitem-hover);
   cursor: pointer;
 }
-._option_1f7k2_74._selected_1f7k2_98 {
+._option_8cxhw_74._selected_8cxhw_98,
+._layer_8cxhw_5 ._trigger_8cxhw_41._selected_8cxhw_98 {
   background-color: var(--color-background-listitem-active);
 }
-._layer_1f7k2_5 ._trigger_1f7k2_41 {
+._layer_8cxhw_5 ._trigger_8cxhw_41 {
   align-items: center;
 }
-._optionContent_1f7k2_104 {
+._optionContent_8cxhw_105 {
   flex-wrap: wrap;
   margin-right: auto;
 }
-._inline_1f7k2_108 ._optionContent_1f7k2_104 {
+._inline_8cxhw_109 ._optionContent_8cxhw_105 {
   display: flex;
   justify-content: space-between;
   flex-grow: 1;
 }
-._icon_1f7k2_113,
-._check_1f7k2_114 {
+._icon_8cxhw_114,
+._check_8cxhw_115 {
   display: flex;
   flex-shrink: 1;
   width: var(--size-xs);
@@ -1532,83 +1533,83 @@ html[data-theme='dark'] {
   justify-content: center;
   align-items: center;
 }
-._icon_1f7k2_113 {
+._icon_8cxhw_114 {
   margin-right: var(--padding-xs);
   color: var(--color-text-primary);
   font-size: var(--size-xs);
 }
-._icon_1f7k2_113:empty {
+._icon_8cxhw_114:empty {
   display: none;
 }
-._icon_1f7k2_113 img {
+._icon_8cxhw_114 img {
   max-height: 16px;
   max-width: 16px;
   width: auto;
   height: auto;
 }
-._check_1f7k2_114 {
+._check_8cxhw_115 {
   margin-left: var(--padding-xs);
   color: var(--color-text-primary);
 }
-._text_1f7k2_140 {
+._text_8cxhw_141 {
   display: inline-flex;
   align-items: center;
   cursor: pointer;
 }
-._label_1f7k2_145 {
+._label_8cxhw_146 {
   margin-right: auto;
 }
-._label_1f7k2_145,
-._heading_1f7k2_56 {
+._label_8cxhw_146,
+._heading_8cxhw_56 {
   max-width: 100%;
   display: block;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-._description_1f7k2_156 {
+._description_8cxhw_157 {
   color: #999;
   display: block;
 }
-._arrow_1f7k2_160 {
+._arrow_8cxhw_161 {
   margin-left: var(--padding-xxs);
   display: flex;
 }
-._divider_1f7k2_164 {
+._divider_8cxhw_165 {
   border: 0;
   border-top: 1px solid var(--color-border);
 }
-._deprecatedSemanticIcon_1f7k2_168 {
+._deprecatedSemanticIcon_8cxhw_169 {
   color: var(--color-text-primary) !important;
   margin: -5px 0 0 !important;
 }
-._disabled_1f7k2_172 {
+._disabled_8cxhw_173 {
   opacity: 0.2;
   pointer-events: none;
   cursor: not-allowed !important;
 }
-._buttonLabel_1f7k2_177 {
+._buttonLabel_8cxhw_178 {
   overflow: hidden;
   text-overflow: ellipsis;
   display: block;
   margin-right: auto;
 }
-._buttonCaret_1f7k2_183 {
+._buttonCaret_8cxhw_184 {
   display: flex;
   margin-left: var(--padding-xxs);
 }
-._component_1f7k2_187 {
+._component_8cxhw_188 {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
 }
-._right_1f7k2_193 {
+._right_8cxhw_194 {
   margin-left: auto;
   display: flex;
   align-items: center;
 }
-._actions_1f7k2_198 {
+._actions_8cxhw_199 {
   margin-left: var(--padding-xs);
   display: flex;
   align-items: center;

package/dist/index.d.ts

@@ -134,7 +134,7 @@ export declare interface IAccordionWithDefaultToggleProps {
     toggleLabel: string;
     expanded?: boolean;
     defaultEnabled?: boolean;
-    onClickDefaultToggle?: (evt: ChangeEvent<HTMLInputElement>) => void;
+    onClickDefaultToggle?: TCheckBoxClickHandler;
     padding?: boolean;
     children?: ReactNode;
 }
@@ -241,17 +241,25 @@ declare interface ICheckBoxCell extends TCommonCell {
     label?: string | null;
     checked: boolean;
     type: TCellType;
-    onChange: TChangeEventHandler;
+    onChange: TCheckBoxClickHandler;
     disabled?: boolean;
 }
 
+export declare interface ICheckBoxClickEvent {
+    target: {
+        name: string;
+        checked: boolean;
+        value: boolean;
+    };
+}
+
 export declare interface ICheckBoxProps {
     checked?: boolean;
     isInTable?: boolean;
     label?: string | null;
     name?: string;
     noMargin?: boolean;
-    onChange: TChangeEventHandler;
+    onChange: TCheckBoxClickHandler;
     tabIndex?: number;
     disabled?: boolean;
     small?: boolean;
@@ -751,6 +759,7 @@ export declare interface IMenuProps {
     error?: any;
     warning?: any;
     title?: string;
+    selected?: boolean;
 }
 
 declare interface IMenuSection {
@@ -1743,6 +1752,10 @@ export declare type TChangeEventHandler<T extends HTMLElement = HTMLInputElement
     [key: string]: any;
 }[]) => void;
 
+export declare type TCheckBoxClickHandler = (evt: default_2.MouseEvent<HTMLDivElement, MouseEvent> & {
+    target: ICheckBoxClickEvent['target'];
+}) => void;
+
 export declare type TColor = 'danger' | 'red' | 'white' | 'success' | 'green' | 'muted';
 
 declare interface TCommonCell {

package/dist/index.js

@@ -3888,9 +3888,14 @@ const CheckBox = ({
         if (!isDisabled) {
           const target = evt.target;
           target.name = name2;
-          target.value = !checked;
           target.checked = !checked;
-          onChange(evt);
+          onChange({
+            ...evt,
+            target: {
+              ...target,
+              value: target.checked
+            }
+          });
         }
       },
       "data-testid": testId,
@@ -4181,34 +4186,34 @@ const styles$M = {
   actionComponentContainer,
   active: active$7
 };
-const wrapper$4 = "_wrapper_1f7k2_1";
-const layer$1 = "_layer_1f7k2_5";
-const layerContainer$1 = "_layerContainer_1f7k2_8";
-const nested = "_nested_1f7k2_24";
-const fileInput$1 = "_fileInput_1f7k2_36";
-const trigger$2 = "_trigger_1f7k2_41";
-const middleAlignedInline = "_middleAlignedInline_1f7k2_50";
-const heading$5 = "_heading_1f7k2_56";
-const headingIcon = "_headingIcon_1f7k2_62";
-const option$1 = "_option_1f7k2_74";
-const active$6 = "_active_1f7k2_93";
-const selected$1 = "_selected_1f7k2_98";
-const optionContent$1 = "_optionContent_1f7k2_104";
-const inline$4 = "_inline_1f7k2_108";
-const icon$4 = "_icon_1f7k2_113";
-const check$1 = "_check_1f7k2_114";
-const text$3 = "_text_1f7k2_140";
-const label$a = "_label_1f7k2_145";
-const description = "_description_1f7k2_156";
-const arrow$1 = "_arrow_1f7k2_160";
-const divider$1 = "_divider_1f7k2_164";
-const deprecatedSemanticIcon = "_deprecatedSemanticIcon_1f7k2_168";
-const disabled$8 = "_disabled_1f7k2_172";
-const buttonLabel = "_buttonLabel_1f7k2_177";
-const buttonCaret = "_buttonCaret_1f7k2_183";
-const component = "_component_1f7k2_187";
-const right$7 = "_right_1f7k2_193";
-const actions$1 = "_actions_1f7k2_198";
+const wrapper$4 = "_wrapper_8cxhw_1";
+const layer$1 = "_layer_8cxhw_5";
+const layerContainer$1 = "_layerContainer_8cxhw_8";
+const nested = "_nested_8cxhw_24";
+const fileInput$1 = "_fileInput_8cxhw_36";
+const trigger$2 = "_trigger_8cxhw_41";
+const middleAlignedInline = "_middleAlignedInline_8cxhw_50";
+const heading$5 = "_heading_8cxhw_56";
+const headingIcon = "_headingIcon_8cxhw_62";
+const option$1 = "_option_8cxhw_74";
+const active$6 = "_active_8cxhw_93";
+const selected$1 = "_selected_8cxhw_98";
+const optionContent$1 = "_optionContent_8cxhw_105";
+const inline$4 = "_inline_8cxhw_109";
+const icon$4 = "_icon_8cxhw_114";
+const check$1 = "_check_8cxhw_115";
+const text$3 = "_text_8cxhw_141";
+const label$a = "_label_8cxhw_146";
+const description = "_description_8cxhw_157";
+const arrow$1 = "_arrow_8cxhw_161";
+const divider$1 = "_divider_8cxhw_165";
+const deprecatedSemanticIcon = "_deprecatedSemanticIcon_8cxhw_169";
+const disabled$8 = "_disabled_8cxhw_173";
+const buttonLabel = "_buttonLabel_8cxhw_178";
+const buttonCaret = "_buttonCaret_8cxhw_184";
+const component = "_component_8cxhw_188";
+const right$7 = "_right_8cxhw_194";
+const actions$1 = "_actions_8cxhw_199";
 const styles$L = {
   wrapper: wrapper$4,
   layer: layer$1,
@@ -4354,6 +4359,7 @@ const Section$1 = ({
   path,
   maxHeight
 }) => {
+  var _a2, _b;
   const disabledContext = useContext(DisabledContext);
   switch (section2.type) {
     case MenuType.HEADING:
@@ -4391,10 +4397,14 @@ const Section$1 = ({
         }
       );
     case MenuType.MENU:
+      const selected2 = !!((_b = (_a2 = section2 == null ? void 0 : section2.menu) == null ? void 0 : _a2.sections) == null ? void 0 : _b.find(
+        (s) => s.selected
+      ));
       return /* @__PURE__ */ jsx(
         DropDownMenu,
         {
           menu: section2.menu,
+          selected: selected2,
           title: section2.title,
           closeOnOptionClick,
           isNested: true,
@@ -4597,7 +4607,8 @@ const Text$1 = ({
   title: title2,
   carat,
   disabled: disabled2,
-  isOpen: isOpen2
+  isOpen: isOpen2,
+  selected: selected2
 }) => {
   let titleText;
   if (title2) {
@@ -4611,7 +4622,8 @@ const Text$1 = ({
       className: cx$2(
         styles$L.trigger,
         disabled2 ? styles$L.disabled : null,
-        isOpen2 ? styles$L.active : null
+        isOpen2 ? styles$L.active : null,
+        selected2 ? styles$L.selected : null
       ),
       children: [
         /* @__PURE__ */ jsx("span", { className: styles$L.label, title: titleText, children: label2 }),
@@ -4677,6 +4689,7 @@ const Trigger$1 = React__default.forwardRef(
     warning: warning2,
     tooltip: tooltip2,
     testId,
+    selected: selected2,
     ...restProps
   }, ref2) => {
     const triggerElement = trigger2 === TriggerType.BUTTON || trigger2 === TriggerType.DROP_DOWN_BUTTON ? /* @__PURE__ */ jsx(
@@ -4701,7 +4714,8 @@ const Trigger$1 = React__default.forwardRef(
         title: title2,
         disabled: isDisabled,
         carat: !contextMenu ? isNested ? MenuCarat.RIGHT : MenuCarat.DOWN : void 0,
-        isOpen: isOpen2
+        isOpen: isOpen2,
+        selected: selected2
       }
     ) : trigger2 === TriggerType.COMPONENT ? /* @__PURE__ */ jsx(Component, { component: component2, disabled: isDisabled }) : null;
     const wrappedTrigger = !isNested && (badgeTitle || badgeDot) ? /* @__PURE__ */ jsx(Badge, { title: badgeTitle, dot: badgeDot, small: !badgeDot, children: triggerElement }) : triggerElement;
@@ -4856,7 +4870,8 @@ const DropDownMenu = ({
   setOpen: setOpenProp,
   tooltip: tooltip2,
   error: error2,
-  warning: warning2
+  warning: warning2,
+  selected: selected2
 }) => {
   const disabledContext = useContext(DisabledContext);
   const {
@@ -4925,7 +4940,8 @@ const DropDownMenu = ({
         tooltip: tooltip2,
         error: error2,
         warning: warning2,
-        testId
+        testId,
+        selected: selected2
       }
     ),
     isOpen2 && renderLayer(