@majoo-ui/react 1.57.14 → 1.57.16

package/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('prop-types'), require('@stitches/react'), require('@majoo-ui/core'), require('@majoo-ui/icons'), require('react-transition-group'), require('react/jsx-runtime'), require('@majoo-ui/helpers'), require('react-i18next'), require('moment'), require('@radix-ui/react-avatar'), require('@radix-ui/react-tooltip'), require('@radix-ui/react-progress'), require('@radix-ui/react-label'), require('@radix-ui/react-checkbox'), require('@radix-ui/react-radio-group'), require('react-number-format'), require('@radix-ui/react-switch'), require('downshift'), require('react-infinite-scroller'), require('lodash.debounce'), require('@floating-ui/react'), require('otp-input-react'), require('@radix-ui/react-slider'), require('@radix-ui/react-tabs'), require('@radix-ui/react-separator'), require('@radix-ui/react-toggle-group'), require('@radix-ui/react-dialog'), require('@radix-ui/react-accordion'), require('dayzed'), require('react-table'), require('react-dom'), require('@radix-ui/react-alert-dialog'), require('@radix-ui/react-dropdown-menu'), require('@radix-ui/react-aspect-ratio'), require('react-color/lib/components/common'), require('react-color/lib/helpers/color'), require('react-step-wizard'), require('@react-google-maps/api'), require('superagent'), require('recharts'), require('draft-js'), require('react-draft-wysiwyg'), require('react-contextmenu'), require('react-loading-skeleton'), require('react-loading-skeleton/dist/skeleton.css'), require('react-ui-scrollspy'), require('react-image-crop'), require('browser-image-compression'), require('react-table-sticky')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', 'prop-types', '@stitches/react', '@majoo-ui/core', '@majoo-ui/icons', 'react-transition-group', 'react/jsx-runtime', '@majoo-ui/helpers', 'react-i18next', 'moment', '@radix-ui/react-avatar', '@radix-ui/react-tooltip', '@radix-ui/react-progress', '@radix-ui/react-label', '@radix-ui/react-checkbox', '@radix-ui/react-radio-group', 'react-number-format', '@radix-ui/react-switch', 'downshift', 'react-infinite-scroller', 'lodash.debounce', '@floating-ui/react', 'otp-input-react', '@radix-ui/react-slider', '@radix-ui/react-tabs', '@radix-ui/react-separator', '@radix-ui/react-toggle-group', '@radix-ui/react-dialog', '@radix-ui/react-accordion', 'dayzed', 'react-table', 'react-dom', '@radix-ui/react-alert-dialog', '@radix-ui/react-dropdown-menu', '@radix-ui/react-aspect-ratio', 'react-color/lib/components/common', 'react-color/lib/helpers/color', 'react-step-wizard', '@react-google-maps/api', 'superagent', 'recharts', 'draft-js', 'react-draft-wysiwyg', 'react-contextmenu', 'react-loading-skeleton', 'react-loading-skeleton/dist/skeleton.css', 'react-ui-scrollspy', 'react-image-crop', 'browser-image-compression', 'react-table-sticky'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.React = {}, global.React, global.PropTypes, global.react, global.core, global.icons, global.reactTransitionGroup, global.jsxRuntime, global.helpers, global.reactI18next, global.moment, global.AvatarPrimitive, global.TooltipPrimitive, global.ProgressPrimitive, global.LabelPrimitive, global.CheckboxPrimitive, global.RadioGroupPrimitive, global.NumberFormat, global.SwitchPrimitive, global.Downshift, global.InfiniteScroll, global.debounce, global.react$1, global.OTPInput, global.SliderPrimitive, global.TabsPrimitive, global.SeparatorPrimitive, global.ToggleGroupPrimitive, global.DialogPrimitive, global.AccordionPrimitive, global.dayzed, global.reactTable, global.ReactDOM, global.ADialog, global.DropdownMenuPrimitive, global.AspectRatioPrimitive, global.common, global.color, global.StepWizard$1, global.api, global.request, global.recharts, global.draftJs, global.reactDraftWysiwyg, global.reactContextmenu, global.ReactSkeleton, null, global.ScrollSpy, global.ReactCrop, global.imageCompressionComponent, global.reactTableSticky));
-})(this, (function (exports, React, PropTypes, react, core, icons, reactTransitionGroup, jsxRuntime, helpers, reactI18next, moment, AvatarPrimitive, TooltipPrimitive, ProgressPrimitive, LabelPrimitive, CheckboxPrimitive, RadioGroupPrimitive, NumberFormat, SwitchPrimitive, Downshift, InfiniteScroll, debounce, react$1, OTPInput, SliderPrimitive, TabsPrimitive, SeparatorPrimitive, ToggleGroupPrimitive, DialogPrimitive, AccordionPrimitive, dayzed, reactTable, ReactDOM, ADialog, DropdownMenuPrimitive, AspectRatioPrimitive, common, color, StepWizard$1, api, request, recharts, draftJs, reactDraftWysiwyg, reactContextmenu, ReactSkeleton, skeleton_css, ScrollSpy, ReactCrop, imageCompressionComponent, reactTableSticky) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('prop-types'), require('@stitches/react'), require('@majoo-ui/core'), require('@majoo-ui/icons'), require('react-transition-group'), require('react/jsx-runtime'), require('@majoo-ui/helpers'), require('react-i18next'), require('moment'), require('@radix-ui/react-avatar'), require('@radix-ui/react-tooltip'), require('@radix-ui/react-progress'), require('@radix-ui/react-label'), require('@radix-ui/react-checkbox'), require('@radix-ui/react-radio-group'), require('react-number-format'), require('react-hook-form'), require('@radix-ui/react-switch'), require('downshift'), require('react-infinite-scroller'), require('lodash.debounce'), require('@floating-ui/react'), require('otp-input-react'), require('@radix-ui/react-slider'), require('@radix-ui/react-tabs'), require('@radix-ui/react-separator'), require('@radix-ui/react-toggle-group'), require('@radix-ui/react-dialog'), require('@radix-ui/react-accordion'), require('dayzed'), require('react-table'), require('react-dom'), require('@radix-ui/react-alert-dialog'), require('@radix-ui/react-dropdown-menu'), require('@radix-ui/react-aspect-ratio'), require('react-color/lib/components/common'), require('react-color/lib/helpers/color'), require('react-step-wizard'), require('@react-google-maps/api'), require('superagent'), require('recharts'), require('draft-js'), require('react-draft-wysiwyg'), require('react-contextmenu'), require('react-loading-skeleton'), require('react-loading-skeleton/dist/skeleton.css'), require('react-ui-scrollspy'), require('react-image-crop'), require('browser-image-compression'), require('react-table-sticky')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', 'prop-types', '@stitches/react', '@majoo-ui/core', '@majoo-ui/icons', 'react-transition-group', 'react/jsx-runtime', '@majoo-ui/helpers', 'react-i18next', 'moment', '@radix-ui/react-avatar', '@radix-ui/react-tooltip', '@radix-ui/react-progress', '@radix-ui/react-label', '@radix-ui/react-checkbox', '@radix-ui/react-radio-group', 'react-number-format', 'react-hook-form', '@radix-ui/react-switch', 'downshift', 'react-infinite-scroller', 'lodash.debounce', '@floating-ui/react', 'otp-input-react', '@radix-ui/react-slider', '@radix-ui/react-tabs', '@radix-ui/react-separator', '@radix-ui/react-toggle-group', '@radix-ui/react-dialog', '@radix-ui/react-accordion', 'dayzed', 'react-table', 'react-dom', '@radix-ui/react-alert-dialog', '@radix-ui/react-dropdown-menu', '@radix-ui/react-aspect-ratio', 'react-color/lib/components/common', 'react-color/lib/helpers/color', 'react-step-wizard', '@react-google-maps/api', 'superagent', 'recharts', 'draft-js', 'react-draft-wysiwyg', 'react-contextmenu', 'react-loading-skeleton', 'react-loading-skeleton/dist/skeleton.css', 'react-ui-scrollspy', 'react-image-crop', 'browser-image-compression', 'react-table-sticky'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.React = {}, global.React, global.PropTypes, global.react, global.core, global.icons, global.reactTransitionGroup, global.jsxRuntime, global.helpers, global.reactI18next, global.moment, global.AvatarPrimitive, global.TooltipPrimitive, global.ProgressPrimitive, global.LabelPrimitive, global.CheckboxPrimitive, global.RadioGroupPrimitive, global.NumberFormat, global.reactHookForm, global.SwitchPrimitive, global.Downshift, global.InfiniteScroll, global.debounce, global.react$1, global.OTPInput, global.SliderPrimitive, global.TabsPrimitive, global.SeparatorPrimitive, global.ToggleGroupPrimitive, global.DialogPrimitive, global.AccordionPrimitive, global.dayzed, global.reactTable, global.ReactDOM, global.ADialog, global.DropdownMenuPrimitive, global.AspectRatioPrimitive, global.common, global.color, global.StepWizard$1, global.api, global.request, global.recharts, global.draftJs, global.reactDraftWysiwyg, global.reactContextmenu, global.ReactSkeleton, null, global.ScrollSpy, global.ReactCrop, global.imageCompressionComponent, global.reactTableSticky));
+})(this, (function (exports, React, PropTypes, react, core, icons, reactTransitionGroup, jsxRuntime, helpers, reactI18next, moment, AvatarPrimitive, TooltipPrimitive, ProgressPrimitive, LabelPrimitive, CheckboxPrimitive, RadioGroupPrimitive, NumberFormat, reactHookForm, SwitchPrimitive, Downshift, InfiniteScroll, debounce, react$1, OTPInput, SliderPrimitive, TabsPrimitive, SeparatorPrimitive, ToggleGroupPrimitive, DialogPrimitive, AccordionPrimitive, dayzed, reactTable, ReactDOM, ADialog, DropdownMenuPrimitive, AspectRatioPrimitive, common, color, StepWizard$1, api, request, recharts, draftJs, reactDraftWysiwyg, reactContextmenu, ReactSkeleton, skeleton_css, ScrollSpy, ReactCrop, imageCompressionComponent, reactTableSticky) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -7085,7 +7085,7 @@
   };
   InputRightElement.name = 'InputRightElement';
 
-  const _excluded$i = ["placeholder", "value", "size", "isInvalid", "readOnly", "disabled"];
+  const _excluded$i = ["placeholder", "value", "size", "isInvalid", "readOnly", "disabled", "control", "name"];
   var _jsxFileName$F = "/Users/ryanakbar20/Documents/project/majoo/majoo-ui/packages/react/src/components/form/components/InputNumber/InputNumber.js";
   const StyledInput = styled(NumberFormat__default["default"], {
     // Reset
@@ -7266,10 +7266,40 @@
         size,
         isInvalid,
         readOnly,
-        disabled
+        disabled,
+        control,
+        name
       } = _ref,
       props = _objectWithoutPropertiesLoose(_ref, _excluded$i);
-    return /*#__PURE__*/React__default["default"].createElement(StyledInput, _extends({
+    return /*#__PURE__*/React__default["default"].createElement(ConditionalWrapper, {
+      condition: Boolean(control),
+      wrapper: child => /*#__PURE__*/React__default["default"].createElement(reactHookForm.Controller, {
+        control: control,
+        name: name,
+        render: ({
+          field: {
+            name: controlName,
+            ref: controlRef
+          }
+        }) => /*#__PURE__*/React.cloneElement(child, {
+          ref,
+          getInputRef: controlRef,
+          name: controlName
+        }),
+        __self: undefined,
+        __source: {
+          fileName: _jsxFileName$F,
+          lineNumber: 199,
+          columnNumber: 9
+        }
+      }),
+      __self: undefined,
+      __source: {
+        fileName: _jsxFileName$F,
+        lineNumber: 196,
+        columnNumber: 5
+      }
+    }, /*#__PURE__*/React__default["default"].createElement(StyledInput, _extends({
       ref: ref,
       placeholder: placeholder,
       value: value,
@@ -7282,10 +7312,10 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$F,
-        lineNumber: 193,
-        columnNumber: 3
+        lineNumber: 208,
+        columnNumber: 7
       }
-    }));
+    })));
   });
   InputNumber.propTypes = {
     placeholder: PropTypes__default["default"].string,
@@ -11488,7 +11518,7 @@
         }
       }
     });
