@strapi/design-system 0.0.0-3cf3ff39

package/dist/JSONInput/JSONInputContainer.js

@@ -0,0 +1,39 @@
+import o from "styled-components";
+import { inputFocusStyle as t } from "../themes/utils.js";
+import { Flex as c } from "../Flex/Flex.js";
+const l = o(c)`
+  line-height: ${({ theme: e }) => e.lineHeights[2]};
+
+  .cm-editor {
+    /** 
+     * Hard coded since the color is the same between themes,
+     * theme.colors.neutral800 changes between themes 
+     */
+    background-color: #32324d;
+    width: 100%;
+    outline: none;
+  }
+
+  .cm-scroller {
+    border: 1px solid ${({ theme: e, hasError: r }) => r ? e.colors.danger600 : e.colors.neutral200};
+    /* inputFocusStyle will receive hasError prop */
+    ${t()}
+  }
+
+  .cm-editor,
+  .cm-scroller {
+    border-radius: ${({ theme: e }) => e.borderRadius};
+  }
+
+  .cm-gutters,
+  .cm-activeLineGutter {
+    /** 
+     * Hard coded since the color is the same between themes,
+     * theme.colors.neutral700 changes between themes 
+     */
+    background-color: #4a4a6a;
+  }
+`;
+export {
+  l as JSONInputContainer
+};

package/dist/JSONInput/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./JSONInput.cjs");exports.JSONInput=t.JSONInput;

package/dist/JSONInput/index.js

@@ -0,0 +1,4 @@
+import { JSONInput as r } from "./JSONInput.js";
+export {
+  r as JSONInput
+};

package/dist/JSONInput/utils/decorationExtension.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@codemirror/state"),r=require("@codemirror/view"),a=i.StateEffect.define(),d=i.StateEffect.define(),s=r.Decoration.mark({attributes:{style:"background-color: yellow; color: black"}}),n=i.StateField.define({create(){return r.Decoration.none},update(e,o){return e=e.map(o.changes),o.effects.forEach(t=>{t.is(a)?e=e.update({add:t.value,sort:!0}):t.is(d)&&(e=e.update({filter:t.value}))}),e},provide:e=>r.EditorView.decorations.from(e)});exports.addMarks=a;exports.filterMarks=d;exports.lineHighlightMark=s;exports.markField=n;

package/dist/JSONInput/utils/decorationExtension.js

@@ -0,0 +1,27 @@
+import { StateEffect as o, StateField as d } from "@codemirror/state";
+import { Decoration as i, EditorView as a } from "@codemirror/view";
+const n = o.define(), s = o.define(), l = i.mark({
+  attributes: { style: "background-color: yellow; color: black" }
+}), m = d.define({
+  // Start with an empty set of decorations
+  create() {
+    return i.none;
+  },
+  // This is called whenever the editor updates it computes the new set
+  update(r, t) {
+    return r = r.map(t.changes), t.effects.forEach((e) => {
+      e.is(n) ? r = r.update({
+        add: e.value,
+        sort: !0
+      }) : e.is(s) && (r = r.update({ filter: e.value }));
+    }), r;
+  },
+  // Indicate that this field provides a set of decorations
+  provide: (r) => a.decorations.from(r)
+});
+export {
+  n as addMarks,
+  s as filterMarks,
+  l as lineHighlightMark,
+  m as markField
+};

package/dist/KeyboardNavigable/KeyboardNavigable.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),s=require("../helpers/keyboardKeys.cjs"),m=require("../Box/Box.cjs"),b=({tagName:r,attributeName:d="",...f})=>{const c=()=>{const e=document.activeElement;return e?r?e.tagName.toLowerCase()===r:e.hasAttribute(d):!1},l=e=>r?e.querySelectorAll(r):e.querySelectorAll(`[${d}]`),i=e=>{switch(e.key){case s.KeyboardKeys.RIGHT:case s.KeyboardKeys.DOWN:{if(c()){e.preventDefault();const n=document.activeElement,t=[...l(e.currentTarget)],o=t.findIndex(a=>a===n),u=o+1<t.length?o+1:0;t[u].focus()}break}case s.KeyboardKeys.LEFT:case s.KeyboardKeys.UP:{if(c()){e.preventDefault();const n=document.activeElement,t=[...l(e.currentTarget)],o=t.findIndex(a=>a===n),u=o-1>-1?o-1:t.length-1;t[u].focus()}break}case s.KeyboardKeys.HOME:{c()&&(e.preventDefault(),l(e.currentTarget).item(0).focus());break}case s.KeyboardKeys.END:{if(c()){e.preventDefault();const n=l(e.currentTarget);n.item(n.length-1).focus()}break}}};return y.jsx(m.Box,{onKeyDown:i,...f})};exports.KeyboardNavigable=b;

