@majoo-ui/react 1.50.1 → 1.50.2-rc.2

package/index.esm.js

@@ -4783,6 +4783,9 @@ Image.defaultProps = {
 
 const _excluded$q = ["children", "label", "color", "css", "withClick", "side", "align"];
 var _jsxFileName$P = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\tooltip\\Tooltip.js";
+const {
+  zIndices: zIndices$1
+} = foundations;
 const slideUpAndFade$1 = keyframes({
   '0%': {
     opacity: 0,
@@ -4824,6 +4827,7 @@ const slideLeftAndFade$1 = keyframes({
   }
 });
 const StyledContent$6 = styled(TooltipPrimitive.Content, {
+  zIndex: zIndices$1.tooltip,
   borderRadius: 8,
   padding: '8px',
   fontSize: '$helper',
@@ -4899,7 +4903,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 89,
+      lineNumber: 91,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(TooltipBase, _extends({}, rest, {
@@ -4907,7 +4911,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 90,
+      lineNumber: 92,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(TooltipTrigger, {
@@ -4915,7 +4919,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 91,
+      lineNumber: 93,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(TriggerSpan, {
@@ -4923,10 +4927,17 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 92,
+      lineNumber: 94,
       columnNumber: 11
     }
-  }, children)), /*#__PURE__*/React__default.createElement(StyledContent$6, {
+  }, children)), /*#__PURE__*/React__default.createElement(TooltipPrimitive.Portal, {
+    __self: undefined,
+    __source: {
+      fileName: _jsxFileName$P,
+      lineNumber: 96,
+      columnNumber: 9
+    }
+  }, /*#__PURE__*/React__default.createElement(StyledContent$6, {
     align: align,
     side: side,
     sideOffset: 5,
@@ -4934,8 +4945,8 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 94,
-      columnNumber: 9
+      lineNumber: 97,
+      columnNumber: 11
     }
   }, label, /*#__PURE__*/React__default.createElement(StyledArrow$1, {
     offset: 10,
@@ -4943,10 +4954,10 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 101,
-      columnNumber: 11
+      lineNumber: 104,
+      columnNumber: 13
     }
-  }))));
+  })))));
 };
 
 Tooltip$1.propTypes = {
@@ -4965,7 +4976,7 @@ Tooltip$1.defaultProps = {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 121,
+      lineNumber: 125,
       columnNumber: 13
     }
   })
@@ -11240,6 +11251,16 @@ const StyledSeparator$1 = styled(SeparatorPrimitive.Root, {
   },
   '&[data-orientation=vertical]': {
     width: 1
+  },
+  variants: {
+    responsive: {
+      true: {
+        display: 'none',
+        '@md': {
+          display: 'block'
+        }
+      }
+    }
   }
 });
 const Separator$2 = StyledSeparator$1;
@@ -14811,6 +14832,7 @@ const Time = styled('p', {
   fontWeight: 600,
   fontStyle: 'normal',
   fontSize: 28,
+  color: '$textPrimary',
   margin: 0,
   letterSpacing: 2,
   userSelect: 'none',
@@ -14900,7 +14922,7 @@ const IconStateFull$1 = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 100,
+      lineNumber: 101,
       columnNumber: 5
     }
   })) : /*#__PURE__*/React__default.createElement(IconDown, _extends({}, props, {
@@ -14910,7 +14932,7 @@ const IconStateFull$1 = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 107,
+      lineNumber: 108,
       columnNumber: 5
     }
   }));
@@ -14967,7 +14989,7 @@ const NativeTimePicker = ({
 
   return /*#__PURE__*/React__default.createElement(Flex$1, {
     direction: "column",
-    gap: 3,
+    gap: size === 'sm' ? 4 : 5,
     align: "center",
     justify: "center",
     css: {
@@ -14976,7 +14998,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 158,
+      lineNumber: 159,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -14985,7 +15007,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 159,
+      lineNumber: 160,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -14995,7 +15017,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 160,
+      lineNumber: 161,
       columnNumber: 9
     }
   }), /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15005,7 +15027,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 161,
+      lineNumber: 162,
       columnNumber: 9
     }
   })), /*#__PURE__*/React__default.createElement(Input$3, {
@@ -15016,7 +15038,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 163,
+      lineNumber: 164,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(Time, {
@@ -15024,7 +15046,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 164,
+      lineNumber: 165,
       columnNumber: 7
     }
   }, moment(date).format(format)), /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -15033,7 +15055,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 165,
+      lineNumber: 166,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15043,7 +15065,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 166,
+      lineNumber: 167,
       columnNumber: 9
     }
   }), /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15053,7 +15075,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 167,