-    const getOption = maxSelectedItem ? React.useCallback(() => option === null || option === void 0 ? void 0 : option.map(item => {
+    const getOption = React.useCallback(() => maxSelectedItem ? option === null || option === void 0 ? void 0 : option.map(item => {
       const isMaxSelectedItem = maxSelectedItem && (selectedValue === null || selectedValue === void 0 ? void 0 : selectedValue.length) >= maxSelectedItem;
       if (isMaxSelectedItem && !(selectedValue !== null && selectedValue !== void 0 && selectedValue.includes(item.id))) {
         item.hideCheck = true;
@@ -11498,7 +11528,7 @@
         item.isDisabled = false;
       }
       return item;
-    }), [maxSelectedItem, option, selectedValue]) : () => option;
+    }) : option, [maxSelectedItem, option, selectedValue]);
     React.useEffect(() => {
       sortItems();
       setItems(isShowSelectAll ? [{
@@ -11509,7 +11539,7 @@
         id: '!all',
         name: selectAllLabel != null ? selectAllLabel : t('selectAllLabelText', 'Pilih Semua')
       }, ...getOption()] : getOption());
-    }, [option, isShowSelectAll]);
+    }, [isShowSelectAll, selectAllLabel, t, maxSelectedItem ? getOption : option]);
     React.useEffect(() => {
       if (selectedValue.length > 0 && disabledOptions.length === 0) {
         setInitItems(sortValue);
@@ -11551,7 +11581,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 620,
+        lineNumber: 622,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(Select, {
@@ -11561,7 +11591,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 621,
+        lineNumber: 623,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(InputWrapper$1, _extends({}, getComboboxProps(getDropdownProps({
@@ -11576,7 +11606,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 622,
+        lineNumber: 624,
         columnNumber: 11
       }
     }), /*#__PURE__*/React__default["default"].createElement(Input$6, _extends({}, getInputProps({
@@ -11594,7 +11624,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 632,
+        lineNumber: 634,
         columnNumber: 13
       }
     })), /*#__PURE__*/React__default["default"].createElement(Button$2, _extends({}, getToggleButtonProps({
@@ -11607,7 +11637,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 639,
+        lineNumber: 641,
         columnNumber: 13
       }
     }), placeholder != null ? placeholder : t('placeholder', 'Pilih Item'))), /*#__PURE__*/React__default["default"].createElement(IconWrapper, _extends({}, getToggleButtonProps({
@@ -11618,7 +11648,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 649,
+        lineNumber: 651,
         columnNumber: 11
       }
     }), /*#__PURE__*/React__default["default"].createElement(IconCaretDown, {
@@ -11626,7 +11656,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 654,
+        lineNumber: 656,
         columnNumber: 13
       }
     }))), helperText && /*#__PURE__*/React__default["default"].createElement(Paragraph, {
@@ -11639,7 +11669,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 658,
+        lineNumber: 660,
         columnNumber: 11
       }
     }, helperText), showSelectedTag && !showCounter && selectedItems.length !== 0 && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(TagWrapper$2, {
@@ -11647,7 +11677,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 664,
+        lineNumber: 666,
         columnNumber: 13
       }
     }, isShowTagSelectAll ? /*#__PURE__*/React__default["default"].createElement(Tag, _extends({
@@ -11667,7 +11697,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 666,
+        lineNumber: 668,
         columnNumber: 17
       }
     }), selectAllLabel != null ? selectAllLabel : t('selectAllLabelText', 'Pilih Semua')) : selectedItems === null || selectedItems === void 0 ? void 0 : (_selectedItems$filter = selectedItems.filter(item => (item === null || item === void 0 ? void 0 : item.id) !== '!all')) === null || _selectedItems$filter === void 0 ? void 0 : (_selectedItems$filter2 = _selectedItems$filter.filter((_, idx) => {
@@ -11697,7 +11727,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 694,
+        lineNumber: 696,
         columnNumber: 21
       }
     }), selectedItem.name))), collapsible && !isShowTagSelectAll && (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.length) > 5 && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -11706,7 +11736,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 716,
