@worldresources/wri-design-systems 1.0.0 → 1.0.1
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.js +16 -16
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +329 -329
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),l=require("react"),a=require("react-dom/client"),n=require("@chakra-ui/react"),i=require("@emotion/styled");!function(e,l){void 0===l&&(l={});var a=l.insertAt;if("undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===a&&n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n monospace;\n}\n\n*:focus-visible {\n box-shadow: none !important;\n}\n\n.app-container {\n margin-left: 364px;\n transition: margin-left 0.1s;\n padding: 20px;\n}\n\n.app-container.sidebar-closed {\n margin-left: 64px;\n transition: margin-left 0.1s;\n}\n");const r={neutral:{100:{value:"#FFFFFF"},200:{value:"#F6F6F6"},300:{value:"#E7E6E6"},400:{value:"#C9C9C9"},500:{value:"#9B9B9B"},600:{value:"#686767"},700:{value:"#4F4E4E"},800:{value:"#1A1919"},900:{value:"#000000"}},primary:{100:{value:"#FFFBF2"},200:{value:"#FCEFD3"},500:{value:"#F0AB00"},600:{value:"#D49700"},700:{value:"#AD7500"},800:{value:"#5F4205"},900:{value:"#332300"}},secondary:{500:{value:"#3855A3"},600:{value:"#263A71"},700:{value:"#1F2F5C"}},success:{100:{value:"#F3FFF2"},200:{value:"#D3EED1"},300:{value:"#C7E9C0"},500:{value:"#086600"}},warning:{100:{value:"#FEF7E5"},200:{value:"#E3CC8F"},500:{value:"#804600"}},error:{100:{value:"#FFF3F4"},200:{value:"#EDA1A9"},500:{value:"#A80011"}}},o=n.createSystem(n.defaultConfig,{theme:{tokens:{colors:r}}}),t=(e,l)=>o.tokens.getVar(`colors.${e}.${l}`)||r?.[e]?.[l]?.value,s=i.div`
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),l=require("react"),a=require("react-dom/client"),n=require("@chakra-ui/react"),i=require("@emotion/styled");!function(e,l){void 0===l&&(l={});var a=l.insertAt;if("undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===a&&n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n monospace;\n}\n\n*:focus-visible {\n box-shadow: none !important;\n}\n\n/* .app-container {\n margin-left: 364px;\n transition: margin-left 0.1s;\n padding: 20px;\n}\n\n.app-container.sidebar-closed {\n margin-left: 64px;\n transition: margin-left 0.1s;\n} */\n\n/* ::-webkit-scrollbar {\n width: 5px;\n}\n\n::-webkit-scrollbar-track {\n box-shadow: inset 0 0 5px grey; \n border-radius: 5px;\n}\n \n::-webkit-scrollbar-thumb {\n background: red; \n border-radius: 5px;\n}\n\n::-webkit-scrollbar-thumb:hover {\n background: #b30000; \n} */\n");const r={neutral:{100:{value:"#FFFFFF"},200:{value:"#F6F6F6"},300:{value:"#E7E6E6"},400:{value:"#C9C9C9"},500:{value:"#9B9B9B"},600:{value:"#686767"},700:{value:"#4F4E4E"},800:{value:"#1A1919"},900:{value:"#000000"}},primary:{100:{value:"#FFFBF2"},200:{value:"#FCEFD3"},500:{value:"#F0AB00"},600:{value:"#D49700"},700:{value:"#AD7500"},800:{value:"#5F4205"},900:{value:"#332300"}},secondary:{500:{value:"#3855A3"},600:{value:"#263A71"},700:{value:"#1F2F5C"}},success:{100:{value:"#F3FFF2"},200:{value:"#D3EED1"},300:{value:"#C7E9C0"},500:{value:"#086600"}},warning:{100:{value:"#FEF7E5"},200:{value:"#E3CC8F"},500:{value:"#804600"}},error:{100:{value:"#FFF3F4"},200:{value:"#EDA1A9"},500:{value:"#A80011"}}},o=n.createSystem(n.defaultConfig,{theme:{tokens:{colors:r}}}),t=(e,l)=>o.tokens.getVar(`colors.${e}.${l}`)||r?.[e]?.[l]?.value,s=i.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
align-items: center;
|
|
4
4
|
`,d=i(n.Switch.Root)`
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
${({disabled:e})=>e?`\n background-color: transparent;\n color: ${t("neutral",500)};\n\n &:hover {\n background-color: transparent !important;\n }\n `:`\n background-color: transparent;\n border: none;\n color: ${t("neutral",800)};\n box-shadow: none;\n\n &:hover {\n background-color: color-mix(in srgb, ${t("primary",500)} 20%, transparent);\n }\n\n &:active {\n outline: none;\n background-color: color-mix(in srgb, ${t("primary",500)} 40%, transparent);\n box-shadow: 0px 4px 6px -1px #0000001A;\n }\n\n &:focus-visible {\n outline-color: ${t("primary",700)};\n box-shadow: 0px 1px 2px 0px #0000000D;\n }\n `};
|
|
103
103
|
`,I=i($)`
|
|
104
104
|
${({disabled:e})=>e?`\n background-color: ${t("neutral",200)};\n border: 1px solid ${t("neutral",300)};\n color: ${t("neutral",500)};\n\n &:hover {\n background-color: ${t("neutral",200)} !important;\n }\n `:`\n background-color: transparent;\n border: 1px solid ${t("primary",800)};\n color: ${t("primary",800)};\n\n &:hover {\n background-color: ${t("primary",100)};\n color: ${t("primary",900)};\n }\n\n &:active {\n outline: none;\n background-color: ${t("primary",200)} !important;\n border: 1px solid ${t("primary",900)} !important;\n color: ${t("primary",900)};\n }\n\n &:focus-visible {\n outline-color: ${t("primary",800)};\n background-color: ${t("primary",100)};\n }\n `};
|
|
105
|
-
`,
|
|
105
|
+
`,D=({label:l,loading:a,variant:i="primary",size:r="default",disabled:o,leftIcon:t,rightIcon:s,...d})=>{let c=k;"secondary"===i?c=L:"borderless"===i?c=z:"outline"===i&&(c=I);return e.jsxs(c,{"aria-label":(()=>{let e=d["aria-label"]||l;return a&&(e="Loading"),e})(),size:r,disabled:o||a,"aria-disabled":o||a,...d,children:[t&&!a?e.jsx(n.Box,{marginRight:l?2:0,display:"flex",alignItems:"center",children:t}):null,!s&&a?e.jsx(n.Spinner,{size:"sm",marginRight:l?2:0}):null,l,s&&!a?e.jsx(n.Box,{marginLeft:l?2:0,display:"flex",alignItems:"center",children:s}):null,s&&a?e.jsx(n.Spinner,{size:"sm",marginLeft:l?2:0}):null]})},B=i.div`
|
|
106
106
|
width: 64px;
|
|
107
107
|
height: 100vh;
|
|
108
108
|
z-index: 100;
|
|
@@ -114,7 +114,7 @@
|
|
|
114
114
|
display: flex;
|
|
115
115
|
flex-direction: column;
|
|
116
116
|
justify-content: space-between;
|
|
117
|
-
`,
|
|
117
|
+
`,F=i(n.Tabs.Trigger)`
|
|
118
118
|
width: 64px;
|
|
119
119
|
height: 64px;
|
|
120
120
|
background-color: ${t("neutral",200)};
|
|
@@ -266,7 +266,7 @@
|
|
|
266
266
|
background-color: ${t("neutral",100)};
|
|
267
267
|
overflow-y: auto;
|
|
268
268
|
overflow-x: hidden;
|
|
269
|
-
`,V=({tabs:a=[],defaultValue:i,onTabClick:r,children:o,onOpenChange:t})=>{const[s,d]=l.useState(!1),[p,h]=l.useState(i||a?.[0]?.value);return e.jsxs(e.Fragment,{children:[e.jsxs(
|
|
269
|
+
`,V=({tabs:a=[],defaultValue:i,onTabClick:r,children:o,onOpenChange:t})=>{const[s,d]=l.useState(!1),[p,h]=l.useState(i||a?.[0]?.value);return e.jsxs(e.Fragment,{children:[e.jsxs(B,{children:[e.jsx(n.Tabs.Root,{defaultValue:i||a?.[0]?.value,orientation:"horizontal",width:"full",onFocusChange:({focusedValue:e})=>{return h(l=e),void(r&&r(l));var l},role:"tablist",children:e.jsx(n.Tabs.List,{alignItems:"center",border:"none",style:{flexDirection:"column"},children:a.map((l=>e.jsx(F,{"aria-label":l["aria-label"]||l.label,...l,children:e.jsxs(n.Box,{display:"flex",alignItems:"center",flexDirection:"column",gap:"5px",className:"tab-label",children:[l.icon?e.jsx(A,{children:l.icon}):null,e.jsx("p",{children:l.label})]})},l.label)))})}),o?e.jsx(n.Collapsible.Root,{onOpenChange:({open:e})=>{d(e),t&&t(!e)},children:e.jsxs(T,{children:[e.jsx(A,{children:s?e.jsx(x,{}):e.jsx(c,{})}),e.jsxs("div",{className:"tab-label",children:[e.jsx("p",{children:s?"Show":"Hide"}),e.jsx("p",{children:"Sidebar"})]})]})}):null]}),o?e.jsx(n.Collapsible.Root,{defaultOpen:!0,open:!s,children:e.jsx(n.Collapsible.Content,{children:e.jsx(S,{role:"tabpanel","aria-labelledby":p,children:o})})}):null]})},M=i(n.RadioGroup.Item)`
|
|
270
270
|
.radio-item-indicator {
|
|
271
271
|
width: 20px;
|
|
272
272
|
height: 20px;
|
|
@@ -492,7 +492,7 @@
|
|
|
492
492
|
line-height: 20px;
|
|
493
493
|
text-align: left;
|
|
494
494
|
color: ${t("neutral",600)};
|
|
495
|
-
`,J=({name:l,label:a,caption:i,showInfoButton:r=!0,infoButtonLabel:o="About data",variant:t="switch",disabled:s,onInfoClick:d,isDefaultSelected:c=!1,onChange:x})=>{const p="switch"===t;return e.jsxs(G,{children:[p?e.jsxs(W,{children:[e.jsxs(Y,{children:[e.jsx(K,{"aria-label":a,children:a}),e.jsx(Q,{"aria-label":i,children:i})]}),e.jsx(w,{"aria-label":`${a}, ${i}`,name:l,disabled:s,defaultChecked:c,onChange:x,role:"switch"})]}):e.jsxs("div",{style:{display:"flex",flexDirection:"column"},children:[e.jsx(R,{value:l,disabled:s,fontSize:"16px",color:"var(--chakra-colors-neutral-800)",children:a}),e.jsx(Q,{style:{marginLeft:"28px"},children:i})]}),r?e.jsx(n.Box,{display:"flex",justifyContent:"flex-start",marginTop:"8px",marginLeft:p?0:"28px",children:e.jsx(
|
|
495
|
+
`,J=({name:l,label:a,caption:i,showInfoButton:r=!0,infoButtonLabel:o="About data",variant:t="switch",disabled:s,onInfoClick:d,isDefaultSelected:c=!1,onChange:x})=>{const p="switch"===t;return e.jsxs(G,{children:[p?e.jsxs(W,{children:[e.jsxs(Y,{children:[e.jsx(K,{"aria-label":a,children:a}),e.jsx(Q,{"aria-label":i,children:i})]}),e.jsx(w,{"aria-label":`${a}, ${i}`,name:l,disabled:s,defaultChecked:c,onChange:x,role:"switch"})]}):e.jsxs("div",{style:{display:"flex",flexDirection:"column"},children:[e.jsx(R,{value:l,disabled:s,fontSize:"16px",color:"var(--chakra-colors-neutral-800)",children:a}),e.jsx(Q,{style:{marginLeft:"28px"},children:i})]}),r?e.jsx(n.Box,{display:"flex",justifyContent:"flex-start",marginTop:"8px",marginLeft:p?0:"28px",children:e.jsx(D,{variant:"secondary",label:o,rightIcon:e.jsx(u,{}),size:"small",onClick:d,disabled:s})}):null]})},X=i(n.Checkbox.Root)`
|
|
496
496
|
.chakra-checkbox__control {
|
|
497
497
|
width: 20px;
|
|
498
498
|
height: 20px;
|
|
@@ -730,19 +730,19 @@
|
|
|
730
730
|
p {
|
|
731
731
|
color: ${t("error",500)};
|
|
732
732
|
}
|
|
733
|
-
`,ze=({label:l,caption:a,variant:n,size:i="large",icon:r=e.jsx(u,{height:"16px",width:"16px"}),onActionClick:o,actionLabel:t,isButtonRight:s})=>{let d=ye;return"info-grey"===n?d=we:"success"===n?d=$e:"warning"===n?d=ke:"error"===n&&(d=Le),e.jsxs(d,{isButtonRight:s,size:i,"aria-roledescription":"Note",children:[e.jsxs("div",{children:[e.jsxs(ve,{children:[r,e.jsx(fe,{size:i,children:l})]}),e.jsx(Ce,{size:i,children:a})]}),t?e.jsx(
|
|
733
|
+
`,ze=({label:l,caption:a,variant:n,size:i="large",icon:r=e.jsx(u,{height:"16px",width:"16px"}),onActionClick:o,actionLabel:t,isButtonRight:s})=>{let d=ye;return"info-grey"===n?d=we:"success"===n?d=$e:"warning"===n?d=ke:"error"===n&&(d=Le),e.jsxs(d,{isButtonRight:s,size:i,"aria-roledescription":"Note",children:[e.jsxs("div",{children:[e.jsxs(ve,{children:[r,e.jsx(fe,{size:i,children:l})]}),e.jsx(Ce,{size:i,children:a})]}),t?e.jsx(D,{label:t,variant:"info-white"===n||"info-grey"===n?"primary":"secondary",size:"large"===i?"default":"small",onClick:o}):null]})},Ie=i.div`
|
|
734
734
|
width: 100%;
|
|
735
735
|
display: flex;
|
|
736
736
|
justify-content: flex-start;
|
|
737
737
|
align-items: flex-start;
|
|
738
738
|
gap: ${({size:e})=>"small"===e?"12px":"16px"};
|
|
739
739
|
margin-bottom: 20px;
|
|
740
|
-
`,
|
|
740
|
+
`,De=i.div`
|
|
741
741
|
width: 3px;
|
|
742
742
|
height: 100%;
|
|
743
743
|
min-height: ${({size:e})=>"small"===e?"92px":"116px"};
|
|
744
744
|
background-color: ${t("error",500)};
|
|
745
|
-
`,
|
|
745
|
+
`,Be=i(n.Field.Label)`
|
|
746
746
|
color: ${({disabled:e})=>t("neutral",e?600:900)};
|
|
747
747
|
font-size: ${({size:e})=>"small"===e?"14px":"16px"};
|
|
748
748
|
font-weight: 400;
|
|
@@ -752,7 +752,7 @@
|
|
|
752
752
|
.chakra-field__requiredIndicator {
|
|
753
753
|
color: ${({disabled:e})=>e?t("neutral",600):t("error",500)};
|
|
754
754
|
}
|
|
755
|
-
`,
|
|
755
|
+
`,Fe=i(n.Field.HelperText)`
|
|
756
756
|
color: ${({disabled:e})=>t("neutral",e?500:600)};
|
|
757
757
|
font-size: ${({size:e})=>"small"===e?"12px":"14px"};
|
|
758
758
|
font-weight: 400;
|
|
@@ -797,7 +797,7 @@
|
|
|
797
797
|
}
|
|
798
798
|
|
|
799
799
|
${({value:e,defaultValue:l})=>e||l?`\n border: 1px solid ${t("neutral",700)};\n `:""}
|
|
800
|
-
`,Se=({label:a,caption:i,placeholder:r,errorMessage:o,required:t,disabled:s,size:d="default",defaultValue:c="",onChange:x,...p})=>{const[h,u]=l.useState(c);return e.jsxs(Ie,{size:d,className:"text-input-container",children:[o?e.jsx(
|
|
800
|
+
`,Se=({label:a,caption:i,placeholder:r,errorMessage:o,required:t,disabled:s,size:d="default",defaultValue:c="",onChange:x,...p})=>{const[h,u]=l.useState(c);return e.jsxs(Ie,{size:d,className:"text-input-container",children:[o?e.jsx(De,{size:d}):null,e.jsxs(n.Field.Root,{required:t,invalid:!!o,gap:"0",children:[a?e.jsxs(Be,{size:d,disabled:s,"aria-label":a,children:[e.jsx(n.Field.RequiredIndicator,{"aria-label":"required"}),a,t?"":" (optional)"]}):null,i?e.jsx(Fe,{size:d,disabled:s,"aria-label":i,children:i}):null,o?e.jsx(Ae,{size:d,children:o}):null,e.jsx(Te,{placeholder:r,disabled:s,size:d,onChange:e=>{u(e.target.value),x&&x(e)},value:h,_placeholder:{color:"var(--chakra-colors-neutral-500)"},...p})]})]})},Ve=i.div`
|
|
801
801
|
width: 100%;
|
|
802
802
|
display: flex;
|
|
803
803
|
justify-content: flex-start;
|
|
@@ -1118,7 +1118,7 @@
|
|
|
1118
1118
|
color: ${t("neutral",600)};
|
|
1119
1119
|
padding: 0 10px;
|
|
1120
1120
|
}
|
|
1121
|
-
`,cl=({type:a,label:n,caption:i,color:r,onActionClick:o,showActionButton:t,pointIcon:s})=>{const[d,c]=l.useState(!0),x="raster"===a,p="line"===a,h="point"===a;return e.jsxs(rl,{children:[e.jsxs(ol,{children:[e.jsxs("div",{children:[x&&e.jsx(al,{color:r}),p&&e.jsx(nl,{color:r}),h&&e.jsx(il,{color:r,children:s})]}),e.jsxs("div",{children:[e.jsx(tl,{"aria-label":n,children:n}),e.jsx(sl,{"aria-label":i,children:i})]})]}),o&&t?e.jsx(dl,{children:e.jsx(
|
|
1121
|
+
`,cl=({type:a,label:n,caption:i,color:r,onActionClick:o,showActionButton:t,pointIcon:s})=>{const[d,c]=l.useState(!0),x="raster"===a,p="line"===a,h="point"===a;return e.jsxs(rl,{children:[e.jsxs(ol,{children:[e.jsxs("div",{children:[x&&e.jsx(al,{color:r}),p&&e.jsx(nl,{color:r}),h&&e.jsx(il,{color:r,children:s})]}),e.jsxs("div",{children:[e.jsx(tl,{"aria-label":n,children:n}),e.jsx(sl,{"aria-label":i,children:i})]})]}),o&&t?e.jsx(dl,{children:e.jsx(D,{variant:"borderless",label:d?"Hide":"Show",rightIcon:d?e.jsx(v,{}):e.jsx(j,{}),"aria-label":"Show or Hide action",onClick:()=>{c(!d),o&&o()}})}):null]})},xl=i(n.Accordion.Item)`
|
|
1122
1122
|
margin-bottom: 16px;
|
|
1123
1123
|
border: 1px solid ${t("neutral",300)};
|
|
1124
1124
|
border-radius: 4px;
|
|
@@ -1239,18 +1239,18 @@
|
|
|
1239
1239
|
font-weight: 400;
|
|
1240
1240
|
text-align: left;
|
|
1241
1241
|
color: ${t("neutral",600)};
|
|
1242
|
-
`,
|
|
1242
|
+
`,Dl=i.div`
|
|
1243
1243
|
display: flex;
|
|
1244
1244
|
justify-content: space-between;
|
|
1245
1245
|
|
|
1246
1246
|
button {
|
|
1247
1247
|
width: 110px;
|
|
1248
1248
|
}
|
|
1249
|
-
`,
|
|
1249
|
+
`,Bl=i(n.Popover.Content)`
|
|
1250
1250
|
width: 234px;
|
|
1251
1251
|
border: 1px solid ${t("neutral",600)};
|
|
1252
1252
|
border-radius: 4px;
|
|
1253
|
-
`,
|
|
1253
|
+
`,Fl=i(n.Popover.Body)`
|
|
1254
1254
|
padding: 12px;
|
|
1255
1255
|
`,Al=i.p`
|
|
1256
1256
|
font-size: 14px;
|
|
@@ -1278,9 +1278,9 @@
|
|
|
1278
1278
|
margin-top: 18px;
|
|
1279
1279
|
width: 100%;
|
|
1280
1280
|
}
|
|
1281
|
-
`,Sl=({defaultValue:a,onOpacityChanged:i})=>{const[r,o]=l.useState(a);return e.jsxs(n.Popover.Root,{positioning:{placement:"bottom-end"},children:[e.jsx(n.Popover.Trigger,{asChild:!0,children:e.jsx(
|
|
1281
|
+
`,Sl=({defaultValue:a,onOpacityChanged:i})=>{const[r,o]=l.useState(a);return e.jsxs(n.Popover.Root,{positioning:{placement:"bottom-end"},children:[e.jsx(n.Popover.Trigger,{asChild:!0,children:e.jsx(D,{label:"Opacity",size:"small",variant:"secondary",leftIcon:e.jsx(u,{})})}),e.jsx(n.Popover.Positioner,{children:e.jsx(Bl,{children:e.jsxs(Fl,{children:[e.jsx(Al,{children:"Opacity"}),e.jsxs(Tl,{children:[e.jsx(Se,{"aria-label":"Opacity",min:"0",max:"100",value:`${r}%`,onChange:e=>{const l=e.target.value||"0";let a=parseInt(l,10);a=Number.isNaN(a)?0:a,a=a<0?0:a,a=a>100?100:a,o(a),i&&i(a)},className:"opacity-control-text-input"}),e.jsx(ll,{min:0,max:100,value:[r],onValueChangeEnd:({value:e})=>{o(e[0]),i&&i(e[0])}})]})]})})})]})},Vl=({layerName:l,dataUnit:a,onDrag:n,onUpClick:i,onDownClick:r,onRemoveClick:o,children:t,onInfoClick:s,onOpacityChanged:d})=>e.jsxs($l,{children:[e.jsxs(kl,{children:[e.jsx(qe,{icon:e.jsx(f,{}),"aria-label":"Drag and drop",onClick:n,style:{display:"none",marginBottom:"12px"}}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[e.jsx(qe,{icon:e.jsx(b,{rotate:"180"}),"aria-label":"Up",onClick:i}),e.jsx(qe,{icon:e.jsx(b,{}),"aria-label":"Down",onClick:r})]})]}),e.jsxs("div",{children:[e.jsxs(Ll,{children:[e.jsxs("div",{children:[e.jsx(zl,{children:l}),e.jsx(Il,{children:a})]}),e.jsx(D,{label:"Remove",size:"small",variant:"secondary",rightIcon:e.jsx(g,{}),onClick:o})]}),t,e.jsxs(Dl,{children:[e.jsx(D,{label:"About data",size:"small",variant:"secondary",leftIcon:e.jsx(u,{}),onClick:s}),e.jsx(Sl,{defaultValue:80,onOpacityChanged:d})]})]})]}),Ml=i.div`
|
|
1282
1282
|
width: 290px;
|
|
1283
1283
|
box-shadow: 0px 2px 4px -2px #0000001a;
|
|
1284
1284
|
box-shadow: 0px 4px 6px -1px #0000001a;
|
|
1285
|
-
`,Rl=({legendContent:a,analysisContent:n,onTabClick:i})=>{const[r,o]=l.useState("legend-tab"),[t]=l.useState(l.Children.map(a,((e,l)=>({id:l,child:e,sequence:l})))||[]);return e.jsxs(Ml,{children:[e.jsx(U,{tabs:[{label:"Legend",value:"legend-tab",icon:e.jsx(C,{})},{label:"Analysis",value:"analysis-tab",icon:e.jsx(y,{})}],onTabClick:e=>{o(e),i&&i(e)}}),"legend-tab"===r?e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:t.map((e=>e.child))}):null,"analysis-tab"===r?e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:n}):null]})},_l=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsx(w,{name:"switch",defaultChecked:!0,onChange:console.log,children:"defaultChecked"}),e.jsx(w,{name:"switch 2",isLabelOnLeft:!0,children:"isLabelOnLeft"}),e.jsx(w,{name:"switch 3",children:"Normal Label Positon"}),e.jsx(w,{name:"switch 4",disabled:!0,children:"disabled"}),e.jsx(w,{name:"switch 4",disabled:!0,checked:!0,children:"disabled cheked"})]}),El=()=>e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(B,{label:"Button Label",variant:"primary"}),e.jsx(B,{label:"Button Label",variant:"primary",size:"small"})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(B,{label:"Button Label",variant:"secondary"}),e.jsx(B,{label:"Button Label",variant:"secondary",size:"small"})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(B,{label:"Button Label",variant:"borderless"}),e.jsx(B,{label:"Button Label",variant:"borderless",size:"small"})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(B,{label:"Button Label",variant:"outline"}),e.jsx(B,{label:"Button Label",variant:"outline",size:"small"})]})]}),Hl=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsxs(_,{name:"radio-group-1",defaultValue:"1",onChange:(e,l)=>console.log(e,l),children:[e.jsx(R,{value:"1",children:"One"}),e.jsx(R,{value:"2",children:"Two"}),e.jsx(R,{value:"3",children:"Three"})]}),e.jsxs(_,{name:"radio-group-2",defaultValue:"5",isRow:!0,children:[e.jsx(R,{value:"4",children:"Four"}),e.jsx(R,{value:"5",disabled:!0,children:"Five"}),e.jsx(R,{value:"6",children:"Six"})]})]}),Zl=()=>e.jsxs("div",{style:{width:"300px"},children:[e.jsx(U,{variant:"panel",tabs:[{label:"One",value:"one"},{label:"Two",value:"two"},{label:"Three",value:"three"}],onTabClick:console.log}),e.jsx("br",{}),e.jsx(U,{variant:"panel",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two",icon:e.jsx(p,{})},{label:"Three",value:"three"}]}),e.jsx("br",{}),e.jsx(U,{variant:"panel",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two",disabled:!0},{label:"Three",value:"three"}]}),e.jsx("br",{}),e.jsx(U,{variant:"view",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two"},{label:"Three",value:"three"}]})]}),Pl=[{label:"Monday",checked:!1,value:"monday"},{label:"Tuesday",checked:!1,value:"tuesday"},{label:"Wednesday",checked:!1,value:"wednesday"},{label:"Thursday",checked:!1,value:"thursday"}],Nl=()=>{const[a,i]=l.useState(Pl),r=a.every((e=>e.checked)),o=a.some((e=>e.checked))&&!r,t=a.map(((l,a)=>e.jsx(ee,{ms:"6",checked:l.checked,onCheckedChange:e=>{i((l=>{const n=[...l];return n[a]={...n[a],checked:!!e.checked},n}))},children:l.label},l.value)));return e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsx(ee,{name:"Checkbox",value:"1",defaultChecked:!0,children:"Checkbox"}),e.jsx(ee,{name:"Checkbox",value:"1",checked:!0,disabled:!0,children:"Checkbox"}),e.jsx(ee,{name:"Checkbox",value:"1",disabled:!0,children:"Checkbox"})]}),e.jsxs(n.Stack,{align:"flex-start",children:[e.jsx(ee,{checked:r,indeterminate:o,onCheckedChange:e=>{i((l=>l.map((l=>({...l,checked:!!e.checked})))))},children:"Weekdays"}),t]})]})},ql=()=>e.jsxs(pe,{defaultValue:["1"],children:[e.jsx(xe,{label:"Title 1_1",caption:"Caption 1",value:"1",layerItems:[{name:"layer-10",label:"Layer name 1",caption:"Caption 1",isDefaultSelected:!0},{name:"layer-11",label:"Layer name 2",caption:"Caption 1"}]}),e.jsx(xe,{label:"Title 2",caption:"Caption 2",value:"2",layerItems:[{name:"layer-20",label:"Layer name 3",caption:"Caption 1",variant:"radio"},{name:"layer-21",label:"Layer name 4",caption:"Caption 4",variant:"radio"}]})]}),Ol=()=>e.jsxs(pe,{defaultValue:["3"],children:[e.jsx(xe,{label:"Title 1_2",caption:"Caption 1",value:"3",layerItems:[{name:"layer-12",label:"Layer name 1",caption:"Caption 1"},{name:"layer-13",label:"Layer name 2",caption:"Caption 1"}]}),e.jsx(xe,{label:"Title 2",caption:"Caption 2",value:"4",layerItems:[{name:"layer-22",label:"Layer name 3",caption:"Caption 1",variant:"radio"},{name:"layer-23",label:"Layer name 4",caption:"Caption 4",variant:"radio"}]})]}),Ul=()=>e.jsxs(pe,{defaultValue:["5"],children:[e.jsx(xe,{label:"Title 1_3",caption:"Caption 1",value:"5",layerItems:[{name:"layer-14",label:"Layer name 1",caption:"Caption 1"},{name:"layer-15",label:"Layer name 2",caption:"Caption 1"}]}),e.jsx(xe,{label:"Title 2",caption:"Caption 2",value:"6",layerItems:[{name:"layer-24",label:"Layer name 3",caption:"Caption 1",variant:"radio",isDefaultSelected:!0},{name:"layer-25",label:"Layer name 4",caption:"Caption 4",variant:"radio"}]})]}),Gl="label-1",Wl=()=>{const[a,n]=l.useState(Gl);return e.jsxs(me,{title:"Title and more",description:"Lorem ipsum dolor sit amet consectetur. Ac lectus massa auctor ac purus aliquam enim nibh accumsan. Nunc neque suspendisse.",tabBarVariant:"panel",buttonTabs:[{label:"Label 1",value:"label-1"},{label:"Label 2",value:"label-2"},{label:"Label 3",value:"label-3"}],defaultValue:Gl,onTabClick:n,children:["label-1"===a?e.jsx(ql,{}):null,"label-2"===a?e.jsx(Ol,{}):null,"label-3"===a?e.jsx(Ul,{}):null]})},Yl="label-1",Kl=()=>{const[a,n]=l.useState(Yl);return e.jsxs(V,{defaultValue:Yl,onTabClick:e=>{n(e)},onOpenChange:e=>{const l=document.querySelector(".app-container");l&&l?.setAttribute("class",e?"app-container":"app-container sidebar-closed")},tabs:[{label:"Label 1",value:"label-1",icon:e.jsx(p,{})},{label:"Label 2",value:"label-2",icon:e.jsx(p,{})},{label:"Label 3",value:"label-3",icon:e.jsx(p,{})}],children:["label-1"===a?e.jsx(Wl,{}):null,"label-2"===a?e.jsx("div",{children:"content 2"}):null,"label-3"===a?e.jsx("div",{children:"content 3"}):null]})},Ql=()=>e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"info-white",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",variant:"info-white",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"info-white",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",variant:"info-white"}),e.jsx(ce,{label:"Disabled",variant:"info-white",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"info-grey",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",variant:"info-grey",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"info-grey",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",variant:"info-grey"}),e.jsx(ce,{label:"Disabled",variant:"info-grey",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"success",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",variant:"success",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"success",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",variant:"success"}),e.jsx(ce,{label:"Disabled",variant:"success",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"warning",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",size:"small",variant:"warning",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"warning",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",size:"small",variant:"warning"}),e.jsx(ce,{label:"Disabled",size:"small",variant:"warning",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"error",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",size:"small",variant:"error",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"error",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",size:"small",variant:"error"}),e.jsx(ce,{label:"Disabled",size:"small",variant:"error",icon:e.jsx(u,{}),closable:!0,disabled:!0})]})]}),Jl=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]})]}),Xl=()=>e.jsxs("div",{children:[e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",defaultValue:"Default Value",required:!0}),e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",size:"small"}),e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",errorMessage:"Error Message",required:!0}),e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",required:!0,disabled:!0})]}),ea=()=>e.jsxs("div",{children:[e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",defaultValue:"Default Value",minLength:5,maxLength:200,required:!0}),e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",size:"small"}),e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",errorMessage:"Error Message",required:!0}),e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",required:!0,disabled:!0})]}),la=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:[e.jsx(Ue,{}),e.jsx(Ue,{disabled:!0})]}),aa=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:[e.jsx(qe,{icon:e.jsx(m,{}),"aria-label":"Menu"}),e.jsx(qe,{icon:e.jsx(p,{}),"aria-label":"Check"}),e.jsx(qe,{icon:e.jsx(u,{}),"aria-label":"Info",disabled:!0})]}),na=()=>e.jsxs("div",{style:{width:"280px",display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsx(ll,{min:0,max:100,defaultValue:[50]}),e.jsx(ll,{min:0,max:100,defaultValue:[50],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}]}),e.jsx(ll,{min:0,max:100,defaultValue:[50],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}],step:25}),e.jsx(ll,{value:[20,80]}),e.jsx(ll,{min:-100,max:100,defaultValue:[0],isCentred:!0}),e.jsx(ll,{value:[70],marks:[0,25,50,75,100],disabled:!0})]}),ia=()=>e.jsxs("div",{style:{width:"238px"},children:[e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"line",label:"Attribute",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"point",label:"Attribute",color:"#F3FFF2",pointIcon:e.jsx(u,{})})]}),ra=()=>e.jsx("div",{style:{width:"238px"},children:e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})}),oa=()=>e.jsxs("div",{style:{width:"238px"},children:[e.jsx(wl,{colors:["#E5F5F9","#2CA25F"],values:["Low","Medium","High"],subLabels:["<100K",">600K"],isGradient:!0}),e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(wl,{colors:["#A6611A","#DFC27D","#F5F5F5","#80CDC1","#018571"],values:["0%","25%","50%","75%","100%"]}),e.jsx(wl,{colors:["#A6611A","#DFC27D","#F5F5F5","#80CDC1","#018571"],values:["Low","Low-medium","Medium-high","High","Extremely high"],subLabels:["(0 to 9 in 1,000,000)","(9 in 1,000,000 to 7 in 100,000)","(7 in 100,000 to 3 in 10,000)","(3 in 10,000 to 2 in 1,000)","(more than 2 in 1,000)"]})]}),ta=()=>e.jsx("div",{style:{width:"290px"},children:e.jsxs(Vl,{layerName:"Layer Name",dataUnit:"Data Unit",onDrag:()=>console.log("drag"),onUpClick:()=>console.log("up"),onDownClick:()=>console.log("down"),onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})]})}),sa=()=>e.jsx("div",{style:{width:"290px"},children:e.jsxs(Vl,{layerName:"Layer Name 2",dataUnit:"Data Unit",onDrag:()=>console.log("drag"),onUpClick:()=>console.log("up"),onDownClick:()=>console.log("down"),onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})]})}),da=()=>e.jsx("div",{style:{width:"290px"},children:e.jsxs(Vl,{layerName:"Layer Name 3",dataUnit:"Data Unit",onDrag:()=>console.log("drag"),onUpClick:()=>console.log("up"),onDownClick:()=>console.log("down"),onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})]})}),ca=()=>e.jsx(Rl,{legendContent:e.jsxs(e.Fragment,{children:[e.jsx(ta,{}),e.jsx(sa,{}),e.jsx(da,{})]}),analysisContent:e.jsx("div",{})});a.createRoot(document.getElementById("root")).render(e.jsx(l.StrictMode,{children:e.jsx(n.ChakraProvider,{value:o,children:e.jsx((()=>e.jsx("div",{className:"App",children:e.jsxs("div",{className:"app-container",children:[e.jsx("h1",{style:{marginBottom:"20px"},children:"Welcome to WRI OS"}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",flexWrap:"wrap",gap:25},children:[e.jsx(ca,{}),e.jsx(ta,{}),e.jsx(oa,{}),e.jsx(ra,{}),e.jsx(ia,{}),e.jsx(na,{}),e.jsx(aa,{}),e.jsx(la,{}),e.jsx(Xl,{}),e.jsx(ea,{}),e.jsx(Jl,{}),e.jsx(Ql,{}),e.jsx(Nl,{}),e.jsx(Zl,{}),e.jsx(Hl,{}),e.jsx(El,{}),e.jsx(_l,{})]}),e.jsx(Kl,{})]})})),{})})})),exports.Button=B,exports.Checkbox=ee,exports.CloseButton=Ue,exports.IconButton=qe,exports.InlineMessage=ze,exports.LayerGroup=xe,exports.LayerGroupContainer=pe,exports.LayerItem=J,exports.LayerPanel=me,exports.LayerParameters=bl,exports.LegendItem=Vl,exports.LegendPanel=Rl,exports.NavigationRail=V,exports.QualitativeLegend=cl,exports.Radio=R,exports.RadioGroup=_,exports.ScaleLegend=wl,exports.Slider=ll,exports.Switch=w,exports.TabBar=U,exports.Tag=ce,exports.TextInput=Se,exports.Textarea=Pe;
|
|
1285
|
+
`,Rl=(e,l,a)=>{const n=Array.from(e),[i]=n.splice(l,1);return n.splice(a,0,i),n},_l=({legendContent:a,analysisContent:n,onTabClick:i})=>{const[r,o]=l.useState("legend-tab"),[t,s]=l.useState(a);return e.jsxs(Ml,{children:[e.jsx(U,{tabs:[{label:"Legend",value:"legend-tab",icon:e.jsx(C,{})},{label:"Analysis",value:"analysis-tab",icon:e.jsx(y,{})}],onTabClick:e=>{o(e),i&&i(e)}}),"legend-tab"===r?e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:l.Children.map(t,((e,a)=>l.cloneElement(e,{onUpClick:()=>{const e=Rl(t,a,a-1);s(e)},onDownClick:()=>{const e=Rl(t,a,a+1);s(e)}})))}):null,"analysis-tab"===r?e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:n}):null]})},El=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsx(w,{name:"switch",defaultChecked:!0,onChange:console.log,children:"defaultChecked"}),e.jsx(w,{name:"switch 2",isLabelOnLeft:!0,children:"isLabelOnLeft"}),e.jsx(w,{name:"switch 3",children:"Normal Label Positon"}),e.jsx(w,{name:"switch 4",disabled:!0,children:"disabled"}),e.jsx(w,{name:"switch 4",disabled:!0,checked:!0,children:"disabled cheked"})]}),Hl=()=>e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(D,{label:"Button Label",variant:"primary"}),e.jsx(D,{label:"Button Label",variant:"primary",size:"small"})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(D,{label:"Button Label",variant:"secondary"}),e.jsx(D,{label:"Button Label",variant:"secondary",size:"small"})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(D,{label:"Button Label",variant:"borderless"}),e.jsx(D,{label:"Button Label",variant:"borderless",size:"small"})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[e.jsx(D,{label:"Button Label",variant:"outline"}),e.jsx(D,{label:"Button Label",variant:"outline",size:"small"})]})]}),Zl=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsxs(_,{name:"radio-group-1",defaultValue:"1",onChange:(e,l)=>console.log(e,l),children:[e.jsx(R,{value:"1",children:"One"}),e.jsx(R,{value:"2",children:"Two"}),e.jsx(R,{value:"3",children:"Three"})]}),e.jsxs(_,{name:"radio-group-2",defaultValue:"5",isRow:!0,children:[e.jsx(R,{value:"4",children:"Four"}),e.jsx(R,{value:"5",disabled:!0,children:"Five"}),e.jsx(R,{value:"6",children:"Six"})]})]}),Pl=()=>e.jsxs("div",{style:{width:"300px"},children:[e.jsx(U,{variant:"panel",tabs:[{label:"One",value:"one"},{label:"Two",value:"two"},{label:"Three",value:"three"}],onTabClick:console.log}),e.jsx("br",{}),e.jsx(U,{variant:"panel",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two",icon:e.jsx(p,{})},{label:"Three",value:"three"}]}),e.jsx("br",{}),e.jsx(U,{variant:"panel",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two",disabled:!0},{label:"Three",value:"three"}]}),e.jsx("br",{}),e.jsx(U,{variant:"view",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two"},{label:"Three",value:"three"}]})]}),Nl=[{label:"Monday",checked:!1,value:"monday"},{label:"Tuesday",checked:!1,value:"tuesday"},{label:"Wednesday",checked:!1,value:"wednesday"},{label:"Thursday",checked:!1,value:"thursday"}],ql=()=>{const[a,i]=l.useState(Nl),r=a.every((e=>e.checked)),o=a.some((e=>e.checked))&&!r,t=a.map(((l,a)=>e.jsx(ee,{ms:"6",checked:l.checked,onCheckedChange:e=>{i((l=>{const n=[...l];return n[a]={...n[a],checked:!!e.checked},n}))},children:l.label},l.value)));return e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsx(ee,{name:"Checkbox",value:"1",defaultChecked:!0,children:"Checkbox"}),e.jsx(ee,{name:"Checkbox",value:"1",checked:!0,disabled:!0,children:"Checkbox"}),e.jsx(ee,{name:"Checkbox",value:"1",disabled:!0,children:"Checkbox"})]}),e.jsxs(n.Stack,{align:"flex-start",children:[e.jsx(ee,{checked:r,indeterminate:o,onCheckedChange:e=>{i((l=>l.map((l=>({...l,checked:!!e.checked})))))},children:"Weekdays"}),t]})]})},Ol=()=>e.jsxs(pe,{defaultValue:["1"],children:[e.jsx(xe,{label:"Title 1_1",caption:"Caption 1",value:"1",layerItems:[{name:"layer-10",label:"Layer name 1",caption:"Caption 1",isDefaultSelected:!0},{name:"layer-11",label:"Layer name 2",caption:"Caption 1"}]}),e.jsx(xe,{label:"Title 2",caption:"Caption 2",value:"2",layerItems:[{name:"layer-20",label:"Layer name 3",caption:"Caption 1",variant:"radio"},{name:"layer-21",label:"Layer name 4",caption:"Caption 4",variant:"radio"}]})]}),Ul=()=>e.jsxs(pe,{defaultValue:["3"],children:[e.jsx(xe,{label:"Title 1_2",caption:"Caption 1",value:"3",layerItems:[{name:"layer-12",label:"Layer name 1",caption:"Caption 1"},{name:"layer-13",label:"Layer name 2",caption:"Caption 1"}]}),e.jsx(xe,{label:"Title 2",caption:"Caption 2",value:"4",layerItems:[{name:"layer-22",label:"Layer name 3",caption:"Caption 1",variant:"radio"},{name:"layer-23",label:"Layer name 4",caption:"Caption 4",variant:"radio"}]})]}),Gl=()=>e.jsxs(pe,{defaultValue:["5"],children:[e.jsx(xe,{label:"Title 1_3",caption:"Caption 1",value:"5",layerItems:[{name:"layer-14",label:"Layer name 1",caption:"Caption 1"},{name:"layer-15",label:"Layer name 2",caption:"Caption 1"}]}),e.jsx(xe,{label:"Title 2",caption:"Caption 2",value:"6",layerItems:[{name:"layer-24",label:"Layer name 3",caption:"Caption 1",variant:"radio",isDefaultSelected:!0},{name:"layer-25",label:"Layer name 4",caption:"Caption 4",variant:"radio"}]})]}),Wl="label-1",Yl=()=>{const[a,n]=l.useState(Wl);return e.jsxs(me,{title:"Title and more",description:"Lorem ipsum dolor sit amet consectetur. Ac lectus massa auctor ac purus aliquam enim nibh accumsan. Nunc neque suspendisse.",tabBarVariant:"panel",buttonTabs:[{label:"Label 1",value:"label-1"},{label:"Label 2",value:"label-2"},{label:"Label 3",value:"label-3"}],defaultValue:Wl,onTabClick:n,children:["label-1"===a?e.jsx(Ol,{}):null,"label-2"===a?e.jsx(Ul,{}):null,"label-3"===a?e.jsx(Gl,{}):null]})},Kl="label-1",Ql=()=>{const[a,n]=l.useState(Kl);return e.jsxs(V,{defaultValue:Kl,onTabClick:e=>{n(e)},onOpenChange:e=>{const l=document.querySelector(".app-container");l&&l?.setAttribute("class",e?"app-container":"app-container sidebar-closed")},tabs:[{label:"Label 1",value:"label-1",icon:e.jsx(p,{})},{label:"Label 2",value:"label-2",icon:e.jsx(p,{})},{label:"Label 3",value:"label-3",icon:e.jsx(p,{})}],children:["label-1"===a?e.jsx(Yl,{}):null,"label-2"===a?e.jsx("div",{children:"content 2"}):null,"label-3"===a?e.jsx("div",{children:"content 3"}):null]})},Jl=()=>e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"info-white",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",variant:"info-white",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"info-white",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",variant:"info-white"}),e.jsx(ce,{label:"Disabled",variant:"info-white",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"info-grey",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",variant:"info-grey",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"info-grey",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",variant:"info-grey"}),e.jsx(ce,{label:"Disabled",variant:"info-grey",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"success",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",variant:"success",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"success",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",variant:"success"}),e.jsx(ce,{label:"Disabled",variant:"success",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"warning",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",size:"small",variant:"warning",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"warning",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",size:"small",variant:"warning"}),e.jsx(ce,{label:"Disabled",size:"small",variant:"warning",icon:e.jsx(u,{}),closable:!0,disabled:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[e.jsx(ce,{label:"Small",size:"small",variant:"error",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Default",size:"small",variant:"error",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Large",size:"large",variant:"error",icon:e.jsx(u,{}),closable:!0}),e.jsx(ce,{label:"Label",size:"small",variant:"error"}),e.jsx(ce,{label:"Disabled",size:"small",variant:"error",icon:e.jsx(u,{}),closable:!0,disabled:!0})]})]}),Xl=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",isButtonRight:!0})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",size:"small"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]})]}),ea=()=>e.jsxs("div",{children:[e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",defaultValue:"Default Value",required:!0}),e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",size:"small"}),e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",errorMessage:"Error Message",required:!0}),e.jsx(Se,{label:"Label",caption:"Caption",placeholder:"placeholder",required:!0,disabled:!0})]}),la=()=>e.jsxs("div",{children:[e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",defaultValue:"Default Value",minLength:5,maxLength:200,required:!0}),e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",size:"small"}),e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",errorMessage:"Error Message",required:!0}),e.jsx(Pe,{label:"Label",caption:"Caption",placeholder:"placeholder",required:!0,disabled:!0})]}),aa=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:[e.jsx(Ue,{}),e.jsx(Ue,{disabled:!0})]}),na=()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:[e.jsx(qe,{icon:e.jsx(m,{}),"aria-label":"Menu"}),e.jsx(qe,{icon:e.jsx(p,{}),"aria-label":"Check"}),e.jsx(qe,{icon:e.jsx(u,{}),"aria-label":"Info",disabled:!0})]}),ia=()=>e.jsxs("div",{style:{width:"280px",display:"flex",flexDirection:"column",gap:"20px"},children:[e.jsx(ll,{min:0,max:100,defaultValue:[50]}),e.jsx(ll,{min:0,max:100,defaultValue:[50],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}]}),e.jsx(ll,{min:0,max:100,defaultValue:[50],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}],step:25}),e.jsx(ll,{value:[20,80]}),e.jsx(ll,{min:-100,max:100,defaultValue:[0],isCentred:!0}),e.jsx(ll,{value:[70],marks:[0,25,50,75,100],disabled:!0})]}),ra=()=>e.jsxs("div",{style:{width:"238px"},children:[e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"line",label:"Attribute",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"point",label:"Attribute",color:"#F3FFF2",pointIcon:e.jsx(u,{})})]}),oa=()=>e.jsx("div",{style:{width:"238px"},children:e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})}),ta=()=>e.jsxs("div",{style:{width:"238px"},children:[e.jsx(wl,{colors:["#E5F5F9","#2CA25F"],values:["Low","Medium","High"],subLabels:["<100K",">600K"],isGradient:!0}),e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(wl,{colors:["#A6611A","#DFC27D","#F5F5F5","#80CDC1","#018571"],values:["0%","25%","50%","75%","100%"]}),e.jsx(wl,{colors:["#A6611A","#DFC27D","#F5F5F5","#80CDC1","#018571"],values:["Low","Low-medium","Medium-high","High","Extremely high"],subLabels:["(0 to 9 in 1,000,000)","(9 in 1,000,000 to 7 in 100,000)","(7 in 100,000 to 3 in 10,000)","(3 in 10,000 to 2 in 1,000)","(more than 2 in 1,000)"]})]}),sa=({onDrag:l=()=>{},onUpClick:a=()=>{},onDownClick:n=()=>{}})=>e.jsx("div",{style:{width:"290px"},children:e.jsxs(Vl,{layerName:"Layer Name",dataUnit:"Data Unit",onDrag:l,onUpClick:a,onDownClick:n,onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})]})}),da=({onDrag:l=()=>{},onUpClick:a=()=>{},onDownClick:n=()=>{}})=>e.jsx("div",{style:{width:"290px"},children:e.jsxs(Vl,{layerName:"Layer Name 2",dataUnit:"Data Unit",onDrag:l,onUpClick:a,onDownClick:n,onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})]})}),ca=({onDrag:l=()=>{},onUpClick:a=()=>{},onDownClick:n=()=>{}})=>e.jsx("div",{style:{width:"290px"},children:e.jsxs(Vl,{layerName:"Layer Name 3",dataUnit:"Data Unit",onDrag:l,onUpClick:a,onDownClick:n,onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[e.jsx(wl,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),e.jsx(cl,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),e.jsx(ze,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e.jsxs(bl,{label:"Adjust layer parameters",children:[e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"}),e.jsx("div",{children:"Component Placeholder"})]})]})}),xa=()=>e.jsx(_l,{legendContent:[e.jsx(sa,{}),e.jsx(da,{}),e.jsx(ca,{})],analysisContent:e.jsx("div",{})});a.createRoot(document.getElementById("root")).render(e.jsx(l.StrictMode,{children:e.jsx(n.ChakraProvider,{value:o,children:e.jsx((()=>e.jsx("div",{className:"App",children:e.jsxs("div",{className:"app-container",children:[e.jsx("h1",{style:{marginBottom:"20px"},children:"Welcome to WRI OS"}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",flexWrap:"wrap",gap:25},children:[e.jsx(xa,{}),e.jsx(sa,{}),e.jsx(ta,{}),e.jsx(oa,{}),e.jsx(ra,{}),e.jsx(ia,{}),e.jsx(na,{}),e.jsx(aa,{}),e.jsx(ea,{}),e.jsx(la,{}),e.jsx(Xl,{}),e.jsx(Jl,{}),e.jsx(ql,{}),e.jsx(Pl,{}),e.jsx(Zl,{}),e.jsx(Hl,{}),e.jsx(El,{})]}),e.jsx(Ql,{})]})})),{})})})),exports.Button=D,exports.Checkbox=ee,exports.CloseButton=Ue,exports.IconButton=qe,exports.InlineMessage=ze,exports.LayerGroup=xe,exports.LayerGroupContainer=pe,exports.LayerItem=J,exports.LayerPanel=me,exports.LayerParameters=bl,exports.LegendItem=Vl,exports.LegendPanel=_l,exports.NavigationRail=V,exports.QualitativeLegend=cl,exports.Radio=R,exports.RadioGroup=_,exports.ScaleLegend=wl,exports.Slider=ll,exports.Switch=w,exports.TabBar=U,exports.Tag=ce,exports.TextInput=Se,exports.Textarea=Pe;
|
|
1286
1286
|
//# sourceMappingURL=index.js.map
|