@strapi/content-manager 0.0.0-experimental.62ce06180fe9a772eaeb3d43d238b26644f39f7c → 0.0.0-experimental.6340da17068c3bed7fb006e7bcc554c71129e282

package/LICENSE

@@ -2,7 +2,21 @@ Copyright (c) 2015-present Strapi Solutions SAS
 
 Portions of the Strapi software are licensed as follows:
 
-* All software that resides under an "ee/" directory (the “EE Software”), if that directory exists, is licensed under the license defined in "ee/LICENSE".
+* All software that resides under an "ee/" directory (the “EE Software”), if that directory exists, is licensed under the license defined below.
+
+Enterprise License
+
+If you or the company you represent has entered into a written agreement referencing the Enterprise Edition of the Strapi source code available at
+https://github.com/strapi/strapi, then such agreement applies to your use of the Enterprise Edition of the Strapi Software. If you or the company you
+represent is using the Enterprise Edition of the Strapi Software in connection with a subscription to our cloud offering, then the agreement you have
+agreed to with respect to our cloud offering and the licenses included in such agreement apply to your use of the Enterprise Edition of the Strapi Software.
+Otherwise, the Strapi Enterprise Software License Agreement (found here https://strapi.io/enterprise-terms) applies to your use of the Enterprise Edition of the Strapi Software.
+
+BY ACCESSING OR USING THE ENTERPRISE EDITION OF THE STRAPI SOFTWARE, YOU ARE AGREEING TO BE BOUND BY THE RELEVANT REFERENCED AGREEMENT.
+IF YOU ARE NOT AUTHORIZED TO ACCEPT THESE TERMS ON BEHALF OF THE COMPANY YOU REPRESENT OR IF YOU DO NOT AGREE TO ALL OF THE RELEVANT TERMS AND CONDITIONS REFERENCED AND YOU
+HAVE NOT OTHERWISE EXECUTED A WRITTEN AGREEMENT WITH STRAPI, YOU ARE NOT AUTHORIZED TO ACCESS OR USE OR ALLOW ANY USER TO ACCESS OR USE ANY PART OF
+THE ENTERPRISE EDITION OF THE STRAPI SOFTWARE.  YOUR ACCESS RIGHTS ARE CONDITIONAL ON YOUR CONSENT TO THE RELEVANT REFERENCED TERMS TO THE EXCLUSION OF ALL OTHER TERMS;
+IF THE RELEVANT REFERENCED TERMS ARE CONSIDERED AN OFFER BY YOU, ACCEPTANCE IS EXPRESSLY LIMITED TO THE RELEVANT REFERENCED TERMS.
 
 * All software outside of the above-mentioned directories or restrictions above is available under the "MIT Expat" license as set forth below.
 
@@ -18,5 +32,6 @@ furnished to do so, subject to the following conditions:
 The above copyright notice and this permission notice shall be included in all
 copies or substantial portions of the Software.
 
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/dist/admin/components/ActionsDrawer.js

@@ -0,0 +1,209 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var strapiAdmin = require('@strapi/admin/strapi-admin');
+var designSystem = require('@strapi/design-system');
+var Icons = require('@strapi/icons');
+var reactIntl = require('react-intl');
+var styledComponents = require('styled-components');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const [ActionsDrawerProvider, useActionsDrawer] = strapiAdmin.createContext('ActionsDrawer', null);
+/* -------------------------------------------------------------------------------------------------
+ * Styled Components
+ * -----------------------------------------------------------------------------------------------*/ const DrawerContainer = styledComponents.styled(designSystem.Portal)`
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: ${({ $isOpen })=>$isOpen ? 4 : 2};
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  justify-content: flex-end;
+
+  ${({ theme })=>theme.breakpoints.medium} {
+    z-index: 2;
+    left: ${({ $hasSideNav })=>$hasSideNav ? strapiAdmin.WIDTH_SIDE_NAVIGATION : 0};
+  }
+`;
+const DrawerOverlay = styledComponents.styled(designSystem.Box)`
+  position: fixed;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  transition: opacity ${(props)=>props.theme.motion.timings['200']}
+    ${(props)=>props.theme.motion.easings.easeInOutQuad};
+  opacity: ${({ $isOpen })=>$isOpen ? 1 : 0};
+  pointer-events: ${({ $isOpen })=>$isOpen ? 'auto' : 'none'};
+
+  ${({ theme })=>theme.breakpoints.medium} {
+    left: ${({ $hasSideNav })=>$hasSideNav ? strapiAdmin.WIDTH_SIDE_NAVIGATION : 0};
+  }
+`;
+const ToggleButton = styledComponents.styled(designSystem.IconButton)`
+  padding: 0;
+  border: none;
+  background: ${({ theme })=>theme.colors.neutral200};
+  width: 3.2rem;
+  height: 3.2rem;
+  border-radius: 1.6rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`;
+const DrawerContent = styledComponents.styled(designSystem.Flex)`
+  flex-direction: column;
+  align-items: stretch;
+  position: relative;
+  z-index: 1;
+  pointer-events: auto;
+`;
+const DrawerContentInner = styledComponents.styled(designSystem.ScrollArea)`
+  max-height: ${({ $isOpen })=>$isOpen ? 'calc(100vh - 25rem)' // 25rem is arbitrary, to be able to see a bit of the content behind (navigation and header)
+     : '0'};
+  overflow: hidden;
+  transition: max-height ${(props)=>props.theme.motion.timings['200']}
+    ${(props)=>props.theme.motion.easings.easeInOutQuad};
+  z-index: 1;
+  pointer-events: auto;
+`;
+const Root = ({ children, hasContent = false, hasSideNav = false })=>{
+    const [isOpen, setIsOpen] = React__namespace.useState(false);
+    // Close drawer when there's no content
+    React__namespace.useEffect(()=>{
+        if (!hasContent) {
+            setIsOpen(false);
+        }
+    }, [
+        hasContent
+    ]);
+    return /*#__PURE__*/ jsxRuntime.jsx(ActionsDrawerProvider, {
+        isOpen: isOpen,
+        setIsOpen: setIsOpen,
+        hasContent: hasContent,
+        hasSideNav: hasSideNav,
+        children: /*#__PURE__*/ jsxRuntime.jsx(DrawerContainer, {
+            $hasSideNav: hasSideNav,
+            $isOpen: isOpen,
+            children: children
+        })
+    });
+};
+/* -------------------------------------------------------------------------------------------------
+ * Overlay
+ * -----------------------------------------------------------------------------------------------*/ const Overlay = ()=>{
+    const ctx = useActionsDrawer('ActionsDrawer.Overlay', (s)=>s, false);
+    const isOpen = ctx?.isOpen ?? false;
+    const hasContent = ctx?.hasContent ?? false;
+    const hasSideNav = ctx?.hasSideNav ?? false;
+    const setIsOpen = ctx?.setIsOpen;
+    if (!hasContent) {
+        return null;
+    }
+    return /*#__PURE__*/ jsxRuntime.jsx(DrawerOverlay, {
+        $isOpen: isOpen,
+        $hasSideNav: hasSideNav,
+        onClick: ()=>setIsOpen?.(false),
+        "data-testid": "actions-drawer-overlay"
+    });
+};
+const Header = ({ children })=>{
+    const ctx = useActionsDrawer('ActionsDrawer.Header', (s)=>s, false);
+    const isOpen = ctx?.isOpen ?? false;
+    const hasContent = ctx?.hasContent ?? false;
+    const setIsOpen = ctx?.setIsOpen;
+    const { formatMessage } = reactIntl.useIntl();
+    const toggleOpen = ()=>{
+        setIsOpen?.((prev)=>!prev);
+    };
+    return /*#__PURE__*/ jsxRuntime.jsx(DrawerContent, {
+        background: "neutral0",
+        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+            paddingTop: 3,
+            paddingBottom: 3,
+            paddingLeft: 4,
+            paddingRight: 4,
+            gap: 3,
+            borderStyle: "solid",
+            borderWidth: isOpen ? '1px 0' : '1px 0 0 0',
+            borderColor: "neutral150",
+            children: [
+                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+                    flex: 1,
+                    gap: 2,
+                    alignItems: "center",
+                    overflow: "hidden",
+                    children: children
+                }),
+                hasContent && /*#__PURE__*/ jsxRuntime.jsx(ToggleButton, {
+                    onClick: toggleOpen,
+                    label: isOpen ? formatMessage({
+                        id: 'content-manager.actions-drawer.close',
+                        defaultMessage: 'Close more actions'
+                    }) : formatMessage({
+                        id: 'content-manager.actions-drawer.open',
+                        defaultMessage: 'Open more actions'
+                    }),
+                    children: isOpen ? /*#__PURE__*/ jsxRuntime.jsx(Icons.CaretUp, {
+                        fill: "neutral600"
+                    }) : /*#__PURE__*/ jsxRuntime.jsx(Icons.CaretDown, {
+                        fill: "neutral600"
+                    })
+                })
+            ]
+        })
+    });
+};
+const Content = ({ children })=>{
+    const ctx = useActionsDrawer('ActionsDrawer.Content', (s)=>s, false);
+    const isOpen = ctx?.isOpen ?? false;
+    return /*#__PURE__*/ jsxRuntime.jsx(DrawerContentInner, {
+        $isOpen: isOpen,
+        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+            direction: "column",
+            alignItems: "stretch",
+            justifyContent: "flex-start",
+            padding: {
+                initial: 4,
+                large: 0
+            },
+            background: "neutral0",
+            children: children
+        })
+    });
+};
+/* -------------------------------------------------------------------------------------------------
+ * ActionsDrawer
+ * -----------------------------------------------------------------------------------------------*/ const ActionsDrawer = {
+    Root,
+    Overlay,
+    Header,
+    Content
+};
+
+exports.ActionsDrawer = ActionsDrawer;
+exports.useActionsDrawer = useActionsDrawer;
+//# sourceMappingURL=ActionsDrawer.js.map

