@scaleflex/widget-provider-views 4.4.0 → 4.5.0

package/dist/style.min.css

@@ -0,0 +1 @@
+@charset "UTF-8";@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap");.filerobot-ProviderBrowser-layoutType--grid ul.filerobot-ProviderBrowser-list:after{content:"";flex:auto}.filerobot-ProviderBrowser-layoutType--grid ul.filerobot-ProviderBrowser-list:focus{outline:none}.filerobot-ProviderBrowser-layoutType--grid .filerobot-Provider-ItemCategory-header{align-items:center;cursor:pointer;display:flex;font-size:12px;font-weight:400;margin-top:12px;max-width:130px;padding:0 12px;width:100%}.filerobot-ProviderBrowser-layoutType--grid .filerobot-Provider-ItemCategory-wrapper{padding:8px 24px 12px}.filerobot-ProviderBrowser-layoutType--grid .filerobot-Provider-ItemCategory-wrapper-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));list-style:none;padding:0;width:100%}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem{margin:0;min-width:200px;position:relative}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:before{content:"";display:block;padding-top:88%}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--selected.item-folder .filerobot-ProviderBrowserItem-folderSelectBox,.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem.item-folder:hover .filerobot-ProviderBrowserItem-folderSelectBox{display:flex}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.filerobot-ProviderBrowserItem--beingRenamed):hover .filerobot-Explorer-dots-menu-icon{display:block}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.item-folder){border:4px solid transparent;outline:none}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.item-folder){background-color:#4d4e4e;border:4px solid #000}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.item-folder):focus *,[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.item-folder):hover *{color:#000}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.item-folder).no-selection .filerobot-ProviderBrowserItem-inner{cursor:auto}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem:not(.item-folder):not(.no-selection) .filerobot-ProviderBrowserItem-inner:hover{background-color:#eff3f6}.filerobot-ProviderBrowser-layoutType--grid .filerobot-ProviderBrowserItem-videoDuration{background:rgba(79,98,118,.7);border-radius:2px;bottom:33%;box-shadow:0 1px 2px 0 rgba(77,78,78,.15);color:#fff!important;font-size:11px;font-weight:500;left:16px;line-height:12px;padding:2px 4px;position:absolute;text-align:center;z-index:2}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--selected .filerobot-ProviderBrowserItem-inner{background-color:#5d6d7e!important}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--selected .filerobot-ProviderBrowserItem-inner *{fill:#fff;color:#fff}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--selected.with-meta input{color:#000!important;margin-bottom:-1px;margin-top:4px;text-align:center}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--selected.with-meta button.filerobot-ProviderBrowserItem-inner:focus{box-shadow:none!important}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--selected .filerobot-Explorer-Item-fileInfoAndButtons{background-color:inherit}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--noPreview .filerobot-ProviderBrowserItem-inner{background-color:hsla(0,0%,58%,.2)}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--noPreview .filerobot-ProviderBrowserItem-inner{background-color:hsla(0,0%,92%,.2)}.filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--noPreview svg{fill:rgba(0,0,0,.7);height:30%;width:30%}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--grid li.filerobot-ProviderBrowserItem--noPreview svg{fill:hsla(0,0%,100%,.8)}.filerobot-ProviderBrowser-layoutType--grid button.filerobot-ProviderBrowserItem-inner{background-color:#eff3f6;border-radius:2px;box-shadow:0 1px 2px 0 rgba(77,78,78,.15);height:100%;left:0;overflow:hidden;position:absolute;text-align:center;top:0;width:100%}.filerobot-ProviderBrowser-layoutType--grid button.filerobot-ProviderBrowserItem-inner:focus{outline:none}.filerobot-ProviderBrowser-layoutType--grid button.filerobot-ProviderBrowserItem-inner.with-meta{align-items:center;display:flex;flex-direction:column-reverse;justify-content:flex-end}.filerobot-ProviderBrowser-layoutType--grid button.filerobot-ProviderBrowserItem-inner.with-meta:focus{box-shadow:none}.filerobot-ProviderBrowser-layoutType--grid button.filerobot-ProviderBrowserItem-inner.with-meta img{height:100%;max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain;width:100%}.filerobot-ProviderBrowser-layoutType--grid .filerobot-ProviderBrowserItem-fakeCheckbox{display:none;left:8px;position:absolute;top:8px;z-index:3}.filerobot-ProviderBrowser-layoutType--grid .filerobot-ProviderBrowserItem-folderSelectBox{display:none;left:14px;position:absolute;top:26px}.filerobot-ProviderBrowserItem--selected .filerobot-ProviderBrowserItem-fakeCheckbox,:hover>.filerobot-ProviderBrowserItem-fakeCheckbox{display:block}.filerobot-Dragging-files>*,.filerobot-Dragging-folders>*{pointer-events:none}.filerobot-ProviderBrowser-layoutType--list,.filerobot-ProviderBrowser-layoutType--tiles{background-color:#fff}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--list,[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--tiles{background-color:#1f1f1f}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-cell,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-cell{cursor:pointer;flex:0.5 0;font-size:14px;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-cell-cursor-default,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-cell-cursor-default{cursor:default!important}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-cell-icon,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-cell-icon{max-width:24px;min-width:20px}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-firstColumn,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-firstColumn{align-items:center;display:flex;flex:1 0}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-firstColumn input,.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-firstColumn label,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-firstColumn input,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-firstColumn label{width:80%}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-list-firstColumn label,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-firstColumn label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowser-list,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowser-list{outline:none}.filerobot-ProviderBrowser-layoutType--list li.filerobot-ProviderBrowserItem,.filerobot-ProviderBrowser-layoutType--tiles li.filerobot-ProviderBrowserItem{align-items:center;border-bottom:1px solid rgba(0,0,0,.05);display:flex;margin:0;outline:none;padding:11px 12px}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--list li.filerobot-ProviderBrowserItem,[data-filerobot-theme=dark] .filerobot-ProviderBrowser-layoutType--tiles li.filerobot-ProviderBrowserItem{color:#eaeaea}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowser-body,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowser-body{overflow-x:auto;width:100%}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-ItemCategory-header,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-ItemCategory-header{align-items:center;background-color:#fff;border-bottom:1.5px solid rgba(0,0,0,.07);display:flex;font-size:14px;font-weight:400;line-height:16px;overflow:hidden;padding:12px;position:sticky;text-align:left;text-overflow:ellipsis;top:-1px;white-space:nowrap;z-index:11}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-ItemCategory-header:last-child,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-ItemCategory-header:last-child{margin-right:0}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-ItemCategory-header .filerobot-c-icon,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-ItemCategory-header .filerobot-c-icon{vertical-align:middle}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-ItemCategory-wrapper-list,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-ItemCategory-wrapper-list{padding:0}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem-fakeCheckbox,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem-fakeCheckbox{margin-right:8px;vertical-align:middle}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem-inner,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem-inner{align-items:center;display:flex;line-height:1.3;outline:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem-inner input,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem-inner input{height:17px}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem-inner img,.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem-inner svg,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem-inner img,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem-inner svg{max-height:20px;max-width:20px}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem{color:#4d4e4e}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem--selected,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem--selected{background:#5d6d7e;border-bottom:1px solid #dfe7ed!important;color:#fff}.filerobot-ProviderBrowser-layoutType--list .filerobot-ProviderBrowserItem--selected svg path,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-ProviderBrowserItem--selected svg path{fill:#dfe7ed}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-listHead-checkbox,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-listHead-checkbox{min-width:16px}.filerobot-ProviderBrowser-layoutType--list .filerobot-common-Checkbox{margin-right:8px}.filerobot-ProviderBrowser-layoutType--list .filerobot-Provider-ItemCategory-header .filerobot-Provider-list-cell-icon{display:flex;padding-left:2px}.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-ItemCategory-header{padding:11px 12px}.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-ItemCategory-header .filerobot-Provider-list-cell-icon{display:flex;margin-left:4px;padding-left:4px}.filerobot-ProviderBrowser-layoutType--tiles li.filerobot-ProviderBrowserItem{padding:11px 12px}.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-cell-icon{margin-right:8px;max-width:36px;min-width:36px}.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-cell-icon img,.filerobot-ProviderBrowser-layoutType--tiles .filerobot-Provider-list-cell-icon svg:not(.context-menu-icon){max-height:36px;max-width:36px;width:36px}.filerobot-Explorer-Details-header{align-items:center;display:flex;font-size:12px;margin-left:30px}.filerobot-Explorer-Details-header-icon{margin-left:6px}.filerobot-Explorer-Details-header-title{align-items:center;display:flex;margin-top:12px;max-width:90%}.filerobot-Explorer-Details-header-title label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filerobot-Explorer-Details-tabs{cursor:pointer;display:flex;font-size:12px;margin-top:8px;padding:0 8px}.filerobot-Explorer-Details-tabs-comments,.filerobot-Explorer-Details-tabs-details{align-items:center;border:1px solid transparent;border-top-left-radius:.1rem;border-top-right-radius:.1rem;color:#4d4e4e;display:flex;height:30px;justify-content:center;width:50%}.filerobot-Explorer-Details-tabs-comments label,.filerobot-Explorer-Details-tabs-details label{align-items:center;cursor:pointer;display:flex;height:100%;justify-content:center;width:100%}.filerobot-Explorer-Details-tabs-comments label:hover,.filerobot-Explorer-Details-tabs-details label:hover{background-color:#f8fafb;border-bottom:2px solid #6879eb;color:#6879eb;margin-bottom:-1px}.filerobot-Explorer-Details-tabs-comments>input[type=radio],.filerobot-Explorer-Details-tabs-details>input[type=radio]{left:-200vw;position:absolute}.filerobot-Explorer-Details-tabs-comments>input:checked+label,.filerobot-Explorer-Details-tabs-details>input:checked+label{background-color:#f8fafb;border-bottom:2px solid #6879eb;color:#6879eb;margin-bottom:-1px}.filerobot-Explorer-Details-icon-preview{display:flex;justify-content:center;margin-bottom:21px;margin-top:8px}.filerobot-Explorer-Details-file-preview{height:146px;margin:8px 5px 12px 8px;position:relative}.filerobot-Explorer-Details-file-preview:hover .filerobot-Explorer-Details-thumbnailZoomOverlay{display:flex}.filerobot-Explorer-Details-thumbnail{height:100%;max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain;position:relative;width:100%;z-index:1}.filerobot-Explorer-Details-info{font-size:12px;margin:12px 0 0;padding:0 0 0 12px}.filerobot-Explorer-Details-info-list{display:flex;list-style:none;margin-bottom:8px}.filerobot-Explorer-Details-info-list-name{color:#768184;display:flex;font-weight:400;padding-right:2px;width:68px}.filerobot-Explorer-Details-info-list-name>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filerobot-Explorer-Details-info-list-value{color:#4d4e4e;display:inline-block;font-weight:400;width:calc(100% - 68px)}.filerobot-Explorer-Details-section{border-top:1px solid #dfe7ed;font-size:12px;margin-left:12px;margin-right:12px;margin-top:8px;padding-top:12px}.filerobot-Explorer-Details-section-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:9px;padding-right:5px}.filerobot-Explorer-Details-section-header-title{color:#768184}.filerobot-Explorer-Details-section-content-list{display:inline-flex;flex-wrap:wrap;list-style:none;margin:0;padding:0;width:100%}.filerobot-Explorer-Details-section-content-list li{align-items:center;background:#f8fafb;border-radius:2px;color:#4d4e4e;display:flex;font-family:Roboto;font-weight:400;margin:0 5px 5px 0;padding:4px 6px;position:relative}.filerobot-Explorer-Details-thumbnailZoomOverlay{align-items:center;background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.5) 0,rgba(0,0,0,.25) 100%);display:none;height:100%;justify-content:center;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:111}.filerobot-Explorer-Details-thumbnailZoomOverlayButton{height:100%;width:100%}.filerobot-Explorer-Details-thumbnailZoomOverlayButton:hover{background:transparent!important}.filerobot-Explorer-Details-thumbnailZoomOverlayButton:active:before{opacity:.5!important}.filerobot-ProviderBrowser{background-color:#fff;display:flex;flex:1;flex-direction:column;font-size:14px;font-weight:400;height:100%;position:relative}.filerobot-ProviderBrowser-user{color:#333;font-weight:500;margin:0 8px 0 0}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-user{color:#eaeaea}.filerobot-ProviderBrowser-select{color:#000;cursor:pointer;line-height:1.5}.filerobot-ProviderBrowser-select.--filter{max-width:120px;overflow:hidden;padding-right:2px;text-overflow:ellipsis;white-space:nowrap}.filerobot-ProviderBrowser-select:focus{border-color:transparent;outline:none}.filerobot-ProviderBrowser-user:after{color:#939393;content:"·";font-weight:400;left:4px;position:relative}.filerobot-ProviderBrowser-headerBar{align-items:center;color:#757575;display:flex;font-size:12px;line-height:1.4;padding:12px;position:relative;width:100%}.filerobot-size--md .filerobot-ProviderBrowser-headerBar{align-items:center;display:flex;justify-content:space-between}.filerobot-size--height-md .filerobot-ProviderBrowser-headerBar{align-items:center;display:flex}[data-filerobot-theme=dark] .filerobot-ProviderBrowser-headerBar{background-color:#1f1f1f;border-bottom:1px solid #333}.filerobot-ProviderBrowser-headerBar--simple{display:block;justify-content:center;text-align:center}.filerobot-ProviderBrowser-body{display:flex;flex:1;height:100%;position:relative;z-index:1000}.filerobot-ProviderBrowser-body-list{overflow-x:auto;width:100%}.item-folder.filerobot-ProviderBrowserItem{border-radius:7px;outline:none;padding:4px}.item-folder.filerobot-ProviderBrowserItem:before{content:unset!important;display:none!important;padding-top:0!important}.item-folder.filerobot-ProviderBrowserItem .filerobot-ProviderBrowserItem-inner-folder{align-items:center;border:1px solid #dfe7ed;border-radius:2px;box-sizing:border-box;display:flex;height:36px;outline:none;padding:10px 12px;width:100%}.item-folder.filerobot-ProviderBrowserItem .filerobot-ProviderBrowserItem-inner-folder .filerobot-ProviderBrowserItem-folderLiIcon>*{height:20px;width:20px}.item-folder.filerobot-ProviderBrowserItem .filerobot-ProviderBrowserItem-inner-folder input{width:96%}.item-folder.filerobot-ProviderBrowserItem .filerobot-ProviderBrowserItem-inner-folder .filerobot-Explorer-dots-menu-icon{display:none}.item-folder.filerobot-ProviderBrowserItem .filerobot-ProviderBrowserItem-inner-folder-title{color:#4d4e4e;flex-grow:1;font-size:14px;font-weight:500;line-height:16px;margin-left:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-folder.filerobot-ProviderBrowserItem button.filerobot-ProviderBrowserItem-inner-folder:hover{background-color:#eff3f6}.item-folder.filerobot-ProviderBrowserItem--selected button.filerobot-ProviderBrowserItem-inner-folder{background-color:#5d6d7e!important;outline:none}.item-folder.filerobot-ProviderBrowserItem--selected button.filerobot-ProviderBrowserItem-inner-folder input{color:#000;width:96%}.item-folder.filerobot-ProviderBrowserItem--selected button.filerobot-ProviderBrowserItem-inner-folder *{fill:#dfe7ed;color:#fff}.filerobot-ProviderBrowserItem-inner{cursor:pointer;font-size:14px;font-weight:400;line-height:16px}.filerobot-Provider-list-cell-header-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filerobot-Provider-list-cell-header-hidableIcon{visibility:hidden}.filerobot-Provider-list-cell-wrapper{align-items:center;display:flex;font-size:12px}.filerobot-Provider-list-cell-wrapper:hover .filerobot-Provider-list-cell-header-hidableIcon{visibility:visible}.filerobot-ProviderBrowser-mainContent{flex-grow:1;overflow:hidden;overflow-x:auto;-webkit-overflow-scrolling:touch;position:relative}.filerobot-ProviderBrowserItem--draggable-block{background:#dfe7ed;cursor:col-resize;height:100%;position:sticky;top:0;width:1px;z-index:100}.filerobot-ProviderBrowserItem-SideNav-addNew{color:#5d6d7e;cursor:pointer;font-weight:500}.filerobot-ProviderBrowser-body-sideButtons{max-width:40px;min-width:40px}.filerobot-ProviderBrowser-body-leftSideButtons{margin-right:20px}.filerobot-ProviderBrowser-body-leftNavigationButton{background:#f8fafb;border-radius:0 50px 50px 0;box-shadow:0 1px 4px rgba(77,78,78,.15);margin-top:10px;padding:10px 14px 10px 10px;position:sticky;top:91px;width:100%}.filerobot-ProviderBrowser-body-rightSideButtons{margin-left:20px}.filerobot-ProviderBrowser-body-rightNavigationButton{background:#f8fafb;border-radius:50px 0 0 50px;box-shadow:0 1px 4px rgba(77,78,78,.15);margin-top:10px;padding:10px 10px 10px 14px;position:sticky;top:91px;width:100%}.filerobot-Provider-LabelsListLi-selectMode,.filerobot-Provider-LabelsListLi-selectMode *{cursor:pointer}.filerobot-ProviderBrowserItem-ItemHoverBottomOptions{bottom:4%;right:3%;top:auto}.filerobot-ProviderBrowserItem-ItemHoverBottomOptions-selected{display:flex;visibility:visible}.filerobot-ProviderBrowserItem-ItemHoverBottomOptions-selected button{background:#fff}.filerobot-ProviderBrowserItem-ItemHoverBottomOptions-selected button:not(:active) svg *{color:#6879eb;fill:#6879eb}.filerobot-ProviderBrowserItem-ItemHoverBottomOptions-selected button:not(:active):hover{background:#eff3f6}.filerobot-ProviderBrowserItem-ItemHoverBottomOptions-selected button:not(:active):hover svg *{fill:#606fd1;color:#606fd1}

