@worldresources/wri-design-systems 2.180.2 → 2.181.0-react-19-beta.0

package/README.md

@@ -6,7 +6,7 @@ WRI UI Library
 
 Node: `22.14.0`
 
-React: `18.3.1`
+React: `19.0.1`
 
 ## Installation
 

package/dist/index.cjs.js

@@ -2970,7 +2970,7 @@ function ep(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   button {
     width: calc(48% - 24px);
   }
-`,ff=({theme:e="light",navigationSection:r,utilitySection:o,actionsSection:i,linkRouter:a,isOpen:s,setIsOpen:l,pathname:c})=>{const[u,d]=n.useState(void 0),[p,h]=n.useState(-1),f=n.useRef(null),x=n.useRef([]),g=a;return t.jsxs(t.Fragment,{children:[t.jsx("div",{css:rf(s),children:s&&t.jsxs("div",{css:of,children:[t.jsxs("div",{style:{overflowY:"scroll",width:"100%",height:"100%",paddingBottom:"72px"},children:[o?t.jsx("div",{css:af(e),children:o?.map((e=>t.jsx("div",{className:"ds-utility-item",children:e})))}):null,r?t.jsx("div",{css:sf,children:r.map(((e,n)=>e.link?t.jsx(g,{to:e.link,href:e.link,onClick:()=>{d(void 0),h(-1),l(!1)},css:cf(c===e.link),children:e.label},e.label):t.jsxs("button",{css:uf,type:"button",ref:e=>x.current[n]=e,onClick:()=>{e.items&&(d(e),h(n),setTimeout((()=>{f.current?.focus()}),100))},children:[e.label,e.items?t.jsx($,{rotate:"270",color:"var(--chakra-colors-neutral-700)"}):null]},e.label)))}):null]}),i?t.jsx("div",{css:hf,children:i.map((e=>t.jsx(b,{...e,onClick:t=>{e?.onClick?.(t),d(void 0),h(-1),l(!1)}},e.ariaLabel)))}):null]})}),t.jsx("div",{css:df(!!u?.items),children:u?.items?t.jsxs(t.Fragment,{children:[t.jsxs("div",{css:pf,children:[t.jsxs("button",{type:"button",onClick:()=>{d(void 0),h(-1),x.current[p]?.focus()},"aria-label":"Go back",css:nf(e),ref:f,children:[t.jsx($,{rotate:"90",color:"var(--chakra-colors-neutral-700)"}),u?.label]}),t.jsxs("button",{type:"button",onClick:()=>{d(void 0),h(-1),l(!1)},"aria-label":"Close menu",css:nf(e),children:["Close",t.jsx(E,{height:"16px",width:"16px"})]})]}),t.jsx("div",{css:lf,children:u?.items?.map((e=>t.jsx(g,{to:e.link,href:e.link,css:cf(),onClick:()=>{d(void 0),h(-1),l(!1)},children:e.label},e.label)))})]}):null})]})},xf=1023,gf=r.css`
+`,ff=({theme:e="light",navigationSection:r,utilitySection:o,actionsSection:i,linkRouter:a,isOpen:s,setIsOpen:l,pathname:c})=>{const[u,d]=n.useState(void 0),[p,h]=n.useState(-1),f=n.useRef(null),x=n.useRef([]),g=a;return t.jsxs(t.Fragment,{children:[t.jsx("div",{css:rf(s),children:s&&t.jsxs("div",{css:of,children:[t.jsxs("div",{style:{overflowY:"scroll",width:"100%",height:"100%",paddingBottom:"72px"},children:[o?t.jsx("div",{css:af(e),children:o?.map((e=>t.jsx("div",{className:"ds-utility-item",children:e})))}):null,r?t.jsx("div",{css:sf,children:r.map(((e,n)=>e.link?t.jsx(g,{to:e.link,href:e.link,onClick:()=>{d(void 0),h(-1),l(!1)},css:cf(c===e.link),children:e.label},e.label):t.jsxs("button",{css:uf,type:"button",ref:e=>{x.current[n]=e},onClick:()=>{e.items&&(d(e),h(n),setTimeout((()=>{f.current?.focus()}),100))},children:[e.label,e.items?t.jsx($,{rotate:"270",color:"var(--chakra-colors-neutral-700)"}):null]},e.label)))}):null]}),i?t.jsx("div",{css:hf,children:i.map((e=>t.jsx(b,{...e,onClick:t=>{e?.onClick?.(t),d(void 0),h(-1),l(!1)}},e.ariaLabel)))}):null]})}),t.jsx("div",{css:df(!!u?.items),children:u?.items?t.jsxs(t.Fragment,{children:[t.jsxs("div",{css:pf,children:[t.jsxs("button",{type:"button",onClick:()=>{d(void 0),h(-1),x.current[p]?.focus()},"aria-label":"Go back",css:nf(e),ref:f,children:[t.jsx($,{rotate:"90",color:"var(--chakra-colors-neutral-700)"}),u?.label]}),t.jsxs("button",{type:"button",onClick:()=>{d(void 0),h(-1),l(!1)},"aria-label":"Close menu",css:nf(e),children:["Close",t.jsx(E,{height:"16px",width:"16px"})]})]}),t.jsx("div",{css:lf,children:u?.items?.map((e=>t.jsx(g,{to:e.link,href:e.link,css:cf(),onClick:()=>{d(void 0),h(-1),l(!1)},children:e.label},e.label)))})]}):null})]})},xf=1023,gf=r.css`
   width: 64px;
   height: 100%;
   z-index: 100;

package/dist/index.d.ts

@@ -137,7 +137,7 @@ type TooltipProps = {
     closeDelay?: number;
 };
 
-declare const Tooltip: ({ children, content, showArrow, disabled, position, variant, portalRef, openDelay, closeDelay, }: TooltipProps) => string | number | boolean | Iterable<React$1.ReactNode> | _emotion_react_jsx_runtime.JSX.Element | null | undefined;
+declare const Tooltip: ({ children, content, showArrow, disabled, position, variant, portalRef, openDelay, closeDelay, }: TooltipProps) => string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | _emotion_react_jsx_runtime.JSX.Element | null | undefined;
 
 type CheckboxProps = Omit<Checkbox$1.RootProps, 'size' | 'variant' | 'colorPalette' | 'icon' | 'iconColor' | 'iconSize' | 'spacing' | 'invalid'> & {
     name?: string;
@@ -480,7 +480,7 @@ type MapPopUpProps = {
     open: boolean;
     onOpenChange: (open: boolean) => void;
     /** The element that the modal/connector should point to */
-    anchorRef: React.RefObject<HTMLElement>;
+    anchorRef: React.RefObject<HTMLButtonElement | null>;
     header: React.ReactNode;
     content: React.ReactNode;
     footer?: React.ReactNode;

package/dist/index.esm.js

@@ -3027,7 +3027,7 @@ function Mh(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   button {
     width: calc(48% - 24px);
   }
-`,Kg=({theme:e="light",navigationSection:t,utilitySection:n,actionsSection:r,linkRouter:o,isOpen:i,setIsOpen:a,pathname:l})=>{const[s,c]=J(void 0),[d,u]=J(-1),p=Q(null),h=Q([]),f=o;return q(U,{children:[G("div",{css:Hg(i),children:i&&q("div",{css:Bg,children:[q("div",{style:{overflowY:"scroll",width:"100%",height:"100%",paddingBottom:"72px"},children:[n?G("div",{css:Fg(e),children:n?.map((e=>G("div",{className:"ds-utility-item",children:e})))}):null,t?G("div",{css:Zg,children:t.map(((e,t)=>e.link?G(f,{to:e.link,href:e.link,onClick:()=>{c(void 0),u(-1),a(!1)},css:qg(l===e.link),children:e.label},e.label):q("button",{css:Gg,type:"button",ref:e=>h.current[t]=e,onClick:()=>{e.items&&(c(e),u(t),setTimeout((()=>{p.current?.focus()}),100))},children:[e.label,e.items?G(Me,{rotate:"270",color:"var(--chakra-colors-neutral-700)"}):null]},e.label)))}):null]}),r?G("div",{css:Yg,children:r.map((e=>G(Le,{...e,onClick:t=>{e?.onClick?.(t),c(void 0),u(-1),a(!1)}},e.ariaLabel)))}):null]})}),G("div",{css:Ug(!!s?.items),children:s?.items?q(U,{children:[q("div",{css:Xg,children:[q("button",{type:"button",onClick:()=>{c(void 0),u(-1),h.current[d]?.focus()},"aria-label":"Go back",css:zg(e),ref:p,children:[G(Me,{rotate:"90",color:"var(--chakra-colors-neutral-700)"}),s?.label]}),q("button",{type:"button",onClick:()=>{c(void 0),u(-1),a(!1)},"aria-label":"Close menu",css:zg(e),children:["Close",G(Ne,{height:"16px",width:"16px"})]})]}),G("div",{css:Wg,children:s?.items?.map((e=>G(f,{to:e.link,href:e.link,css:qg(),onClick:()=>{c(void 0),u(-1),a(!1)},children:e.label},e.label)))})]}):null})]})},Jg=1023,Qg=({variant:e="default",theme:t="light",logo:n,linkRouter:r,pathname:o,navigationSection:i,utilitySection:a,actionsSection:l,maxWidth:s,fixed:c,onNavbarHeightChange:d,backgroundColor:u})=>{const p=Q(null),h=Q(null),f=Q(null),[g,v]=J(!1),[m,x]=J(-1),[b,y]=J("undefined"!=typeof window&&window?.innerWidth<=Jg),[w,C]=J(!1),$=r,k=ie((()=>{if(h.current&&p.current&&f.current){const e=p.current.getBoundingClientRect(),t=h.current.getBoundingClientRect(),n=f.current.getBoundingClientRect();t.width,e.width,window.innerWidth<=Jg||window.innerWidth<=m?(d?.(96),v(!0)):window.innerWidth>Jg&&window.innerWidth<=1440?e.right>=t.left?(d?.(96),v(!0),x(window.innerWidth)):window.innerWidth>m&&(d?.(48),v(!1),x(-1)):(d?.(48),v(!1),x(-1)),g&&(window.innerWidth<=Jg||n.right>=t.left?(y(!0),d?.(48)):(y(!1),d?.(96)))}}),[m,g]);ee((()=>(k(),window.addEventListener("resize",k),()=>{window.removeEventListener("resize",k)})),[k]);const S="condensed"===e;return q("nav",{css:Tg(g&&!b,c,u,t,S),children:[q("div",{css:_g(g&&!b,s,S),children:[q("div",{css:Mg(g&&!b||"dark"===t,S),ref:p,children:[n?G("div",{ref:f,css:Dg,children:n}):null,G("div",{css:Ng(g),children:i?.map((e=>e.link?G($,{to:e.link,href:e.link,css:jg(o===e.link,t),children:e.label},e.label):G(Pt,{theme:t,label:e.label,items:e.items||[]},e.label)))})]}),G("div",{css:Vg(S),ref:h,children:b?q("button",{type:"button",onClick:()=>C(!w),"aria-label":"Open menu",css:zg(t),children:[w?"Close":"Menu",G(w?Ne:at,{height:"16px",width:"16px"})]}):q(U,{children:[G("div",{css:Vg(S),children:a?.map(((e,t)=>G("div",{css:Ig(g),children:e},t)))}),l?.length?G("div",{css:Ag(g),children:l.map((e=>G(Le,{...e},e.ariaLabel)))}):null]})})]}),g&&!b?G("div",{css:Pg(t,S),children:i?.map((e=>e.link?G($,{to:e.link,href:e.link,css:jg(o===e.link,t),children:e.label},e.label):G(Pt,{theme:t,label:e.label,items:e.items||[]},e.label)))}):null,b?G(Kg,{theme:t,navigationSection:i,utilitySection:a,actionsSection:l,linkRouter:r,isOpen:w,setIsOpen:C,pathname:o}):null]})},ev=de`
+`,Kg=({theme:e="light",navigationSection:t,utilitySection:n,actionsSection:r,linkRouter:o,isOpen:i,setIsOpen:a,pathname:l})=>{const[s,c]=J(void 0),[d,u]=J(-1),p=Q(null),h=Q([]),f=o;return q(U,{children:[G("div",{css:Hg(i),children:i&&q("div",{css:Bg,children:[q("div",{style:{overflowY:"scroll",width:"100%",height:"100%",paddingBottom:"72px"},children:[n?G("div",{css:Fg(e),children:n?.map((e=>G("div",{className:"ds-utility-item",children:e})))}):null,t?G("div",{css:Zg,children:t.map(((e,t)=>e.link?G(f,{to:e.link,href:e.link,onClick:()=>{c(void 0),u(-1),a(!1)},css:qg(l===e.link),children:e.label},e.label):q("button",{css:Gg,type:"button",ref:e=>{h.current[t]=e},onClick:()=>{e.items&&(c(e),u(t),setTimeout((()=>{p.current?.focus()}),100))},children:[e.label,e.items?G(Me,{rotate:"270",color:"var(--chakra-colors-neutral-700)"}):null]},e.label)))}):null]}),r?G("div",{css:Yg,children:r.map((e=>G(Le,{...e,onClick:t=>{e?.onClick?.(t),c(void 0),u(-1),a(!1)}},e.ariaLabel)))}):null]})}),G("div",{css:Ug(!!s?.items),children:s?.items?q(U,{children:[q("div",{css:Xg,children:[q("button",{type:"button",onClick:()=>{c(void 0),u(-1),h.current[d]?.focus()},"aria-label":"Go back",css:zg(e),ref:p,children:[G(Me,{rotate:"90",color:"var(--chakra-colors-neutral-700)"}),s?.label]}),q("button",{type:"button",onClick:()=>{c(void 0),u(-1),a(!1)},"aria-label":"Close menu",css:zg(e),children:["Close",G(Ne,{height:"16px",width:"16px"})]})]}),G("div",{css:Wg,children:s?.items?.map((e=>G(f,{to:e.link,href:e.link,css:qg(),onClick:()=>{c(void 0),u(-1),a(!1)},children:e.label},e.label)))})]}):null})]})},Jg=1023,Qg=({variant:e="default",theme:t="light",logo:n,linkRouter:r,pathname:o,navigationSection:i,utilitySection:a,actionsSection:l,maxWidth:s,fixed:c,onNavbarHeightChange:d,backgroundColor:u})=>{const p=Q(null),h=Q(null),f=Q(null),[g,v]=J(!1),[m,x]=J(-1),[b,y]=J("undefined"!=typeof window&&window?.innerWidth<=Jg),[w,C]=J(!1),$=r,k=ie((()=>{if(h.current&&p.current&&f.current){const e=p.current.getBoundingClientRect(),t=h.current.getBoundingClientRect(),n=f.current.getBoundingClientRect();t.width,e.width,window.innerWidth<=Jg||window.innerWidth<=m?(d?.(96),v(!0)):window.innerWidth>Jg&&window.innerWidth<=1440?e.right>=t.left?(d?.(96),v(!0),x(window.innerWidth)):window.innerWidth>m&&(d?.(48),v(!1),x(-1)):(d?.(48),v(!1),x(-1)),g&&(window.innerWidth<=Jg||n.right>=t.left?(y(!0),d?.(48)):(y(!1),d?.(96)))}}),[m,g]);ee((()=>(k(),window.addEventListener("resize",k),()=>{window.removeEventListener("resize",k)})),[k]);const S="condensed"===e;return q("nav",{css:Tg(g&&!b,c,u,t,S),children:[q("div",{css:_g(g&&!b,s,S),children:[q("div",{css:Mg(g&&!b||"dark"===t,S),ref:p,children:[n?G("div",{ref:f,css:Dg,children:n}):null,G("div",{css:Ng(g),children:i?.map((e=>e.link?G($,{to:e.link,href:e.link,css:jg(o===e.link,t),children:e.label},e.label):G(Pt,{theme:t,label:e.label,items:e.items||[]},e.label)))})]}),G("div",{css:Vg(S),ref:h,children:b?q("button",{type:"button",onClick:()=>C(!w),"aria-label":"Open menu",css:zg(t),children:[w?"Close":"Menu",G(w?Ne:at,{height:"16px",width:"16px"})]}):q(U,{children:[G("div",{css:Vg(S),children:a?.map(((e,t)=>G("div",{css:Ig(g),children:e},t)))}),l?.length?G("div",{css:Ag(g),children:l.map((e=>G(Le,{...e},e.ariaLabel)))}):null]})})]}),g&&!b?G("div",{css:Pg(t,S),children:i?.map((e=>e.link?G($,{to:e.link,href:e.link,css:jg(o===e.link,t),children:e.label},e.label):G(Pt,{theme:t,label:e.label,items:e.items||[]},e.label)))}):null,b?G(Kg,{theme:t,navigationSection:i,utilitySection:a,actionsSection:l,linkRouter:r,isOpen:w,setIsOpen:C,pathname:o}):null]})},ev=de`
   width: 64px;
   height: 100%;
   z-index: 100;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worldresources/wri-design-systems",
-  "version": "2.180.2",
+  "version": "2.181.0-react-19-beta.0",
   "description": "WRI UI Library",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -45,6 +45,7 @@
     "@chakra-ui/storybook-addon": "^5.2.5",
     "@chromatic-com/storybook": "^1.9.0",
     "@emotion/react": "^11.14.0",
+    "@floating-ui/react": "^0.27.16",
     "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-terser": "^0.4.4",
@@ -63,19 +64,20 @@
     "@testing-library/user-event": "^13.5.0",
     "@types/jest": "^27.5.2",
     "@types/node": "^16.18.112",
-    "@types/react": "^18.3.11",
-    "@types/react-dom": "^18.3.0",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.1",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^18.0.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-storybook": "^0.9.0",
     "prettier": "^3.3.3",
     "prop-types": "^15.8.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "^19.0.1",
+    "react-dom": "^19.0.1",
     "react-draggable": "^4.4.6",
     "react-router-dom": "^7.1.5",
     "react-scripts": "5.0.1",
+    "react-spring-bottom-sheet": "^3.4.1",
     "rollup": "^4.34.8",
     "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-peer-deps-external": "^2.2.4",
@@ -89,19 +91,13 @@
   "peerDependencies": {
     "@chakra-ui/react": "^3.14.2",
     "@emotion/react": "^11.14.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react": "^19.0.1",
+    "react-dom": "^19.0.1"
   },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/wri/wri-design-systems.git"
   },
   "author": "WRI",
-  "license": "MIT",
-  "dependencies": {
-    "@chakra-ui/charts": "^3.30.0",
-    "@floating-ui/react": "^0.27.16",
-    "react-spring-bottom-sheet": "^3.4.1",
-    "recharts": "^3.6.0"
-  }
+  "license": "MIT"
 }