@elice/material-exercise 1.231212.0 → 1.231228.0

package/cjs/components/shared/file-tree/FileTreeListItemContentInput.js

@@ -10,49 +10,48 @@ var fileTreeGenerator = require('./utils/fileTreeGenerator.js');
 var FileTreeContext = require('./context/FileTreeContext.js');
 var FileTreeListItemContentInput_styled = require('./FileTreeListItemContentInput.styled.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var FILENAME_MAX_LENGTH = 65535;
-var FILENAME_REGEXP_DOT = /^\.$/;
-var FILENAME_REGEXP_DOTDOT = /^\.\.$/;
-var FILENAME_REGEXP_DOT_ELICE = /^\.elice$/;
-var FILENAME_REGEXP_SLASH = /\//;
-var FILENAME_REGEXP_BACK_SLASH = /\\/;
-var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
-  var type = _ref.type,
-    initialValue = _ref.initialValue,
-    className = _ref.className,
-    style = _ref.style,
-    currentPath = _ref.currentPath,
-    currentDirTitleList = _ref.currentDirTitleList,
-    newInputType = _ref.newInputType;
-  var intl = reactIntl.useIntl();
-  var targetPath = fileTreeGenerator.getParentPath(currentPath);
-  var _useFileTreeDispatch = FileTreeContext.useFileTreeDispatch(),
-    dispatch = _useFileTreeDispatch.dispatch,
-    onFileAdd = _useFileTreeDispatch.onFileAdd,
-    onDirectoryAdd = _useFileTreeDispatch.onDirectoryAdd,
-    onActivePathChange = _useFileTreeDispatch.onActivePathChange,
-    onFileMove = _useFileTreeDispatch.onFileMove,
-    onDirectoryMove = _useFileTreeDispatch.onDirectoryMove;
-  var _useForm = reactHookForm.useForm({
-      defaultValues: {
-        filename: initialValue || ''
-      },
-      mode: 'onChange'
-    }),
-    control = _useForm.control,
-    handleSubmit = _useForm.handleSubmit,
-    reset = _useForm.reset,
-    getValues = _useForm.getValues;
-  var formElRef = React__default["default"].useRef(null);
-  var inputElRef = React__default["default"].useRef(null);
+const FILENAME_MAX_LENGTH = 65535;
+const FILENAME_REGEXP_DOT = /^\.$/;
+const FILENAME_REGEXP_DOTDOT = /^\.\.$/;
+const FILENAME_REGEXP_DOT_ELICE = /^\.elice$/;
+const FILENAME_REGEXP_SLASH = /\//;
+const FILENAME_REGEXP_BACK_SLASH = /\\/;
+const FileTreeListItemContentInput = ({
+  type,
+  initialValue,
+  className,
+  style,
+  currentPath,
+  currentDirTitleList,
+  newInputType
+}) => {
+  const intl = reactIntl.useIntl();
+  const targetPath = fileTreeGenerator.getParentPath(currentPath);
+  const {
+    dispatch,
+    onFileAdd,
+    onDirectoryAdd,
+    onActivePathChange,
+    onFileMove,
+    onDirectoryMove
+  } = FileTreeContext.useFileTreeDispatch();
+  const {
+    control,
+    handleSubmit,
+    reset,
+    getValues
+  } = reactHookForm.useForm({
+    defaultValues: {
+      filename: initialValue || ''
+    },
+    mode: 'onChange'
+  });
+  const formElRef = React.useRef(null);
+  const inputElRef = React.useRef(null);
   /**
    * Close current input.
    */
-  var close = function close() {
+  const close = () => {
     reset({
       filename: initialValue
     });
@@ -70,7 +69,7 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   /**
    * Validate input value.
    */
-  var validateFilename = function validateFilename(newFilename) {
+  const validateFilename = newFilename => {
     switch (true) {
       // has dot or dot-dot
       case FILENAME_REGEXP_DOT.test(newFilename) || FILENAME_REGEXP_DOTDOT.test(newFilename):
@@ -88,9 +87,7 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
           id: 'fileTree.list.item.content.input.validation.error.filename.slash'
         });
       // duplicated
-      case currentDirTitleList.some(function (title) {
-        return title === newFilename;
-      }):
+      case currentDirTitleList.some(title => title === newFilename):
         return intl.formatMessage({
           id: 'fileTree.list.item.content.input.validation.error.filename.duplicated'
         });
@@ -101,59 +98,55 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   /**
    * Add file.
    */
-  var addFile = function addFile(params) {
+  const addFile = params => {
     if (typeof onFileAdd !== 'function' || !params.emptyFileWithName) {
       close();
       return;
     }
-    onFileAdd(params).then(function () {
-      return onActivePathChange(params.path === '' ? "".concat(params.emptyFileWithName) : "".concat(params.path, "/").concat(params.emptyFileWithName), false);
-    }).then(close).catch(function () {
+    onFileAdd(params).then(() => onActivePathChange(params.path === '' ? `${params.emptyFileWithName}` : `${params.path}/${params.emptyFileWithName}`, false)).then(close).catch(() => {
       //
     });
   };
   /**
    * Add directory.
    */
-  var addDirectory = function addDirectory(params) {
+  const addDirectory = params => {
     if (typeof onDirectoryAdd !== 'function' || !params.name) {
       close();
       return;
     }
-    onDirectoryAdd(params).then(function () {
-      return onActivePathChange(params.path === '' ? "".concat(params.name) : "".concat(params.path, "/").concat(params.name), true);
-    }).then(close).catch(function () {
+    onDirectoryAdd(params).then(() => onActivePathChange(params.path === '' ? `${params.name}` : `${params.path}/${params.name}`, true)).then(close).catch(() => {
       //
     });
   };
   /**
    * Move file.
    */
-  var moveFile = function moveFile(params) {
+  const moveFile = params => {
     if (typeof onFileMove !== 'function' || params.newName === initialValue) {
       close();
       return;
     }
-    onFileMove(params).then(close).catch(function () {
+    onFileMove(params).then(close).catch(() => {
       //
     });
   };
   /**
    * Move directory.
    */
-  var moveDirectory = function moveDirectory(params) {
+  const moveDirectory = params => {
     if (typeof onDirectoryMove !== 'function' || params.newName === initialValue) {
       close();
       return;
     }
-    onDirectoryMove(params).then(close).catch(function () {
+    onDirectoryMove(params).then(close).catch(() => {
       //
     });
   };
   /**
    * Submit and rename file.
    */
-  var handleFormSubmit = handleSubmit(function (newData) {
+  const handleFormSubmit = handleSubmit(newData => {
     // if new input is empty, close it.
     if (!newData.filename) {
       close();
@@ -194,8 +187,8 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   /**
    * Handle click away.
    */
-  var handleFormClickAway = function handleFormClickAway() {
-    var newFilename = getValues('filename');
+  const handleFormClickAway = () => {
+    const newFilename = getValues('filename');
     if (newFilename) {
       void handleFormSubmit();
       return;
@@ -205,7 +198,7 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   /**
    * Handle keydown event.
    */
-  var handleKeyDown = function handleKeyDown(e) {
+  const handleKeyDown = e => {
     switch (e.key) {
       case 'Escape':
         close();
@@ -215,12 +208,12 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   //
   // Select value at input when initial value is set.
   //
-  React__default["default"].useEffect(function () {
+  React.useEffect(() => {
     var _a;
     if (!inputElRef.current || !initialValue) {
       return;
     }
-    var rangeEndExcludeExtension = initialValue.indexOf((_a = initialValue.split('.').pop()) !== null && _a !== void 0 ? _a : '') - 1;
+    const rangeEndExcludeExtension = initialValue.indexOf((_a = initialValue.split('.').pop()) !== null && _a !== void 0 ? _a : '') - 1;
     inputElRef.current.setSelectionRange(0, rangeEndExcludeExtension > 0 ? rangeEndExcludeExtension : initialValue.length);
   }, [initialValue]);
   //
@@ -230,10 +223,10 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   //
   //
   //
-  return React__default["default"].createElement(FileTreeListItemContentInput_styled.StyledInputForm, {
+  return React.createElement(FileTreeListItemContentInput_styled.StyledInputForm, {
     onSubmit: handleFormSubmit,
     ref: formElRef
-  }, React__default["default"].createElement(reactHookForm.Controller, {
+  }, React.createElement(reactHookForm.Controller, {
     control: control,
     name: "filename",
     rules: {
@@ -253,11 +246,12 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
       },
       validate: validateFilename
     },
-    render: function render(_ref2) {
-      var field = _ref2.field,
-        fieldState = _ref2.fieldState;
+    render: ({
+      field,
+      fieldState
+    }) => {
       var _a;
-      return React__default["default"].createElement(FileTreeListItemContentInput_styled.StyledInput, Object.assign({}, field, {
+      return React.createElement(FileTreeListItemContentInput_styled.StyledInput, Object.assign({}, field, {
         type: "text",
         className: className,
         size: "small",
@@ -266,9 +260,7 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
         invalidText: (_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message,
         autoFocus: true,
         style: style,
-        onChange: function onChange(e) {
-          return field.onChange(e.target.value.trim());
-        },
+        onChange: e => field.onChange(e.target.value.trim()),
         onKeyDown: handleKeyDown,
         ref: inputElRef
       }));
@@ -276,4 +268,4 @@ var FileTreeListItemContentInput = function FileTreeListItemContentInput(_ref) {
   }));
 };
 
-exports["default"] = FileTreeListItemContentInput;
+exports.default = FileTreeListItemContentInput;

package/cjs/components/shared/file-tree/FileTreeListItemContentInput.styled.js

@@ -1,23 +1,17 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var blocks = require('@elice/blocks');
 var designTokens = require('@elice/design-tokens');
 var styled = require('styled-components');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var INPUT_HEIGHT = '1.25rem';
-var INPUT_FONT_SIZE = '0.75rem';
-var INPUT_INNER_LEFT_PADDING = '0.125rem';
-var INPUT_INNER_RIGHT_PADDING = '0.25rem';
-var StyledInputForm = styled__default["default"].form.withConfig({
+const INPUT_HEIGHT = '1.25rem';
+const INPUT_FONT_SIZE = '0.75rem';
+const INPUT_INNER_LEFT_PADDING = '0.125rem';
+const INPUT_INNER_RIGHT_PADDING = '0.25rem';
+const StyledInputForm = styled.form.withConfig({
   componentId: "sc-1glq6yp-0"
 })(["flex:1;display:flex;"]);
-var StyledInput = styled__default["default"](blocks.Input).withConfig({
+const StyledInput = styled(blocks.Input).withConfig({
   componentId: "sc-1glq6yp-1"
 })(["min-height:", ";> div{background:transparent !important;> div{&:nth-child(1){padding:", ";}&:nth-child(3){padding:", ";}}.eb-icon{width:0.875em;height:0.875em;font-size:0.875em;}}& input{padding-top:0 !important;padding-bottom:0 !important;height:", " !important;color:", " !important;font-size:", " !important;}"], INPUT_HEIGHT, INPUT_INNER_LEFT_PADDING, INPUT_INNER_RIGHT_PADDING, INPUT_HEIGHT, designTokens.base.color.gray0, INPUT_FONT_SIZE);
 

package/cjs/components/shared/file-tree/FileTreeListItemContentMenu.js

@@ -2,38 +2,33 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
 var FileTreeContext = require('./context/FileTreeContext.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
-  var node = _ref.node,
-    anchorEl = _ref.anchorEl,
-    onClose = _ref.onClose;
-  var intl = reactIntl.useIntl();
-  var _useFileTreeState = FileTreeContext.useFileTreeState(),
-    allowToggleHidden = _useFileTreeState.allowToggleHidden,
-    allowToggleReadonly = _useFileTreeState.allowToggleReadonly;
-  var _useFileTreeDispatch = FileTreeContext.useFileTreeDispatch(),
-    dispatch = _useFileTreeDispatch.dispatch,
-    onHiddenSet = _useFileTreeDispatch.onHiddenSet,
-    onReadOnlySet = _useFileTreeDispatch.onReadOnlySet,
-    onFileDelete = _useFileTreeDispatch.onFileDelete,
-    onDirectoryDelete = _useFileTreeDispatch.onDirectoryDelete;
-  var _React$useState = React__default["default"].useState(false),
-    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
-    isDeleteDialogOpen = _React$useState2[0],
-    setDeleteDialogOpen = _React$useState2[1];
+const FileTreeListItemContentMenu = ({
+  node,
+  anchorEl,
+  onClose
+}) => {
+  const intl = reactIntl.useIntl();
+  const {
+    allowToggleHidden,
+    allowToggleReadonly
+  } = FileTreeContext.useFileTreeState();
+  const {
+    dispatch,
+    onHiddenSet,
+    onReadOnlySet,
+    onFileDelete,
+    onDirectoryDelete
+  } = FileTreeContext.useFileTreeDispatch();
+  const [isDeleteDialogOpen, setDeleteDialogOpen] = React.useState(false);
   /**
    * Set file readonly.
    */
-  var handleReadOnlySet = function handleReadOnlySet() {
+  const handleReadOnlySet = () => {
     if (typeof onReadOnlySet === 'function') {
       onReadOnlySet({
         path: node.path,
@@ -44,7 +39,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Unset file readonly.
    */
-  var handleReadOnlyUnset = function handleReadOnlyUnset() {
+  const handleReadOnlyUnset = () => {
     if (typeof onReadOnlySet === 'function') {
       onReadOnlySet({
         path: node.path,
@@ -55,7 +50,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Set file hidden.
    */
-  var handleHiddenSet = function handleHiddenSet() {
+  const handleHiddenSet = () => {
     if (typeof onHiddenSet === 'function') {
       onHiddenSet({
         path: node.path,
@@ -66,7 +61,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Unset file hidden.
    */
-  var handleHiddenUnset = function handleHiddenUnset() {
+  const handleHiddenUnset = () => {
     if (typeof onHiddenSet === 'function') {
       onHiddenSet({
         path: node.path,
@@ -77,7 +72,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Create a new file.
    */
-  var handleNewFile = function handleNewFile() {
+  const handleNewFile = () => {
     dispatch({
       type: 'NEW_INPUT_OPEN',
       newInput: {
@@ -89,7 +84,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Create a new directory.
    */
-  var handleNewDirectory = function handleNewDirectory() {
+  const handleNewDirectory = () => {
     dispatch({
       type: 'NEW_INPUT_OPEN',
       newInput: {
@@ -101,7 +96,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Rename file.
    */
-  var handleRename = function handleRename() {
+  const handleRename = () => {
     dispatch({
       type: 'UPDATE_RENAME_INPUT_PATH',
       path: node.path
@@ -110,7 +105,7 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Delete file.
    */
-  var handleDelete = function handleDelete() {
+  const handleDelete = () => {
     if (node.isDirectory && typeof onDirectoryDelete === 'function') {
       void onDirectoryDelete(node.path);
     }
@@ -121,110 +116,108 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Set file readonly.
    */
-  var renderMenuItemReadOnlySet = function renderMenuItemReadOnlySet() {
+  const renderMenuItemReadOnlySet = () => {
     if (!allowToggleReadonly || node.isDirectory || node.isReadonly || node.isHidden) {
       return null;
     }
-    return React__default["default"].createElement(blocks.List.Item, {
+    return React.createElement(blocks.List.Item, {
       onClick: handleReadOnlySet
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.readOnlySet"
     })));
   };
   /**
    * Unset file readonly.
    */
-  var renderMenuItemReadOnlyUnset = function renderMenuItemReadOnlyUnset() {
+  const renderMenuItemReadOnlyUnset = () => {
     if (!allowToggleReadonly || node.isDirectory || !node.isReadonly) {
       return null;
     }
-    return React__default["default"].createElement(blocks.List.Item, {
+    return React.createElement(blocks.List.Item, {
       onClick: handleReadOnlyUnset
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.readOnlyUnset"
     })));
   };
   /**
    * Set file hidden.
    */
-  var renderMenuItemHiddenSet = function renderMenuItemHiddenSet() {
+  const renderMenuItemHiddenSet = () => {
     if (!allowToggleHidden || node.isDirectory || node.isReadonly || node.isHidden) {
       return null;
     }
-    return React__default["default"].createElement(blocks.List.Item, {
+    return React.createElement(blocks.List.Item, {
       onClick: handleHiddenSet
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.hiddenSet"
     })));
   };
   /**
    * Unset file hidden.
    */
-  var renderMenuItemHiddenUnset = function renderMenuItemHiddenUnset() {
+  const renderMenuItemHiddenUnset = () => {
     if (!allowToggleHidden || node.isDirectory || !node.isHidden) {
       return null;
     }
-    return React__default["default"].createElement(blocks.List.Item, {
+    return React.createElement(blocks.List.Item, {
       onClick: handleHiddenUnset
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.hiddenUnset"
     })));
   };
   /**
    * New file.
    */
-  var renderMenuItemNewFile = function renderMenuItemNewFile() {
+  const renderMenuItemNewFile = () => {
     if (!node.isDirectory) {
       return null;
     }
-    return React__default["default"].createElement(blocks.List.Item, {
+    return React.createElement(blocks.List.Item, {
       onClick: handleNewFile
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.newFile"
     })));
   };
   /**
    * New directory.
    */
-  var renderMenuItemNewDirectory = function renderMenuItemNewDirectory() {
+  const renderMenuItemNewDirectory = () => {
     if (!node.isDirectory) {
       return null;
     }
-    return React__default["default"].createElement(blocks.List.Item, {
+    return React.createElement(blocks.List.Item, {
       onClick: handleNewDirectory
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.newDirectory"
     })));
   };
   /**
    * Rename file.
    */
-  var renderMenuItemRename = function renderMenuItemRename() {
-    return React__default["default"].createElement(blocks.List.Item, {
+  const renderMenuItemRename = () => {
+    return React.createElement(blocks.List.Item, {
       disabled: !node.isRemovable,
       onClick: handleRename
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.rename"
     })));
   };
   /**
    * Delete file.
    */
-  var renderMenuItemDelete = function renderMenuItemDelete() {
-    return React__default["default"].createElement(blocks.List.Item, {
+  const renderMenuItemDelete = () => {
+    return React.createElement(blocks.List.Item, {
       disabled: !node.isRemovable,
-      onClick: function onClick() {
-        return setDeleteDialogOpen(true);
-      }
-    }, React__default["default"].createElement(blocks.List.ItemText, null, React__default["default"].createElement(reactIntl.FormattedMessage, {
+      onClick: () => setDeleteDialogOpen(true)
+    }, React.createElement(blocks.List.ItemText, null, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.item.delete"
     })));
   };
   /**
    * Menu.
    */
-  var renderMenu = function renderMenu() {
-    return React__default["default"].createElement(blocks.Menu, {
+  const renderMenu = () => {
+    return React.createElement(blocks.Menu, {
       open: Boolean(anchorEl),
       anchorEl: anchorEl,
       size: "xsmall",
@@ -236,11 +229,11 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
   /**
    * Dialog for confirm delete.
    */
-  var renderDeleteConfirmDialog = function renderDeleteConfirmDialog() {
+  const renderDeleteConfirmDialog = () => {
     if (!isDeleteDialogOpen) {
       return null;
     }
-    return React__default["default"].createElement(blocks.Dialog, {
+    return React.createElement(blocks.Dialog, {
       type: "warning",
       title: intl.formatMessage({
         id: 'fileTree.list.item.content.menu.deleteConfirmDialog.title'
@@ -250,25 +243,21 @@ var FileTreeListItemContentMenu = function FileTreeListItemContentMenu(_ref) {
       }, {
         title: node.title
       }),
-      onHide: function onHide() {
-        return setDeleteDialogOpen(false);
-      }
-    }, React__default["default"].createElement(blocks.Dialog.CloseButton, {
-      onClick: function onClick() {
-        return setDeleteDialogOpen(false);
-      }
-    }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+      onHide: () => setDeleteDialogOpen(false)
+    }, React.createElement(blocks.Dialog.CloseButton, {
+      onClick: () => setDeleteDialogOpen(false)
+    }, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.deleteConfirmDialog.cancel"
-    })), React__default["default"].createElement(blocks.Dialog.ActionButton, {
+    })), React.createElement(blocks.Dialog.ActionButton, {
       onClick: handleDelete
-    }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(reactIntl.FormattedMessage, {
       id: "fileTree.list.item.content.menu.deleteConfirmDialog.confirm"
     })));
   };
   //
   //
   //
-  return React__default["default"].createElement(React__default["default"].Fragment, null, renderMenu(), renderDeleteConfirmDialog());
+  return React.createElement(React.Fragment, null, renderMenu(), renderDeleteConfirmDialog());
 };
 
-exports["default"] = FileTreeListItemContentMenu;
+exports.default = FileTreeListItemContentMenu;