package/dist/admin/components/ActionsDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionsDrawer.js","sources":["../../../admin/src/components/ActionsDrawer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { WIDTH_SIDE_NAVIGATION, createContext } from '@strapi/admin/strapi-admin';\nimport { Portal, Flex, Box, ScrollArea, IconButton } from '@strapi/design-system';\nimport { CaretDown, CaretUp } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\n/**\n * ActionsDrawer is a component used in the content manager edit view page and content history page.\n * It's a sticky banner that can expand to reveal more actions. It's used only in mobile and tablet.\n *\n * A similar component is currently in development in the design-system but it's not ready yet.\n * Using the Panels for the edit view page brought some complexity and for the moment, we decided to go with this custom implementation.\n *\n * @TODO: Replace this component with the one in the design-system when it's ready.\n */\n\n/* -------------------------------------------------------------------------------------------------\n * ActionsDrawer Context\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ActionsDrawerContextValue {\n  isOpen: boolean;\n  setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;\n  hasContent: boolean;\n  hasSideNav: boolean;\n}\n\nconst [ActionsDrawerProvider, useActionsDrawer] = createContext<ActionsDrawerContextValue | null>(\n  'ActionsDrawer',\n  null\n);\n\n/* -------------------------------------------------------------------------------------------------\n * Styled Components\n * -----------------------------------------------------------------------------------------------*/\n\nconst DrawerContainer = styled(Portal)<{ $hasSideNav: boolean; $isOpen: boolean }>`\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: ${({ $isOpen }) => ($isOpen ? 4 : 2)};\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  justify-content: flex-end;\n\n  ${({ theme }) => theme.breakpoints.medium} {\n    z-index: 2;\n    left: ${({ $hasSideNav }) => ($hasSideNav ? WIDTH_SIDE_NAVIGATION : 0)};\n  }\n`;\n\nconst DrawerOverlay = styled(Box)<{ $isOpen: boolean; $hasSideNav: boolean }>`\n  position: fixed;\n  left: 0;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  background-color: rgba(0, 0, 0, 0.5);\n  transition: opacity ${(props) => props.theme.motion.timings['200']}\n    ${(props) => props.theme.motion.easings.easeInOutQuad};\n  opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)};\n  pointer-events: ${({ $isOpen }) => ($isOpen ? 'auto' : 'none')};\n\n  ${({ theme }) => theme.breakpoints.medium} {\n    left: ${({ $hasSideNav }) => ($hasSideNav ? WIDTH_SIDE_NAVIGATION : 0)};\n  }\n`;\n\nconst ToggleButton = styled(IconButton)`\n  padding: 0;\n  border: none;\n  background: ${({ theme }) => theme.colors.neutral200};\n  width: 3.2rem;\n  height: 3.2rem;\n  border-radius: 1.6rem;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\nconst DrawerContent = styled(Flex)`\n  flex-direction: column;\n  align-items: stretch;\n  position: relative;\n  z-index: 1;\n  pointer-events: auto;\n`;\n\nconst DrawerContentInner = styled(ScrollArea)<{ $isOpen: boolean }>`\n  max-height: ${({ $isOpen }) =>\n    $isOpen\n      ? 'calc(100vh - 25rem)' // 25rem is arbitrary, to be able to see a bit of the content behind (navigation and header)\n      : '0'};\n  overflow: hidden;\n  transition: max-height ${(props) => props.theme.motion.timings['200']}\n    ${(props) => props.theme.motion.easings.easeInOutQuad};\n  z-index: 1;\n  pointer-events: auto;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Root\n * -----------------------------------------------------------------------------------------------*/\n\ninterface RootProps {\n  children: React.ReactNode;\n  hasContent?: boolean;\n  hasSideNav?: boolean;\n}\n\nconst Root = ({ children, hasContent = false, hasSideNav = false }: RootProps) => {\n  const [isOpen, setIsOpen] = React.useState(false);\n\n  // Close drawer when there's no content\n  React.useEffect(() => {\n    if (!hasContent) {\n      setIsOpen(false);\n    }\n  }, [hasContent]);\n\n  return (\n    <ActionsDrawerProvider\n      isOpen={isOpen}\n      setIsOpen={setIsOpen}\n      hasContent={hasContent}\n      hasSideNav={hasSideNav}\n    >\n      <DrawerContainer $hasSideNav={hasSideNav} $isOpen={isOpen}>\n        {children}\n      </DrawerContainer>\n    </ActionsDrawerProvider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Overlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst Overlay = () => {\n  const ctx = useActionsDrawer('ActionsDrawer.Overlay', (s) => s, false);\n  const isOpen = ctx?.isOpen ?? false;\n  const hasContent = ctx?.hasContent ?? false;\n  const hasSideNav = ctx?.hasSideNav ?? false;\n  const setIsOpen = ctx?.setIsOpen;\n\n  if (!hasContent) {\n    return null;\n  }\n\n  return (\n    <DrawerOverlay\n      $isOpen={isOpen}\n      $hasSideNav={hasSideNav}\n      onClick={() => setIsOpen?.(false)}\n      data-testid=\"actions-drawer-overlay\"\n    />\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Header\n * -----------------------------------------------------------------------------------------------*/\n\ninterface HeaderProps {\n  children: React.ReactNode;\n}\n\nconst Header = ({ children }: HeaderProps) => {\n  const ctx = useActionsDrawer('ActionsDrawer.Header', (s) => s, false);\n  const isOpen = ctx?.isOpen ?? false;\n  const hasContent = ctx?.hasContent ?? false;\n  const setIsOpen = ctx?.setIsOpen;\n  const { formatMessage } = useIntl();\n\n  const toggleOpen = () => {\n    setIsOpen?.((prev: boolean) => !prev);\n  };\n\n  return (\n    <DrawerContent background=\"neutral0\">\n      <Flex\n        paddingTop={3}\n        paddingBottom={3}\n        paddingLeft={4}\n        paddingRight={4}\n        gap={3}\n        borderStyle=\"solid\"\n        borderWidth={isOpen ? '1px 0' : '1px 0 0 0'}\n        borderColor=\"neutral150\"\n      >\n        <Flex flex={1} gap={2} alignItems=\"center\" overflow=\"hidden\">\n          {children}\n        </Flex>\n        {hasContent && (\n          <ToggleButton\n            onClick={toggleOpen}\n            label={\n              isOpen\n                ? formatMessage({\n                    id: 'content-manager.actions-drawer.close',\n                    defaultMessage: 'Close more actions',\n                  })\n                : formatMessage({\n                    id: 'content-manager.actions-drawer.open',\n                    defaultMessage: 'Open more actions',\n                  })\n            }\n          >\n            {isOpen ? <CaretUp fill=\"neutral600\" /> : <CaretDown fill=\"neutral600\" />}\n          </ToggleButton>\n        )}\n      </Flex>\n    </DrawerContent>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Content\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ContentProps {\n  children: React.ReactNode;\n}\n\nconst Content = ({ children }: ContentProps) => {\n  const ctx = useActionsDrawer('ActionsDrawer.Content', (s) => s, false);\n  const isOpen = ctx?.isOpen ?? false;\n\n  return (\n    <DrawerContentInner $isOpen={isOpen}>\n      <Flex\n        direction=\"column\"\n        alignItems=\"stretch\"\n        justifyContent=\"flex-start\"\n        padding={{ initial: 4, large: 0 }}\n        background=\"neutral0\"\n      >\n        {children}\n      </Flex>\n    </DrawerContentInner>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * ActionsDrawer\n * -----------------------------------------------------------------------------------------------*/\n\nconst ActionsDrawer = {\n  Root,\n  Overlay,\n  Header,\n  Content,\n};\n\nexport { ActionsDrawer, useActionsDrawer };\n"],"names":["ActionsDrawerProvider","useActionsDrawer","createContext","DrawerContainer","styled","Portal","$isOpen","theme","breakpoints","medium","$hasSideNav","WIDTH_SIDE_NAVIGATION","DrawerOverlay","Box","props","motion","timings","easings","easeInOutQuad","ToggleButton","IconButton","colors","neutral200","DrawerContent","Flex","DrawerContentInner","ScrollArea","Root","children","hasContent","hasSideNav","isOpen","setIsOpen","React","useState","useEffect","_jsx","Overlay","ctx","s","onClick","data-testid","Header","formatMessage","useIntl","toggleOpen","prev","background","_jsxs","paddingTop","paddingBottom","paddingLeft","paddingRight","gap","borderStyle","borderWidth","borderColor","flex","alignItems","overflow","label","id","defaultMessage","CaretUp","fill","CaretDown","Content","direction","justifyContent","padding","initial","large","ActionsDrawer"],"mappings":"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"}

package/dist/admin/components/ActionsDrawer.mjs

@@ -0,0 +1,186 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { createContext, WIDTH_SIDE_NAVIGATION } from '@strapi/admin/strapi-admin';
+import { Portal, Box, IconButton, Flex, ScrollArea } from '@strapi/design-system';
+import { CaretUp, CaretDown } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { styled } from 'styled-components';
+
+const [ActionsDrawerProvider, useActionsDrawer] = createContext('ActionsDrawer', null);
+/* -------------------------------------------------------------------------------------------------
+ * Styled Components
+ * -----------------------------------------------------------------------------------------------*/ const DrawerContainer = styled(Portal)`
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: ${({ $isOpen })=>$isOpen ? 4 : 2};
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  justify-content: flex-end;
+
+  ${({ theme })=>theme.breakpoints.medium} {
+    z-index: 2;
+    left: ${({ $hasSideNav })=>$hasSideNav ? WIDTH_SIDE_NAVIGATION : 0};
+  }
+`;
+const DrawerOverlay = styled(Box)`
+  position: fixed;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  transition: opacity ${(props)=>props.theme.motion.timings['200']}
+    ${(props)=>props.theme.motion.easings.easeInOutQuad};
+  opacity: ${({ $isOpen })=>$isOpen ? 1 : 0};
+  pointer-events: ${({ $isOpen })=>$isOpen ? 'auto' : 'none'};
+
+  ${({ theme })=>theme.breakpoints.medium} {
+    left: ${({ $hasSideNav })=>$hasSideNav ? WIDTH_SIDE_NAVIGATION : 0};
+  }
+`;
+const ToggleButton = styled(IconButton)`
+  padding: 0;
+  border: none;
+  background: ${({ theme })=>theme.colors.neutral200};
+  width: 3.2rem;
+  height: 3.2rem;
+  border-radius: 1.6rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`;
+const DrawerContent = styled(Flex)`
+  flex-direction: column;
+  align-items: stretch;
+  position: relative;
+  z-index: 1;
+  pointer-events: auto;
+`;
+const DrawerContentInner = styled(ScrollArea)`
+  max-height: ${({ $isOpen })=>$isOpen ? 'calc(100vh - 25rem)' // 25rem is arbitrary, to be able to see a bit of the content behind (navigation and header)
+     : '0'};
+  overflow: hidden;
+  transition: max-height ${(props)=>props.theme.motion.timings['200']}
+    ${(props)=>props.theme.motion.easings.easeInOutQuad};
+  z-index: 1;
+  pointer-events: auto;
+`;
+const Root = ({ children, hasContent = false, hasSideNav = false })=>{
+    const [isOpen, setIsOpen] = React.useState(false);
+    // Close drawer when there's no content
+    React.useEffect(()=>{
+        if (!hasContent) {
+            setIsOpen(false);
+        }
+    }, [
+        hasContent
+    ]);
+    return /*#__PURE__*/ jsx(ActionsDrawerProvider, {
+        isOpen: isOpen,
+        setIsOpen: setIsOpen,
+        hasContent: hasContent,
+        hasSideNav: hasSideNav,
+        children: /*#__PURE__*/ jsx(DrawerContainer, {
+            $hasSideNav: hasSideNav,
+            $isOpen: isOpen,
+            children: children
+        })
+    });
+};
+/* -------------------------------------------------------------------------------------------------
+ * Overlay
+ * -----------------------------------------------------------------------------------------------*/ const Overlay = ()=>{
+    const ctx = useActionsDrawer('ActionsDrawer.Overlay', (s)=>s, false);
+    const isOpen = ctx?.isOpen ?? false;
+    const hasContent = ctx?.hasContent ?? false;
+    const hasSideNav = ctx?.hasSideNav ?? false;
+    const setIsOpen = ctx?.setIsOpen;
+    if (!hasContent) {
+        return null;
+    }
+    return /*#__PURE__*/ jsx(DrawerOverlay, {
+        $isOpen: isOpen,
+        $hasSideNav: hasSideNav,
+        onClick: ()=>setIsOpen?.(false),
+        "data-testid": "actions-drawer-overlay"
+    });
+};
+const Header = ({ children })=>{
+    const ctx = useActionsDrawer('ActionsDrawer.Header', (s)=>s, false);
+    const isOpen = ctx?.isOpen ?? false;
+    const hasContent = ctx?.hasContent ?? false;
+    const setIsOpen = ctx?.setIsOpen;
+    const { formatMessage } = useIntl();
+    const toggleOpen = ()=>{
+        setIsOpen?.((prev)=>!prev);
+    };
+    return /*#__PURE__*/ jsx(DrawerContent, {
+        background: "neutral0",
+        children: /*#__PURE__*/ jsxs(Flex, {
+            paddingTop: 3,
+            paddingBottom: 3,
+            paddingLeft: 4,
+            paddingRight: 4,
+            gap: 3,
+            borderStyle: "solid",
+            borderWidth: isOpen ? '1px 0' : '1px 0 0 0',
+            borderColor: "neutral150",
+            children: [
+                /*#__PURE__*/ jsx(Flex, {
+                    flex: 1,
+                    gap: 2,
+                    alignItems: "center",
+                    overflow: "hidden",
+                    children: children
+                }),
+                hasContent && /*#__PURE__*/ jsx(ToggleButton, {
+                    onClick: toggleOpen,
+                    label: isOpen ? formatMessage({
+                        id: 'content-manager.actions-drawer.close',
+                        defaultMessage: 'Close more actions'
+                    }) : formatMessage({
+                        id: 'content-manager.actions-drawer.open',
+                        defaultMessage: 'Open more actions'
+                    }),
+                    children: isOpen ? /*#__PURE__*/ jsx(CaretUp, {
+                        fill: "neutral600"
+                    }) : /*#__PURE__*/ jsx(CaretDown, {
+                        fill: "neutral600"
+                    })
+                })
+            ]
+        })
+    });
+};
+const Content = ({ children })=>{
+    const ctx = useActionsDrawer('ActionsDrawer.Content', (s)=>s, false);
+    const isOpen = ctx?.isOpen ?? false;
+    return /*#__PURE__*/ jsx(DrawerContentInner, {
+        $isOpen: isOpen,
+        children: /*#__PURE__*/ jsx(Flex, {
+            direction: "column",
+            alignItems: "stretch",
+            justifyContent: "flex-start",
+            padding: {
+                initial: 4,
+                large: 0
+            },
+            background: "neutral0",
+            children: children
+        })
+    });
+};
+/* -------------------------------------------------------------------------------------------------
+ * ActionsDrawer
+ * -----------------------------------------------------------------------------------------------*/ const ActionsDrawer = {
+    Root,
+    Overlay,
+    Header,
+    Content
+};
+
+export { ActionsDrawer, useActionsDrawer };
+//# sourceMappingURL=ActionsDrawer.mjs.map

package/dist/admin/components/ActionsDrawer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionsDrawer.mjs","sources":["../../../admin/src/components/ActionsDrawer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { WIDTH_SIDE_NAVIGATION, createContext } from '@strapi/admin/strapi-admin';\nimport { Portal, Flex, Box, ScrollArea, IconButton } from '@strapi/design-system';\nimport { CaretDown, CaretUp } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\n/**\n * ActionsDrawer is a component used in the content manager edit view page and content history page.\n * It's a sticky banner that can expand to reveal more actions. It's used only in mobile and tablet.\n *\n * A similar component is currently in development in the design-system but it's not ready yet.\n * Using the Panels for the edit view page brought some complexity and for the moment, we decided to go with this custom implementation.\n *\n * @TODO: Replace this component with the one in the design-system when it's ready.\n */\n\n/* -------------------------------------------------------------------------------------------------\n * ActionsDrawer Context\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ActionsDrawerContextValue {\n  isOpen: boolean;\n  setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;\n  hasContent: boolean;\n  hasSideNav: boolean;\n}\n\nconst [ActionsDrawerProvider, useActionsDrawer] = createContext<ActionsDrawerContextValue | null>(\n  'ActionsDrawer',\n  null\n);\n\n/* -------------------------------------------------------------------------------------------------\n * Styled Components\n * -----------------------------------------------------------------------------------------------*/\n\nconst DrawerContainer = styled(Portal)<{ $hasSideNav: boolean; $isOpen: boolean }>`\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: ${({ $isOpen }) => ($isOpen ? 4 : 2)};\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  justify-content: flex-end;\n\n  ${({ theme }) => theme.breakpoints.medium} {\n    z-index: 2;\n    left: ${({ $hasSideNav }) => ($hasSideNav ? WIDTH_SIDE_NAVIGATION : 0)};\n  }\n`;\n\nconst DrawerOverlay = styled(Box)<{ $isOpen: boolean; $hasSideNav: boolean }>`\n  position: fixed;\n  left: 0;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  background-color: rgba(0, 0, 0, 0.5);\n  transition: opacity ${(props) => props.theme.motion.timings['200']}\n    ${(props) => props.theme.motion.easings.easeInOutQuad};\n  opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)};\n  pointer-events: ${({ $isOpen }) => ($isOpen ? 'auto' : 'none')};\n\n  ${({ theme }) => theme.breakpoints.medium} {\n    left: ${({ $hasSideNav }) => ($hasSideNav ? WIDTH_SIDE_NAVIGATION : 0)};\n  }\n`;\n\nconst ToggleButton = styled(IconButton)`\n  padding: 0;\n  border: none;\n  background: ${({ theme }) => theme.colors.neutral200};\n  width: 3.2rem;\n  height: 3.2rem;\n  border-radius: 1.6rem;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\nconst DrawerContent = styled(Flex)`\n  flex-direction: column;\n  align-items: stretch;\n  position: relative;\n  z-index: 1;\n  pointer-events: auto;\n`;\n\nconst DrawerContentInner = styled(ScrollArea)<{ $isOpen: boolean }>`\n  max-height: ${({ $isOpen }) =>\n    $isOpen\n      ? 'calc(100vh - 25rem)' // 25rem is arbitrary, to be able to see a bit of the content behind (navigation and header)\n      : '0'};\n  overflow: hidden;\n  transition: max-height ${(props) => props.theme.motion.timings['200']}\n    ${(props) => props.theme.motion.easings.easeInOutQuad};\n  z-index: 1;\n  pointer-events: auto;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Root\n * -----------------------------------------------------------------------------------------------*/\n\ninterface RootProps {\n  children: React.ReactNode;\n  hasContent?: boolean;\n  hasSideNav?: boolean;\n}\n\nconst Root = ({ children, hasContent = false, hasSideNav = false }: RootProps) => {\n  const [isOpen, setIsOpen] = React.useState(false);\n\n  // Close drawer when there's no content\n  React.useEffect(() => {\n    if (!hasContent) {\n      setIsOpen(false);\n    }\n  }, [hasContent]);\n\n  return (\n    <ActionsDrawerProvider\n      isOpen={isOpen}\n      setIsOpen={setIsOpen}\n      hasContent={hasContent}\n      hasSideNav={hasSideNav}\n    >\n      <DrawerContainer $hasSideNav={hasSideNav} $isOpen={isOpen}>\n        {children}\n      </DrawerContainer>\n    </ActionsDrawerProvider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Overlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst Overlay = () => {\n  const ctx = useActionsDrawer('ActionsDrawer.Overlay', (s) => s, false);\n  const isOpen = ctx?.isOpen ?? false;\n  const hasContent = ctx?.hasContent ?? false;\n  const hasSideNav = ctx?.hasSideNav ?? false;\n  const setIsOpen = ctx?.setIsOpen;\n\n  if (!hasContent) {\n    return null;\n  }\n\n  return (\n    <DrawerOverlay\n      $isOpen={isOpen}\n      $hasSideNav={hasSideNav}\n      onClick={() => setIsOpen?.(false)}\n      data-testid=\"actions-drawer-overlay\"\n    />\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Header\n * -----------------------------------------------------------------------------------------------*/\n\ninterface HeaderProps {\n  children: React.ReactNode;\n}\n\nconst Header = ({ children }: HeaderProps) => {\n  const ctx = useActionsDrawer('ActionsDrawer.Header', (s) => s, false);\n  const isOpen = ctx?.isOpen ?? false;\n  const hasContent = ctx?.hasContent ?? false;\n  const setIsOpen = ctx?.setIsOpen;\n  const { formatMessage } = useIntl();\n\n  const toggleOpen = () => {\n    setIsOpen?.((prev: boolean) => !prev);\n  };\n\n  return (\n    <DrawerContent background=\"neutral0\">\n      <Flex\n        paddingTop={3}\n        paddingBottom={3}\n        paddingLeft={4}\n        paddingRight={4}\n        gap={3}\n        borderStyle=\"solid\"\n        borderWidth={isOpen ? '1px 0' : '1px 0 0 0'}\n        borderColor=\"neutral150\"\n      >\n        <Flex flex={1} gap={2} alignItems=\"center\" overflow=\"hidden\">\n          {children}\n        </Flex>\n        {hasContent && (\n          <ToggleButton\n            onClick={toggleOpen}\n            label={\n              isOpen\n                ? formatMessage({\n                    id: 'content-manager.actions-drawer.close',\n                    defaultMessage: 'Close more actions',\n                  })\n                : formatMessage({\n                    id: 'content-manager.actions-drawer.open',\n                    defaultMessage: 'Open more actions',\n                  })\n            }\n          >\n            {isOpen ? <CaretUp fill=\"neutral600\" /> : <CaretDown fill=\"neutral600\" />}\n          </ToggleButton>\n        )}\n      </Flex>\n    </DrawerContent>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Content\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ContentProps {\n  children: React.ReactNode;\n}\n\nconst Content = ({ children }: ContentProps) => {\n  const ctx = useActionsDrawer('ActionsDrawer.Content', (s) => s, false);\n  const isOpen = ctx?.isOpen ?? false;\n\n  return (\n    <DrawerContentInner $isOpen={isOpen}>\n      <Flex\n        direction=\"column\"\n        alignItems=\"stretch\"\n        justifyContent=\"flex-start\"\n        padding={{ initial: 4, large: 0 }}\n        background=\"neutral0\"\n      >\n        {children}\n      </Flex>\n    </DrawerContentInner>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * ActionsDrawer\n * -----------------------------------------------------------------------------------------------*/\n\nconst ActionsDrawer = {\n  Root,\n  Overlay,\n  Header,\n  Content,\n};\n\nexport { ActionsDrawer, useActionsDrawer };\n"],"names":["ActionsDrawerProvider","useActionsDrawer","createContext","DrawerContainer","styled","Portal","$isOpen","theme","breakpoints","medium","$hasSideNav","WIDTH_SIDE_NAVIGATION","DrawerOverlay","Box","props","motion","timings","easings","easeInOutQuad","ToggleButton","IconButton","colors","neutral200","DrawerContent","Flex","DrawerContentInner","ScrollArea","Root","children","hasContent","hasSideNav","isOpen","setIsOpen","React","useState","useEffect","_jsx","Overlay","ctx","s","onClick","data-testid","Header","formatMessage","useIntl","toggleOpen","prev","background","_jsxs","paddingTop","paddingBottom","paddingLeft","paddingRight","gap","borderStyle","borderWidth","borderColor","flex","alignItems","overflow","label","id","defaultMessage","CaretUp","fill","CaretDown","Content","direction","justifyContent","padding","initial","large","ActionsDrawer"],"mappings":";;;;;;;;AA6BA,MAAM,CAACA,qBAAAA,EAAuBC,gBAAAA,CAAiB,GAAGC,cAChD,eAAA,EACA,IAAA;AAGF;;AAEkG,qGAElG,MAAMC,eAAAA,GAAkBC,MAAAA,CAAOC,MAAAA,CAAmD;;;;;AAKvE,WAAA,EAAE,CAAC,EAAEC,OAAO,EAAE,GAAMA,OAAAA,GAAU,IAAI,CAAA,CAAG;;;;;;EAM9C,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,WAAW,CAACC,MAAM,CAAC;;AAElC,UAAA,EAAE,CAAC,EAAEC,WAAW,EAAE,GAAMA,WAAAA,GAAcC,wBAAwB,CAAA,CAAG;;AAE3E,CAAC;AAED,MAAMC,aAAAA,GAAgBR,MAAAA,CAAOS,GAAAA,CAAgD;;;;;;;sBAOvD,EAAE,CAACC,KAAAA,GAAUA,KAAAA,CAAMP,KAAK,CAACQ,MAAM,CAACC,OAAO,CAAC,KAAA,CAAM;IAChE,EAAE,CAACF,KAAAA,GAAUA,KAAAA,CAAMP,KAAK,CAACQ,MAAM,CAACE,OAAO,CAACC,aAAa,CAAC;AAC/C,WAAA,EAAE,CAAC,EAAEZ,OAAO,EAAE,GAAMA,OAAAA,GAAU,IAAI,CAAA,CAAG;AAC9B,kBAAA,EAAE,CAAC,EAAEA,OAAO,EAAE,GAAMA,OAAAA,GAAU,SAAS,MAAA,CAAQ;;EAE/D,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,WAAW,CAACC,MAAM,CAAC;AAClC,UAAA,EAAE,CAAC,EAAEC,WAAW,EAAE,GAAMA,WAAAA,GAAcC,wBAAwB,CAAA,CAAG;;AAE3E,CAAC;AAED,MAAMQ,YAAAA,GAAef,MAAAA,CAAOgB,UAAAA,CAAW;;;cAGzB,EAAE,CAAC,EAAEb,KAAK,EAAE,GAAKA,KAAAA,CAAMc,MAAM,CAACC,UAAU,CAAC;;;;;;;AAOvD,CAAC;AAED,MAAMC,aAAAA,GAAgBnB,MAAAA,CAAOoB,IAAAA,CAAK;;;;;;AAMlC,CAAC;AAED,MAAMC,kBAAAA,GAAqBrB,MAAAA,CAAOsB,UAAAA,CAAiC;AACrD,cAAA,EAAE,CAAC,EAAEpB,OAAO,EAAE,GACxBA,OAAAA,GACI;OACA,GAAA,CAAI;;yBAEa,EAAE,CAACQ,KAAAA,GAAUA,KAAAA,CAAMP,KAAK,CAACQ,MAAM,CAACC,OAAO,CAAC,KAAA,CAAM;IACnE,EAAE,CAACF,KAAAA,GAAUA,KAAAA,CAAMP,KAAK,CAACQ,MAAM,CAACE,OAAO,CAACC,aAAa,CAAC;;;AAG1D,CAAC;AAYD,MAAMS,IAAAA,GAAO,CAAC,EAAEC,QAAQ,EAAEC,aAAa,KAAK,EAAEC,UAAAA,GAAa,KAAK,EAAa,GAAA;AAC3E,IAAA,MAAM,CAACC,MAAAA,EAAQC,SAAAA,CAAU,GAAGC,KAAAA,CAAMC,QAAQ,CAAC,KAAA,CAAA;;AAG3CD,IAAAA,KAAAA,CAAME,SAAS,CAAC,IAAA;AACd,QAAA,IAAI,CAACN,UAAAA,EAAY;YACfG,SAAAA,CAAU,KAAA,CAAA;AACZ,QAAA;IACF,CAAA,EAAG;AAACH,QAAAA;AAAW,KAAA,CAAA;AAEf,IAAA,qBACEO,GAAA,CAACpC,qBAAAA,EAAAA;QACC+B,MAAAA,EAAQA,MAAAA;QACRC,SAAAA,EAAWA,SAAAA;QACXH,UAAAA,EAAYA,UAAAA;QACZC,UAAAA,EAAYA,UAAAA;AAEZ,QAAA,QAAA,gBAAAM,GAAA,CAACjC,eAAAA,EAAAA;YAAgBO,WAAAA,EAAaoB,UAAAA;YAAYxB,OAAAA,EAASyB,MAAAA;AAChDH,YAAAA,QAAAA,EAAAA;;;AAIT,CAAA;AAEA;;AAEkG,qGAElG,MAAMS,OAAAA,GAAU,IAAA;AACd,IAAA,MAAMC,GAAAA,GAAMrC,gBAAAA,CAAiB,uBAAA,EAAyB,CAACsC,IAAMA,CAAAA,EAAG,KAAA,CAAA;IAChE,MAAMR,MAAAA,GAASO,KAAKP,MAAAA,IAAU,KAAA;IAC9B,MAAMF,UAAAA,GAAaS,KAAKT,UAAAA,IAAc,KAAA;IACtC,MAAMC,UAAAA,GAAaQ,KAAKR,UAAAA,IAAc,KAAA;AACtC,IAAA,MAAME,YAAYM,GAAAA,EAAKN,SAAAA;AAEvB,IAAA,IAAI,CAACH,UAAAA,EAAY;QACf,OAAO,IAAA;AACT,IAAA;AAEA,IAAA,qBACEO,GAAA,CAACxB,aAAAA,EAAAA;QACCN,OAAAA,EAASyB,MAAAA;QACTrB,WAAAA,EAAaoB,UAAAA;AACbU,QAAAA,OAAAA,EAAS,IAAMR,SAAAA,GAAY,KAAA,CAAA;QAC3BS,aAAAA,EAAY;;AAGlB,CAAA;AAUA,MAAMC,MAAAA,GAAS,CAAC,EAAEd,QAAQ,EAAe,GAAA;AACvC,IAAA,MAAMU,GAAAA,GAAMrC,gBAAAA,CAAiB,sBAAA,EAAwB,CAACsC,IAAMA,CAAAA,EAAG,KAAA,CAAA;IAC/D,MAAMR,MAAAA,GAASO,KAAKP,MAAAA,IAAU,KAAA;IAC9B,MAAMF,UAAAA,GAAaS,KAAKT,UAAAA,IAAc,KAAA;AACtC,IAAA,MAAMG,YAAYM,GAAAA,EAAKN,SAAAA;IACvB,MAAM,EAAEW,aAAa,EAAE,GAAGC,OAAAA,EAAAA;AAE1B,IAAA,MAAMC,UAAAA,GAAa,IAAA;QACjBb,SAAAA,GAAY,CAACc,OAAkB,CAACA,IAAAA,CAAAA;AAClC,IAAA,CAAA;AAEA,IAAA,qBACEV,GAAA,CAACb,aAAAA,EAAAA;QAAcwB,UAAAA,EAAW,UAAA;AACxB,QAAA,QAAA,gBAAAC,IAAA,CAACxB,IAAAA,EAAAA;YACCyB,UAAAA,EAAY,CAAA;YACZC,aAAAA,EAAe,CAAA;YACfC,WAAAA,EAAa,CAAA;YACbC,YAAAA,EAAc,CAAA;YACdC,GAAAA,EAAK,CAAA;YACLC,WAAAA,EAAY,OAAA;AACZC,YAAAA,WAAAA,EAAaxB,SAAS,OAAA,GAAU,WAAA;YAChCyB,WAAAA,EAAY,YAAA;;8BAEZpB,GAAA,CAACZ,IAAAA,EAAAA;oBAAKiC,IAAAA,EAAM,CAAA;oBAAGJ,GAAAA,EAAK,CAAA;oBAAGK,UAAAA,EAAW,QAAA;oBAASC,QAAAA,EAAS,QAAA;AACjD/B,oBAAAA,QAAAA,EAAAA;;AAEFC,gBAAAA,UAAAA,kBACCO,GAAA,CAACjB,YAAAA,EAAAA;oBACCqB,OAAAA,EAASK,UAAAA;AACTe,oBAAAA,KAAAA,EACE7B,SACIY,aAAAA,CAAc;wBACZkB,EAAAA,EAAI,sCAAA;wBACJC,cAAAA,EAAgB;AAClB,qBAAA,CAAA,GACAnB,aAAAA,CAAc;wBACZkB,EAAAA,EAAI,qCAAA;wBACJC,cAAAA,EAAgB;AAClB,qBAAA,CAAA;AAGL/B,oBAAAA,QAAAA,EAAAA,MAAAA,iBAASK,GAAA,CAAC2B,OAAAA,EAAAA;wBAAQC,IAAAA,EAAK;uCAAkB5B,GAAA,CAAC6B,SAAAA,EAAAA;wBAAUD,IAAAA,EAAK;;;;;;AAMtE,CAAA;AAUA,MAAME,OAAAA,GAAU,CAAC,EAAEtC,QAAQ,EAAgB,GAAA;AACzC,IAAA,MAAMU,GAAAA,GAAMrC,gBAAAA,CAAiB,uBAAA,EAAyB,CAACsC,IAAMA,CAAAA,EAAG,KAAA,CAAA;IAChE,MAAMR,MAAAA,GAASO,KAAKP,MAAAA,IAAU,KAAA;AAE9B,IAAA,qBACEK,GAAA,CAACX,kBAAAA,EAAAA;QAAmBnB,OAAAA,EAASyB,MAAAA;AAC3B,QAAA,QAAA,gBAAAK,GAAA,CAACZ,IAAAA,EAAAA;YACC2C,SAAAA,EAAU,QAAA;YACVT,UAAAA,EAAW,SAAA;YACXU,cAAAA,EAAe,YAAA;YACfC,OAAAA,EAAS;gBAAEC,OAAAA,EAAS,CAAA;gBAAGC,KAAAA,EAAO;AAAE,aAAA;YAChCxB,UAAAA,EAAW,UAAA;AAEVnB,YAAAA,QAAAA,EAAAA;;;AAIT,CAAA;AAEA;;AAEkG,2GAE5F4C,aAAAA,GAAgB;AACpB7C,IAAAA,IAAAA;AACAU,IAAAA,OAAAA;AACAK,IAAAA,MAAAA;AACAwB,IAAAA;AACF;;;;"}

package/dist/admin/components/ComponentIcon.js

@@ -0,0 +1,180 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+require('react');
+var designSystem = require('@strapi/design-system');
+var Icons = require('@strapi/icons');
+var Symbols = require('@strapi/icons/symbols');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var Icons__namespace = /*#__PURE__*/_interopNamespace(Icons);
+var Symbols__namespace = /*#__PURE__*/_interopNamespace(Symbols);
+
+const ComponentIcon = ({ showBackground = true, icon = 'dashboard', ...props })=>{
+    const Icon = COMPONENT_ICONS[icon] || COMPONENT_ICONS.dashboard;
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+        alignItems: "center",
+        background: showBackground ? 'neutral200' : undefined,
+        justifyContent: "center",
+        height: 8,
+        width: 8,
+        color: "neutral600",
+        borderRadius: showBackground ? '50%' : 0,
+        ...props,
+        children: /*#__PURE__*/ jsxRuntime.jsx(Icon, {
+            height: "2rem",
+            width: "2rem"
+        })
+    });
+};
+const COMPONENT_ICONS = {
+    alien: Icons__namespace.Alien,
+    apps: Icons__namespace.GridNine,
+    archive: Icons__namespace.Archive,
+    arrowDown: Icons__namespace.ArrowDown,
+    arrowLeft: Icons__namespace.ArrowLeft,
+    arrowRight: Icons__namespace.ArrowRight,
+    arrowUp: Icons__namespace.ArrowUp,
+    attachment: Icons__namespace.Paperclip,
+    bell: Icons__namespace.Bell,
+    bold: Icons__namespace.Bold,
+    book: Icons__namespace.Book,
+    briefcase: Icons__namespace.Briefcase,
+    brush: Icons__namespace.PaintBrush,
+    bulletList: Icons__namespace.BulletList,
+    calendar: Icons__namespace.Calendar,
+    car: Icons__namespace.Car,
+    cast: Icons__namespace.Cast,
+    chartBubble: Icons__namespace.ChartBubble,
+    chartCircle: Icons__namespace.ChartCircle,
+    chartPie: Icons__namespace.ChartPie,
+    check: Icons__namespace.Check,
+    clock: Icons__namespace.Clock,
+    cloud: Icons__namespace.Cloud,
+    code: Icons__namespace.Code,
+    cog: Icons__namespace.Cog,
+    collapse: Icons__namespace.Collapse,
+    command: Icons__namespace.Command,
+    connector: Icons__namespace.Faders,
+    crop: Icons__namespace.Crop,
+    crown: Icons__namespace.Crown,
+    cup: Icons__namespace.Coffee,
+    cursor: Icons__namespace.Cursor,
+    dashboard: Icons__namespace.SquaresFour,
+    database: Icons__namespace.Database,
+    discuss: Icons__namespace.Discuss,
+    doctor: Icons__namespace.Stethoscope,
+    earth: Icons__namespace.Earth,
+    emotionHappy: Icons__namespace.EmotionHappy,
+    emotionUnhappy: Icons__namespace.EmotionUnhappy,
+    envelop: Icons__namespace.Mail,
+    exit: Icons__namespace.SignOut,
+    expand: Icons__namespace.Expand,
+    eye: Icons__namespace.Eye,
+    feather: Icons__namespace.Feather,
+    file: Icons__namespace.File,
+    fileError: Icons__namespace.FileError,
+    filePdf: Icons__namespace.FilePdf,
+    fileXls: Icons__namespace.FileXls,
+    fileZip: Icons__namespace.FileZip,
+    fileCsv: Icons__namespace.FileCsv,
+    filter: Icons__namespace.Filter,
+    folder: Icons__namespace.Folder,
+    gate: Icons__namespace.CastleTurret,
+    gift: Icons__namespace.Gift,
+    globe: Icons__namespace.Globe,
+    grid: Icons__namespace.GridFour,
+    handHeart: Icons__namespace.HandHeart,
+    hashtag: Icons__namespace.Hashtag,
+    headphone: Icons__namespace.Headphones,
+    heart: Icons__namespace.Heart,
+    house: Icons__namespace.House,
+    information: Icons__namespace.Information,
+    italic: Icons__namespace.Italic,
+    key: Icons__namespace.Key,
+    landscape: Icons__namespace.Images,
+    layer: Icons__namespace.ListPlus,
+    layout: Icons__namespace.Layout,
+    lightbulb: Icons__namespace.Lightbulb,
+    link: Icons__namespace.Link,
+    lock: Icons__namespace.Lock,
+    magic: Icons__namespace.Magic,
+    manyToMany: Icons__namespace.ManyToMany,
+    manyToOne: Icons__namespace.ManyToOne,
+    manyWays: Icons__namespace.ManyWays,
+    medium: Symbols__namespace.Medium,
+    message: Icons__namespace.Message,
+    microphone: Icons__namespace.Microphone,
+    monitor: Icons__namespace.Monitor,
+    moon: Icons__namespace.Moon,
+    music: Icons__namespace.MusicNotes,
+    oneToMany: Icons__namespace.OneToMany,
+    oneToOne: Icons__namespace.OneToOne,
+    oneWay: Icons__namespace.OneWay,
+    paint: Icons__namespace.PaintBrush,
+    paintBrush: Icons__namespace.PaintBrush,
+    paperPlane: Icons__namespace.PaperPlane,
+    pencil: Icons__namespace.Pencil,
+    phone: Icons__namespace.Phone,
+    picture: Icons__namespace.Image,
+    pin: Icons__namespace.Pin,
+    pinMap: Icons__namespace.PinMap,
+    plane: Icons__namespace.Plane,
+    play: Icons__namespace.Play,
+    plus: Icons__namespace.Plus,
+    priceTag: Icons__namespace.PriceTag,
+    puzzle: Icons__namespace.PuzzlePiece,
+    question: Icons__namespace.Question,
+    quote: Icons__namespace.Quotes,
+    refresh: Icons__namespace.ArrowClockwise,
+    restaurant: Icons__namespace.Restaurant,
+    rocket: Icons__namespace.Rocket,
+    rotate: Icons__namespace.ArrowsCounterClockwise,
+    scissors: Icons__namespace.Scissors,
+    search: Icons__namespace.Search,
+    seed: Icons__namespace.Plant,
+    server: Icons__namespace.Server,
+    shield: Icons__namespace.Shield,
+    shirt: Icons__namespace.Shirt,
+    shoppingCart: Icons__namespace.ShoppingCart,
+    slideshow: Icons__namespace.PresentationChart,
+    stack: Icons__namespace.Stack,
+    star: Icons__namespace.Star,
+    store: Icons__namespace.Store,
+    strikeThrough: Icons__namespace.StrikeThrough,
+    sun: Icons__namespace.Sun,
+    television: Icons__namespace.Television,
+    thumbDown: Icons__namespace.ThumbDown,
+    thumbUp: Icons__namespace.ThumbUp,
+    train: Icons__namespace.Train,
+    twitter: Symbols__namespace.X,
+    typhoon: Icons__namespace.Typhoon,
+    underline: Icons__namespace.Underline,
+    user: Icons__namespace.User,
+    volumeMute: Icons__namespace.VolumeMute,
+    volumeUp: Icons__namespace.VolumeUp,
+    walk: Icons__namespace.Walk,
+    wheelchair: Icons__namespace.Wheelchair,
+    write: Icons__namespace.Feather
+};
+
+exports.COMPONENT_ICONS = COMPONENT_ICONS;
+exports.ComponentIcon = ComponentIcon;
+//# sourceMappingURL=ComponentIcon.js.map