package/dist/KeyboardNavigable/KeyboardNavigable.js

@@ -0,0 +1,46 @@
+import { jsx as m } from "react/jsx-runtime";
+import { KeyboardKeys as o } from "../helpers/keyboardKeys.js";
+import { Box as i } from "../Box/Box.js";
+const v = ({ tagName: s, attributeName: a = "", ...d }) => {
+  const r = () => {
+    const e = document.activeElement;
+    return e ? s ? e.tagName.toLowerCase() === s : e.hasAttribute(a) : !1;
+  }, l = (e) => s ? e.querySelectorAll(s) : e.querySelectorAll(`[${a}]`);
+  return m(i, { onKeyDown: (e) => {
+    switch (e.key) {
+      case o.RIGHT:
+      case o.DOWN: {
+        if (r()) {
+          e.preventDefault();
+          const n = document.activeElement, t = [...l(e.currentTarget)], c = t.findIndex((f) => f === n), u = c + 1 < t.length ? c + 1 : 0;
+          t[u].focus();
+        }
+        break;
+      }
+      case o.LEFT:
+      case o.UP: {
+        if (r()) {
+          e.preventDefault();
+          const n = document.activeElement, t = [...l(e.currentTarget)], c = t.findIndex((f) => f === n), u = c - 1 > -1 ? c - 1 : t.length - 1;
+          t[u].focus();
+        }
+        break;
+      }
+      case o.HOME: {
+        r() && (e.preventDefault(), l(e.currentTarget).item(0).focus());
+        break;
+      }
+      case o.END: {
+        if (r()) {
+          e.preventDefault();
+          const n = l(e.currentTarget);
+          n.item(n.length - 1).focus();
+        }
+        break;
+      }
+    }
+  }, ...d });
+};
+export {
+  v as KeyboardNavigable
+};

package/dist/KeyboardNavigable/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./KeyboardNavigable.cjs");exports.KeyboardNavigable=e.KeyboardNavigable;

package/dist/KeyboardNavigable/index.js

@@ -0,0 +1,4 @@
+import { KeyboardNavigable as o } from "./KeyboardNavigable.js";
+export {
+  o as KeyboardNavigable
+};

package/dist/Layout/ActionLayout.cjs

@@ -0,0 +1,9 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const a=require("prop-types"),c=require("styled-components"),l=require("../Flex/Flex.cjs"),r=require("../Box/Box.cjs"),i=e=>e&&e.__esModule?e:{default:e},s=i(a),d=i(c),u=d.default(l.Flex)`
+  & > * + * {
+    margin-left: ${({theme:e})=>e.spaces[2]};
+  }
+
+  margin-left: ${({pullRight:e})=>e?"auto":void 0};
+`,p=d.default(u)`
+  flex-shrink: 0;
+`,n=({startActions:e,endActions:o})=>e||o?t.jsx(r.Box,{paddingLeft:10,paddingRight:10,children:t.jsx(r.Box,{paddingBottom:4,children:t.jsxs(l.Flex,{justifyContent:"space-between",alignItems:"flex-start",children:[e&&t.jsx(u,{wrap:"wrap",children:e}),o&&t.jsx(p,{pullRight:!0,children:o})]})})}):null;n.defaultProps={endActions:void 0,startActions:void 0};n.propTypes={endActions:s.default.node,startActions:s.default.node};exports.ActionLayout=n;

package/dist/Layout/ActionLayout.js