+      lineNumber: 168,
       columnNumber: 9
     }
   })));
@@ -15103,14 +15125,13 @@ const TimePicker = ({
     size: size,
     disabled: disabled,
     direction: "column",
-    gap: 3,
     justify: "center",
     align: "center",
     css: css,
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 202,
+      lineNumber: 203,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(NativeTimePicker, {
@@ -15124,7 +15145,7 @@ const TimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 203,
+      lineNumber: 204,
       columnNumber: 7
     }
   }));
@@ -15189,6 +15210,7 @@ function InputTimePicker({
   placement,
   css,
   disabled,
+  readOnly,
   minDate,
   maxDate
 }) {
@@ -15205,10 +15227,11 @@ function InputTimePicker({
     size: size,
     disabled: disabled,
     onClick: handleChange,
+    readOnly: readOnly,
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 40,
+      lineNumber: 41,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(InputLeftElement, {
@@ -15216,14 +15239,14 @@ function InputTimePicker({
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 41,
+        lineNumber: 42,
         columnNumber: 35
       }
     }),
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 41,
+      lineNumber: 42,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(InputText, {
@@ -15235,7 +15258,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 42,
+      lineNumber: 43,
       columnNumber: 7
     }
   }));
@@ -15251,7 +15274,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 53,
+      lineNumber: 54,
       columnNumber: 5
     }
   });
@@ -15263,7 +15286,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 65,
+      lineNumber: 66,
       columnNumber: 5
     }
   }, disabled ? /*#__PURE__*/React__default.createElement(Box, {
@@ -15271,14 +15294,14 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 67,
+      lineNumber: 68,
       columnNumber: 9
     }
   }, renderInputGroup()) : /*#__PURE__*/React__default.createElement(PopoverTrigger, {
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 69,
+      lineNumber: 70,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Box, {
@@ -15286,14 +15309,14 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 70,
+      lineNumber: 71,
       columnNumber: 11
     }
   }, renderInputGroup())), /*#__PURE__*/React__default.createElement(PopoverContent, {
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 73,
+      lineNumber: 74,
       columnNumber: 7
     }
   }, renderTimePicker())) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Box, {
@@ -15301,7 +15324,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 77,
+      lineNumber: 78,
       columnNumber: 7
     }
   }, renderInputGroup()), /*#__PURE__*/React__default.createElement(Drawer, {
@@ -15311,7 +15334,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 78,
+      lineNumber: 79,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(DrawerContent, {
@@ -15322,7 +15345,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 79,
+      lineNumber: 80,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -15334,7 +15357,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 85,
+      lineNumber: 86,
       columnNumber: 11
     }
   }, renderTimePicker()))));