package/lib/components/AuthView.js

@@ -0,0 +1,35 @@
+import { Button } from '@scaleflex/ui/core';
+import Styled from './AuthView.styled';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var AuthView = function AuthView(_ref) {
+  var pluginName = _ref.pluginName,
+    pluginIcon = _ref.pluginIcon,
+    handleAuth = _ref.handleAuth,
+    i18n = _ref.i18n,
+    i18nArray = _ref.i18nArray;
+  var pluginNameComponent = /*#__PURE__*/_jsx(Styled.PluginName, {
+    className: "filerobot-Provider-authTitleName",
+    children: pluginName
+  }, pluginName);
+  return /*#__PURE__*/_jsxs(Styled.Wrapper, {
+    className: "filerobot-c-auth",
+    children: [/*#__PURE__*/_jsx(Styled.IconWrapper, {
+      className: "filerobot-Provider-authIcon",
+      children: pluginIcon()
+    }), /*#__PURE__*/_jsx(Styled.Title, {
+      className: "filerobot-Provider-authTitle",
+      children: i18nArray('authViewAuthenticateText', {
+        pluginName: pluginNameComponent
+      })
+    }), /*#__PURE__*/_jsx(Button, {
+      classes: "filerobot-Provider-authBtn",
+      color: "primary",
+      size: "lg",
+      onClick: handleAuth,
+      children: i18n('authViewConnectToButton', {
+        pluginName: pluginName
+      })
+    })]
+  });
+};
+export default AuthView;

