@strapi/design-system 0.0.0-599b75fb-test

package/dist/JSONInput/JSONInput.js

@@ -0,0 +1,109 @@
+import { jsx as n, jsxs as O } from "react/jsx-runtime";
+import { useRef as l, useEffect as J } from "react";
+import { json as j, jsonParseLinter as H } from "@codemirror/lang-json";
+import { useCodeMirror as L } from "@uiw/react-codemirror";
+import { JSONInputContainer as z } from "./JSONInputContainer.js";
+import { markField as A, addMarks as B, lineHighlightMark as R, filterMarks as q } from "./utils/decorationExtension.js";
+import { Field as y } from "../Field/Field.js";
+import { FieldLabel as P } from "../Field/FieldLabel.js";
+import "../Field/FieldInput.js";
+import { FieldHint as V } from "../Field/FieldHint.js";
+import { FieldError as D } from "../Field/FieldError.js";
+import "../Field/FieldContext.js";
+import "../Field/FieldAction.js";
+import { Flex as G } from "../Flex/Flex.js";
+const er = ({
+  label: a,
+  error: d,
+  hint: p,
+  labelAction: g,
+  value: E = "",
+  required: S = !1,
+  disabled: u = !1,
+  onChange: k = () => null,
+  ...C
+}) => {
+  const o = l(), i = l(), c = l(), F = Boolean(d), b = (r) => {
+    const t = i.current?.doc;
+    if (t) {
+      const {
+        text: s,
+        to: e
+      } = t.line(r), m = e - s.trimStart().length;
+      e > m && c.current?.dispatch({
+        effects: B.of([R.range(m, e)])
+      });
+    }
+  }, x = () => {
+    const r = i.current?.doc;
+    if (r) {
+      const t = r.length || 0;
+      c.current?.dispatch({
+        effects: q.of((s, e) => e <= 0 || s >= t)
+      });
+    }
+  }, f = ({
+    state: r,
+    view: t
+  }) => {
+    c.current = t, i.current = r, x();
+    const e = H()(t);
+    e.length && b(r.doc.lineAt(e[0].from).number);
+  }, M = (r, t) => {
+    f(t), k(r);
+  }, I = (r, t) => {
+    c.current = r, i.current = t, f({
+      view: r,
+      state: t
+    });
+  }, {
+    setContainer: h
+  } = L({
+    value: E,
+    onCreateEditor: I,
+    container: o.current,
+    editable: !u,
+    extensions: [j(), A],
+    onChange: M,
+    theme: "dark",
+    basicSetup: {
+      lineNumbers: !0,
+      bracketMatching: !0,
+      closeBrackets: !0,
+      indentOnInput: !0,
+      syntaxHighlighting: !0,
+      highlightSelectionMatches: !0,
+      tabSize: 2
+    }
+  }), N = () => {
+    u || o.current?.children[0].children[1].children[1]?.focus();
+  };
+  return J(() => {
+    const r = o.current;
+    r && h(r);
+  }, [h]), n(y, {
+    error: d,
+    hint: p,
+    required: S,
+    children: O(G, {
+      direction: "column",
+      alignItems: "stretch",
+      gap: 1,
+      children: [a && n(P, {
+        onClick: N,
+        action: g,
+        children: a
+      }), n(z, {
+        ref: o,
+        hasError: F,
+        alignItems: "stretch",
+        fontSize: 2,
+        hasRadius: !0,
+        ...C
+      }), n(D, {}), n(V, {})]
+    })
+  });
+};
+export {
+  er as JSONInput
+};

package/dist/JSONInput/JSONInputContainer.cjs

