@strapi/design-system 1.7.1 → 1.7.2-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion/Accordion.cjs +5 -5
- package/dist/Accordion/AccordionGroup.cjs +4 -4
- package/dist/Accordion/AccordionToggle.cjs +6 -6
- package/dist/Alert/Alert.cjs +10 -10
- package/dist/Avatar/Avatar.cjs +5 -5
- package/dist/Avatar/AvatarGroup.cjs +3 -3
- package/dist/Badge/Badge.cjs +4 -4
- package/dist/BaseButton/BaseButton.cjs +2 -2
- package/dist/BaseCheckbox/BaseCheckbox.cjs +2 -2
- package/dist/BaseLink/BaseLink.cjs +1 -1
- package/dist/BaseRadio/BaseRadio.cjs +8 -8
- package/dist/Box/Box.cjs +2 -2
- package/dist/Breadcrumbs/Breadcrumbs.cjs +3 -3
- package/dist/Button/Button.cjs +11 -11
- package/dist/Card/CardAction.cjs +2 -2
- package/dist/Card/CardAsset.cjs +4 -4
- package/dist/Card/CardBadge.cjs +3 -3
- package/dist/Card/CardContent.cjs +2 -2
- package/dist/Card/CardHeader.cjs +2 -2
- package/dist/CarouselInput/Carousel.cjs +6 -6
- package/dist/CarouselInput/CarouselImage.cjs +3 -3
- package/dist/CarouselInput/CarouselInput.cjs +1 -1
- package/dist/CarouselInput/CarouselSlide.cjs +2 -2
- package/dist/Checkbox/Checkbox.cjs +3 -3
- package/dist/Combobox/Combobox.cjs +9 -9
- package/dist/DatePicker/DatePicker.cjs +5 -5
- package/dist/DatePicker/DatePickerTd.cjs +3 -3
- package/dist/DatePicker/DatePickerTh.cjs +4 -4
- package/dist/DatePicker/components.cjs +8 -8
- package/dist/Dialog/Dialog.cjs +6 -6
- package/dist/Dialog/DialogBody.cjs +2 -2
- package/dist/Dialog/DialogFooter.cjs +3 -3
- package/dist/DismissibleLayer/index.cjs +1 -1
- package/dist/Divider/Divider.cjs +2 -2
- package/dist/EmptyStateLayout/EmptyStateLayout.cjs +3 -3
- package/dist/Field/FieldAction.cjs +2 -2
- package/dist/Field/FieldInput.cjs +7 -7
- package/dist/Field/FieldLabel.cjs +4 -4
- package/dist/Flex/Flex.cjs +3 -3
- package/dist/Grid/Grid.cjs +3 -3
- package/dist/Grid/GridItem.cjs +2 -2
- package/dist/Icon/Icon.cjs +4 -4
- package/dist/IconButton/IconButton.cjs +4 -4
- package/dist/JSONInput/JSONInputContainer.cjs +3 -3
- package/dist/Layout/ActionLayout.cjs +3 -3
- package/dist/Layout/ContentLayout.cjs +1 -1
- package/dist/Layout/GridLayout.cjs +3 -3
- package/dist/Layout/HeaderLayout.cjs +4 -4
- package/dist/Layout/Layout.cjs +3 -3
- package/dist/Layout/TwoColsLayout.cjs +1 -1
- package/dist/Link/Link.cjs +5 -5
- package/dist/LinkButton/LinkButton.cjs +7 -7
- package/dist/Loader/Loader.cjs +5 -5
- package/dist/Main/Main.cjs +2 -2
- package/dist/Main/SkipToContent.cjs +2 -2
- package/dist/MainNav/MainNav.cjs +2 -2
- package/dist/MainNav/NavBrand.cjs +6 -6
- package/dist/MainNav/NavCondense.cjs +3 -3
- package/dist/MainNav/NavFooter.cjs +1 -1
- package/dist/MainNav/NavLink.cjs +10 -10
- package/dist/MainNav/NavSection.cjs +1 -1
- package/dist/MainNav/NavSections.cjs +2 -2
- package/dist/MainNav/NavUser.cjs +3 -3
- package/dist/ModalLayout/ModalBody.cjs +2 -2
- package/dist/ModalLayout/ModalFooter.cjs +3 -3
- package/dist/ModalLayout/ModalHeader.cjs +2 -2
- package/dist/ModalLayout/ModalLayout.cjs +4 -4
- package/dist/NumberInput/NumberInput.cjs +6 -6
- package/dist/Pagination/Pagination.cjs +2 -2
- package/dist/Pagination/components.cjs +7 -7
- package/dist/Popover/Popover.cjs +3 -3
- package/dist/Portal/Portal.cjs +1 -1
- package/dist/ProgressBar/ProgressBar.cjs +2 -2
- package/dist/Radio/Radio.cjs +2 -2
- package/dist/Searchbar/Searchbar.cjs +7 -7
- package/dist/Select/MultiSelect.cjs +7 -7
- package/dist/Select/MultiSelectNested.cjs +3 -3
- package/dist/Select/Select.cjs +2 -2
- package/dist/Select/SelectList.cjs +2 -2
- package/dist/Select/SelectParts.cjs +10 -10
- package/dist/Select/SingleSelect.cjs +1 -1
- package/dist/SimpleMenu/SimpleMenu.cjs +11 -11
- package/dist/Stack/Stack.cjs +5 -5
- package/dist/Status/Status.cjs +7 -7
- package/dist/SubNav/SubNav.cjs +5 -5
- package/dist/SubNav/SubNavHeader.cjs +3 -3
- package/dist/SubNav/SubNavLink.cjs +5 -5
- package/dist/SubNav/SubNavLinkSection.cjs +6 -6
- package/dist/SubNav/SubNavSection.cjs +3 -3
- package/dist/SubNav/SubNavSectionLabel.cjs +4 -4
- package/dist/SubNav/SubNavSections.cjs +1 -1
- package/dist/Switch/Switch.cjs +5 -5
- package/dist/Table/Cell.cjs +3 -3
- package/dist/Table/TFooter.cjs +5 -5
- package/dist/Table/Table.cjs +5 -5
- package/dist/Table/Tbody.cjs +2 -2
- package/dist/Table/Thead.cjs +2 -2
- package/dist/Table/Tr.cjs +2 -2
- package/dist/Tabs/TabGroup.cjs +1 -1
- package/dist/Tabs/TabPanels.cjs +1 -1
- package/dist/Tabs/Tabs.cjs +2 -2
- package/dist/Tabs/components.cjs +17 -17
- package/dist/Tag/Tag.cjs +4 -4
- package/dist/TextButton/TextButton.cjs +6 -6
- package/dist/Textarea/Textarea.cjs +2 -2
- package/dist/Textarea/TextareaInput.cjs +4 -4
- package/dist/TimePicker/TimePicker.cjs +3 -3
- package/dist/ToggleCheckbox/ToggleCheckbox.cjs +8 -8
- package/dist/ToggleInput/ToggleInput.cjs +3 -3
- package/dist/Tooltip/Tooltip.cjs +2 -2
- package/dist/Typography/Typography.cjs +8 -8
- package/dist/VisuallyHidden/VisuallyHidden.cjs +2 -2
- package/dist/hooks/useComposeRefs.cjs +1 -1
- package/dist/hooks/useControllableState.cjs +1 -1
- package/dist/hooks/useId.cjs +1 -1
- package/dist/v2/Breadcrumbs/Breadcrumbs.cjs +3 -3
- package/dist/v2/Breadcrumbs/Crumb.cjs +1 -1
- package/dist/v2/Breadcrumbs/CrumbLink.cjs +2 -2
- package/dist/v2/Breadcrumbs/CrumbSimpleMenu.cjs +2 -2
- package/dist/v2/Link/Link.cjs +3 -3
- package/dist/v2/LinkButton/LinkButton.cjs +7 -7
- package/dist/v2/MainNav/MainNav.cjs +2 -2
- package/dist/v2/MainNav/NavBrand.cjs +6 -6
- package/dist/v2/MainNav/NavCondense.cjs +3 -3
- package/dist/v2/MainNav/NavFooter.cjs +1 -1
- package/dist/v2/MainNav/NavLink.cjs +10 -10
- package/dist/v2/MainNav/NavSection.cjs +1 -1
- package/dist/v2/MainNav/NavSections.cjs +2 -2
- package/dist/v2/MainNav/NavUser.cjs +3 -3
- package/dist/v2/Pagination/Pagination.cjs +2 -2
- package/dist/v2/Pagination/components.cjs +7 -7
- package/dist/v2/SimpleMenu/Menu.cjs +13 -13
- package/dist/v2/SubNav/SubNav.cjs +5 -5
- package/dist/v2/SubNav/SubNavHeader.cjs +3 -3
- package/dist/v2/SubNav/SubNavLink.cjs +4 -4
- package/dist/v2/SubNav/SubNavLinkSection.cjs +6 -6
- package/dist/v2/SubNav/SubNavSection.cjs +3 -3
- package/dist/v2/SubNav/SubNavSectionLabel.cjs +4 -4
- package/dist/v2/SubNav/SubNavSections.cjs +1 -1
- package/package.json +4 -4
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),S=require("react"),h=require("react-router-dom"),v=require("styled-components"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),S=require("react"),h=require("react-router-dom"),v=require("styled-components"),o=require("../Button/utils.cjs"),_=require("../BaseButton/BaseButton.cjs"),c=require("../Flex/Flex.cjs"),j=require("../Typography/Typography.cjs"),m=e=>e&&e.__esModule?e:{default:e};function x(e){if(e&&e.__esModule)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const q=x(S),k=m(v),B=k.default(_.BaseButtonWrapper)`
|
|
2
2
|
&[aria-disabled='true'] {
|
|
3
|
-
${
|
|
3
|
+
${o.getDisabledStyle}
|
|
4
4
|
&:active {
|
|
5
|
-
${
|
|
5
|
+
${o.getDisabledStyle}
|
|
6
6
|
}
|
|
7
7
|
}
|
|
8
8
|
&:hover {
|
|
9
|
-
${
|
|
9
|
+
${o.getHoverStyle}
|
|
10
10
|
}
|
|
11
11
|
&:active {
|
|
12
|
-
${
|
|
12
|
+
${o.getActiveStyle}
|
|
13
13
|
}
|
|
14
|
-
${
|
|
15
|
-
`,
|
|
14
|
+
${o.getVariantStyle}
|
|
15
|
+
`,R=q.forwardRef(({variant:e="default",startIcon:n,endIcon:r,disabled:t=!1,children:p,size:i="S",href:u,to:d,...f},g)=>{const y=u?"_blank":void 0,b=u?"noreferrer noopener":void 0,l=i==="S"?2:"10px",s=4;return a.jsxs(B,{ref:g,"aria-disabled":t,size:i,variant:e,target:y,rel:b,to:t?void 0:d,href:t?"#":u,background:"buttonPrimary600",borderColor:"buttonPrimary600",hasRadius:!0,gap:2,inline:!0,paddingBottom:l,paddingLeft:s,paddingRight:s,paddingTop:l,pointerEvents:t?"none":void 0,...f,as:d&&!t?h.NavLink:"a",children:[n&&a.jsx(c.Flex,{"aria-hidden":!0,children:n}),a.jsx(j.Typography,{variant:i==="S"?"pi":void 0,fontWeight:"bold",textColor:"buttonNeutral0",children:p}),r&&a.jsx(c.Flex,{"aria-hidden":!0,children:r})]})});exports.LinkButton=R;
|
package/dist/Loader/Loader.cjs
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),s=require("react"),o=require("styled-components"),i=require("./assets/loader.svg.cjs"),l=require("../VisuallyHidden/VisuallyHidden.cjs"),c=e=>e&&e.__esModule?e:{default:e};function d(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const u=d(s),f=c(o),m=o.keyframes`
|
|
2
2
|
from {
|
|
3
3
|
transform: rotate(0deg);
|
|
4
4
|
}
|
|
5
5
|
to {
|
|
6
6
|
transform: rotate(359deg);
|
|
7
7
|
}
|
|
8
|
-
`,f
|
|
9
|
-
animation: ${
|
|
8
|
+
`,g=f.default.img`
|
|
9
|
+
animation: ${m} 1s infinite linear;
|
|
10
10
|
will-change: transform;
|
|
11
|
-
${({small:e,theme:
|
|
12
|
-
`,
|
|
11
|
+
${({small:e,theme:t})=>e&&`width: ${t.spaces[6]}; height: ${t.spaces[6]};`}
|
|
12
|
+
`,p=u.forwardRef(({children:e,small:t=!1,...r},n)=>a.jsxs("div",{role:"alert","aria-live":"assertive",ref:n,...r,children:[a.jsx(l.VisuallyHidden,{children:e}),a.jsx(g,{src:i,"aria-hidden":!0,small:t})]}));exports.Loader=p;
|
package/dist/Main/Main.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("react");const a=require("prop-types"),s=require("styled-components"),n=e=>e&&e.__esModule?e:{default:e},r=n(a),u=n(s),d=u.default.main`
|
|
2
2
|
// To prevent global outline on focus visible to force an outline when Main is focused
|
|
3
3
|
&:focus-visible {
|
|
4
4
|
outline: none;
|
|
5
5
|
}
|
|
6
|
-
`,
|
|
6
|
+
`,t=({labelledBy:e,...o})=>{const l=e||"main-content-title";return i.jsx(d,{"aria-labelledby":l,id:"main-content",tabIndex:-1,...o})};t.defaultProps={labelledBy:void 0};t.propTypes={labelledBy:r.default.string};exports.Main=t;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime");require("react");const r=require("prop-types"),s=require("styled-components"),u=require("../Box/Box.cjs"),t=e=>e&&e.__esModule?e:{default:e},i=t(r),a=t(s),c=a.default(u.Box)`
|
|
2
2
|
text-decoration: none;
|
|
3
3
|
z-index: 9999;
|
|
4
4
|
left: -100%;
|
|
@@ -8,4 +8,4 @@
|
|
|
8
8
|
left: ${({theme:e})=>e.spaces[3]};
|
|
9
9
|
top: ${({theme:e})=>e.spaces[3]};
|
|
10
10
|
}
|
|
11
|
-
`,o=({children:e})=>
|
|
11
|
+
`,o=({children:e})=>n.jsx(c,{as:"a",href:"#main-content",background:"primary600",color:"neutral0",padding:3,position:"absolute",hasRadius:!0,children:e});o.propTypes={children:i.default.node.isRequired};exports.SkipToContent=o;
|
package/dist/MainNav/MainNav.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const a=require("prop-types"),s=require("styled-components"),i=require("./MainNavContext.cjs"),l=require("../Flex/Flex.cjs"),r=e=>e&&e.__esModule?e:{default:e},u=r(a),d=r(s),c=d.default(l.Flex)`
|
|
2
2
|
width: ${({condensed:e})=>e?"max-content":`${224/16}rem`};
|
|
3
3
|
border-right: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
4
|
-
`,
|
|
4
|
+
`,t=({condensed:e,...n})=>o.jsx(i.MainNavContext.Provider,{value:e,children:o.jsx(c,{alignItems:"normal",as:"nav",background:"neutral0",condensed:e,direction:"column",height:"100vh",position:"sticky",top:0,zIndex:2,...n})});t.defaultProps={condensed:!1};t.propTypes={condensed:u.default.bool};exports.MainNav=t;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const x=require("prop-types"),t=require("react-router-dom"),g=require("styled-components"),f=require("./MainNavContext.cjs"),d=require("../Box/Box.cjs"),l=require("../VisuallyHidden/VisuallyHidden.cjs"),j=require("../Flex/Flex.cjs"),u=require("../Typography/Typography.cjs"),p=e=>e&&e.__esModule?e:{default:e},n=p(x),h=p(g),c=h.default.div`
|
|
2
2
|
svg,
|
|
3
3
|
img {
|
|
4
|
-
border-radius: ${({theme:
|
|
4
|
+
border-radius: ${({theme:e})=>e.borderRadius};
|
|
5
5
|
object-fit: contain;
|
|
6
|
-
height: ${({condensed:
|
|
7
|
-
width: ${({condensed:
|
|
6
|
+
height: ${({condensed:e})=>e?`${40/16}rem`:`${32/16}rem`};
|
|
7
|
+
width: ${({condensed:e})=>e?`${40/16}rem`:`${32/16}rem`};
|
|
8
8
|
}
|
|
9
|
-
`,
|
|
9
|
+
`,y=h.default(t.NavLink)`
|
|
10
10
|
text-decoration: unset;
|
|
11
11
|
color: inherit;
|
|
12
|
-
`,
|
|
12
|
+
`,s=({workplace:e,title:a,icon:o,to:i})=>f.useMainNav()?r.jsx(d.Box,{paddingLeft:3,paddingRight:3,paddingTop:4,paddingBottom:4,children:r.jsx(c,{condensed:!0,children:r.jsxs(t.NavLink,{to:i,children:[o,r.jsxs(l.VisuallyHidden,{children:[r.jsx("span",{children:a}),r.jsx("span",{children:e})]})]})})}):r.jsx(d.Box,{paddingLeft:3,paddingRight:3,paddingTop:4,paddingBottom:4,children:r.jsxs(j.Flex,{children:[r.jsx(c,{as:t.NavLink,to:i,"aria-hidden":!0,tabIndex:-1,children:o}),r.jsxs(d.Box,{paddingLeft:2,children:[r.jsx(u.Typography,{fontWeight:"bold",textColor:"neutral800",as:"span",children:r.jsxs(y,{to:i,children:[a,r.jsx(l.VisuallyHidden,{as:"span",children:e})]})}),r.jsx(u.Typography,{variant:"pi",as:"p",textColor:"neutral600","aria-hidden":!0,children:e})]})]})});s.defaultProps={to:"/"};s.propTypes={icon:n.default.node.isRequired,title:n.default.string.isRequired,to:n.default.string,workplace:n.default.string.isRequired};exports.NavBrand=s;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const s=require("@strapi/icons"),d=require("prop-types"),a=require("styled-components"),u=require("./MainNavContext.cjs"),l=require("../Icon/Icon.cjs"),c=require("../VisuallyHidden/VisuallyHidden.cjs"),o=e=>e&&e.__esModule?e:{default:e},h=o(d),p=o(a),g=p.default.button`
|
|
2
2
|
background: ${({theme:e})=>e.colors.neutral0};
|
|
3
3
|
border: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
4
4
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
justify-content: center;
|
|
8
8
|
position: absolute;
|
|
9
9
|
bottom: ${(9+4)/16}rem; // 9 is the height of the svg and 4 is the padding below
|
|
10
|
-
right: ${({theme:e,condensed:
|
|
10
|
+
right: ${({theme:e,condensed:t})=>t?0:e.spaces[5]};
|
|
11
11
|
transform: ${({condensed:e})=>e?"translateX(50%)":void 0};
|
|
12
12
|
z-index: 2;
|
|
13
13
|
width: ${18/16}rem;
|
|
@@ -17,4 +17,4 @@
|
|
|
17
17
|
width: ${6/16}rem;
|
|
18
18
|
height: ${9/16}rem;
|
|
19
19
|
}
|
|
20
|
-
`,
|
|
20
|
+
`,i=({children:e,...t})=>{const n=u.useMainNav();return r.jsxs(g,{as:"button",condensed:n,...t,children:[r.jsx(l.Icon,{as:n?s.ChevronRight:s.ChevronLeft,"aria-hidden":!0,color:"neutral600"}),r.jsx(c.VisuallyHidden,{children:e})]})};i.propTypes={children:h.default.string.isRequired};exports.NavCondense=i;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const t=require("prop-types"),s=require("../Box/Box.cjs"),i=e=>e&&e.__esModule?e:{default:e},u=i(t),o=({children:e})=>r.jsx(s.Box,{position:"relative",children:e});o.displayName="NavFooter";o.propTypes={children:u.default.node.isRequired};exports.NavFooter=o;
|
package/dist/MainNav/NavLink.cjs
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const f=require("prop-types"),$=require("react-router-dom"),x=require("styled-components"),v=require("./MainNavContext.cjs"),b=require("../Box/Box.cjs"),a=require("../Typography/Typography.cjs"),h=require("../Flex/Flex.cjs"),j=require("../Badge/Badge.cjs"),m=require("../Tooltip/Tooltip.cjs"),y=e=>e&&e.__esModule?e:{default:e},o=y(f),n=y(x),c=n.default(b.Box)`
|
|
2
2
|
svg {
|
|
3
3
|
width: 1rem;
|
|
4
4
|
height: 1rem;
|
|
5
5
|
}
|
|
6
|
-
`,
|
|
6
|
+
`,u=n.default($.NavLink)`
|
|
7
7
|
position: relative;
|
|
8
8
|
text-decoration: none;
|
|
9
9
|
display: block;
|
|
10
10
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
11
11
|
background: ${({theme:e})=>e.colors.neutral0};
|
|
12
12
|
|
|
13
|
-
${
|
|
13
|
+
${a.Typography} {
|
|
14
14
|
color: ${({theme:e})=>e.colors.neutral600};
|
|
15
15
|
}
|
|
16
16
|
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
&:hover {
|
|
22
22
|
background: ${({theme:e})=>e.colors.neutral100};
|
|
23
23
|
|
|
24
|
-
${
|
|
24
|
+
${a.Typography} {
|
|
25
25
|
color: ${({theme:e})=>e.colors.neutral700};
|
|
26
26
|
}
|
|
27
27
|
|
|
@@ -37,22 +37,22 @@
|
|
|
37
37
|
fill: ${({theme:e})=>e.colors.primary600};
|
|
38
38
|
}
|
|
39
39
|
|
|
40
|
-
${
|
|
40
|
+
${a.Typography} {
|
|
41
41
|
color: ${({theme:e})=>e.colors.primary600};
|
|
42
42
|
font-weight: 500;
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
|
-
`,
|
|
45
|
+
`,p=n.default(h.Flex)`
|
|
46
46
|
padding: ${({theme:e})=>`${e.spaces[2]} ${e.spaces[3]}`};
|
|
47
|
-
`,g=
|
|
48
|
-
${({theme:e,condensed:
|
|
47
|
+
`,g=n.default(j.Badge)`
|
|
48
|
+
${({theme:e,condensed:s})=>s&&`
|
|
49
49
|
position: absolute;
|
|
50
50
|
// Values based on visual aspect
|
|
51
51
|
top: -${e.spaces[3]};
|
|
52
52
|
right: -${e.spaces[1]};
|
|
53
53
|
`}
|
|
54
54
|
|
|
55
|
-
${
|
|
55
|
+
${a.Typography} {
|
|
56
56
|
//find a solution to remove !important
|
|
57
57
|
color: ${({theme:e})=>e.colors.neutral0} !important;
|
|
58
58
|
line-height: 0;
|
|
@@ -66,4 +66,4 @@
|
|
|
66
66
|
padding: ${({theme:e})=>`0 ${e.spaces[2]}`};
|
|
67
67
|
border-radius: ${({theme:e})=>e.spaces[10]};
|
|
68
68
|
background: ${({theme:e})=>e.colors.primary600};
|
|
69
|
-
`,
|
|
69
|
+
`,i=({children:e,icon:s,badgeContent:t,badgeAriaLabel:l,...d})=>v.useMainNav()?r.jsx(m.Tooltip,{position:"right",label:e,children:r.jsx(u,{...d,children:r.jsxs(p,{as:"span",children:[r.jsx(c,{"aria-hidden":!0,paddingRight:0,as:"span",children:s}),t&&r.jsx(g,{condensed:!0,"aria-label":l,children:t})]})})}):r.jsx(u,{...d,children:r.jsxs(p,{as:"span",justifyContent:"space-between",children:[r.jsxs(h.Flex,{children:[r.jsx(c,{"aria-hidden":!0,paddingRight:3,as:"span",children:s}),r.jsx(a.Typography,{children:e})]}),t&&r.jsx(g,{justifyContent:"center","aria-label":l,children:t})]})});i.displayName="NavLink";i.defaultProps={badgeContent:void 0,badgeAriaLabel:void 0};i.propTypes={badgeAriaLabel:o.default.string,badgeContent:o.default.oneOfType([o.default.string,o.default.number]),children:o.default.node.isRequired,icon:o.default.node.isRequired};exports.NavLink=i;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),x=require("prop-types"),g=require("./MainNavContext.cjs"),h=require("../Divider/Divider.cjs"),i=require("../Flex/Flex.cjs"),l=require("../Box/Box.cjs"),m=require("../VisuallyHidden/VisuallyHidden.cjs"),j=require("../Typography/Typography.cjs"),q=n=>n&&n.__esModule?n:{default:n},u=q(x),p=({label:n,children:d,spacing:a=2,horizontal:r=!1,...c})=>g.useMainNav()?e.jsxs(i.Flex,{direction:"column",alignItems:"stretch",gap:2,children:[e.jsxs(l.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",hasRadius:!0,as:"span",children:[e.jsx(h.Divider,{}),e.jsx(m.VisuallyHidden,{children:e.jsx("span",{children:n})})]}),e.jsx(i.Flex,{as:"ul",gap:a,direction:r?"row":"column",alignItems:r?"center":"stretch",...c,children:o.Children.map(d,(t,s)=>e.jsx("li",{children:t},s))})]}):e.jsxs(i.Flex,{direction:"column",alignItems:"stretch",gap:2,children:[e.jsx(l.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",paddingRight:3,paddingLeft:3,hasRadius:!0,as:"span",children:e.jsx(j.Typography,{variant:"sigma",textColor:"neutral600",children:n})}),e.jsx(i.Flex,{as:"ul",gap:a,direction:r?"row":"column",alignItems:r?"center":"stretch",...c,children:o.Children.map(d,(t,s)=>e.jsx("li",{children:t},s))})]});p.propTypes={children:u.default.node.isRequired,label:u.default.string.isRequired};exports.NavSection=p;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),u=require("prop-types"),a=require("styled-components"),p=require("../Box/Box.cjs"),f=require("../Flex/Flex.cjs"),o=e=>e&&e.__esModule?e:{default:e},g=o(u),x=o(a),y=x.default(p.Box)`
|
|
2
2
|
flex-grow: 1;
|
|
3
3
|
overflow-y: auto;
|
|
4
|
-
`,
|
|
4
|
+
`,n=({children:e,spacing:s=4,horizontal:r=!1,...i})=>t.jsx(y,{paddingLeft:3,paddingRight:2,paddingTop:3,paddingBottom:8,children:t.jsx(f.Flex,{as:"ul",gap:s,direction:r?"row":"column",alignItems:r?"center":"stretch",...i,children:c.Children.map(e,(d,l)=>t.jsx("li",{children:d},l))})});n.propTypes={children:g.default.node.isRequired};exports.NavSections=n;
|
package/dist/MainNav/NavUser.cjs
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
2
|
-
border-top: 1px solid ${({theme:
|
|
3
|
-
`,
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("react"),x=require("prop-types"),f=require("styled-components"),y=require("./MainNavContext.cjs"),a=require("../Avatar/Avatar.cjs"),d=require("../Box/Box.cjs"),v=require("../Flex/Flex.cjs"),g=require("../VisuallyHidden/VisuallyHidden.cjs"),j=require("../Typography/Typography.cjs"),i=e=>e&&e.__esModule?e:{default:e},q=i(p),s=i(x),h=i(f),_=h.default(d.Box)`
|
|
2
|
+
border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
3
|
+
`,r=q.default.forwardRef(({src:e,children:n,initials:l,...u},c)=>{const o=y.useMainNav();return t.jsx(_,{paddingTop:3,paddingBottom:3,paddingLeft:5,paddingRight:5,...u,children:t.jsxs(v.Flex,{as:"button",justifyContent:o?"center":void 0,ref:c,children:[e?t.jsx(a.Avatar,{src:e,alt:"","aria-hidden":!0}):t.jsx(a.Initials,{children:l}),o?t.jsx(g.VisuallyHidden,{children:t.jsx("span",{children:n})}):t.jsx(d.Box,{width:`${130/16}rem`,paddingLeft:2,as:"span",children:t.jsx(j.Typography,{ellipsis:!0,textColor:"neutral600",children:n})})]})})});r.displayName="NavUser";r.defaultProps={src:void 0,initials:void 0};r.propTypes={children:s.default.node.isRequired,initials:s.default.node,src:s.default.string};exports.NavUser=r;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const t=require("styled-components"),r=require("../Box/Box.cjs"),d=e=>e&&e.__esModule?e:{default:e},u=d(t),l=u.default(r.Box)`
|
|
2
2
|
overflow: auto;
|
|
3
3
|
max-height: 60vh;
|
|
4
|
-
`,
|
|
4
|
+
`,s=e=>o.jsx(l,{padding:7,...e});exports.ModalBody=s;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const l=require("prop-types"),u=require("styled-components"),c=require("../Box/Box.cjs"),s=require("../Flex/Flex.cjs"),n=e=>e&&e.__esModule?e:{default:e},r=n(l),i=n(u),p=i.default(c.Box)`
|
|
2
2
|
border-radius: 0 0 ${({theme:e})=>e.borderRadius} ${({theme:e})=>e.borderRadius};
|
|
3
3
|
border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
4
|
-
`,
|
|
4
|
+
`,d=i.default(s.Flex)`
|
|
5
5
|
& > * + * {
|
|
6
6
|
margin-left: ${({theme:e})=>e.spaces[2]};
|
|
7
7
|
}
|
|
8
|
-
`,
|
|
8
|
+
`,o=({startActions:e,endActions:a})=>t.jsx(p,{paddingTop:4,paddingBottom:4,paddingLeft:5,paddingRight:5,background:"neutral100",children:t.jsxs(s.Flex,{justifyContent:"space-between",children:[t.jsx(d,{children:e}),t.jsx(d,{children:a})]})});o.defaultProps={endActions:void 0,startActions:void 0};o.propTypes={endActions:r.default.node,startActions:r.default.node};exports.ModalFooter=o;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const l=require("@strapi/icons"),a=require("prop-types"),i=require("styled-components"),u=require("./ModalContext.cjs"),c=require("../IconButton/IconButton.cjs"),p=require("../Box/Box.cjs"),b=require("../Flex/Flex.cjs"),s=e=>e&&e.__esModule?e:{default:e},t=s(a),f=s(i),x=f.default(p.Box)`
|
|
2
2
|
border-radius: ${({theme:e})=>e.borderRadius} ${({theme:e})=>e.borderRadius} 0 0;
|
|
3
3
|
border-bottom: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
4
|
-
`,r=({children:e,closeLabel:
|
|
4
|
+
`,r=({children:e,closeLabel:d})=>{const n=u.useModal();return o.jsx(x,{paddingTop:4,paddingBottom:4,paddingLeft:5,paddingRight:5,background:"neutral100",children:o.jsxs(b.Flex,{justifyContent:"space-between",children:[e,o.jsx(c.IconButton,{onClick:n,"aria-label":d,icon:o.jsx(l.Cross,{})})]})})};r.defaultProps={closeLabel:"Close the modal"};r.propTypes={children:t.default.node.isRequired,closeLabel:t.default.string};exports.ModalHeader=r;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const u=require("prop-types"),d=require("styled-components"),c=require("./ModalContext.cjs"),p=require("../DismissibleLayer/index.cjs"),x=require("../hooks/useLockScroll.cjs"),y=require("../Flex/Flex.cjs"),f=require("../Box/Box.cjs"),q=require("../Portal/Portal.cjs"),g=require("../FocusTrap/FocusTrap.cjs"),t=e=>e&&e.__esModule?e:{default:e},r=t(u),n=t(d),h=n.default(y.Flex)`
|
|
2
2
|
inset: 0;
|
|
3
|
-
background: ${({theme:
|
|
4
|
-
`,
|
|
3
|
+
background: ${({theme:e})=>`${e.colors.neutral800}1F`};
|
|
4
|
+
`,j=n.default(f.Box)`
|
|
5
5
|
width: ${830/16}rem;
|
|
6
|
-
`,
|
|
6
|
+
`,s=({onClose:e,labelledBy:i,...a})=>(x(!0),o.jsx(q.Portal,{children:o.jsx(c.ModalContext.Provider,{value:e,children:o.jsx(h,{justifyContent:"center",paddingLeft:8,paddingRight:8,position:"fixed",zIndex:4,children:o.jsx(g.FocusTrap,{children:o.jsx(p.DismissibleLayer,{onEscapeKeyDown:e,onPointerDownOutside:e,children:o.jsx(j,{"aria-labelledby":i,onClick:l=>l.stopPropagation(),background:"neutral0",hasRadius:!0,shadow:"popupShadow",role:"dialog","aria-modal":!0,...a})})})})})}));s.propTypes={labelledBy:r.default.string.isRequired,onClose:r.default.func.isRequired};exports.ModalLayout=s;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),f=require("react"),x=require("@internationalized/number"),q=require("@strapi/icons"),$=require("prop-types"),z=require("styled-components"),B=require("../helpers/getDefaultLocale.cjs"),N=require("../helpers/keyboardKeys.cjs"),E=require("../hooks/useControllableState.cjs"),M=require("../hooks/useId.cjs"),U=require("../themes/sizes.cjs"),H=require("../Field/Field.cjs"),W=require("../Flex/Flex.cjs"),X=require("../Field/FieldLabel.cjs"),Y=require("../Field/FieldInput.cjs"),v=require("../Icon/Icon.cjs"),G=require("../Field/FieldHint.cjs"),J=require("../Field/FieldError.cjs"),m=r=>r&&r.__esModule?r:{default:r},Q=m(f),t=m($),Z=m(z),I=Z.default.button`
|
|
2
2
|
display: flex;
|
|
3
3
|
height: 1rem;
|
|
4
|
-
align-items: ${({reverse:
|
|
5
|
-
transform: translateY(${({reverse:
|
|
6
|
-
cursor: ${({disabled:
|
|
4
|
+
align-items: ${({reverse:r})=>r?"flex-end":"flex-start"};
|
|
5
|
+
transform: translateY(${({reverse:r})=>r?"-2px":"2px"});
|
|
6
|
+
cursor: ${({disabled:r})=>r?"not-allowed":void 0};
|
|
7
7
|
svg {
|
|
8
8
|
display: block;
|
|
9
9
|
height: ${4/16}rem;
|
|
10
|
-
transform: ${({reverse:
|
|
10
|
+
transform: ${({reverse:r})=>r?"rotateX(180deg)":void 0};
|
|
11
11
|
}
|
|
12
|
-
`,
|
|
12
|
+
`,ee="",c=Q.default.forwardRef(({size:r,startAction:F,name:w,hint:j,error:D,label:p,labelAction:A,locale:V,id:C,onValueChange:R,value:b,step:s,required:_,disabled:u,...P},k)=>{const K=M.useId(C),g=V||B.getDefaultLocale(),l=f.useRef(new x.NumberParser(g,{style:"decimal"})),d=f.useRef(new x.NumberFormatter(g,{maximumFractionDigits:20})),[o,S]=E.useControllableState({prop(e){const a=String(b);return isNaN(a)||a!==e&&e!==""?e:d.current.format(b)},defaultProp:ee,onChange(e){const a=l.current.parse(e);R(isNaN(a)?void 0:a)}}),i=e=>{S(String(e))},L=({target:{value:e}})=>{l.current.isValidPartialNumber(e)&&i(e)},y=()=>{if(!o){i(s);return}const e=l.current.parse(o),a=isNaN(e)?s:e+s;i(d.current.format(a))},h=()=>{if(!o){i(-s);return}const e=l.current.parse(o),a=isNaN(e)?-s:e-s;i(d.current.format(a))},O=e=>{if(!u)switch(e.key){case N.KeyboardKeys.DOWN:{e.preventDefault(),h();break}case N.KeyboardKeys.UP:{e.preventDefault(),y();break}}},T=()=>{if(o){const e=l.current.parse(o),a=isNaN(e)?"":d.current.format(e);i(a)}};return n.jsx(H.Field,{name:w,hint:j,error:D,id:K,required:_,children:n.jsxs(W.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[p&&n.jsx(X.FieldLabel,{action:A,children:p}),n.jsx(Y.FieldInput,{ref:k,startAction:F,disabled:u,type:"text",inputmode:"decimal",onChange:L,onKeyDown:O,onBlur:T,value:o,size:r,endAction:n.jsxs(n.Fragment,{children:[n.jsx(I,{disabled:u,"aria-hidden":!0,reverse:!0,onClick:y,tabIndex:-1,type:"button","data-testid":"ArrowUp",children:n.jsx(v.Icon,{as:q.CarretDown,color:"neutral500"})}),n.jsx(I,{disabled:u,"aria-hidden":!0,onClick:h,tabIndex:-1,type:"button","data-testid":"ArrowDown",children:n.jsx(v.Icon,{as:q.CarretDown,color:"neutral500"})})]}),...P}),n.jsx(G.FieldHint,{}),n.jsx(J.FieldError,{})]})})});c.displayName="NumberInput";c.defaultProps={"aria-label":void 0,disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,labelAction:void 0,locale:void 0,required:!1,size:"M",startAction:void 0,step:1,value:void 0};c.propTypes={"aria-label":t.default.string,disabled:t.default.bool,error:t.default.string,hint:t.default.oneOfType([t.default.string,t.default.node,t.default.arrayOf(t.default.node)]),id:t.default.string,label:t.default.string,labelAction:t.default.element,locale:t.default.string,name:t.default.string.isRequired,onValueChange:t.default.func.isRequired,required:t.default.bool,size:t.default.oneOf(Object.keys(U.sizes.input)),startAction:t.default.element,step:t.default.number,value:t.default.number};exports.NumberInput=c;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),p=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),p=require("react"),g=require("prop-types"),b=require("styled-components"),P=require("./PaginationContext.cjs"),_=require("../Flex/Flex.cjs"),s=e=>e&&e.__esModule?e:{default:e};function m(e){if(e&&e.__esModule)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const l=m(p),a=s(g),u=s(b),j=u.default.nav``,x=u.default(_.Flex)`
|
|
2
2
|
& > * + * {
|
|
3
3
|
margin-left: ${({theme:e})=>e.spaces[1]};
|
|
4
4
|
}
|
|
5
|
-
`,
|
|
5
|
+
`,o=({children:e,label:n,activePage:t,pageCount:r})=>{const c=l.useMemo(()=>({activePage:t,pageCount:r}),[t,r]);return i.jsx(P.PaginationContext.Provider,{value:c,children:i.jsx(j,{"aria-label":n,children:i.jsx(x,{as:"ul",children:l.Children.map(e,(d,f)=>i.jsx("li",{children:d},f))})})})};o.defaultProps={label:"pagination"};o.propTypes={activePage:a.default.number.isRequired,children:a.default.node.isRequired,label:a.default.string,pageCount:a.default.number.isRequired};exports.Pagination=o;
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const g=require("@strapi/icons"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const g=require("@strapi/icons"),q=require("prop-types"),j=require("react-router-dom"),k=require("styled-components"),u=require("./PaginationContext.cjs"),L=require("../themes/utils.cjs"),m=require("../Typography/Typography.cjs"),d=require("../VisuallyHidden/VisuallyHidden.cjs"),y=e=>e&&e.__esModule?e:{default:e},a=y(q),n=y(k),f=n.default(m.Typography)`
|
|
2
2
|
line-height: revert;
|
|
3
|
-
`,
|
|
3
|
+
`,T={active:!0},c=n.default(j.NavLink).withConfig({shouldForwardProp:(e,i)=>!T[e]&&i(e)})`
|
|
4
4
|
padding: ${({theme:e})=>e.spaces[3]};
|
|
5
5
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
6
6
|
box-shadow: ${({active:e,theme:i})=>e?i.shadows.filterShadow:void 0};
|
|
7
7
|
text-decoration: none;
|
|
8
8
|
display: flex;
|
|
9
9
|
|
|
10
|
-
${
|
|
11
|
-
|
|
10
|
+
${L.buttonFocusStyle}
|
|
11
|
+
`,$=n.default(c)`
|
|
12
12
|
color: ${({theme:e,active:i})=>i?e.colors.primary700:e.colors.neutral800};
|
|
13
13
|
background: ${({theme:e,active:i})=>i?e.colors.neutral0:void 0};
|
|
14
14
|
|
|
15
15
|
&:hover {
|
|
16
16
|
box-shadow: ${({theme:e})=>e.shadows.filterShadow};
|
|
17
17
|
}
|
|
18
|
-
`,
|
|
18
|
+
`,x=n.default(c)`
|
|
19
19
|
font-size: 0.7rem;
|
|
20
20
|
svg path {
|
|
21
21
|
fill: ${e=>e["aria-disabled"]?e.theme.colors.neutral300:e.theme.colors.neutral600};
|
|
@@ -31,6 +31,6 @@
|
|
|
31
31
|
${e=>e["aria-disabled"]?`
|
|
32
32
|
pointer-events: none;
|
|
33
33
|
`:void 0}
|
|
34
|
-
`,
|
|
34
|
+
`,R=n.default(c)`
|
|
35
35
|
color: ${({theme:e})=>e.colors.neutral800};
|
|
36
|
-
`,p=({children:e,to:i,...
|
|
36
|
+
`,p=({children:e,to:i,...o})=>{const{activePage:s}=u.usePagination(),t=s===1;return r.jsxs(x,{to:t?"#":i,"aria-disabled":t,tabIndex:t?-1:void 0,...o,children:[r.jsx(d.VisuallyHidden,{children:e}),r.jsx(g.ChevronLeft,{"aria-hidden":!0})]})};p.displayName="PreviousLink";const h=({children:e,to:i,...o})=>{const{activePage:s,pageCount:t}=u.usePagination(),l=s===t;return r.jsxs(x,{to:l?"#":i,"aria-disabled":l,tabIndex:l?-1:void 0,...o,children:[r.jsx(d.VisuallyHidden,{children:e}),r.jsx(g.ChevronRight,{"aria-hidden":!0})]})};h.displayName="NextLink";const v=({number:e,children:i,...o})=>{const{activePage:s}=u.usePagination(),t=s===e;return r.jsxs($,{...o,active:t,children:[r.jsx(d.VisuallyHidden,{children:i}),r.jsx(f,{"aria-hidden":!0,variant:"pi",fontWeight:t?"bold":null,children:e})]})};v.displayName="PageLink";const P=({children:e,...i})=>r.jsxs(R,{...i,as:"div",children:[r.jsx(d.VisuallyHidden,{children:e}),r.jsx(f,{"aria-hidden":!0,variant:"pi",children:"…"})]});v.propTypes={children:a.default.node.isRequired,number:a.default.number.isRequired};const b={children:a.default.node.isRequired,to:a.default.string.isRequired};h.propTypes=b;p.propTypes=b;P.propTypes={children:a.default.node.isRequired};exports.Dots=P;exports.NextLink=h;exports.PageLink=v;exports.PreviousLink=p;
|
package/dist/Popover/Popover.cjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),S=require("react"),a=require("@floating-ui/react-dom"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),S=require("react"),a=require("@floating-ui/react-dom"),y=require("styled-components"),j=require("../hooks/useIntersection.cjs"),u=require("../Box/Box.cjs"),_=require("../Portal/Portal.cjs"),k=e=>e&&e.__esModule?e:{default:e};function v(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const i=v(S),f=k(y),O=["top","top-start","top-end","right","right-start","right-end","bottom","bottom-start","bottom-end","left","left-start","left-end"],$=f.default(u.Box)`
|
|
2
2
|
box-shadow: ${({theme:e})=>e.shadows.filterShadow};
|
|
3
3
|
z-index: ${({theme:e})=>e.zIndices[0]};
|
|
4
4
|
border: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
5
5
|
background: ${({theme:e})=>e.colors.neutral0};
|
|
6
|
-
`,p=({source:e,children:t,spacing:r=0,fullWidth:o=!1,placement:n="bottom-start",centered:l=!1,...c})=>{const[h,g]=i.useState(void 0),{x:m,y:x,reference:d,floating:w,strategy:P}=a.useFloating({strategy:"fixed",placement:l?"bottom":n,middleware:[a.offset({mainAxis:r}),a.shift(),a.flip()],whileElementsMounted:a.autoUpdate});return i.useLayoutEffect(()=>{d(e.current)},[e,d]),i.useLayoutEffect(()=>{o&&g(e.current.offsetWidth)},[o,e]),s.jsx(
|
|
6
|
+
`,p=({source:e,children:t,spacing:r=0,fullWidth:o=!1,placement:n="bottom-start",centered:l=!1,...c})=>{const[h,g]=i.useState(void 0),{x:m,y:x,reference:d,floating:w,strategy:P}=a.useFloating({strategy:"fixed",placement:l?"bottom":n,middleware:[a.offset({mainAxis:r}),a.shift(),a.flip()],whileElementsMounted:a.autoUpdate});return i.useLayoutEffect(()=>{d(e.current)},[e,d]),i.useLayoutEffect(()=>{o&&g(e.current.offsetWidth)},[o,e]),s.jsx($,{ref:w,style:{left:m,top:x,position:P,width:h||void 0},hasRadius:!0,background:"neutral0",padding:1,...c,children:t})},b=({children:e,intersectionId:t,onReachEnd:r,...o})=>{const n=i.useRef(null);return j.useIntersection(n,r??(()=>{}),{selectorToWatch:`#${CSS.escape(t??"")}`,skipWhen:!t||!r}),s.jsxs(q,{ref:n,...o,children:[e,t&&r&&s.jsx(u.Box,{id:CSS.escape(t),width:"100%",height:"1px"})]})},q=f.default(u.Box)`
|
|
7
7
|
// 16 is base base size, 3 is the factor to get closer to 40px and 5 is the number of elements visible in the list
|
|
8
8
|
max-height: ${3*5}rem;
|
|
9
9
|
overflow-y: auto;
|
|
@@ -23,4 +23,4 @@
|
|
|
23
23
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
24
24
|
margin-right: 10px;
|
|
25
25
|
}
|
|
26
|
-
`,
|
|
26
|
+
`,E=({children:e,source:t,spacing:r,fullWidth:o,placement:n,centered:l,...c})=>s.jsx(_.Portal,{children:s.jsx(p,{source:t,spacing:r,fullWidth:o,placement:n,centered:l,children:s.jsx(b,{...c,children:e})})});exports.Content=p;exports.POPOVER_PLACEMENTS=O;exports.Popover=E;exports.Scrolling=b;
|
package/dist/Portal/Portal.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),a=require("react"),u=require("react-dom"),l=require("../Box/Box.cjs");function s(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const i=s(a),n=i.forwardRef(({container:e=globalThis?.document?.body,...r},t)=>e?u.createPortal(c.jsx(l.Box,{ref:t,...r}),e):null);n.displayName="Portal";exports.Portal=n;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime");require("react");const d=require("prop-types"),c=require("styled-components"),p=require("../Box/Box.cjs"),s=e=>e&&e.__esModule?e:{default:e},r=s(d),b=s(c),f=b.default(p.Box)`
|
|
2
2
|
&:before {
|
|
3
3
|
background-color: ${({theme:e})=>e.colors.neutral0};
|
|
4
4
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
@@ -8,4 +8,4 @@
|
|
|
8
8
|
top: 0;
|
|
9
9
|
width: ${({value:e})=>`${e}%`};
|
|
10
10
|
}
|
|
11
|
-
`,o=({min:e,max:
|
|
11
|
+
`,o=({min:e,max:u,value:t,children:i,size:a,...n})=>l.jsx(f,{background:"neutral600",hasRadius:!0,"aria-label":i,"aria-valuemax":u,"aria-valuemin":e,"aria-valuenow":t,height:a==="S"?1:2,position:"relative",role:"progressbar",value:t,width:a==="S"?"78px":"102px",...n});o.defaultProps={min:0,max:100,value:0,size:"M"};o.propTypes={children:r.default.node.isRequired,max:r.default.number,min:r.default.number,size:r.default.oneOf(["S","M"]),value:r.default.number};exports.ProgressBar=o;
|
package/dist/Radio/Radio.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const i=require("prop-types"),l=require("styled-components"),n=require("../BaseRadio/BaseRadio.cjs"),u=require("../Typography/Typography.cjs"),d=require("../Box/Box.cjs"),o=e=>e&&e.__esModule?e:{default:e},r=o(i),c=o(l),p=c.default(u.Typography)`
|
|
2
2
|
display: flex;
|
|
3
3
|
align-items: center;
|
|
4
|
-
`,
|
|
4
|
+
`,s=({children:e,...a})=>t.jsxs(p,{as:"label",textColor:"neutral800",children:[t.jsx(n.BaseRadio,{...a}),t.jsx(d.Box,{paddingLeft:2,children:e})]});s.propTypes={children:r.default.node.isRequired,value:r.default.any.isRequired};exports.Radio=s;
|
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("react"),u=require("@strapi/icons"),S=require("prop-types"),m=require("styled-components"),$=require("../themes/sizes.cjs"),v=require("../themes/utils.cjs"),i=require("../Field/FieldInput.cjs"),c=require("../Flex/Flex.cjs"),_=require("../Field/Field.cjs"),z=require("../VisuallyHidden/VisuallyHidden.cjs"),C=require("../Field/FieldLabel.cjs"),I=require("../Field/FieldAction.cjs"),d=e=>e&&e.__esModule?e:{default:e},s=d(S),l=d(m),w=l.default(c.Flex)`
|
|
2
2
|
font-size: 0.5rem;
|
|
3
3
|
svg path {
|
|
4
4
|
fill: ${({theme:e})=>e.colors.neutral400};
|
|
5
5
|
}
|
|
6
|
-
`,
|
|
6
|
+
`,p=l.default(c.Flex)`
|
|
7
7
|
font-size: 0.8rem;
|
|
8
8
|
|
|
9
9
|
svg path {
|
|
10
10
|
fill: ${({theme:e})=>e.colors.neutral800};
|
|
11
11
|
}
|
|
12
|
-
`,
|
|
12
|
+
`,W=l.default.div`
|
|
13
13
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
14
14
|
box-shadow: ${({theme:e})=>e.shadows.filterShadow};
|
|
15
15
|
|
|
16
16
|
&:focus-within {
|
|
17
|
-
${
|
|
17
|
+
${p} {
|
|
18
18
|
svg path {
|
|
19
19
|
fill: ${({theme:e})=>e.colors.primary600};
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
${
|
|
24
|
+
${i.InputWrapper} {
|
|
25
25
|
border: 1px solid transparent;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
${
|
|
29
|
-
`,
|
|
28
|
+
${v.inputFocusStyle(i.InputWrapper)}
|
|
29
|
+
`,t=a.forwardRef(({name:e,size:f,children:h,value:n,onClear:q,clearLabel:x,...b},j)=>{const o=a.useRef(null),y=n.length>0,F=g=>{q(g),o.current.focus()},R=j||o;return r.jsx(W,{children:r.jsxs(_.Field,{name:e,children:[r.jsx(z.VisuallyHidden,{children:r.jsx(C.FieldLabel,{children:h})}),r.jsx(i.FieldInput,{ref:R,value:n,startAction:r.jsx(p,{children:r.jsx(u.Search,{"aria-hidden":!0})}),size:f,endAction:y?r.jsx(I.FieldAction,{label:x,onClick:F,children:r.jsx(w,{children:r.jsx(u.Cross,{})})}):void 0,...b})]})})});t.displayName="Searchbar";t.defaultProps={value:"",size:"M"};t.propTypes={children:s.default.node.isRequired,clearLabel:s.default.string.isRequired,name:s.default.string.isRequired,onClear:s.default.func.isRequired,size:s.default.oneOf(Object.keys($.sizes.input)),value:s.default.string};exports.Searchbar=t;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),N=require("react"),X=require("@strapi/icons"),b=require("styled-components"),o=require("./SelectParts.cjs"),Y=require("../BaseCheckbox/assets/checkmark.svg.cjs"),J=require("../hooks/useId.cjs"),K=require("../hooks/useIntersection.cjs"),Q=require("../Tag/Tag.cjs"),j=require("../Box/Box.cjs"),C=require("../Typography/Typography.cjs"),U=require("../Field/Field.cjs"),Z=require("../Flex/Flex.cjs"),ee=require("../Field/FieldLabel.cjs"),te=require("../Field/FieldHint.cjs"),re=require("../Field/FieldError.cjs"),ne=e=>e&&e.__esModule?e:{default:e};function ie(e){if(e&&e.__esModule)return e;const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const l=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(i,r,l.get?l:{enumerable:!0,get:()=>e[r]})}}return i.default=e,Object.freeze(i)}const a=ie(N),oe=ne(b),le=({children:e,clearLabel:i="Clear",customizeContent:r,disabled:l,error:s,hint:d,id:u,label:p,labelAction:T,onChange:x,onClear:M,onReachEnd:I,placeholder:R,required:y,selectButtonTitle:ae,startIcon:F,size:_="M",value:f,withTags:m,...B})=>{const q=a.useRef(null),[S,$]=a.useState(),[L,P]=a.useState(!1),h=J.useId(u),V=`${h}-hint`,z=`${h}-error`,E=n=>{x?x(n):$(n)},G=n=>()=>{const w=Array.isArray(f)?f.filter(g=>g!==n):(S??[]).filter(g=>g!==n);x?x(w):$(w)},A=n=>{P(n)},k=a.useRef(null),D=()=>{k.current.focus()},v=`intersection-${CSS.escape(h)}`,H=n=>{I&&I(n)};K.useIntersection(q,H,{selectorToWatch:`#${v}`,skipWhen:!L});const c=typeof f<"u"?f:S,W=n=>n&&typeof n=="object"&&n.value?t.jsx(Q.Tag,{tabIndex:-1,disabled:l,icon:t.jsx(X.Cross,{}),onClick:G(n.value),children:n.textValue},n.value):null;return t.jsx(U.Field,{hint:d,error:s,id:h,required:y,children:t.jsxs(Z.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[t.jsx(ee.FieldLabel,{onClick:D,action:T,children:p}),t.jsxs(o.Root,{onOpenChange:A,disabled:l,required:y,onValueChange:E,value:c,...B,multi:!0,children:[t.jsx(o.Trigger,{ref:k,"aria-label":p,"aria-describedby":`${V} ${z}`,id:h,startIcon:F,size:_,hasError:!!s,disabled:l,clearLabel:i,onClear:c?.length?M:void 0,paddingLeft:m&&c?.length?1:3,children:t.jsx(o.Value,{placeholder:R,textColor:c?.length?"neutral800":"neutral600",children:c?.length?m?W:r?r(c):void 0:void 0})}),t.jsx(o.Portal,{children:t.jsx(o.Content,{position:"popper",sideOffset:4,children:t.jsxs(o.Viewport,{ref:q,children:[e,t.jsx(j.Box,{id:v,width:"100%",height:"1px"})]})})})]}),t.jsx(te.FieldHint,{}),t.jsx(re.FieldError,{})]})})},se=a.forwardRef(({value:e,children:i,startIcon:r,...l},s)=>t.jsxs(o.Item,{ref:s,value:e.toString(),...l,children:[r&&t.jsx(j.Box,{as:"span","aria-hidden":!0,children:r}),t.jsx(o.ItemIndicator,{children:({isSelected:d,isIntermediate:u})=>t.jsx(O,{hasRadius:!0,overflow:"hidden",position:"relative",$indeterminate:u,$selected:d,zIndex:1,height:"18px",width:"18px"})}),t.jsx(C.Typography,{textColor:"neutral800",children:t.jsx(o.ItemText,{children:i})})]})),O=oe.default(j.Box)`
|
|
2
2
|
border: 1px solid
|
|
3
|
-
${({theme:
|
|
4
|
-
background-color: ${({theme:
|
|
3
|
+
${({theme:e,$selected:i,$indeterminate:r})=>i||r?e.colors.primary600:e.colors.neutral300};
|
|
4
|
+
background-color: ${({theme:e,$selected:i,$indeterminate:r})=>i||r?e.colors.primary600:e.colors.neutral0};
|
|
5
5
|
|
|
6
|
-
${({theme:
|
|
6
|
+
${({theme:e,$indeterminate:i})=>i&&b.css`
|
|
7
7
|
&::after {
|
|
8
8
|
content: '';
|
|
9
9
|
display: block;
|
|
@@ -11,14 +11,14 @@
|
|
|
11
11
|
color: white;
|
|
12
12
|
height: 2px;
|
|
13
13
|
width: 10px;
|
|
14
|
-
background-color: ${
|
|
14
|
+
background-color: ${e.colors.neutral0};
|
|
15
15
|
left: 50%;
|
|
16
16
|
top: 50%;
|
|
17
17
|
transform: translateX(-50%) translateY(-50%);
|
|
18
18
|
}
|
|
19
19
|
`}
|
|
20
20
|
|
|
21
|
-
${({$selected:
|
|
21
|
+
${({$selected:e})=>e&&b.css`
|
|
22
22
|
&::after {
|
|
23
23
|
content: '';
|
|
24
24
|
background: url(${Y}) no-repeat no-repeat center center;
|
|
@@ -27,4 +27,4 @@
|
|
|
27
27
|
position: absolute;
|
|
28
28
|
}
|
|
29
29
|
`}
|
|
30
|
-
`,
|
|
30
|
+
`,ce=a.forwardRef(({children:e,label:i,startIcon:r,values:l=[],...s},d)=>t.jsxs(o.Group,{ref:d,children:[t.jsxs(o.Item,{value:l,...s,children:[r&&t.jsx(j.Box,{as:"span","aria-hidden":!0,children:r}),t.jsx(o.ItemIndicator,{children:({isSelected:u,isIntermediate:p})=>t.jsx(O,{hasRadius:!0,overflow:"hidden",position:"relative",$indeterminate:p,$selected:u,zIndex:1,height:"18px",width:"18px"})}),t.jsx(C.Typography,{textColor:"neutral800",children:i})]}),e]}));exports.MultiSelect=le;exports.MultiSelectGroup=ce;exports.MultiSelectOption=se;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
2
|
-
padding-left: ${({theme:
|
|
3
|
-
`;exports.MultiSelectNested=
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),r=require("styled-components"),i=require("./MultiSelect.cjs"),a=e=>e&&e.__esModule?e:{default:e},s=a(r),c=({options:e,...n})=>u.jsx(i.MultiSelect,{...n,children:e.map(l=>"children"in l?u.jsx(i.MultiSelectGroup,{label:l.label,values:l.children.map(t=>t.value.toString()),children:l.children.map(t=>u.jsx(d,{value:t.value,children:t.label},t.value))},l.label):u.jsx(i.MultiSelectOption,{value:l.value,children:l.label},l.value))}),d=s.default(i.MultiSelectOption)`
|
|
2
|
+
padding-left: ${({theme:e})=>e.spaces[7]};
|
|
3
|
+
`;exports.MultiSelectNested=c;
|