+        lineNumber: 718,
         columnNumber: 15
       }
     }, /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -11716,14 +11746,14 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 717,
+        lineNumber: 719,
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(Separator$2, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 718,
+        lineNumber: 720,
         columnNumber: 19
       }
     }), /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -11737,7 +11767,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 719,
+        lineNumber: 721,
         columnNumber: 19
       }
     }, showAllTags ? /*#__PURE__*/React__default["default"].createElement(icons.ChevronUpOutline, {
@@ -11745,7 +11775,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 725,
+        lineNumber: 727,
         columnNumber: 23
       }
     }) : /*#__PURE__*/React__default["default"].createElement(icons.ChevronDownOutline, {
@@ -11753,7 +11783,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 727,
+        lineNumber: 729,
         columnNumber: 23
       }
     }), /*#__PURE__*/React__default["default"].createElement(Paragraph, {
@@ -11765,14 +11795,14 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 729,
+        lineNumber: 731,
         columnNumber: 21
       }
     }, showAllTags ? t('showSomeText', 'Tampilkan Sebagian') : t('showAllText', 'Tampilkan Semua'))), /*#__PURE__*/React__default["default"].createElement(Separator$2, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 733,
+        lineNumber: 735,
         columnNumber: 19
       }
     })), /*#__PURE__*/React__default["default"].createElement(Paragraph, {
@@ -11783,7 +11813,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 735,
+        lineNumber: 737,
         columnNumber: 17
       }
     }, `${selectedItems === null || selectedItems === void 0 ? void 0 : (_selectedItems$filter3 = selectedItems.filter(item => (item === null || item === void 0 ? void 0 : item.id) !== '!all')) === null || _selectedItems$filter3 === void 0 ? void 0 : _selectedItems$filter3.length} ${labelCounter || t('labelCounterText', 'Item terpilih')}`))), showCounter && !isShowTagSelectAll && Boolean(selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.length) && /*#__PURE__*/React__default["default"].createElement(Paragraph, {
@@ -11795,7 +11825,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 745,
+        lineNumber: 747,
         columnNumber: 11
       }
     }, `${selectedItems === null || selectedItems === void 0 ? void 0 : (_selectedItems$filter4 = selectedItems.filter(item => (item === null || item === void 0 ? void 0 : item.id) !== '!all')) === null || _selectedItems$filter4 === void 0 ? void 0 : _selectedItems$filter4.length} ${labelCounter || t('labelCounterText', 'Item terpilih')}`), /*#__PURE__*/React__default["default"].createElement(OptionWrapper$1, {
@@ -11807,7 +11837,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 752,
+        lineNumber: 754,
         columnNumber: 9
       }
     }, isLoading && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -11828,7 +11858,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 758,