@@ -0,0 +1,29 @@
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import "react";
+import e from "prop-types";
+import n from "styled-components";
+import { Flex as p } from "../Flex/Flex.js";
+import { Box as i } from "../Box/Box.js";
+const d = n(p)`
+  & > * + * {
+    margin-left: ${({ theme: t }) => t.spaces[2]};
+  }
+
+  margin-left: ${({ pullRight: t }) => t ? "auto" : void 0};
+`, a = n(d)`
+  flex-shrink: 0;
+`, l = ({ startActions: t, endActions: r }) => t || r ? /* @__PURE__ */ o(i, { paddingLeft: 10, paddingRight: 10, children: /* @__PURE__ */ o(i, { paddingBottom: 4, children: /* @__PURE__ */ s(p, { justifyContent: "space-between", alignItems: "flex-start", children: [
+  t && /* @__PURE__ */ o(d, { wrap: "wrap", children: t }),
+  r && /* @__PURE__ */ o(a, { pullRight: !0, children: r })
+] }) }) }) : null;
+l.defaultProps = {
+  endActions: void 0,
+  startActions: void 0
+};
+l.propTypes = {
+  endActions: e.node,
+  startActions: e.node
+};
+export {
+  l as ActionLayout
+};

package/dist/Layout/ContentLayout.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const r=require("prop-types"),n=require("../Box/Box.cjs"),u=e=>e&&e.__esModule?e:{default:e},i=u(r),t=({children:e})=>o.jsx(n.Box,{paddingLeft:10,paddingRight:10,children:e});t.propTypes={children:i.default.node.isRequired};exports.ContentLayout=t;

package/dist/Layout/ContentLayout.js

@@ -0,0 +1,11 @@
+import { jsx as r } from "react/jsx-runtime";
+import "react";
+import p from "prop-types";
+import { Box as t } from "../Box/Box.js";
+const e = ({ children: o }) => /* @__PURE__ */ r(t, { paddingLeft: 10, paddingRight: 10, children: o });
+e.propTypes = {
+  children: p.node.isRequired
+};
+export {
+  e as ContentLayout
+};

package/dist/Layout/GridLayout.cjs

@@ -0,0 +1,5 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("prop-types"),o=require("styled-components"),t=e=>e&&e.__esModule?e:{default:e},s=t(d),i=t(o),r=i.default.div`
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  grid-gap: ${({theme:e})=>e.spaces[4]};
+`;r.propTypes={children:s.default.node.isRequired};exports.GridLayout=r;

package/dist/Layout/GridLayout.js

@@ -0,0 +1,13 @@
+import p from "prop-types";
+import e from "styled-components";
+const i = e.div`
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  grid-gap: ${({ theme: r }) => r.spaces[4]};
+`;
+i.propTypes = {
+  children: p.node.isRequired
+};
+export {
+  i as GridLayout
+};

package/dist/Layout/HeaderLayout.cjs

