@worldresources/wri-design-systems 2.201.2 → 2.201.3

package/dist/index.cjs.js

@@ -2536,12 +2536,13 @@
 `,ok=i.css`
   padding: ${k(300)};
 `,ik=e=>i.css`
+  display: flex;
+  flex-direction: column;
   height: 100%;
   width: ${e||"20rem"};
   background-color: ${w("neutral",100)};
   box-shadow: 0 0.0625rem 0.125rem -0.0625rem #0000001a;
   box-shadow: 0 0.0625rem 0.1875rem 0 #0000001a;
-  position: relative;
 `,sk=i.css`
   border-right: ${j(100)} solid
     ${w("neutral",300)};
@@ -2549,12 +2550,14 @@
   border: ${j(100)} solid ${w("neutral",300)};
   border-radius: ${$(300)};
 `,lk=i.css`
+  flex-shrink: 0;
   min-height: ${k(1200)};
   width: 100%;
   border-bottom: ${j(100)} solid
     ${w("neutral",300)};
-`,ck=(e,t)=>i.css`
-  height: ${((e,t)=>e&&t?`calc(100% - ${(e+t)/16}rem)`:e?`calc(100% - ${e/16}rem)`:t?`calc(100% - ${t/16}rem)`:"100%")(e,t)};
+`,ck=i.css`
+  flex: 1;
+  min-height: 0;
   width: 100%;
   overflow-y: auto;
 
@@ -2562,14 +2565,12 @@
     outline-color: ${w("primary",700)};
   }
 `,dk=i.css`
