@unicef/material-ui 0.11.4 → 0.11.6

package/lib/dev.js

@@ -49363,9 +49363,14 @@ var useStyles$n = makeStyles$1(function (theme) {
 });
 
 var CONTROL_VARIANTS = {
-  popup: 'popup',
   menuItem: 'menuItem',
-  icon: 'icon'
+  icon: 'icon',
+  button: 'button'
+};
+
+var CONFIRMATION_VARIANTS = {
+  menu: 'menu',
+  popup: 'popup'
 
   /**
    * UConfirmationButton is a component to get confirmation from the user before processing it.
@@ -49382,7 +49387,9 @@ var CONTROL_VARIANTS = {
       icon = props.icon,
       confirmText = props.confirmText,
       confirmActionText = props.confirmActionText,
-      cancelText = props.cancelText;
+      cancelText = props.cancelText,
+      buttonVariant = props.buttonVariant,
+      confirmVariant = props.confirmVariant;
 
   var _useState = React.useState(null),
       _useState2 = slicedToArray(_useState, 2),
@@ -49396,7 +49403,11 @@ var CONTROL_VARIANTS = {
 
   var handleConfirm = function handleConfirm(e) {
     onConfirm && onConfirm(e, id);
-    if (variant !== CONTROL_VARIANTS.popup) handleDeleteOptionClicked();
+    if (confirmVariant === CONFIRMATION_VARIANTS.popup) {
+      setOpenDialog(false);
+    } else {
+      handleDeleteOptionClicked();
+    }
   };
 
   var handleDeleteOptionClicked = function handleDeleteOptionClicked(e) {
@@ -49404,7 +49415,11 @@ var CONTROL_VARIANTS = {
   };
 
   var handleClick = function handleClick(e) {
-    if (variant !== CONTROL_VARIANTS.popup) setDeleteAnchorEl(e.currentTarget);else setOpenDialog(true);
+    if (confirmVariant === CONFIRMATION_VARIANTS.popup) {
+      setOpenDialog(true);
+    } else {
+      setDeleteAnchorEl(e.currentTarget);
+    }
   };
 
   var handleCancelPopup = function handleCancelPopup(e) {
@@ -49419,10 +49434,20 @@ var CONTROL_VARIANTS = {
       { onClick: handleClick, className: classes.menuLabel },
       icon,
       React__default.createElement(
-        'span',
-        { className: classes.span },
+        Box,
+        { component: 'span', className: icon ? classes.span : '' },
         buttonText
       )
+    ) : variant === CONTROL_VARIANTS.button ? React__default.createElement(
+      UButton,
+      {
+        startIcon: icon,
+        onClick: handleClick,
+        'aria-controls': 'delete-confirmation-menu-' + id,
+        'aria-haspopup': 'true',
+        variant: buttonVariant
+      },
+      buttonText
     ) : React__default.createElement(
       Tooltip$1,
       { title: buttonText, placement: 'top' },
@@ -49438,7 +49463,7 @@ var CONTROL_VARIANTS = {
         icon
       )
     ),
-    variant === CONTROL_VARIANTS.popup ? React__default.createElement(
+    confirmVariant === CONFIRMATION_VARIANTS.popup ? React__default.createElement(
       Dialog$1,
       { id: 'delete-confirmation-menu-' + id, open: openDialog },
       React__default.createElement(
@@ -49497,8 +49522,10 @@ UConfirmationButton.propTypes = {
   buttonText: PropTypes__default.string,
   /** trigger confirmation function */
   onConfirm: PropTypes__default.func.isRequired,
-  /** variant: menu or icon */
-  variant: PropTypes__default.oneOf([CONTROL_VARIANTS.popup, CONTROL_VARIANTS.menuItem, CONTROL_VARIANTS.icon]),
+  /** variant: menuItem or icon or button */
+  variant: PropTypes__default.oneOf([CONTROL_VARIANTS.menuItem, CONTROL_VARIANTS.icon, CONTROL_VARIANTS.button]),
+  /** Confirm variant: popup or menu */
+  confirmVariant: PropTypes__default.oneOf([CONFIRMATION_VARIANTS.popup, CONFIRMATION_VARIANTS.menu]),
   /** if the variant is menuitem, this prop make sure the item enable or not */
   enabled: PropTypes__default.bool,
   /** button cancel text for popup variant */
@@ -49508,7 +49535,9 @@ UConfirmationButton.propTypes = {
   /** confirm action text */
   confirmActionText: PropTypes__default.string,
   /** custom icon */
-  icon: PropTypes__default.element
+  icon: PropTypes__default.element,
+  /** Button variant applied to menuItem button */
+  buttonVariant: PropTypes__default.string
 };
 
 UConfirmationButton.defaultProps = {
@@ -49518,7 +49547,9 @@ UConfirmationButton.defaultProps = {
   confirmText: 'Confirm deletion?',
   confirmActionText: 'Yes, delete',
   cancelText: 'No',
-  icon: React__default.createElement(DeleteOutlinedIcon, null)
+  icon: React__default.createElement(DeleteOutlinedIcon, null),
+  buttonVariant: 'text',
+  confirmVariant: 'menu'
 };
 
 /**
@@ -52949,7 +52980,7 @@ function USearchBox(_ref) {
 
   var classes = useStyles$u();
 
-  useEffect(function () {
+  React.useEffect(function () {
     setSearch(value);
   }, [value]);