@strapi/design-system 1.18.0 → 2.0.0-beta.0

package/dist/v2/MainNav/NavLink.js

@@ -1,102 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const styled = require('styled-components');
-const MainNavContext = require('./MainNavContext.js');
-const Box = require('../../Box/Box.js');
-const BaseLink = require('../../BaseLink/BaseLink.js');
-const Typography = require('../../Typography/Typography.js');
-const Flex = require('../../Flex/Flex.js');
-const Badge = require('../../Badge/Badge.js');
-const Tooltip = require('../../Tooltip/Tooltip.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const React__default = /*#__PURE__*/_interopDefault(React);
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const IconBox = styled__default.default(Box.Box) `
-  svg {
-    width: 1rem;
-    height: 1rem;
-  }
-`;
-const MainNavLinkWrapper = styled__default.default(BaseLink.BaseLink) `
-  position: relative;
-  text-decoration: none;
-  display: block;
-  border-radius: ${({ theme }) => theme.borderRadius};
-  background: ${({ theme }) => theme.colors.neutral0};
-
-  ${Typography.Typography} {
-    color: ${({ theme }) => theme.colors.neutral600};
-  }
-
-  svg path {
-    fill: ${({ theme }) => theme.colors.neutral500};
-  }
-
-  &:hover {
-    background: ${({ theme }) => theme.colors.neutral100};
-
-    ${Typography.Typography} {
-      color: ${({ theme }) => theme.colors.neutral700};
-    }
-
-    svg path {
-      fill: ${({ theme }) => theme.colors.neutral600};
-    }
-  }
-
-  &.active {
-    background: ${({ theme }) => theme.colors.primary100};
-
-    svg path {
-      fill: ${({ theme }) => theme.colors.primary600};
-    }
-
-    ${Typography.Typography} {
-      color: ${({ theme }) => theme.colors.primary600};
-      font-weight: 500;
-    }
-  }
-`;
-const MainNavRow = styled__default.default(Flex.Flex) `
-  padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[3]}`};
-`;
-const CustomBadge = styled__default.default(Badge.Badge) `
-  ${({ theme, condensed }) => condensed &&
-    `
-	  position: absolute;
-    // Values based on visual aspect 
-    top: -${theme.spaces[3]};
-    right:  -${theme.spaces[1]};
-  `}
-
-  ${Typography.Typography} {
-    //find a solution to remove !important
-    color: ${({ theme }) => theme.colors.neutral0} !important;
-    line-height: 0;
-  }
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  min-width: ${({ theme }) => theme.spaces[6]};
-  height: ${({ theme }) => theme.spaces[5]};
-  padding: ${({ theme }) => `0 ${theme.spaces[2]}`};
-  border-radius: ${({ theme }) => theme.spaces[10]};
-  background: ${({ theme }) => theme.colors.primary600};
-`;
-const NavLink = React__default.default.forwardRef(({ children, icon, badgeContent, badgeAriaLabel, ...props }, ref) => {
-    const condensed = MainNavContext.useMainNav();
-    if (condensed) {
-        return (jsxRuntime.jsx(MainNavLinkWrapper, { ref: ref, ...props, children: jsxRuntime.jsx(Tooltip.Tooltip, { position: "right", label: children, children: jsxRuntime.jsxs(MainNavRow, { as: "span", justifyContent: "center", children: [jsxRuntime.jsx(IconBox, { "aria-hidden": true, paddingRight: 0, as: "span", children: icon }), badgeContent && (jsxRuntime.jsx(CustomBadge, { condensed: true, "aria-label": badgeAriaLabel, children: badgeContent }))] }) }) }));
-    }
-    return (jsxRuntime.jsx(MainNavLinkWrapper, { ref: ref, ...props, children: jsxRuntime.jsxs(MainNavRow, { as: "span", justifyContent: "space-between", children: [jsxRuntime.jsxs(Flex.Flex, { children: [jsxRuntime.jsx(IconBox, { "aria-hidden": true, paddingRight: 3, as: "span", children: icon }), jsxRuntime.jsx(Typography.Typography, { children: children })] }), badgeContent && (jsxRuntime.jsx(CustomBadge, { justifyContent: "center", "aria-label": badgeAriaLabel, children: badgeContent }))] }) }));
-});
-
-exports.NavLink = NavLink;

package/dist/v2/MainNav/NavLink.mjs

@@ -1,93 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import React__default from 'react';
-import styled from 'styled-components';
-import { useMainNav } from './MainNavContext.mjs';
-import { Box } from '../../Box/Box.mjs';
-import { BaseLink } from '../../BaseLink/BaseLink.mjs';
-import { Typography } from '../../Typography/Typography.mjs';
-import { Flex } from '../../Flex/Flex.mjs';
-import { Badge } from '../../Badge/Badge.mjs';
-import { Tooltip } from '../../Tooltip/Tooltip.mjs';
-
-const IconBox = styled(Box) `
-  svg {
-    width: 1rem;
-    height: 1rem;
-  }
-`;
-const MainNavLinkWrapper = styled(BaseLink) `
-  position: relative;
-  text-decoration: none;
-  display: block;
-  border-radius: ${({ theme }) => theme.borderRadius};
-  background: ${({ theme }) => theme.colors.neutral0};
-
-  ${Typography} {
-    color: ${({ theme }) => theme.colors.neutral600};
-  }
-
-  svg path {
-    fill: ${({ theme }) => theme.colors.neutral500};
-  }
-
-  &:hover {
-    background: ${({ theme }) => theme.colors.neutral100};
-
-    ${Typography} {
-      color: ${({ theme }) => theme.colors.neutral700};
-    }
-
-    svg path {
-      fill: ${({ theme }) => theme.colors.neutral600};
-    }
-  }
-
-  &.active {
-    background: ${({ theme }) => theme.colors.primary100};
-
-    svg path {
-      fill: ${({ theme }) => theme.colors.primary600};
-    }
-
-    ${Typography} {
-      color: ${({ theme }) => theme.colors.primary600};
-      font-weight: 500;
-    }
-  }
-`;
-const MainNavRow = styled(Flex) `
-  padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[3]}`};
-`;
-const CustomBadge = styled(Badge) `
-  ${({ theme, condensed }) => condensed &&
-    `
-	  position: absolute;
-    // Values based on visual aspect 
-    top: -${theme.spaces[3]};
-    right:  -${theme.spaces[1]};
-  `}
-
-  ${Typography} {
-    //find a solution to remove !important
-    color: ${({ theme }) => theme.colors.neutral0} !important;
-    line-height: 0;
-  }
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  min-width: ${({ theme }) => theme.spaces[6]};
-  height: ${({ theme }) => theme.spaces[5]};
-  padding: ${({ theme }) => `0 ${theme.spaces[2]}`};
-  border-radius: ${({ theme }) => theme.spaces[10]};
-  background: ${({ theme }) => theme.colors.primary600};
-`;
-const NavLink = React__default.forwardRef(({ children, icon, badgeContent, badgeAriaLabel, ...props }, ref) => {
-    const condensed = useMainNav();
-    if (condensed) {
-        return (jsx(MainNavLinkWrapper, { ref: ref, ...props, children: jsx(Tooltip, { position: "right", label: children, children: jsxs(MainNavRow, { as: "span", justifyContent: "center", children: [jsx(IconBox, { "aria-hidden": true, paddingRight: 0, as: "span", children: icon }), badgeContent && (jsx(CustomBadge, { condensed: true, "aria-label": badgeAriaLabel, children: badgeContent }))] }) }) }));
-    }
-    return (jsx(MainNavLinkWrapper, { ref: ref, ...props, children: jsxs(MainNavRow, { as: "span", justifyContent: "space-between", children: [jsxs(Flex, { children: [jsx(IconBox, { "aria-hidden": true, paddingRight: 3, as: "span", children: icon }), jsx(Typography, { children: children })] }), badgeContent && (jsx(CustomBadge, { justifyContent: "center", "aria-label": badgeAriaLabel, children: badgeContent }))] }) }));
-});
-
-export { NavLink };

