@worldresources/wri-design-systems 2.0.0 → 2.117.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/esm/index.js DELETED
@@ -1,1730 +0,0 @@
1
- import{jsxs as e,jsx as l,Fragment as a}from"react/jsx-runtime";import*as i from"react";import n,{useState as r,useEffect as o,Children as t,cloneElement as d}from"react";import c from"react-dom/client";import{createSystem as p,defaultConfig as s,Button as h,Box as u,Spinner as x,Icon as b,Menu as g,Portal as m,Group as v,Checkbox as f,RadioCard as C,HStack as y,RadioGroup as $,Slider as w,For as k,Switch as L,Select as z,Tag as I,createListCollection as D,Field as A,Input as B,Textarea as M,Accordion as V,Tabs as F,Popover as _,Collapsible as R,Toast as T,createToaster as E,Toaster as H,Stack as Z,ChakraProvider as q}from"@chakra-ui/react";import S from"@emotion/styled";!function(e,l){void 0===l&&(l={});var a=l.insertAt;if("undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===a&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.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/* */\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");const N={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"}}},P=p(s,{theme:{tokens:{colors:N}}}),O=(e,l)=>P.tokens.getVar(`colors.${e}.${l}`)||N?.[e]?.[l]?.value,j=S(h)`
2
- width: auto;
3
- height: ${({size:e})=>"small"===e?"28px":"40px"};
4
- font-size: ${({size:e})=>"small"===e?"12px":"16px"};
5
- line-height: ${({size:e})=>"small"===e?"16px":"24px"};
6
- font-weight: 700;
7
- padding: ${({size:e})=>"small"===e?"6px 8px":"8px 16px"};
8
- border-radius: 4px;
9
- box-shadow: 0px 1px 2px 0px #0000000d;
10
-
11
- &:focus-visible {
12
- box-shadow: none;
13
- }
14
-
15
- svg {
16
- width: ${({size:e})=>"small"===e?"10px":"16px"};
17
- height: ${({size:e})=>"small"===e?"10px":"16px"};
18
- }
19
- `,U=S(j)`
20
- ${({disabled:e})=>e?`\n background-color: ${O("neutral",300)};\n border: 1px solid ${O("neutral",400)};\n color: ${O("neutral",500)};\n\n &:hover {\n background-color: ${O("neutral",300)} !important;\n }\n `:`\n background-color: ${O("primary",500)};\n border: 1px solid ${O("primary",600)};\n color: ${O("primary",900)};\n box-shadow: 0px 1px 2px 0px #0000000D;\n\n &:hover {\n background-color: ${O("primary",500)};\n box-shadow: 0px 2px 4px -2px #0000001A;\n box-shadow: 0px 4px 6px -1px #0000001A;\n }\n\n &:active {\n outline: none;\n background-color: ${O("primary",600)} !important;\n border: 1px solid ${O("primary",700)} !important;\n box-shadow: 0px 2px 4px -2px #0000001A;\n box-shadow: 0px 4px 6px -1px #0000001A;\n }\n\n &:focus-visible {\n outline-color: ${O("primary",700)};\n background-color: ${O("primary",500)};\n box-shadow: 0px 1px 2px 0px #0000000D;\n }\n `};
21
- `,W=S(j)`
22
- ${({disabled:e})=>e?`\n background-color: ${O("neutral",200)};\n border: 1px solid ${O("neutral",300)};\n color: ${O("neutral",500)};\n\n &:hover {\n background-color: ${O("neutral",200)} !important;\n }\n `:`\n background-color: ${O("neutral",100)};\n border: 1px solid ${O("neutral",300)};\n color: ${O("neutral",700)};\n box-shadow: 0px 1px 2px 0px #0000000D;\n\n &:hover {\n background-color: ${O("neutral",100)};\n box-shadow: 0px 2px 4px -2px #0000001A;\n box-shadow: 0px 4px 6px -1px #0000001A;\n }\n\n &:active {\n outline: none;\n background-color: ${O("neutral",200)} !important;\n border: 1px solid ${O("neutral",300)} !important;\n box-shadow: 0px 2px 4px -2px #0000001A;\n box-shadow: 0px 4px 6px -1px #0000001A;\n }\n\n &:focus-visible {\n outline-color: ${O("primary",700)};\n box-shadow: 0px 1px 2px 0px #0000000D;\n }\n `};
23
- `,G=S(j)`
24
- ${({disabled:e})=>e?`\n background-color: transparent;\n color: ${O("neutral",500)};\n\n &:hover {\n background-color: transparent !important;\n }\n `:`\n background-color: transparent;\n border: none;\n color: ${O("neutral",800)};\n box-shadow: none;\n\n &:hover {\n background-color: color-mix(in srgb, ${O("primary",500)} 20%, transparent);\n }\n\n &:active {\n outline: none;\n background-color: color-mix(in srgb, ${O("primary",500)} 40%, transparent);\n box-shadow: 0px 4px 6px -1px #0000001A;\n }\n\n &:focus-visible {\n outline-color: ${O("primary",700)};\n box-shadow: 0px 1px 2px 0px #0000000D;\n }\n `};
25
- `,Y=S(j)`
26
- ${({disabled:e})=>e?`\n background-color: ${O("neutral",200)};\n border: 1px solid ${O("neutral",300)};\n color: ${O("neutral",500)};\n\n &:hover {\n background-color: ${O("neutral",200)} !important;\n }\n `:`\n background-color: transparent;\n border: 1px solid ${O("primary",800)};\n color: ${O("primary",800)};\n\n &:hover {\n background-color: ${O("primary",100)};\n color: ${O("primary",900)};\n }\n\n &:active {\n outline: none;\n background-color: ${O("primary",200)} !important;\n border: 1px solid ${O("primary",900)} !important;\n color: ${O("primary",900)};\n }\n\n &:focus-visible {\n outline-color: ${O("primary",800)};\n background-color: ${O("primary",100)};\n }\n `};
27
- `,K=({label:a,loading:i,variant:n="primary",size:r="default",disabled:o,leftIcon:t,rightIcon:d,...c})=>{let p=U;"secondary"===n?p=W:"borderless"===n?p=G:"outline"===n&&(p=Y);return e(p,{"aria-label":(()=>{let e=c["aria-label"]||a;return i&&(e="Loading"),e})(),size:r,disabled:o||i,"aria-disabled":o||i,...c,children:[t&&!i?l(u,{marginRight:a?2:0,display:"flex",alignItems:"center",children:t}):null,!d&&i?l(x,{size:"sm",marginRight:a?2:0}):null,a,d&&!i?l(u,{marginLeft:a?2:0,display:"flex",alignItems:"center",children:d}):null,d&&i?l(x,{size:"sm",marginLeft:a?2:0}):null]})},J=S(h)`
28
- width: 20px !important;
29
- padding: 0 !important;
30
- min-width: 20px !important;
31
- height: 20px;
32
- border-radius: 2px;
33
- background-color: transparent;
34
-
35
- svg {
36
- width: 15px;
37
- height: 15px;
38
-
39
- path {
40
- fill: ${O("neutral",800)};
41
- }
42
- }
43
-
44
- &:hover {
45
- background-color: color-mix(
46
- in srgb,
47
- ${O("primary",500)} 20%,
48
- transparent
49
- );
50
- }
51
-
52
- &:active {
53
- background-color: color-mix(
54
- in srgb,
55
- ${O("primary",500)} 40%,
56
- transparent
57
- );
58
- }
59
-
60
- &:focus-visible {
61
- outline-color: ${O("primary",700)};
62
- }
63
-
64
- &:disabled {
65
- background-color: transparent;
66
-
67
- svg {
68
- path {
69
- fill: ${O("neutral",500)};
70
- }
71
- }
72
- }
73
- `,Q=({icon:e,disabled:a,...i})=>l(J,{"aria-label":i["aria-label"],disabled:a,...i,children:e}),X=S(Q)`
74
- width: 20px !important;
75
- padding: 0 !important;
76
- min-width: 20px !important;
77
- height: 20px;
78
- border-radius: 2px;
79
- background-color: ${O("neutral",300)};
80
-
81
- svg {
82
- width: 10px;
83
- height: 10px;
84
-
85
- path {
86
- fill: ${O("neutral",800)};
87
- }
88
- }
89
-
90
- &:hover {
91
- background-color: ${O("neutral",300)};
92
- box-shadow: 0px 1px 2px -1px #0000001a;
93
- box-shadow: 0px 1px 3px 0px #0000001a;
94
- }
95
-
96
- &:active {
97
- background-color: ${O("neutral",400)};
98
- box-shadow: 0px 1px 2px -1px #0000001a;
99
- box-shadow: 0px 1px 3px 0px #0000001a;
100
- }
101
-
102
- &:focus-visible {
103
- outline-color: ${O("primary",700)};
104
- }
105
-
106
- &:disabled {
107
- background-color: ${O("neutral",200)} !important;
108
- box-shadow: none;
109
-
110
- svg {
111
- path {
112
- fill: ${O("neutral",400)};
113
- }
114
- }
115
- }
116
- `,ee=a=>l(b,{...a,children:e("svg",{viewBox:"0 0 16 17",children:[e("g",{clipPath:"url(#clip0_1216_84)",children:[l("path",{d:"M9.78791 8.03125H16V2.21875C16 1.27103 15.229 0.5 14.2812 0.5H7.1875V16.5H14.2812C15.229 16.5 16 15.729 16 14.7812V8.96875H9.78791L10.5502 9.73106C10.7333 9.91413 10.7333 10.2109 10.5502 10.394C10.3672 10.577 10.0704 10.577 9.88731 10.394L8.32481 8.83147C8.14175 8.64841 8.14175 8.35162 8.32481 8.16856L9.88731 6.60606C10.0704 6.423 10.3672 6.423 10.5502 6.60606C10.7333 6.78912 10.7333 7.08591 10.5502 7.26897L9.78791 8.03125Z",fill:"#4F4E4E"}),l("path",{d:"M0 2.21875V14.7812C0 15.729 0.771031 16.5 1.71875 16.5H6.25V0.5H1.71875C0.771031 0.5 0 1.27103 0 2.21875ZM4.375 7.0625H1.875C1.61612 7.0625 1.40625 6.85262 1.40625 6.59375C1.40625 6.33488 1.61612 6.125 1.875 6.125H4.375C4.63387 6.125 4.84375 6.33488 4.84375 6.59375C4.84375 6.85262 4.63387 7.0625 4.375 7.0625ZM4.375 5.1875H1.875C1.61612 5.1875 1.40625 4.97762 1.40625 4.71875C1.40625 4.45988 1.61612 4.25 1.875 4.25H4.375C4.63387 4.25 4.84375 4.45988 4.84375 4.71875C4.84375 4.97762 4.63387 5.1875 4.375 5.1875ZM4.375 2.375C4.63387 2.375 4.84375 2.58488 4.84375 2.84375C4.84375 3.10262 4.63387 3.3125 4.375 3.3125H1.875C1.61612 3.3125 1.40625 3.10262 1.40625 2.84375C1.40625 2.58488 1.61612 2.375 1.875 2.375H4.375Z",fill:"#4F4E4E"})]}),l("defs",{children:l("clipPath",{id:"clip0_1216_84",children:l("rect",{width:"16",height:"16",fill:"white",transform:"translate(0 0.5)"})})})]})}),le=a=>l(b,{...a,children:e("svg",{viewBox:"0 0 16 17",children:[l("path",{d:"M0 2.21875V14.7812C0 15.729 0.771031 16.5 1.71875 16.5H6.25V0.5H1.71875C0.771031 0.5 0 1.27103 0 2.21875ZM4.375 7.0625H1.875C1.61612 7.0625 1.40625 6.85262 1.40625 6.59375C1.40625 6.33488 1.61612 6.125 1.875 6.125H4.375C4.63387 6.125 4.84375 6.33488 4.84375 6.59375C4.84375 6.85262 4.63387 7.0625 4.375 7.0625ZM4.375 5.1875H1.875C1.61612 5.1875 1.40625 4.97762 1.40625 4.71875C1.40625 4.45988 1.61612 4.25 1.875 4.25H4.375C4.63387 4.25 4.84375 4.45988 4.84375 4.71875C4.84375 4.97762 4.63387 5.1875 4.375 5.1875ZM4.375 2.375C4.63387 2.375 4.84375 2.58488 4.84375 2.84375C4.84375 3.10262 4.63387 3.3125 4.375 3.3125H1.875C1.61612 3.3125 1.40625 3.10262 1.40625 2.84375C1.40625 2.58488 1.61612 2.375 1.875 2.375H4.375Z",fill:"#4F4E4E"}),l("path",{d:"M14.2812 0.5H7.1875V8.03125H12.4621L11.6998 7.26897C11.5168 7.08591 11.5168 6.78912 11.6998 6.60606C11.8829 6.423 12.1797 6.423 12.3627 6.60606L13.9252 8.16856C14.1083 8.35162 14.1083 8.64841 13.9252 8.83147L12.3627 10.394C12.1797 10.577 11.8829 10.577 11.6998 10.394C11.5168 10.2109 11.5168 9.91413 11.6998 9.73106L12.4621 8.96875H7.1875V16.5H14.2812C15.229 16.5 16 15.729 16 14.7812V2.21875C16 1.27103 15.229 0.5 14.2812 0.5Z",fill:"#4F4E4E"})]})}),ae=e=>l(b,{...e,children:l("svg",{viewBox:"0 0 12 12",height:"12px",width:"12px",children:l("path",{d:"M4.19632 10.4277L0 6.23139L1.04908 5.18231L4.19632 8.32955L10.9509 1.57495L12 2.62403L4.19632 10.4277Z",fill:"currentColor"})})}),ie=e=>l(b,{...e,children:l("svg",{viewBox:"0 0 12 12",height:"12px",width:"12px",children:l("path",{d:"M0 6.75V5.25H12V6.75H0Z",fill:"auto"})})}),ne=e=>l(b,{...e,children:l("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M4.5 7.49997H5.5V4.49997H4.5V7.49997ZM5 3.49997C5.14167 3.49997 5.26042 3.45205 5.35625 3.35622C5.45208 3.26039 5.5 3.14164 5.5 2.99997C5.5 2.8583 5.45208 2.73955 5.35625 2.64372C5.26042 2.54789 5.14167 2.49997 5 2.49997C4.85833 2.49997 4.73958 2.54789 4.64375 2.64372C4.54792 2.73955 4.5 2.8583 4.5 2.99997C4.5 3.14164 4.54792 3.26039 4.64375 3.35622C4.73958 3.45205 4.85833 3.49997 5 3.49997ZM5 9.99997C4.30833 9.99997 3.65833 9.86872 3.05 9.60622C2.44167 9.34372 1.9125 8.98747 1.4625 8.53747C1.0125 8.08747 0.65625 7.5583 0.39375 6.94997C0.13125 6.34164 0 5.69164 0 4.99997C0 4.3083 0.13125 3.6583 0.39375 3.04997C0.65625 2.44164 1.0125 1.91247 1.4625 1.46247C1.9125 1.01247 2.44167 0.656219 3.05 0.393719C3.65833 0.131219 4.30833 -3.05176e-05 5 -3.05176e-05C5.69167 -3.05176e-05 6.34167 0.131219 6.95 0.393719C7.55833 0.656219 8.0875 1.01247 8.5375 1.46247C8.9875 1.91247 9.34375 2.44164 9.60625 3.04997C9.86875 3.6583 10 4.3083 10 4.99997C10 5.69164 9.86875 6.34164 9.60625 6.94997C9.34375 7.5583 8.9875 8.08747 8.5375 8.53747C8.0875 8.98747 7.55833 9.34372 6.95 9.60622C6.34167 9.86872 5.69167 9.99997 5 9.99997Z",fill:"currentColor"})})}),re=e=>l(b,{...e,children:l("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M8 13.3667L0 5.36667L1.86667 3.5L8 9.63333L14.1333 3.5L16 5.36667L8 13.3667Z",fill:"currentColor"})})}),oe=e=>l(b,{...e,children:l("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M1 10L0 9L4 5L0 1L1 0L5 4L9 0L10 1L6 5L10 9L9 10L5 6L1 10Z",fill:"currentColor"})})}),te=e=>l(b,{...e,children:l("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M8 16C7.45 16 6.97917 15.8042 6.5875 15.4125C6.19583 15.0208 6 14.55 6 14C6 13.45 6.19583 12.9792 6.5875 12.5875C6.97917 12.1958 7.45 12 8 12C8.55 12 9.02083 12.1958 9.4125 12.5875C9.80417 12.9792 10 13.45 10 14C10 14.55 9.80417 15.0208 9.4125 15.4125C9.02083 15.8042 8.55 16 8 16ZM8 10C7.45 10 6.97917 9.80417 6.5875 9.4125C6.19583 9.02083 6 8.55 6 8C6 7.45 6.19583 6.97917 6.5875 6.5875C6.97917 6.19583 7.45 6 8 6C8.55 6 9.02083 6.19583 9.4125 6.5875C9.80417 6.97917 10 7.45 10 8C10 8.55 9.80417 9.02083 9.4125 9.4125C9.02083 9.80417 8.55 10 8 10ZM8 4C7.45 4 6.97917 3.80417 6.5875 3.4125C6.19583 3.02083 6 2.55 6 2C6 1.45 6.19583 0.979167 6.5875 0.5875C6.97917 0.195833 7.45 0 8 0C8.55 0 9.02083 0.195833 9.4125 0.5875C9.80417 0.979167 10 1.45 10 2C10 2.55 9.80417 3.02083 9.4125 3.4125C9.02083 3.80417 8.55 4 8 4Z",fill:"currentColor"})})}),de=e=>l(b,{...e,children:l("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M5 6.95455C5.56818 6.95455 6.05114 6.75568 6.44886 6.35795C6.84659 5.96023 7.04545 5.47727 7.04545 4.90909C7.04545 4.34091 6.84659 3.85795 6.44886 3.46023C6.05114 3.0625 5.56818 2.86364 5 2.86364C4.43182 2.86364 3.94886 3.0625 3.55114 3.46023C3.15341 3.85795 2.95455 4.34091 2.95455 4.90909C2.95455 5.47727 3.15341 5.96023 3.55114 6.35795C3.94886 6.75568 4.43182 6.95455 5 6.95455ZM5 6.13636C4.65909 6.13636 4.36932 6.01705 4.13068 5.77841C3.89205 5.53977 3.77273 5.25 3.77273 4.90909C3.77273 4.56818 3.89205 4.27841 4.13068 4.03977C4.36932 3.80114 4.65909 3.68182 5 3.68182C5.34091 3.68182 5.63068 3.80114 5.86932 4.03977C6.10795 4.27841 6.22727 4.56818 6.22727 4.90909C6.22727 5.25 6.10795 5.53977 5.86932 5.77841C5.63068 6.01705 5.34091 6.13636 5 6.13636ZM5 8.31818C3.89394 8.31818 2.88636 8.00947 1.97727 7.39205C1.06818 6.77462 0.409091 5.94697 0 4.90909C0.409091 3.87121 1.06818 3.04356 1.97727 2.42614C2.88636 1.80871 3.89394 1.5 5 1.5C6.10606 1.5 7.11364 1.80871 8.02273 2.42614C8.93182 3.04356 9.59091 3.87121 10 4.90909C9.59091 5.94697 8.93182 6.77462 8.02273 7.39205C7.11364 8.00947 6.10606 8.31818 5 8.31818Z",fill:"currentColor"})})}),ce=a=>l(b,{...a,children:e("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[l("g",{clipPath:"url(#clip0_4626_1381)",children:l("path",{d:"M8.54545 9.9375L6.63636 8.05114C6.37121 8.13447 6.10417 8.19697 5.83523 8.23864C5.56629 8.2803 5.28788 8.30114 5 8.30114C3.85606 8.30114 2.83712 7.98485 1.94318 7.35227C1.04924 6.7197 0.401515 5.89962 0 4.89205C0.159091 4.49053 0.359848 4.11742 0.602273 3.77273C0.844697 3.42803 1.12121 3.11932 1.43182 2.84659L0.181818 1.57386L0.818182 0.9375L9.18182 9.30114L8.54545 9.9375ZM5 6.9375C5.08333 6.9375 5.16098 6.93371 5.23295 6.92614C5.30492 6.91856 5.38258 6.90341 5.46591 6.88068L3.01136 4.42614C2.98864 4.50947 2.97348 4.58712 2.96591 4.65909C2.95833 4.73106 2.95455 4.80871 2.95455 4.89205C2.95455 5.46023 3.15341 5.94318 3.55114 6.34091C3.94886 6.73864 4.43182 6.9375 5 6.9375ZM8.31818 7.14205L6.875 5.71023C6.92803 5.58144 6.9697 5.45076 7 5.31818C7.0303 5.18561 7.04545 5.04356 7.04545 4.89205C7.04545 4.32386 6.84659 3.84091 6.44886 3.44318C6.05114 3.04545 5.56818 2.84659 5 2.84659C4.84848 2.84659 4.70644 2.86174 4.57386 2.89205C4.44129 2.92235 4.31061 2.9678 4.18182 3.02841L3.02273 1.86932C3.33333 1.74053 3.65152 1.64394 3.97727 1.57955C4.30303 1.51515 4.64394 1.48295 5 1.48295C6.14394 1.48295 7.16288 1.79924 8.05682 2.43182C8.95076 3.06439 9.59848 3.88447 10 4.89205C9.82576 5.33902 9.59659 5.75379 9.3125 6.13636C9.02841 6.51894 8.69697 6.85417 8.31818 7.14205ZM6.21591 5.05114L4.85227 3.6875C5.06439 3.64962 5.25947 3.66667 5.4375 3.73864C5.61553 3.81061 5.76894 3.91477 5.89773 4.05114C6.02652 4.1875 6.11932 4.3447 6.17614 4.52273C6.23295 4.70076 6.24621 4.87689 6.21591 5.05114Z",fill:"currentColor"})}),l("defs",{children:l("clipPath",{id:"clip0_4626_1381",children:l("rect",{width:"10",height:"10",fill:"white"})})})]})}),pe=e=>l(b,{...e,children:l("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M6.25 20C5.5625 20 4.97396 19.7552 4.48437 19.2656C3.99479 18.776 3.75 18.1875 3.75 17.5C3.75 16.8125 3.99479 16.224 4.48437 15.7344C4.97396 15.2448 5.5625 15 6.25 15C6.9375 15 7.52604 15.2448 8.01562 15.7344C8.50521 16.224 8.75 16.8125 8.75 17.5C8.75 18.1875 8.50521 18.776 8.01562 19.2656C7.52604 19.7552 6.9375 20 6.25 20ZM13.75 20C13.0625 20 12.474 19.7552 11.9844 19.2656C11.4948 18.776 11.25 18.1875 11.25 17.5C11.25 16.8125 11.4948 16.224 11.9844 15.7344C12.474 15.2448 13.0625 15 13.75 15C14.4375 15 15.026 15.2448 15.5156 15.7344C16.0052 16.224 16.25 16.8125 16.25 17.5C16.25 18.1875 16.0052 18.776 15.5156 19.2656C15.026 19.7552 14.4375 20 13.75 20ZM6.25 12.5C5.5625 12.5 4.97396 12.2552 4.48437 11.7656C3.99479 11.276 3.75 10.6875 3.75 10C3.75 9.3125 3.99479 8.72396 4.48437 8.23438C4.97396 7.74479 5.5625 7.5 6.25 7.5C6.9375 7.5 7.52604 7.74479 8.01562 8.23438C8.50521 8.72396 8.75 9.3125 8.75 10C8.75 10.6875 8.50521 11.276 8.01562 11.7656C7.52604 12.2552 6.9375 12.5 6.25 12.5ZM13.75 12.5C13.0625 12.5 12.474 12.2552 11.9844 11.7656C11.4948 11.276 11.25 10.6875 11.25 10C11.25 9.3125 11.4948 8.72396 11.9844 8.23438C12.474 7.74479 13.0625 7.5 13.75 7.5C14.4375 7.5 15.026 7.74479 15.5156 8.23438C16.0052 8.72396 16.25 9.3125 16.25 10C16.25 10.6875 16.0052 11.276 15.5156 11.7656C15.026 12.2552 14.4375 12.5 13.75 12.5ZM6.25 5C5.5625 5 4.97396 4.75521 4.48437 4.26562C3.99479 3.77604 3.75 3.1875 3.75 2.5C3.75 1.8125 3.99479 1.22396 4.48437 0.734375C4.97396 0.244792 5.5625 0 6.25 0C6.9375 0 7.52604 0.244792 8.01562 0.734375C8.50521 1.22396 8.75 1.8125 8.75 2.5C8.75 3.1875 8.50521 3.77604 8.01562 4.26562C7.52604 4.75521 6.9375 5 6.25 5ZM13.75 5C13.0625 5 12.474 4.75521 11.9844 4.26562C11.4948 3.77604 11.25 3.1875 11.25 2.5C11.25 1.8125 11.4948 1.22396 11.9844 0.734375C12.474 0.244792 13.0625 0 13.75 0C14.4375 0 15.026 0.244792 15.5156 0.734375C16.0052 1.22396 16.25 1.8125 16.25 2.5C16.25 3.1875 16.0052 3.77604 15.5156 4.26562C15.026 4.75521 14.4375 5 13.75 5Z",fill:"currentColor"})})}),se=a=>l(b,{...a,children:e("svg",{width:"17",height:"16",viewBox:"0 0 17 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[l("g",{clipPath:"url(#clip0_5584_387)",children:l("path",{d:"M8.49906 16L0.940002 10.1207L2.32583 9.07087L8.49906 13.8583L14.6723 9.07087L16.0581 10.1207L8.49906 16ZM8.49906 11.7585L0.940002 5.87926L8.49906 0L16.0581 5.87926L8.49906 11.7585Z",fill:"currentColor"})}),l("defs",{children:l("clipPath",{id:"clip0_5584_387",children:l("rect",{width:"16",height:"16",fill:"white",transform:"translate(0.5)"})})})]})}),he=e=>l(b,{...e,children:l("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M1.71286 12.5714V3.42857H5.14144V12.5714H1.71286ZM6.28429 12.5714V6.85714H9.71286V12.5714H6.28429ZM10.8557 12.5714V0H14.2843V12.5714H10.8557ZM0.570007 16V13.7143H15.4271V16H0.570007Z",fill:"currentColor"})})}),ue=a=>l(b,{...a,children:e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[l("g",{clipPath:"url(#clip0_4916_54426)",children:l("path",{d:"M8.6 14.6L15.65 7.55L14.25 6.15L8.6 11.8L5.75 8.95L4.35 10.35L8.6 14.6ZM10 20C8.61667 20 7.31667 19.7375 6.1 19.2125C4.88333 18.6875 3.825 17.975 2.925 17.075C2.025 16.175 1.3125 15.1167 0.7875 13.9C0.2625 12.6833 0 11.3833 0 10C0 8.61667 0.2625 7.31667 0.7875 6.1C1.3125 4.88333 2.025 3.825 2.925 2.925C3.825 2.025 4.88333 1.3125 6.1 0.7875C7.31667 0.2625 8.61667 0 10 0C11.3833 0 12.6833 0.2625 13.9 0.7875C15.1167 1.3125 16.175 2.025 17.075 2.925C17.975 3.825 18.6875 4.88333 19.2125 6.1C19.7375 7.31667 20 8.61667 20 10C20 11.3833 19.7375 12.6833 19.2125 13.9C18.6875 15.1167 17.975 16.175 17.075 17.075C16.175 17.975 15.1167 18.6875 13.9 19.2125C12.6833 19.7375 11.3833 20 10 20Z",fill:"currentColor"})}),l("defs",{children:l("clipPath",{id:"clip0_4916_54426",children:l("rect",{width:"20",height:"20",fill:"white"})})})]})}),xe=e=>l(b,{...e,children:l("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M0 18.6477L10 1.375L20 18.6477H0ZM10 15.9205C10.2576 15.9205 10.4735 15.8333 10.6477 15.6591C10.822 15.4848 10.9091 15.2689 10.9091 15.0114C10.9091 14.7538 10.822 14.5379 10.6477 14.3636C10.4735 14.1894 10.2576 14.1023 10 14.1023C9.74242 14.1023 9.52652 14.1894 9.35227 14.3636C9.17803 14.5379 9.09091 14.7538 9.09091 15.0114C9.09091 15.2689 9.17803 15.4848 9.35227 15.6591C9.52652 15.8333 9.74242 15.9205 10 15.9205ZM9.09091 13.1932H10.9091V8.64773H9.09091V13.1932Z",fill:"currentColor"})})}),be=e=>l(b,{...e,children:l("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M10 15C10.2833 15 10.5208 14.9042 10.7125 14.7125C10.9042 14.5208 11 14.2833 11 14C11 13.7167 10.9042 13.4792 10.7125 13.2875C10.5208 13.0958 10.2833 13 10 13C9.71667 13 9.47917 13.0958 9.2875 13.2875C9.09583 13.4792 9 13.7167 9 14C9 14.2833 9.09583 14.5208 9.2875 14.7125C9.47917 14.9042 9.71667 15 10 15ZM9 11H11V5H9V11ZM10 20C8.61667 20 7.31667 19.7375 6.1 19.2125C4.88333 18.6875 3.825 17.975 2.925 17.075C2.025 16.175 1.3125 15.1167 0.7875 13.9C0.2625 12.6833 0 11.3833 0 10C0 8.61667 0.2625 7.31667 0.7875 6.1C1.3125 4.88333 2.025 3.825 2.925 2.925C3.825 2.025 4.88333 1.3125 6.1 0.7875C7.31667 0.2625 8.61667 0 10 0C11.3833 0 12.6833 0.2625 13.9 0.7875C15.1167 1.3125 16.175 2.025 17.075 2.925C17.975 3.825 18.6875 4.88333 19.2125 6.1C19.7375 7.31667 20 8.61667 20 10C20 11.3833 19.7375 12.6833 19.2125 13.9C18.6875 15.1167 17.975 16.175 17.075 17.075C16.175 17.975 15.1167 18.6875 13.9 19.2125C12.6833 19.7375 11.3833 20 10 20Z",fill:"currentColor"})})}),ge=({disabled:e,...a})=>l(X,{icon:l(oe,{}),"aria-label":a["aria-label"]||"Close",disabled:e,...a}),me=S(g.Content)`
117
- width: 200px;
118
- border: 1px solid ${O("neutral",600)};
119
- border-radius: 4px;
120
- padding: 8px;
121
- `,ve=S(g.Trigger)`
122
- &[data-state='open'] {
123
- background-color: ${({variant:e})=>"primary"===e?O("primary",600):O("neutral",200)} !important;
124
- border: 1px solid ${O("primary",800)} !important;
125
- }
126
- `,fe=S(g.Item)`
127
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
128
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
129
- color: ${O("neutral",800)};
130
- padding: 4px;
131
- cursor: pointer;
132
-
133
- &[data-highlighted] {
134
- background-color: ${O("neutral",200)};
135
- }
136
- `,Ce=n.forwardRef(((e,a)=>{const{portalled:i=!0,portalRef:n,...r}=e;return l(m,{disabled:!i,container:n,children:l(g.Positioner,{children:l(me,{ref:a,...r})})})})),ye=({variant:a="primary",size:i="default",mainActionLabel:n,mainActionOnClick:o=()=>{},otherActions:t=[],...d})=>{const[c,p]=r(!1);return e(v,{attached:!0,"aria-disabled":d.disabled,children:[l(K,{label:n,variant:a,size:i,onClick:o,...d}),e(g.Root,{onOpenChange:({open:e})=>p(e),positioning:{placement:"bottom-end"},children:[l(ve,{asChild:!0,"data-group-item":!0,"data-last":!0,variant:a,children:l(K,{variant:a,size:i,leftIcon:l(re,{rotate:c?"180":"0"}),disabled:d.disabled})}),l(Ce,{children:t.map((({label:e,value:a,onClick:n})=>l(fe,{onClick:n,value:a,size:i,children:e},a)))})]})]})},$e=S(f.Root)`
137
- .chakra-checkbox__control {
138
- width: 20px;
139
- height: 20px;
140
- border: 1px solid ${O("neutral",600)};
141
-
142
- svg {
143
- width: 12px;
144
-
145
- path {
146
- fill: transparent;
147
- }
148
- }
149
-
150
- &:hover,
151
- &[data-hover] {
152
- outline: 4px solid
153
- color-mix(in srgb, ${O("primary",500)} 20%, transparent);
154
- }
155
-
156
- &:active,
157
- &[data-active] {
158
- outline: 4px solid
159
- color-mix(in srgb, ${O("primary",500)} 40%, transparent);
160
- }
161
-
162
- &:focus-visible,
163
- &[data-focus-visible] {
164
- box-shadow: none;
165
- outline: 2px solid ${O("primary",700)};
166
- outline-offset: 2px;
167
- }
168
-
169
- &[data-state='checked'],
170
- &[data-state='indeterminate'] {
171
- border: 1px solid ${O("primary",700)};
172
- background-color: ${O("primary",500)} !important;
173
-
174
- svg path {
175
- fill: ${O("primary",900)};
176
- }
177
- }
178
-
179
- &[data-disabled] {
180
- border: 1px solid ${O("neutral",400)};
181
- background-color: transparent !important;
182
- cursor: not-allowed;
183
-
184
- &:hover,
185
- &[data-hover],
186
- &:active,
187
- &[data-active] {
188
- outline: none;
189
- }
190
-
191
- &[data-state='checked'],
192
- &[data-state='indeterminate'] {
193
- border: none !important;
194
- background-color: ${O("neutral",300)} !important;
195
-
196
- svg path {
197
- fill: ${O("neutral",500)} !important;
198
- }
199
- }
200
- }
201
- }
202
- `,we=({name:a,value:i,checked:n,defaultChecked:r,disabled:o,indeterminate:t,onCheckedChange:d,children:c,...p})=>e($e,{name:a,value:i,checked:t?"indeterminate":n,defaultChecked:r,disabled:o,onCheckedChange:d,"aria-label":p["aria-label"]||a,gap:c?"10px":"0",...p,children:[l(f.HiddenInput,{}),l(f.Control,{children:l(t?ie:ae,{})}),l(f.Label,{children:c})]}),ke=S(C.Item)`
203
- width: 241px;
204
- min-height: 70px;
205
- padding: 12px;
206
- background-color: ${O("neutral",100)};
207
- border: 1px solid ${O("neutral",300)};
208
- border-radius: 4px;
209
- cursor: pointer;
210
- box-shadow: 0px 1px 2px 0px #0000000d;
211
- flex: none;
212
-
213
- &:hover {
214
- box-shadow: 0px 2px 4px -2px #0000001a;
215
- box-shadow: 0px 4px 6px -1px #0000001a;
216
- }
217
-
218
- &:focus-visible,
219
- &[data-focus-visible] {
220
- outline: 2px solid ${O("primary",700)};
221
- outline-offset: 2px;
222
- box-shadow: 0px 2px 4px -2px #0000001a;
223
- box-shadow: 0px 4px 6px -1px #0000001a;
224
- }
225
-
226
- &[data-state='checked'] {
227
- background-color: ${O("primary",100)};
228
- border: 1px solid ${O("primary",700)};
229
- }
230
-
231
- &[data-disabled] {
232
- outline: none;
233
- box-shadow: none;
234
- border: 1px solid ${O("neutral",300)};
235
- background-color: ${O("neutral",100)};
236
- color: ${O("neutral",500)};
237
- cursor: not-allowed;
238
- }
239
- `,Le=S(C.ItemHiddenInput)``,ze=S(C.ItemControl)`
240
- width: 100%;
241
- padding: 0;
242
- display: flex;
243
- justify-content: space-between;
244
- position: relative;
245
-
246
- &[data-disabled] {
247
- background-color: ${O("neutral",100)};
248
- }
249
- `,Ie=S.div`
250
- width: 100%;
251
- display: flex;
252
- flex-direction: ${({variant:e})=>"centered"===e?"column":"row"};
253
- align-items: center;
254
- gap: 12px;
255
- `,De=S.div`
256
- svg {
257
- height: 32px;
258
- width: 32px;
259
- }
260
- `,Ae=S.div`
261
- width: 100%;
262
- `,Be=S.p`
263
- font-size: 16px;
264
- line-height: 24px;
265
- font-weight: 400;
266
- color: ${({disabled:e})=>O("neutral",e?500:800)};
267
- text-align: ${({variant:e})=>"centered"===e?"center":"left"};
268
- `,Me=S.p`
269
- font-size: 14px;
270
- line-height: 20px;
271
- font-weight: 400;
272
- color: ${({disabled:e})=>O("neutral",e?500:700)};
273
- text-align: ${({variant:e})=>"centered"===e?"center":"left"};
274
- `,Ve=S(C.ItemIndicator)`
275
- position: absolute;
276
- top: 0;
277
- right: 0;
278
- width: 20px;
279
- height: 20px;
280
- border: 1px solid ${O("neutral",600)};
281
- cursor: pointer;
282
-
283
- .dot {
284
- width: 10px !important;
285
- height: 10px !important;
286
- scale: 1 !important;
287
- }
288
-
289
- &[data-checked] {
290
- border: 1px solid ${O("primary",700)};
291
- background-color: ${O("neutral",100)} !important;
292
- color: ${O("primary",700)};
293
-
294
- &[data-disabled] {
295
- border: 1px solid ${O("neutral",400)};
296
- color: ${O("neutral",400)};
297
- }
298
- }
299
-
300
- &[data-disabled] {
301
- border: 1px solid ${O("neutral",400)};
302
- }
303
- `,Fe=S.div`
304
- width: 100%;
305
- border-top: 1px solid ${O("neutral",300)};
306
- margin-top: 12px;
307
- padding-top: 8px;
308
- color: ${({disabled:e})=>e?O("neutral",500):"inherit"};
309
- `,_e=({label:a,caption:i,icon:n,variant:r="default",disabled:o,children:t,value:d})=>e(ke,{value:d,disabled:o,children:[l(Le,{}),e(ze,{children:[e(Ie,{variant:r,children:[l(De,{children:n}),e(Ae,{children:[l(Be,{variant:r,disabled:o,"aria-label":a,"aria-disabled":o,children:a}),l(Me,{variant:r,disabled:o,"aria-label":i,"aria-disabled":o,children:i})]})]}),l(Ve,{})]}),"expanded"===r?l(Fe,{disabled:o,children:t}):null]}),Re=({children:e,...a})=>l(C.Root,{...a,children:l(y,{alignItems:"flex-start",flexWrap:"wrap",gap:"12px",children:e})}),Te=S($.Item)`
310
- .radio-item-indicator {
311
- width: 20px;
312
- height: 20px;
313
- border: 1px solid ${O("neutral",600)};
314
-
315
- .dot {
316
- width: 10px !important;
317
- height: 10px !important;
318
- scale: 1 !important;
319
- }
320
-
321
- &:hover {
322
- outline: 4px solid
323
- color-mix(in srgb, ${O("primary",500)} 20%, transparent);
324
- }
325
-
326
- &:active {
327
- outline: 4px solid
328
- color-mix(in srgb, ${O("primary",500)} 40%, transparent);
329
- }
330
-
331
- &:focus-visible,
332
- &[data-focus-visible] {
333
- outline: 2px solid ${O("primary",700)};
334
- outline-offset: 2px;
335
- box-shadow: none;
336
-
337
- &[data-checked] {
338
- border: 2px solid ${O("primary",700)};
339
-
340
- &[data-disabled] {
341
- border: 2px solid ${O("neutral",400)};
342
- }
343
- }
344
- }
345
-
346
- &[data-checked] {
347
- border: 1px solid ${O("primary",700)};
348
- background-color: ${O("neutral",100)} !important;
349
- color: ${O("primary",700)};
350
-
351
- &[data-disabled] {
352
- border: 1px solid ${O("neutral",400)};
353
- color: ${O("neutral",400)};
354
- }
355
- }
356
-
357
- &[data-disabled] {
358
- border: 1px solid ${O("neutral",400)} !important;
359
- background-color: ${O("neutral",100)} !important;
360
-
361
- &:hover,
362
- &:active {
363
- outline: none;
364
- }
365
- }
366
- }
367
- `,Ee=({children:a,value:i,disabled:n,...r})=>e(Te,{value:i,disabled:n,...r,children:[l($.ItemHiddenInput,{}),l($.ItemIndicator,{className:"radio-item-indicator"}),a?l($.ItemText,{children:a}):null]}),He=({children:e,horizontal:a=!1,name:i,defaultValue:n,onChange:o,customGap:t,...d})=>{const[c,p]=r(n);let s=a?"20px":"8px";return s=t||s,l($.Root,{onValueChange:e=>{p(e.value),o&&o(i,e.value)},value:c,...d,children:l(y,{gap:s,flexDirection:a?"row":"column",alignItems:"flex-start",flexWrap:"wrap",children:e})})},Ze=S(w.Root)`
368
- height: 60px;
369
- padding: 40px 12px;
370
- `,qe=S(w.Thumb)`
371
- height: 20px;
372
- width: 20px;
373
- background-color: ${O("primary",500)};
374
- border: 2px solid ${O("primary",700)};
375
- box-shadow: 0px 1px 2px 0px #0000000d;
376
-
377
- &:hover,
378
- &[data-hover] {
379
- outline: 4px solid
380
- color-mix(in srgb, ${O("primary",500)} 20%, transparent);
381
-
382
- .slider-value-preview {
383
- display: flex;
384
- }
385
- }
386
-
387
- &[data-dragging] {
388
- outline: 4px solid
389
- color-mix(in srgb, ${O("primary",500)} 40%, transparent);
390
-
391
- div {
392
- display: flex;
393
- }
394
- }
395
-
396
- &:focus-visible,
397
- &[data-focus-visible] {
398
- box-shadow: none;
399
- outline: 2px solid ${O("primary",700)};
400
- outline-offset: 2px;
401
-
402
- .slider-value-preview {
403
- display: flex;
404
- }
405
- }
406
-
407
- &[data-disabled] {
408
- background-color: ${O("neutral",400)};
409
- border: none;
410
- box-shadow: none;
411
- outline: none;
412
- cursor: not-allowed;
413
- }
414
- `,Se=S.div`
415
- font-size: 14px;
416
- line-height: 20px;
417
- color: ${O("neutral",800)};
418
- height: 28px;
419
- background-color: ${O("neutral",100)};
420
- border: 1px solid ${O("neutral",300)};
421
- border-radius: 8px;
422
- padding: 0 8px;
423
- display: none;
424
- justify-content: center;
425
- align-items: center;
426
- position: relative;
427
- top: -30px;
428
- `,Ne=S(w.Track)`
429
- background-color: ${O("neutral",300)};
430
- border: none;
431
- box-shadow: none;
432
- `,Pe=S(w.Range)`
433
- background-color: ${O("primary",500)};
434
- border: 1px solid ${O("primary",700)};
435
- border-radius: 8px;
436
-
437
- &:disabled,
438
- &[disabled],
439
- &[data-disabled],
440
- &[aria-disabled='true'] {
441
- --chakra-colors-border-emphasized: ${O("neutral",400)};
442
- background-color: ${O("neutral",400)};
443
- border: none;
444
- }
445
- `,Oe=S(w.Marker)`
446
- font-size: 12px;
447
- line-height: 16px;
448
- color: ${O("neutral",800)};
449
-
450
- p {
451
- position: relative;
452
- top: -40px;
453
- }
454
-
455
- &[data-state='under-value'] {
456
- .chakra-slider__markerIndicator {
457
- background-color: ${({isCentred:e})=>O("neutral",e?500:200)};
458
- }
459
-
460
- &[data-disabled] {
461
- .chakra-slider__markerIndicator {
462
- background-color: ${({isCentred:e})=>O("neutral",e?400:500)};
463
- }
464
- }
465
- }
466
-
467
- &[data-state='over-value'] {
468
- .chakra-slider__markerIndicator {
469
- background-color: ${O("neutral",500)};
470
- }
471
-
472
- &[data-disabled] {
473
- .chakra-slider__markerIndicator {
474
- background-color: ${O("neutral",400)};
475
- }
476
- }
477
- }
478
-
479
- ${({isMiddleMark:e})=>e?`\n --ty: -6px !important;\n\n .chakra-slider__markerIndicator {\n height: 16px;\n width: 4px;\n background-color: ${O("primary",700)} !important;\n }\n\n &[data-disabled] {\n .chakra-slider__markerIndicator {\n background-color: ${O("neutral",400)} !important;\n }\n }\n `:""};
480
- `,je=a=>{const{value:i}=a;return l(k,{each:i,children:(a,i)=>e(qe,{index:i,children:[l(Se,{className:"slider-value-preview",children:a}),l(w.HiddenInput,{})]},i)})},Ue=n.forwardRef(((a,i)=>{const{marks:n,isCentred:r}=a;return n?.length?l(w.MarkerGroup,{ref:i,children:n.map(((a,i)=>{const n="number"==typeof a?a:a.value,o="number"==typeof a?void 0:a.label;return e(Oe,{value:n,isCentred:r,isMiddleMark:r&&1===i,children:[l(w.MarkerIndicator,{}),l("p",{children:o})]},n)}))}):null})),We=n.forwardRef(((a,i)=>{const{marks:n,onValueChange:t,isCentred:d,...c}=a,[p,s]=r(c.value||[0]);o((()=>{s(c.value||[0])}),[c.value]);let h=n?.map((e=>"number"==typeof e?{value:e,label:void 0}:e));if(d){const e=c.min||0,l=c.max||100;h=[e,(e+l)/2,l].map((e=>({value:e,label:void 0})))}const u=!!h?.some((e=>e.label));return l(Ze,{ref:i,thumbAlignment:"center",onValueChange:e=>{s(e.value),t&&t(e)},origin:d?"center":"start",...c,children:e(w.Control,{"data-has-mark-label":u||void 0,children:[l(Ne,{children:l(Pe,{})}),l(je,{value:p}),l(Ue,{marks:h,isCentred:d})]})})})),Ge=S.div`
481
- display: flex;
482
- align-items: center;
483
- `,Ye=S(L.Root)`
484
- .chakra-switch__control-container {
485
- width: 42px;
486
- height: 26px;
487
- border-radius: 13px;
488
- display: flex;
489
- justify-content: center;
490
- align-items: center;
491
- background-color: ${O("neutral",600)};
492
- }
493
-
494
- &[data-state='checked'] .chakra-switch__control-container {
495
- background-color: ${O("primary",700)};
496
- }
497
-
498
- &[data-disabled] .chakra-switch__control-container {
499
- background-color: transparent;
500
- }
501
-
502
- .chakra-switch__control {
503
- height: 24px;
504
- width: 40px;
505
- display: flex;
506
- align-items: center;
507
- background-color: ${O("neutral",500)};
508
-
509
- &:focus-visible,
510
- &[data-focus-visible] {
511
- box-shadow: none;
512
- outline: none;
513
- outline: 2px solid ${O("primary",700)};
514
- outline-offset: 3px;
515
- }
516
-
517
- &[data-state='checked'] {
518
- background-color: ${O("primary",500)};
519
- }
520
-
521
- &[data-disabled] {
522
- background-color: ${O("neutral",300)};
523
- }
524
- }
525
-
526
- .chakra-switch__thumb {
527
- svg {
528
- width: 12px;
529
-
530
- path {
531
- fill: ${O("primary",700)};
532
- }
533
- }
534
-
535
- &:hover,
536
- &[data-hover] {
537
- outline: 9px solid
538
- color-mix(in srgb, ${O("primary",500)} 20%, transparent);
539
- }
540
-
541
- &[data-active] {
542
- outline: 9px solid
543
- color-mix(in srgb, ${O("primary",500)} 40%, transparent);
544
- }
545
-
546
- &[data-disabled] {
547
- outline: none;
548
-
549
- &[data-state='checked'] {
550
- svg {
551
- path {
552
- fill: ${O("neutral",500)};
553
- }
554
- }
555
- }
556
- }
557
- }
558
- `,Ke=({name:a,defaultChecked:i=!1,onChange:n,disabled:r=!1,isLabelOnLeft:o=!1,children:t,...d})=>l(Ge,{children:e(Ye,{id:a,name:a,"aria-label":d["aria-label"]||a,defaultChecked:i,onCheckedChange:({checked:e})=>{n&&n(a,e)},disabled:r,...d,children:[o&&null!=t?l(L.Label,{children:t}):null,l(L.HiddenInput,{style:{width:"42px",height:"26px"}}),l("div",{className:"chakra-switch__control-container",children:l(L.Control,{children:l(L.Thumb,{children:l(L.ThumbIndicator,{display:"flex",children:l(ae,{})})})})}),o||null==t?null:l(L.Label,{children:t})]})}),Je=S.div`
559
- position: relative;
560
- height: 100%;
561
- `,Qe=S.div`
562
- margin-left: ${({hasErrorMessage:e})=>e?"19px":"0px"};
563
- `,Xe=S.p`
564
- font-size: 16px;
565
- line-height: 24px;
566
- color: ${O("neutral",900)};
567
-
568
- span {
569
- color: ${O("error",500)};
570
- margin-right: 3px;
571
- }
572
- `,el=S.p`
573
- font-size: 14px;
574
- line-height: 20px;
575
- color: ${O("neutral",600)};
576
- `,ll=S.div`
577
- margin-top: 12px;
578
- display: flex;
579
- flex-direction: ${({horizontal:e})=>e?"row":"column"};
580
- flex-wrap: wrap;
581
- gap: ${({horizontal:e})=>e?"20px":"12px"};
582
- `,al=S.div`
583
- width: 3px;
584
- height: 100%;
585
- background-color: ${O("error",500)};
586
- position: absolute;
587
- top: 0;
588
- left: 0;
589
- `,il=S.p`
590
- font-size: 14px;
591
- line-height: 20px;
592
- font-weight: 700;
593
- color: ${O("error",500)};
594
- `,nl=({label:a,caption:i,checkboxes:n,defaultValue:o,onCheckedChange:t,errorMessage:d,horizontal:c,required:p})=>{const[s,h]=r(o?{[o]:!0}:{});return e(Je,{"aria-roledescription":"group","aria-labelledby":a,children:[d?l(al,{}):null,e(Qe,{hasErrorMessage:!!d,children:[e(Xe,{"aria-label":a,children:[p&&l("span",{"aria-label":"required",children:"*"}),a]}),l(el,{"aria-label":i,children:i}),d?l(il,{"aria-label":d,children:d}):null,l(ll,{horizontal:c,children:n.map((e=>l(we,{defaultChecked:o===e.value,onCheckedChange:({checked:l})=>((e,l)=>{const a={...s};l&&(a[l]=e,h(a)),t&&t(a)})(l,e.name),...e},e.name)))})]})]})},rl=S.div`
595
- position: relative;
596
- height: 100%;
597
- `,ol=S.div`
598
- margin-left: ${({hasErrorMessage:e})=>e?"19px":"0px"};
599
- `,tl=S.p`
600
- font-size: 16px;
601
- line-height: 24px;
602
- color: ${O("neutral",900)};
603
-
604
- span {
605
- color: ${O("error",500)};
606
- margin-right: 3px;
607
- }
608
- `,dl=S.p`
609
- font-size: 14px;
610
- line-height: 20px;
611
- color: ${O("neutral",600)};
612
- `,cl=S.div`
613
- margin-top: 12px;
614
- `,pl=S.div`
615
- width: 3px;
616
- height: 100%;
617
- background-color: ${O("error",500)};
618
- position: absolute;
619
- top: 0;
620
- left: 0;
621
- `,sl=S.p`
622
- font-size: 14px;
623
- line-height: 20px;
624
- font-weight: 700;
625
- color: ${O("error",500)};
626
- `,hl=({label:a,caption:i,name:n,radios:r,defaultValue:o,onCheckedChange:t,errorMessage:d,horizontal:c,required:p})=>e(rl,{"aria-roledescription":"group","aria-labelledby":a,children:[d?l(pl,{}):null,e(ol,{hasErrorMessage:!!d,children:[e(tl,{"aria-label":a,children:[p&&l("span",{"aria-label":"required",children:"*"}),a]}),l(dl,{"aria-label":i,children:i}),d?l(sl,{"aria-label":d,children:d}):null,l(cl,{children:l(He,{name:n,defaultValue:o,onChange:t,horizontal:c,children:r.map((e=>l(Ee,{...e},e.value)))})})]})]}),ul=i.forwardRef(((a,i)=>{const{children:n,...r}=a;return e(z.Control,{...r,children:[l(z.Trigger,{ref:i,children:n}),l(z.IndicatorGroup,{children:l(z.Indicator,{children:l(re,{})})})]})})),xl=i.forwardRef(((e,a)=>{const{...i}=e;return l(m,{children:l(z.Positioner,{children:l(z.Content,{...i,ref:a})})})})),bl=i.forwardRef(((e,a)=>{const{item:i,children:n,...r}=e;return l(z.Item,{item:i,...r,ref:a,children:n},i.value)})),gl=i.forwardRef(((e,a)=>{const{children:i,...n}=e;return l(z.ValueText,{...n,ref:a,children:l(z.Context,{children:l=>{const a=l.selectedItems;return 0===a.length?e.placeholder:i?i(a):1===a.length?l.collection.stringifyItem(a[0]):`${a.length} selected`}})})})),ml=i.forwardRef(((i,n)=>l(z.Root,{...i,ref:n,positioning:{sameWidth:!0,...i.positioning},children:i.asChild?i.children:e(a,{children:[l(z.HiddenSelect,{}),i.children]})})));i.forwardRef(((a,i)=>{const{children:n,label:r,...o}=a;return e(z.ItemGroup,{...o,ref:i,children:[l(z.ItemGroupLabel,{children:r}),n]})}));const vl=z.Label;z.ItemText;const fl=S.div`
627
- position: relative;
628
- height: 100%;
629
- width: 100%;
630
- display: flex;
631
- justify-content: flex-start;
632
- align-items: flex-start;
633
- gap: ${({size:e})=>"small"===e?"12px":"16px"};
634
- margin-bottom: 16px;
635
- `,Cl=S.div`
636
- width: 3px;
637
- height: 100%;
638
- background-color: ${O("error",500)};
639
- position: absolute;
640
- top: 0;
641
- left: 0;
642
- `,yl=S(vl)`
643
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
644
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
645
- font-weight: 400;
646
- color: ${O("neutral",900)};
647
-
648
- span {
649
- color: ${O("error",500)};
650
- margin-right: 3px;
651
- }
652
-
653
- &[data-disabled] {
654
- color: ${O("neutral",600)};
655
-
656
- span {
657
- color: ${O("neutral",600)};
658
- }
659
- }
660
- `,$l=S.p`
661
- font-size: ${({size:e})=>"small"===e?"12px":"14px"};
662
- line-height: ${({size:e})=>"small"===e?"16px":"20px"};
663
- font-weight: 400;
664
- color: ${O("neutral",600)};
665
-
666
- &[disabled] {
667
- color: ${O("neutral",500)};
668
- }
669
- `,wl=S(ul)`
670
- .chakra-select__trigger {
671
- min-height: ${({size:e})=>"small"===e?"32px":"40px"};
672
- border-radius: 4px;
673
- padding: 6px 8px;
674
- border: 1px solid
675
- ${({isFilled:e,hasErrorMessage:l})=>((e,l)=>l?O("error",500):O("neutral",e?700:400))(e,l)};
676
- box-shadow: 0px 1px 2px 0px #0000000d;
677
-
678
- .chakra-select__valueText {
679
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
680
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
681
- color: ${O("neutral",700)};
682
-
683
- ${({multiple:e})=>e?"\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n ":""}
684
- }
685
-
686
- &[data-state='open'] {
687
- border-bottom-left-radius: 0px;
688
- border-bottom-right-radius: 0px;
689
- border-bottom: none;
690
- }
691
-
692
- &:is(:focus-visible, [data-focus-visible]) {
693
- outline-offset: 2px;
694
- outline-width: 2px;
695
- outline-color: ${O("primary",700)};
696
- border: 2px solid ${O("neutral",700)};
697
- }
698
-
699
- &[data-disabled] {
700
- border: 1px solid ${O("neutral",300)};
701
- background-color: ${O("neutral",200)};
702
- }
703
- }
704
-
705
- .chakra-select__indicator {
706
- svg {
707
- width: ${({size:e})=>"small"===e?"12px":"16px"};
708
-
709
- path {
710
- fill: ${O("neutral",700)};
711
- }
712
- }
713
-
714
- &[data-disabled] {
715
- svg path {
716
- fill: ${O("neutral",500)};
717
- }
718
- }
719
- }
720
- `,kl=S(xl)`
721
- margin-top: -8px;
722
- border-radius: 4px;
723
- border: 1px solid ${O("neutral",400)};
724
- border-top-left-radius: 0px;
725
- border-top-right-radius: 0px;
726
- border-top: none;
727
- `,Ll=S(bl)`
728
- align-items: flex-start;
729
- &[data-highlighted] {
730
- background-color: ${O("neutral",200)};
731
- cursor: pointer;
732
- }
733
- `,zl=S.p`
734
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
735
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
736
- color: ${O("neutral",800)};
737
-
738
- &[disabled] {
739
- color: ${O("neutral",500)} !important;
740
- }
741
- `,Il=S.p`
742
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
743
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
744
- color: ${O("neutral",700)};
745
-
746
- &[disabled] {
747
- color: ${O("neutral",500)};
748
- }
749
- `,Dl=S.p`
750
- font-size: ${({size:e})=>"small"===e?"12px":"14px"};
751
- line-height: ${({size:e})=>"small"===e?"16px":"20px"};
752
- font-weight: 700;
753
- color: ${O("error",500)};
754
- `,Al=S(I.Root)`
755
- max-width: 100%;
756
- display: flex;
757
- justify-content: center;
758
- align-items: center;
759
- padding: 4px 8px;
760
- border-radius: 4px;
761
- font-weight: 700;
762
- color: ${O("neutral",700)};
763
- box-shadow: none;
764
-
765
- height: 24px;
766
- font-size: 12px;
767
- line-height: 16px;
768
-
769
- svg {
770
- width: 10px;
771
- height: 10px;
772
- margin-right: 4px;
773
- }
774
-
775
- button {
776
- margin-left: 8px;
777
-
778
- svg {
779
- margin-right: 0px;
780
- }
781
- }
782
-
783
- ${({size:e})=>"small"===e?"\n height: 16px;\n border: none !important;\n font-size: 10px;\n line-height: 12px;\n\n svg {\n width: 8px;\n height: 8px;\n margin-right: 4px;\n }\n\n button {\n margin-left: 6px;\n\n svg {\n margin-right: 0px;\n }\n }\n ":""}
784
-
785
- ${({size:e})=>"large"===e?"\n height: 32px;\n font-size: 16px;\n line-height: 24px;\n\n svg {\n width: 12px;\n height: 12px;\n margin-right: 6px;\n }\n\n button {\n margin-left: 12px;\n\n svg {\n margin-right: 0px;\n }\n }\n ":""}
786
-
787
- .chakra-tag__startElement,
788
- .chakra-tag__endElement,
789
- .chakra-tag__closeTrigger {
790
- display: flex;
791
- justify-content: center;
792
- align-items: center;
793
-
794
- &:focus-visible {
795
- --focus-ring-color: ${O("primary",700)};
796
- }
797
- }
798
-
799
- .chakra-tag__closeTrigger {
800
- cursor: pointer;
801
- }
802
-
803
- &[data-disabled='true'] {
804
- border: 1px solid ${O("neutral",400)};
805
- background-color: ${O("neutral",300)};
806
- color: ${O("neutral",600)};
807
- }
808
- `,Bl=S(Al)`
809
- background-color: ${O("neutral",100)};
810
- border: 1px solid ${O("neutral",300)};
811
- `,Ml=S(Al)`
812
- background-color: ${O("neutral",200)};
813
- border: 1px solid ${O("neutral",400)};
814
- `,Vl=S(Al)`
815
- background-color: ${O("success",100)};
816
- border: 1px solid ${O("success",200)};
817
- color: ${O("success",500)};
818
- `,Fl=S(Al)`
819
- background-color: ${O("warning",100)};
820
- border: 1px solid ${O("warning",200)};
821
- color: ${O("warning",500)};
822
- `,_l=S(Al)`
823
- background-color: ${O("error",100)};
824
- border: 1px solid ${O("error",200)};
825
- color: ${O("error",500)};
826
- `,Rl=({label:a,size:i="default",variant:n,disabled:r,icon:o,onClose:t,closable:d,...c})=>{let p=Bl;return"info-grey"===n?p=Ml:"success"===n?p=Vl:"warning"===n?p=Fl:"error"===n&&(p=_l),e(p,{size:i,"data-disabled":r,...c,children:[o?l(I.StartElement,{"aria-label":`${a} tag icon`,children:o}):null,l(I.Label,{"aria-label":a,children:a}),d&&!r&&"small"!==i?l(I.EndElement,{children:l(I.CloseTrigger,{onClick:t,"aria-label":`${a} tag close button`,children:l(oe,{})})}):null]})},Tl=({placeholder:a,size:i,disabled:n})=>l(gl,{placeholder:a,children:a=>{const{label:r,caption:o}=a[0];return e(y,{flexDirection:"column",alignItems:"flex-start",children:[l(zl,{size:i,disabled:n,children:r}),o?l(Il,{size:i,disabled:n,children:o}):null]})}}),El=({placeholder:e,removeItem:a,disabled:i})=>l(gl,{placeholder:e,children:e=>e.map((e=>l(y,{flexDirection:"row",alignItems:"flex-start",children:l(Rl,{label:e.label,variant:"info-grey",disabled:i,onClose:()=>a(e.value),closable:!0},e.value)})))}),Hl=({label:a,caption:i,placeholder:n,items:o,size:t="default",required:d,disabled:c,onChange:p,errorMessage:s,multiple:h,...x})=>{const[b,g]=r(x.defaultValue||[]),m=(e=>D({items:e}))(o),v=e=>{g(e),p&&p(e)};return e(fl,{size:t,style:x.style,children:[s?l(Cl,{}):null,e(ml,{collection:m,disabled:c,required:d,multiple:h,"aria-label":x["aria-label"]||a,value:b,onValueChange:e=>v(e.value),style:{marginLeft:s?"19px":"0px"},...x,children:[e(yl,{size:t,children:[d&&l("span",{children:"*"}),a]}),i?l($l,{size:t,disabled:c,children:i}):null,s&&l(Dl,{size:t,children:s}),l(wl,{size:t,isFilled:b.length>0,hasErrorMessage:!!s,multiple:h,children:h?l(El,{placeholder:n,disabled:c,removeItem:e=>{const l=b.filter((l=>l!==e));v(l)}}):l(Tl,{placeholder:n,size:t,disabled:c})}),l(kl,{children:m.items.map((a=>e(Ll,{item:a,children:[e(u,{children:[l(zl,{size:t,children:a.label}),l(Il,{size:t,children:a.caption})]}),h?l(we,{checked:b.some((e=>e===a.value))}):null]},a.value)))})]})]})},Zl=S.div``,ql=S.p`
827
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
828
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
829
- font-weight: 400;
830
- color: ${O("neutral",900)};
831
-
832
- span {
833
- color: ${O("error",500)};
834
- margin-right: 3px;
835
- }
836
- `,Sl=S.p`
837
- font-size: ${({size:e})=>"small"===e?"12px":"14px"};
838
- line-height: ${({size:e})=>"small"===e?"16px":"20px"};
839
- font-weight: 400;
840
- color: ${O("neutral",600)};
841
- `,Nl=S.div`
842
- display: flex;
843
- align-items: center;
844
- gap: 12px;
845
-
846
- .text-input-container {
847
- width: 63px;
848
- margin: 0px;
849
-
850
- .chakra-input {
851
- padding: 4px;
852
- width: 63px;
853
- }
854
- }
855
-
856
- .chakra-slider__root {
857
- padding: 0 12px;
858
- height: 30px;
859
- margin-top: 18px;
860
- width: 100%;
861
- }
862
- `,Pl=S.div`
863
- position: relative;
864
- height: 100%;
865
- width: 100%;
866
- display: flex;
867
- justify-content: flex-start;
868
- align-items: flex-start;
869
- gap: ${({size:e})=>"small"===e?"12px":"16px"};
870
- margin-bottom: 20px;
871
- `,Ol=S.div`
872
- width: 3px;
873
- height: 100%;
874
- background-color: ${O("error",500)};
875
- position: absolute;
876
- top: 0;
877
- left: 0;
878
- `,jl=S(A.Label)`
879
- color: ${({disabled:e})=>O("neutral",e?600:900)};
880
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
881
- font-weight: 400;
882
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
883
- margin-bottom: 2px;
884
-
885
- span {
886
- color: ${({disabled:e})=>O("neutral",e?600:700)};
887
- }
888
-
889
- .chakra-field__requiredIndicator {
890
- color: ${({disabled:e})=>e?O("neutral",600):O("error",500)};
891
- }
892
- `,Ul=S(A.HelperText)`
893
- color: ${({disabled:e})=>O("neutral",e?500:600)};
894
- font-size: ${({size:e})=>"small"===e?"12px":"14px"};
895
- font-weight: 400;
896
- line-height: ${({size:e})=>"small"===e?"16px":"20px"};
897
- `,Wl=S(A.ErrorText)`
898
- color: ${O("error",500)};
899
- font-size: ${({size:e})=>"small"===e?"12px":"14px"};
900
- font-weight: 700;
901
- line-height: ${({size:e})=>"small"===e?"16px":"20px"};
902
- margin-top: 2px;
903
- `,Gl=S(B)`
904
- height: ${({size:e})=>"small"===e?"28px":"40px"};
905
- width: 100%;
906
- border-radius: 4px;
907
- padding: ${({size:e})=>"small"===e?"4px 8px":"12px"};
908
- margin-top: 8px;
909
- background-color: ${O("neutral",100)};
910
- color: ${O("neutral",800)};
911
- border: 1px solid ${O("neutral",400)};
912
- box-shadow: 0px 1px 2px 0px #0000000d;
913
-
914
- &:focus-visible,
915
- &[data-focus-visible] {
916
- border: 2px solid ${O("neutral",700)};
917
- outline: 2px solid ${O("primary",700)};
918
- outline-offset: 2px;
919
- }
920
-
921
- &:active {
922
- border: 1px solid ${O("primary",600)} !important;
923
- outline: none !important;
924
- box-shadow: 0px 1px 2px 0px #0000000d;
925
- }
926
-
927
- &[data-invalid] {
928
- border: 1px solid ${O("error",500)} !important;
929
- }
930
-
931
- &:disabled {
932
- background-color: ${O("neutral",200)};
933
- border: 1px solid ${O("neutral",300)} !important;
934
- }
935
-
936
- ${({value:e,defaultValue:l})=>e||l?`\n border: 1px solid ${O("neutral",700)};\n `:""}
937
- `,Yl=({label:a,caption:i,placeholder:n,errorMessage:o,required:t,disabled:d,size:c="default",defaultValue:p="",onChange:s,...h})=>{const[u,x]=r(p);return e(Pl,{size:c,className:"text-input-container",children:[o?l(Ol,{}):null,e(A.Root,{required:t,invalid:!!o,gap:"0",style:{marginLeft:o?"19px":"0px"},children:[a?e(jl,{size:c,disabled:d,"aria-label":a,children:[l(A.RequiredIndicator,{"aria-label":"required"}),a,t?"":l("span",{children:" (Optional)"})]}):null,i?l(Ul,{size:c,disabled:d,"aria-label":i,children:i}):null,o?l(Wl,{size:c,"aria-label":o,children:o}):null,l(Gl,{placeholder:n,disabled:d,size:c,onChange:e=>{x(e.target.value),s&&s(e)},value:u,_placeholder:{color:"var(--chakra-colors-neutral-500)"},...h})]})]})},Kl=({label:a,caption:i,size:n="default",sliderItem:o,required:t,onChange:d})=>{const[c,p]=r(o.value||[]),s=(e,l)=>{const a=e.target.value,i=[...c];let n=a?parseInt(a,10):a;const r=o.min||0,t=o.max||100;n=Number.isNaN(n)?r:n,n=n<r?r:n,n=n>t?t:n,i[l]=n,p(i)},h=(e,l)=>{const a=e.target.value||"0",i=[...c];let n=parseInt(a,10);const r=o.min||0,t=o.max||100;if(n=Number.isNaN(n)?r:n,n=n<r?r:n,n=n>t?t:n,2===c?.length){n=Number.isNaN(n)?r:n;const e=c[0],a=c[1];0===l?(n=n<r?r:n,n=n>a?a:n):1===l&&(n=n<e?e:n,n=n>t?t:n)}i[l]=n,p(i),d&&d(i)};return e(Zl,{children:[e(ql,{size:n,"aria-label":a,children:[t&&l("span",{children:"*"}),a]}),i?l(Sl,{size:n,"aria-label":i,children:i}):null,e(Nl,{children:[o.step&&o.marks?l(Hl,{items:o.marks.map((e=>({label:`${e.label}`,value:`${e.value}`}))),placeholder:"",style:{width:"90px"},value:[`${c?.[0]}`],onChange:e=>{const l=e.map((e=>parseInt(e,10)));p(l),d&&d(l)}}):l(Yl,{"aria-label":a,min:o.min,max:o.max,value:c?.[0],type:"number",onChange:e=>s(e,0),onBlur:e=>h(e,0),className:"opacity-control-text-input",onClick:e=>e.target.select()}),l(We,{...o,value:c,onValueChangeEnd:e=>{p(e.value),d&&d(e.value)}}),2===c?.length?l(Yl,{"aria-label":a,min:o.min,max:o.max,value:c?.[1],type:"number",onChange:e=>s(e,1),onBlur:e=>h(e,1),className:"opacity-control-text-input",onClick:e=>e.target.select()}):null]})]})},Jl=S.div`
938
- position: relative;
939
- height: 100%;
940
- width: 100%;
941
- display: flex;
942
- justify-content: flex-start;
943
- align-items: flex-start;
944
- gap: ${({size:e})=>"small"===e?"12px":"16px"};
945
- margin-bottom: 16px;
946
- `,Ql=S.div`
947
- width: 3px;
948
- height: 100%;
949
- background-color: ${O("error",500)};
950
- position: absolute;
951
- top: 0;
952
- left: 0;
953
- `,Xl=S(A.Label)`
954
- color: ${({disabled:e})=>O("neutral",e?600:900)};
955
- font-size: ${({size:e})=>"small"===e?"14px":"16px"};
956
- font-weight: 400;
957
- line-height: ${({size:e})=>"small"===e?"20px":"24px"};
958
- margin-bottom: 2px;
959
-
960
- span {
961
- color: ${({disabled:e})=>O("neutral",e?600:700)};
962
- }
963
-
964
- .chakra-field__requiredIndicator {
965
- color: ${({disabled:e})=>e?O("neutral",600):O("error",500)};
966
- }
967
- `,ea=S(A.HelperText)`
968
- color: ${({disabled:e})=>O("neutral",e?500:600)};
969
- font-size: ${({size:e})=>"small"===e?"12px":"14px"};
970
- font-weight: 400;
971
- line-height: ${({size:e})=>"small"===e?"16px":"20px"};
972
- `,la=S(A.HelperText)`
973
- color: ${O("neutral",600)};
974
- font-size: 12px;
975
- font-weight: 400;
976
- line-height: 16px;
977
- margin-top: 8px;
978
- `,aa=S(A.ErrorText)`
979
- color: ${O("error",500)};
980
- font-size: 14px;
981
- font-weight: 700;
982
- line-height: 20px;
983
- margin-top: 2px;
984
- `,ia=S(M)`
985
- height: 104px;
986
- width: 100%;
987
- border-radius: 4px;
988
- padding: ${({size:e})=>"small"===e?"8px":"12px"};
989
- margin-top: 8px;
990
- background-color: ${O("neutral",100)};
991
- color: ${O("neutral",800)};
992
- border: 1px solid ${O("neutral",400)};
993
- box-shadow: 0px 1px 2px 0px #0000000d;
994
-
995
- &:focus-visible,
996
- &[data-focus-visible] {
997
- border: 2px solid ${O("neutral",700)};
998
- outline: 2px solid ${O("primary",700)};
999
- outline-offset: 2px;
1000
- }
1001
-
1002
- &:active {
1003
- border: 1px solid ${O("primary",600)} !important;
1004
- outline: none !important;
1005
- box-shadow: 0px 1px 2px 0px #0000000d;
1006
- }
1007
-
1008
- &[data-invalid] {
1009
- border: 1px solid ${O("error",500)} !important;
1010
- }
1011
-
1012
- &:disabled {
1013
- background-color: ${O("neutral",200)};
1014
- border: 1px solid ${O("neutral",300)} !important;
1015
- }
1016
-
1017
- ${({value:e,defaultValue:l})=>e||l?`\n border: 1px solid ${O("neutral",700)};\n `:""}
1018
- `,na=({label:a,caption:i,placeholder:n,errorMessage:t,required:d,disabled:c,size:p="default",defaultValue:s="",onChange:h,minLength:u,maxLength:x,...b})=>{const[g,m]=r(s),[v,f]=r(!1),[C,y]=r(!1),[$,w]=r("");o((()=>{const{length:e}=s;u&&e<u&&e>0?(f(e<u),y(!1),w(`Enter at least ${u-e} characters`)):u&&0===e&&w(`Min ${u} characters`),x&&e>0?(f(!1),y(e>x),w(`You have ${x-e} characters remaining`)):x&&0===e&&w(`Max ${x} characters`)}),[]);const k=!!t||v||C;return e(Jl,{size:p,children:[k?l(Ql,{}):null,e(A.Root,{required:d,invalid:k,gap:"0",style:{marginLeft:k?"19px":"0px"},children:[a?e(Xl,{size:p,disabled:c,"aria-label":a,children:[l(A.RequiredIndicator,{"aria-label":"required"}),a,d?"":l("span",{children:" (Optional)"})]}):null,i?l(ea,{size:p,disabled:c,"aria-label":i,children:i}):null,t?l(aa,{"aria-label":t,children:t}):null,l(ia,{placeholder:n,disabled:c,size:p,onChange:e=>{m(e.target.value);const{length:l}=e.target.value;u&&x?(f(l<u),y(l>x),w(`You have ${x-l} characters remaining`)):u?(f(l<u),y(!1),w(l<u?`Enter at least ${u-l} characters`:"")):x&&(y(l>x),f(!1),w(`You have ${x-l} characters remaining`)),h&&h(e)},value:g,_placeholder:{color:"var(--chakra-colors-neutral-500)"},...b}),v&&u?e(aa,{style:{marginTop:"8px",fontSize:"12px",lineHeight:"16px"},"aria-live":"polite",children:["You need ",u-g.length," more characters"]}):null,C&&x?e(aa,{style:{marginTop:"8px",fontSize:"12px",lineHeight:"16px"},"aria-live":"polite",children:["You have ",g.length-x," characters too many"]}):null,!$||C||v?null:l(la,{"aria-label":$,children:$})]})]})},ra=S.div`
1019
- background-color: ${O("neutral",100)};
1020
- `,oa=S.span`
1021
- font-size: 16px;
1022
- font-weight: 700;
1023
- line-height: 24px;
1024
- text-align: left;
1025
- color: ${O("neutral",800)};
1026
- display: flex;
1027
- align-items: center;
1028
- text-align: left;
1029
- gap: 10px;
1030
- `,ta=S.div`
1031
- font-size: 12px;
1032
- font-weight: 400;
1033
- line-height: 16px;
1034
- text-align: left;
1035
- color: ${O("neutral",600)};
1036
- margin-bottom: 8px;
1037
- `,da=S.div`
1038
- width: 268px;
1039
- padding: 16px 0;
1040
- border-bottom: 1px solid ${O("neutral",300)};
1041
- `,ca=S.div`
1042
- display: flex;
1043
- align-items: flex-start;
1044
- justify-content: space-between;
1045
- `,pa=S.div`
1046
- display: flex;
1047
- flex-direction: column;
1048
- `,sa=S.p`
1049
- font-size: 16px;
1050
- font-weight: 400;
1051
- line-height: 24px;
1052
- text-align: left;
1053
- color: ${({disabled:e})=>O("neutral",e?500:800)};
1054
- `,ha=S.p`
1055
- font-size: 14px;
1056
- font-weight: 400;
1057
- line-height: 20px;
1058
- text-align: left;
1059
- color: ${({disabled:e})=>O("neutral",e?500:600)};
1060
- `,ua=({name:a,label:i,caption:n,showInfoButton:r=!0,infoButtonLabel:o="About data",variant:t="switch",disabled:d,onInfoClick:c,isDefaultSelected:p=!1,onChange:s})=>{const h="switch"===t;return e(da,{children:[h?e(ca,{children:[e(pa,{children:[l(sa,{"aria-label":i,"aria-disabled":d,disabled:d,children:i}),l(ha,{"aria-label":n,disabled:d,children:n})]}),l(Ke,{"aria-label":`${i}, ${n}`,name:a,disabled:d,defaultChecked:p,onChange:s,role:"switch"})]}):e("div",{style:{display:"flex",flexDirection:"column"},children:[l(Ee,{value:a,disabled:d,fontSize:"16px",color:"var(--chakra-colors-neutral-800)",children:i}),l(ha,{style:{marginLeft:"28px"},children:n})]}),r?l(u,{display:"flex",justifyContent:"flex-start",marginTop:"8px",marginLeft:h?0:"28px",children:l(K,{variant:"secondary",label:o,rightIcon:l(ne,{}),size:"small",onClick:c,disabled:d})}):null]})},xa=({label:a,caption:i,value:n,layerItems:t,onChangeForRadioVariant:d})=>{const[c,p]=r({}),[s]=r((e=>{const l=e.find((e=>"radio"===e.variant&&e.isDefaultSelected));return l?.name})(t));o((()=>{let e={...c};t.forEach((l=>{l.isDefaultSelected&&(e={...e,["radio"===l.variant?a:l.name]:l.isDefaultSelected})})),p(e)}),[]);const h=(e,l,a,i)=>{const n={...c,[e]:l};p(n),a&&a(e,l,i)},x=Object.values(c).filter((e=>!0===e)).length;return e(V.Item,{value:n,width:"300px",children:[e(V.ItemTrigger,{padding:"16px",alignItems:"flex-start",children:[e(u,{width:"full",display:"flex",flexDirection:"column",alignItems:"flex-start",children:[e(oa,{children:[a,l(Rl,{label:`${x} Active`,size:"small",variant:x>0?"success":"info-grey"})]}),l(ta,{children:i})]}),l(V.ItemIndicator,{display:"flex",children:l(re,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),l(V.ItemContent,{paddingLeft:"16px",paddingRight:"16px",children:l(He,{name:a,defaultValue:s,customGap:"0px",onChange:(e,l)=>h(e,!!l,d,l),children:t.map((e=>l(ua,{...e,onChange:(l,a)=>h(l,a,e.onChange)},e.label)))})})]})},ba=({children:e,defaultValue:a,...i})=>l(ra,{style:{width:"300px"},children:l(V.Root,{defaultValue:a,multiple:!0,...i,children:e})}),ga=S.div`
1061
- width: 100%;
1062
- display: flex;
1063
- align-items: center;
1064
- height: 40px;
1065
-
1066
- ${({variant:e})=>"view"===e&&`\n border: 1px solid ${O("neutral",400)};\n background-color: ${O("neutral",200)};\n border-radius: 4px;\n padding: 4px;\n `}
1067
- `,ma=S(F.Trigger)`
1068
- width: 99%;
1069
- height: 40px;
1070
- padding: 8px 16px;
1071
- border-radius: 0px;
1072
- display: flex;
1073
- justify-content: center;
1074
- align-items: center;
1075
- gap: 2px;
1076
- font-size: 16px;
1077
- line-height: 24px;
1078
- font-weight: 400;
1079
-
1080
- &:focus-visible {
1081
- box-shadow: none;
1082
- }
1083
- `,va=S(ma)`
1084
- background-color: ${O("neutral",200)};
1085
- color: ${O("neutral",600)};
1086
-
1087
- &:hover {
1088
- background-color: ${O("neutral",100)};
1089
- }
1090
-
1091
- &:active {
1092
- background-color: ${O("neutral",300)};
1093
- }
1094
-
1095
- &:focus-visible {
1096
- background-color: ${O("neutral",300)};
1097
- outline-color: ${O("primary",700)};
1098
- outline-offset: 2px;
1099
- }
1100
-
1101
- &[data-selected] {
1102
- background-color: ${O("neutral",100)};
1103
- color: ${O("neutral",800)};
1104
-
1105
- &:hover {
1106
- background-color: ${O("neutral",200)};
1107
- }
1108
-
1109
- &:active {
1110
- background-color: ${O("neutral",300)};
1111
- }
1112
-
1113
- &:focus-visible {
1114
- background-color: ${O("neutral",100)};
1115
- outline-color: ${O("primary",700)};
1116
- outline-offset: 2px;
1117
- }
1118
-
1119
- &::before {
1120
- content: none;
1121
- }
1122
- }
1123
-
1124
- &[data-disabled] {
1125
- background-color: ${O("neutral",200)};
1126
- color: ${O("neutral",400)};
1127
-
1128
- &[data-selected] {
1129
- background-color: ${O("neutral",100)};
1130
- color: ${O("neutral",400)};
1131
- opacity: 1;
1132
- }
1133
- }
1134
- `,fa=S.div`
1135
- width: 4px;
1136
- height: 24px;
1137
- background-color: ${O("neutral",400)};
1138
- `,Ca=S(ma)`
1139
- height: 32px;
1140
- border-radius: 2px;
1141
- background-color: ${O("neutral",200)};
1142
- color: ${O("neutral",600)};
1143
-
1144
- &:hover {
1145
- background-color: ${O("neutral",300)};
1146
- box-shadow: 0px 1px 2px 0px #0000000d;
1147
- }
1148
-
1149
- &:active {
1150
- background-color: ${O("neutral",300)};
1151
- box-shadow: 0px 2px 4px -2px #0000001a;
1152
- box-shadow: 0px 4px 6px -1px #0000001a;
1153
- }
1154
-
1155
- &:focus-visible {
1156
- outline-color: ${O("primary",700)};
1157
- outline-offset: 2px;
1158
- }
1159
-
1160
- &[data-selected] {
1161
- background-color: ${O("neutral",100)};
1162
- border: 1px solid ${O("neutral",300)};
1163
- box-shadow: 0px 1px 2px 0px #0000000d;
1164
- color: ${O("neutral",800)};
1165
-
1166
- &:hover {
1167
- background-color: ${O("neutral",200)};
1168
- border: 1px solid ${O("neutral",300)};
1169
- box-shadow: 0px 2px 4px -2px #0000001a;
1170
- box-shadow: 0px 4px 6px -1px #0000001a;
1171
- }
1172
-
1173
- &:active {
1174
- background-color: ${O("neutral",300)};
1175
- border: 1px solid ${O("neutral",300)};
1176
- box-shadow: 0px 2px 4px -2px #0000001a;
1177
- box-shadow: 0px 4px 6px -1px #0000001a;
1178
- }
1179
-
1180
- &:focus-visible {
1181
- outline-color: ${O("primary",700)};
1182
- outline-offset: 2px;
1183
- }
1184
-
1185
- &::before {
1186
- content: none;
1187
- }
1188
- }
1189
-
1190
- &[data-disabled] {
1191
- background-color: ${O("neutral",200)};
1192
- color: ${O("neutral",400)};
1193
- box-shadow: none;
1194
-
1195
- &:hover {
1196
- box-shadow: none;
1197
- }
1198
-
1199
- &[data-selected] {
1200
- background-color: ${O("neutral",100)};
1201
- color: ${O("neutral",400)};
1202
- opacity: 1;
1203
- }
1204
- }
1205
- `,ya=(e,l)=>e.findIndex((e=>e.value===l)),$a=e=>1===e?"none":2===e?"left":"right",wa=({variant:i="panel",defaultValue:n,tabs:o,onTabClick:t})=>{const[d,c]=r(ya(o,n)||0),p="view"===i,s=p?Ca:va;return l(ga,{variant:i,children:l(F.Root,{width:"full",defaultValue:n||o?.[0]?.value,onFocusChange:({focusedValue:e})=>{return c(ya(o,l=e)),void(t&&t(l));var l},children:l(F.List,{alignItems:"center",border:"none",children:o.map(((i,n)=>e(a,{children:[p&&1===n&&"left"===$a(d)?l(fa,{}):null,l(s,{"aria-label":i["aria-label"]||i.label,...i,children:e(u,{display:"flex",alignItems:"center",gap:"5px",children:[i.icon,i.label]})},i.label),p&&1===n&&"right"===$a(d)?l(fa,{}):null]})))})})})},ka=S.div`
1206
- width: 300px;
1207
- background-color: ${O("neutral",100)};
1208
- `,La=S.aside`
1209
- padding: 16px 16px 20px 16px;
1210
- border-bottom: 1px solid ${O("neutral",300)};
1211
- `,za=S.h2`
1212
- color: ${O("neutral",700)};
1213
- font-weight: 700;
1214
- font-size: 20px;
1215
- line-height: 28px;
1216
- text-align: left;
1217
- `,Ia=S.p`
1218
- color: ${O("neutral",600)};
1219
- font-weight: 400;
1220
- font-size: 14px;
1221
- line-height: 20px;
1222
- text-align: left;
1223
- `,Da=({title:a,description:i,tabBarVariant:n="panel",buttonTabs:r,defaultValue:o,onTabClick:t,children:d})=>e(ka,{children:[e(La,{role:"complementary",children:[l(za,{"aria-label":a,children:a}),l(Ia,{"aria-label":i,children:i})]}),r&&r.length>0?l(wa,{variant:n,defaultValue:o,tabs:r,onTabClick:t}):null,d]}),Aa=S(V.Item)`
1224
- margin-bottom: 16px;
1225
- border: 1px solid ${O("neutral",300)};
1226
- border-radius: 4px;
1227
- box-shadow: 0px 1px 2px 0px #0000000d;
1228
- `,Ba=S(V.ItemTrigger)`
1229
- padding: 6px 8px;
1230
- align-items: center;
1231
- background-color: ${O("neutral",100)};
1232
-
1233
- &[aria-expanded='true'] {
1234
- border-bottom: 1px solid ${O("neutral",300)};
1235
- border-bottom-right-radius: 0px;
1236
- border-bottom-left-radius: 0px;
1237
- }
1238
-
1239
- svg {
1240
- height: 10px;
1241
- width: 10px;
1242
- }
1243
- `,Ma=S.p`
1244
- font-size: 12px;
1245
- font-weight: 700;
1246
- line-height: 16px;
1247
- color: ${O("neutral",700)};
1248
- `,Va=S(V.ItemContent)`
1249
- padding: 12px 8px;
1250
- display: flex;
1251
- flex-direction: column;
1252
-
1253
- .layer-parameters-item-child {
1254
- padding-bottom: 16px;
1255
- border-bottom: 1px solid ${O("neutral",300)};
1256
- margin-bottom: 16px;
1257
-
1258
- &:last-child {
1259
- padding-bottom: 0px;
1260
- border-bottom: none;
1261
- margin-bottom: 0px;
1262
- }
1263
- }
1264
- `,Fa=({label:a,children:i,openedByDefault:n})=>l("div",{children:l(V.Root,{defaultValue:n?[a]:[],multiple:!0,children:e(Aa,{value:a,children:[e(Ba,{children:[l(u,{width:"full",display:"flex",flexDirection:"column",alignItems:"flex-start",children:l(Ma,{children:a})}),l(V.ItemIndicator,{display:"flex",children:l(re,{color:"var(--chakra-colors-neutral-700)",height:"16px",width:"16px"})})]}),l(Va,{children:t.map(i,(e=>l("div",{className:"layer-parameters-item-child",children:e})))})]})})}),_a=S.div`
1265
- padding: 12px;
1266
- padding-bottom: 20px;
1267
- display: flex;
1268
- gap: 12px;
1269
- border-bottom: 1px solid ${O("neutral",300)};
1270
- `,Ra=S.div`
1271
- display: flex;
1272
- flex-direction: column;
1273
-
1274
- svg {
1275
- path {
1276
- fill: ${O("neutral",500)} !important;
1277
- }
1278
- }
1279
- `,Ta=S.div`
1280
- display: flex;
1281
- align-items: flex-start;
1282
- justify-content: space-between;
1283
- gap: 12px;
1284
- margin-bottom: 16px;
1285
- `,Ea=S.h3`
1286
- font-size: 16px;
1287
- line-height: 24px;
1288
- font-weight: 400;
1289
- text-align: left;
1290
- color: ${O("neutral",800)};
1291
- `,Ha=S.p`
1292
- font-size: 14px;
1293
- line-height: 20px;
1294
- font-weight: 400;
1295
- text-align: left;
1296
- color: ${O("neutral",600)};
1297
- `,Za=S.div`
1298
- display: flex;
1299
- justify-content: space-between;
1300
-
1301
- button {
1302
- width: 110px;
1303
- }
1304
- `,qa=S(_.Content)`
1305
- width: 234px;
1306
- border: 1px solid ${O("neutral",600)};
1307
- border-radius: 4px;
1308
- `,Sa=S(_.Body)`
1309
- padding: 12px;
1310
- `,Na=S.p`
1311
- font-size: 14px;
1312
- line-height: 20px;
1313
- font-weight: 400;
1314
- text-align: left;
1315
- color: ${O("neutral",900)};
1316
- `,Pa=S.div`
1317
- display: flex;
1318
- align-items: center;
1319
- gap: 12px;
1320
-
1321
- .text-input-container {
1322
- width: 48px;
1323
- margin: 0px;
1324
-
1325
- .chakra-input {
1326
- padding: 4px;
1327
- width: 48px;
1328
- }
1329
- }
1330
-
1331
- .chakra-slider__root {
1332
- padding: 0 12px;
1333
- height: 30px;
1334
- margin-top: 18px;
1335
- width: 100%;
1336
- }
1337
- `,Oa=({defaultValue:a,onOpacityChanged:i})=>{const[n,o]=r(a);return e(_.Root,{positioning:{placement:"bottom-end"},children:[l(_.Trigger,{asChild:!0,children:l(K,{label:"Opacity",size:"small",variant:"secondary",leftIcon:l(ne,{})})}),l(_.Positioner,{children:l(qa,{children:e(Sa,{children:[l(Na,{children:"Opacity"}),e(Pa,{children:[e("div",{style:{position:"relative"},children:[l(Yl,{"aria-label":"Opacity",min:"0",max:"100",value:n,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",onClick:e=>e.target.select()}),l("p",{style:{position:"absolute",top:"18.5px",right:"5px"},children:"%"})]}),l(We,{min:0,max:100,value:[n],onValueChangeEnd:({value:e})=>{o(e[0]),i&&i(e[0])}})]})]})})})]})},ja=({layerName:a,dataUnit:i,onDrag:n,onUpClick:r,onDownClick:o,onRemoveClick:t,children:d,onInfoClick:c,onOpacityChanged:p})=>e(_a,{children:[e(Ra,{children:[l(Q,{icon:l(pe,{}),"aria-label":"Drag and drop","aria-hidden":!0,onClick:n,style:{display:"none",marginBottom:"12px"}}),e("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[l(Q,{icon:l(re,{rotate:"180"}),"aria-label":"Up",onClick:r}),l(Q,{icon:l(re,{}),"aria-label":"Down",onClick:o})]})]}),e("div",{children:[e(Ta,{children:[e("div",{children:[l(Ea,{children:a}),l(Ha,{children:i})]}),l(K,{label:"Remove",size:"small",variant:"secondary",rightIcon:l(oe,{}),onClick:t})]}),d,e(Za,{children:[l(K,{label:"About data",size:"small",variant:"secondary",leftIcon:l(ne,{}),onClick:c}),l(Oa,{defaultValue:80,onOpacityChanged:p})]})]})]}),Ua=S.div`
1338
- width: 290px;
1339
- box-shadow: 0px 2px 4px -2px #0000001a;
1340
- box-shadow: 0px 4px 6px -1px #0000001a;
1341
- `,Wa=(e,l,a)=>{const i=Array.from(e),[n]=i.splice(l,1);return i.splice(a,0,n),i},Ga=({legendContent:a,analysisContent:i,onTabClick:n})=>{const[o,c]=r("legend-tab"),[p,s]=r(a);return e(Ua,{children:[l(wa,{tabs:[{label:"Legend",value:"legend-tab",icon:l(se,{})},{label:"Analysis",value:"analysis-tab",icon:l(he,{})}],onTabClick:e=>{c(e),n&&n(e)}}),"legend-tab"===o?l("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:t.map(p,((e,l)=>d(e,{onUpClick:()=>{const e=Wa(p,l,l-1);s(e)},onDownClick:()=>{const e=Wa(p,l,l+1);s(e)}})))}):null,"analysis-tab"===o?l("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:i}):null]})},Ya=S.div`
1342
- width: 20px;
1343
- height: 20px;
1344
- border-radius: 50%;
1345
- background-color: ${({color:e})=>e};
1346
- border: 1px solid ${O("neutral",400)};
1347
- `,Ka=S.div`
1348
- width: 20px;
1349
- height: 8px;
1350
- border-radius: 2px;
1351
- background-color: ${({color:e})=>e};
1352
- border: 1px solid ${O("neutral",400)};
1353
- `,Ja=S.div`
1354
- width: 20px;
1355
- height: 20px;
1356
- border-radius: 50%;
1357
- background-color: ${({color:e})=>e};
1358
- display: flex;
1359
- justify-content: center;
1360
- align-items: center;
1361
-
1362
- svg {
1363
- width: 10px;
1364
- height: 10px;
1365
- }
1366
- `,Qa=S.div`
1367
- min-height: 36px;
1368
- width: 100%;
1369
- display: flex;
1370
- justify-content: space-between;
1371
- gap: 8px;
1372
- margin-bottom: 16px;
1373
- `,Xa=S.div`
1374
- display: flex;
1375
- gap: 8px;
1376
- `,ei=S.p`
1377
- font-size: 14px;
1378
- line-height: 20px;
1379
- font-weight: 400;
1380
- color: ${O("neutral",800)};
1381
- `,li=S.p`
1382
- font-size: 12px;
1383
- line-height: 16px;
1384
- font-weight: 400;
1385
- color: ${O("neutral",700)};
1386
- `,ai=S.div`
1387
- button {
1388
- height: 25px;
1389
- font-size: 12px;
1390
- line-height: 16px;
1391
- font-weight: 400;
1392
- color: ${O("neutral",600)};
1393
- padding: 0 10px;
1394
- }
1395
- `,ii=({type:a,label:i,caption:r,color:o,onActionClick:t,showActionButton:d,pointIcon:c})=>{const[p,s]=n.useState(!0),h="line"===a,u="point"===a;return e(Qa,{children:[e(Xa,{children:[e("div",{children:["raster"===a&&l(Ya,{color:o}),h&&l(Ka,{color:o}),u&&l(Ja,{color:o,children:c})]}),e("div",{children:[l(ei,{"aria-label":i,children:i}),l(li,{"aria-label":r,children:r})]})]}),t&&d?l(ai,{children:l(K,{variant:"borderless",label:p?"Hide":"Show",rightIcon:l(p?ce:de,{}),"aria-label":"Show or Hide action",onClick:()=>{s(!p),t&&t()}})}):null]})},ni=S.div`
1396
- width: 100%;
1397
- display: flex;
1398
- flex-direction: column;
1399
- margin-bottom: 16px;
1400
- `,ri=S.div`
1401
- height: 20px;
1402
- width: 100%;
1403
- margin-bottom: 8px;
1404
- border: 1px solid ${O("neutral",300)};
1405
- border-radius: 4px;
1406
- ${({gradient:e})=>e?`background: ${e};`:""}
1407
- `,oi=S.div`
1408
- height: 20px;
1409
- width: 100%;
1410
- margin-bottom: 8px;
1411
- border: 1px solid ${O("neutral",300)};
1412
- border-radius: 4px;
1413
- display: flex;
1414
- align-items: center;
1415
-
1416
- div:first-of-type {
1417
- border-top-left-radius: 3px;
1418
- border-bottom-left-radius: 3px;
1419
- }
1420
-
1421
- div:last-of-type {
1422
- border-top-right-radius: 3px;
1423
- border-bottom-right-radius: 3px;
1424
- }
1425
- `,ti=S.div`
1426
- display: flex;
1427
- justify-content: space-between;
1428
- align-items: flex-start;
1429
- `,di=S.p`
1430
- width: 100%;
1431
- font-size: 12px;
1432
- line-height: 16px;
1433
- font-weight: 400;
1434
- color: ${O("neutral",800)};
1435
- text-align: center;
1436
- `,ci=S.p`
1437
- font-size: 12px;
1438
- line-height: 16px;
1439
- font-weight: 400;
1440
- color: ${O("neutral",600)};
1441
- text-align: center;
1442
- `,pi=e=>{const l=e.map(((l,a)=>`${a/(e.length-1)*100}%`));return`linear-gradient(to right, ${e.map(((e,a)=>`${e} ${l[a]}`)).join(", ")})`},si=({colors:a,values:i,subLabels:n,isGradient:r})=>e(ni,{children:[r?l(ri,{gradient:pi(a)}):l(oi,{children:a?.map(((e,a)=>l("div",{style:{backgroundColor:e,width:"100%",height:"100%"}},`${e}-${i?.[a]}`)))}),l(ti,{children:i?.map((e=>l("div",{style:{width:r?"auto":`calc(100% / ${i.length})`,display:"flex",justifyContent:"center"},children:l(di,{children:e},e)})))}),n&&n.length?l(ti,{children:n.map((e=>l("div",{style:{width:r?"auto":`calc(100% / ${i.length})`,display:"flex",justifyContent:"center"},children:l(ci,{style:{width:"100%"},children:e},e)})))}):null]}),hi=S.div`
1443
- width: 64px;
1444
- height: 100vh;
1445
- z-index: 100;
1446
- position: fixed;
1447
- top: 0;
1448
- left: 0;
1449
- border-right: 1px solid ${O("neutral",300)};
1450
- background-color: ${O("neutral",200)};
1451
- display: flex;
1452
- flex-direction: column;
1453
- justify-content: space-between;
1454
- `,ui=S(F.Trigger)`
1455
- width: 64px;
1456
- height: 64px;
1457
- background-color: ${O("neutral",200)};
1458
- border-radius: initial;
1459
- border-style: solid;
1460
- border-width: 1px 1px 0px 0px;
1461
- border-color: ${O("neutral",300)};
1462
- cursor: pointer;
1463
- border-left: 2px solid transparent;
1464
- padding: 0 5px;
1465
- display: flex;
1466
- align-items: center;
1467
- justify-content: center;
1468
-
1469
- &:hover {
1470
- background-color: ${O("neutral",100)};
1471
- }
1472
-
1473
- &:active {
1474
- background-color: ${O("neutral",300)} !important;
1475
- }
1476
-
1477
- &:focus-visible {
1478
- background-color: ${O("neutral",200)};
1479
- outline-color: ${O("primary",700)};
1480
- outline-offset: 2px;
1481
- box-shadow: none;
1482
- }
1483
-
1484
- .tab-label p {
1485
- font-size: 10px;
1486
- font-weight: 400;
1487
- line-height: 14px;
1488
- text-align: center;
1489
- color: ${O("neutral",600)};
1490
- }
1491
-
1492
- &[data-selected] {
1493
- background-color: ${O("neutral",100)};
1494
- border-left: 2px solid ${O("secondary",500)};
1495
-
1496
- &:hover {
1497
- background-color: ${O("neutral",200)};
1498
- }
1499
-
1500
- &:focus-visible {
1501
- background-color: ${O("neutral",100)};
1502
- outline-color: ${O("primary",700)};
1503
- outline-offset: 2px;
1504
- box-shadow: none;
1505
- }
1506
-
1507
- .tab-label {
1508
- p {
1509
- font-weight: 700;
1510
- color: ${O("neutral",700)};
1511
- }
1512
-
1513
- svg {
1514
- path {
1515
- fill: ${O("neutral",700)};
1516
- }
1517
- }
1518
- }
1519
-
1520
- &::before {
1521
- content: none;
1522
- }
1523
- }
1524
-
1525
- &[data-disabled] {
1526
- background-color: ${O("neutral",200)} !important;
1527
-
1528
- &[data-selected] {
1529
- background-color: ${O("neutral",100)} !important;
1530
- }
1531
-
1532
- .tab-label {
1533
- p {
1534
- color: ${O("neutral",400)};
1535
- }
1536
-
1537
- svg {
1538
- path {
1539
- fill: ${O("neutral",400)};
1540
- }
1541
- }
1542
- }
1543
- }
1544
- `,xi=S.div`
1545
- display: flex;
1546
- justify-content: center;
1547
- align-items: center;
1548
-
1549
- svg {
1550
- width: 16px;
1551
- height: 16px;
1552
-
1553
- path {
1554
- fill: ${O("neutral",600)};
1555
- }
1556
- }
1557
- `,bi=S(R.Trigger)`
1558
- width: 64px;
1559
- height: 64px;
1560
- background-color: ${O("neutral",200)};
1561
- border-radius: initial;
1562
- border-style: solid;
1563
- border-width: 1px 1px 0px 0px;
1564
- border-color: ${O("neutral",300)};
1565
- cursor: pointer;
1566
- border-left: 2px solid transparent;
1567
- padding: 0 5px;
1568
- display: flex;
1569
- align-items: center;
1570
- justify-content: center;
1571
- flex-direction: column;
1572
- gap: 5px;
1573
-
1574
- &:hover {
1575
- background-color: ${O("neutral",100)};
1576
- }
1577
-
1578
- &:active {
1579
- background-color: ${O("neutral",300)} !important;
1580
- }
1581
-
1582
- &:focus-visible {
1583
- outline-color: ${O("primary",700)};
1584
- outline-offset: 2px;
1585
- box-shadow: none;
1586
- }
1587
-
1588
- .tab-label p {
1589
- font-size: 10px;
1590
- font-weight: 400;
1591
- line-height: 14px;
1592
- text-align: center;
1593
- color: ${O("neutral",600)};
1594
- }
1595
- `,gi=S.div`
1596
- width: 300px;
1597
- height: 100vh;
1598
- z-index: 100;
1599
- position: fixed;
1600
- top: 0;
1601
- left: 64px;
1602
- box-shadow: 2px 0px 2px 0px #0000000d;
1603
- background-color: ${O("neutral",100)};
1604
- overflow-y: auto;
1605
- overflow-x: hidden;
1606
- `,mi=({tabs:i=[],defaultValue:n,onTabClick:o,children:t,onOpenChange:d})=>{const[c,p]=r(!1),[s,h]=r(n||i?.[0]?.value);return e(a,{children:[e(hi,{children:[l(F.Root,{defaultValue:n||i?.[0]?.value,orientation:"horizontal",width:"full",onFocusChange:({focusedValue:e})=>{return h(l=e),void(o&&o(l));var l},role:"tablist",children:l(F.List,{alignItems:"center",border:"none",style:{flexDirection:"column"},children:i.map((a=>l(ui,{"aria-label":a["aria-label"]||a.label,...a,children:e(u,{display:"flex",alignItems:"center",flexDirection:"column",gap:"5px",className:"tab-label",children:[a.icon?l(xi,{children:a.icon}):null,l("p",{children:a.label})]})},a.label)))})}),t?l(R.Root,{onOpenChange:({open:e})=>{p(e),d&&d(!e)},children:e(bi,{children:[l(xi,{children:l(c?le:ee,{})}),e("div",{className:"tab-label",children:[l("p",{children:c?"Show":"Hide"}),l("p",{children:"Sidebar"})]})]})}):null]}),t?l(R.Root,{defaultOpen:!0,open:!c,children:l(R.Content,{children:l(gi,{role:"tabpanel","aria-labelledby":s,children:t})})}):null]})},vi=S.div`
1607
- width: 100%;
1608
- min-width: ${({size:e})=>"small"===e?"234px":"366px"};
1609
- border-radius: 4px;
1610
- padding: ${({size:e})=>"small"===e?"8px 8px 12px 8px":"8px 12px 12px 12px"};
1611
- display: flex;
1612
- align-items: ${({isButtonRight:e})=>e?"center":"flex-start"};
1613
- justify-content: ${({isButtonRight:e})=>e?"space-between":"flex-start"};
1614
- flex-direction: ${({isButtonRight:e})=>e?"row":"column"};
1615
- gap: 8px;
1616
- margin-bottom: 16px;
1617
-
1618
- button {
1619
- margin-left: ${({isButtonRight:e})=>e?0:"24px"};
1620
- }
1621
- `,fi=S.div`
1622
- display: flex;
1623
- align-items: flex-start;
1624
- gap: 8px;
1625
-
1626
- svg {
1627
- margin-top: 6px;
1628
- }
1629
- `,Ci=S.p`
1630
- color: ${O("neutral",800)};
1631
- font-size: ${({size:e})=>"small"===e?"14px":"18px"};
1632
- line-height: ${({size:e})=>"small"===e?"20px":"28px"};
1633
- font-weight: 400;
1634
- `,yi=S.p`
1635
- color: ${O("neutral",700)};
1636
- font-size: ${({size:e})=>"small"===e?"12px":"16px"};
1637
- line-height: ${({size:e})=>"small"===e?"16px":"24px"};
1638
- font-weight: 400;
1639
- margin-left: 24px;
1640
- `,$i=S(vi)`
1641
- background-color: ${O("neutral",100)};
1642
- border: 1px solid ${O("neutral",300)};
1643
- color: ${O("neutral",700)};
1644
- `,wi=S(vi)`
1645
- background-color: ${O("neutral",200)};
1646
- border: 1px solid ${O("neutral",300)};
1647
- color: ${O("neutral",700)};
1648
- `,ki=S(vi)`
1649
- background-color: ${O("success",100)};
1650
- border: 1px solid ${O("success",500)};
1651
- color: ${O("success",500)};
1652
-
1653
- p {
1654
- color: ${O("success",500)};
1655
- }
1656
- `,Li=S(vi)`
1657
- background-color: ${O("warning",100)};
1658
- border: 1px solid ${O("warning",500)};
1659
- color: ${O("warning",500)};
1660
-
1661
- p {
1662
- color: ${O("warning",500)};
1663
- }
1664
- `,zi=S(vi)`
1665
- background-color: ${O("error",100)};
1666
- border: 1px solid ${O("error",500)};
1667
- color: ${O("error",500)};
1668
-
1669
- p {
1670
- color: ${O("error",500)};
1671
- }
1672
- `,Ii=({label:a,caption:i,variant:n,size:r="large",icon:o=l(ne,{height:"16px",width:"16px"}),onActionClick:t,actionLabel:d,isButtonRight:c})=>{let p=$i;return"info-grey"===n?p=wi:"success"===n?p=ki:"warning"===n?p=Li:"error"===n&&(p=zi),e(p,{isButtonRight:c,size:r,"aria-roledescription":"Note",children:[e("div",{children:[e(fi,{children:[o,l(Ci,{size:r,children:a})]}),l(yi,{size:r,children:i})]}),d?l(K,{label:d,variant:"info-white"===n||"info-grey"===n?"primary":"secondary",size:"large"===r?"default":"small",onClick:t}):null]})},Di=S(T.Root)`
1673
- justify-content: space-between;
1674
- align-items: center;
1675
- gap: 8px;
1676
- border-radius: 8px;
1677
- padding: 8px 12px;
1678
- background-color: ${O("neutral",100)};
1679
- border: 1px solid ${O("neutral",300)};
1680
- box-shadow: 0px 4px 6px -4px #0000001a;
1681
- box-shadow: 0px 10px 15px -3px #0000001a;
1682
-
1683
- .icon-container svg {
1684
- width: 20px;
1685
- height: 20px;
1686
- margin-top: 3px;
1687
- }
1688
-
1689
- &[data-type='success'] {
1690
- background-color: ${O("success",100)};
1691
- border: 1px solid ${O("success",500)};
1692
-
1693
- .chakra-toast__title {
1694
- color: ${O("success",500)};
1695
- }
1696
- }
1697
-
1698
- &[data-type='warning'] {
1699
- background-color: ${O("warning",100)};
1700
- border: 1px solid ${O("warning",500)};
1701
-
1702
- .chakra-toast__title {
1703
- color: ${O("warning",500)};
1704
- }
1705
- }
1706
-
1707
- &[data-type='error'] {
1708
- background-color: ${O("error",100)};
1709
- border: 1px solid ${O("error",500)};
1710
-
1711
- .chakra-toast__title {
1712
- color: ${O("error",500)};
1713
- }
1714
- }
1715
- `,Ai=S(T.Title)`
1716
- font-size: 18px;
1717
- line-height: 28px;
1718
- font-weight: 400;
1719
- color: ${O("neutral",800)};
1720
- `,Bi=S(T.Title)`
1721
- font-size: 16px;
1722
- line-height: 24px;
1723
- font-weight: 400;
1724
- color: ${O("neutral",700)};
1725
- `,Mi=S(K)`
1726
- padding: 6px;
1727
- `,Vi=S(K)`
1728
- padding: 6px;
1729
- `,Fi={pauseOnPageIdle:!0,offsets:"24px"},_i={"top-start":E({placement:"top-start",...Fi}),"top-end":E({placement:"top-end",...Fi}),"bottom-start":E({placement:"bottom-start",...Fi}),"bottom-end":E({placement:"bottom-end",...Fi})},Ri=e=>{_i[e.placement].create({title:e.label,description:e.caption,duration:e.duration||5e3,meta:{closable:e.closable,icon:e.icon,closableLabel:e.closableLabel},...e})},Ti=()=>Object.keys(_i).map((a=>l(m,{children:l(H,{toaster:_i[a],insetInline:{mdDown:"4"},children:i=>e(Di,{width:{md:"sm"},children:[e(Z,{flexDirection:"row",className:"icon-container",children:["info"===i.type?i.meta?.icon?i.meta.icon:l(ne,{color:"var(--chakra-colors-neutral-700)"}):null,"loading"===i.type?l(x,{size:"lg",borderWidth:"3px",color:"var(--chakra-colors-primary-500)"}):null,"success"===i.type?i.meta?.icon?i.meta.icon:l(ue,{color:"var(--chakra-colors-success-500)"}):null,"warning"===i.type?i.meta?.icon?i.meta.icon:l(xe,{color:"var(--chakra-colors-warning-500)"}):null,"error"===i.type?i.meta?.icon?i.meta.icon:l(be,{color:"var(--chakra-colors-error-500)"}):null,e(Z,{gap:"1",flex:"1",maxWidth:"100%",children:[l(Ai,{"aria-label":`${i.title}`,children:i.title}),i.description?l(Bi,{"aria-label":`${i.description}`,children:i.description}):null]})]}),i.action||i.meta?.closable?e(Z,{flexDirection:"row",children:[i.action?l(Mi,{label:i.action.label,size:"small",variant:"info"===i.type?"primary":"secondary",onClick:()=>{i?.action?.onClick&&i.action.onClick(),_i[a].dismiss()}}):null,i.meta?.closable?l(Vi,{label:i.meta.closableLabel,"aria-label":i.meta?.closableLabel||"Dismiss",leftIcon:l(oe,{height:"10px!",width:"10px!"}),size:"small",variant:"secondary",onClick:()=>_i[a].dismiss()}):null]}):null]})})},a))),Ei=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[l(Ke,{name:"switch",defaultChecked:!0,onChange:console.log,children:"defaultChecked"}),l(Ke,{name:"switch 2",isLabelOnLeft:!0,children:"isLabelOnLeft"}),l(Ke,{name:"switch 3",children:"Normal Label Positon"}),l(Ke,{name:"switch 4",disabled:!0,children:"disabled"}),l(Ke,{name:"switch 4",disabled:!0,checked:!0,children:"disabled cheked"})]}),Hi=()=>e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[l(K,{label:"Button Label",variant:"primary"}),l(K,{label:"Button Label",variant:"primary",size:"small"})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[l(K,{label:"Button Label",variant:"secondary"}),l(K,{label:"Button Label",variant:"secondary",size:"small"})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[l(K,{label:"Button Label",variant:"borderless"}),l(K,{label:"Button Label",variant:"borderless",size:"small"})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[l(K,{label:"Button Label",variant:"outline"}),l(K,{label:"Button Label",variant:"outline",size:"small"})]})]}),Zi=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[e(He,{name:"radio-group-1",defaultValue:"1",onChange:(e,l)=>console.log(e,l),children:[l(Ee,{value:"1",children:"One"}),l(Ee,{value:"2",children:"Two"}),l(Ee,{value:"3",children:"Three"})]}),e(He,{name:"radio-group-2",defaultValue:"5",horizontal:!0,children:[l(Ee,{value:"4",children:"Four"}),l(Ee,{value:"5",disabled:!0,children:"Five"}),l(Ee,{value:"6",children:"Six"})]})]}),qi=()=>e("div",{style:{width:"300px"},children:[l(wa,{variant:"panel",tabs:[{label:"One",value:"one"},{label:"Two",value:"two"},{label:"Three",value:"three"}],onTabClick:console.log}),l("br",{}),l(wa,{variant:"panel",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two",icon:l(ae,{})},{label:"Three",value:"three"}]}),l("br",{}),l(wa,{variant:"panel",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two",disabled:!0},{label:"Three",value:"three"}]}),l("br",{}),l(wa,{variant:"view",defaultValue:"two",tabs:[{label:"One",value:"one"},{label:"Two",value:"two"},{label:"Three",value:"three"}]})]}),Si=[{label:"Monday",checked:!1,value:"monday"},{label:"Tuesday",checked:!1,value:"tuesday"},{label:"Wednesday",checked:!1,value:"wednesday"},{label:"Thursday",checked:!1,value:"thursday"}],Ni=()=>{const[i,n]=r(Si),o=i.every((e=>e.checked)),t=i.some((e=>e.checked))&&!o,d=i.map(((e,a)=>l(we,{ms:"6",checked:e.checked,onCheckedChange:e=>{n((l=>{const i=[...l];return i[a]={...i[a],checked:!!e.checked},i}))},children:e.label},e.value)));return e(a,{children:[e("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[l(we,{name:"Checkbox",value:"1",defaultChecked:!0,children:"Checkbox"}),l(we,{name:"Checkbox",value:"1",checked:!0,disabled:!0,children:"Checkbox"}),l(we,{name:"Checkbox",value:"1",disabled:!0,children:"Checkbox"})]}),e(Z,{align:"flex-start",children:[l(we,{checked:o,indeterminate:t,onCheckedChange:e=>{n((l=>l.map((l=>({...l,checked:!!e.checked})))))},children:"Weekdays"}),d]})]})},Pi=()=>e(ba,{defaultValue:["1"],children:[l(xa,{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"}]}),l(xa,{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"}]})]}),Oi=()=>e(ba,{defaultValue:["3"],children:[l(xa,{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"}]}),l(xa,{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"}]})]}),ji=()=>e(ba,{defaultValue:["5"],children:[l(xa,{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"}]}),l(xa,{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"}]})]}),Ui="label-1",Wi=()=>{const[a,i]=r(Ui);return e(Da,{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:Ui,onTabClick:i,children:["label-1"===a?l(Pi,{}):null,"label-2"===a?l(Oi,{}):null,"label-3"===a?l(ji,{}):null]})},Gi="label-1",Yi=()=>{const[a,i]=r(Gi);return e(mi,{defaultValue:Gi,onTabClick:e=>{i(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:l(ae,{})},{label:"Label 2",value:"label-2",icon:l(ae,{})},{label:"Label 3",value:"label-3",icon:l(ae,{})}],children:["label-1"===a?l(Wi,{}):null,"label-2"===a?l("div",{children:"content 2"}):null,"label-3"===a?l("div",{children:"content 3"}):null]})},Ki=()=>e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[l(Rl,{label:"Small",size:"small",variant:"info-white",icon:l(ne,{})}),l(Rl,{label:"Default",variant:"info-white",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Large",size:"large",variant:"info-white",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Label",variant:"info-white"}),l(Rl,{label:"Disabled",variant:"info-white",icon:l(ne,{}),closable:!0,disabled:!0})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[l(Rl,{label:"Small",size:"small",variant:"info-grey",icon:l(ne,{})}),l(Rl,{label:"Default",variant:"info-grey",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Large",size:"large",variant:"info-grey",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Label",variant:"info-grey"}),l(Rl,{label:"Disabled",variant:"info-grey",icon:l(ne,{}),closable:!0,disabled:!0})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[l(Rl,{label:"Small",size:"small",variant:"success",icon:l(ne,{})}),l(Rl,{label:"Default",variant:"success",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Large",size:"large",variant:"success",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Label",variant:"success"}),l(Rl,{label:"Disabled",variant:"success",icon:l(ne,{}),closable:!0,disabled:!0})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[l(Rl,{label:"Small",size:"small",variant:"warning",icon:l(ne,{})}),l(Rl,{label:"Default",variant:"warning",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Large",size:"large",variant:"warning",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Label",variant:"warning"}),l(Rl,{label:"Disabled",variant:"warning",icon:l(ne,{}),closable:!0,disabled:!0})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[l(Rl,{label:"Small",size:"small",variant:"error",icon:l(ne,{})}),l(Rl,{label:"Default",variant:"error",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Large",size:"large",variant:"error",icon:l(ne,{}),closable:!0}),l(Rl,{label:"Label",variant:"error"}),l(Rl,{label:"Disabled",variant:"error",icon:l(ne,{}),closable:!0,disabled:!0})]})]}),Ji=()=>e(a,{children:[e("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label"}),l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",isButtonRight:!0})]}),e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label"}),l(Ii,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",isButtonRight:!0})]}),e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",size:"small"}),l(Ii,{label:"Label",caption:"caption",variant:"info-grey",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label"}),l(Ii,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",isButtonRight:!0})]}),e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",size:"small"}),l(Ii,{label:"Label",caption:"caption",variant:"success",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label"}),l(Ii,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",isButtonRight:!0})]}),e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",size:"small"}),l(Ii,{label:"Label",caption:"caption",variant:"warning",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label"}),l(Ii,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",isButtonRight:!0})]}),e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[l(Ii,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",size:"small"}),l(Ii,{label:"Label",caption:"caption",variant:"error",actionLabel:"Label",isButtonRight:!0,size:"small"})]})]})]}),Qi=()=>e("div",{style:{width:"290px"},children:[l(Yl,{label:"Label",caption:"Caption",placeholder:"placeholder",defaultValue:"Default Value",required:!0}),l(Yl,{label:"Label",caption:"Caption",placeholder:"placeholder",size:"small"}),l(Yl,{label:"Label",caption:"Caption",placeholder:"placeholder",errorMessage:"Error Message",required:!0}),l(Yl,{label:"Label",caption:"Caption",placeholder:"placeholder",required:!0,disabled:!0})]}),Xi=()=>e("div",{style:{width:"290px"},children:[l(na,{label:"Label",caption:"Caption",placeholder:"Placeholder",defaultValue:"Default Value",minLength:5,maxLength:200,required:!0}),l(na,{label:"Label",caption:"Caption",placeholder:"Placeholder",size:"small"}),l(na,{label:"Label",caption:"Caption",placeholder:"Placeholder",errorMessage:"Error Message",required:!0}),l(na,{label:"Label",caption:"Caption",placeholder:"Placeholder",required:!0,disabled:!0})]}),en=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:[l(ge,{}),l(ge,{disabled:!0})]}),ln=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"10px"},children:[l(Q,{icon:l(te,{}),"aria-label":"Menu"}),l(Q,{icon:l(ae,{}),"aria-label":"Check"}),l(Q,{icon:l(ne,{}),"aria-label":"Info",disabled:!0})]}),an=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px"},children:[l(We,{width:"280px",min:0,max:100,value:[50]}),l(We,{width:"280px",min:0,max:100,value:[50],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}]}),l(We,{width:"280px",min:0,max:100,value:[50],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}],step:25}),l(We,{width:"280px",value:[20,80]}),l(We,{width:"280px",min:-100,max:100,value:[0],isCentred:!0}),l(We,{width:"280px",value:[70],marks:[0,25,50,75,100],disabled:!0})]}),nn=()=>e("div",{style:{width:"238px"},children:[l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),l(ii,{type:"line",label:"Attribute",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),l(ii,{type:"point",label:"Attribute",color:"#F3FFF2",pointIcon:l(ne,{})})]}),rn=()=>l("div",{style:{width:"238px"},children:e(Fa,{label:"Adjust layer parameters",children:[l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"})]})}),on=()=>e("div",{style:{width:"238px"},children:[l(si,{colors:["#E5F5F9","#2CA25F"],values:["Low","Medium","High"],subLabels:["<100K",">600K"],isGradient:!0}),l(si,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),l(si,{colors:["#A6611A","#DFC27D","#F5F5F5","#80CDC1","#018571"],values:["0%","25%","50%","75%","100%"]}),l(si,{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)"]})]}),tn=({onDrag:a=()=>{},onUpClick:i=()=>{},onDownClick:n=()=>{}})=>l("div",{style:{width:"290px"},children:e(ja,{layerName:"Layer Name",dataUnit:"Data Unit",onDrag:a,onUpClick:i,onDownClick:n,onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[l(si,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e(Fa,{label:"Adjust layer parameters",children:[l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"})]})]})}),dn=({onDrag:a=()=>{},onUpClick:i=()=>{},onDownClick:n=()=>{}})=>l("div",{style:{width:"290px"},children:e(ja,{layerName:"Layer Name 2",dataUnit:"Data Unit",onDrag:a,onUpClick:i,onDownClick:n,onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[l(si,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e(Fa,{label:"Adjust layer parameters",children:[l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"})]})]})}),cn=({onDrag:a=()=>{},onUpClick:i=()=>{},onDownClick:n=()=>{}})=>l("div",{style:{width:"290px"},children:e(ja,{layerName:"Layer Name 3",dataUnit:"Data Unit",onDrag:a,onUpClick:i,onDownClick:n,onRemoveClick:()=>console.log("remove"),onInfoClick:()=>console.log("info"),onOpacityChanged:e=>console.log("opacity changed",e),children:[l(si,{colors:["#EDF8FB","#B2E2E2","#66C2A4","#2CA25F","#006D2C"],values:["0%","25%","50%","75%","100%"]}),l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45",onActionClick:()=>console.log("click"),showActionButton:!0}),l(ii,{type:"raster",label:"Attribute",caption:"Caption",color:"#238B45"}),l(Ii,{label:"Label",caption:"caption",variant:"info-white",actionLabel:"Label",size:"small"}),e(Fa,{label:"Adjust layer parameters",children:[l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"})]})]})}),pn=()=>l(Ga,{legendContent:[l(tn,{}),l(dn,{}),l(cn,{})],analysisContent:l("div",{})}),sn=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px",width:"290px"},children:[l(Hl,{label:"Label",caption:"Caption",placeholder:"Please select",defaultValue:["value-2"],items:[{label:"Label 1",caption:"Caption 1",value:"value-1"},{label:"Label 2",caption:"Caption 2",value:"value-2"},{label:"Label 3",caption:"Caption 3",value:"value-3"}],required:!0}),l(Hl,{label:"Label",caption:"Caption",placeholder:"Please select",size:"small",items:[{label:"Label 1",caption:"Caption 1",value:"value-1"},{label:"Label 2",caption:"Caption 2",value:"value-2"},{label:"Label 3",caption:"Caption 3",value:"value-3"}],required:!0}),l(Hl,{label:"Label",caption:"Caption",placeholder:"Please select",items:[{label:"Label 1",caption:"Caption 1",value:"value-1"},{label:"Label 2",caption:"Caption 2",value:"value-2"},{label:"Label 3",caption:"Caption 3",value:"value-3"}],errorMessage:"Error Message",required:!0}),l(Hl,{label:"Label",caption:"Caption",placeholder:"Please select",defaultValue:["value-2"],items:[{label:"Label 1",caption:"Caption 1",value:"value-1"},{label:"Label 2",caption:"Caption 2",value:"value-2"},{label:"Label 3",caption:"Caption 3",value:"value-3"}],required:!0,disabled:!0}),l(Hl,{label:"Label - multiple",caption:"Caption",placeholder:"Please select",defaultValue:["value-2","value-3"],items:[{label:"Label 1",caption:"Caption 1",value:"value-1"},{label:"Label 2",caption:"Caption 2",value:"value-2"},{label:"Label 3",caption:"Caption 3",value:"value-3"}],required:!0,multiple:!0})]}),hn=()=>e("div",{style:{display:"flex",alignItems:"center",flexDirection:"column",gap:"10px"},children:[e("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[l(ye,{variant:"primary",mainActionLabel:"First Action",mainActionOnClick:()=>console.log("first action"),otherActions:[{label:"Second Action",value:"second-action",onClick:()=>console.log("second action")},{label:"Third Action",value:"third-action",onClick:()=>console.log("third action")}]}),l(ye,{variant:"primary",size:"small",mainActionLabel:"First Action",mainActionOnClick:()=>console.log("first action"),otherActions:[{label:"Second Action",value:"second-action",onClick:()=>console.log("second action")}]})]}),e("div",{style:{display:"flex",alignItems:"center",gap:"10px"},children:[l(ye,{variant:"secondary",mainActionLabel:"First Action",mainActionOnClick:()=>console.log("first action"),otherActions:[{label:"Second Action",value:"second-action",onClick:()=>console.log("second action")}]}),l(ye,{variant:"secondary",size:"small",mainActionLabel:"First Action",mainActionOnClick:()=>console.log("first action"),otherActions:[{label:"Second Action",value:"second-action",onClick:()=>console.log("second action")}]})]})]}),un=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px",width:"366px"},children:[l(nl,{label:"Label",caption:"Caption",defaultValue:"checkbox-2",checkboxes:[{children:"Checkbox 1",name:"checkbox-1",value:"checkbox-1"},{children:"Checkbox 2",name:"checkbox-2",value:"checkbox-2"},{children:"Checkbox 3",name:"checkbox-3",value:"checkbox-3"}],required:!0}),l(nl,{label:"Label",caption:"Caption",defaultValue:"checkbox-2",errorMessage:"Error Message",checkboxes:[{children:"Checkbox 1",name:"checkbox-1",value:"checkbox-1"},{children:"Checkbox 2",name:"checkbox-2",value:"checkbox-2"},{children:"Checkbox 3",name:"checkbox-3",value:"checkbox-3"}],required:!0}),l(nl,{label:"Label",caption:"Caption",checkboxes:[{children:"Checkbox 1",name:"checkbox-1",value:"checkbox-1"},{children:"Checkbox 2",name:"checkbox-2",value:"checkbox-2"},{children:"Checkbox 3",name:"checkbox-3",value:"checkbox-3"}],horizontal:!0,required:!0})]}),xn=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px",width:"366px"},children:[l(hl,{label:"Label",caption:"Caption",name:"radio-list-1",defaultValue:"radio-2",radios:[{children:"Radio 1",value:"radio-1"},{children:"Radio 2",value:"radio-2"},{children:"Radio 3",value:"radio-3"}],required:!0}),l(hl,{label:"Label",caption:"Caption",name:"radio-list-2",defaultValue:"radio-2",errorMessage:"Error Message",radios:[{children:"Radio 1",value:"radio-1"},{children:"Radio 2",value:"radio-2"},{children:"Radio 3",value:"radio-3"}],required:!0}),l(hl,{label:"Label",caption:"Caption",name:"radio-list-3",radios:[{children:"Radio 1",value:"radio-1"},{children:"Radio 2",value:"radio-2"},{children:"Radio 3",value:"radio-3"}],horizontal:!0,required:!0})]}),bn=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[e("div",{style:{display:"flex",gap:"16px"},children:[l(K,{label:"Info - Top Left",variant:"primary",onClick:()=>Ri({label:"Label",caption:"Caption",type:"info",placement:"top-start",action:{label:"Action",onClick:()=>console.log("Action")},closable:!0,closableLabel:"Dismiss"})}),l(K,{label:"Success - Top Right",variant:"primary",onClick:()=>Ri({label:"Label",caption:"Caption",type:"success",placement:"top-end",action:{label:"Action",onClick:()=>console.log("Action")},closable:!0})})]}),e("div",{style:{display:"flex",gap:"16px"},children:[l(K,{label:"Warning - Bottom Left",variant:"primary",onClick:()=>Ri({label:"Label",caption:"Caption",type:"warning",placement:"bottom-start"})}),l(K,{label:"Error - Bottom Right",variant:"primary",onClick:()=>Ri({label:"Label",caption:"Caption",type:"error",placement:"bottom-end"})})]}),l("div",{style:{display:"flex",gap:"16px"},children:l(K,{label:"Loading - Bottom Right",variant:"primary",onClick:()=>Ri({label:"Label",caption:"Caption",type:"loading",placement:"bottom-end",closable:!0})})})]}),gn=()=>e("div",{style:{display:"flex",flexDirection:"column",gap:"20px",width:"420px"},children:[l(Kl,{label:"Continuous",caption:"Caption",sliderItem:{min:0,max:100,value:[30]},onChange:e=>console.log("Continuous",e),required:!0}),l(Kl,{label:"Continuous Small",caption:"Caption",size:"small",sliderItem:{min:0,max:100,value:[60]},onChange:e=>console.log("Continuous Small",e),required:!0}),l(Kl,{label:"Discrete",caption:"Caption",sliderItem:{min:0,max:100,value:[75],marks:[{value:0,label:0},{value:25,label:25},{value:50,label:50},{value:75,label:75},{value:100,label:100}],step:25},onChange:e=>console.log("Discrete",e),required:!0}),l(Kl,{label:"Range",caption:"Caption",sliderItem:{min:0,max:100,value:[20,80]},onChange:e=>console.log("Range",e),required:!0}),l(Kl,{label:"Centered",caption:"Caption",sliderItem:{min:-100,max:100,value:[0],isCentred:!0},onChange:e=>console.log("Centered",e),required:!0})]}),mn=()=>e(Re,{defaultValue:"value-2",children:[l(_e,{label:"Label",caption:"Caption",icon:l(ne,{}),value:"value-1"}),l(_e,{label:"Label",caption:"Caption",icon:l(ne,{}),variant:"centered",value:"value-2"}),e(_e,{label:"Label",caption:"Caption",icon:l(ne,{}),variant:"expanded",value:"value-3",children:[l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"}),l("div",{children:"Component Placeholder"})]}),l(_e,{label:"Label",caption:"Caption",icon:l(ne,{}),value:"value-4",disabled:!0})]});c.createRoot(document.getElementById("root")).render(l(n.StrictMode,{children:l(q,{value:P,children:l((()=>e("div",{className:"App",children:[e("div",{className:"app-container",children:[l("h1",{style:{marginBottom:"20px"},children:"Welcome to WRI OS"}),e("div",{style:{display:"flex",alignItems:"flex-start",flexWrap:"wrap",gap:25},children:[l(mn,{}),l(gn,{}),l(bn,{}),l(xn,{}),l(un,{}),l(hn,{}),l(sn,{}),l(pn,{}),l(tn,{}),l(on,{}),l(rn,{}),l(nn,{}),l(an,{}),l(ln,{}),l(en,{}),l(Qi,{}),l(Xi,{}),l(Ji,{}),l(Ki,{}),l(Ni,{}),l(qi,{}),l(Zi,{}),l(Hi,{}),l(Ei,{})]}),l(Yi,{})]}),l(Ti,{})]})),{})})}));export{K as Button,we as Checkbox,nl as CheckboxList,ge as CloseButton,Q as IconButton,Ii as InlineMessage,xa as LayerGroup,ba as LayerGroupContainer,ua as LayerItem,Da as LayerPanel,Fa as LayerParameters,ja as LegendItem,Ga as LegendPanel,ye as MultiActionButton,mi as NavigationRail,_e as OptionCard,Re as OptionCardGroup,ii as QualitativeAttribute,Ee as Radio,He as RadioGroup,hl as RadioList,si as ScaleBar,Hl as Select,We as Slider,Kl as SliderInput,Ke as Switch,wa as TabBar,Rl as Tag,Yl as TextInput,na as Textarea,Ti as Toast,Ri as showToast};
1730
- //# sourceMappingURL=index.js.map