+        lineNumber: 760,
         columnNumber: 13
       }
     }, /*#__PURE__*/React__default["default"].createElement(Text$1, {
@@ -11836,7 +11866,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 774,
+        lineNumber: 776,
         columnNumber: 15
       }
     }, "Loading....")), items.length > 0 || isLoading ? /*#__PURE__*/React__default["default"].createElement(Option, _extends({}, getMenuProps({
@@ -11847,7 +11877,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 780,
+        lineNumber: 782,
         columnNumber: 13
       }
     }), /*#__PURE__*/React__default["default"].createElement(ConditionalWrapper, {
@@ -11862,14 +11892,14 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 784,
+          lineNumber: 786,
           columnNumber: 19
         }
       }, child),
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 781,
+        lineNumber: 783,
         columnNumber: 15
       }
     }, isOpen && items.map((item, index) => {
@@ -11889,7 +11919,7 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 796,
+          lineNumber: 798,
           columnNumber: 21
         }
       }), /*#__PURE__*/React__default["default"].createElement(IconWrapper, {
@@ -11902,7 +11932,7 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 809,
+          lineNumber: 811,
           columnNumber: 23
         }
       }, !(item !== null && item !== void 0 && item.hideCheck) && (item.isDisabled ? /*#__PURE__*/React__default["default"].createElement(CheckOutline, {
@@ -11910,7 +11940,7 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 819,
+          lineNumber: 821,
           columnNumber: 29
         }
       }) : selectedValue.includes(item.id) && (item.isDisabled === false || item.isDisabled === undefined) && /*#__PURE__*/React__default["default"].createElement(CheckOutline, {
@@ -11918,21 +11948,21 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 823,
+          lineNumber: 825,
           columnNumber: 31
         }
       })), isShowSelectAll && (item === null || item === void 0 ? void 0 : item.id) === '!all' && selectedValue !== null && selectedValue !== void 0 && selectedValue.length && (selectedValue === null || selectedValue === void 0 ? void 0 : selectedValue.length) < (items === null || items === void 0 ? void 0 : items.length) ? /*#__PURE__*/React__default["default"].createElement(IndeterminateFilled, {
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 830,
+          lineNumber: 832,
           columnNumber: 27
         }
       }, "-") : /*#__PURE__*/React__default["default"].createElement("div", {
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 832,
+          lineNumber: 834,
           columnNumber: 27
         }
       })), /*#__PURE__*/React__default["default"].createElement(Item$3, {
@@ -11943,7 +11973,7 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$w,
-          lineNumber: 835,
+          lineNumber: 837,
           columnNumber: 23
         }
       }, item.render ? (_item$render = item.render) === null || _item$render === void 0 ? void 0 : _item$render.call(item, item.name) : item.name));