package/dist/v2/MainNav/NavSection.js

@@ -1,28 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const MainNavContext = require('./MainNavContext.js');
-const Flex = require('../../Flex/Flex.js');
-const Box = require('../../Box/Box.js');
-const Divider = require('../../Divider/Divider.js');
-const VisuallyHidden = require('../../VisuallyHidden/VisuallyHidden.js');
-const Typography = require('../../Typography/Typography.js');
-
-const NavSection = ({ label, children, horizontal = false, spacing = 2, ...props }) => {
-    const condensed = MainNavContext.useMainNav();
-    if (condensed) {
-        return (jsxRuntime.jsxs(Flex.Flex, { direction: "column", alignItems: "stretch", gap: 2, children: [jsxRuntime.jsxs(Box.Box, { paddingTop: 1, paddingBottom: 1, background: "neutral0", hasRadius: true, as: "span", children: [jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { children: jsxRuntime.jsx("span", { children: label }) })] }), jsxRuntime.jsx(Flex.Flex, { as: "ul", gap: spacing, direction: horizontal ? 'row' : 'column', alignItems: horizontal ? 'center' : 'stretch', ...props, children: React.Children.map(children, (child, index) => {
-                        // eslint-disable-next-line react/no-array-index-key
-                        return jsxRuntime.jsx("li", { children: child }, index);
-                    }) })] }));
-    }
-    return (jsxRuntime.jsxs(Flex.Flex, { direction: "column", alignItems: "stretch", gap: 2, children: [jsxRuntime.jsx(Box.Box, { paddingTop: 1, paddingBottom: 1, background: "neutral0", paddingRight: 3, paddingLeft: 3, hasRadius: true, as: "span", children: jsxRuntime.jsx(Typography.Typography, { variant: "sigma", textColor: "neutral600", children: label }) }), jsxRuntime.jsx(Flex.Flex, { as: "ul", gap: spacing, direction: horizontal ? 'row' : 'column', alignItems: horizontal ? 'center' : 'stretch', ...props, children: React.Children.map(children, (child, index) => {
-                    // eslint-disable-next-line react/no-array-index-key
-                    return jsxRuntime.jsx("li", { children: child }, index);
-                }) })] }));
-};
-
-exports.NavSection = NavSection;

