@strapi/design-system 0.0.0-jsoninput.0

package/dist/MainNav/MainNav.cjs

@@ -0,0 +1,9 @@
+"use strict";var f=Object.defineProperty;var a=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var i=(e,t,r)=>t in e?f(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,l=(e,t)=>{for(var r in t||(t={}))c.call(t,r)&&i(e,r,t[r]);if(a)for(var r of a(t))d.call(t,r)&&i(e,r,t[r]);return e};var u=(e,t)=>{var r={};for(var o in e)c.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(e!=null&&a)for(var o of a(e))t.indexOf(o)<0&&d.call(e,o)&&(r[o]=e[o]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("react"),y=require("styled-components"),_=require("prop-types"),M=require("../Grid/Grid.cjs");require("../Grid/GridItem.cjs");const m=require("./MainNavContext.cjs"),n=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},p=n(v),b=n(y),g=n(_),q=b.default(M.Grid)`
+  width: ${({condensed:e})=>e?"max-content":`${224/16}rem`};
+  background: ${({theme:e})=>e.colors.neutral0};
+  position: sticky;
+  top: 0;
+  height: 100vh;
+  z-index: 2;
+  border-right: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,s=r=>{var o=r,{condensed:e}=o,t=u(o,["condensed"]);return p.default.createElement(m.MainNavContext.Provider,{value:e},p.default.createElement(q,l({as:"nav",condensed:e},t)))};s.defaultProps={condensed:!1};s.propTypes={condensed:g.default.bool};exports.MainNav=s;

package/dist/MainNav/MainNav.js

@@ -0,0 +1,52 @@
+var c = Object.defineProperty;
+var a = Object.getOwnPropertySymbols;
+var n = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
+var i = (o, r, e) => r in o ? c(o, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[r] = e, m = (o, r) => {
+  for (var e in r || (r = {}))
+    n.call(r, e) && i(o, e, r[e]);
+  if (a)
+    for (var e of a(r))
+      p.call(r, e) && i(o, e, r[e]);
+  return o;
+};
+var s = (o, r) => {
+  var e = {};
+  for (var t in o)
+    n.call(o, t) && r.indexOf(t) < 0 && (e[t] = o[t]);
+  if (o != null && a)
+    for (var t of a(o))
+      r.indexOf(t) < 0 && p.call(o, t) && (e[t] = o[t]);
+  return e;
+};
+import l from "react";
+import f from "styled-components";
+import u from "prop-types";
+import { Grid as v } from "../Grid/Grid.js";
+import "../Grid/GridItem.js";
+import { MainNavContext as h } from "./MainNavContext.js";
+const x = f(v)`
+  width: ${({ condensed: o }) => o ? "max-content" : `${224 / 16}rem`};
+  background: ${({ theme: o }) => o.colors.neutral0};
+  position: sticky;
+  top: 0;
+  height: 100vh;
+  z-index: 2;
+  border-right: 1px solid ${({ theme: o }) => o.colors.neutral150};
+`, d = (e) => {
+  var t = e, { condensed: o } = t, r = s(t, ["condensed"]);
+  return /* @__PURE__ */ l.createElement(h.Provider, {
+    value: o
+  }, /* @__PURE__ */ l.createElement(x, m({
+    as: "nav",
+    condensed: o
+  }, r)));
+};
+d.defaultProps = {
+  condensed: !1
+};
+d.propTypes = {
+  condensed: u.bool
+};
+export {
+  d as MainNav
+};

package/dist/MainNav/MainNavContext.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react"),t=e.createContext(),a=()=>e.useContext(t);exports.MainNavContext=t;exports.useMainNav=a;

package/dist/MainNav/MainNavContext.js

@@ -0,0 +1,6 @@
+import { createContext as t, useContext as e } from "react";
+const o = t(), a = () => e(o);
+export {
+  o as MainNavContext,
+  a as useMainNav
+};

package/dist/MainNav/NavBrand.cjs

@@ -0,0 +1,12 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("react"),m=require("prop-types"),y=require("styled-components"),d=require("react-router-dom"),r=require("../Box/Box.cjs"),s=require("../Typography/Typography.cjs"),x=require("../Flex/Flex.cjs"),h=require("./MainNavContext.cjs"),c=require("../VisuallyHidden/VisuallyHidden.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=l(g),a=l(m),f=l(y),p=f.default.div`
+  svg,
+  img {
+    border-radius: ${({theme:e})=>e.borderRadius};
+    object-fit: contain;
+    height: ${({condensed:e})=>e?`${40/16}rem`:`${32/16}rem`};
+    width: ${({condensed:e})=>e?`${40/16}rem`:`${32/16}rem`};
+  }
+`,v=f.default(d.NavLink)`
+  text-decoration: unset;
+  color: inherit;
+`,o=({workplace:e,title:i,icon:u,to:n})=>h.useMainNav()?t.default.createElement(r.Box,{paddingLeft:3,paddingRight:3,paddingTop:4,paddingBottom:4},t.default.createElement(p,{condensed:!0},t.default.createElement(d.NavLink,{to:n},u,t.default.createElement(c.VisuallyHidden,null,t.default.createElement("span",null,i),t.default.createElement("span",null,e))))):t.default.createElement(r.Box,{paddingLeft:3,paddingRight:3,paddingTop:4,paddingBottom:4},t.default.createElement(x.Flex,null,t.default.createElement(p,{as:d.NavLink,to:n,"aria-hidden":!0,tabIndex:-1},u),t.default.createElement(r.Box,{paddingLeft:2},t.default.createElement(s.Typography,{fontWeight:"bold",textColor:"neutral800",as:"span"},t.default.createElement(v,{to:n},i,t.default.createElement(c.VisuallyHidden,{as:"span"},e))),t.default.createElement(s.Typography,{variant:"pi",as:"p",textColor:"neutral600","aria-hidden":!0},e))));o.defaultProps={to:"/"};o.propTypes={icon:a.default.node.isRequired,title:a.default.string.isRequired,to:a.default.string,workplace:a.default.string.isRequired};exports.NavBrand=o;

package/dist/MainNav/NavBrand.js

@@ -0,0 +1,67 @@
+import e from "react";
+import r from "prop-types";
+import s from "styled-components";
+import { NavLink as i } from "react-router-dom";
+import { Box as a } from "../Box/Box.js";
+import { Typography as m } from "../Typography/Typography.js";
+import { Flex as u } from "../Flex/Flex.js";
+import { useMainNav as g } from "./MainNavContext.js";
+import { VisuallyHidden as p } from "../VisuallyHidden/VisuallyHidden.js";
+const l = s.div`
+  svg,
+  img {
+    border-radius: ${({ theme: t }) => t.borderRadius};
+    object-fit: contain;
+    height: ${({ condensed: t }) => t ? `${40 / 16}rem` : `${32 / 16}rem`};
+    width: ${({ condensed: t }) => t ? `${40 / 16}rem` : `${32 / 16}rem`};
+  }
+`, f = s(i)`
+  text-decoration: unset;
+  color: inherit;
+`, c = ({ workplace: t, title: o, icon: d, to: n }) => g() ? /* @__PURE__ */ e.createElement(a, {
+  paddingLeft: 3,
+  paddingRight: 3,
+  paddingTop: 4,
+  paddingBottom: 4
+}, /* @__PURE__ */ e.createElement(l, {
+  condensed: !0
+}, /* @__PURE__ */ e.createElement(i, {
+  to: n
+}, d, /* @__PURE__ */ e.createElement(p, null, /* @__PURE__ */ e.createElement("span", null, o), /* @__PURE__ */ e.createElement("span", null, t))))) : /* @__PURE__ */ e.createElement(a, {
+  paddingLeft: 3,
+  paddingRight: 3,
+  paddingTop: 4,
+  paddingBottom: 4
+}, /* @__PURE__ */ e.createElement(u, null, /* @__PURE__ */ e.createElement(l, {
+  as: i,
+  to: n,
+  "aria-hidden": !0,
+  tabIndex: -1
+}, d), /* @__PURE__ */ e.createElement(a, {
+  paddingLeft: 2
+}, /* @__PURE__ */ e.createElement(m, {
+  fontWeight: "bold",
+  textColor: "neutral800",
+  as: "span"
+}, /* @__PURE__ */ e.createElement(f, {
+  to: n
+}, o, /* @__PURE__ */ e.createElement(p, {
+  as: "span"
+}, t))), /* @__PURE__ */ e.createElement(m, {
+  variant: "pi",
+  as: "p",
+  textColor: "neutral600",
+  "aria-hidden": !0
+}, t))));
+c.defaultProps = {
+  to: "/"
+};
+c.propTypes = {
+  icon: r.node.isRequired,
+  title: r.string.isRequired,
+  to: r.string,
+  workplace: r.string.isRequired
+};
+export {
+  c as NavBrand
+};

package/dist/MainNav/NavCondense.cjs

@@ -0,0 +1,20 @@
+"use strict";var p=Object.defineProperty;var s=Object.getOwnPropertySymbols;var l=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable;var d=(e,t,n)=>t in e?p(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,c=(e,t)=>{for(var n in t||(t={}))l.call(t,n)&&d(e,n,t[n]);if(s)for(var n of s(t))u.call(t,n)&&d(e,n,t[n]);return e};var f=(e,t)=>{var n={};for(var o in e)l.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(e!=null&&s)for(var o of s(e))t.indexOf(o)<0&&u.call(e,o)&&(n[o]=e[o]);return n};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("react"),g=require("prop-types"),y=require("styled-components"),m=require("@strapi/icons/ChevronRight"),_=require("@strapi/icons/ChevronLeft"),b=require("../Icon/Icon.cjs"),C=require("../VisuallyHidden/VisuallyHidden.cjs"),$=require("./MainNavContext.cjs"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=r(v),q=r(g),R=r(y),j=r(m),N=r(_),x=R.default.button`
+  background: ${({theme:e})=>e.colors.neutral0};
+  border: 1px solid ${({theme:e})=>e.colors.neutral150};
+  border-radius: ${({theme:e})=>e.borderRadius};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  bottom: ${(9+4)/16}rem; // 9 is the height of the svg and 4 is the padding below
+  right: ${({theme:e,condensed:t})=>t?0:e.spaces[5]};
+  transform: ${({condensed:e})=>e?"translateX(50%)":void 0};
+  z-index: 2;
+  width: ${18/16}rem;
+  height: ${25/16}rem;
+
+  svg {
+    width: ${6/16}rem;
+    height: ${9/16}rem;
+  }
+`,h=n=>{var o=n,{children:e}=o,t=f(o,["children"]);const i=$.useMainNav();return a.default.createElement(x,c({as:"button",condensed:i},t),a.default.createElement(b.Icon,{as:i?j.default:N.default,"aria-hidden":!0,color:"neutral600"}),a.default.createElement(C.VisuallyHidden,null,e))};h.propTypes={children:q.default.string.isRequired};exports.NavCondense=h;

package/dist/MainNav/NavCondense.js

@@ -0,0 +1,65 @@
+var c = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, m = Object.prototype.propertyIsEnumerable;
+var a = (e, r, t) => r in e ? c(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, l = (e, r) => {
+  for (var t in r || (r = {}))
+    d.call(r, t) && a(e, t, r[t]);
+  if (n)
+    for (var t of n(r))
+      m.call(r, t) && a(e, t, r[t]);
+  return e;
+};
+var p = (e, r) => {
+  var t = {};
+  for (var o in e)
+    d.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && n)
+    for (var o of n(e))
+      r.indexOf(o) < 0 && m.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+import i from "react";
+import h from "prop-types";
+import u from "styled-components";
+import f from "@strapi/icons/ChevronRight";
+import g from "@strapi/icons/ChevronLeft";
+import { Icon as $ } from "../Icon/Icon.js";
+import { VisuallyHidden as b } from "../VisuallyHidden/VisuallyHidden.js";
+import { useMainNav as v } from "./MainNavContext.js";
+const y = u.button`
+  background: ${({ theme: e }) => e.colors.neutral0};
+  border: 1px solid ${({ theme: e }) => e.colors.neutral150};
+  border-radius: ${({ theme: e }) => e.borderRadius};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  bottom: ${(9 + 4) / 16}rem; // 9 is the height of the svg and 4 is the padding below
+  right: ${({ theme: e, condensed: r }) => r ? 0 : e.spaces[5]};
+  transform: ${({ condensed: e }) => e ? "translateX(50%)" : void 0};
+  z-index: 2;
+  width: ${18 / 16}rem;
+  height: ${25 / 16}rem;
+
+  svg {
+    width: ${6 / 16}rem;
+    height: ${9 / 16}rem;
+  }
+`, x = (t) => {
+  var o = t, { children: e } = o, r = p(o, ["children"]);
+  const s = v();
+  return /* @__PURE__ */ i.createElement(y, l({
+    as: "button",
+    condensed: s
+  }, r), /* @__PURE__ */ i.createElement($, {
+    as: s ? f : g,
+    "aria-hidden": !0,
+    color: "neutral600"
+  }), /* @__PURE__ */ i.createElement(b, null, e));
+};
+x.propTypes = {
+  children: h.string.isRequired
+};
+export {
+  x as NavCondense
+};

package/dist/MainNav/NavLink.cjs

@@ -0,0 +1,69 @@
+"use strict";var q=Object.defineProperty;var s=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var g=(e,a,t)=>a in e?q(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,d=(e,a)=>{for(var t in a||(a={}))y.call(a,t)&&g(e,t,a[t]);if(s)for(var t of s(a))m.call(a,t)&&g(e,t,a[t]);return e};var h=(e,a)=>{var t={};for(var o in e)y.call(e,o)&&a.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&s)for(var o of s(e))a.indexOf(o)<0&&m.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const j=require("react"),E=require("styled-components"),k=require("prop-types"),B=require("react-router-dom"),N=require("../Box/Box.cjs"),x=require("../Flex/Flex.cjs"),l=require("../Typography/Typography.cjs"),R=require("./MainNavContext.cjs"),_=require("../Tooltip/Tooltip.cjs"),L=require("../Badge/Badge.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=u(j),i=u(E),n=u(k),$=i.default(N.Box)`
+  svg {
+    width: 1rem;
+    height: 1rem;
+  }
+`,v=i.default(B.NavLink)`
+  position: relative;
+  text-decoration: none;
+  display: block;
+  border-radius: ${({theme:e})=>e.borderRadius};
+  background: ${({theme:e})=>e.colors.neutral0};
+
+  ${l.Typography} {
+    color: ${({theme:e})=>e.colors.neutral600};
+  }
+
+  svg path {
+    fill: ${({theme:e})=>e.colors.neutral500};
+  }
+
+  &:hover {
+    background: ${({theme:e})=>e.colors.neutral100};
+
+    ${l.Typography} {
+      color: ${({theme:e})=>e.colors.neutral700};
+    }
+
+    svg path {
+      fill: ${({theme:e})=>e.colors.neutral600};
+    }
+  }
+
+  &.active {
+    background: ${({theme:e})=>e.colors.primary100};
+
+    svg path {
+      fill: ${({theme:e})=>e.colors.primary600};
+    }
+
+    ${l.Typography} {
+      color: ${({theme:e})=>e.colors.primary600};
+      font-weight: 500;
+    }
+  }
+`,b=i.default(x.Flex)`
+  padding: ${({theme:e})=>`${e.spaces[2]} ${e.spaces[3]}`};
+`,T=i.default(L.Badge)`
+  ${({condensed:e})=>e&&`
+	  position: absolute;
+    transform: translate(35%, -50%);
+    top: 0;
+    right: 0;
+  `}
+
+  ${l.Typography} {
+    //find a solution to remove !important
+    color: ${({theme:e})=>e.colors.neutral0} !important;
+    line-height: 0;
+  }
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-width: ${({theme:e})=>e.spaces[6]};
+  height: ${({theme:e})=>e.spaces[5]};
+  padding: ${({theme:e})=>`0 ${e.spaces[2]}`};
+  border-radius: ${({theme:e})=>e.spaces[10]};
+  background: ${({theme:e})=>e.colors.primary600};
+`,c=M=>{var f=M,{children:e,icon:a,badgeContent:t,badgeAriaLabel:o}=f,p=h(f,["children","icon","badgeContent","badgeAriaLabel"]);return R.useMainNav()?r.default.createElement(_.Tooltip,{position:"right",label:e},r.default.createElement(v,d({},p),r.default.createElement(b,{as:"span"},r.default.createElement($,{"aria-hidden":!0,paddingRight:0,as:"span"},a),t&&r.default.createElement(T,{condensed:!0,"aria-label":o},t)))):r.default.createElement(v,d({},p),r.default.createElement(b,{as:"span",justifyContent:"space-between"},r.default.createElement(x.Flex,null,r.default.createElement($,{"aria-hidden":!0,paddingRight:3,as:"span"},a),r.default.createElement(l.Typography,null,e)),t&&r.default.createElement(T,{justifyContent:"center","aria-label":o},t)))};c.displayName="NavLink";c.defaultProps={badgeContent:void 0,badgeAriaLabel:void 0};c.propTypes={badgeAriaLabel:n.default.string,badgeContent:n.default.oneOfType([n.default.string,n.default.number]),children:n.default.node.isRequired,icon:n.default.node.isRequired};exports.NavLink=c;

package/dist/MainNav/NavLink.js

@@ -0,0 +1,138 @@
+var k = Object.defineProperty;
+var s = Object.getOwnPropertySymbols;
+var g = Object.prototype.hasOwnProperty, $ = Object.prototype.propertyIsEnumerable;
+var u = (e, o, r) => o in e ? k(e, o, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[o] = r, c = (e, o) => {
+  for (var r in o || (o = {}))
+    g.call(o, r) && u(e, r, o[r]);
+  if (s)
+    for (var r of s(o))
+      $.call(o, r) && u(e, r, o[r]);
+  return e;
+};
+var f = (e, o) => {
+  var r = {};
+  for (var t in e)
+    g.call(e, t) && o.indexOf(t) < 0 && (r[t] = e[t]);
+  if (e != null && s)
+    for (var t of s(e))
+      o.indexOf(t) < 0 && $.call(e, t) && (r[t] = e[t]);
+  return r;
+};
+import a from "react";
+import l from "styled-components";
+import n from "prop-types";
+import { NavLink as N } from "react-router-dom";
+import { Box as R } from "../Box/Box.js";
+import { Flex as E } from "../Flex/Flex.js";
+import { Typography as i } from "../Typography/Typography.js";
+import { useMainNav as x } from "./MainNavContext.js";
+import { Tooltip as L } from "../Tooltip/Tooltip.js";
+import { Badge as w } from "../Badge/Badge.js";
+const h = l(R)`
+  svg {
+    width: 1rem;
+    height: 1rem;
+  }
+`, v = l(N)`
+  position: relative;
+  text-decoration: none;
+  display: block;
+  border-radius: ${({ theme: e }) => e.borderRadius};
+  background: ${({ theme: e }) => e.colors.neutral0};
+
+  ${i} {
+    color: ${({ theme: e }) => e.colors.neutral600};
+  }
+
+  svg path {
+    fill: ${({ theme: e }) => e.colors.neutral500};
+  }
+
+  &:hover {
+    background: ${({ theme: e }) => e.colors.neutral100};
+
+    ${i} {
+      color: ${({ theme: e }) => e.colors.neutral700};
+    }
+
+    svg path {
+      fill: ${({ theme: e }) => e.colors.neutral600};
+    }
+  }
+
+  &.active {
+    background: ${({ theme: e }) => e.colors.primary100};
+
+    svg path {
+      fill: ${({ theme: e }) => e.colors.primary600};
+    }
+
+    ${i} {
+      color: ${({ theme: e }) => e.colors.primary600};
+      font-weight: 500;
+    }
+  }
+`, y = l(E)`
+  padding: ${({ theme: e }) => `${e.spaces[2]} ${e.spaces[3]}`};
+`, b = l(w)`
+  ${({ condensed: e }) => e && `
+	  position: absolute;
+    transform: translate(35%, -50%);
+    top: 0;
+    right: 0;
+  `}
+
+  ${i} {
+    //find a solution to remove !important
+    color: ${({ theme: e }) => e.colors.neutral0} !important;
+    line-height: 0;
+  }
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-width: ${({ theme: e }) => e.spaces[6]};
+  height: ${({ theme: e }) => e.spaces[5]};
+  padding: ${({ theme: e }) => `0 ${e.spaces[2]}`};
+  border-radius: ${({ theme: e }) => e.spaces[10]};
+  background: ${({ theme: e }) => e.colors.primary600};
+`, p = (T) => {
+  var m = T, { children: e, icon: o, badgeContent: r, badgeAriaLabel: t } = m, d = f(m, ["children", "icon", "badgeContent", "badgeAriaLabel"]);
+  return x() ? /* @__PURE__ */ a.createElement(L, {
+    position: "right",
+    label: e
+  }, /* @__PURE__ */ a.createElement(v, c({}, d), /* @__PURE__ */ a.createElement(y, {
+    as: "span"
+  }, /* @__PURE__ */ a.createElement(h, {
+    "aria-hidden": !0,
+    paddingRight: 0,
+    as: "span"
+  }, o), r && /* @__PURE__ */ a.createElement(b, {
+    condensed: !0,
+    "aria-label": t
+  }, r)))) : /* @__PURE__ */ a.createElement(v, c({}, d), /* @__PURE__ */ a.createElement(y, {
+    as: "span",
+    justifyContent: "space-between"
+  }, /* @__PURE__ */ a.createElement(E, null, /* @__PURE__ */ a.createElement(h, {
+    "aria-hidden": !0,
+    paddingRight: 3,
+    as: "span"
+  }, o), /* @__PURE__ */ a.createElement(i, null, e)), r && /* @__PURE__ */ a.createElement(b, {
+    justifyContent: "center",
+    "aria-label": t
+  }, r)));
+};
+p.displayName = "NavLink";
+p.defaultProps = {
+  badgeContent: void 0,
+  badgeAriaLabel: void 0
+};
+p.propTypes = {
+  badgeAriaLabel: n.string,
+  badgeContent: n.oneOfType([n.string, n.number]),
+  children: n.node.isRequired,
+  icon: n.node.isRequired
+};
+export {
+  p as NavLink
+};

package/dist/MainNav/NavSection.cjs

@@ -0,0 +1 @@
+"use strict";var S=Object.defineProperty;var i=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable;var p=(e,a,t)=>a in e?S(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,c=(e,a)=>{for(var t in a||(a={}))f.call(a,t)&&p(e,t,a[t]);if(i)for(var t of i(a))g.call(a,t)&&p(e,t,a[t]);return e};var y=(e,a)=>{var t={};for(var r in e)f.call(e,r)&&a.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&i)for(var r of i(e))a.indexOf(r)<0&&g.call(e,r)&&(t[r]=e[r]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),q=require("prop-types"),m=require("../Box/Box.cjs"),T=require("../Typography/Typography.cjs"),l=require("../Stack/Stack.cjs"),h=require("./MainNavContext.cjs"),j=require("../VisuallyHidden/VisuallyHidden.cjs"),x=require("../Divider/Divider.cjs"),E=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=E(s),v=E(q),k=r=>{var o=r,{label:e,children:a}=o,t=y(o,["label","children"]);return h.useMainNav()?n.default.createElement(l.Stack,{spacing:2},n.default.createElement(m.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",hasRadius:!0,as:"span"},n.default.createElement(x.Divider,null),n.default.createElement(j.VisuallyHidden,null,n.default.createElement("span",null,e))),n.default.createElement(l.Stack,c({as:"ul",spacing:2},t),s.Children.map(a,(d,u)=>n.default.createElement("li",{key:u},d)))):n.default.createElement(l.Stack,{spacing:2},n.default.createElement(m.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",paddingRight:3,paddingLeft:3,hasRadius:!0,as:"span"},n.default.createElement(T.Typography,{variant:"sigma",textColor:"neutral600"},e)),n.default.createElement(l.Stack,c({as:"ul",spacing:2},t),s.Children.map(a,(d,u)=>n.default.createElement("li",{key:u},d))))};k.propTypes={children:v.default.node.isRequired,label:v.default.string.isRequired};exports.NavSection=k;

package/dist/MainNav/NavSection.js

@@ -0,0 +1,70 @@
+var R = Object.defineProperty;
+var i = Object.getOwnPropertySymbols;
+var c = Object.prototype.hasOwnProperty, u = Object.prototype.propertyIsEnumerable;
+var s = (e, r, t) => r in e ? R(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, l = (e, r) => {
+  for (var t in r || (r = {}))
+    c.call(r, t) && s(e, t, r[t]);
+  if (i)
+    for (var t of i(r))
+      u.call(r, t) && s(e, t, r[t]);
+  return e;
+};
+var g = (e, r) => {
+  var t = {};
+  for (var n in e)
+    c.call(e, n) && r.indexOf(n) < 0 && (t[n] = e[n]);
+  if (e != null && i)
+    for (var n of i(e))
+      r.indexOf(n) < 0 && u.call(e, n) && (t[n] = e[n]);
+  return t;
+};
+import a, { Children as E } from "react";
+import f from "prop-types";
+import { Box as y } from "../Box/Box.js";
+import { Typography as h } from "../Typography/Typography.js";
+import { Stack as o } from "../Stack/Stack.js";
+import { useMainNav as k } from "./MainNavContext.js";
+import { VisuallyHidden as T } from "../VisuallyHidden/VisuallyHidden.js";
+import { Divider as v } from "../Divider/Divider.js";
+const x = (n) => {
+  var d = n, { label: e, children: r } = d, t = g(d, ["label", "children"]);
+  return k() ? /* @__PURE__ */ a.createElement(o, {
+    spacing: 2
+  }, /* @__PURE__ */ a.createElement(y, {
+    paddingTop: 1,
+    paddingBottom: 1,
+    background: "neutral0",
+    hasRadius: !0,
+    as: "span"
+  }, /* @__PURE__ */ a.createElement(v, null), /* @__PURE__ */ a.createElement(T, null, /* @__PURE__ */ a.createElement("span", null, e))), /* @__PURE__ */ a.createElement(o, l({
+    as: "ul",
+    spacing: 2
+  }, t), E.map(r, (m, p) => /* @__PURE__ */ a.createElement("li", {
+    key: p
+  }, m)))) : /* @__PURE__ */ a.createElement(o, {
+    spacing: 2
+  }, /* @__PURE__ */ a.createElement(y, {
+    paddingTop: 1,
+    paddingBottom: 1,
+    background: "neutral0",
+    paddingRight: 3,
+    paddingLeft: 3,
+    hasRadius: !0,
+    as: "span"
+  }, /* @__PURE__ */ a.createElement(h, {
+    variant: "sigma",
+    textColor: "neutral600"
+  }, e)), /* @__PURE__ */ a.createElement(o, l({
+    as: "ul",
+    spacing: 2
+  }, t), E.map(r, (m, p) => /* @__PURE__ */ a.createElement("li", {
+    key: p
+  }, m))));
+};
+x.propTypes = {
+  children: f.node.isRequired,
+  label: f.string.isRequired
+};
+export {
+  x as NavSection
+};

package/dist/MainNav/NavSections.cjs

@@ -0,0 +1 @@
+"use strict";var S=Object.defineProperty;var c=Object.getOwnPropertySymbols;var s=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable;var n=(e,t,a)=>t in e?S(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,i=(e,t)=>{for(var a in t||(t={}))s.call(t,a)&&n(e,a,t[a]);if(c)for(var a of c(t))u.call(t,a)&&n(e,a,t[a]);return e};var d=(e,t)=>{var a={};for(var r in e)s.call(e,r)&&t.indexOf(r)<0&&(a[r]=e[r]);if(e!=null&&c)for(var r of c(e))t.indexOf(r)<0&&u.call(e,r)&&(a[r]=e[r]);return a};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),_=require("prop-types"),k=require("../Stack/Stack.cjs"),m=require("../Box/Box.cjs"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=p(l),q=p(_),f=a=>{var r=a,{children:e}=r,t=d(r,["children"]);return o.default.createElement(m.Box,{paddingLeft:3,paddingRight:2,paddingTop:3},o.default.createElement(k.Stack,i({as:"ul",spacing:4},t),l.Children.map(e,(g,y)=>o.default.createElement("li",{key:y},g))))};f.propTypes={children:q.default.node.isRequired};exports.NavSections=f;

package/dist/MainNav/NavSections.js

@@ -0,0 +1,43 @@
+var f = Object.defineProperty;
+var p = Object.getOwnPropertySymbols;
+var a = Object.prototype.hasOwnProperty, m = Object.prototype.propertyIsEnumerable;
+var n = (e, r, t) => r in e ? f(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, d = (e, r) => {
+  for (var t in r || (r = {}))
+    a.call(r, t) && n(e, t, r[t]);
+  if (p)
+    for (var t of p(r))
+      m.call(r, t) && n(e, t, r[t]);
+  return e;
+};
+var c = (e, r) => {
+  var t = {};
+  for (var o in e)
+    a.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && p)
+    for (var o of p(e))
+      r.indexOf(o) < 0 && m.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+import i, { Children as g } from "react";
+import u from "prop-types";
+import { Stack as h } from "../Stack/Stack.js";
+import { Box as y } from "../Box/Box.js";
+const E = (t) => {
+  var o = t, { children: e } = o, r = c(o, ["children"]);
+  return /* @__PURE__ */ i.createElement(y, {
+    paddingLeft: 3,
+    paddingRight: 2,
+    paddingTop: 3
+  }, /* @__PURE__ */ i.createElement(h, d({
+    as: "ul",
+    spacing: 4
+  }, r), g.map(e, (l, s) => /* @__PURE__ */ i.createElement("li", {
+    key: s
+  }, l))));
+};
+E.propTypes = {
+  children: u.node.isRequired
+};
+export {
+  E as NavSections
+};

package/dist/MainNav/NavUser.cjs

@@ -0,0 +1,7 @@
+"use strict";var q=Object.defineProperty;var n=Object.getOwnPropertySymbols;var p=Object.prototype.hasOwnProperty,f=Object.prototype.propertyIsEnumerable;var c=(e,t,a)=>t in e?q(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,y=(e,t)=>{for(var a in t||(t={}))p.call(t,a)&&c(e,a,t[a]);if(n)for(var a of n(t))f.call(t,a)&&c(e,a,t[a]);return e};var v=(e,t)=>{var a={};for(var r in e)p.call(e,r)&&t.indexOf(r)<0&&(a[r]=e[r]);if(e!=null&&n)for(var r of n(e))t.indexOf(r)<0&&f.call(e,r)&&(a[r]=e[r]);return a};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const j=require("react"),T=require("prop-types"),_=require("styled-components"),x=require("../Avatar/Avatar.cjs");require("../Avatar/AvatarGroup.cjs");const h=require("../Typography/Typography.cjs"),E=require("../Flex/Flex.cjs"),g=require("../Box/Box.cjs"),N=require("./MainNavContext.cjs"),b=require("../VisuallyHidden/VisuallyHidden.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=d(j),s=d(T),B=d(_),A=B.default(g.Box)`
+  text-decoration: none;
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,l=o.default.forwardRef((M,m)=>{var i=M,{src:e,children:t,initials:a}=i,r=v(i,["src","children","initials"]);const u=N.useMainNav();return o.default.createElement(A,y({paddingTop:3,paddingBottom:3,paddingLeft:5,paddingRight:5},r),o.default.createElement(E.Flex,{as:"button",justifyContent:u?"center":void 0,ref:m},e?o.default.createElement(x.Avatar,{src:e,alt:"","aria-hidden":!0}):o.default.createElement(x.Initials,null,a),u?o.default.createElement(b.VisuallyHidden,null,o.default.createElement("span",null,t)):o.default.createElement(g.Box,{width:`${130/16}rem`,paddingLeft:2,as:"span"},o.default.createElement(h.Typography,{ellipsis:!0,textColor:"neutral600"},t))))});l.displayName="NavUser";l.defaultProps={src:void 0,initials:void 0};l.propTypes={children:s.default.node.isRequired,initials:s.default.node,src:s.default.string};exports.NavUser=l;

package/dist/MainNav/NavUser.js

@@ -0,0 +1,74 @@
+var y = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var s = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
+var m = (e, t, o) => t in e ? y(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o, f = (e, t) => {
+  for (var o in t || (t = {}))
+    s.call(t, o) && m(e, o, t[o]);
+  if (n)
+    for (var o of n(t))
+      c.call(t, o) && m(e, o, t[o]);
+  return e;
+};
+var u = (e, t) => {
+  var o = {};
+  for (var r in e)
+    s.call(e, r) && t.indexOf(r) < 0 && (o[r] = e[r]);
+  if (e != null && n)
+    for (var r of n(e))
+      t.indexOf(r) < 0 && c.call(e, r) && (o[r] = e[r]);
+  return o;
+};
+import i from "react";
+import a from "prop-types";
+import E from "styled-components";
+import { Avatar as x, Initials as h } from "../Avatar/Avatar.js";
+import "../Avatar/AvatarGroup.js";
+import { Typography as N } from "../Typography/Typography.js";
+import { Flex as b } from "../Flex/Flex.js";
+import { Box as g } from "../Box/Box.js";
+import { useMainNav as R } from "./MainNavContext.js";
+import { VisuallyHidden as T } from "../VisuallyHidden/VisuallyHidden.js";
+const w = E(g)`
+  text-decoration: none;
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  border-top: 1px solid ${({ theme: e }) => e.colors.neutral150};
+`, l = i.forwardRef((B, v) => {
+  var d = B, { src: e, children: t, initials: o } = d, r = u(d, ["src", "children", "initials"]);
+  const p = R();
+  return /* @__PURE__ */ i.createElement(w, f({
+    paddingTop: 3,
+    paddingBottom: 3,
+    paddingLeft: 5,
+    paddingRight: 5
+  }, r), /* @__PURE__ */ i.createElement(b, {
+    as: "button",
+    justifyContent: p ? "center" : void 0,
+    ref: v
+  }, e ? /* @__PURE__ */ i.createElement(x, {
+    src: e,
+    alt: "",
+    "aria-hidden": !0
+  }) : /* @__PURE__ */ i.createElement(h, null, o), p ? /* @__PURE__ */ i.createElement(T, null, /* @__PURE__ */ i.createElement("span", null, t)) : /* @__PURE__ */ i.createElement(g, {
+    width: `${130 / 16}rem`,
+    paddingLeft: 2,
+    as: "span"
+  }, /* @__PURE__ */ i.createElement(N, {
+    ellipsis: !0,
+    textColor: "neutral600"
+  }, t))));
+});
+l.displayName = "NavUser";
+l.defaultProps = {
+  src: void 0,
+  initials: void 0
+};
+l.propTypes = {
+  children: a.node.isRequired,
+  initials: a.node,
+  src: a.string
+};
+export {
+  l as NavUser
+};