@@ -0,0 +1,4 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),v=require("prop-types"),B=require("styled-components"),R=require("../hooks/useElementOnScreen.cjs"),b=require("../hooks/useResizeObserver.cjs"),r=require("../Box/Box.cjs"),l=require("../Flex/Flex.cjs"),u=require("../Typography/Typography.cjs"),f=e=>e&&e.__esModule?e:{default:e},m=f(c),i=f(v),T=f(B),L=()=>{const e=c.useRef(null),[a,n]=c.useState(null),[d,o]=R.useElementOnScreen({root:null,rootMargin:"0px",threshold:0});return b.useResizeObserver(d,()=>{d.current&&n(d.current.getBoundingClientRect())}),c.useEffect(()=>{e.current&&n(e.current.getBoundingClientRect())},[e]),{containerRef:d,isVisible:o,baseHeaderLayoutRef:e,headerSize:a}},p=e=>{const{containerRef:a,isVisible:n,baseHeaderLayoutRef:d,headerSize:o}=L();return t.jsxs(t.Fragment,{children:[t.jsx("div",{style:{height:o?.height},ref:a,children:n&&t.jsx(s,{ref:d,...e})}),!n&&t.jsx(s,{...e,sticky:!0,width:o?.width})]})};p.displayName="HeaderLayout";const S=T.default(r.Box)`
+  width: ${e=>e.width}px;
+  z-index: ${({theme:e})=>e.zIndices[1]};
+`,s=m.default.forwardRef(({navigationAction:e,primaryAction:a,secondaryAction:n,subtitle:d,title:o,sticky:y,width:g,...h},j)=>{const x=typeof d=="string";return y?t.jsx(S,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:g,"data-strapi-header-sticky":!0,children:t.jsxs(l.Flex,{justifyContent:"space-between",children:[t.jsxs(l.Flex,{children:[e&&t.jsx(r.Box,{paddingRight:3,children:e}),t.jsxs(r.Box,{children:[t.jsx(u.Typography,{variant:"beta",as:"h1",...h,children:o}),x?t.jsx(u.Typography,{variant:"pi",textColor:"neutral600",children:d}):d]}),n?t.jsx(r.Box,{paddingLeft:4,children:n}):null]}),t.jsx(l.Flex,{children:a?t.jsx(r.Box,{paddingLeft:2,children:a}):void 0})]})}):t.jsxs(r.Box,{ref:j,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:e?6:8,background:"neutral100","data-strapi-header":!0,children:[e?t.jsx(r.Box,{paddingBottom:2,children:e}):null,t.jsxs(l.Flex,{justifyContent:"space-between",children:[t.jsxs(l.Flex,{minWidth:0,children:[t.jsx(u.Typography,{as:"h1",variant:"alpha",...h,children:o}),n?t.jsx(r.Box,{paddingLeft:4,children:n}):null]}),a]}),x?t.jsx(u.Typography,{variant:"epsilon",textColor:"neutral600",as:"p",children:d}):d]})});s.displayName="BaseHeaderLayout";s.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0,sticky:!1,width:void 0};s.propTypes={navigationAction:i.default.node,primaryAction:i.default.node,secondaryAction:i.default.node,sticky:i.default.bool,subtitle:i.default.oneOfType([i.default.string,i.default.node]),title:i.default.string.isRequired,width:i.default.number};p.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0};p.propTypes={navigationAction:i.default.node,primaryAction:i.default.node,secondaryAction:i.default.node,subtitle:i.default.oneOfType([i.default.string,i.default.node]),title:i.default.string.isRequired};exports.BaseHeaderLayout=s;exports.HeaderLayout=p;

package/dist/Layout/HeaderLayout.js