@@ -0,0 +1,33 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("styled-components"),r=require("../Flex/Flex.cjs"),s=require("../themes/utils.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=l(o),n=c.default(r.Flex)`
+  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:t})=>t?e.colors.danger600:e.colors.neutral200};
+    /* inputFocusStyle will receive hasError prop */
+    ${s.inputFocusStyle()}
+  }
+
+  .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;
+  }
+`;exports.JSONInputContainer=n;

package/dist/JSONInput/JSONInputContainer.js

@@ -0,0 +1,46 @@
+import o from "styled-components";
+import { Flex as t } from "../Flex/Flex.js";
+import { inputFocusStyle as c } from "../themes/utils.js";
+const l = o(t)`
+  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 */
+    ${c()}
+  }
+
+  .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.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./JSONInput.cjs");exports.JSONInput=e.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.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("@codemirror/state"),t=require("@codemirror/view"),a=i.StateEffect.define(),d=i.StateEffect.define(),s=t.Decoration.mark({attributes:{style:"background-color: yellow; color: black"}}),n=i.StateField.define({create(){return t.Decoration.none},update(e,o){return e=e.map(o.changes),o.effects.forEach(r=>{r.is(a)?e=e.update({add:r.value,sort:!0}):r.is(d)&&(e=e.update({filter:r.value}))}),e},provide:e=>t.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,24 @@
+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({
+  create() {
+    return i.none;
+  },
+  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;
+  },
+  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.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("react/jsx-runtime"),m=require("../Box/Box.cjs"),s=require("../helpers/keyboardKeys.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,53 @@
+import { jsx as m } from "react/jsx-runtime";
+import { Box as i } from "../Box/Box.js";
+import { KeyboardKeys as o } from "../helpers/keyboardKeys.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.defineProperties(exports,{__esModule:{value:!0},[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.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),i=require("prop-types"),f=require("styled-components"),n=require("../Box/Box.cjs"),s=require("../Flex/Flex.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=l(d),r=l(i),c=l(f),u=c.default(s.Flex)`
+  & > * + * {
+    margin-left: ${({theme:e})=>e.spaces[2]};
+  }
+
+  margin-left: ${({pullRight:e})=>e?"auto":void 0};
+`,p=c.default(u)`
+  flex-shrink: 0;
+`,a=({startActions:e,endActions:o})=>e||o?t.default.createElement(n.Box,{paddingLeft:10,paddingRight:10},t.default.createElement(n.Box,{paddingBottom:4},t.default.createElement(s.Flex,{justifyContent:"space-between",alignItems:"flex-start"},e&&t.default.createElement(u,{wrap:"wrap"},e),o&&t.default.createElement(p,{pullRight:!0},o)))):null;a.defaultProps={endActions:void 0,startActions:void 0};a.propTypes={endActions:r.default.node,startActions:r.default.node};exports.ActionLayout=a;

package/dist/Layout/ActionLayout.js

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

package/dist/Layout/ContentLayout.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react"),n=require("prop-types"),u=require("../Box/Box.cjs"),t=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=t(r),c=t(n),o=({children:e})=>a.default.createElement(u.Box,{paddingLeft:10,paddingRight:10},e);o.propTypes={children:c.default.node.isRequired};exports.ContentLayout=o;

package/dist/Layout/ContentLayout.js

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

package/dist/Layout/GridLayout.cjs

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

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

package/dist/Layout/HeaderLayout.js

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

package/dist/Layout/Layout.cjs

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

package/dist/Layout/Layout.js

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

package/dist/Layout/TwoColsLayout.cjs

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

package/dist/Layout/TwoColsLayout.js

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

package/dist/Layout/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("./Layout.cjs"),e=require("./ActionLayout.cjs"),u=require("./ContentLayout.cjs"),o=require("./HeaderLayout.cjs"),a=require("./TwoColsLayout.cjs"),r=require("./GridLayout.cjs");exports.Layout=t.Layout;exports.ActionLayout=e.ActionLayout;exports.ContentLayout=u.ContentLayout;exports.BaseHeaderLayout=o.BaseHeaderLayout;exports.HeaderLayout=o.HeaderLayout;exports.TwoColsLayout=a.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.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),y=require("react"),g=require("@strapi/icons"),j=require("react-router-dom"),m=require("styled-components"),x=require("../Box/Box.cjs"),h=require("../themes/utils.cjs"),c=require("../Typography/Typography.cjs"),_=e=>e&&typeof e=="object"&&"default"in e?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 v=b(y),l=_(m),q=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};
+  }
+
+  ${h.buttonFocusStyle};
+`,s=l.default(x.Box)`
+  display: flex;
+`,L=v.forwardRef(({children:e,href:r,to:t,disabled:n=!1,startIcon:i,endIcon:a,...u},d)=>{const p=r?"_blank":void 0,f=r?"noreferrer noopener":void 0;return o.jsxs(q,{as:t&&!n?j.NavLink:"a",target:p,rel:f,to:n?void 0:t,href:n?"#":r,disabled:n,ref:d,...u,children:[i&&o.jsx(s,{as:"span","aria-hidden":!0,paddingRight:2,children:i}),o.jsx(c.Typography,{children:e}),a&&!r&&o.jsx(s,{as:"span","aria-hidden":!0,paddingLeft:2,children:a}),r&&o.jsx(s,{as:"span","aria-hidden":!0,paddingLeft:2,children:o.jsx(g.ExternalLink,{})})]})});exports.Link=L;