@strapi/design-system 1.4.0-beta.0 → 1.4.0-beta.1

package/dist/Radio/Radio.js

@@ -1,24 +1,45 @@
-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)`
+var f = Object.defineProperty;
+var a = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+var m = (e, r, t) => r in e ? f(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, n = (e, r) => {
+  for (var t in r || (r = {}))
+    p.call(r, t) && m(e, t, r[t]);
+  if (a)
+    for (var t of a(r))
+      l.call(r, t) && m(e, t, r[t]);
+  return e;
+};
+var d = (e, r) => {
+  var t = {};
+  for (var o in e)
+    p.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && a)
+    for (var o of a(e))
+      r.indexOf(o) < 0 && l.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+import i from "react";
+import s from "prop-types";
+import c from "styled-components";
+import { BaseRadio as y } from "../BaseRadio/BaseRadio.js";
+import { Typography as u } from "../Typography/Typography.js";
+import { Box as x } from "../Box/Box.js";
+const R = c(u)`
   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
+`, T = (t) => {
+  var o = t, { children: e } = o, r = d(o, ["children"]);
+  return /* @__PURE__ */ i.createElement(R, {
+    as: "label",
+    textColor: "neutral800"
+  }, /* @__PURE__ */ i.createElement(y, n({}, r)), /* @__PURE__ */ i.createElement(x, {
+    paddingLeft: 2
+  }, e));
+};
+T.propTypes = {
+  children: s.node.isRequired,
+  value: s.any.isRequired
 };
 export {
-  n as Radio
+  T as Radio
 };

package/dist/RawTable/RawCell.cjs

@@ -1 +1 @@
-"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"),N=s=>s&&typeof s=="object"&&"default"in s?s:{default:s},h=N(d),a=N(m),y=s=>h.default.createElement(f,{...s,as:"th"}),f=({coords:s,as:g,...p})=>{const r=d.useRef(null),{rowIndex:T,colIndex:x,setTableValues:E}=w.useTable(),[u,i]=d.useState(!1),K=e=>{const t=c.getFocusableNodes(r.current,!0);if(console.log(t.find(o=>o.tagName!=="BUTTON")),!(t.length===0||t.length===1&&c.getFocusableNodesWithKeyboardNav(t).length===0)){if(t.length>1&&!Boolean(t.find(o=>o.tagName!=="BUTTON"))){e.preventDefault();const o=t.findIndex(n=>n===document.activeElement);if(e.key===l.KeyboardKeys.RIGHT){const n=t[o+1];n&&(e.stopPropagation(),n.focus())}else if(e.key===l.KeyboardKeys.LEFT){const n=t[o-1];n&&(e.stopPropagation(),n.focus())}return}e.key===l.KeyboardKeys.ENTER&&!u?i(!0):(e.key===l.KeyboardKeys.ESCAPE||e.key===l.KeyboardKeys.ENTER)&&u?(i(!1),r.current.focus()):u&&e.stopPropagation()}},b=T===s.row-1&&x===s.col-1;return d.useLayoutEffect(()=>{const e=c.getFocusableNodes(r.current,!0);e.length===0||e.length===1&&c.getFocusableNodesWithKeyboardNav(e).length!==0||e.length>1&&Boolean(e.find(t=>t.tagName!=="BUTTON"))?(r.current.setAttribute("tabIndex",!u&&b?0:-1),e.forEach((t,o)=>{t.setAttribute("tabIndex",u?0:-1),u&&o===0&&t.focus()})):e.forEach(t=>{t.setAttribute("tabIndex",b?0:-1)})},[u,b]),d.useLayoutEffect(()=>{const e=c.getFocusableNodes(r.current,!0),t=()=>{e.length>=1&&(c.getFocusableNodesWithKeyboardNav(e).length!==0||!Boolean(e.find(o=>o.tagName!=="BUTTON")))&&i(!0),E({rowIndex:s.row-1,colIndex:s.col-1})};return e.forEach(o=>{o.addEventListener("focus",t)}),()=>{c.getFocusableNodes(r.current,!0).forEach(n=>{n.removeEventListener("focus",t)})}},[]),h.default.createElement(R.Box,{as:g||"td",ref:r,onKeyDown:K,...p})};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;
+"use strict";var _=Object.defineProperty,j=Object.defineProperties;var L=Object.getOwnPropertyDescriptors;var y=Object.getOwnPropertySymbols;var w=Object.prototype.hasOwnProperty,F=Object.prototype.propertyIsEnumerable;var v=(e,s,a)=>s in e?_(e,s,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[s]=a,x=(e,s)=>{for(var a in s||(s={}))w.call(s,a)&&v(e,a,s[a]);if(y)for(var a of y(s))F.call(s,a)&&v(e,a,s[a]);return e},R=(e,s)=>j(e,L(s));var I=(e,s)=>{var a={};for(var r in e)w.call(e,r)&&s.indexOf(r)<0&&(a[r]=e[r]);if(e!=null&&y)for(var r of y(e))s.indexOf(r)<0&&F.call(e,r)&&(a[r]=e[r]);return a};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("react"),O=require("prop-types"),C=require("../Box/Box.cjs"),c=require("../helpers/getFocusableNodes.cjs"),g=require("../helpers/keyboardKeys.cjs"),D=require("./RawTableContext.cjs"),B=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},P=B(b),n=B(O),m=e=>P.default.createElement(h,R(x({},e),{as:"th"})),h=r=>{var E=r,{coords:e,as:s}=E,a=I(E,["coords","as"]);const l=b.useRef(null),{rowIndex:q,colIndex:k,setTableValues:K}=D.useTable(),[d,N]=b.useState(!1),A=t=>{const o=c.getFocusableNodes(l.current,!0);if(o.length===0||o.length===1&&c.getFocusableNodesWithKeyboardNav(o).length===0)return;if(o.length>1&&!o.find(i=>i.tagName!=="BUTTON")){t.preventDefault();const i=o.findIndex(f=>f===document.activeElement);if(t.key===g.KeyboardKeys.RIGHT){const f=o[i+1];f&&(t.stopPropagation(),f.focus())}else if(t.key===g.KeyboardKeys.LEFT){const f=o[i-1];f&&(t.stopPropagation(),f.focus())}return}const u=t.key===g.KeyboardKeys.ENTER;if(u&&!d)N(!0);else if((t.key===g.KeyboardKeys.ESCAPE||u)&&d){if(u&&document.activeElement.tagName==="A")return;N(!1),l.current.focus()}else d&&t.stopPropagation()},p=q===e.row-1&&k===e.col-1;b.useLayoutEffect(()=>{const t=c.getFocusableNodes(l.current,!0);t.length===0||t.length===1&&c.getFocusableNodesWithKeyboardNav(t).length!==0||t.length>1&&Boolean(t.find(o=>o.tagName!=="BUTTON"))?(l.current.setAttribute("tabIndex",!d&&p?0:-1),t.forEach((o,u)=>{o.setAttribute("tabIndex",d?0:-1),d&&u===0&&o.focus()})):t.forEach(o=>{o.setAttribute("tabIndex",p?0:-1)})},[d,p]);const T=b.useCallback(()=>{const t=c.getFocusableNodes(l.current,!0);t.length>=1&&(c.getFocusableNodesWithKeyboardNav(t).length!==0||!t.find(o=>o.tagName!=="BUTTON"))&&N(!0),K({rowIndex:e.row-1,colIndex:e.col-1})},[e,K]);return b.useLayoutEffect(()=>{const t=l.current;return c.getFocusableNodes(t,!0).forEach(u=>{u.addEventListener("focus",T)}),()=>{c.getFocusableNodes(t,!0).forEach(i=>{i.removeEventListener("focus",T)})}},[T]),P.default.createElement(C.Box,x({role:"gridcell",as:s,ref:l,onKeyDown:A},a))};m.defaultProps={children:void 0,coords:{}};m.propTypes={"aria-colindex":n.default.number.isRequired,children:n.default.node,coords:n.default.shape({col:n.default.number,row:n.default.number})};h.defaultProps={as:"td",children:void 0,coords:{}};h.propTypes={"aria-colindex":n.default.number.isRequired,as:n.default.oneOf(["td","th"]),children:n.default.node,coords:n.default.shape({col:n.default.number,row:n.default.number})};exports.RawTd=h;exports.RawTh=m;

package/dist/RawTable/RawCell.js

@@ -1,80 +1,115 @@
-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 B } from "./RawTableContext.js";
-const N = (c) => /* @__PURE__ */ h.createElement(m, {
-  ...c,
+var O = Object.defineProperty, D = Object.defineProperties;
+var U = Object.getOwnPropertyDescriptors;
+var m = Object.getOwnPropertySymbols;
+var I = Object.prototype.hasOwnProperty, w = Object.prototype.propertyIsEnumerable;
+var v = (e, n, r) => n in e ? O(e, n, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[n] = r, g = (e, n) => {
+  for (var r in n || (n = {}))
+    I.call(n, r) && v(e, r, n[r]);
+  if (m)
+    for (var r of m(n))
+      w.call(n, r) && v(e, r, n[r]);
+  return e;
+}, R = (e, n) => D(e, U(n));
+var A = (e, n) => {
+  var r = {};
+  for (var c in e)
+    I.call(e, c) && n.indexOf(c) < 0 && (r[c] = e[c]);
+  if (e != null && m)
+    for (var c of m(e))
+      n.indexOf(c) < 0 && w.call(e, c) && (r[c] = e[c]);
+  return r;
+};
+import B, { useRef as q, useState as C, useLayoutEffect as P, useCallback as S } from "react";
+import s from "prop-types";
+import { Box as _ } from "../Box/Box.js";
+import { getFocusableNodes as f, getFocusableNodesWithKeyboardNav as E } from "../helpers/getFocusableNodes.js";
+import { KeyboardKeys as b } from "../helpers/keyboardKeys.js";
+import { useTable as G } from "./RawTableContext.js";
+const F = (e) => /* @__PURE__ */ B.createElement(T, R(g({}, e), {
   as: "th"
-}), m = ({ coords: c, as: p, ...g }) => {
-  const s = I(null), { rowIndex: T, colIndex: E, setTableValues: x } = B(), [a, f] = w(!1), y = (e) => {
-    const o = l(s.current, !0);
-    if (console.log(o.find((t) => t.tagName !== "BUTTON")), !(o.length === 0 || o.length === 1 && i(o).length === 0)) {
-      if (o.length > 1 && !Boolean(o.find((t) => t.tagName !== "BUTTON"))) {
-        e.preventDefault();
-        const t = o.findIndex((r) => r === document.activeElement);
-        if (e.key === u.RIGHT) {
-          const r = o[t + 1];
-          r && (e.stopPropagation(), r.focus());
-        } else if (e.key === u.LEFT) {
-          const r = o[t - 1];
-          r && (e.stopPropagation(), r.focus());
-        }
-        return;
+})), T = (c) => {
+  var x = c, { coords: e, as: n } = x, r = A(x, ["coords", "as"]);
+  const u = q(null), { rowIndex: K, colIndex: k, setTableValues: y } = G(), [l, h] = C(!1), L = (t) => {
+    const o = f(u.current, !0);
+    if (o.length === 0 || o.length === 1 && E(o).length === 0)
+      return;
+    if (o.length > 1 && !o.find((i) => i.tagName !== "BUTTON")) {
+      t.preventDefault();
+      const i = o.findIndex((d) => d === document.activeElement);
+      if (t.key === b.RIGHT) {
+        const d = o[i + 1];
+        d && (t.stopPropagation(), d.focus());
+      } else if (t.key === b.LEFT) {
+        const d = o[i - 1];
+        d && (t.stopPropagation(), d.focus());
       }
-      e.key === u.ENTER && !a ? f(!0) : (e.key === u.ESCAPE || e.key === u.ENTER) && a ? (f(!1), s.current.focus()) : a && e.stopPropagation();
+      return;
     }
-  }, d = T === c.row - 1 && E === 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((o) => o.tagName !== "BUTTON")) ? (s.current.setAttribute("tabIndex", !a && d ? 0 : -1), e.forEach((o, t) => {
-      o.setAttribute("tabIndex", a ? 0 : -1), a && t === 0 && o.focus();
-    })) : e.forEach((o) => {
-      o.setAttribute("tabIndex", d ? 0 : -1);
+    const a = t.key === b.ENTER;
+    if (a && !l)
+      h(!0);
+    else if ((t.key === b.ESCAPE || a) && l) {
+      if (a && document.activeElement.tagName === "A")
+        return;
+      h(!1), u.current.focus();
+    } else
+      l && t.stopPropagation();
+  }, p = K === e.row - 1 && k === e.col - 1;
+  P(() => {
+    const t = f(u.current, !0);
+    t.length === 0 || t.length === 1 && E(t).length !== 0 || t.length > 1 && Boolean(t.find((o) => o.tagName !== "BUTTON")) ? (u.current.setAttribute("tabIndex", !l && p ? 0 : -1), t.forEach((o, a) => {
+      o.setAttribute("tabIndex", l ? 0 : -1), l && a === 0 && o.focus();
+    })) : t.forEach((o) => {
+      o.setAttribute("tabIndex", p ? 0 : -1);
     });
-  }, [a, d]), b(() => {
-    const e = l(s.current, !0), o = () => {
-      e.length >= 1 && (i(e).length !== 0 || !Boolean(e.find((t) => t.tagName !== "BUTTON"))) && f(!0), x({ rowIndex: c.row - 1, colIndex: c.col - 1 });
-    };
-    return e.forEach((t) => {
-      t.addEventListener("focus", o);
+  }, [l, p]);
+  const N = S(() => {
+    const t = f(u.current, !0);
+    t.length >= 1 && (E(t).length !== 0 || !t.find((o) => o.tagName !== "BUTTON")) && h(!0), y({ rowIndex: e.row - 1, colIndex: e.col - 1 });
+  }, [e, y]);
+  return P(() => {
+    const t = u.current;
+    return f(t, !0).forEach((a) => {
+      a.addEventListener("focus", N);
     }), () => {
-      l(s.current, !0).forEach((r) => {
-        r.removeEventListener("focus", o);
+      f(t, !0).forEach((i) => {
+        i.removeEventListener("focus", N);
       });
     };
-  }, []), /* @__PURE__ */ h.createElement(R, {
-    as: p || "td",
-    ref: s,
-    onKeyDown: y,
-    ...g
-  });
+  }, [N]), /* @__PURE__ */ B.createElement(_, g({
+    role: "gridcell",
+    as: n,
+    ref: u,
+    onKeyDown: L
+  }, r));
 };
-N.defaultProps = {
+F.defaultProps = {
+  children: void 0,
   coords: {}
 };
-N.propTypes = {
-  ["aria-colindex"]: n.number.isRequired,
-  children: n.node,
-  coords: n.shape({
-    col: n.number,
-    row: n.number
+F.propTypes = {
+  "aria-colindex": s.number.isRequired,
+  children: s.node,
+  coords: s.shape({
+    col: s.number,
+    row: s.number
   })
 };
-m.defaultProps = {
+T.defaultProps = {
+  as: "td",
+  children: void 0,
   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
+T.propTypes = {
+  "aria-colindex": s.number.isRequired,
+  as: s.oneOf(["td", "th"]),
+  children: s.node,
+  coords: s.shape({
+    col: s.number,
+    row: s.number
   })
 };
 export {
-  m as RawTd,
-  N as RawTh
+  T as RawTd,
+  F as RawTh
 };

package/dist/RawTable/RawTable.cjs

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

package/dist/RawTable/RawTable.js

@@ -1,73 +1,94 @@
-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);
+var q = Object.defineProperty;
+var f = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, E = Object.prototype.propertyIsEnumerable;
+var y = (t, a, r) => a in t ? q(t, a, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[a] = r, P = (t, a) => {
+  for (var r in a || (a = {}))
+    p.call(a, r) && y(t, r, a[r]);
+  if (f)
+    for (var r of f(a))
+      E.call(a, r) && y(t, r, a[r]);
+  return t;
+};
+var T = (t, a) => {
+  var r = {};
+  for (var c in t)
+    p.call(t, c) && a.indexOf(c) < 0 && (r[c] = t[c]);
+  if (t != null && f)
+    for (var c of f(t))
+      a.indexOf(c) < 0 && E.call(t, c) && (r[c] = t[c]);
+  return r;
+};
+import K, { useRef as R, useState as d, useCallback as w, useEffect as A } from "react";
+import u from "prop-types";
+import { RawTableContext as F } from "./RawTableContext.js";
+import { KeyboardKeys as s } from "../helpers/keyboardKeys.js";
+import { focusFocusable as H } from "./focusFocusable.js";
+const _ = (U) => {
+  var b = U, { colCount: t, rowCount: a, jumpStep: r, initialCol: c, initialRow: G } = b, N = T(b, ["colCount", "rowCount", "jumpStep", "initialCol", "initialRow"]);
+  const m = R(null), o = R(!1), [D, n] = d(G), [k, i] = d(c), O = w(({ colIndex: l, rowIndex: e }) => {
+    i(l), n(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);
+  A(() => {
+    o.current && H(m.current), o.current || (o.current = !0);
+  }, [k, D]);
+  const h = (l) => {
+    switch (l.key) {
+      case s.RIGHT: {
+        l.preventDefault(), i((e) => e < t - 1 ? e + 1 : e);
         break;
       }
-      case a.LEFT: {
-        t.preventDefault(), l((e) => e > 0 ? e - 1 : e);
+      case s.LEFT: {
+        l.preventDefault(), i((e) => e > 0 ? e - 1 : e);
         break;
       }
-      case a.UP: {
-        t.preventDefault(), r((e) => e > 0 ? e - 1 : e);
+      case s.UP: {
+        l.preventDefault(), n((e) => e > 0 ? e - 1 : e);
         break;
       }
-      case a.DOWN: {
-        t.preventDefault(), r((e) => e < c - 1 ? e + 1 : e);
+      case s.DOWN: {
+        l.preventDefault(), n((e) => e < a - 1 ? e + 1 : e);
         break;
       }
-      case a.HOME: {
-        t.preventDefault(), t.ctrlKey && r(0), l(0);
+      case s.HOME: {
+        l.preventDefault(), l.ctrlKey && n(0), i(0);
         break;
       }
-      case a.END: {
-        t.preventDefault(), t.ctrlKey && r(c - 1), l(u - 1);
+      case s.END: {
+        l.preventDefault(), l.ctrlKey && n(a - 1), i(t - 1);
         break;
       }
-      case a.PAGE_DOWN: {
-        t.preventDefault(), r((e) => e + n < c ? e + n : c - 1);
+      case s.PAGE_DOWN: {
+        l.preventDefault(), n((e) => e + r < a ? e + r : a - 1);
         break;
       }
-      case a.PAGE_UP: {
-        t.preventDefault(), r((e) => e - n > 0 ? e - n : 0);
+      case s.PAGE_UP: {
+        l.preventDefault(), n((e) => e - r > 0 ? e - r : 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
-  }));
+  return /* @__PURE__ */ K.createElement(F.Provider, {
+    value: { rowIndex: D, colIndex: k, setTableValues: O }
+  }, /* @__PURE__ */ K.createElement("table", P({
+    role: "grid",
+    ref: m,
+    "aria-rowcount": a,
+    "aria-colcount": t,
+    onKeyDown: h
+  }, N)));
 };
-y.defaultProps = {
+_.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
+_.propTypes = {
+  colCount: u.number.isRequired,
+  initialCol: u.number,
+  initialRow: u.number,
+  jumpStep: u.number,
+  rowCount: u.number.isRequired
 };
 export {
-  y as RawTable
+  _ as RawTable
 };

package/dist/RawTable/RawTableContext.cjs

@@ -1 +1 @@
-"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;
+"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

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

package/dist/RawTable/RawTbody.cjs

@@ -1 +1 @@
-"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;
+"use strict";var b=Object.defineProperty;var a=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var l=(e,t,o)=>t in e?b(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,u=(e,t)=>{for(var o in t||(t={}))c.call(t,o)&&l(e,o,t[o]);if(a)for(var o of a(t))d.call(t,o)&&l(e,o,t[o]);return e};var s=(e,t)=>{var o={};for(var r in e)c.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&a)for(var r of a(e))t.indexOf(r)<0&&d.call(e,r)&&(o[r]=e[r]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),T=require("prop-types"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},R=i(n),m=i(T),p=o=>{var r=o,{children:e}=r,t=s(r,["children"]);const y=n.Children.toArray(e).map((f,_)=>n.cloneElement(f,{"aria-rowindex":_+2}));return R.default.createElement("tbody",u({},t),y)};p.propTypes={children:m.default.node.isRequired};exports.RawTbody=p;

package/dist/RawTable/RawTbody.js

@@ -1,16 +1,35 @@
-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 })
+var y = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var i = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
+var d = (e, r, o) => r in e ? y(e, r, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[r] = o, a = (e, r) => {
+  for (var o in r || (r = {}))
+    i.call(r, o) && d(e, o, r[o]);
+  if (n)
+    for (var o of n(r))
+      p.call(r, o) && d(e, o, r[o]);
+  return e;
+};
+var l = (e, r) => {
+  var o = {};
+  for (var t in e)
+    i.call(e, t) && r.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && n)
+    for (var t of n(e))
+      r.indexOf(t) < 0 && p.call(e, t) && (o[t] = e[t]);
+  return o;
+};
+import f, { Children as h, cloneElement as u } from "react";
+import R from "prop-types";
+const T = (o) => {
+  var t = o, { children: e } = t, r = l(t, ["children"]);
+  const c = h.toArray(e).map(
+    (m, s) => u(m, { "aria-rowindex": s + 2 })
   );
-  return /* @__PURE__ */ d.createElement("tbody", {
-    ...r
-  }, o);
+  return /* @__PURE__ */ f.createElement("tbody", a({}, r), c);
 };
-l.propTypes = {
-  children: a.node.isRequired
+T.propTypes = {
+  children: R.node.isRequired
 };
 export {
-  l as RawTbody
+  T as RawTbody
 };

package/dist/RawTable/RawThead.cjs

@@ -1 +1 @@
-"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;
+"use strict";var _=Object.defineProperty;var o=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var l=(e,t,r)=>t in e?_(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,u=(e,t)=>{for(var r in t||(t={}))c.call(t,r)&&l(e,r,t[r]);if(o)for(var r of o(t))d.call(t,r)&&l(e,r,t[r]);return e};var s=(e,t)=>{var r={};for(var a in e)c.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(e!=null&&o)for(var a of o(e))t.indexOf(a)<0&&d.call(e,a)&&(r[a]=e[a]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),h=require("prop-types"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},T=i(n),R=i(h),p=r=>{var a=r,{children:e}=a,t=s(a,["children"]);const f=n.Children.toArray(e).map(y=>n.cloneElement(y,{"aria-rowindex":1}));return T.default.createElement("thead",u({},t),f)};p.propTypes={children:R.default.node.isRequired};exports.RawThead=p;

package/dist/RawTable/RawThead.js

@@ -1,14 +1,33 @@
-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);
+var h = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, i = Object.prototype.propertyIsEnumerable;
+var a = (e, r, o) => r in e ? h(e, r, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[r] = o, p = (e, r) => {
+  for (var o in r || (r = {}))
+    d.call(r, o) && a(e, o, r[o]);
+  if (n)
+    for (var o of n(r))
+      i.call(r, o) && a(e, o, r[o]);
+  return e;
 };
-p.propTypes = {
-  children: i.node.isRequired
+var l = (e, r) => {
+  var o = {};
+  for (var t in e)
+    d.call(e, t) && r.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && n)
+    for (var t of n(e))
+      r.indexOf(t) < 0 && i.call(e, t) && (o[t] = e[t]);
+  return o;
+};
+import s, { Children as f, cloneElement as u } from "react";
+import y from "prop-types";
+const R = (o) => {
+  var t = o, { children: e } = t, r = l(t, ["children"]);
+  const c = f.toArray(e).map((m) => u(m, { "aria-rowindex": 1 }));
+  return /* @__PURE__ */ s.createElement("thead", p({}, r), c);
+};
+R.propTypes = {
+  children: y.node.isRequired
 };
 export {
-  p as RawThead
+  R as RawThead
 };

package/dist/RawTable/RawTr.cjs

@@ -1 +1 @@
-"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;
+"use strict";var R=Object.defineProperty;var a=Object.getOwnPropertySymbols;var i=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable;var l=(e,r,t)=>r in e?R(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,s=(e,r)=>{for(var t in r||(r={}))i.call(r,t)&&l(e,t,r[t]);if(a)for(var t of a(r))u.call(r,t)&&l(e,t,r[t]);return e};var d=(e,r)=>{var t={};for(var o in e)i.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&a)for(var o of a(e))r.indexOf(o)<0&&u.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),T=require("prop-types"),m=require("../Box/Box.cjs"),f=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},q=f(n),p=f(T),y=t=>{var o=t,{children:e}=o,r=d(o,["children"]);const _=n.Children.toArray(e).map((x,c)=>n.cloneElement(x,{"aria-colindex":c+1,coords:{col:c+1,row:r["aria-rowindex"]}}));return q.default.createElement(m.Box,s({as:"tr"},r),_)};y.propTypes={"aria-rowindex":p.default.number.isRequired,children:p.default.node.isRequired};exports.RawTr=y;

package/dist/RawTable/RawTr.js

@@ -1,19 +1,39 @@
-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"] } })
+var f = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var c = Object.prototype.hasOwnProperty, d = Object.prototype.propertyIsEnumerable;
+var a = (r, e, o) => e in r ? f(r, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[e] = o, l = (r, e) => {
+  for (var o in e || (e = {}))
+    c.call(e, o) && a(r, o, e[o]);
+  if (n)
+    for (var o of n(e))
+      d.call(e, o) && a(r, o, e[o]);
+  return r;
+};
+var m = (r, e) => {
+  var o = {};
+  for (var i in r)
+    c.call(r, i) && e.indexOf(i) < 0 && (o[i] = r[i]);
+  if (r != null && n)
+    for (var i of n(r))
+      e.indexOf(i) < 0 && d.call(r, i) && (o[i] = r[i]);
+  return o;
+};
+import w, { Children as x, cloneElement as R } from "react";
+import p from "prop-types";
+import { Box as h } from "../Box/Box.js";
+const y = (o) => {
+  var i = o, { children: r } = i, e = m(i, ["children"]);
+  const s = x.toArray(r).map(
+    (u, t) => R(u, { "aria-colindex": t + 1, coords: { col: t + 1, row: e["aria-rowindex"] } })
   );
-  return /* @__PURE__ */ a.createElement(l, {
-    as: "tr",
-    ...r
-  }, n);
+  return /* @__PURE__ */ w.createElement(h, l({
+    as: "tr"
+  }, e), s);
 };
-m.propTypes = {
-  ["aria-rowindex"]: o.number.isRequired,
-  children: o.node.isRequired
+y.propTypes = {
+  "aria-rowindex": p.number.isRequired,
+  children: p.node.isRequired
 };
 export {
-  m as RawTr
+  y as RawTr
 };

package/dist/Searchbar/SearchForm.cjs

@@ -1 +1 @@
-"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;
+"use strict";var u=Object.defineProperty,n=Object.defineProperties;var s=Object.getOwnPropertyDescriptors;var a=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var o=(e,t,r)=>t in e?u(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,c=(e,t)=>{for(var r in t||(t={}))f.call(t,r)&&o(e,r,t[r]);if(a)for(var r of a(t))d.call(t,r)&&o(e,r,t[r]);return e},l=(e,t)=>n(e,s(t));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react"),m=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},_=m(i),S=e=>_.default.createElement("form",l(c({},e),{role:"search"}));exports.SearchForm=S;