package/dist/v2/MainNav/NavSection.mjs

@@ -1,24 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Children } from 'react';
-import { useMainNav } from './MainNavContext.mjs';
-import { Flex } from '../../Flex/Flex.mjs';
-import { Box } from '../../Box/Box.mjs';
-import { Divider } from '../../Divider/Divider.mjs';
-import { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden.mjs';
-import { Typography } from '../../Typography/Typography.mjs';
-
-const NavSection = ({ label, children, horizontal = false, spacing = 2, ...props }) => {
-    const condensed = useMainNav();
-    if (condensed) {
-        return (jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 2, children: [jsxs(Box, { paddingTop: 1, paddingBottom: 1, background: "neutral0", hasRadius: true, as: "span", children: [jsx(Divider, {}), jsx(VisuallyHidden, { children: jsx("span", { children: label }) })] }), jsx(Flex, { as: "ul", gap: spacing, direction: horizontal ? 'row' : 'column', alignItems: horizontal ? 'center' : 'stretch', ...props, children: Children.map(children, (child, index) => {
-                        // eslint-disable-next-line react/no-array-index-key
-                        return jsx("li", { children: child }, index);
-                    }) })] }));
-    }
-    return (jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 2, children: [jsx(Box, { paddingTop: 1, paddingBottom: 1, background: "neutral0", paddingRight: 3, paddingLeft: 3, hasRadius: true, as: "span", children: jsx(Typography, { variant: "sigma", textColor: "neutral600", children: label }) }), jsx(Flex, { as: "ul", gap: spacing, direction: horizontal ? 'row' : 'column', alignItems: horizontal ? 'center' : 'stretch', ...props, children: Children.map(children, (child, index) => {
-                    // eslint-disable-next-line react/no-array-index-key
-                    return jsx("li", { children: child }, index);
-                }) })] }));
-};
-
-export { NavSection };