@@ -0,0 +1,127 @@
+import { jsx as i, jsxs as s, Fragment as v } from "react/jsx-runtime";
+import R, { useRef as b, useState as x, useEffect as w } from "react";
+import t from "prop-types";
+import L from "styled-components";
+import { useElementOnScreen as S } from "../hooks/useElementOnScreen.js";
+import { useResizeObserver as B } from "../hooks/useResizeObserver.js";
+import { Box as d } from "../Box/Box.js";
+import { Flex as l } from "../Flex/Flex.js";
+import { Typography as p } from "../Typography/Typography.js";
+const H = () => {
+  const e = b(null), [o, n] = x(null), [r, a] = S({
+    root: null,
+    rootMargin: "0px",
+    threshold: 0
+  });
+  return B(r, () => {
+    r.current && n(r.current.getBoundingClientRect());
+  }), w(() => {
+    e.current && n(e.current.getBoundingClientRect());
+  }, [e]), {
+    containerRef: r,
+    isVisible: a,
+    baseHeaderLayoutRef: e,
+    headerSize: o
+  };
+}, h = (e) => {
+  const { containerRef: o, isVisible: n, baseHeaderLayoutRef: r, headerSize: a } = H();
+  return /* @__PURE__ */ s(v, { children: [
+    /* @__PURE__ */ i("div", { style: { height: a?.height }, ref: o, children: n && /* @__PURE__ */ i(c, { ref: r, ...e }) }),
+    !n && /* @__PURE__ */ i(c, { ...e, sticky: !0, width: a?.width })
+  ] });
+};
+h.displayName = "HeaderLayout";
+const T = L(d)`
+  width: ${(e) => e.width}px;
+  z-index: ${({ theme: e }) => e.zIndices[1]};
+`, c = R.forwardRef(
+  ({ navigationAction: e, primaryAction: o, secondaryAction: n, subtitle: r, title: a, sticky: g, width: m, ...u }, y) => {
+    const f = typeof r == "string";
+    return g ? /* @__PURE__ */ i(
+      T,
+      {
+        paddingLeft: 6,
+        paddingRight: 6,
+        paddingTop: 3,
+        paddingBottom: 3,
+        position: "fixed",
+        top: 0,
+        right: 0,
+        background: "neutral0",
+        shadow: "tableShadow",
+        width: m,
+        "data-strapi-header-sticky": !0,
+        children: /* @__PURE__ */ s(l, { justifyContent: "space-between", children: [
+          /* @__PURE__ */ s(l, { children: [
+            e && /* @__PURE__ */ i(d, { paddingRight: 3, children: e }),
+            /* @__PURE__ */ s(d, { children: [
+              /* @__PURE__ */ i(p, { variant: "beta", as: "h1", ...u, children: a }),
+              f ? /* @__PURE__ */ i(p, { variant: "pi", textColor: "neutral600", children: r }) : r
+            ] }),
+            n ? /* @__PURE__ */ i(d, { paddingLeft: 4, children: n }) : null
+          ] }),
+          /* @__PURE__ */ i(l, { children: o ? /* @__PURE__ */ i(d, { paddingLeft: 2, children: o }) : void 0 })
+        ] })
+      }
+    ) : /* @__PURE__ */ s(
+      d,
+      {
+        ref: y,
+        paddingLeft: 10,
+        paddingRight: 10,
+        paddingBottom: 8,
+        paddingTop: e ? 6 : 8,
+        background: "neutral100",
+        "data-strapi-header": !0,
+        children: [
+          e ? /* @__PURE__ */ i(d, { paddingBottom: 2, children: e }) : null,
+          /* @__PURE__ */ s(l, { justifyContent: "space-between", children: [
+            /* @__PURE__ */ s(l, { minWidth: 0, children: [
+              /* @__PURE__ */ i(p, { as: "h1", variant: "alpha", ...u, children: a }),
+              n ? /* @__PURE__ */ i(d, { paddingLeft: 4, children: n }) : null
+            ] }),
+            o
+          ] }),
+          f ? /* @__PURE__ */ i(p, { variant: "epsilon", textColor: "neutral600", as: "p", children: r }) : r
+        ]
+      }
+    );
+  }
+);
+c.displayName = "BaseHeaderLayout";
+c.defaultProps = {
+  navigationAction: void 0,
+  primaryAction: void 0,
+  secondaryAction: void 0,
+  subtitle: void 0,
+  sticky: !1,
+  width: void 0
+};
+c.propTypes = {
+  navigationAction: t.node,
+  primaryAction: t.node,
+  secondaryAction: t.node,
+  sticky: t.bool,
+  // TODO V2: Remove the string fallback
+  subtitle: t.oneOfType([t.string, t.node]),
+  title: t.string.isRequired,
+  width: t.number
+};
+h.defaultProps = {
+  navigationAction: void 0,
+  primaryAction: void 0,
+  secondaryAction: void 0,
+  subtitle: void 0
+};
+h.propTypes = {
+  navigationAction: t.node,
+  primaryAction: t.node,
+  secondaryAction: t.node,
+  // TODO V2: Remove the string fallback
+  subtitle: t.oneOfType([t.string, t.node]),
+  title: t.string.isRequired
+};
+export {
+  c as BaseHeaderLayout,
+  h as HeaderLayout
+};

package/dist/Layout/Layout.cjs

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const u=require("prop-types"),l=require("styled-components"),d=require("../Box/Box.cjs"),s=e=>e&&e.__esModule?e:{default:e},r=s(u),n=s(l),a=n.default(d.Box)`
+  display: grid;
+  grid-template-columns: ${({hasSideNav:e})=>e?"auto 1fr":"1fr"};
+`,c=n.default(d.Box)`
+  overflow-x: hidden;
+`,t=({sideNav:e,children:i})=>o.jsxs(a,{hasSideNav:!!e,children:[e,o.jsx(c,{paddingBottom:10,children:i})]});t.defaultProps={sideNav:void 0};t.propTypes={children:r.default.node.isRequired,sideNav:r.default.node};exports.Layout=t;

package/dist/Layout/Layout.js

@@ -0,0 +1,24 @@
+import { jsxs as n, jsx as p } from "react/jsx-runtime";
+import "react";
+import r from "prop-types";
+import e from "styled-components";
+import { Box as i } from "../Box/Box.js";
+const s = e(i)`
+  display: grid;
+  grid-template-columns: ${({ hasSideNav: o }) => o ? "auto 1fr" : "1fr"};
+`, m = e(i)`
+  overflow-x: hidden;
+`, t = ({ sideNav: o, children: d }) => /* @__PURE__ */ n(s, { hasSideNav: !!o, children: [
+  o,
+  /* @__PURE__ */ p(m, { paddingBottom: 10, children: d })
+] });
+t.defaultProps = {
+  sideNav: void 0
+};
+t.propTypes = {
+  children: r.node.isRequired,
+  sideNav: r.node
+};
+export {
+  t as Layout
+};