@@ -15354,6 +15377,11 @@ InputTimePicker.propTypes = {
   */
   disabled: PropTypes.bool,
 
+  /**
+   ReadOnly state.
+  */
+  readOnly: PropTypes.bool,
+
   /**
    Resize time picker.
   */
@@ -15793,7 +15821,8 @@ function InputDatePicker({
   css,
   showTimePicker,
   minDate,
-  maxDate
+  maxDate,
+  readOnly
 }) {
   const [value, setValue] = useState(date || dateValue);
   const [defaultValue, setDefaultValue] = useState(defaultDate || defaultDateValue);
@@ -15827,6 +15856,7 @@ function InputDatePicker({
 
   const renderInputGroup = () => jsxs(InputGroup, Object.assign({
     disabled: disabled,
+    readOnly: readOnly,
     onClick: handleChange,
     size: size
   }, {
@@ -17104,8 +17134,6 @@ function Table({
 
               if (customRowsStyle && customRowsStyle(row.values).length) {
                 for (let _i = 0; _i < customRowsStyle(row.values).length; _i++) {
-                  console.log(customRowsStyle(row.values)[_i]);
-
                   if (customRowsStyle(row.values)[_i].predicate) {
                     customStyle = customRowsStyle(row.values)[_i].css;
                   }
@@ -18527,7 +18555,7 @@ function Content$1(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 74,
+      lineNumber: 75,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(StyledOverlay, {
@@ -18537,14 +18565,14 @@ function Content$1(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 75,
+      lineNumber: 76,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(StyledContent$1, _extends({}, props, {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 76,
+      lineNumber: 77,
       columnNumber: 7
     }
   }), children));
@@ -18558,14 +18586,14 @@ function AlertDialogFunction(properties) {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 85,
+        lineNumber: 86,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default.createElement(TemplateAlertFunction, _extends({}, props, {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
-        lineNumber: 86,
+        lineNumber: 87,
         columnNumber: 9
       }
     }))), document.getElementById('a-dialog'));
@@ -18609,7 +18637,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 127,
+      lineNumber: 128,
       columnNumber: 5
     }
   }), /*#__PURE__*/React__default.createElement(Content$1, _extends({}, props, {
@@ -18626,14 +18654,14 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 128,
+      lineNumber: 129,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(StyledTitle, {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 139,
+      lineNumber: 140,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Heading, {
@@ -18641,15 +18669,24 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 140,
+      lineNumber: 141,
       columnNumber: 11
     }
-  }, props.title), /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
-    asChild: true,
+  }, props.title), /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
+    condition: !props.onCancel,
+    wrapper: children => /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
+      asChild: true,
+      __self: undefined,
+      __source: {
+        fileName: _jsxFileName$b,
+        lineNumber: 144,
+        columnNumber: 34
+      }
+    }, children),
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 141,
+      lineNumber: 142,
       columnNumber: 11
     }
   }, /*#__PURE__*/React__default.createElement(Box, {
@@ -18660,7 +18697,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 142,
+      lineNumber: 146,
       columnNumber: 13
     }
   }, /*#__PURE__*/React__default.createElement(CloseOutline, {
@@ -18668,7 +18705,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 143,
+      lineNumber: 147,
       columnNumber: 15
     }
   })))), /*#__PURE__*/React__default.createElement(Separator$2, {
@@ -18676,14 +18713,14 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 147,
+      lineNumber: 151,
       columnNumber: 9
     }
   }), /*#__PURE__*/React__default.createElement(StyledDescription$1, {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 148,
+      lineNumber: 152,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Paragraph, {
@@ -18694,7 +18731,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 149,
+      lineNumber: 153,
       columnNumber: 11
     }
   }, props.description)), /*#__PURE__*/React__default.createElement(Box, {
@@ -18704,7 +18741,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 153,
+      lineNumber: 157,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Separator$2, {
@@ -18712,7 +18749,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 154,
+      lineNumber: 158,
       columnNumber: 11
     }
   }), /*#__PURE__*/React__default.createElement(Flex, {
@@ -18726,7 +18763,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 155,
+      lineNumber: 159,
       columnNumber: 11
     }
   }, props.singleButton ? /*#__PURE__*/React__default.createElement(ADialog.Action, {
@@ -18734,7 +18771,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 157,
+      lineNumber: 161,
       columnNumber: 15
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
@@ -18746,15 +18783,24 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 158,
+      lineNumber: 162,
       columnNumber: 17
     }
-  }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
-    asChild: true,
+  }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
+    condition: !props.onCancel,
+    wrapper: children => /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
+      asChild: true,
+      __self: undefined,
+      __source: {
+        fileName: _jsxFileName$b,
+        lineNumber: 176,
+        columnNumber: 40
+      }
+    }, children),
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 170,
+      lineNumber: 174,
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
@@ -18770,7 +18816,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 171,
+      lineNumber: 178,
       columnNumber: 19
     }
   }), props.labelCancel ? props.labelCancel : 'Cancel')), /*#__PURE__*/React__default.createElement(ADialog.Action, {
@@ -18778,7 +18824,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 185,
+      lineNumber: 192,
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
@@ -18793,7 +18839,7 @@ const TemplateAlertFunction = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 186,
+      lineNumber: 193,
       columnNumber: 19
     }
   }), props.labelConfirm ? props.labelConfirm : 'Confirm')))))));