package/dist/v2/MainNav/NavSections.js

@@ -1,26 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const styled = require('styled-components');
-const Box = require('../../Box/Box.js');
-const Flex = require('../../Flex/Flex.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const BoxGrow = styled__default.default(Box.Box) `
-  flex-grow: 1;
-  overflow-y: auto;
-`;
-const NavSections = ({ children, spacing = 4, horizontal = false, ...props }) => {
-    return (jsxRuntime.jsx(BoxGrow, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8, children: jsxRuntime.jsx(Flex.Flex, { as: "ul", gap: spacing, direction: horizontal ? 'row' : 'column', alignItems: horizontal ? 'center' : 'stretch', ...props, children: React.Children.map(children, (child, index) => {
-                // eslint-disable-next-line react/no-array-index-key
-                return jsxRuntime.jsx("li", { children: child }, index);
-            }) }) }));
-};
-
-exports.NavSections = NavSections;

package/dist/v2/MainNav/NavSections.mjs

@@ -1,18 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { Children } from 'react';
-import styled from 'styled-components';
-import { Box } from '../../Box/Box.mjs';
-import { Flex } from '../../Flex/Flex.mjs';
-
-const BoxGrow = styled(Box) `
-  flex-grow: 1;
-  overflow-y: auto;
-`;
-const NavSections = ({ children, spacing = 4, horizontal = false, ...props }) => {
-    return (jsx(BoxGrow, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8, children: jsx(Flex, { as: "ul", gap: spacing, direction: horizontal ? 'row' : 'column', alignItems: horizontal ? 'center' : 'stretch', ...props, children: Children.map(children, (child, index) => {
-                // eslint-disable-next-line react/no-array-index-key
-                return jsx("li", { children: child }, index);
-            }) }) }));
-};
-
-export { NavSections };

package/dist/v2/MainNav/NavUser.js

@@ -1,28 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const styled = require('styled-components');
-const MainNavContext = require('./MainNavContext.js');
-const Box = require('../../Box/Box.js');
-const Flex = require('../../Flex/Flex.js');
-const Avatar = require('../../Avatar/Avatar.js');
-const VisuallyHidden = require('../../VisuallyHidden/VisuallyHidden.js');
-const Typography = require('../../Typography/Typography.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const React__default = /*#__PURE__*/_interopDefault(React);
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const NavUserBox = styled__default.default(Box.Box) `
-  border-top: 1px solid ${({ theme }) => theme.colors.neutral150};
-`;
-const NavUser = React__default.default.forwardRef(({ src, children, initials, ...props }, ref) => {
-    const condensed = MainNavContext.useMainNav();
-    return (jsxRuntime.jsx(NavUserBox, { paddingTop: 3, paddingBottom: 3, paddingLeft: 5, paddingRight: 5, ...props, children: jsxRuntime.jsxs(Flex.Flex, { as: "button", justifyContent: condensed ? 'center' : undefined, ref: ref, children: [src ? jsxRuntime.jsx(Avatar.Avatar, { src: src, alt: "", "aria-hidden": true }) : jsxRuntime.jsx(Avatar.Initials, { children: initials }), condensed ? (jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { children: jsxRuntime.jsx("span", { children: children }) })) : (jsxRuntime.jsx(Box.Box, { width: `${130 / 16}rem`, paddingLeft: 2, as: "span", children: jsxRuntime.jsx(Typography.Typography, { ellipsis: true, textColor: "neutral600", children: children }) }))] }) }));
-});
-
-exports.NavUser = NavUser;

package/dist/v2/MainNav/NavUser.mjs

@@ -1,19 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import React__default from 'react';
-import styled from 'styled-components';
-import { useMainNav } from './MainNavContext.mjs';
-import { Box } from '../../Box/Box.mjs';
-import { Flex } from '../../Flex/Flex.mjs';
-import { Avatar, Initials } from '../../Avatar/Avatar.mjs';
-import { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden.mjs';
-import { Typography } from '../../Typography/Typography.mjs';
-
-const NavUserBox = styled(Box) `
-  border-top: 1px solid ${({ theme }) => theme.colors.neutral150};
-`;
-const NavUser = React__default.forwardRef(({ src, children, initials, ...props }, ref) => {
-    const condensed = useMainNav();
-    return (jsx(NavUserBox, { paddingTop: 3, paddingBottom: 3, paddingLeft: 5, paddingRight: 5, ...props, children: jsxs(Flex, { as: "button", justifyContent: condensed ? 'center' : undefined, ref: ref, children: [src ? jsx(Avatar, { src: src, alt: "", "aria-hidden": true }) : jsx(Initials, { children: initials }), condensed ? (jsx(VisuallyHidden, { children: jsx("span", { children: children }) })) : (jsx(Box, { width: `${130 / 16}rem`, paddingLeft: 2, as: "span", children: jsx(Typography, { ellipsis: true, textColor: "neutral600", children: children }) }))] }) }));
-});
-
-export { NavUser };

package/dist/v2/MainNav/index.js

@@ -1,23 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const MainNav = require('./MainNav.js');
-const NavBrand = require('./NavBrand.js');
-const NavCondense = require('./NavCondense.js');
-const NavFooter = require('./NavFooter.js');
-const NavLink = require('./NavLink.js');
-const NavSection = require('./NavSection.js');
-const NavSections = require('./NavSections.js');
-const NavUser = require('./NavUser.js');
-
-
-
-exports.MainNav = MainNav.MainNav;
-exports.NavBrand = NavBrand.NavBrand;
-exports.NavCondense = NavCondense.NavCondense;
-exports.NavFooter = NavFooter.NavFooter;
-exports.NavLink = NavLink.NavLink;
-exports.NavSection = NavSection.NavSection;
-exports.NavSections = NavSections.NavSections;
-exports.NavUser = NavUser.NavUser;

package/dist/v2/MainNav/index.mjs

@@ -1,8 +0,0 @@
-export { MainNav } from './MainNav.mjs';
-export { NavBrand } from './NavBrand.mjs';
-export { NavCondense } from './NavCondense.mjs';
-export { NavFooter } from './NavFooter.mjs';
-export { NavLink } from './NavLink.mjs';
-export { NavSection } from './NavSection.mjs';
-export { NavSections } from './NavSections.mjs';
-export { NavUser } from './NavUser.mjs';

package/dist/v2/Pagination/Pagination.js

@@ -1,39 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const PaginationContext = require('./PaginationContext.js');
-const Box = require('../../Box/Box.js');
-const Flex = require('../../Flex/Flex.js');
-
-function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
-    const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
-    if (e) {
-        for (const k in e) {
-            if (k !== 'default') {
-                const d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: () => e[k]
-                });
-            }
-        }
-    }
-    n.default = e;
-    return Object.freeze(n);
-}
-
-const React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-const Pagination = ({ children, label = 'Pagination', activePage, pageCount }) => {
-    const context = React__namespace.useMemo(() => ({ activePage, pageCount }), [activePage, pageCount]);
-    return (jsxRuntime.jsx(PaginationContext.PaginationContext.Provider, { value: context, children: jsxRuntime.jsx(Box.Box, { "aria-label": label, as: "nav", children: jsxRuntime.jsx(Flex.Flex, { as: "ol", gap: 1, children: React__namespace.Children.map(children, (child, index) => {
-                    // eslint-disable-next-line react/no-array-index-key
-                    return jsxRuntime.jsx("li", { children: child }, index);
-                }) }) }) }));
-};
-
-exports.Pagination = Pagination;

package/dist/v2/Pagination/Pagination.mjs

@@ -1,15 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import * as React from 'react';
-import { PaginationContext } from './PaginationContext.mjs';
-import { Box } from '../../Box/Box.mjs';
-import { Flex } from '../../Flex/Flex.mjs';
-
-const Pagination = ({ children, label = 'Pagination', activePage, pageCount }) => {
-    const context = React.useMemo(() => ({ activePage, pageCount }), [activePage, pageCount]);
-    return (jsx(PaginationContext.Provider, { value: context, children: jsx(Box, { "aria-label": label, as: "nav", children: jsx(Flex, { as: "ol", gap: 1, children: React.Children.map(children, (child, index) => {
-                    // eslint-disable-next-line react/no-array-index-key
-                    return jsx("li", { children: child }, index);
-                }) }) }) }));
-};
-
-export { Pagination };

package/dist/v2/Pagination/PaginationContext.js

@@ -1,11 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const React = require('react');
-
-const PaginationContext = React.createContext({ activePage: 1, pageCount: 1 });
-const usePagination = () => React.useContext(PaginationContext);
-
-exports.PaginationContext = PaginationContext;
-exports.usePagination = usePagination;

package/dist/v2/Pagination/PaginationContext.mjs

@@ -1,6 +0,0 @@
-import { createContext, useContext } from 'react';
-
-const PaginationContext = createContext({ activePage: 1, pageCount: 1 });
-const usePagination = () => useContext(PaginationContext);
-
-export { PaginationContext, usePagination };

package/dist/v2/Pagination/assets/next.svg.js

@@ -1,5 +0,0 @@
-'use strict';
-
-const next = "data:image/svg+xml,%3csvg%20width='7'%20height='10'%20viewBox='0%200%207%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M-0.000195503%201.175L3.81647%205L-0.000195503%208.825L1.1748%2010L6.1748%205L1.1748%200L-0.000195503%201.175Z'%20fill='%238E8EA9'/%3e%3c/svg%3e";
-
-module.exports = next;

package/dist/v2/Pagination/assets/next.svg.mjs

@@ -1,3 +0,0 @@
-const next = "data:image/svg+xml,%3csvg%20width='7'%20height='10'%20viewBox='0%200%207%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M-0.000195503%201.175L3.81647%205L-0.000195503%208.825L1.1748%2010L6.1748%205L1.1748%200L-0.000195503%201.175Z'%20fill='%238E8EA9'/%3e%3c/svg%3e";
-
-export { next as default };

package/dist/v2/Pagination/assets/previous.svg.js

@@ -1,5 +0,0 @@
-'use strict';
-
-const previous = "data:image/svg+xml,%3csvg%20width='7'%20height='10'%20viewBox='0%200%207%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M6.175%208.825L2.35833%205L6.175%201.175L5%200L0%205L5%2010L6.175%208.825Z'%20fill='%238E8EA9'/%3e%3c/svg%3e";
-
-module.exports = previous;

package/dist/v2/Pagination/assets/previous.svg.mjs

@@ -1,3 +0,0 @@
-const previous = "data:image/svg+xml,%3csvg%20width='7'%20height='10'%20viewBox='0%200%207%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M6.175%208.825L2.35833%205L6.175%201.175L5%200L0%205L5%2010L6.175%208.825Z'%20fill='%238E8EA9'/%3e%3c/svg%3e";
-
-export { previous as default };

package/dist/v2/Pagination/components.js

@@ -1,83 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const icons = require('@strapi/icons');
-const styled = require('styled-components');
-const PaginationContext = require('./PaginationContext.js');
-const utils = require('../../themes/utils.js');
-const BaseLink = require('../../BaseLink/BaseLink.js');
-const VisuallyHidden = require('../../VisuallyHidden/VisuallyHidden.js');
-const Typography = require('../../Typography/Typography.js');
-const Box = require('../../Box/Box.js');
-
-const _interopDefault = e => e && e.__esModule ? e : { default: e };
-
-const React__default = /*#__PURE__*/_interopDefault(React);
-const styled__default = /*#__PURE__*/_interopDefault(styled);
-
-const transientProps = {
-    active: true,
-};
-const LinkWrapper = styled__default.default(BaseLink.BaseLink).withConfig({
-    shouldForwardProp: (prop, defPropValFN) => !transientProps[prop] && defPropValFN(prop),
-}) `
-  padding: ${({ theme }) => theme.spaces[3]};
-  border-radius: ${({ theme }) => theme.borderRadius};
-  box-shadow: ${({ active, theme }) => (active ? theme.shadows.filterShadow : undefined)};
-  text-decoration: none;
-  display: flex;
-
-  ${utils.buttonFocusStyle}
-`;
-const PageLinkWrapper = styled__default.default(LinkWrapper) `
-  color: ${({ theme, active }) => (active ? theme.colors.primary700 : theme.colors.neutral800)};
-  background: ${({ theme, active }) => (active ? theme.colors.neutral0 : undefined)};
-
-  &:hover {
-    box-shadow: ${({ theme }) => theme.shadows.filterShadow};
-  }
-`;
-const ActionLinkWrapper = styled__default.default(LinkWrapper) `
-  font-size: ${11 / 16}rem;
-
-  svg path {
-    fill: ${(p) => (p['aria-disabled'] ? p.theme.colors.neutral300 : p.theme.colors.neutral600)};
-  }
-
-  &:focus,
-  &:hover {
-    svg path {
-      fill: ${(p) => (p['aria-disabled'] ? p.theme.colors.neutral300 : p.theme.colors.neutral700)};
-    }
-  }
-
-  ${(p) => p['aria-disabled']
-    ? `
-  pointer-events: none;
-    `
-    : undefined}
-`;
-const PreviousLink = React__default.default.forwardRef(({ children, ...props }, ref) => {
-    const { activePage } = PaginationContext.usePagination();
-    const disabled = activePage === 1;
-    return (jsxRuntime.jsxs(ActionLinkWrapper, { ref: ref, "aria-disabled": disabled, tabIndex: disabled ? -1 : undefined, ...props, children: [jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { children: children }), jsxRuntime.jsx(icons.ChevronLeft, { "aria-hidden": true })] }));
-});
-const NextLink = React__default.default.forwardRef(({ children, ...props }, ref) => {
-    const { activePage, pageCount } = PaginationContext.usePagination();
-    const disabled = activePage === pageCount;
-    return (jsxRuntime.jsxs(ActionLinkWrapper, { ref: ref, "aria-disabled": disabled, tabIndex: disabled ? -1 : undefined, ...props, children: [jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { children: children }), jsxRuntime.jsx(icons.ChevronRight, { "aria-hidden": true })] }));
-});
-const PageLink = React__default.default.forwardRef(({ number, children, ...props }, ref) => {
-    const { activePage } = PaginationContext.usePagination();
-    const isActive = activePage === number;
-    return (jsxRuntime.jsxs(PageLinkWrapper, { ref: ref, ...props, active: isActive, children: [jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { children: children }), jsxRuntime.jsx(Typography.Typography, { "aria-hidden": true, fontWeight: isActive ? 'bold' : undefined, lineHeight: "revert", variant: "pi", children: number })] }));
-});
-const Dots = ({ children, ...props }) => (jsxRuntime.jsxs(Box.Box, { ...props, children: [jsxRuntime.jsx(VisuallyHidden.VisuallyHidden, { children: children }), jsxRuntime.jsx(Typography.Typography, { "aria-hidden": true, lineHeight: "revert", textColor: "neutral800", variant: "pi", children: "\u2026" })] }));
-
-exports.Dots = Dots;
-exports.NextLink = NextLink;
-exports.PageLink = PageLink;
-exports.PreviousLink = PreviousLink;

package/dist/v2/Pagination/components.mjs

@@ -1,71 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import React__default from 'react';
-import { ChevronLeft, ChevronRight } from '@strapi/icons';
-import styled from 'styled-components';
-import { usePagination } from './PaginationContext.mjs';
-import { buttonFocusStyle } from '../../themes/utils.mjs';
-import { BaseLink } from '../../BaseLink/BaseLink.mjs';
-import { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden.mjs';
-import { Typography } from '../../Typography/Typography.mjs';
-import { Box } from '../../Box/Box.mjs';
-
-const transientProps = {
-    active: true,
-};
-const LinkWrapper = styled(BaseLink).withConfig({
-    shouldForwardProp: (prop, defPropValFN) => !transientProps[prop] && defPropValFN(prop),
-}) `
-  padding: ${({ theme }) => theme.spaces[3]};
-  border-radius: ${({ theme }) => theme.borderRadius};
-  box-shadow: ${({ active, theme }) => (active ? theme.shadows.filterShadow : undefined)};
-  text-decoration: none;
-  display: flex;
-
-  ${buttonFocusStyle}
-`;
-const PageLinkWrapper = styled(LinkWrapper) `
-  color: ${({ theme, active }) => (active ? theme.colors.primary700 : theme.colors.neutral800)};
-  background: ${({ theme, active }) => (active ? theme.colors.neutral0 : undefined)};
-
-  &:hover {
-    box-shadow: ${({ theme }) => theme.shadows.filterShadow};
-  }
-`;
-const ActionLinkWrapper = styled(LinkWrapper) `
-  font-size: ${11 / 16}rem;
-
-  svg path {
-    fill: ${(p) => (p['aria-disabled'] ? p.theme.colors.neutral300 : p.theme.colors.neutral600)};
-  }
-
-  &:focus,
-  &:hover {
-    svg path {
-      fill: ${(p) => (p['aria-disabled'] ? p.theme.colors.neutral300 : p.theme.colors.neutral700)};
-    }
-  }
-
-  ${(p) => p['aria-disabled']
-    ? `
-  pointer-events: none;
-    `
-    : undefined}
-`;
-const PreviousLink = React__default.forwardRef(({ children, ...props }, ref) => {
-    const { activePage } = usePagination();
-    const disabled = activePage === 1;
-    return (jsxs(ActionLinkWrapper, { ref: ref, "aria-disabled": disabled, tabIndex: disabled ? -1 : undefined, ...props, children: [jsx(VisuallyHidden, { children: children }), jsx(ChevronLeft, { "aria-hidden": true })] }));
-});
-const NextLink = React__default.forwardRef(({ children, ...props }, ref) => {
-    const { activePage, pageCount } = usePagination();
-    const disabled = activePage === pageCount;
-    return (jsxs(ActionLinkWrapper, { ref: ref, "aria-disabled": disabled, tabIndex: disabled ? -1 : undefined, ...props, children: [jsx(VisuallyHidden, { children: children }), jsx(ChevronRight, { "aria-hidden": true })] }));
-});
-const PageLink = React__default.forwardRef(({ number, children, ...props }, ref) => {
-    const { activePage } = usePagination();
-    const isActive = activePage === number;
-    return (jsxs(PageLinkWrapper, { ref: ref, ...props, active: isActive, children: [jsx(VisuallyHidden, { children: children }), jsx(Typography, { "aria-hidden": true, fontWeight: isActive ? 'bold' : undefined, lineHeight: "revert", variant: "pi", children: number })] }));
-});
-const Dots = ({ children, ...props }) => (jsxs(Box, { ...props, children: [jsx(VisuallyHidden, { children: children }), jsx(Typography, { "aria-hidden": true, lineHeight: "revert", textColor: "neutral800", variant: "pi", children: "\u2026" })] }));
-
-export { Dots, NextLink, PageLink, PreviousLink };