@@ -11957,14 +11987,14 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 843,
+        lineNumber: 845,
         columnNumber: 13
       }
     }), /*#__PURE__*/React__default["default"].createElement(StyledDiv, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 844,
+        lineNumber: 846,
         columnNumber: 15
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -11974,7 +12004,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 845,
+        lineNumber: 847,
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(icons.CircleInfoOutline, {
@@ -11986,7 +12016,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$w,
-        lineNumber: 846,
+        lineNumber: 848,
         columnNumber: 19
       }
     })), textEmptyItem != null ? textEmptyItem : t('emptyItemText', 'Item tidak ditemukan')))));
@@ -21745,7 +21775,8 @@
       }
     }, props.description)), /*#__PURE__*/React__default["default"].createElement(Box, {
       css: {
-        width: '100%'
+        width: '100%',
+        display: props !== null && props !== void 0 && props.singleButton && props !== null && props !== void 0 && props.hideActionButton ? 'none' : 'inherit'
       },
       __self: undefined,
       __source: {
@@ -21819,13 +21850,13 @@
         lineNumber: 187,
         columnNumber: 19
       }
-    }), props.labelCancel ? props.labelCancel : t('label.cancel', 'Batal'))), /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
+    }), props.labelCancel ? props.labelCancel : t('label.cancel', 'Batal'))), !(props !== null && props !== void 0 && props.hideActionButton) && /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
       asChild: true,
       __self: undefined,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 201,