@@ -18818,7 +18864,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 217,
+      lineNumber: 224,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(Content$1, _extends({}, props, {
@@ -18831,14 +18877,14 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 218,
+      lineNumber: 225,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(StyledTitle, {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 226,
+      lineNumber: 233,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Heading, {
@@ -18846,15 +18892,24 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 227,
+      lineNumber: 234,
       columnNumber: 11
     }
-  }, props.title), /*#__PURE__*/React__default.createElement(AlertDialogCancel, {
-    asChild: true,
+  }, props.title), /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
+    condition: !props.onClose || !props.onCancel,
+    wrapper: children => /*#__PURE__*/React__default.createElement(AlertDialogCancel, {
+      asChild: true,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$b,
+        lineNumber: 237,
+        columnNumber: 34
+      }
+    }, children),
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 228,
+      lineNumber: 235,
       columnNumber: 11
     }
   }, /*#__PURE__*/React__default.createElement(Box, {
@@ -18865,7 +18920,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 229,
+      lineNumber: 239,
       columnNumber: 13
     }
   }, /*#__PURE__*/React__default.createElement(CloseOutline, {
@@ -18873,7 +18928,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 230,
+      lineNumber: 240,
       columnNumber: 15
     }
   })))), /*#__PURE__*/React__default.createElement(Separator$2, {
@@ -18881,14 +18936,14 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 234,
+      lineNumber: 244,
       columnNumber: 9
     }
   }), /*#__PURE__*/React__default.createElement(StyledDescription$1, {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 235,
+      lineNumber: 245,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Paragraph, {
@@ -18898,7 +18953,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 236,
+      lineNumber: 246,
       columnNumber: 11
     }
   }, props.description)), /*#__PURE__*/React__default.createElement(Box, {
@@ -18908,7 +18963,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 238,
+      lineNumber: 248,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Separator$2, {
@@ -18916,7 +18971,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 239,
+      lineNumber: 249,
       columnNumber: 11
     }
   }), /*#__PURE__*/React__default.createElement(Flex, {
@@ -18930,7 +18985,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 240,
+      lineNumber: 250,
       columnNumber: 11
     }
   }, props.singleButton ? /*#__PURE__*/React__default.createElement(ADialog.Action, {
@@ -18938,7 +18993,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 242,
+      lineNumber: 252,
       columnNumber: 15
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
@@ -18953,15 +19008,24 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 243,
+      lineNumber: 253,
       columnNumber: 17
     }
-  }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
-    asChild: true,
+  }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
+    condition: !props.onCancel,
+    wrapper: children => /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
+      asChild: true,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$b,
+        lineNumber: 268,
+        columnNumber: 40
+      }
+    }, children),
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 256,
+      lineNumber: 266,
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
@@ -18977,7 +19041,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 257,
+      lineNumber: 270,
       columnNumber: 19
     }
   }), props.labelCancel ? props.labelCancel : 'Cancel')), /*#__PURE__*/React__default.createElement(ADialog.Action, {
@@ -18985,7 +19049,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 271,
+      lineNumber: 284,
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
@@ -19000,7 +19064,7 @@ function AlertDialog(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName$b,
-      lineNumber: 272,
+      lineNumber: 285,
       columnNumber: 19
     }
   }), props.labelConfirm ? props.labelConfirm : 'Confirm')))))));
@@ -19094,6 +19158,7 @@ const StyledContent = styled(DropdownMenuPrimitive.Content, {
   backgroundColor: 'white',
   borderRadius: 4,
   padding: 8,
+  zIndex: '$sticky',
   boxShadow: '0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2)',
   '@media (prefers-reduced-motion: no-preference)': {
     animationDuration: '400ms',
@@ -19186,7 +19251,7 @@ const DropdownMenuContext = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 119,
+      lineNumber: 120,
       columnNumber: 5
     }
   }), /*#__PURE__*/React__default.createElement(Context.Provider, {
@@ -19197,7 +19262,7 @@ const DropdownMenuContext = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 120,
+      lineNumber: 121,
       columnNumber: 7
     }
   }, children));
@@ -19227,7 +19292,7 @@ const DropdownMenuContentContext = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 138,
+      lineNumber: 139,
       columnNumber: 5
     }
   }), props.children);
@@ -19254,7 +19319,7 @@ const ButtonDropdown = /*#__PURE__*/React__default.forwardRef((props, ref) => /*
   __self: undefined,
   __source: {
     fileName: _jsxFileName$a,
-    lineNumber: 157,
+    lineNumber: 158,
     columnNumber: 3
   }
 }), props.children, props.rightIcon && props.rightIcon));
@@ -21708,7 +21773,7 @@ const Upload = ({
         lineNumber: 559,
         columnNumber: 9
       }
-    }, replaceLabel && replaceLabel.length > 0 ? replaceLabel : `Ubah ${isFile ? 'Berkas' : 'Gambar'}`));
+    }, replaceLabel && replaceLabel.length > 0 ? replaceLabel : `Ubah Berkas`));
   }
 
   const renderPicture = () => {
@@ -21990,7 +22055,7 @@ const Upload = ({
         lineNumber: 665,
         columnNumber: 11
       }
-    }, `${isFile ? 'Berkas' : 'Gambar'} sedang diunggah`)));
+    }, "Berkas sedang diunggah")));
   }
 
   function renderUpload() {
@@ -22072,7 +22137,7 @@ const Upload = ({
         lineNumber: 692,
         columnNumber: 17
       }
-    }, placeholder !== null && placeholder !== void 0 ? placeholder : `Pilih atau letakkan ${isFile ? 'berkas' : 'gambar'} di sini`)))), error && /*#__PURE__*/React__default.createElement(ErrorMessage, {
+    }, placeholder !== null && placeholder !== void 0 ? placeholder : `Pilih atau letakkan berkas di sini`)))), error && /*#__PURE__*/React__default.createElement(ErrorMessage, {
       __self: this,
       __source: {
         fileName: _jsxFileName$9,