+  flex-shrink: 0;
   min-height: ${k(1600)};
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  position: absolute;
-  bottom: 0;
-  left: 0;
   border-top: ${j(100)} solid
     ${w("neutral",300)};
 `;var uk,hk;!function(){if(hk)return uk;hk=1;var e=function(){};if("production"!==process.env.NODE_ENV){var t=function(e,t){var n=arguments.length;t=new Array(n>1?n-1:0);for(var r=1;r<n;r++)t[r-1]=arguments[r];var o=0,i="Warning: "+e.replace(/%s/g,(function(){return t[o++]}));"undefined"!=typeof console&&console.error(i);try{throw new Error(i)}catch(e){}};e=function(e,n,r){var o=arguments.length;r=new Array(o>2?o-2:0);for(var i=2;i<o;i++)r[i-2]=arguments[i];if(void 0===n)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");e||t.apply(null,[n].concat(r))}}uk=e}();var pk=fk()?n.useLayoutEffect:n.useEffect;"production"!==process.env.NODE_ENV&&("undefined"!=typeof process?process:{env:{NODE_ENV:"development"}}).env;function fk(){return!("undefined"==typeof window||!window.document||!window.document.createElement)}process.env.NODE_ENV,process.env.NODE_ENV,process.env.NODE_ENV;var mk=function(e){var t,r=e.children,i=e.type,s=void 0===i?"reach-portal":i,a=n.useRef(null),l=n.useRef(null),c=(t=n.useState(Object.create(null))[1],n.useCallback((function(){t(Object.create(null))}),[]));return pk((function(){if(a.current){var e=a.current.ownerDocument;return l.current=null==e?void 0:e.createElement(s),e.body.appendChild(l.current),c(),function(){l.current&&l.current.ownerDocument&&l.current.ownerDocument.body.removeChild(l.current)}}}),[s,c]),l.current?o.createPortal(r,l.current):n.createElement("span",{ref:a})};"production"!==process.env.NODE_ENV&&(mk.displayName="Portal");
@@ -3984,7 +3985,7 @@ function WM(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   padding: 0;
   padding-top: ${k(200)};
   color: ${n?w("neutral",500):"inherit"};
-`),children:t.children}):null]},`${t.label}-${t.value}`);var n,o,c,d}))})}),exports.Pagination=Pw,exports.Panel=({header:e,content:t,footer:o,variant:i="fixed",width:s})=>{const a=n.useId(),[l,c]=n.useState(void 0),[d,u]=n.useState(void 0),h=n.useRef(null),p=n.useRef(null);n.useEffect((()=>{c(h?.current?.getBoundingClientRect()?.height),u(p?.current?.getBoundingClientRect()?.height)}),[e,o]);return r.jsxs("div",{role:"region","aria-labelledby":e?a:void 0,css:[ik(s),"fixed"===i?sk:ak],children:[e?r.jsx("div",{id:a,css:lk,ref:h,children:e}):null,r.jsx("div",{css:ck(l,d),children:t}),o?r.jsx("div",{css:dk,ref:p,children:o}):null]})},exports.Password=({label:e,caption:t,required:o,disabledRules:s,onChange:a,minLength:l=8,hideValidations:c,labels:d})=>{const u=Mf("Password",d),[h,p]=n.useState(!1),[f,m]=n.useState(""),[g,v]=n.useState({strength:"very-weak",length:!1,uppercase:!1,lowercase:!1,numbers:!1,specialCharacters:!1}),b={"very-weak":u.strengthVeryWeak,weak:u.strengthWeak,medium:u.strengthMedium,strong:u.strengthStrong,"very-strong":u.strengthVeryStrong};return r.jsxs("div",{css:Bv,children:[r.jsxs("p",{css:Hv,"aria-label":e,children:[o?r.jsx("span",{children:"*"}):null,e]}),r.jsx("p",{css:_v,"aria-label":t,children:t}),r.jsxs("div",{css:Fv,children:[r.jsx(eg,{type:h?"text":"password","aria-label":e,value:f,"aria-describedby":"password-guidelines",onChange:e=>(e=>{const t={...g};let n=0,r=!1;t.length=e.length>=l,n+=e.length>=l?1:0,r=/[A-Z]/.test(e),n+=r?1:0,t.uppercase=r,r=/[a-z]/.test(e),n+=r?1:0,t.lowercase=r,r=/[0-9]/.test(e),n+=r?1:0,t.numbers=r,r=/[-'/`~!¡#*$@_%+=.,^&(){}[\]|;:“‘"<>?\\]/.test(e),n+=r?1:0,t.specialCharacters=r,t.strength="very-weak",e.length>=4&&n>=2&&(t.strength="weak"),e.length>=6&&n>=3&&(t.strength="medium"),e.length>=l&&n>=4&&(t.strength="strong"),e.length>=l+2&&n>=5&&(t.strength="very-strong"),m(e),v(t),a&&a({...t,password:e})})(e.target.value)}),r.jsx(Ef,{label:h?u.hideLabel:u.showLabel,variant:"secondary",leftIcon:h?r.jsx(Hf,{}):r.jsx(Bf,{}),"aria-label":h?u.hidePasswordLabel:u.showPasswordLabel,onClick:()=>p(!h),type:"button"})]}),f&&!c?r.jsxs("div",{id:"password-guidelines",css:qv,"aria-live":"polite",children:[r.jsxs("p",{css:(y=g.strength,i.css`
+`),children:t.children}):null]},`${t.label}-${t.value}`);var n,o,c,d}))})}),exports.Pagination=Pw,exports.Panel=({header:e,content:t,footer:o,variant:i="fixed",width:s})=>{const a=n.useId();return r.jsxs("div",{role:"region","aria-labelledby":e?a:void 0,css:[ik(s),"fixed"===i?sk:ak],children:[e?r.jsx("div",{id:a,css:lk,children:e}):null,r.jsx("div",{css:ck,children:t}),o?r.jsx("div",{css:dk,children:o}):null]})},exports.Password=({label:e,caption:t,required:o,disabledRules:s,onChange:a,minLength:l=8,hideValidations:c,labels:d})=>{const u=Mf("Password",d),[h,p]=n.useState(!1),[f,m]=n.useState(""),[g,v]=n.useState({strength:"very-weak",length:!1,uppercase:!1,lowercase:!1,numbers:!1,specialCharacters:!1}),b={"very-weak":u.strengthVeryWeak,weak:u.strengthWeak,medium:u.strengthMedium,strong:u.strengthStrong,"very-strong":u.strengthVeryStrong};return r.jsxs("div",{css:Bv,children:[r.jsxs("p",{css:Hv,"aria-label":e,children:[o?r.jsx("span",{children:"*"}):null,e]}),r.jsx("p",{css:_v,"aria-label":t,children:t}),r.jsxs("div",{css:Fv,children:[r.jsx(eg,{type:h?"text":"password","aria-label":e,value:f,"aria-describedby":"password-guidelines",onChange:e=>(e=>{const t={...g};let n=0,r=!1;t.length=e.length>=l,n+=e.length>=l?1:0,r=/[A-Z]/.test(e),n+=r?1:0,t.uppercase=r,r=/[a-z]/.test(e),n+=r?1:0,t.lowercase=r,r=/[0-9]/.test(e),n+=r?1:0,t.numbers=r,r=/[-'/`~!¡#*$@_%+=.,^&(){}[\]|;:“‘"<>?\\]/.test(e),n+=r?1:0,t.specialCharacters=r,t.strength="very-weak",e.length>=4&&n>=2&&(t.strength="weak"),e.length>=6&&n>=3&&(t.strength="medium"),e.length>=l&&n>=4&&(t.strength="strong"),e.length>=l+2&&n>=5&&(t.strength="very-strong"),m(e),v(t),a&&a({...t,password:e})})(e.target.value)}),r.jsx(Ef,{label:h?u.hideLabel:u.showLabel,variant:"secondary",leftIcon:h?r.jsx(Hf,{}):r.jsx(Bf,{}),"aria-label":h?u.hidePasswordLabel:u.showPasswordLabel,onClick:()=>p(!h),type:"button"})]}),f&&!c?r.jsxs("div",{id:"password-guidelines",css:qv,"aria-live":"polite",children:[r.jsxs("p",{css:(y=g.strength,i.css`
   font-size: ${C(400)};
   line-height: ${S(600)};
   font-weight: 400;

package/dist/index.esm.js

@@ -2638,12 +2638,13 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as o,Ic
 `,Z$=$e`
   padding: ${He(300)};
 `,G$=({header:e,content:t,footer:n,size:r="medium",width:o,height:i,maxHeight:s,draggable:l,blocking:c,open:d,onClose:u,labels:h,lazyMount:p,unmountOnExit:f,restoreFocus:m,modal:g,initialFocusEl:v,finalFocusEl:b,trapFocus:y})=>{const w=qm("Modal",h),C=ae(null);return d?ye(z.Root,{open:d,onOpenChange:u,placement:"center",scrollBehavior:"inside",closeOnInteractOutside:!l&&!c,preventScroll:!l&&!c,closeOnEscape:!c,defaultOpen:!0,trapFocus:y,lazyMount:p,unmountOnExit:f,restoreFocus:m,modal:g,initialFocusEl:v,finalFocusEl:b,children:be(a,{children:[l?null:ye(z.Backdrop,{css:{background:"rgba(0, 0, 0, 0.64)"}}),ye(q$,{disabled:!l,nodeRef:C,children:ye(z.Positioner,{ref:C,children:be(z.Content,{"aria-label":w.dialogAriaLabel,css:W$(r,o,i,s),children:[be(z.Header,{css:U$,children:[e,c?null:ye(z.CloseTrigger,{css:K$,asChild:!0,children:ye(Ev,{})})]}),ye(z.Body,{css:Z$,children:t}),n?ye(z.Footer,{padding:"0.75rem",children:n}):null]})})})]})}):null},J$=e=>$e`
+  display: flex;
+  flex-direction: column;
   height: 100%;
   width: ${e||"20rem"};
   background-color: ${ze("neutral",100)};
   box-shadow: 0 0.0625rem 0.125rem -0.0625rem #0000001a;
   box-shadow: 0 0.0625rem 0.1875rem 0 #0000001a;
-  position: relative;
 `,X$=$e`
   border-right: ${je(100)} solid
     ${ze("neutral",300)};
@@ -2651,12 +2652,14 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as o,Ic
   border: ${je(100)} solid ${ze("neutral",300)};
   border-radius: ${Be(300)};
 `,Q$=$e`
+  flex-shrink: 0;
   min-height: ${He(1200)};
   width: 100%;
   border-bottom: ${je(100)} solid
     ${ze("neutral",300)};
-`,eS=(e,t)=>$e`
-  height: ${((e,t)=>e&&t?`calc(100% - ${(e+t)/16}rem)`:e?`calc(100% - ${e/16}rem)`:t?`calc(100% - ${t/16}rem)`:"100%")(e,t)};
+`,eS=$e`
+  flex: 1;
+  min-height: 0;
   width: 100%;
   overflow-y: auto;
 
@@ -2664,17 +2667,15 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as o,Ic
     outline-color: ${ze("primary",700)};
   }
 `,tS=$e`
+  flex-shrink: 0;
   min-height: ${He(1600)};
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  position: absolute;
-  bottom: 0;
-  left: 0;
   border-top: ${je(100)} solid
     ${ze("neutral",300)};
-`,nS=({header:e,content:t,footer:n,variant:r="fixed",width:o})=>{const i=he(),[s,a]=le(void 0),[l,c]=le(void 0),d=ae(null),u=ae(null);de((()=>{a(d?.current?.getBoundingClientRect()?.height),c(u?.current?.getBoundingClientRect()?.height)}),[e,n]);return be("div",{role:"region","aria-labelledby":e?i:void 0,css:[J$(o),"fixed"===r?X$:Y$],children:[e?ye("div",{id:i,css:Q$,ref:d,children:e}):null,ye("div",{css:eS(s,l),children:t}),n?ye("div",{css:tS,ref:u,children:n}):null]})};var rS,oS;!function(){if(oS)return rS;oS=1;var e=function(){};if("production"!==process.env.NODE_ENV){var t=function(e,t){var n=arguments.length;t=new Array(n>1?n-1:0);for(var r=1;r<n;r++)t[r-1]=arguments[r];var o=0,i="Warning: "+e.replace(/%s/g,(function(){return t[o++]}));"undefined"!=typeof console&&console.error(i);try{throw new Error(i)}catch(e){}};e=function(e,n,r){var o=arguments.length;r=new Array(o>2?o-2:0);for(var i=2;i<o;i++)r[i-2]=arguments[i];if(void 0===n)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");e||t.apply(null,[n].concat(r))}}rS=e}();var iS=sS()?ue:de;"production"!==process.env.NODE_ENV&&("undefined"!=typeof process?process:{env:{NODE_ENV:"development"}}).env;function sS(){return!("undefined"==typeof window||!window.document||!window.document.createElement)}process.env.NODE_ENV,process.env.NODE_ENV,process.env.NODE_ENV;var aS=function(e){var t,n=e.children,r=e.type,o=void 0===r?"reach-portal":r,i=ae(null),s=ae(null),a=(t=le(Object.create(null))[1],fe((function(){t(Object.create(null))}),[]));return iS((function(){if(i.current){var e=i.current.ownerDocument;return s.current=null==e?void 0:e.createElement(o),e.body.appendChild(s.current),a(),function(){s.current&&s.current.ownerDocument&&s.current.ownerDocument.body.removeChild(s.current)}}}),[o,a]),s.current?ke(n,s.current):me("span",{ref:i})};"production"!==process.env.NODE_ENV&&(aS.displayName="Portal");
+`,nS=({header:e,content:t,footer:n,variant:r="fixed",width:o})=>{const i=he();return be("div",{role:"region","aria-labelledby":e?i:void 0,css:[J$(o),"fixed"===r?X$:Y$],children:[e?ye("div",{id:i,css:Q$,children:e}):null,ye("div",{css:eS,children:t}),n?ye("div",{css:tS,children:n}):null]})};var rS,oS;!function(){if(oS)return rS;oS=1;var e=function(){};if("production"!==process.env.NODE_ENV){var t=function(e,t){var n=arguments.length;t=new Array(n>1?n-1:0);for(var r=1;r<n;r++)t[r-1]=arguments[r];var o=0,i="Warning: "+e.replace(/%s/g,(function(){return t[o++]}));"undefined"!=typeof console&&console.error(i);try{throw new Error(i)}catch(e){}};e=function(e,n,r){var o=arguments.length;r=new Array(o>2?o-2:0);for(var i=2;i<o;i++)r[i-2]=arguments[i];if(void 0===n)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");e||t.apply(null,[n].concat(r))}}rS=e}();var iS=sS()?ue:de;"production"!==process.env.NODE_ENV&&("undefined"!=typeof process?process:{env:{NODE_ENV:"development"}}).env;function sS(){return!("undefined"==typeof window||!window.document||!window.document.createElement)}process.env.NODE_ENV,process.env.NODE_ENV,process.env.NODE_ENV;var aS=function(e){var t,n=e.children,r=e.type,o=void 0===r?"reach-portal":r,i=ae(null),s=ae(null),a=(t=le(Object.create(null))[1],fe((function(){t(Object.create(null))}),[]));return iS((function(){if(i.current){var e=i.current.ownerDocument;return s.current=null==e?void 0:e.createElement(o),e.body.appendChild(s.current),a(),function(){s.current&&s.current.ownerDocument&&s.current.ownerDocument.body.removeChild(s.current)}}}),[o,a]),s.current?ke(n,s.current):me("span",{ref:i})};"production"!==process.env.NODE_ENV&&(aS.displayName="Portal");
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worldresources/wri-design-systems",
-  "version": "2.201.2",
+  "version": "2.201.3",
   "description": "WRI UI Library",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",