package/dist/Layout/TwoColsLayout.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const i=require("prop-types"),a=require("../Grid/Grid.cjs"),o=require("../Grid/GridItem.cjs"),t=require("../Box/Box.cjs"),n=e=>e&&e.__esModule?e:{default:e},s=n(i),d=({startCol:e,endCol:u})=>r.jsxs(a.Grid,{gap:4,children:[r.jsx(o.GridItem,{col:9,s:12,children:r.jsx(t.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:e})}),r.jsx(o.GridItem,{col:3,s:12,children:r.jsx(t.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:u})})]});d.propTypes={endCol:s.default.node.isRequired,startCol:s.default.node.isRequired};exports.TwoColsLayout=d;

package/dist/Layout/TwoColsLayout.js

@@ -0,0 +1,17 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import "react";
+import o from "prop-types";
+import { Grid as a } from "../Grid/Grid.js";
+import { GridItem as e } from "../Grid/GridItem.js";
+import { Box as d } from "../Box/Box.js";
+const l = ({ startCol: i, endCol: t }) => /* @__PURE__ */ s(a, { gap: 4, children: [
+  /* @__PURE__ */ r(e, { col: 9, s: 12, children: /* @__PURE__ */ r(d, { hasRadius: !0, background: "neutral0", shadow: "tableShadow", children: i }) }),
+  /* @__PURE__ */ r(e, { col: 3, s: 12, children: /* @__PURE__ */ r(d, { hasRadius: !0, background: "neutral0", shadow: "tableShadow", children: t }) })
+] });
+l.propTypes = {
+  endCol: o.node.isRequired,
+  startCol: o.node.isRequired
+};
+export {
+  l as TwoColsLayout
+};

package/dist/Layout/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./Layout.cjs"),e=require("./ActionLayout.cjs"),a=require("./ContentLayout.cjs"),o=require("./HeaderLayout.cjs"),u=require("./TwoColsLayout.cjs"),r=require("./GridLayout.cjs");exports.Layout=t.Layout;exports.ActionLayout=e.ActionLayout;exports.ContentLayout=a.ContentLayout;exports.BaseHeaderLayout=o.BaseHeaderLayout;exports.HeaderLayout=o.HeaderLayout;exports.TwoColsLayout=u.TwoColsLayout;exports.GridLayout=r.GridLayout;

package/dist/Layout/index.js

@@ -0,0 +1,15 @@
+import { Layout as r } from "./Layout.js";
+import { ActionLayout as a } from "./ActionLayout.js";
+import { ContentLayout as y } from "./ContentLayout.js";
+import { BaseHeaderLayout as f, HeaderLayout as m } from "./HeaderLayout.js";
+import { TwoColsLayout as x } from "./TwoColsLayout.js";
+import { GridLayout as n } from "./GridLayout.js";
+export {
+  a as ActionLayout,
+  f as BaseHeaderLayout,
+  y as ContentLayout,
+  n as GridLayout,
+  m as HeaderLayout,
+  r as Layout,
+  x as TwoColsLayout
+};

package/dist/Link/Link.cjs

