@worldresources/wri-design-systems 2.148.2 → 2.148.4

package/dist/index.cjs.js

@@ -297,7 +297,7 @@
   width: 100%;
   margin-left: ${i?"8px":"0"};
   margin-right: ${a?"8px":"0"};
-`),children:[t.jsxs("div",{css:le,children:[t.jsx("p",{className:"ds-menu-item-label",children:n.label}),n.command?t.jsx(e.Menu.ItemCommand,{"aria-label":`Shortcut ${n.command}`,children:n.command}):null]}),n.caption?t.jsx("p",{className:"ds-menu-item-caption",children:n.caption}):null]}),n.endIcon]})}),o?null:t.jsx(e.Menu.Separator,{borderColor:"var(--chakra-colors-neutral-300)"})]});var i,a},de=({label:r,items:o,groups:i,onSelect:a,customTrigger:s})=>{const[l,c]=n.useState(!1);return t.jsxs(e.Menu.Root,{onSelect:({value:e})=>a&&a(e),onOpenChange:({open:e})=>c(e),open:l,children:[t.jsx(e.Menu.Trigger,{css:oe,asChild:!0,children:s||t.jsxs("button",{type:"button",children:[r,t.jsx(k,{marginLeft:"6px",rotate:l?"180":"0",height:"14px",width:"14px"})]})}),t.jsx(e.Portal,{children:t.jsx(e.Menu.Positioner,{children:t.jsxs(e.Menu.Content,{css:ie,role:"menu","aria-label":r||"Menu",children:[o?.map(((r,i)=>{if(r.submenu){const[o,s]=n.useState(!1);return t.jsxs(e.Menu.Root,{positioning:{placement:"right-start",gutter:2},onSelect:({value:e})=>a&&a(e),onOpenChange:({open:e})=>s(e),open:o,children:[t.jsxs(e.Menu.TriggerItem,{css:ae,role:"menuitem","aria-haspopup":"true","aria-expanded":o?"true":"false",children:[r.label," ",t.jsx(k,{rotate:"270",color:"var(--chakra-colors-neutral-700)"})]}),t.jsx(e.Portal,{children:t.jsx(e.Menu.Positioner,{children:t.jsx(e.Menu.Content,{css:ie,role:"menu","aria-label":`${r.label} submenu`,children:r.submenu.map(((e,n)=>t.jsx(ue,{item:e,isLast:n===(r.submenu?.length||0)-1},e.value)))})})})]},`${r.value}-${i}`)}return t.jsx(ue,{item:r,isLast:i===o.length-1},`${r.value}-${i}`)})),i?.map(((r,o)=>t.jsxs(n.Fragment,{children:[t.jsxs(e.Menu.ItemGroup,{role:"group","aria-labelledby":`group-${o}`,children:[t.jsx(e.Menu.ItemGroupLabel,{id:`group-${o}`,css:ce,children:r.title}),r.items?.map((e=>t.jsx(ue,{item:e,isLast:i.length-1===o},e.value)))]}),o!==i.length-1?t.jsx(e.Menu.Separator,{borderColor:"var(--chakra-colors-neutral-300)"}):null]},r.title)))]})})})]})},pe=e=>r.css`
+`),children:[t.jsxs("div",{css:le,children:[t.jsx("p",{className:"ds-menu-item-label",children:n.label}),n.command?t.jsx(e.Menu.ItemCommand,{"aria-label":`Shortcut ${n.command}`,children:n.command}):null]}),n.caption?t.jsx("p",{className:"ds-menu-item-caption",children:n.caption}):null]}),n.endIcon]})}),o?null:t.jsx(e.Menu.Separator,{borderColor:"var(--chakra-colors-neutral-300)"})]});var i,a},de=({label:r,items:o,groups:i,onSelect:a,customTrigger:s})=>{const[l,c]=n.useState(!1);return t.jsxs(e.Menu.Root,{onSelect:({value:e})=>a&&a(e),onOpenChange:({open:e})=>c(e),open:l,children:[t.jsx(e.Menu.Trigger,{css:oe,asChild:!0,children:s||t.jsxs("button",{type:"button",children:[r,t.jsx(k,{marginLeft:"6px",rotate:l?"180":"0",height:"14px",width:"14px"})]})}),t.jsx(e.Portal,{children:t.jsx(e.Menu.Positioner,{children:t.jsxs(e.Menu.Content,{css:ie,role:"menu","aria-label":r||"Menu",children:[o?.map(((r,i)=>{if(r.submenu){const[o,s]=n.useState(!1);return t.jsxs(e.Menu.Root,{positioning:{placement:"right-start",gutter:2},onSelect:({value:e})=>a&&a(e),onOpenChange:({open:e})=>s(e),open:o,children:[t.jsxs(e.Menu.TriggerItem,{css:ae,role:"menuitem","aria-haspopup":"true","aria-expanded":o?"true":"false",children:[r.label,t.jsx(k,{rotate:"270",color:"var(--chakra-colors-neutral-700)"})]}),t.jsx(e.Portal,{children:t.jsx(e.Menu.Positioner,{children:t.jsx(e.Menu.Content,{css:ie,role:"menu","aria-label":`${r.label} submenu`,children:r.submenu.map(((e,n)=>t.jsx(ue,{item:e,isLast:n===(r.submenu?.length||0)-1},e.value)))})})})]},`${r.value}-${i}`)}return t.jsx(ue,{item:r,isLast:i===o.length-1},`${r.value}-${i}`)})),i?.map(((r,o)=>t.jsxs(n.Fragment,{children:[t.jsxs(e.Menu.ItemGroup,{role:"group","aria-labelledby":`group-${o}`,children:[t.jsx(e.Menu.ItemGroupLabel,{id:`group-${o}`,css:ce,children:r.title}),r.items?.map((e=>t.jsx(ue,{item:e,isLast:i.length-1===o},e.value)))]}),o!==i.length-1?t.jsx(e.Menu.Separator,{borderColor:"var(--chakra-colors-neutral-300)"}):null]},r.title)))]})})})]})},pe=e=>r.css`
   position: relative;
 
   .toolbar-overflow-menu {
@@ -1883,6 +1883,7 @@
   border: 1px solid ${p("neutral",300)};
   border-radius: 4px;
   box-shadow: 0px 1px 2px 0px #0000000d;
+  background-color: ${p("neutral",100)};
 `,Ko=r.css`
   padding: 6px 8px;
   align-items: center;
@@ -1926,6 +1927,7 @@
   display: flex;
   gap: 12px;
   border-bottom: 1px solid ${p("neutral",300)};
+  background-color: ${p("neutral",100)};
 `,ti=r.css`
   display: flex;
   flex-direction: column;
@@ -2160,7 +2162,6 @@
 
   &:focus-visible {
     outline: 2px solid ${p("primary",700)};
-    outline-offset: 2px;
     box-shadow: 0px 2px 4px -2px #0000001a;
     box-shadow: 0px 4px 6px -1px #0000001a;
     box-shadow:
@@ -2278,10 +2279,12 @@
   border: 1px solid ${p("neutral",300)};
 `,ea=r.css`
   padding: 16px;
+
   cursor: pointer;
   border-bottom: 1px solid ${p("neutral",300)};
   &:focus-visible {
-    outline-color: ${p("primary",700)};
+    outline-offset: -2px;
+    outline: 2px solid ${p("primary",700)};
   }
   &:hover {
     box-shadow: 0px 2px 4px -2px #0000001a;
@@ -3317,7 +3320,7 @@ function Fd(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   color: ${p("error",100)};
 `,$f=(e,t)=>r.css`
   width: 100%;
-  min-width: ${"small"===e?"234px":"320px"};
+  max-width: ${"small"===e?"234px":"320px"};
   border-radius: 4px;
   padding: ${"small"===e?"8px 8px 12px 8px":"8px 12px 12px 12px"};
   display: flex;

package/dist/index.esm.js

@@ -297,7 +297,7 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as i,Ic
   width: 100%;
   margin-left: ${n?"8px":"0"};
   margin-right: ${r?"8px":"0"};
-`),children:[B("div",{css:pt,children:[F("p",{className:"ds-menu-item-label",children:e.label}),e.command?F(a.ItemCommand,{"aria-label":`Shortcut ${e.command}`,children:e.command}):null]}),e.caption?F("p",{className:"ds-menu-item-caption",children:e.caption}):null]}),e.endIcon]})}),t?null:F(a.Separator,{borderColor:"var(--chakra-colors-neutral-300)"})]});var n,r},gt=({label:e,items:t,groups:n,onSelect:r,customTrigger:i})=>{const[o,s]=U(!1);return B(a.Root,{onSelect:({value:e})=>r&&r(e),onOpenChange:({open:e})=>s(e),open:o,children:[F(a.Trigger,{css:st,asChild:!0,children:i||B("button",{type:"button",children:[e,F(Re,{marginLeft:"6px",rotate:o?"180":"0",height:"14px",width:"14px"})]})}),F(l,{children:F(a.Positioner,{children:B(a.Content,{css:ct,role:"menu","aria-label":e||"Menu",children:[t?.map(((e,n)=>{if(e.submenu){const[t,i]=U(!1);return B(a.Root,{positioning:{placement:"right-start",gutter:2},onSelect:({value:e})=>r&&r(e),onOpenChange:({open:e})=>i(e),open:t,children:[B(a.TriggerItem,{css:dt,role:"menuitem","aria-haspopup":"true","aria-expanded":t?"true":"false",children:[e.label," ",F(Re,{rotate:"270",color:"var(--chakra-colors-neutral-700)"})]}),F(l,{children:F(a.Positioner,{children:F(a.Content,{css:ct,role:"menu","aria-label":`${e.label} submenu`,children:e.submenu.map(((t,n)=>F(ft,{item:t,isLast:n===(e.submenu?.length||0)-1},t.value)))})})})]},`${e.value}-${n}`)}return F(ft,{item:e,isLast:n===t.length-1},`${e.value}-${n}`)})),n?.map(((e,t)=>B(q.Fragment,{children:[B(a.ItemGroup,{role:"group","aria-labelledby":`group-${t}`,children:[F(a.ItemGroupLabel,{id:`group-${t}`,css:ht,children:e.title}),e.items?.map((e=>F(ft,{item:e,isLast:n.length-1===t},e.value)))]}),t!==n.length-1?F(a.Separator,{borderColor:"var(--chakra-colors-neutral-300)"}):null]},e.title)))]})})})]})},vt=e=>ae`
+`),children:[B("div",{css:pt,children:[F("p",{className:"ds-menu-item-label",children:e.label}),e.command?F(a.ItemCommand,{"aria-label":`Shortcut ${e.command}`,children:e.command}):null]}),e.caption?F("p",{className:"ds-menu-item-caption",children:e.caption}):null]}),e.endIcon]})}),t?null:F(a.Separator,{borderColor:"var(--chakra-colors-neutral-300)"})]});var n,r},gt=({label:e,items:t,groups:n,onSelect:r,customTrigger:i})=>{const[o,s]=U(!1);return B(a.Root,{onSelect:({value:e})=>r&&r(e),onOpenChange:({open:e})=>s(e),open:o,children:[F(a.Trigger,{css:st,asChild:!0,children:i||B("button",{type:"button",children:[e,F(Re,{marginLeft:"6px",rotate:o?"180":"0",height:"14px",width:"14px"})]})}),F(l,{children:F(a.Positioner,{children:B(a.Content,{css:ct,role:"menu","aria-label":e||"Menu",children:[t?.map(((e,n)=>{if(e.submenu){const[t,i]=U(!1);return B(a.Root,{positioning:{placement:"right-start",gutter:2},onSelect:({value:e})=>r&&r(e),onOpenChange:({open:e})=>i(e),open:t,children:[B(a.TriggerItem,{css:dt,role:"menuitem","aria-haspopup":"true","aria-expanded":t?"true":"false",children:[e.label,F(Re,{rotate:"270",color:"var(--chakra-colors-neutral-700)"})]}),F(l,{children:F(a.Positioner,{children:F(a.Content,{css:ct,role:"menu","aria-label":`${e.label} submenu`,children:e.submenu.map(((t,n)=>F(ft,{item:t,isLast:n===(e.submenu?.length||0)-1},t.value)))})})})]},`${e.value}-${n}`)}return F(ft,{item:e,isLast:n===t.length-1},`${e.value}-${n}`)})),n?.map(((e,t)=>B(q.Fragment,{children:[B(a.ItemGroup,{role:"group","aria-labelledby":`group-${t}`,children:[F(a.ItemGroupLabel,{id:`group-${t}`,css:ht,children:e.title}),e.items?.map((e=>F(ft,{item:e,isLast:n.length-1===t},e.value)))]}),t!==n.length-1?F(a.Separator,{borderColor:"var(--chakra-colors-neutral-300)"}):null]},e.title)))]})})})]})},vt=e=>ae`
   position: relative;
 
   .toolbar-overflow-menu {
@@ -1932,6 +1932,7 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as i,Ic
   border: 1px solid ${ve("neutral",300)};
   border-radius: 4px;
   box-shadow: 0px 1px 2px 0px #0000000d;
+  background-color: ${ve("neutral",100)};
 `,xa=ae`
   padding: 6px 8px;
   align-items: center;
@@ -1975,6 +1976,7 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as i,Ic
   display: flex;
   gap: 12px;
   border-bottom: 1px solid ${ve("neutral",300)};
+  background-color: ${ve("neutral",100)};
 `,$a=ae`
   display: flex;
   flex-direction: column;
@@ -2216,7 +2218,6 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as i,Ic
 
   &:focus-visible {
     outline: 2px solid ${ve("primary",700)};
-    outline-offset: 2px;
     box-shadow: 0px 2px 4px -2px #0000001a;
     box-shadow: 0px 4px 6px -1px #0000001a;
     box-shadow:
@@ -2334,10 +2335,12 @@ import{createSystem as e,defaultConfig as t,Button as n,Box as r,Spinner as i,Ic
   border: 1px solid ${ve("neutral",300)};
 `,Rl=ae`
   padding: 16px;
+
   cursor: pointer;
   border-bottom: 1px solid ${ve("neutral",300)};
   &:focus-visible {
-    outline-color: ${ve("primary",700)};
+    outline-offset: -2px;
+    outline: 2px solid ${ve("primary",700)};
   }
   &:hover {
     box-shadow: 0px 2px 4px -2px #0000001a;
@@ -3379,7 +3382,7 @@ function yh(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
   color: ${ve("error",100)};
 `,cv=({hasNotification:e,notificationCount:t,label:n})=>{const[r,i]=U(!1);X((()=>{const e=()=>{window.innerWidth<1024?i(!0):i(!1)};return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),[]);const o=(()=>{let e="";return t&&t>0&&(e=`${t>99?"99+":t}`),e})();let a="16px";return t&&t>99?a="28px":t&&t>9&&(a="22px"),B("div",r?{css:nv,role:"status","aria-live":"polite",children:[B("div",{css:rv(),children:[F(ze,{color:"currentColor",height:"16px",width:"16px"}),!e||t||n?null:F("div",{css:iv,"aria-hidden":!0})]}),n?F("p",{children:n}):null,o.length>0?F("div",{css:lv,children:F("p",{css:sv,"aria-label":`${t} unread message`,children:o})}):null]}:{css:nv,role:"status","aria-live":"polite",children:[n?F("p",{children:n}):null,B("div",{css:rv(a),children:[o.length>0?F("div",{css:ov,children:F("p",{css:av,"aria-label":`${t} unread message`,children:o})}):null,e&&!t?F("div",{css:iv,"aria-hidden":!0}):null,F(ze,{color:"currentColor",height:"16px",width:"16px"})]})]})},dv=(e,t)=>ae`
   width: 100%;
-  min-width: ${"small"===e?"234px":"320px"};
+  max-width: ${"small"===e?"234px":"320px"};
   border-radius: 4px;
   padding: ${"small"===e?"8px 8px 12px 8px":"8px 12px 12px 12px"};
   display: flex;

package/package.json

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