@strapi/design-system 1.3.0-beta.0 → 1.3.0-beta.2

package/dist/Popover/Popover.cjs

@@ -1,26 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("react"),j=require("prop-types"),S=require("styled-components"),a=require("@floating-ui/react-dom"),u=require("../Box/Box.cjs"),T=require("../Portal/Portal.cjs"),$=require("../helpers/useIntersection.cjs"),b=e=>e&&typeof e=="object"&&"default"in e?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 r in e)if(r!=="default"){const s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,s.get?s:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const o=M(q),t=b(j),m=b(S),h=["top","top-start","top-end","right","right-start","right-end","bottom","bottom-start","bottom-end","left","left-start","left-end"],B=m.default(u.Box)`
-  box-shadow: ${({theme:e})=>e.shadows.filterShadow};
-  z-index: 4;
-  border: 1px solid ${({theme:e})=>e.colors.neutral150};
-  background: ${({theme:e})=>e.colors.neutral0};
-`,W=m.default(u.Box)`
-  // 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
-  max-height: ${3*5}rem;
-  overflow-y: auto;
-  overflow-x: hidden;
-
-  &::-webkit-scrollbar {
-    -webkit-appearance: none;
-    width: 4px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: ${({theme:e})=>e.colors.neutral0};
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: ${({theme:e})=>e.colors.neutral150};
-    border-radius: ${({theme:e})=>e.borderRadius};
-    margin-right: 10px;
-  }
-`,c=({source:e,children:n,spacing:r,fullWidth:s,placement:y,onReachEnd:i,intersectionId:l,centered:v,...x})=>{const f=o.useRef(null),[p,w]=o.useState(void 0),{x:E,y:_,reference:O,floating:k,strategy:R}=a.useFloating({strategy:"fixed",placement:v?"bottom":y,middleware:[a.offset({mainAxis:r}),a.shift(),a.flip()],whileElementsMounted:a.autoUpdate});return o.useLayoutEffect(()=>{O(e.current)},[e]),o.useLayoutEffect(()=>{s&&w(e.current.offsetWidth)},[s]),$.useIntersection(f,i,{selectorToWatch:`#${l}`,skipWhen:!l||!i}),o.createElement(B,{ref:k,style:{left:E,top:_,position:R,width:p||void 0},hasRadius:!0,background:"neutral0",padding:1},o.createElement(W,{ref:f,...x},n,l&&i&&o.createElement(u.Box,{id:l,width:"100%",height:"1px"})))},d=e=>o.createElement(T.Portal,null,o.createElement(c,{...e})),g={fullWidth:!1,intersectionId:void 0,onReachEnd:void 0,centered:!1,placement:"bottom-start"},P={centered:t.default.bool,children:t.default.node.isRequired,fullWidth:t.default.bool,intersectionId:t.default.string,onReachEnd:t.default.func,placement:t.default.oneOf(h),source:t.default.shape({current:(typeof Element>"u"?t.default.any:t.default.instanceOf(Element)).isRequired}).isRequired,spacing:t.default.number};c.propTypes=P;c.defaultProps=g;d.propTypes=P;d.defaultProps=g;exports.POPOVER_PLACEMENTS=h;exports.Popover=d;

package/dist/Popover/Popover.js

@@ -1,122 +0,0 @@
-import * as o from "react";
-import t from "prop-types";
-import d from "styled-components";
-import { useFloating as R, offset as $, shift as W, flip as T, autoUpdate as O } from "@floating-ui/react-dom";
-import { Box as s } from "../Box/Box.js";
-import { Portal as S } from "../Portal/Portal.js";
-import { useIntersection as q } from "../helpers/useIntersection.js";
-const L = [
-  "top",
-  "top-start",
-  "top-end",
-  "right",
-  "right-start",
-  "right-end",
-  "bottom",
-  "bottom-start",
-  "bottom-end",
-  "left",
-  "left-start",
-  "left-end"
-], z = d(s)`
-  box-shadow: ${({ theme: e }) => e.shadows.filterShadow};
-  z-index: 4;
-  border: 1px solid ${({ theme: e }) => e.colors.neutral150};
-  background: ${({ theme: e }) => e.colors.neutral0};
-`, A = d(s)`
-  // 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
-  max-height: ${3 * 5}rem;
-  overflow-y: auto;
-  overflow-x: hidden;
-
-  &::-webkit-scrollbar {
-    -webkit-appearance: none;
-    width: 4px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: ${({ theme: e }) => e.colors.neutral0};
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: ${({ theme: e }) => e.colors.neutral150};
-    border-radius: ${({ theme: e }) => e.borderRadius};
-    margin-right: 10px;
-  }
-`, a = ({
-  source: e,
-  children: m,
-  spacing: h,
-  fullWidth: i,
-  placement: b,
-  onReachEnd: n,
-  intersectionId: r,
-  centered: g,
-  ...w
-}) => {
-  const l = o.useRef(null), [p, v] = o.useState(void 0), { x, y, reference: E, floating: P, strategy: k } = R({
-    strategy: "fixed",
-    placement: g ? "bottom" : b,
-    middleware: [
-      $({
-        mainAxis: h
-      }),
-      W(),
-      T()
-    ],
-    whileElementsMounted: O
-  });
-  return o.useLayoutEffect(() => {
-    E(e.current);
-  }, [e]), o.useLayoutEffect(() => {
-    i && v(e.current.offsetWidth);
-  }, [i]), q(l, n, {
-    selectorToWatch: `#${r}`,
-    skipWhen: !r || !n
-  }), /* @__PURE__ */ o.createElement(z, {
-    ref: P,
-    style: {
-      left: x,
-      top: y,
-      position: k,
-      width: p || void 0
-    },
-    hasRadius: !0,
-    background: "neutral0",
-    padding: 1
-  }, /* @__PURE__ */ o.createElement(A, {
-    ref: l,
-    ...w
-  }, m, r && n && /* @__PURE__ */ o.createElement(s, {
-    id: r,
-    width: "100%",
-    height: "1px"
-  })));
-}, c = (e) => /* @__PURE__ */ o.createElement(S, null, /* @__PURE__ */ o.createElement(a, {
-  ...e
-})), f = {
-  fullWidth: !1,
-  intersectionId: void 0,
-  onReachEnd: void 0,
-  centered: !1,
-  placement: "bottom-start"
-}, u = {
-  centered: t.bool,
-  children: t.node.isRequired,
-  fullWidth: t.bool,
-  intersectionId: t.string,
-  onReachEnd: t.func,
-  placement: t.oneOf(L),
-  source: t.shape({
-    current: (typeof Element > "u" ? t.any : t.instanceOf(Element)).isRequired
-  }).isRequired,
-  spacing: t.number
-};
-a.propTypes = u;
-a.defaultProps = f;
-c.propTypes = u;
-c.defaultProps = f;
-export {
-  L as POPOVER_PLACEMENTS,
-  c as Popover
-};

package/dist/Popover/index.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Popover.cjs");exports.POPOVER_PLACEMENTS=e.POPOVER_PLACEMENTS;exports.Popover=e.Popover;

package/dist/Popover/index.js

@@ -1,5 +0,0 @@
-import { POPOVER_PLACEMENTS as r, Popover as E } from "./Popover.js";
-export {
-  r as POPOVER_PLACEMENTS,
-  E as Popover
-};

package/dist/Portal/Portal.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react"),c=require("react-dom"),a=require("prop-types"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=s(a),u=({children:e})=>{const t=r.useRef(null),[o,n]=r.useState(!1);return r.useLayoutEffect(()=>(t.current=document.createElement("div"),t.current.setAttribute("data-react-portal","true"),document.body.appendChild(t.current),n(!0),()=>{t.current?.remove()}),[]),!o||!t.current?null:c.createPortal(e,t.current)};u.propTypes={children:l.default.node.isRequired};exports.Portal=u;

package/dist/Portal/Portal.js

@@ -1,15 +0,0 @@
-import { useRef as u, useState as n, useLayoutEffect as c } from "react";
-import { createPortal as a } from "react-dom";
-import d from "prop-types";
-const p = ({ children: r }) => {
-  const e = u(null), [t, o] = n(!1);
-  return c(() => (e.current = document.createElement("div"), e.current.setAttribute("data-react-portal", "true"), document.body.appendChild(e.current), o(!0), () => {
-    e.current?.remove();
-  }), []), !t || !e.current ? null : a(r, e.current);
-};
-p.propTypes = {
-  children: d.node.isRequired
-};
-export {
-  p as Portal
-};

package/dist/Portal/index.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Portal.cjs");exports.Portal=e.Portal;

package/dist/Portal/index.js

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

package/dist/ProgressBar/ProgressBar.cjs

@@ -1,21 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react"),b=require("prop-types"),m=require("styled-components"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=a(f),r=a(b),i=a(m),n=i.default.div`
-  background: ${({theme:e})=>e.colors.neutral600};
-  border-radius: ${({theme:e})=>e.borderRadius};
-  position: relative;
-
-  width: 78px;
-  height: ${({theme:e})=>e.spaces[1]};
-
-  &:before {
-    content: '';
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    border-radius: ${({theme:e})=>e.borderRadius};
-    width: ${({value:e})=>`${e}%`};
-    background: ${({theme:e})=>e.colors.neutral150};
-  }
-`,g=i.default(n)`
-  width: 102px;
-  height: ${({theme:e})=>e.spaces[2]};
-`,o=({min:e,max:c,value:t,children:s,size:p,...u})=>{const l={role:"progressbar","aria-valuenow":t,"aria-valuemin":e,"aria-valuemax":c};return p==="M"?d.default.createElement(g,{...l,value:t,"aria-label":s,...u}):d.default.createElement(n,{...l,value:t,"aria-label":s,...u})};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/ProgressBar/ProgressBar.js

@@ -1,58 +0,0 @@
-import i from "react";
-import e from "prop-types";
-import n from "styled-components";
-const d = n.div`
-  background: ${({ theme: r }) => r.colors.neutral600};
-  border-radius: ${({ theme: r }) => r.borderRadius};
-  position: relative;
-
-  width: 78px;
-  height: ${({ theme: r }) => r.spaces[1]};
-
-  &:before {
-    content: '';
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    border-radius: ${({ theme: r }) => r.borderRadius};
-    width: ${({ value: r }) => `${r}%`};
-    background: ${({ theme: r }) => r.colors.neutral150};
-  }
-`, p = n(d)`
-  width: 102px;
-  height: ${({ theme: r }) => r.spaces[2]};
-`, l = ({ min: r, max: u, value: o, children: a, size: m, ...t }) => {
-  const s = {
-    role: "progressbar",
-    "aria-valuenow": o,
-    "aria-valuemin": r,
-    "aria-valuemax": u
-  };
-  return m === "M" ? /* @__PURE__ */ i.createElement(p, {
-    ...s,
-    value: o,
-    "aria-label": a,
-    ...t
-  }) : /* @__PURE__ */ i.createElement(d, {
-    ...s,
-    value: o,
-    "aria-label": a,
-    ...t
-  });
-};
-l.defaultProps = {
-  min: 0,
-  max: 100,
-  value: 0,
-  size: "M"
-};
-l.propTypes = {
-  children: e.node.isRequired,
-  max: e.number,
-  min: e.number,
-  size: e.oneOf(["S", "M"]),
-  value: e.number
-};
-export {
-  l as ProgressBar
-};

package/dist/ProgressBar/index.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("./ProgressBar.cjs");exports.ProgressBar=r.ProgressBar;

package/dist/ProgressBar/index.js

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

package/dist/Radio/Radio.cjs

@@ -1,4 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),d=require("prop-types"),n=require("styled-components"),u=require("../BaseRadio/BaseRadio.cjs"),c=require("../Typography/Typography.cjs"),i=require("../Box/Box.cjs"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=a(l),o=a(d),p=a(n),y=p.default(c.Typography)`
-  display: flex;
-  align-items: center;
-`,r=({children:e,...s})=>t.default.createElement(y,{as:"label",textColor:"neutral800"},t.default.createElement(u.BaseRadio,{...s}),t.default.createElement(i.Box,{paddingLeft:2},e));r.propTypes={children:o.default.node.isRequired,value:o.default.any.isRequired};exports.Radio=r;

package/dist/Radio/Radio.js

@@ -1,24 +0,0 @@
-import e from "react";
-import r from "prop-types";
-import a from "styled-components";
-import { BaseRadio as i } from "../BaseRadio/BaseRadio.js";
-import { Typography as m } from "../Typography/Typography.js";
-import { Box as p } from "../Box/Box.js";
-const l = a(m)`
-  display: flex;
-  align-items: center;
-`, n = ({ children: t, ...o }) => /* @__PURE__ */ e.createElement(l, {
-  as: "label",
-  textColor: "neutral800"
-}, /* @__PURE__ */ e.createElement(i, {
-  ...o
-}), /* @__PURE__ */ e.createElement(p, {
-  paddingLeft: 2
-}, t));
-n.propTypes = {
-  children: r.node.isRequired,
-  value: r.any.isRequired
-};
-export {
-  n as Radio
-};

package/dist/Radio/index.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("./Radio.cjs"),e=require("../BaseRadio/RadioGroup.cjs");exports.Radio=o.Radio;exports.RadioGroup=e.RadioGroup;

package/dist/Radio/index.js

@@ -1,6 +0,0 @@
-import { Radio as p } from "./Radio.js";
-import { RadioGroup as d } from "../BaseRadio/RadioGroup.js";
-export {
-  p as Radio,
-  d as RadioGroup
-};

package/dist/RawTable/RawCell.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),m=require("prop-types"),R=require("../Box/Box.cjs"),c=require("../helpers/getFocusableNodes.cjs"),l=require("../helpers/keyboardKeys.cjs"),w=require("./RawTableContext.cjs"),p=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},g=p(d),a=p(m),y=o=>g.default.createElement(f,{...o,as:"th"}),f=({coords:o,as:h,...N})=>{const n=d.useRef(null),{rowIndex:T,colIndex:x,setTableValues:E}=w.useTable(),[u,i]=d.useState(!1),K=e=>{const t=c.getFocusableNodes(n.current,!0);if(!(t.length===0||t.length===1&&c.getFocusableNodesWithKeyboardNav(t).length===0)){if(t.length>1&&!Boolean(t.find(s=>s.tagName!=="BUTTON"))){e.preventDefault();const s=t.findIndex(r=>r===document.activeElement);if(e.key===l.KeyboardKeys.RIGHT){const r=t[s+1];r&&(e.stopPropagation(),r.focus())}else if(e.key===l.KeyboardKeys.LEFT){const r=t[s-1];r&&(e.stopPropagation(),r.focus())}return}e.key===l.KeyboardKeys.ENTER&&!u?i(!0):(e.key===l.KeyboardKeys.ESCAPE||e.key===l.KeyboardKeys.ENTER)&&u?(i(!1),n.current.focus()):u&&e.stopPropagation()}},b=T===o.row-1&&x===o.col-1;return d.useLayoutEffect(()=>{const e=c.getFocusableNodes(n.current,!0);e.length===0||e.length===1&&c.getFocusableNodesWithKeyboardNav(e).length!==0||e.length>1&&Boolean(e.find(t=>t.tagName!=="BUTTON"))?(n.current.setAttribute("tabIndex",!u&&b?0:-1),e.forEach((t,s)=>{t.setAttribute("tabIndex",u?0:-1),u&&s===0&&t.focus()})):e.forEach(t=>{t.setAttribute("tabIndex",b?0:-1)})},[u,b]),d.useLayoutEffect(()=>{const e=c.getFocusableNodes(n.current,!0),t=()=>{e.length>=1&&(c.getFocusableNodesWithKeyboardNav(e).length!==0||!Boolean(e.find(s=>s.tagName!=="BUTTON")))&&i(!0),E({rowIndex:o.row-1,colIndex:o.col-1})};return e.forEach(s=>{s.addEventListener("focus",t)}),()=>{c.getFocusableNodes(n.current,!0).forEach(r=>{r.removeEventListener("focus",t)})}},[]),g.default.createElement(R.Box,{as:h||"td",ref:n,onKeyDown:K,...N})};y.defaultProps={coords:{}};y.propTypes={["aria-colindex"]:a.default.number.isRequired,children:a.default.node,coords:a.default.shape({col:a.default.number,row:a.default.number})};f.defaultProps={coords:{}};f.propTypes={["aria-colindex"]:a.default.number.isRequired,as:a.default.oneOf(["td","th"]),children:a.default.node,coords:a.default.shape({col:a.default.number,row:a.default.number})};exports.RawTd=f;exports.RawTh=y;

package/dist/RawTable/RawCell.js

@@ -1,80 +0,0 @@
-import h, { useRef as I, useState as w, useLayoutEffect as b } from "react";
-import n from "prop-types";
-import { Box as R } from "../Box/Box.js";
-import { getFocusableNodes as l, getFocusableNodesWithKeyboardNav as i } from "../helpers/getFocusableNodes.js";
-import { KeyboardKeys as u } from "../helpers/keyboardKeys.js";
-import { useTable as v } from "./RawTableContext.js";
-const N = (c) => /* @__PURE__ */ h.createElement(m, {
-  ...c,
-  as: "th"
-}), m = ({ coords: c, as: p, ...g }) => {
-  const s = I(null), { rowIndex: E, colIndex: T, setTableValues: x } = v(), [a, f] = w(!1), y = (e) => {
-    const t = l(s.current, !0);
-    if (!(t.length === 0 || t.length === 1 && i(t).length === 0)) {
-      if (t.length > 1 && !Boolean(t.find((o) => o.tagName !== "BUTTON"))) {
-        e.preventDefault();
-        const o = t.findIndex((r) => r === document.activeElement);
-        if (e.key === u.RIGHT) {
-          const r = t[o + 1];
-          r && (e.stopPropagation(), r.focus());
-        } else if (e.key === u.LEFT) {
-          const r = t[o - 1];
-          r && (e.stopPropagation(), r.focus());
-        }
-        return;
-      }
-      e.key === u.ENTER && !a ? f(!0) : (e.key === u.ESCAPE || e.key === u.ENTER) && a ? (f(!1), s.current.focus()) : a && e.stopPropagation();
-    }
-  }, d = E === c.row - 1 && T === c.col - 1;
-  return b(() => {
-    const e = l(s.current, !0);
-    e.length === 0 || e.length === 1 && i(e).length !== 0 || e.length > 1 && Boolean(e.find((t) => t.tagName !== "BUTTON")) ? (s.current.setAttribute("tabIndex", !a && d ? 0 : -1), e.forEach((t, o) => {
-      t.setAttribute("tabIndex", a ? 0 : -1), a && o === 0 && t.focus();
-    })) : e.forEach((t) => {
-      t.setAttribute("tabIndex", d ? 0 : -1);
-    });
-  }, [a, d]), b(() => {
-    const e = l(s.current, !0), t = () => {
-      e.length >= 1 && (i(e).length !== 0 || !Boolean(e.find((o) => o.tagName !== "BUTTON"))) && f(!0), x({ rowIndex: c.row - 1, colIndex: c.col - 1 });
-    };
-    return e.forEach((o) => {
-      o.addEventListener("focus", t);
-    }), () => {
-      l(s.current, !0).forEach((r) => {
-        r.removeEventListener("focus", t);
-      });
-    };
-  }, []), /* @__PURE__ */ h.createElement(R, {
-    as: p || "td",
-    ref: s,
-    onKeyDown: y,
-    ...g
-  });
-};
-N.defaultProps = {
-  coords: {}
-};
-N.propTypes = {
-  ["aria-colindex"]: n.number.isRequired,
-  children: n.node,
-  coords: n.shape({
-    col: n.number,
-    row: n.number
-  })
-};
-m.defaultProps = {
-  coords: {}
-};
-m.propTypes = {
-  ["aria-colindex"]: n.number.isRequired,
-  as: n.oneOf(["td", "th"]),
-  children: n.node,
-  coords: n.shape({
-    col: n.number,
-    row: n.number
-  })
-};
-export {
-  m as RawTd,
-  N as RawTh
-};

package/dist/RawTable/RawTable.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react"),_=require("prop-types"),m=require("./RawTableContext.cjs"),r=require("../helpers/keyboardKeys.cjs"),E=require("./focusFocusable.cjs"),D=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},K=D(u),o=D(_),f=({colCount:a,rowCount:l,jumpStep:n,initialCol:k,initialRow:T,...p})=>{const i=u.useRef(null),b=u.useRef(!1),[y,s]=u.useState(T),[d,c]=u.useState(k),R=u.useCallback(({colIndex:t,rowIndex:e})=>{c(t),s(e)},[]);u.useEffect(()=>{b.current&&E.focusFocusable(i.current),b.current||(b.current=!0)},[d,y]);const P=t=>{switch(t.key){case r.KeyboardKeys.RIGHT:{t.preventDefault(),c(e=>e<a-1?e+1:e);break}case r.KeyboardKeys.LEFT:{t.preventDefault(),c(e=>e>0?e-1:e);break}case r.KeyboardKeys.UP:{t.preventDefault(),s(e=>e>0?e-1:e);break}case r.KeyboardKeys.DOWN:{t.preventDefault(),s(e=>e<l-1?e+1:e);break}case r.KeyboardKeys.HOME:{t.preventDefault(),t.ctrlKey&&s(0),c(0);break}case r.KeyboardKeys.END:{t.preventDefault(),t.ctrlKey&&s(l-1),c(a-1);break}case r.KeyboardKeys.PAGE_DOWN:{t.preventDefault(),s(e=>e+n<l?e+n:l-1);break}case r.KeyboardKeys.PAGE_UP:{t.preventDefault(),s(e=>e-n>0?e-n:0);break}}};return K.default.createElement(m.RawTableContext.Provider,{value:{rowIndex:y,colIndex:d,setTableValues:R}},K.default.createElement("table",{ref:i,"aria-rowcount":l,"aria-colcount":a,onKeyDown:P,...p}))};f.defaultProps={jumpStep:3,initialCol:0,initialRow:0};f.propTypes={colCount:o.default.number.isRequired,initialCol:o.default.number,initialRow:o.default.number,jumpStep:o.default.number,rowCount:o.default.number.isRequired};exports.RawTable=f;

package/dist/RawTable/RawTable.js

@@ -1,73 +0,0 @@
-import m, { useRef as D, useState as k, useCallback as R, useEffect as d } from "react";
-import s from "prop-types";
-import { RawTableContext as _ } from "./RawTableContext.js";
-import { KeyboardKeys as a } from "../helpers/keyboardKeys.js";
-import { focusFocusable as G } from "./focusFocusable.js";
-const y = ({ colCount: u, rowCount: c, jumpStep: n, initialCol: p, initialRow: E, ...P }) => {
-  const f = D(null), i = D(!1), [o, r] = k(E), [b, l] = k(p), T = R(({ colIndex: t, rowIndex: e }) => {
-    l(t), r(e);
-  }, []);
-  d(() => {
-    i.current && G(f.current), i.current || (i.current = !0);
-  }, [b, o]);
-  const K = (t) => {
-    switch (t.key) {
-      case a.RIGHT: {
-        t.preventDefault(), l((e) => e < u - 1 ? e + 1 : e);
-        break;
-      }
-      case a.LEFT: {
-        t.preventDefault(), l((e) => e > 0 ? e - 1 : e);
-        break;
-      }
-      case a.UP: {
-        t.preventDefault(), r((e) => e > 0 ? e - 1 : e);
-        break;
-      }
-      case a.DOWN: {
-        t.preventDefault(), r((e) => e < c - 1 ? e + 1 : e);
-        break;
-      }
-      case a.HOME: {
-        t.preventDefault(), t.ctrlKey && r(0), l(0);
-        break;
-      }
-      case a.END: {
-        t.preventDefault(), t.ctrlKey && r(c - 1), l(u - 1);
-        break;
-      }
-      case a.PAGE_DOWN: {
-        t.preventDefault(), r((e) => e + n < c ? e + n : c - 1);
-        break;
-      }
-      case a.PAGE_UP: {
-        t.preventDefault(), r((e) => e - n > 0 ? e - n : 0);
-        break;
-      }
-    }
-  };
-  return /* @__PURE__ */ m.createElement(_.Provider, {
-    value: { rowIndex: o, colIndex: b, setTableValues: T }
-  }, /* @__PURE__ */ m.createElement("table", {
-    ref: f,
-    "aria-rowcount": c,
-    "aria-colcount": u,
-    onKeyDown: K,
-    ...P
-  }));
-};
-y.defaultProps = {
-  jumpStep: 3,
-  initialCol: 0,
-  initialRow: 0
-};
-y.propTypes = {
-  colCount: s.number.isRequired,
-  initialCol: s.number,
-  initialRow: s.number,
-  jumpStep: s.number,
-  rowCount: s.number.isRequired
-};
-export {
-  y as RawTable
-};

package/dist/RawTable/RawTableContext.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react"),t=e.createContext({rowIndex:0,colIndex:0,setTableValues:()=>{throw new Error("setTableValues must be initialized via the RawTableContext.Provider")}}),a=()=>e.useContext(t);exports.RawTableContext=t;exports.useTable=a;

package/dist/RawTable/RawTableContext.js

@@ -1,12 +0,0 @@
-import { createContext as e, useContext as t } from "react";
-const o = e({
-  rowIndex: 0,
-  colIndex: 0,
-  setTableValues: () => {
-    throw new Error("setTableValues must be initialized via the RawTableContext.Provider");
-  }
-}), r = () => t(o);
-export {
-  o as RawTableContext,
-  r as useTable
-};

package/dist/RawTable/RawTbody.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react"),d=require("prop-types"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},u=o(t),s=o(d),r=({children:e,...a})=>{const n=t.Children.toArray(e).map((l,c)=>t.cloneElement(l,{"aria-rowindex":c+2}));return u.default.createElement("tbody",{...a},n)};r.propTypes={children:s.default.node.isRequired};exports.RawTbody=r;

package/dist/RawTable/RawTbody.js

@@ -1,16 +0,0 @@
-import d, { Children as i, cloneElement as p } from "react";
-import a from "prop-types";
-const l = ({ children: e, ...r }) => {
-  const o = i.toArray(e).map(
-    (t, n) => p(t, { "aria-rowindex": n + 2 })
-  );
-  return /* @__PURE__ */ d.createElement("tbody", {
-    ...r
-  }, o);
-};
-l.propTypes = {
-  children: a.node.isRequired
-};
-export {
-  l as RawTbody
-};

package/dist/RawTable/RawThead.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react"),c=require("prop-types"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=r(t),u=r(c),a=({children:e,...o})=>{const n=t.Children.toArray(e).map(l=>t.cloneElement(l,{"aria-rowindex":1}));return d.default.createElement("thead",{...o},n)};a.propTypes={children:u.default.node.isRequired};exports.RawThead=a;

package/dist/RawTable/RawThead.js

@@ -1,14 +0,0 @@
-import n, { Children as a, cloneElement as d } from "react";
-import i from "prop-types";
-const p = ({ children: e, ...r }) => {
-  const o = a.toArray(e).map((t) => d(t, { "aria-rowindex": 1 }));
-  return /* @__PURE__ */ n.createElement("thead", {
-    ...r
-  }, o);
-};
-p.propTypes = {
-  children: i.node.isRequired
-};
-export {
-  p as RawThead
-};

package/dist/RawTable/RawTr.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react"),u=require("prop-types"),s=require("../Box/Box.cjs"),n=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=n(r),a=n(u),c=({children:e,...t})=>{const l=r.Children.toArray(e).map((i,o)=>r.cloneElement(i,{"aria-colindex":o+1,coords:{col:o+1,row:t["aria-rowindex"]}}));return d.default.createElement(s.Box,{as:"tr",...t},l)};c.propTypes={["aria-rowindex"]:a.default.number.isRequired,children:a.default.node.isRequired};exports.RawTr=c;

package/dist/RawTable/RawTr.js

@@ -1,19 +0,0 @@
-import a, { Children as c, cloneElement as d } from "react";
-import o from "prop-types";
-import { Box as l } from "../Box/Box.js";
-const m = ({ children: i, ...r }) => {
-  const n = c.toArray(i).map(
-    (t, e) => d(t, { "aria-colindex": e + 1, coords: { col: e + 1, row: r["aria-rowindex"] } })
-  );
-  return /* @__PURE__ */ a.createElement(l, {
-    as: "tr",
-    ...r
-  }, n);
-};
-m.propTypes = {
-  ["aria-rowindex"]: o.number.isRequired,
-  children: o.node.isRequired
-};
-export {
-  m as RawTr
-};

package/dist/RawTable/focusFocusable.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=o=>{const e=o.querySelector('[tabindex="0"]');e&&e.focus()};exports.focusFocusable=t;

package/dist/RawTable/focusFocusable.js

@@ -1,7 +0,0 @@
-const c = (o) => {
-  const e = o.querySelector('[tabindex="0"]');
-  e && e.focus();
-};
-export {
-  c as focusFocusable
-};

package/dist/RawTable/index.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./RawTable.cjs"),a=require("./RawCell.cjs"),w=require("./RawThead.cjs"),R=require("./RawTbody.cjs"),T=require("./RawTr.cjs");exports.RawTable=e.RawTable;exports.RawTd=a.RawTd;exports.RawTh=a.RawTh;exports.RawThead=w.RawThead;exports.RawTbody=R.RawTbody;exports.RawTr=T.RawTr;

package/dist/RawTable/index.js

@@ -1,13 +0,0 @@
-import { RawTable as a } from "./RawTable.js";
-import { RawTd as w, RawTh as R } from "./RawCell.js";
-import { RawThead as f } from "./RawThead.js";
-import { RawTbody as p } from "./RawTbody.js";
-import { RawTr as x } from "./RawTr.js";
-export {
-  a as RawTable,
-  p as RawTbody,
-  w as RawTd,
-  R as RawTh,
-  f as RawThead,
-  x as RawTr
-};

package/dist/Searchbar/SearchForm.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=r(t),o=e=>a.default.createElement("form",{...e,role:"search"});exports.SearchForm=o;

package/dist/Searchbar/SearchForm.js

@@ -1,8 +0,0 @@
-import r from "react";
-const t = (e) => /* @__PURE__ */ r.createElement("form", {
-  ...e,
-  role: "search"
-});
-export {
-  t as SearchForm
-};

package/dist/Searchbar/Searchbar.cjs

@@ -1,29 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),_=require("prop-types"),S=require("styled-components"),R=require("@strapi/icons/Search"),E=require("@strapi/icons/Cross"),C=require("../themes/sizes.cjs"),v=require("../Field/Field.cjs"),x=require("../Field/FieldLabel.cjs"),i=require("../Field/FieldInput.cjs");require("../Field/FieldContext.cjs");require("../Typography/Typography.cjs");const $=require("../Field/FieldAction.cjs"),z=require("../VisuallyHidden/VisuallyHidden.cjs"),I=require("../themes/utils.cjs"),d=require("../Flex/Flex.cjs"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=r(a),l=r(_),n=r(S),T=r(R),w=r(E),A=n.default(d.Flex)`
-  font-size: 0.5rem;
-  svg path {
-    fill: ${({theme:e})=>e.colors.neutral400};
-  }
-`,o=n.default(d.Flex)`
-  font-size: 0.8rem;
-
-  svg path {
-    fill: ${({theme:e})=>e.colors.neutral800};
-  }
-`,L=n.default.div`
-  border-radius: ${({theme:e})=>e.borderRadius};
-  box-shadow: ${({theme:e})=>e.shadows.filterShadow};
-
-  &:focus-within {
-    ${o} {
-      svg path {
-        fill: ${({theme:e})=>e.colors.primary600};
-      }
-    }
-  }
-
-  ${i.InputWrapper} {
-    border: 1px solid transparent;
-  }
-
-  ${I.inputFocusStyle(i.InputWrapper)}
-`,s=a.forwardRef(({name:e,size:f,children:p,value:u,onClear:F,clearLabel:h,...y},m)=>{const c=a.useRef(null),q=u.length>0,b=j=>{F(j),c.current.focus()},g=m||c;return t.default.createElement(L,null,t.default.createElement(v.Field,{name:e},t.default.createElement(z.VisuallyHidden,null,t.default.createElement(x.FieldLabel,null,p)),t.default.createElement(i.FieldInput,{ref:g,value:u,startAction:t.default.createElement(o,null,t.default.createElement(T.default,{"aria-hidden":!0})),size:f,endAction:q?t.default.createElement($.FieldAction,{label:h,onClick:b},t.default.createElement(A,null,t.default.createElement(w.default,null))):void 0,...y})))});s.displayName="Searchbar";s.defaultProps={value:"",size:"M"};s.propTypes={children:l.default.node.isRequired,clearLabel:l.default.string.isRequired,name:l.default.string.isRequired,onClear:l.default.func.isRequired,size:l.default.oneOf(Object.keys(C.sizes.input)),value:l.default.string};exports.Searchbar=s;