-        columnNumber: 17
+        lineNumber: 202,
+        columnNumber: 19
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$4, _extends({
       size: props.btnSize,
@@ -21839,8 +21870,8 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 202,
-        columnNumber: 19
+        lineNumber: 203,
+        columnNumber: 21
       }
     }), props.labelConfirm ? props.labelConfirm : t('label.continue', 'Ya, Lanjutkan'))))))));
   };
@@ -21876,7 +21907,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 246,
+        lineNumber: 248,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(Content$1, _extends({
@@ -21891,14 +21922,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 247,
+        lineNumber: 249,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(StyledTitle, {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 256,
+        lineNumber: 258,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Heading, {
@@ -21906,7 +21937,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 257,
+        lineNumber: 259,
         columnNumber: 11
       }
     }, props.title), !props.hideCloseButton && /*#__PURE__*/React__default["default"].createElement(AlertDialogCancel, {
@@ -21914,7 +21945,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 259,
+        lineNumber: 261,
         columnNumber: 13
       }
     }, /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -21925,7 +21956,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 260,
+        lineNumber: 262,
         columnNumber: 15
       }
     }, /*#__PURE__*/React__default["default"].createElement(icons.CloseOutline, {
@@ -21933,7 +21964,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 261,
+        lineNumber: 263,
         columnNumber: 17
       }
     })))), /*#__PURE__*/React__default["default"].createElement(Separator$2, {
@@ -21941,14 +21972,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 266,
+        lineNumber: 268,
         columnNumber: 9
       }
     }), /*#__PURE__*/React__default["default"].createElement(StyledDescription$1, {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 267,
+        lineNumber: 269,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Paragraph, {
@@ -21959,17 +21990,18 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 268,
+        lineNumber: 270,
         columnNumber: 11
       }
     }, props.description)), /*#__PURE__*/React__default["default"].createElement(Box, {
       css: {
-        width: '100%'
+        width: '100%',
+        display: props !== null && props !== void 0 && props.singleButton && props !== null && props !== void 0 && props.hideActionButton ? 'none' : 'inherit'
       },
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 272,
+        lineNumber: 274,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Separator$2, {
@@ -21977,7 +22009,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 273,
+        lineNumber: 275,
         columnNumber: 11
       }
     }), /*#__PURE__*/React__default["default"].createElement(Flex, {
@@ -21991,7 +22023,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 274,
+        lineNumber: 276,
         columnNumber: 11
       }
     }, props.singleButton ? /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