package/lib/components/AuthView.styled.js

@@ -0,0 +1,21 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
+import { FV, PC } from '@scaleflex/widget-common';
+import styled from 'styled-components';
+var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n"])));
+var IconWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-bottom: 16px;\n\n  svg {\n    width: 80px;\n    height: 80px;\n  }\n"])));
+var Title = styled.p(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  margin: 0;\n  margin-bottom: 24px;\n  color: ", ";\n  ", ";\n"])), function (_ref) {
+  var palette = _ref.theme.palette;
+  return palette[PC.TextPrimary];
+}, function (_ref2) {
+  var typography = _ref2.theme.typography;
+  return typography.font[FV.LabelLargeUp];
+});
+var PluginName = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\n"])));
+var Styled = {
+  Wrapper: Wrapper,
+  IconWrapper: IconWrapper,
+  Title: Title,
+  PluginName: PluginName
+};
+export default Styled;

package/lib/components/Browser.js

@@ -0,0 +1,58 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["folders", "files", "totalFilesCount", "filerobot", "currentSelection", "disableSelectionActions", "showBar", "showFileList", "containerWidth"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import classNames from 'classnames';
+// import Modal from '@scaleflex/widget-explorer/lib/components/Modals'
+
+import { BrowserContext } from '../context';
+import Items from './Items';
+import { jsx as _jsx } from "react/jsx-runtime";
+var Browser = function Browser(_ref) {
+  var _filerobot$opts;
+  var folders = _ref.folders,
+    files = _ref.files,
+    totalFilesCount = _ref.totalFilesCount,
+    filerobot = _ref.filerobot,
+    currentSelection = _ref.currentSelection,
+    disableSelectionActions = _ref.disableSelectionActions,
+    showBar = _ref.showBar,
+    showFileList = _ref.showFileList,
+    containerWidth = _ref.containerWidth,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var browserProps = _objectSpread({
+    columns: [{
+      name: 'Name',
+      key: 'title'
+    }],
+    container: filerobot === null || filerobot === void 0 ? void 0 : (_filerobot$opts = filerobot.opts) === null || _filerobot$opts === void 0 ? void 0 : _filerobot$opts.container,
+    folders: folders,
+    files: files,
+    totalFilesCount: totalFilesCount,
+    activeRow: props.isActiveRow,
+    handleFolderClick: props.getNextFolder,
+    handleDeepLevelFolders: props.getDeepLevelFolders,
+    onHandleScroll: props.handleScroll,
+    handleViewReset: props.viewReset,
+    onHandleItemRenaming: props.handleItemRenaming,
+    showBar: showBar,
+    showFileList: showFileList,
+    containerWidth: containerWidth,
+    currentSelection: currentSelection,
+    disableSelectionActions: disableSelectionActions,
+    filerobot: filerobot
+  }, props);
+  return /*#__PURE__*/_jsx(BrowserContext.Provider, {
+    value: browserProps,
+    children: /*#__PURE__*/_jsx("div", {
+      className: classNames('filerobot-ProviderBrowser', "filerobot-ProviderBrowser-layoutType--".concat(props.layoutType)),
+      children: /*#__PURE__*/_jsx(Items, {})
+    })
+  });
+};
+export default Browser;

package/lib/components/FolderImportProgress/FolderImportProgress.styled.js

@@ -0,0 +1,50 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
+function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
+import styled, { keyframes } from 'styled-components';
+import { PC, FV } from '@scaleflex/widget-common';
+import { Button } from '@scaleflex/ui/core';
+var dotsLoaderAnimation = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% {\n    color: #6879eb;\n    box-shadow: 10px 0 #d1d5db, -10px 0 #6879eb;\n    opacity: 1;\n  }\n  50% {\n    color: #d1d5db;\n    box-shadow: 10px 0 #6879eb, -10px 0 #d1d5db;\n    opacity: 0.6;\n  }\n  100% {\n    color: #d1d5db;\n    box-shadow: 10px 0 #d1d5db, -10px 0 #6879eb;\n    opacity: 0.2;\n  }\n"])));
+var ProgressOverlay = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  position: absolute;\n  top: 48px; // height of the header\n  bottom: 0;\n  left: 0;\n  right: 0;\n  z-index: 1200;\n  background: rgba(255, 255, 255, 0.75);\n  backdrop-filter: blur(2px);\n"])));
+var ProgressWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  margin: auto;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  position: sticky;\n  box-sizing: border-box;\n"])));
+var ProgressContent = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 20px;\n  padding: 32px;\n  background: ", ";\n  border-radius: 12px;\n  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n  min-width: 300px;\n  text-align: center;\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.palette[PC.BackgroundSecondary];
+});
+var ProgressLabel = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", ";\n  color: ", ";\n  margin-bottom: 8px;\n"])), function (_ref2) {
+  var typography = _ref2.theme.typography;
+  return typography.font[FV.LabelLarge];
+}, function (_ref3) {
+  var theme = _ref3.theme;
+  return theme.palette[PC.TextPrimary];
+});
+var ProgressStats = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  gap: 32px;\n  align-items: center;\n"])));
+var StatItem = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n"])));
+var StatNumber = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  ", ";\n  color: ", ";\n  font-weight: 600;\n"])), function (_ref4) {
+  var typography = _ref4.theme.typography;
+  return typography.font[FV.HeadingLarge];
+}, function (_ref5) {
+  var theme = _ref5.theme;
+  return theme.palette[PC.AccentStatePrimary];
+});
+var StatLabel = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  ", ";\n  color: ", ";\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n"])), function (_ref6) {
+  var typography = _ref6.theme.typography;
+  return typography.font[FV.LabelSmall];
+}, function (_ref7) {
+  var theme = _ref7.theme;
+  return theme.palette[PC.TextSecondary];
+});
+var DotsLoader = styled.span(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: #6879eb;\n  display: flex;\n  box-sizing: border-box;\n  animation: ", " 1.5s linear infinite;\n"])), dotsLoaderAnimation);
+var CancelButton = styled(Button)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  margin-top: 12px;\n"])));
+var Styled = {
+  ProgressOverlay: ProgressOverlay,
+  ProgressWrapper: ProgressWrapper,
+  ProgressContent: ProgressContent,
+  ProgressLabel: ProgressLabel,
+  ProgressStats: ProgressStats,
+  StatItem: StatItem,
+  StatNumber: StatNumber,
+  StatLabel: StatLabel,
+  DotsLoader: DotsLoader,
+  CancelButton: CancelButton
+};
+export default Styled;

package/lib/components/FolderImportProgress/index.js

@@ -0,0 +1,50 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["foldersCount", "filesCount", "message", "i18n", "cancel"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import Styled from './FolderImportProgress.styled';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var FolderImportProgress = function FolderImportProgress(_ref) {
+  var _ref$foldersCount = _ref.foldersCount,
+    foldersCount = _ref$foldersCount === void 0 ? 0 : _ref$foldersCount,
+    _ref$filesCount = _ref.filesCount,
+    filesCount = _ref$filesCount === void 0 ? 0 : _ref$filesCount,
+    message = _ref.message,
+    i18n = _ref.i18n,
+    cancel = _ref.cancel,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_jsx(Styled.ProgressOverlay, _objectSpread(_objectSpread({}, props), {}, {
+    children: /*#__PURE__*/_jsx(Styled.ProgressWrapper, {
+      children: /*#__PURE__*/_jsxs(Styled.ProgressContent, {
+        children: [/*#__PURE__*/_jsx(Styled.ProgressLabel, {
+          children: message
+        }), /*#__PURE__*/_jsxs(Styled.ProgressStats, {
+          children: [/*#__PURE__*/_jsxs(Styled.StatItem, {
+            children: [/*#__PURE__*/_jsx(Styled.StatNumber, {
+              children: foldersCount
+            }), /*#__PURE__*/_jsx(Styled.StatLabel, {
+              children: i18n('remoteUploadFolderImportProgressFoldersLabel')
+            })]
+          }), /*#__PURE__*/_jsxs(Styled.StatItem, {
+            children: [/*#__PURE__*/_jsx(Styled.StatNumber, {
+              children: filesCount
+            }), /*#__PURE__*/_jsx(Styled.StatLabel, {
+              children: i18n('remoteUploadFolderImportProgressFilesLabel')
+            })]
+          })]
+        }), /*#__PURE__*/_jsx(Styled.DotsLoader, {}), /*#__PURE__*/_jsx(Styled.CancelButton, {
+          onClick: cancel,
+          color: "basic",
+          size: "md",
+          children: i18n('remoteUploadFolderImportProgressCancelButton')
+        })]
+      })
+    })
+  }));
+};
+export default FolderImportProgress;

package/lib/components/Items/AssetsSection/AssetsSectionTableHeader.js

@@ -0,0 +1,41 @@
+import { LIST_VIEW_COLS_OBJECTS, LIST_VIEW_COLS_IDS } from '@scaleflex/widget-utils/lib/constants';
+import { useBrowserContext } from '../../../hooks/useBrowserContext';
+import Styled from '../Items.styled';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+var checkboxOnChange = function checkboxOnChange() {};
+var AssetsSectionTableHeader = function AssetsSectionTableHeader(_ref) {
+  var columnId = _ref.columnId;
+  var i18n = useBrowserContext(function (_ref2) {
+    var i18n = _ref2.i18n;
+    return i18n;
+  });
+  var toggleAllFilesSelection = useBrowserContext(function (_ref3) {
+    var toggleAllFilesSelection = _ref3.toggleAllFilesSelection;
+    return toggleAllFilesSelection;
+  });
+  var isAllFilesSelected = useBrowserContext(function (_ref4) {
+    var isAllFilesSelected = _ref4.isAllFilesSelected;
+    return isAllFilesSelected;
+  });
+  var col = LIST_VIEW_COLS_OBJECTS[columnId];
+  var colTitle = i18n(col.i18nStr);
+  return /*#__PURE__*/_jsxs(Styled.InnerHeaderTableCell, {
+    children: [columnId === LIST_VIEW_COLS_IDS.NAME && /*#__PURE__*/_jsx(_Fragment, {
+      children: /*#__PURE__*/_jsx(Styled.CheckBox, {
+        // TODO: fix
+        // we use onClick instead of onChange as onChange causes multiple rerenders
+        // we add onChnage as emty function to avoid type warning
+        onClick: toggleAllFilesSelection,
+        onChange: checkboxOnChange,
+        checked: isAllFilesSelected,
+        size: "md"
+      })
+    }), /*#__PURE__*/_jsx(Styled.SortLabel, {
+      name: columnId,
+      color: "link-secondary",
+      size: "sm",
+      children: colTitle
+    })]
+  }, columnId);
+};
+export default AssetsSectionTableHeader;

package/lib/components/Items/AssetsSection/AssetsSectionTableRow.js

@@ -0,0 +1,147 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+import { useState } from 'react';
+import { LAYOUTS_IDS, NEGLECTED_MIME_TYPES } from '@scaleflex/widget-utils/lib/constants';
+import FileInfo from '@scaleflex/widget-explorer/lib/components/FileItem/FileInfo';
+import _getItemIcon from '@scaleflex/widget-utils/lib/getItemIcon';
+import humanReadableDateWithTranslations from '@scaleflex/widget-utils/lib/humanReadableDateWithTranslations';
+import getFileExtension from '@scaleflex/widget-utils/lib/getFileExtension';
+import getFileType from '@scaleflex/widget-utils/lib/getFileType';
+import AssetPreview from '@scaleflex/widget-common/lib/AssetPreview';
+import isTransparencySupported from '@scaleflex/widget-utils/lib/isTransparencySupported';
+import { useBrowserContext } from '../../../hooks/useBrowserContext';
+import Styled from '../Items.styled';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var checkboxOnChange = function checkboxOnChange() {};
+var COL_EMPTY_PLACEHOLDER = '';
+var AssetsSectionTableRow = function AssetsSectionTableRow(_ref) {
+  var file = _ref.file,
+    handleNavigatingThroughArrows = _ref.handleNavigatingThroughArrows,
+    toggleCheckbox = _ref.toggleCheckbox;
+  var i18n = useBrowserContext(function (_ref2) {
+    var i18n = _ref2.i18n;
+    return i18n;
+  });
+  var isChecked = useBrowserContext(function (_ref3) {
+    var isChecked = _ref3.isChecked;
+    return isChecked;
+  });
+  var showMeta = useBrowserContext(function (_ref4) {
+    var showMeta = _ref4.showMeta;
+    return showMeta;
+  });
+  var is3rdPartyData = useBrowserContext(function (_ref5) {
+    var is3rdPartyData = _ref5.is3rdPartyData;
+    return is3rdPartyData;
+  });
+  var layoutType = useBrowserContext(function (_ref6) {
+    var layoutType = _ref6.layoutType;
+    return layoutType;
+  });
+  var loading = useBrowserContext(function (_ref7) {
+    var loading = _ref7.loading;
+    return loading;
+  });
+  var isDevEnv = useBrowserContext(function (_ref8) {
+    var isDevEnv = _ref8.isDevEnv;
+    return isDevEnv;
+  });
+  var showFileList = useBrowserContext(function (_ref9) {
+    var showFileList = _ref9.showFileList;
+    return showFileList;
+  });
+  var container = useBrowserContext(function (_ref10) {
+    var container = _ref10.container;
+    return container;
+  });
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    showVideoGif = _useState2[0],
+    setShowVideoGif = _useState2[1];
+  var id = file.uuid;
+  var isNegelectedMimeType = NEGLECTED_MIME_TYPES.includes(getFileType(file));
+  var extension = getFileExtension(file, i18n('mutualizedUnknownText'), isNegelectedMimeType);
+  var lastModify = file.modified_at || file.updated_at || file.modifiedDate;
+  var lastModifyTime = lastModify ? humanReadableDateWithTranslations(lastModify, i18n) : COL_EMPTY_PLACEHOLDER;
+  var isFileChecked = isChecked(file);
+  var isImageTransparencySupported = isTransparencySupported(file);
+  var handleSelect = function handleSelect(e, isMultiple) {
+    toggleCheckbox(e, file, isMultiple, false);
+  };
+  return /*#__PURE__*/_jsxs(Styled.TableRow, {
+    hover: true,
+    selected: isFileChecked,
+    onClick: handleSelect,
+    onDoubleClick: function onDoubleClick() {},
+    onKeyDown: handleNavigatingThroughArrows,
+    "data-filerobot-focusable-id": id,
+    tabIndex: "-1",
+    onMouseOver: function onMouseOver() {
+      return setShowVideoGif(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setShowVideoGif(false);
+    },
+    children: [/*#__PURE__*/_jsx(Styled.HeaderTableCell, {
+      component: "th",
+      selected: isFileChecked,
+      children: /*#__PURE__*/_jsxs(Styled.HeaderCheckboxWrapper, {
+        children: [/*#__PURE__*/_jsx(Styled.CheckBox, {
+          // TODO: fix
+          // we use onClick instead of onChange as onChange causes multiple rerenders
+          // we add onChnage as emty function to avoid type warning
+          onClick: function onClick(e) {
+            return handleSelect(e, true);
+          },
+          onChange: checkboxOnChange,
+          checked: isFileChecked,
+          size: "md"
+        }), /*#__PURE__*/_jsx(Styled.AssetPreviewWrapper, {
+          children: /*#__PURE__*/_jsx(AssetPreview, {
+            file: file,
+            getItemIcon: function getItemIcon() {
+              return (file === null || file === void 0 ? void 0 : file.thumbnail) || _getItemIcon({
+                fileOrFolder: file,
+                layoutType: LAYOUTS_IDS.LIST,
+                showVideoGif: showVideoGif,
+                isImageTransparencySupported: isImageTransparencySupported
+              });
+            },
+            filePreviewToggle: function filePreviewToggle() {},
+            layoutType: layoutType,
+            noImgTransformations: is3rdPartyData,
+            isDevEnv: isDevEnv,
+            container: container,
+            containerHeight: "100%"
+          })
+        }), !loading && /*#__PURE__*/_jsx(FileInfo, {
+          file: file,
+          showMeta: showMeta,
+          handleContextMenuToggle: function handleContextMenuToggle() {},
+          noTruncate: true,
+          isListView: true
+        })]
+      })
+    }), /*#__PURE__*/_jsx(Styled.TableCell, {
+      children: /*#__PURE__*/_jsx(Styled.FileExtension, {
+        children: /*#__PURE__*/_jsx(Styled.Label, {
+          defaultCursor: Boolean(showFileList),
+          className: "filerobot-Explorer-Item-statusSize-text",
+          title: extension,
+          $ellipsis: true,
+          children: extension
+        })
+      })
+    }), /*#__PURE__*/_jsx(Styled.TableCell, {
+      children: /*#__PURE__*/_jsx(Styled.ModifyAtLabel, {
+        title: lastModifyTime,
+        children: lastModifyTime
+      })
+    })]
+  });
+};
+export default AssetsSectionTableRow;

package/lib/components/Items/AssetsSection/index.js

@@ -0,0 +1,65 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { Fragment } from 'react';
+import { Table, TableBody, TableRow } from '@scaleflex/ui/core';
+import { VirtualList } from '@scaleflex/widget-common';
+import { LIST_VIEW_COLS_IDS } from '@scaleflex/widget-utils/lib/constants';
+import { useBrowserContext } from '../../../hooks/useBrowserContext';
+import AssetsSectionTableRow from './AssetsSectionTableRow';
+import AssetsSectionTableHeader from './AssetsSectionTableHeader';
+import Styled from '../Items.styled';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+var renderTableRowSpacer = function renderTableRowSpacer(props) {
+  return /*#__PURE__*/_jsx("tr", _objectSpread({}, props));
+};
+var AssetsSection = function AssetsSection(_ref) {
+  var files = _ref.files,
+    handleNavigatingThroughArrows = _ref.handleNavigatingThroughArrows,
+    toggleCheckbox = _ref.toggleCheckbox;
+  var selectedListViewCols = useBrowserContext(function (_ref2) {
+    var selectedListViewCols = _ref2.selectedListViewCols;
+    return selectedListViewCols;
+  });
+  var filteredListViewCols = function filteredListViewCols() {
+    return selectedListViewCols.filter(function (item) {
+      return item === LIST_VIEW_COLS_IDS.TYPE || item === LIST_VIEW_COLS_IDS.LAST_MODIFY;
+    });
+  };
+  var listViewCols = [LIST_VIEW_COLS_IDS.NAME].concat(_toConsumableArray(filteredListViewCols()));
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsxs(Table, {
+      children: [/*#__PURE__*/_jsx(Styled.TableHead, {
+        children: /*#__PURE__*/_jsx(TableRow, {
+          children: listViewCols.map(function (columnId, index) {
+            return /*#__PURE__*/_jsx(Fragment, {
+              children: /*#__PURE__*/_jsx(AssetsSectionTableHeader, {
+                columnId: columnId
+              })
+            }, columnId);
+          })
+        })
+      }), /*#__PURE__*/_jsx(TableBody, {
+        children: /*#__PURE__*/_jsx(VirtualList, {
+          items: files,
+          injectedItemPropName: "file",
+          renderSpacer: renderTableRowSpacer,
+          children: /*#__PURE__*/_jsx(AssetsSectionTableRow, {
+            handleNavigatingThroughArrows: handleNavigatingThroughArrows,
+            toggleCheckbox: toggleCheckbox
+          })
+        })
+      })]
+    })
+  });
+};
+export default AssetsSection;

package/lib/components/Items/FoldersSection/FoldersSectionTableHeader.js

@@ -0,0 +1,41 @@
+import { LIST_VIEW_FOLDERS_COLS_OBJECTS, LIST_VIEW_FOLDERS_COLS_IDS } from '@scaleflex/widget-utils/lib/constants';
+import { useBrowserContext } from '../../../hooks/useBrowserContext';
+import Styled from '../Items.styled';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+var checkboxOnChange = function checkboxOnChange() {};
+var FoldersSectionTableHeader = function FoldersSectionTableHeader(_ref) {
+  var columnId = _ref.columnId;
+  var i18n = useBrowserContext(function (_ref2) {
+    var i18n = _ref2.i18n;
+    return i18n;
+  });
+  var toggleAllFoldersSelection = useBrowserContext(function (_ref3) {
+    var toggleAllFoldersSelection = _ref3.toggleAllFoldersSelection;
+    return toggleAllFoldersSelection;
+  });
+  var isAllFoldersSelected = useBrowserContext(function (_ref4) {
+    var isAllFoldersSelected = _ref4.isAllFoldersSelected;
+    return isAllFoldersSelected;
+  });
+  var col = LIST_VIEW_FOLDERS_COLS_OBJECTS[columnId];
+  var colTitle = i18n(col.i18nStr);
+  return /*#__PURE__*/_jsxs(Styled.InnerHeaderTableCell, {
+    children: [columnId === LIST_VIEW_FOLDERS_COLS_IDS.NAME && /*#__PURE__*/_jsx(_Fragment, {
+      children: /*#__PURE__*/_jsx(Styled.CheckBox, {
+        // TODO: fix
+        // we use onClick instead of onChange as onChange causes multiple rerenders
+        // we add onChnage as emty function to avoid type warning
+        onClick: toggleAllFoldersSelection,
+        onChange: checkboxOnChange,
+        checked: isAllFoldersSelected,
+        size: "md"
+      })
+    }), /*#__PURE__*/_jsx(Styled.SortLabel, {
+      name: columnId,
+      color: "link-secondary",
+      size: "sm",
+      children: colTitle
+    })]
+  }, columnId);
+};
+export default FoldersSectionTableHeader;