@worldresources/wri-design-systems 2.156.1 → 2.157.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +10 -6
- package/dist/index.d.ts +22 -7
- package/dist/index.esm.js +67 -63
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -2269,6 +2269,10 @@
|
|
|
2269
2269
|
td {
|
|
2270
2270
|
border-color: ${h("neutral",300)};
|
|
2271
2271
|
}
|
|
2272
|
+
|
|
2273
|
+
:hover {
|
|
2274
|
+
background-color: ${h("neutral",200)};
|
|
2275
|
+
}
|
|
2272
2276
|
}
|
|
2273
2277
|
`,ta=e.Table.Row,na=e.Table.Cell,ra=r.css`
|
|
2274
2278
|
border: 1px solid ${h("neutral",300)};
|
|
@@ -2668,10 +2672,10 @@ function Xd(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
|
|
|
2668
2672
|
display: flex;
|
|
2669
2673
|
justify-content: center;
|
|
2670
2674
|
align-items: center;
|
|
2671
|
-
`,Ah=(e,t)=>Math.max(0,e.findIndex((e=>e.value===t))),zh=(e,t)=>r.css`
|
|
2675
|
+
`,Ah=(e,t)=>Math.max(0,e.findIndex((e=>e.value===t))),zh=(e,t,n)=>r.css`
|
|
2672
2676
|
height: ${e?"96px":"48px"};
|
|
2673
2677
|
width: 100%;
|
|
2674
|
-
background-color: ${h("neutral",100)};
|
|
2678
|
+
background-color: ${n||h("neutral",100)};
|
|
2675
2679
|
position: ${t?"sticky":"absolute"};
|
|
2676
2680
|
top: 0;
|
|
2677
2681
|
left: 0;
|
|
@@ -2928,7 +2932,7 @@ function Xd(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
|
|
|
2928
2932
|
button {
|
|
2929
2933
|
width: calc(48% - 24px);
|
|
2930
2934
|
}
|
|
2931
|
-
`,sf=({navigationSection:e,utilitySection:r,actionsSection:o,linkRouter:i,isOpen:a,setIsOpen:s,pathname:l})=>{const[c,u]=n.useState(void 0),[d,p]=n.useState(-1),h=n.useRef(null),f=n.useRef([]),x=i;return t.jsxs(t.Fragment,{children:[t.jsx("div",{css:Yh(a),children:a&&t.jsxs("div",{css:Kh,children:[t.jsxs("div",{style:{overflowY:"scroll",width:"100%",height:"100%",paddingBottom:"72px"},children:[r?t.jsx("div",{css:Jh,children:r?.map((e=>t.jsx("div",{className:"ds-utility-item",children:e})))}):null,e?t.jsx("div",{css:Qh,children:e.map(((e,n)=>e.link?t.jsx(x,{to:e.link,href:e.link,onClick:()=>{u(void 0),p(-1),s(!1)},css:tf(l===e.link),children:e.label},e.label):t.jsxs("button",{css:nf,type:"button",ref:e=>f.current[n]=e,onClick:()=>{e.items&&(u(e),p(n),setTimeout((()=>{h.current?.focus()}),100))},children:[e.label,e.items?t.jsx($,{rotate:"270",color:"var(--chakra-colors-neutral-700)"}):null]},e.label)))}):null]}),o?t.jsx("div",{css:af,children:o.map((e=>t.jsx(b,{
|
|
2935
|
+
`,sf=({navigationSection:e,utilitySection:r,actionsSection:o,linkRouter:i,isOpen:a,setIsOpen:s,pathname:l})=>{const[c,u]=n.useState(void 0),[d,p]=n.useState(-1),h=n.useRef(null),f=n.useRef([]),x=i;return t.jsxs(t.Fragment,{children:[t.jsx("div",{css:Yh(a),children:a&&t.jsxs("div",{css:Kh,children:[t.jsxs("div",{style:{overflowY:"scroll",width:"100%",height:"100%",paddingBottom:"72px"},children:[r?t.jsx("div",{css:Jh,children:r?.map((e=>t.jsx("div",{className:"ds-utility-item",children:e})))}):null,e?t.jsx("div",{css:Qh,children:e.map(((e,n)=>e.link?t.jsx(x,{to:e.link,href:e.link,onClick:()=>{u(void 0),p(-1),s(!1)},css:tf(l===e.link),children:e.label},e.label):t.jsxs("button",{css:nf,type:"button",ref:e=>f.current[n]=e,onClick:()=>{e.items&&(u(e),p(n),setTimeout((()=>{h.current?.focus()}),100))},children:[e.label,e.items?t.jsx($,{rotate:"270",color:"var(--chakra-colors-neutral-700)"}):null]},e.label)))}):null]}),o?t.jsx("div",{css:af,children:o.map((e=>t.jsx(b,{...e,onClick:t=>{e?.onClick?.(t),u(void 0),p(-1),s(!1)}},e.ariaLabel)))}):null]})}),t.jsx("div",{css:rf(!!c?.items),children:c?.items?t.jsxs(t.Fragment,{children:[t.jsxs("div",{css:of,children:[t.jsxs("button",{type:"button",onClick:()=>{u(void 0),p(-1),f.current[d]?.focus()},"aria-label":"Go back",css:Xh,ref:h,children:[t.jsx($,{rotate:"90",color:"var(--chakra-colors-neutral-700)"}),c?.label]}),t.jsxs("button",{type:"button",onClick:()=>{u(void 0),p(-1),s(!1)},"aria-label":"Close menu",css:Xh,children:["Close",t.jsx(E,{height:"16px",width:"16px"})]})]}),t.jsx("div",{css:ef,children:c?.items?.map((e=>t.jsx(x,{to:e.link,href:e.link,css:tf(),onClick:()=>{u(void 0),p(-1),s(!1)},children:e.label},e.label)))})]}):null})]})},lf=1023,cf=r.css`
|
|
2932
2936
|
width: 64px;
|
|
2933
2937
|
height: 100%;
|
|
2934
2938
|
z-index: 100;
|
|
@@ -3564,13 +3568,13 @@ function Xd(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
|
|
|
3564
3568
|
padding: 0px;
|
|
3565
3569
|
padding-top: 8px;
|
|
3566
3570
|
color: ${i?h("neutral",500):"inherit"};
|
|
3567
|
-
`),children:o.children}):null]},`${o.label}-${o.value}`);var i,a}))})}),exports.CloseButton=ae,exports.ClusterPoint=({onClick:e,triggerRef:t,showFocusState:n,count:r,mode:i,variant:a="cluster"})=>o.jsx(Rn,{count:r,mode:i,onClick:e,ref:t,showFocusState:n,variant:a}),exports.ExtendableCard=({children:n,header:r,footer:o})=>t.jsx(e.Box,{css:ra,children:t.jsx(e.Accordion.Root,{multiple:!0,children:t.jsxs(e.Accordion.Item,{value:"extendable-card-item",children:[t.jsxs(e.Accordion.ItemTrigger,{css:oa,alignItems:"center",children:[t.jsx(e.Flex,{gap:3,flex:"1",overflow:"hidden",alignItems:"center",children:r}),t.jsx(e.Accordion.ItemIndicator,{children:t.jsx($,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),t.jsxs(e.Accordion.ItemContent,{children:[n,o]})]})})}),exports.Footer=({children:e,label:n="© World Resources Institute",fixed:r,filled:o,maxWidth:i})=>{const a=(new Date).getFullYear();return t.jsx("footer",{css:Th(r,o),children:t.jsxs("div",{css:Ph(i),children:[t.jsx("div",{children:t.jsx(D,{height:"32px",width:"91px"})}),t.jsx("div",{css:Mh,children:e}),t.jsx("div",{children:t.jsxs("p",{css:_h,children:[n," ",a]})})]})})},exports.IconButton=ie,exports.InlineMessage=({label:e,caption:n,variant:r,size:o="large",icon:i=t.jsx(k,{height:"16px",width:"16px"}),onActionClick:a,actionLabel:s,isButtonRight:l})=>{let c=If;return"info-grey"===r?c=Vf:"success"===r?c=Nf:"warning"===r?c=Af:"error"===r&&(c=zf),t.jsxs("div",{css:[Pf(o,l),c],"aria-roledescription":"Note",children:[t.jsxs("div",{children:[t.jsxs("div",{css:Mf,children:[i,t.jsx("p",{css:_f(o),children:e})]}),t.jsx("p",{css:Df(o),children:n})]}),s?t.jsx(b,{label:s,variant:"info-white"===r||"info-grey"===r?"primary":"secondary",size:"large"===o?"default":"small",onClick:a}):null]})},exports.InputWithUnits=({label:r,caption:o,errorMessage:i,units:a,unitsPosition:s="end",defaultUnit:l="",defaultValue:c="",onChange:u,required:d,disabled:p})=>{const[h,f]=n.useState(c),[x,g]=n.useState(l?[l]:[a[0].value]),v=(e,t)=>{u&&u("end"===s?""+(t?`${h} ${e}`:`${e} ${x}`):""+(t?`${e} ${h}`:`${x} ${e}`))};return t.jsxs("div",{css:ct,children:[i?t.jsx("div",{css:pt}):null,t.jsxs("div",{style:{marginLeft:i?"19px":"0px"},children:[t.jsxs("p",{css:ut(p),"aria-label":r,children:[d?t.jsx("span",{children:"*"}):null,r]}),t.jsx("p",{css:dt(p),"aria-label":o,children:o}),i?t.jsx("p",{css:ht,"aria-label":i,children:i}):null,t.jsxs(e.Group,{css:ft(!!i,s),attached:!0,children:["start"===s?t.jsx(qt,{placeholder:"",value:x,items:a,disabled:p,onChange:e=>{g(e),v(e?.[0],!0)}}):null,t.jsx(wt,{type:"number",value:h,disabled:p,onChange:e=>{f(e.target.value),v(e.target.value)}}),"end"===s?t.jsx(qt,{placeholder:"",value:x,items:a,disabled:p,onChange:e=>{g(e),v(e?.[0],!0)}}):null]})]})]})},exports.ItemCount=Mi,exports.LayerGroup=({label:r,caption:o,value:i,layerItems:a,onChangeForRadioVariant:s})=>{const[l,c]=n.useState({}),[u]=n.useState((e=>{const t=e.find((e=>"radio"===e.variant&&e.isDefaultSelected));return t?.name})(a));n.useEffect((()=>{let e={...l};a.forEach((t=>{t.isDefaultSelected&&(e={...e,["radio"===t.variant?r:t.name]:t.isDefaultSelected})})),c(e)}),[]);const d=(e,t,n,r)=>{const o={...l,[e]:t};c(o),n&&n(e,t,r)},p=Object.values(l).filter((e=>!0===e)).length,h=`${r}, ${p} Active layers on the map${o?`, ${o}`:""}`;return t.jsxs(e.Accordion.Item,{value:i,width:"100%",children:[t.jsxs(e.Accordion.ItemTrigger,{css:Go,alignItems:"flex-start","aria-label":h,children:[t.jsxs(e.Box,{width:"full",display:"flex",flexDirection:"column",alignItems:"flex-start",children:[t.jsxs("span",{css:qo,children:[r,t.jsx(Zt,{label:`${p} Active`,size:"small",variant:p>0?"success":"info-grey"})]}),t.jsx("div",{css:Uo,children:o})]}),t.jsx(e.Accordion.ItemIndicator,{display:"flex",children:t.jsx($,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),t.jsx(e.Accordion.ItemContent,{paddingLeft:"16px",paddingRight:"16px",children:t.jsx(We,{name:r,defaultValue:u,customGap:"0px",onChange:(e,t)=>d(e,!!t,s,t),children:a.map((e=>t.jsx(ei,{...e,onChange:(t,n)=>d(t,n,e.onChange)},e.label)))})})]})},exports.LayerGroupContainer=({children:n,defaultValue:r,...o})=>t.jsx("div",{css:Wo,style:{width:"100%"},children:t.jsx(e.Accordion.Root,{css:{},defaultValue:r,multiple:!0,...o,children:n})}),exports.LayerItem=ei,exports.LayerParameters=({label:r,children:o,openedByDefault:i})=>t.jsx("div",{children:t.jsx(e.Accordion.Root,{defaultValue:i?[r]:[],multiple:!0,children:t.jsxs(e.Accordion.Item,{css:ti,value:r,children:[t.jsxs(e.Accordion.ItemTrigger,{css:ni,children:[t.jsx(e.Box,{width:"full",display:"flex",flexDirection:"column",alignItems:"flex-start",children:t.jsx("p",{css:ri,children:r})}),t.jsx(e.Accordion.ItemIndicator,{display:"flex",children:t.jsx($,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),t.jsx(e.Accordion.ItemContent,{css:oi,children:n.Children.map(o,(e=>t.jsx("div",{className:"ds-layer-parameters-item-child",children:e})))})]})})}),exports.LegendItem=({layerName:e,dataUnit:n,onDrag:r,onUpClick:o,onDownClick:i,onRemoveClick:a,children:s,onInfoClick:l,onOpacityChanged:c})=>t.jsxs("div",{css:ii,children:[t.jsxs("div",{css:ai,children:[t.jsx(ie,{icon:t.jsx(T,{}),"aria-label":"Drag and drop","aria-hidden":!0,onClick:r,style:{display:"none",marginBottom:"12px"}}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[t.jsx(ie,{icon:t.jsx($,{rotate:"180"}),"aria-label":"Up",onClick:o}),t.jsx(ie,{icon:t.jsx($,{}),"aria-label":"Down",onClick:i})]})]}),t.jsxs("div",{style:{width:"100%"},children:[t.jsxs("div",{css:si,children:[t.jsxs("div",{children:[t.jsx("h3",{css:li,children:e}),t.jsx("p",{css:ci,children:n})]}),t.jsx(b,{label:"Remove",size:"small",variant:"secondary",rightIcon:t.jsx(E,{}),onClick:a})]}),s,t.jsxs("div",{css:ui,children:[t.jsx(b,{label:"About data",size:"small",variant:"secondary",leftIcon:t.jsx(k,{}),onClick:l}),t.jsx(xi,{defaultValue:80,onOpacityChanged:c})]})]})]}),exports.List=({items:n,noBorder:r})=>t.jsx(e.Box,{css:_i(r),children:n.map((e=>t.jsx(Bi,{id:e.id,icon:e.icon,label:e.label,caption:e.caption,value:e.value,variant:e.variant??"data",onItemClick:e.onItemClick},e.id??e.label)))}),exports.MapControlsToolbar=({onZoomInClick:e,onZoomOutClick:t,onExpandClick:n,onShareClick:r,onPrintClick:i,onSettingsClick:a,onQuestionClick:s,vertical:l,expanded:c,showExpandedToggle:u,ariaLabel:d})=>{const p=[{icon:o.jsx(V,{}),label:"Zoom in",ariaLabel:"zoom in",onClick:e},{icon:o.jsx(N,{}),label:"Zoom out",ariaLabel:"zoom out",onClick:t,gap:!0},{icon:o.jsx(A,{}),label:"Expand",ariaLabel:"expand",onClick:n,gap:!0},{icon:o.jsx(z,{}),label:"Share",ariaLabel:"share",onClick:r,gap:!0},{icon:o.jsx(B,{}),label:"Print",ariaLabel:"print",onClick:i,gap:!0},{icon:o.jsx(H,{}),label:"Settings",ariaLabel:"settings",onClick:a,gap:!0},{icon:o.jsx(F,{}),label:"Help",ariaLabel:"question",onClick:s}];return o.jsx(he,{items:p,vertical:l,expanded:c,showExpandedToggle:u,ariaLabel:d||"Map controls toolbar"})},exports.MapMarker=Rn,exports.MapMarkers=On,exports.MapPopUp=({open:e,onOpenChange:r,anchorRef:o,header:i,content:a,footer:s,placement:c="bottom",offset:u=30,closeOnEscape:d=!0,closeOnOutsideClick:p=!1})=>{const h=n.useRef(null),{refs:f,floatingStyles:x,context:g,middlewareData:v,placement:m}=Io({open:e,onOpenChange:r,placement:c,whileElementsMounted:ro,middleware:[go(u),(b={fallbackAxisSideDirection:"start"},{...ao(b),options:[b,y]}),vo({padding:8}),mo({element:h})]});var b,y;n.useEffect((()=>{o?.current&&f.setReference(o.current)}),[o,f]);const w=function(e,t){void 0===t&&(t={});const{open:n,onOpenChange:r,elements:o,dataRef:i}=e,{enabled:a=!0,escapeKey:s=!0,outsidePress:c=!0,outsidePressEvent:u="pointerdown",referencePress:d=!1,referencePressEvent:p="pointerdown",ancestorScroll:h=!1,bubbles:f,capture:x}=t,g=To(),v=Ir("function"==typeof c?c:()=>!1),m="function"==typeof c?v:c,b=l.useRef(!1),{escapeKey:y,outsidePress:w}=_o(f),{escapeKey:C,outsidePress:j}=_o(x),k=l.useRef(!1),$=Ir((e=>{var t;if(!n||!a||!s||"Escape"!==e.key)return;if(k.current)return;const o=null==(t=i.current.floatingContext)?void 0:t.nodeId,l=g?Mr(g.nodesRef.current,o):[];if(!y&&(e.stopPropagation(),l.length>0)){let e=!0;if(l.forEach((t=>{var n;null==(n=t.context)||!n.open||t.context.dataRef.current.__escapeKeyBubbles||(e=!1)})),!e)return}r(!1,function(e){return"nativeEvent"in e}(e)?e.nativeEvent:e,"escape-key")})),S=Ir((e=>{var t;const n=()=>{var t;$(e),null==(t=Lr(e))||t.removeEventListener("keydown",n)};null==(t=Lr(e))||t.addEventListener("keydown",n)})),E=Ir((e=>{var t;const n=i.current.insideReactTree;i.current.insideReactTree=!1;const a=b.current;if(b.current=!1,"click"===u&&a)return;if(n)return;if("function"==typeof m&&!m(e))return;const s=Lr(e),l="[data-floating-ui-inert]",c=Pr(o.floating).querySelectorAll(l);let d=Dn(s)?s:null;for(;d&&!Yn(d);){const e=Qn(d);if(Yn(e)||!Dn(e))break;d=e}if(c.length&&Dn(s)&&!s.matches("html,body")&&!Or(s,o.floating)&&Array.from(c).every((e=>!Or(d,e))))return;if(In(s)&&L){const t=Yn(s),n=Kn(s),r=/auto|scroll/,o=t||r.test(n.overflowX),i=t||r.test(n.overflowY),a=o&&s.clientWidth>0&&s.scrollWidth>s.clientWidth,l=i&&s.clientHeight>0&&s.scrollHeight>s.clientHeight,c="rtl"===n.direction,u=l&&(c?e.offsetX<=s.offsetWidth-s.clientWidth:e.offsetX>s.clientWidth),d=a&&e.offsetY>s.clientHeight;if(u||d)return}const p=null==(t=i.current.floatingContext)?void 0:t.nodeId,h=g&&Mr(g.nodesRef.current,p).some((t=>{var n;return Tr(e,null==(n=t.context)?void 0:n.elements.floating)}));if(Tr(e,o.floating)||Tr(e,o.domReference)||h)return;const f=g?Mr(g.nodesRef.current,p):[];if(f.length>0){let e=!0;if(f.forEach((t=>{var n;null==(n=t.context)||!n.open||t.context.dataRef.current.__outsidePressBubbles||(e=!1)})),!e)return}r(!1,e,"outside-press")})),R=Ir((e=>{var t;const n=()=>{var t;E(e),null==(t=Lr(e))||t.removeEventListener(u,n)};null==(t=Lr(e))||t.addEventListener(u,n)}));l.useEffect((()=>{if(!n||!a)return;i.current.__escapeKeyBubbles=y,i.current.__outsidePressBubbles=w;let e=-1;function t(e){r(!1,e,"ancestor-scroll")}function l(){window.clearTimeout(e),k.current=!0}function c(){e=window.setTimeout((()=>{k.current=!1}),Un()?5:0)}const d=Pr(o.floating);s&&(d.addEventListener("keydown",C?S:$,C),d.addEventListener("compositionstart",l),d.addEventListener("compositionend",c)),m&&d.addEventListener(u,j?R:E,j);let p=[];return h&&(Dn(o.domReference)&&(p=tr(o.domReference)),Dn(o.floating)&&(p=p.concat(tr(o.floating))),!Dn(o.reference)&&o.reference&&o.reference.contextElement&&(p=p.concat(tr(o.reference.contextElement)))),p=p.filter((e=>{var t;return e!==(null==(t=d.defaultView)?void 0:t.visualViewport)})),p.forEach((e=>{e.addEventListener("scroll",t,{passive:!0})})),()=>{s&&(d.removeEventListener("keydown",C?S:$,C),d.removeEventListener("compositionstart",l),d.removeEventListener("compositionend",c)),m&&d.removeEventListener(u,j?R:E,j),p.forEach((e=>{e.removeEventListener("scroll",t)})),window.clearTimeout(e)}}),[i,o,s,m,u,n,r,h,a,y,w,$,C,S,E,j,R]),l.useEffect((()=>{i.current.insideReactTree=!1}),[i,m,u]);const O=l.useMemo((()=>({onKeyDown:$,...d&&{[Po[p]]:e=>{r(!1,e.nativeEvent,"reference-press")},..."click"!==p&&{onClick(e){r(!1,e.nativeEvent,"reference-press")}}}})),[$,r,d,p]),L=l.useMemo((()=>({onKeyDown:$,onMouseDown(){b.current=!0},onMouseUp(){b.current=!0},[Mo[u]]:()=>{i.current.insideReactTree=!0}})),[$,u,i]);return l.useMemo((()=>a?{reference:O,floating:L}:{}),[a,O,L])}(g,{escapeKey:d,outsidePress:p}),C=Ao(g,{role:"dialog"}),{getFloatingProps:j}=function(e){void 0===e&&(e=[]);const t=e.map((e=>null==e?void 0:e.reference)),n=e.map((e=>null==e?void 0:e.floating)),r=e.map((e=>null==e?void 0:e.item)),o=l.useCallback((t=>Vo(t,e,"reference")),t),i=l.useCallback((t=>Vo(t,e,"floating")),n),a=l.useCallback((t=>Vo(t,e,"item")),r);return l.useMemo((()=>({getReferenceProps:o,getFloatingProps:i,getItemProps:a})),[o,i,a])}([w,C]),{x:k,y:$}=v.arrow??{x:null,y:null},S={top:"bottom",right:"left",bottom:"top",left:"right"}[m.split("-")[0]];if(!e)return null;let E=u-1,R=4;return"left"!==S&&"right"!==S||(E=4,R=u-1),t.jsxs(t.Fragment,{children:[t.jsxs("div",{ref:f.setFloating,style:x,"aria-modal":!0,...j(),css:zo,children:[t.jsxs("div",{css:Bo,children:[i,t.jsx(ae,{onClick:()=>r(!1),className:"ds-map-pop-up-close-button","aria-label":"Close"})]}),t.jsx("div",{css:Ho,children:a}),s?t.jsx("div",{css:Fo,children:s}):null,t.jsx("div",{ref:h,css:Zo(E,R,k,$,S,u)})]}),t.jsx("div",{className:"fixed inset-0 z-[999] bg-black/20 backdrop-blur-[1px]",onClick:()=>p&&r(!1)})]})},exports.Menu=we,exports.MobileTabBar=({defaultValue:r,tabs:o,onTabClick:i,hideLabels:a,activationMode:s="manual"})=>{const l=o.length,[c,u]=n.useState((()=>Ah(o,r)));return t.jsx("div",{css:Dh,children:t.jsx(e.Tabs.Root,{width:"full",defaultValue:r||o?.[0]?.value,onValueChange:({value:e})=>(e=>{const t=Ah(o,e);u(t),i&&i(e)})(e),activationMode:s,children:t.jsx(e.Tabs.List,{alignItems:"center",border:"none",children:o.map(((n,r)=>{const{label:o,icon:i,bagdeCount:s,"aria-label":u,"aria-describedby":d,disabled:p,...h}=n,f=`${n.value}-str-status`,x=[`tab ${r+1} of ${l}`,c===r?"selected":"not selected"];p&&x.push("disabled");const g=[d,f].filter(Boolean).join(" ")||void 0;return t.jsxs(e.Tabs.Trigger,{css:Ih,"aria-label":u||o,"aria-disabled":!!p||void 0,"aria-describedby":g,disabled:p,...h,children:[t.jsxs("div",{css:Vh,children:[i,s?t.jsx("div",{css:Nh,className:"ds-badge-count",children:s}):null]}),a?null:t.jsx("p",{children:o}),t.jsx(e.VisuallyHidden,{id:f,children:x.join(", ")})]},n.value)}))})})})},exports.Modal=({header:n,content:r,footer:o,size:i="medium",draggable:a,blocking:s,open:l,onClose:c})=>l?t.jsx(e.Dialog.Root,{open:l,onOpenChange:c,placement:"center",scrollBehavior:"inside",closeOnInteractOutside:!a&&!s,preventScroll:!a&&!s,closeOnEscape:!s,defaultOpen:!0,children:t.jsxs(e.Portal,{children:[a?null:t.jsx(e.Dialog.Backdrop,{}),t.jsx(as,{disabled:!a,children:t.jsx(e.Dialog.Positioner,{children:t.jsxs(e.Dialog.Content,{css:ss(i),children:[t.jsxs(e.Dialog.Header,{css:ls,children:[n,s?null:t.jsx(e.Dialog.CloseTrigger,{css:cs,asChild:!0,children:t.jsx(ae,{})})]}),t.jsx(e.Dialog.Body,{css:us,children:r}),o?t.jsx(e.Dialog.Footer,{padding:"12px",children:o}):null]})})})]})}):null,exports.MultiActionButton=({variant:r="primary",size:o="default",mainActionLabel:i,mainActionOnClick:a=()=>{},otherActions:s=[],disabled:l,...c})=>{const[u,d]=n.useState(!1),p=l?`${i} action button with menu, disabled`:void 0;return t.jsxs(e.Group,{css:$e,attached:!0,tabIndex:l?0:void 0,"aria-disabled":l,"aria-label":p,role:"group",children:[t.jsx(b,{css:{},label:i,variant:r,size:o,onClick:a,disabled:l,...c}),t.jsxs(e.Menu.Root,{onOpenChange:({open:e})=>d(e),positioning:{placement:"bottom-end"},children:[t.jsx(e.Menu.Trigger,{css:je(r),"data-group-item":!0,"data-last":!0,asChild:!0,children:t.jsx(b,{variant:r,size:o,leftIcon:t.jsx($,{rotate:u?"180":"0",color:h("accessible","text-on-primary-mids")||h("primary",900)}),disabled:l})}),t.jsx(Se,{children:s.map((({label:n,value:r,onClick:i})=>t.jsx(e.Menu.Item,{css:ke(o),onClick:i,value:r,children:n},r)))})]})]})},exports.Navbar=({logo:e,linkRouter:o,pathname:i,navigationSection:a,utilitySection:s,actionsSection:l,maxWidth:c,fixed:u,onNavbarHeightChange:d})=>{const p=n.useRef(null),f=n.useRef(null),x=n.useRef(null),[g,v]=n.useState(!1),[m,y]=n.useState(-1),[w,C]=n.useState("undefined"!=typeof window&&window?.innerWidth<=lf),[j,k]=n.useState(!1),$=o,S=n.useCallback((()=>{if(f.current&&p.current&&x.current){const e=p.current.getBoundingClientRect(),t=f.current.getBoundingClientRect(),n=x.current.getBoundingClientRect();t.width,e.width,window.innerWidth<=lf||window.innerWidth<=m?(d?.(96),v(!0)):window.innerWidth>lf&&window.innerWidth<=1440?e.right>=t.left?(d?.(96),v(!0),y(window.innerWidth)):window.innerWidth>m&&(d?.(48),v(!1),y(-1)):(d?.(48),v(!1),y(-1)),g&&(window.innerWidth<=lf||n.right>=t.left?(C(!0),d?.(48)):(C(!1),d?.(96)))}}),[m,g]);return n.useEffect((()=>(S(),window.addEventListener("resize",S),()=>{window.removeEventListener("resize",S)})),[S]),t.jsxs("nav",{css:zh(g&&!w,u),children:[t.jsxs("div",{css:Hh(g&&!w,c),children:[t.jsxs("div",{css:(R=g&&!w,r.css`
|
|
3571
|
+
`),children:o.children}):null]},`${o.label}-${o.value}`);var i,a}))})}),exports.CloseButton=ae,exports.ClusterPoint=({onClick:e,triggerRef:t,showFocusState:n,count:r,mode:i,variant:a="cluster"})=>o.jsx(Rn,{count:r,mode:i,onClick:e,ref:t,showFocusState:n,variant:a}),exports.ExtendableCard=({children:n,header:r,footer:o})=>t.jsx(e.Box,{css:ra,children:t.jsx(e.Accordion.Root,{multiple:!0,children:t.jsxs(e.Accordion.Item,{value:"extendable-card-item",children:[t.jsxs(e.Accordion.ItemTrigger,{css:oa,alignItems:"center",children:[t.jsx(e.Flex,{gap:3,flex:"1",overflow:"hidden",alignItems:"center",children:r}),t.jsx(e.Accordion.ItemIndicator,{children:t.jsx($,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),t.jsxs(e.Accordion.ItemContent,{children:[n,o]})]})})}),exports.Footer=({children:e,label:n="© World Resources Institute",fixed:r,filled:o,maxWidth:i})=>{const a=(new Date).getFullYear();return t.jsx("footer",{css:Th(r,o),children:t.jsxs("div",{css:Ph(i),children:[t.jsx("div",{children:t.jsx(D,{height:"32px",width:"91px"})}),t.jsx("div",{css:Mh,children:e}),t.jsx("div",{children:t.jsxs("p",{css:_h,children:[n," ",a]})})]})})},exports.IconButton=ie,exports.InlineMessage=({label:e,caption:n,variant:r,size:o="large",icon:i=t.jsx(k,{height:"16px",width:"16px"}),onActionClick:a,actionLabel:s,isButtonRight:l})=>{let c=If;return"info-grey"===r?c=Vf:"success"===r?c=Nf:"warning"===r?c=Af:"error"===r&&(c=zf),t.jsxs("div",{css:[Pf(o,l),c],"aria-roledescription":"Note",children:[t.jsxs("div",{children:[t.jsxs("div",{css:Mf,children:[i,t.jsx("p",{css:_f(o),children:e})]}),t.jsx("p",{css:Df(o),children:n})]}),s?t.jsx(b,{label:s,variant:"info-white"===r||"info-grey"===r?"primary":"secondary",size:"large"===o?"default":"small",onClick:a}):null]})},exports.InputWithUnits=({label:r,caption:o,errorMessage:i,units:a,unitsPosition:s="end",defaultUnit:l="",defaultValue:c="",onChange:u,required:d,disabled:p})=>{const[h,f]=n.useState(c),[x,g]=n.useState(l?[l]:[a[0].value]),v=(e,t)=>{u&&u("end"===s?""+(t?`${h} ${e}`:`${e} ${x}`):""+(t?`${e} ${h}`:`${x} ${e}`))};return t.jsxs("div",{css:ct,children:[i?t.jsx("div",{css:pt}):null,t.jsxs("div",{style:{marginLeft:i?"19px":"0px"},children:[t.jsxs("p",{css:ut(p),"aria-label":r,children:[d?t.jsx("span",{children:"*"}):null,r]}),t.jsx("p",{css:dt(p),"aria-label":o,children:o}),i?t.jsx("p",{css:ht,"aria-label":i,children:i}):null,t.jsxs(e.Group,{css:ft(!!i,s),attached:!0,children:["start"===s?t.jsx(qt,{placeholder:"",value:x,items:a,disabled:p,onChange:e=>{g(e),v(e?.[0],!0)}}):null,t.jsx(wt,{type:"number",value:h,disabled:p,onChange:e=>{f(e.target.value),v(e.target.value)}}),"end"===s?t.jsx(qt,{placeholder:"",value:x,items:a,disabled:p,onChange:e=>{g(e),v(e?.[0],!0)}}):null]})]})]})},exports.ItemCount=Mi,exports.LayerGroup=({label:r,caption:o,value:i,layerItems:a,onChangeForRadioVariant:s})=>{const[l,c]=n.useState({}),[u]=n.useState((e=>{const t=e.find((e=>"radio"===e.variant&&e.isDefaultSelected));return t?.name})(a));n.useEffect((()=>{let e={...l};a.forEach((t=>{t.isDefaultSelected&&(e={...e,["radio"===t.variant?r:t.name]:t.isDefaultSelected})})),c(e)}),[]);const d=(e,t,n,r)=>{const o={...l,[e]:t};c(o),n&&n(e,t,r)},p=Object.values(l).filter((e=>!0===e)).length,h=`${r}, ${p} Active layers on the map${o?`, ${o}`:""}`;return t.jsxs(e.Accordion.Item,{value:i,width:"100%",children:[t.jsxs(e.Accordion.ItemTrigger,{css:Go,alignItems:"flex-start","aria-label":h,children:[t.jsxs(e.Box,{width:"full",display:"flex",flexDirection:"column",alignItems:"flex-start",children:[t.jsxs("span",{css:qo,children:[r,t.jsx(Zt,{label:`${p} Active`,size:"small",variant:p>0?"success":"info-grey"})]}),t.jsx("div",{css:Uo,children:o})]}),t.jsx(e.Accordion.ItemIndicator,{display:"flex",children:t.jsx($,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),t.jsx(e.Accordion.ItemContent,{paddingLeft:"16px",paddingRight:"16px",children:t.jsx(We,{name:r,defaultValue:u,customGap:"0px",onChange:(e,t)=>d(e,!!t,s,t),children:a.map((e=>t.jsx(ei,{...e,onChange:(t,n)=>d(t,n,e.onChange)},e.label)))})})]})},exports.LayerGroupContainer=({children:n,defaultValue:r,...o})=>t.jsx("div",{css:Wo,style:{width:"100%"},children:t.jsx(e.Accordion.Root,{css:{},defaultValue:r,multiple:!0,...o,children:n})}),exports.LayerItem=ei,exports.LayerParameters=({label:r,children:o,openedByDefault:i})=>t.jsx("div",{children:t.jsx(e.Accordion.Root,{defaultValue:i?[r]:[],multiple:!0,children:t.jsxs(e.Accordion.Item,{css:ti,value:r,children:[t.jsxs(e.Accordion.ItemTrigger,{css:ni,children:[t.jsx(e.Box,{width:"full",display:"flex",flexDirection:"column",alignItems:"flex-start",children:t.jsx("p",{css:ri,children:r})}),t.jsx(e.Accordion.ItemIndicator,{display:"flex",children:t.jsx($,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),t.jsx(e.Accordion.ItemContent,{css:oi,children:n.Children.map(o,(e=>t.jsx("div",{className:"ds-layer-parameters-item-child",children:e})))})]})})}),exports.LegendItem=({layerName:e,dataUnit:n,onDrag:r,onUpClick:o,onDownClick:i,onRemoveClick:a,children:s,onInfoClick:l,onOpacityChanged:c})=>t.jsxs("div",{css:ii,children:[t.jsxs("div",{css:ai,children:[t.jsx(ie,{icon:t.jsx(T,{}),"aria-label":"Drag and drop","aria-hidden":!0,onClick:r,style:{display:"none",marginBottom:"12px"}}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[t.jsx(ie,{icon:t.jsx($,{rotate:"180"}),"aria-label":"Up",onClick:o}),t.jsx(ie,{icon:t.jsx($,{}),"aria-label":"Down",onClick:i})]})]}),t.jsxs("div",{style:{width:"100%"},children:[t.jsxs("div",{css:si,children:[t.jsxs("div",{children:[t.jsx("h3",{css:li,children:e}),t.jsx("p",{css:ci,children:n})]}),t.jsx(b,{label:"Remove",size:"small",variant:"secondary",rightIcon:t.jsx(E,{}),onClick:a})]}),s,t.jsxs("div",{css:ui,children:[t.jsx(b,{label:"About data",size:"small",variant:"secondary",leftIcon:t.jsx(k,{}),onClick:l}),t.jsx(xi,{defaultValue:80,onOpacityChanged:c})]})]})]}),exports.List=({items:n,noBorder:r})=>t.jsx(e.Box,{css:_i(r),children:n.map((e=>t.jsx(Bi,{id:e.id,icon:e.icon,label:e.label,caption:e.caption,value:e.value,variant:e.variant??"data",onItemClick:e.onItemClick},e.id??e.label)))}),exports.MapControlsToolbar=({onZoomInClick:e,onZoomOutClick:t,onExpandClick:n,onShareClick:r,onPrintClick:i,onSettingsClick:a,onQuestionClick:s,vertical:l,expanded:c,showExpandedToggle:u,ariaLabel:d})=>{const p=[{icon:o.jsx(V,{}),label:"Zoom in",ariaLabel:"zoom in",onClick:e},{icon:o.jsx(N,{}),label:"Zoom out",ariaLabel:"zoom out",onClick:t,gap:!0},{icon:o.jsx(A,{}),label:"Expand",ariaLabel:"expand",onClick:n,gap:!0},{icon:o.jsx(z,{}),label:"Share",ariaLabel:"share",onClick:r,gap:!0},{icon:o.jsx(B,{}),label:"Print",ariaLabel:"print",onClick:i,gap:!0},{icon:o.jsx(H,{}),label:"Settings",ariaLabel:"settings",onClick:a,gap:!0},{icon:o.jsx(F,{}),label:"Help",ariaLabel:"question",onClick:s}];return o.jsx(he,{items:p,vertical:l,expanded:c,showExpandedToggle:u,ariaLabel:d||"Map controls toolbar"})},exports.MapMarker=Rn,exports.MapMarkers=On,exports.MapPopUp=({open:e,onOpenChange:r,anchorRef:o,header:i,content:a,footer:s,placement:c="bottom",offset:u=30,closeOnEscape:d=!0,closeOnOutsideClick:p=!1})=>{const h=n.useRef(null),{refs:f,floatingStyles:x,context:g,middlewareData:v,placement:m}=Io({open:e,onOpenChange:r,placement:c,whileElementsMounted:ro,middleware:[go(u),(b={fallbackAxisSideDirection:"start"},{...ao(b),options:[b,y]}),vo({padding:8}),mo({element:h})]});var b,y;n.useEffect((()=>{o?.current&&f.setReference(o.current)}),[o,f]);const w=function(e,t){void 0===t&&(t={});const{open:n,onOpenChange:r,elements:o,dataRef:i}=e,{enabled:a=!0,escapeKey:s=!0,outsidePress:c=!0,outsidePressEvent:u="pointerdown",referencePress:d=!1,referencePressEvent:p="pointerdown",ancestorScroll:h=!1,bubbles:f,capture:x}=t,g=To(),v=Ir("function"==typeof c?c:()=>!1),m="function"==typeof c?v:c,b=l.useRef(!1),{escapeKey:y,outsidePress:w}=_o(f),{escapeKey:C,outsidePress:j}=_o(x),k=l.useRef(!1),$=Ir((e=>{var t;if(!n||!a||!s||"Escape"!==e.key)return;if(k.current)return;const o=null==(t=i.current.floatingContext)?void 0:t.nodeId,l=g?Mr(g.nodesRef.current,o):[];if(!y&&(e.stopPropagation(),l.length>0)){let e=!0;if(l.forEach((t=>{var n;null==(n=t.context)||!n.open||t.context.dataRef.current.__escapeKeyBubbles||(e=!1)})),!e)return}r(!1,function(e){return"nativeEvent"in e}(e)?e.nativeEvent:e,"escape-key")})),S=Ir((e=>{var t;const n=()=>{var t;$(e),null==(t=Lr(e))||t.removeEventListener("keydown",n)};null==(t=Lr(e))||t.addEventListener("keydown",n)})),E=Ir((e=>{var t;const n=i.current.insideReactTree;i.current.insideReactTree=!1;const a=b.current;if(b.current=!1,"click"===u&&a)return;if(n)return;if("function"==typeof m&&!m(e))return;const s=Lr(e),l="[data-floating-ui-inert]",c=Pr(o.floating).querySelectorAll(l);let d=Dn(s)?s:null;for(;d&&!Yn(d);){const e=Qn(d);if(Yn(e)||!Dn(e))break;d=e}if(c.length&&Dn(s)&&!s.matches("html,body")&&!Or(s,o.floating)&&Array.from(c).every((e=>!Or(d,e))))return;if(In(s)&&L){const t=Yn(s),n=Kn(s),r=/auto|scroll/,o=t||r.test(n.overflowX),i=t||r.test(n.overflowY),a=o&&s.clientWidth>0&&s.scrollWidth>s.clientWidth,l=i&&s.clientHeight>0&&s.scrollHeight>s.clientHeight,c="rtl"===n.direction,u=l&&(c?e.offsetX<=s.offsetWidth-s.clientWidth:e.offsetX>s.clientWidth),d=a&&e.offsetY>s.clientHeight;if(u||d)return}const p=null==(t=i.current.floatingContext)?void 0:t.nodeId,h=g&&Mr(g.nodesRef.current,p).some((t=>{var n;return Tr(e,null==(n=t.context)?void 0:n.elements.floating)}));if(Tr(e,o.floating)||Tr(e,o.domReference)||h)return;const f=g?Mr(g.nodesRef.current,p):[];if(f.length>0){let e=!0;if(f.forEach((t=>{var n;null==(n=t.context)||!n.open||t.context.dataRef.current.__outsidePressBubbles||(e=!1)})),!e)return}r(!1,e,"outside-press")})),R=Ir((e=>{var t;const n=()=>{var t;E(e),null==(t=Lr(e))||t.removeEventListener(u,n)};null==(t=Lr(e))||t.addEventListener(u,n)}));l.useEffect((()=>{if(!n||!a)return;i.current.__escapeKeyBubbles=y,i.current.__outsidePressBubbles=w;let e=-1;function t(e){r(!1,e,"ancestor-scroll")}function l(){window.clearTimeout(e),k.current=!0}function c(){e=window.setTimeout((()=>{k.current=!1}),Un()?5:0)}const d=Pr(o.floating);s&&(d.addEventListener("keydown",C?S:$,C),d.addEventListener("compositionstart",l),d.addEventListener("compositionend",c)),m&&d.addEventListener(u,j?R:E,j);let p=[];return h&&(Dn(o.domReference)&&(p=tr(o.domReference)),Dn(o.floating)&&(p=p.concat(tr(o.floating))),!Dn(o.reference)&&o.reference&&o.reference.contextElement&&(p=p.concat(tr(o.reference.contextElement)))),p=p.filter((e=>{var t;return e!==(null==(t=d.defaultView)?void 0:t.visualViewport)})),p.forEach((e=>{e.addEventListener("scroll",t,{passive:!0})})),()=>{s&&(d.removeEventListener("keydown",C?S:$,C),d.removeEventListener("compositionstart",l),d.removeEventListener("compositionend",c)),m&&d.removeEventListener(u,j?R:E,j),p.forEach((e=>{e.removeEventListener("scroll",t)})),window.clearTimeout(e)}}),[i,o,s,m,u,n,r,h,a,y,w,$,C,S,E,j,R]),l.useEffect((()=>{i.current.insideReactTree=!1}),[i,m,u]);const O=l.useMemo((()=>({onKeyDown:$,...d&&{[Po[p]]:e=>{r(!1,e.nativeEvent,"reference-press")},..."click"!==p&&{onClick(e){r(!1,e.nativeEvent,"reference-press")}}}})),[$,r,d,p]),L=l.useMemo((()=>({onKeyDown:$,onMouseDown(){b.current=!0},onMouseUp(){b.current=!0},[Mo[u]]:()=>{i.current.insideReactTree=!0}})),[$,u,i]);return l.useMemo((()=>a?{reference:O,floating:L}:{}),[a,O,L])}(g,{escapeKey:d,outsidePress:p}),C=Ao(g,{role:"dialog"}),{getFloatingProps:j}=function(e){void 0===e&&(e=[]);const t=e.map((e=>null==e?void 0:e.reference)),n=e.map((e=>null==e?void 0:e.floating)),r=e.map((e=>null==e?void 0:e.item)),o=l.useCallback((t=>Vo(t,e,"reference")),t),i=l.useCallback((t=>Vo(t,e,"floating")),n),a=l.useCallback((t=>Vo(t,e,"item")),r);return l.useMemo((()=>({getReferenceProps:o,getFloatingProps:i,getItemProps:a})),[o,i,a])}([w,C]),{x:k,y:$}=v.arrow??{x:null,y:null},S={top:"bottom",right:"left",bottom:"top",left:"right"}[m.split("-")[0]];if(!e)return null;let E=u-1,R=4;return"left"!==S&&"right"!==S||(E=4,R=u-1),t.jsxs(t.Fragment,{children:[t.jsxs("div",{ref:f.setFloating,style:x,"aria-modal":!0,...j(),css:zo,children:[t.jsxs("div",{css:Bo,children:[i,t.jsx(ae,{onClick:()=>r(!1),className:"ds-map-pop-up-close-button","aria-label":"Close"})]}),t.jsx("div",{css:Ho,children:a}),s?t.jsx("div",{css:Fo,children:s}):null,t.jsx("div",{ref:h,css:Zo(E,R,k,$,S,u)})]}),t.jsx("div",{className:"fixed inset-0 z-[999] bg-black/20 backdrop-blur-[1px]",onClick:()=>p&&r(!1)})]})},exports.Menu=we,exports.MobileTabBar=({defaultValue:r,tabs:o,onTabClick:i,hideLabels:a,activationMode:s="manual"})=>{const l=o.length,[c,u]=n.useState((()=>Ah(o,r)));return t.jsx("div",{css:Dh,children:t.jsx(e.Tabs.Root,{width:"full",defaultValue:r||o?.[0]?.value,onValueChange:({value:e})=>(e=>{const t=Ah(o,e);u(t),i&&i(e)})(e),activationMode:s,children:t.jsx(e.Tabs.List,{alignItems:"center",border:"none",children:o.map(((n,r)=>{const{label:o,icon:i,bagdeCount:s,"aria-label":u,"aria-describedby":d,disabled:p,...h}=n,f=`${n.value}-str-status`,x=[`tab ${r+1} of ${l}`,c===r?"selected":"not selected"];p&&x.push("disabled");const g=[d,f].filter(Boolean).join(" ")||void 0;return t.jsxs(e.Tabs.Trigger,{css:Ih,"aria-label":u||o,"aria-disabled":!!p||void 0,"aria-describedby":g,disabled:p,...h,children:[t.jsxs("div",{css:Vh,children:[i,s?t.jsx("div",{css:Nh,className:"ds-badge-count",children:s}):null]}),a?null:t.jsx("p",{children:o}),t.jsx(e.VisuallyHidden,{id:f,children:x.join(", ")})]},n.value)}))})})})},exports.Modal=({header:n,content:r,footer:o,size:i="medium",draggable:a,blocking:s,open:l,onClose:c})=>l?t.jsx(e.Dialog.Root,{open:l,onOpenChange:c,placement:"center",scrollBehavior:"inside",closeOnInteractOutside:!a&&!s,preventScroll:!a&&!s,closeOnEscape:!s,defaultOpen:!0,children:t.jsxs(e.Portal,{children:[a?null:t.jsx(e.Dialog.Backdrop,{}),t.jsx(as,{disabled:!a,children:t.jsx(e.Dialog.Positioner,{children:t.jsxs(e.Dialog.Content,{css:ss(i),children:[t.jsxs(e.Dialog.Header,{css:ls,children:[n,s?null:t.jsx(e.Dialog.CloseTrigger,{css:cs,asChild:!0,children:t.jsx(ae,{})})]}),t.jsx(e.Dialog.Body,{css:us,children:r}),o?t.jsx(e.Dialog.Footer,{padding:"12px",children:o}):null]})})})]})}):null,exports.MultiActionButton=({variant:r="primary",size:o="default",mainActionLabel:i,mainActionOnClick:a=()=>{},otherActions:s=[],disabled:l,...c})=>{const[u,d]=n.useState(!1),p=l?`${i} action button with menu, disabled`:void 0;return t.jsxs(e.Group,{css:$e,attached:!0,tabIndex:l?0:void 0,"aria-disabled":l,"aria-label":p,role:"group",children:[t.jsx(b,{css:{},label:i,variant:r,size:o,onClick:a,disabled:l,...c}),t.jsxs(e.Menu.Root,{onOpenChange:({open:e})=>d(e),positioning:{placement:"bottom-end"},children:[t.jsx(e.Menu.Trigger,{css:je(r),"data-group-item":!0,"data-last":!0,asChild:!0,children:t.jsx(b,{variant:r,size:o,leftIcon:t.jsx($,{rotate:u?"180":"0",color:h("accessible","text-on-primary-mids")||h("primary",900)}),disabled:l})}),t.jsx(Se,{children:s.map((({label:n,value:r,onClick:i})=>t.jsx(e.Menu.Item,{css:ke(o),onClick:i,value:r,children:n},r)))})]})]})},exports.Navbar=({logo:e,linkRouter:o,pathname:i,navigationSection:a,utilitySection:s,actionsSection:l,maxWidth:c,fixed:u,onNavbarHeightChange:d,backgroundColor:p})=>{const f=n.useRef(null),x=n.useRef(null),g=n.useRef(null),[v,m]=n.useState(!1),[y,w]=n.useState(-1),[C,j]=n.useState("undefined"!=typeof window&&window?.innerWidth<=lf),[k,$]=n.useState(!1),S=o,R=n.useCallback((()=>{if(x.current&&f.current&&g.current){const e=f.current.getBoundingClientRect(),t=x.current.getBoundingClientRect(),n=g.current.getBoundingClientRect();t.width,e.width,window.innerWidth<=lf||window.innerWidth<=y?(d?.(96),m(!0)):window.innerWidth>lf&&window.innerWidth<=1440?e.right>=t.left?(d?.(96),m(!0),w(window.innerWidth)):window.innerWidth>y&&(d?.(48),m(!1),w(-1)):(d?.(48),m(!1),w(-1)),v&&(window.innerWidth<=lf||n.right>=t.left?(j(!0),d?.(48)):(j(!1),d?.(96)))}}),[y,v]);return n.useEffect((()=>(R(),window.addEventListener("resize",R),()=>{window.removeEventListener("resize",R)})),[R]),t.jsxs("nav",{css:zh(v&&!C,u,p),children:[t.jsxs("div",{css:Hh(v&&!C,c),children:[t.jsxs("div",{css:(O=v&&!C,r.css`
|
|
3568
3572
|
display: flex;
|
|
3569
3573
|
align-items: center;
|
|
3570
3574
|
justify-content: flex-start;
|
|
3571
3575
|
gap: 12px;
|
|
3572
|
-
color: ${h("neutral",
|
|
3573
|
-
`),ref:
|
|
3576
|
+
color: ${h("neutral",O?100:900)};
|
|
3577
|
+
`),ref:f,children:[e?t.jsx("div",{ref:g,css:Fh,children:e}):null,t.jsx("div",{css:Zh(v),children:a?.map((e=>e.link?t.jsx(S,{to:e.link,href:e.link,css:Wh(i===e.link),children:e.label},e.label):t.jsx(we,{label:e.label,items:e.items||[]},e.label)))})]}),t.jsx("div",{css:Gh,ref:x,children:C?t.jsxs("button",{type:"button",onClick:()=>$(!k),"aria-label":"Open menu",css:Xh,children:[k?"Close":"Menu",k?t.jsx(E,{height:"16px",width:"16px"}):t.jsx(J,{height:"16px",width:"16px"})]}):t.jsxs(t.Fragment,{children:[t.jsx("div",{css:Gh,children:s?.map(((e,n)=>t.jsx("div",{css:qh(v),children:e},n)))}),l?t.jsx("div",{css:Uh(v),children:l.map((e=>t.jsx(b,{...e},e.ariaLabel)))}):null]})})]}),v&&!C?t.jsx("div",{css:Bh,children:a?.map((e=>e.link?t.jsx(S,{to:e.link,href:e.link,css:Wh(i===e.link),children:e.label},e.label):t.jsx(we,{label:e.label,items:e.items||[]},e.label)))}):null,C?t.jsx(sf,{navigationSection:a,utilitySection:s,actionsSection:l,linkRouter:o,isOpen:k,setIsOpen:$,pathname:i}):null]});var O},exports.NavigationRail=({tabs:r=[],defaultValue:o,onTabClick:i,children:a,onOpenChange:s})=>{const[l,c]=n.useState(!1),[u,d]=n.useState(o||r?.[0]?.value),p=e=>{d(e),i&&i(e)},[f]=e.useMediaQuery(["(max-width: 768px)"]);return f?t.jsxs(e.Tabs.Root,{defaultValue:u,onValueChange:({value:e})=>p(e),children:[t.jsx(e.Tabs.List,{style:{display:"flex",overflowX:"auto",whiteSpace:"nowrap",padding:"8px",gap:"8px"},children:r.map((n=>t.jsx(e.Tabs.Trigger,{value:n.value,css:{"--indicator-color":h("primary",500),flexShrink:0,padding:"10px 16px",color:h("neutral",600),"&[data-selected]":{color:h("neutral",800),fontWeight:600}},children:n.label},n.value)))}),r.map((n=>t.jsx(e.Tabs.Content,{value:n.value,children:a},n.value)))]}):t.jsxs("div",{style:{height:"calc(100vh - 48px - 56px)",position:"fixed",top:"48px",left:0,display:"flex"},children:[t.jsxs("div",{css:cf,children:[t.jsx(e.Tabs.Root,{defaultValue:o||r?.[0]?.value,orientation:"horizontal",width:"full",onValueChange:({value:e})=>{p(e)},role:"tablist",children:t.jsx(e.Tabs.List,{alignItems:"center",border:"none",style:{flexDirection:"column"},children:r.map((n=>t.jsx(e.Tabs.Trigger,{css:uf,"aria-label":n["aria-label"]||n.label,...n,children:t.jsxs(e.Box,{display:"flex",alignItems:"center",flexDirection:"column",gap:"5px",className:"ds-tab-label",children:[n.icon?t.jsx("div",{css:df,children:n.icon}):null,t.jsx("p",{children:n.label})]})},n.label)))})}),a?t.jsx(e.Collapsible.Root,{onOpenChange:({open:e})=>{c(e),s&&s(!e)},children:t.jsxs(e.Collapsible.Trigger,{css:pf,children:[t.jsx("div",{css:df,children:l?t.jsx(w,{}):t.jsx(y,{})}),t.jsxs("div",{className:"ds-tab-label",children:[t.jsx("p",{children:l?"Show":"Hide"}),t.jsx("p",{children:"Sidebar"})]})]})}):null]}),a?t.jsx(e.Collapsible.Root,{defaultOpen:!0,open:!l,children:t.jsx(e.Collapsible.Content,{height:"100%",children:t.jsx("div",{css:hf,role:"tabpanel","aria-labelledby":u,children:a})})}):null]})},exports.OptionCard=({defaultValue:n,items:o,onValueChange:i})=>t.jsx(e.RadioCard.Root,{defaultValue:n,onValueChange:i,children:t.jsx(e.HStack,{alignItems:"flex-start",flexWrap:"wrap",gap:"12px",children:o.map((n=>{return t.jsxs(e.RadioCard.Item,{css:De,value:n.value,disabled:n.disabled,children:[t.jsx(e.RadioCard.ItemHiddenInput,{}),t.jsxs(e.RadioCard.ItemControl,{css:Ie,children:[t.jsxs("div",{css:(i=n.variant,r.css`
|
|
3574
3578
|
width: 100%;
|
|
3575
3579
|
display: flex;
|
|
3576
3580
|
flex-direction: ${"centered"===i?"column":"row"};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as _chakra_ui_react from '@chakra-ui/react';
|
|
2
|
-
import { ButtonProps, Checkbox as Checkbox$1, RadioCardRootProps, RadioGroup as RadioGroup$1, Slider as Slider$1, Switch as Switch$1, SelectRootProps, SliderRootProps, TextareaProps as TextareaProps$1, InputProps, Tag as Tag$1, Accordion, Table as Table$1, Tabs } from '@chakra-ui/react';
|
|
2
|
+
import { ButtonProps as ButtonProps$1, Checkbox as Checkbox$1, RadioCardRootProps, RadioGroup as RadioGroup$1, Slider as Slider$1, Switch as Switch$1, SelectRootProps, SliderRootProps, TextareaProps as TextareaProps$1, InputProps, Tag as Tag$1, Accordion, Table as Table$1, Tabs } from '@chakra-ui/react';
|
|
3
3
|
import * as React$1 from 'react';
|
|
4
4
|
import React__default, { ReactElement, Ref } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -34,13 +34,13 @@ declare const SSOButtons: {
|
|
|
34
34
|
Microsoft: ({ ariaLabel, size, onClick, }: GenericSSOButtonsProps) => react_jsx_runtime.JSX.Element;
|
|
35
35
|
};
|
|
36
36
|
|
|
37
|
-
type CloseButtonProps = Omit<ButtonProps, 'size' | 'variant' | 'colorPalette' | 'children' | '_loading'> & {
|
|
37
|
+
type CloseButtonProps = Omit<ButtonProps$1, 'size' | 'variant' | 'colorPalette' | 'children' | '_loading'> & {
|
|
38
38
|
disabled?: boolean;
|
|
39
39
|
};
|
|
40
40
|
|
|
41
41
|
declare const CloseButton: ({ disabled, ...rest }: CloseButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
42
42
|
|
|
43
|
-
type IconButtonProps = Omit<ButtonProps, 'size' | 'variant' | 'colorPalette' | 'children' | '_loading'> & {
|
|
43
|
+
type IconButtonProps = Omit<ButtonProps$1, 'size' | 'variant' | 'colorPalette' | 'children' | '_loading'> & {
|
|
44
44
|
icon: React__default.ReactNode;
|
|
45
45
|
disabled?: boolean;
|
|
46
46
|
};
|
|
@@ -108,7 +108,7 @@ type MenuProps = {
|
|
|
108
108
|
|
|
109
109
|
declare const Menu: ({ label, items, groups, onSelect, customTrigger }: MenuProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
110
110
|
|
|
111
|
-
type MultiActionButtonProps = Omit<ButtonProps, 'size' | 'variant' | 'colorPalette' | 'children'> & {
|
|
111
|
+
type MultiActionButtonProps = Omit<ButtonProps$1, 'size' | 'variant' | 'colorPalette' | 'children'> & {
|
|
112
112
|
variant?: 'primary' | 'secondary';
|
|
113
113
|
size?: 'default' | 'small';
|
|
114
114
|
mainActionLabel: string;
|
|
@@ -727,6 +727,17 @@ type MobileTabBarProps = {
|
|
|
727
727
|
|
|
728
728
|
declare const MobileTabBar: ({ defaultValue, tabs, onTabClick, hideLabels, activationMode, }: MobileTabBarProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
729
729
|
|
|
730
|
+
type ButtonProps = Omit<ButtonProps$1, 'size' | 'variant' | 'colorPalette' | 'children'> & {
|
|
731
|
+
label?: string;
|
|
732
|
+
loading?: boolean;
|
|
733
|
+
variant?: 'primary' | 'secondary' | 'borderless' | 'outline';
|
|
734
|
+
size?: 'default' | 'small';
|
|
735
|
+
disabled?: boolean;
|
|
736
|
+
leftIcon?: React__default.ReactNode;
|
|
737
|
+
rightIcon?: React__default.ReactNode;
|
|
738
|
+
children?: React__default.ReactNode;
|
|
739
|
+
};
|
|
740
|
+
|
|
730
741
|
type NavbarNavigationItemsProps = {
|
|
731
742
|
label: string;
|
|
732
743
|
link?: string;
|
|
@@ -742,15 +753,19 @@ type NavbarProps = {
|
|
|
742
753
|
navigationSection?: NavbarNavigationItemsProps[];
|
|
743
754
|
utilitySection?: React.ReactNode[];
|
|
744
755
|
actionsSection?: {
|
|
745
|
-
|
|
746
|
-
|
|
756
|
+
ariaLabel: ButtonProps['aria-label'];
|
|
757
|
+
children?: ButtonProps['children'];
|
|
758
|
+
variant?: ButtonProps['variant'];
|
|
759
|
+
size?: ButtonProps['size'];
|
|
760
|
+
onClick?: ButtonProps['onClick'];
|
|
747
761
|
}[];
|
|
748
762
|
maxWidth?: number;
|
|
749
763
|
fixed?: boolean;
|
|
750
764
|
onNavbarHeightChange?: (height: number) => void;
|
|
765
|
+
backgroundColor?: string;
|
|
751
766
|
};
|
|
752
767
|
|
|
753
|
-
declare const Navbar: ({ logo, linkRouter, pathname, navigationSection, utilitySection, actionsSection, maxWidth, fixed, onNavbarHeightChange, }: NavbarProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
768
|
+
declare const Navbar: ({ logo, linkRouter, pathname, navigationSection, utilitySection, actionsSection, maxWidth, fixed, onNavbarHeightChange, backgroundColor, }: NavbarProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
754
769
|
|
|
755
770
|
type NavigationRailTabProps = Omit<Tabs.TriggerProps, 'asChild'> & {
|
|
756
771
|
label: string;
|