@@ -0,0 +1,33 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),g=require("react"),y=require("@strapi/icons"),m=require("react-router-dom"),x=require("styled-components"),j=require("../themes/utils.cjs"),c=require("../Typography/Typography.cjs"),_=require("../Box/Box.cjs"),h=e=>e&&e.__esModule?e:{default:e};function b(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 n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const q=b(g),l=h(x),v=l.default.a`
+  display: inline-flex;
+  align-items: center;
+  text-decoration: none;
+  pointer-events: ${({disabled:e})=>e?"none":void 0};
+  color: ${({disabled:e,theme:r})=>e?r.colors.neutral600:r.colors.primary600};
+
+  svg path {
+    transition: fill 150ms ease-out;
+    fill: currentColor;
+  }
+
+  svg {
+    font-size: ${10/16}rem;
+  }
+
+  ${c.Typography} {
+    transition: color 150ms ease-out;
+    color: currentColor;
+  }
+
+  &:hover {
+    color: ${({theme:e})=>e.colors.primary500};
+  }
+
+  &:active {
+    color: ${({theme:e})=>e.colors.primary700};
+  }
+
+  ${j.buttonFocusStyle};
+`,i=l.default(_.Box)`
+  display: flex;
+`,k=q.forwardRef(({children:e,href:r,to:t,disabled:n=!1,startIcon:a,endIcon:s,...u},d)=>{const p=r?"_blank":void 0,f=r?"noreferrer noopener":void 0;return o.jsxs(v,{as:t&&!n?m.NavLink:"a",target:p,rel:f,to:n?void 0:t,href:n?"#":r,disabled:n,ref:d,...u,children:[a&&o.jsx(i,{as:"span","aria-hidden":!0,paddingRight:2,children:a}),o.jsx(c.Typography,{children:e}),s&&!r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:s}),r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:o.jsx(y.ExternalLink,{})})]})});exports.Link=k;

package/dist/Link/Link.js

@@ -0,0 +1,44 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import * as f from "react";
+import { ExternalLink as u } from "@strapi/icons";
+import { NavLink as g } from "react-router-dom";
+import s from "styled-components";
+import { buttonFocusStyle as y } from "../themes/utils.js";
+import { Typography as p } from "../Typography/Typography.js";
+import { Box as h } from "../Box/Box.js";
+const x = s.a`
+  display: inline-flex;
+  align-items: center;
+  text-decoration: none;
+  pointer-events: ${({ disabled: r }) => r ? "none" : void 0};
+  color: ${({ disabled: r, theme: o }) => r ? o.colors.neutral600 : o.colors.primary600};
+
+  svg path {
+    transition: fill 150ms ease-out;
+    fill: currentColor;
+  }
+
+  svg {
+    font-size: ${10 / 16}rem;
+  }
+
+  ${p} {
+    transition: color 150ms ease-out;
+    color: currentColor;
+  }
+
+  &:hover {
+    color: ${({ theme: r }) => r.colors.primary500};
+  }
+
+  &:active {
+    color: ${({ theme: r }) => r.colors.primary700};
+  }
+
+  ${y};
+`, t = s(h)`
+  display: flex;
+`, z = f.forwardRef(({ children: r, href: o, to: i, disabled: n = !1, startIcon: a, endIcon: l, ...c }, d) => m(x, { as: i && !n ? g : "a", target: o ? "_blank" : void 0, rel: o ? "noreferrer noopener" : void 0, to: n ? void 0 : i, href: n ? "#" : o, disabled: n, ref: d, ...c, children: [a && e(t, { as: "span", "aria-hidden": !0, paddingRight: 2, children: a }), e(p, { children: r }), l && !o && e(t, { as: "span", "aria-hidden": !0, paddingLeft: 2, children: l }), o && e(t, { as: "span", "aria-hidden": !0, paddingLeft: 2, children: e(u, {}) })] }));
+export {
+  z as Link
+};

package/dist/Link/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Link.cjs");exports.Link=e.Link;

package/dist/Link/index.js

@@ -0,0 +1,4 @@
+import { Link as e } from "./Link.js";
+export {
+  e as Link
+};

package/dist/LinkButton/LinkButton.cjs

