@worldresources/wri-design-systems 2.202.6 → 2.202.8

package/dist/index.cjs.js

@@ -1953,7 +1953,7 @@
   padding: ${k(200)} ${k(300)};
   border-bottom: ${M(100)} solid
     ${w("neutral",300)};
-  min-height: ${k(1600)};
+  min-height: ${k(1e3)};
 
   .ds-map-pop-up-close-button {
     margin-top: ${k(100)};
@@ -2735,21 +2735,19 @@ function _E(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
     }
   `},kT=i.css`
   display: flex;
-  align-items: flex-start;
+  align-items: baseline;
   gap: ${k(200)};
 
   svg {
     margin-top: 0.1875rem;
   }
 `,ST=e=>i.css`
-  max-width: 45rem;
   color: ${w("neutral",800)};
   font-size: ${C("small"===e?300:500)};
   line-height: ${S("small"===e?500:700)};
   font-weight: 400;
   text-align: left;
 `,$T=(e,t)=>i.css`
-  max-width: 45rem;
   color: ${w("neutral",700)};
   font-size: ${C("small"===e?200:400)};
   line-height: ${S("small"===e?400:600)};
@@ -2757,7 +2755,6 @@ function _E(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   margin-left: ${t?k(600):"0"};
   text-align: left;
 `,MT=(e,t)=>i.css`
-  max-width: 45rem;
   color: ${w("neutral",700)};
   font-size: ${C("small"===e?200:400)};
   line-height: ${S("small"===e?400:600)};
@@ -2796,7 +2793,7 @@ function _E(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   p {
     color: ${w("error",900)};
   }
-`,AT=({label:e,caption:t,variant:n,size:o="large",icon:i=r.jsx(Kf,{height:"1rem",width:"1rem"}),onActionClick:s,actionLabel:a,isButtonRight:l,buttonLeftIcon:c,buttonRightIcon:d,labels:u})=>{const h=Vf("InlineMessage",u);let p=ET;"info-grey"===n?p=jT:"success"===n?p=TT:"warning"===n?p=OT:"error"===n&&(p=LT);const f="error"===n||"warning"===n?"alert":"status",m="alert"===f?"assertive":"polite";return r.jsxs("div",{css:[CT(o,l),p],role:f,"aria-live":m,"aria-roledescription":h.roleDescription,children:[r.jsxs("div",{children:[r.jsxs("div",{css:kT,children:[i,r.jsx("p",{css:ST(o),children:e})]}),t&&"string"==typeof t?r.jsx("p",{css:$T(o,!!i),children:t}):t?r.jsx("div",{css:MT(o,!!i),children:t}):null]}),a?r.jsx(Bf,{label:a,variant:"info-white"===n||"info-grey"===n?"primary":"secondary",size:"large"===o?"default":"small",onClick:s,leftIcon:c,rightIcon:d}):null]})},RT=i.css`
+`,AT=({label:e,caption:t,variant:n,size:o="large",icon:i=r.jsx(Kf,{height:"1rem",width:"1rem"}),onActionClick:s,actionLabel:a,isButtonRight:l,buttonLeftIcon:c,buttonRightIcon:d,labels:u})=>{const h=Vf("InlineMessage",u);let p=ET;"info-grey"===n?p=jT:"success"===n?p=TT:"warning"===n?p=OT:"error"===n&&(p=LT);const f="error"===n||"warning"===n?"alert":"status",m="alert"===f?"assertive":"polite";return r.jsxs("div",{css:[CT(o,l),p],role:f,"aria-live":m,"aria-roledescription":h.roleDescription,children:[r.jsxs("div",{children:[r.jsxs("div",{css:kT,children:[i,"string"==typeof e?r.jsx("p",{css:ST(o),children:e}):r.jsx("div",{css:ST(o),children:e})]}),t&&"string"==typeof t?r.jsx("p",{css:$T(o,!!i),children:t}):t?r.jsx("div",{css:MT(o,!!i),children:t}):null]}),a?r.jsx(Bf,{label:a,variant:"info-white"===n||"info-grey"===n?"primary":"secondary",size:"large"===o?"default":"small",onClick:s,leftIcon:c,rightIcon:d}):null]})},RT=i.css`
   width: 100%;
   min-height: calc(${k(1200)} * 12);
   background-color: ${w("neutral",100)};

package/dist/index.d.ts

@@ -1760,7 +1760,7 @@ type BadgeProps = {
 declare const Badge: ({ hasNotification, notificationCount, label, labels, }: BadgeProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type InlineMessageProps = {
-    label: string;
+    label: string | React.ReactNode;
     caption?: string | React.ReactNode;
     variant: 'info-white' | 'info-grey' | 'success' | 'warning' | 'error';
     size?: 'small' | 'large' | 'full-width';

package/dist/index.esm.js

@@ -2072,7 +2072,7 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as o,Ic
   padding: ${He(200)} ${He(300)};
   border-bottom: ${je(100)} solid
     ${ze("neutral",300)};
-  min-height: ${He(1600)};
+  min-height: ${He(1e3)};
 
   .ds-map-pop-up-close-button {
     margin-top: ${He(100)};
@@ -2861,21 +2861,19 @@ function DO(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
     }
   `},gA=$e`
   display: flex;
-  align-items: flex-start;
+  align-items: baseline;
   gap: ${He(200)};
 
   svg {
     margin-top: 0.1875rem;
   }
 `,bA=e=>$e`
-  max-width: 45rem;
   color: ${ze("neutral",800)};
   font-size: ${Ve("small"===e?300:500)};
   line-height: ${Be("small"===e?500:700)};
   font-weight: 400;
   text-align: left;
 `,vA=(e,t)=>$e`
-  max-width: 45rem;
   color: ${ze("neutral",700)};
   font-size: ${Ve("small"===e?200:400)};
   line-height: ${Be("small"===e?400:600)};
@@ -2883,7 +2881,6 @@ function DO(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   margin-left: ${t?He(600):"0"};
   text-align: left;
 `,yA=(e,t)=>$e`
-  max-width: 45rem;
   color: ${ze("neutral",700)};
   font-size: ${Ve("small"===e?200:400)};
   line-height: ${Be("small"===e?400:600)};
@@ -2922,7 +2919,7 @@ function DO(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   p {
     color: ${ze("error",900)};
   }
-`,SA=({label:e,caption:t,variant:n,size:r="large",icon:o=ye(dg,{height:"1rem",width:"1rem"}),onActionClick:i,actionLabel:s,isButtonRight:a,buttonLeftIcon:l,buttonRightIcon:c,labels:d})=>{const u=ng("InlineMessage",d);let h=wA;"info-grey"===n?h=CA:"success"===n?h=xA:"warning"===n?h=kA:"error"===n&&(h=$A);const p="error"===n||"warning"===n?"alert":"status",f="alert"===p?"assertive":"polite";return ve("div",{css:[mA(r,a),h],role:p,"aria-live":f,"aria-roledescription":u.roleDescription,children:[ve("div",{children:[ve("div",{css:gA,children:[o,ye("p",{css:bA(r),children:e})]}),t&&"string"==typeof t?ye("p",{css:vA(r,!!o),children:t}):t?ye("div",{css:yA(r,!!o),children:t}):null]}),s?ye(rg,{label:s,variant:"info-white"===n||"info-grey"===n?"primary":"secondary",size:"large"===r?"default":"small",onClick:i,leftIcon:l,rightIcon:c}):null]})},MA=$e`
+`,SA=({label:e,caption:t,variant:n,size:r="large",icon:o=ye(dg,{height:"1rem",width:"1rem"}),onActionClick:i,actionLabel:s,isButtonRight:a,buttonLeftIcon:l,buttonRightIcon:c,labels:d})=>{const u=ng("InlineMessage",d);let h=wA;"info-grey"===n?h=CA:"success"===n?h=xA:"warning"===n?h=kA:"error"===n&&(h=$A);const p="error"===n||"warning"===n?"alert":"status",f="alert"===p?"assertive":"polite";return ve("div",{css:[mA(r,a),h],role:p,"aria-live":f,"aria-roledescription":u.roleDescription,children:[ve("div",{children:[ve("div",{css:gA,children:[o,ye("string"==typeof e?"p":"div",{css:bA(r),children:e})]}),t&&"string"==typeof t?ye("p",{css:vA(r,!!o),children:t}):t?ye("div",{css:yA(r,!!o),children:t}):null]}),s?ye(rg,{label:s,variant:"info-white"===n||"info-grey"===n?"primary":"secondary",size:"large"===r?"default":"small",onClick:i,leftIcon:l,rightIcon:c}):null]})},MA=$e`
   width: 100%;
   min-height: calc(${He(1200)} * 12);
   background-color: ${ze("neutral",100)};

package/package.json

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