@@ -21999,7 +22031,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 276,
+        lineNumber: 278,
         columnNumber: 15
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$4, _extends({
@@ -22014,7 +22046,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 277,
+        lineNumber: 279,
         columnNumber: 17
       }
     }), props.labelConfirm ? props.labelConfirm : t('label.continue', 'Ya, Lanjutkan'))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Cancel, {
@@ -22022,7 +22054,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 290,
+        lineNumber: 292,
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$4, _extends({
@@ -22038,16 +22070,16 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 291,
+        lineNumber: 293,
         columnNumber: 19
       }
-    }), props.labelCancel ? props.labelCancel : t('label.cancel', 'Batal'))), /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
+    }), props.labelCancel ? props.labelCancel : t('label.cancel', 'Batal'))), !(props !== null && props !== void 0 && props.hideActionButton) && /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
       asChild: true,
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 305,
-        columnNumber: 17
+        lineNumber: 308,
+        columnNumber: 19
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$4, _extends({
       size: props.btnSize,
@@ -22061,8 +22093,8 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 306,
-        columnNumber: 19
+        lineNumber: 309,
+        columnNumber: 21
       }
     }), props.labelConfirm ? props.labelConfirm : t('label.continue', 'Ya, Lanjutkan'))))))));
   }
@@ -22076,7 +22108,8 @@
     disabledButton: PropTypes__default["default"].bool,
     actionButtonProps: PropTypes__default["default"].object,
     cancelButtonProps: PropTypes__default["default"].object,
-    hideCloseButton: PropTypes__default["default"].bool
+    hideCloseButton: PropTypes__default["default"].bool,
+    hideActionButton: PropTypes__default["default"].bool
   };
   TemplateAlertFunction.defaultProps = {
     dialogType: 'primary',
@@ -30278,14 +30311,21 @@
       emptyDataMessage = props.emptyDataMessage,
       showCheckbox = props.showCheckbox,
       customRows = props.customRows,
-      onExpand = props.onExpand;
+      onExpand = props.onExpand,
+      hiddenColumns = props.hiddenColumns;
     var getTableProps = instance.getTableProps,
       getTableBodyProps = instance.getTableBodyProps,
       headerGroups = instance.headerGroups,
       rows = instance.rows,
       prepareRow = instance.prepareRow,
       state = instance.state,
-      toggleAllRowsExpanded = instance.toggleAllRowsExpanded;
+      toggleAllRowsExpanded = instance.toggleAllRowsExpanded,
+      setHiddenColumns = instance.setHiddenColumns;
+    React.useEffect(function () {
+      if (hiddenColumns === null || hiddenColumns === void 0 ? void 0 : hiddenColumns.length) {
+        setHiddenColumns(hiddenColumns);
+      }
+    }, [hiddenColumns, setHiddenColumns]);
     var getCustomRows = function getCustomRows(row, renderRow) {
       var _a, _b;
       var customStyle = {};
@@ -30346,7 +30386,8 @@
               justify: "center",
               align: "center",
               onClick: function () {
-                if (!Object.keys(state.expanded).includes(row.id)) {
+                var _a;
+                if (!((_a = Object.keys(state.expanded)) === null || _a === void 0 ? void 0 : _a.includes(row.id))) {
                   toggleAllRowsExpanded(false);
                 }
                 row.toggleRowExpanded(!row.isExpanded);
@@ -47987,7 +48028,8 @@
       keyId = _a === void 0 ? 'id' : _a,
       selectedIds = props.selectedIds,
       onExpand = props.onExpand,
-      isMobileLayout = props.isMobileLayout;
+      isMobileLayout = props.isMobileLayout,
+      hiddenColumns = props.hiddenColumns;
     var t = reactI18next.useTranslation('translation').t;
     var _b = React.useState(null),
       selectedIndex = _b[0],
@@ -48048,7 +48090,11 @@
       rows = instance.rows,
       prepareRow = instance.prepareRow,
       visibleColumns = instance.visibleColumns,
+      setHiddenColumns = instance.setHiddenColumns,
       selectedRowIds = instance.state.selectedRowIds;
+    React.useEffect(function () {
+      if (hiddenColumns) setHiddenColumns(hiddenColumns);
+    }, [hiddenColumns, setHiddenColumns]);
     React.useEffect(function () {
       if (data && data.length > 0 && selectedRowIds && onSelectedChange && selectedIndex) {
         var selected = selectedRowIds ? Object.keys(selectedRowIds) : [];
@@ -48228,7 +48274,8 @@
       emptyDataMessage: emptyDataMessage,
       showCheckbox: showCheckbox,
       customRows: customRows,
-      onExpand: onExpand
+      onExpand: onExpand,
+      hiddenColumns: hiddenColumns
     }, void 0);
   }
   EditableTable.Product = Product;