@@ -0,0 +1,15 @@
+"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)`
+  &[aria-disabled='true'] {
+    ${o.getDisabledStyle}
+    &:active {
+      ${o.getDisabledStyle}
+    }
+  }
+  &:hover {
+    ${o.getHoverStyle}
+  }
+  &:active {
+    ${o.getActiveStyle}
+  }
+  ${o.getVariantStyle}
+`,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/LinkButton/LinkButton.js

@@ -0,0 +1,29 @@
+import { jsxs as v, jsx as n } from "react/jsx-runtime";
+import * as y from "react";
+import { NavLink as S } from "react-router-dom";
+import b from "styled-components";
+import { getDisabledStyle as f, getHoverStyle as x, getActiveStyle as k, getVariantStyle as $ } from "../Button/utils.js";
+import { BaseButtonWrapper as B } from "../BaseButton/BaseButton.js";
+import { Flex as u } from "../Flex/Flex.js";
+import { Typography as L } from "../Typography/Typography.js";
+const R = b(B)`
+  &[aria-disabled='true'] {
+    ${f}
+    &:active {
+      ${f}
+    }
+  }
+  &:hover {
+    ${x}
+  }
+  &:active {
+    ${k}
+  }
+  ${$}
+`, A = y.forwardRef(({ variant: l = "default", startIcon: o, endIcon: i, disabled: r = !1, children: m, size: t = "S", href: e, to: a, ...g }, s) => {
+  const c = e ? "_blank" : void 0, h = e ? "noreferrer noopener" : void 0, d = t === "S" ? 2 : "10px", p = 4;
+  return v(R, { ref: s, "aria-disabled": r, size: t, variant: l, target: c, rel: h, to: r ? void 0 : a, href: r ? "#" : e, background: "buttonPrimary600", borderColor: "buttonPrimary600", hasRadius: !0, gap: 2, inline: !0, paddingBottom: d, paddingLeft: p, paddingRight: p, paddingTop: d, pointerEvents: r ? "none" : void 0, ...g, as: a && !r ? S : "a", children: [o && n(u, { "aria-hidden": !0, children: o }), n(L, { variant: t === "S" ? "pi" : void 0, fontWeight: "bold", textColor: "buttonNeutral0", children: m }), i && n(u, { "aria-hidden": !0, children: i })] });
+});
+export {
+  A as LinkButton
+};

package/dist/LinkButton/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./LinkButton.cjs");exports.LinkButton=t.LinkButton;

package/dist/LinkButton/index.js

@@ -0,0 +1,4 @@
+import { LinkButton as n } from "./LinkButton.js";
+export {
+  n as LinkButton
+};

package/dist/LiveRegions/LiveRegions.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("./constants.cjs"),l=require("../VisuallyHidden/VisuallyHidden.cjs"),r=()=>e.jsxs(l.VisuallyHidden,{children:[e.jsx("p",{role:"log","aria-live":"polite",id:i.LiveRegionIds.Log,"aria-relevant":"all"}),e.jsx("p",{role:"status","aria-live":"polite",id:i.LiveRegionIds.Status,"aria-relevant":"all"}),e.jsx("p",{role:"alert","aria-live":"assertive",id:i.LiveRegionIds.Alert,"aria-relevant":"all"})]});exports.LiveRegions=r;

package/dist/LiveRegions/LiveRegions.js

@@ -0,0 +1,7 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { LiveRegionIds as i } from "./constants.js";
+import { VisuallyHidden as a } from "../VisuallyHidden/VisuallyHidden.js";
+const s = () => r(a, { children: [e("p", { role: "log", "aria-live": "polite", id: i.Log, "aria-relevant": "all" }), e("p", { role: "status", "aria-live": "polite", id: i.Status, "aria-relevant": "all" }), e("p", { role: "alert", "aria-live": "assertive", id: i.Alert, "aria-relevant": "all" })] });
+export {
+  s as LiveRegions
+};

package/dist/LiveRegions/constants.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={Log:"live-region-log",Status:"live-region-status",Alert:"live-region-alert"};exports.LiveRegionIds=e;

package/dist/LiveRegions/constants.js

@@ -0,0 +1,8 @@
+const e = {
+  Log: "live-region-log",
+  Status: "live-region-status",
+  Alert: "live-region-alert"
+};
+export {
+  e as LiveRegionIds
+};

package/dist/LiveRegions/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useNotifyAT.cjs"),i=require("./LiveRegions.cjs");exports.useNotifyAT=e.useNotifyAT;exports.LiveRegions=i.LiveRegions;

package/dist/LiveRegions/index.js

@@ -0,0 +1,6 @@
+import { useNotifyAT as r } from "./useNotifyAT.js";
+import { LiveRegions as i } from "./LiveRegions.js";
+export {
+  i as LiveRegions,
+  r as useNotifyAT
+};

package/dist/LiveRegions/useNotifyAT.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react"),o=require("./constants.cjs"),n=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Log}`);e&&(e.innerText=t)},r=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Status}`);e&&(e.innerText=t)},s=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Alert}`);e&&(e.innerText=t)},c=()=>(i.useEffect(()=>()=>{n(""),s(""),r("")},[]),{notifyLog:n,notifyAlert:s,notifyStatus:r});exports.useNotifyAT=c;