From c0ac21f309cf0bbc081a350c36a7cbcf695023ca Mon Sep 17 00:00:00 2001 From: luucvanderzee Date: Thu, 7 Mar 2024 17:50:10 +0000 Subject: [PATCH] =?UTF-8?q?Deploying=20to=20cl2-component-library-storyboo?= =?UTF-8?q?k=20from=20=20@=20a2b25d1562142d6c0512b1845048d81c3895cbf0=20?= =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...3b4d5.iframe.bundle.js => 621.3702e134.iframe.bundle.js} | 4 ++-- ...rame.bundle.js.map => 621.3702e134.iframe.bundle.js.map} | 2 +- ...cordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js} | 4 ++-- ...ion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js.map} | 2 +- ...nts-Button-Button-stories-mdx.26475c00.iframe.bundle.js} | 4 ++-- ...Button-Button-stories-mdx.26475c00.iframe.bundle.js.map} | 2 +- ...Button-CardButton-stories-mdx.b090bb21.iframe.bundle.js} | 4 ++-- ...on-CardButton-stories-mdx.b090bb21.iframe.bundle.js.map} | 2 +- ...Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js} | 4 ++-- ...kbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js.map} | 2 +- ...-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js} | 4 ++-- ...orPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js.map} | 2 +- ...oltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js} | 4 ++-- ...p-IconTooltip-stories-mdx.f104e663.iframe.bundle.js.map} | 2 +- ...nents-Input-Input-stories-mdx.f39798db.iframe.bundle.js} | 4 ++-- ...s-Input-Input-stories-mdx.f39798db.iframe.bundle.js.map} | 2 +- ...Input-SearchInput-stories-mdx.68c7be48.iframe.bundle.js} | 6 +++--- ...t-SearchInput-stories-mdx.68c7be48.iframe.bundle.js.map} | 2 +- ...nts-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js} | 6 +++--- ...Select-Select-stories-mdx.f365f2f8.iframe.bundle.js.map} | 2 +- ...Label-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js} | 4 ++-- ...l-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js.map} | 2 +- ...nents-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js} | 4 ++-- ...s-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js.map} | 2 +- docs/iframe.html | 2 +- docs/project.json | 2 +- ...ame.bundle.js => runtime~main.50391573.iframe.bundle.js} | 2 +- 27 files changed, 41 insertions(+), 41 deletions(-) rename docs/{621.7c03b4d5.iframe.bundle.js => 621.3702e134.iframe.bundle.js} (94%) rename docs/{621.7c03b4d5.iframe.bundle.js.map => 621.3702e134.iframe.bundle.js.map} (99%) rename docs/{components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js => components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js} (89%) rename docs/{components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js.map => components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js.map} (99%) rename docs/{components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js => components-Button-Button-stories-mdx.26475c00.iframe.bundle.js} (54%) rename docs/{components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js.map => components-Button-Button-stories-mdx.26475c00.iframe.bundle.js.map} (99%) rename docs/{components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js => components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js} (71%) rename docs/{components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js.map => components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js.map} (99%) rename docs/{components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js => components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js} (83%) rename docs/{components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js.map => components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js.map} (98%) rename docs/{components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js => components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js} (82%) rename docs/{components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js.map => components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js.map} (99%) rename docs/{components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js => components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js} (74%) rename docs/{components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js.map => components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js.map} (98%) rename docs/{components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js => components-Input-Input-stories-mdx.f39798db.iframe.bundle.js} (85%) rename docs/{components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js.map => components-Input-Input-stories-mdx.f39798db.iframe.bundle.js.map} (99%) rename docs/{components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js => components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js} (75%) rename docs/{components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js.map => components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js.map} (99%) rename docs/{components-Select-Select-stories-mdx.838c2537.iframe.bundle.js => components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js} (60%) rename docs/{components-Select-Select-stories-mdx.838c2537.iframe.bundle.js.map => components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js.map} (98%) rename docs/{components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js => components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js} (72%) rename docs/{components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js.map => components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js.map} (97%) rename docs/{components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js => components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js} (93%) rename docs/{components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js.map => components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js.map} (99%) rename docs/{runtime~main.59bcd5ec.iframe.bundle.js => runtime~main.50391573.iframe.bundle.js} (94%) diff --git a/docs/621.7c03b4d5.iframe.bundle.js b/docs/621.3702e134.iframe.bundle.js similarity index 94% rename from docs/621.7c03b4d5.iframe.bundle.js rename to docs/621.3702e134.iframe.bundle.js index 044abca4d89e..55967fc17da3 100644 --- a/docs/621.7c03b4d5.iframe.bundle.js +++ b/docs/621.3702e134.iframe.bundle.js @@ -155,5 +155,5 @@ ${styleUtils.Pv` transform: rotate(180deg); `} -`,icons={close:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z"})}),copy:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"})}),"upload-image":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0.621 79 53.713",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M72.227 39.8C71.234 34.785 66.81 31 61.5 31c-4.215 0-7.867 2.392-9.697 5.885-4.383.473-7.803 4.185-7.803 8.7 0 4.833 3.916 8.75 8.75 8.75h18.96c4.023 0 7.29-3.27 7.29-7.294 0-3.85-2.997-6.97-6.773-7.24zm-7.81 4.325v5.834h-5.833v-5.835H54.21l7.29-7.29 7.29 7.29h-4.374zM27.378 11.803c0 2.73 2.243 4.97 4.978 4.97s4.978-2.24 4.978-4.97-2.244-4.97-4.978-4.97-4.978 2.24-4.978 4.97zm7.466 0c0 1.387-1.1 2.485-2.49 2.485s-2.488-1.098-2.488-2.485c0-1.387 1.1-2.485 2.49-2.485s2.488 1.098 2.488 2.485z"}),(0,jsx_runtime.jsx)("path",{d:"M42.597 37.895h-2.833l-6.222-6.95 8.128-8.62 8.77 9.575c.562-.622 1.187-1.17 1.836-1.685l-9.673-10.57c-.255-.27-.62-.413-.99-.387-.32.018-.62.156-.837.388L31.87 29.08 18.98 14.697c-.28-.32-.707-.474-1.127-.408-.276.044-.53.182-.72.388L2.49 30.38V4.35c0-.71.533-1.244 1.244-1.244h48.533c.71 0 1.245.533 1.245 1.243V29.33c.79-.5 1.618-.932 2.488-1.276V4.35C56 2.305 54.313.62 52.267.62H3.733C1.687.62 0 2.306 0 4.35V36.65c0 2.044 1.687 3.728 3.733 3.728h37.392c.398-.884.89-1.718 1.472-2.485zm-38.864 0c-.71 0-1.245-.533-1.245-1.243v-2.62l15.536-16.657 18.395 20.52H3.732z"})]}),"upload-file":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14,13V17H10V13H7L12,8L17,13M19.35,10.03C18.67,6.59 15.64,4 12,4C9.11,4 6.6,5.64 5.35,8.03C2.34,8.36 0,10.9 0,14A6,6 0 0,0 6,20H19A5,5 0 0,0 24,15C24,12.36 21.95,10.22 19.35,10.03Z"})}),"alert-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11,15H13V17H11V15M11,7H13V13H11V7M12,2C6.47,2 2,6.5 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20Z"})}),check:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"})}),halt:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22 2 17.5 2 12 6.5 2 12 2M12 4C10.1 4 8.4 4.6 7.1 5.7L18.3 16.9C19.3 15.5 20 13.8 20 12C20 7.6 16.4 4 12 4M16.9 18.3L5.7 7.1C4.6 8.4 4 10.1 4 12C4 16.4 7.6 20 12 20C13.9 20 15.6 19.4 16.9 18.3Z"})}),"arrow-right":props=>(0,jsx_runtime.jsx)(MirrorOnRtlSvg,{viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z"})}),"arrow-down":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"m12 20-8-8 1.4-1.425 5.6 5.6V4h2v12.175l5.6-5.6L20 12Z"})}),"arrow-up":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 20V7.825l-5.6 5.6L4 12l8-8 8 8-1.4 1.425-5.6-5.6V20Z"})}),plus:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z"})}),"plus-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),delete:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7 21q-.825 0-1.412-.587Q5 19.825 5 19V6H4V4h5V3h6v1h5v2h-1v13q0 .825-.587 1.413Q17.825 21 17 21Zm2-4h2V8H9Zm4 0h2V8h-2Z"})}),edit:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z"})}),"vote-up":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M23,10C23,8.89 22.1,8 21,8H14.68L15.64,3.43C15.66,3.33 15.67,3.22 15.67,3.11C15.67,2.7 15.5,2.32 15.23,2.05L14.17,1L7.59,7.58C7.22,7.95 7,8.45 7,9V19A2,2 0 0,0 9,21H18C18.83,21 19.54,20.5 19.84,19.78L22.86,12.73C22.95,12.5 23,12.26 23,12V10M1,21H5V9H1V21Z"})}),"vote-down":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,15H23V3H19M15,3H6C5.17,3 4.46,3.5 4.16,4.22L1.14,11.27C1.05,11.5 1,11.74 1,12V14A2,2 0 0,0 3,16H9.31L8.36,20.57C8.34,20.67 8.33,20.77 8.33,20.88C8.33,21.3 8.5,21.67 8.77,21.94L9.83,23L16.41,16.41C16.78,16.05 17,15.55 17,15V5C17,3.89 16.1,3 15,3Z"})}),"chevron-right":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z"})}),"chevron-left":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z"})}),"chevron-up":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z"})}),"chevron-down":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"})}),idea:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,2A7,7 0 0,1 19,9C19,11.38 17.81,13.47 16,14.74V17A1,1 0 0,1 15,18H9A1,1 0 0,1 8,17V14.74C6.19,13.47 5,11.38 5,9A7,7 0 0,1 12,2M9,21V20H15V21A1,1 0 0,1 14,22H10A1,1 0 0,1 9,21M12,4A5,5 0 0,0 7,9C7,11.05 8.23,12.81 10,13.58V16H14V13.58C15.77,12.81 17,11.05 17,9A5,5 0 0,0 12,4Z"})}),"sidebar-input-manager":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 18 25",width:"18px",height:"25px",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Ideas-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary LightBulb-icon",d:"M8.69628 0L8.55598 0.00113636C6.27294 0.0363636 4.03628 1.01705 2.41879 2.68864C0.798979 4.36364 -0.0810757 6.60909 0.00588619 8.84886C0.0963265 11.2034 1.20132 13.4398 3.0368 14.983C3.14463 15.0739 3.20956 15.1784 3.23275 15.2966C3.52378 16.8409 4.20788 20.4545 6.37729 20.4545H11.0153C13.1858 20.4545 13.8931 16.7057 14.1598 15.2943C14.1818 15.1784 14.2468 15.0739 14.3534 14.9841C16.284 13.3602 17.3913 11.0057 17.3913 8.52273C17.3925 3.82386 13.4919 0 8.69628 0Z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Ring-1-icon",d:"M7.3048 0H0.811644C0.363617 0 0 0.339394 0 0.757576C0 1.17576 0.361993 1.51515 0.811644 1.51515H7.3048C7.75283 1.51515 8.11644 1.17576 8.11644 0.757576C8.11644 0.339394 7.75283 0 7.3048 0Z",transform:"translate(4.63794 20.4545)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-secondary Ring-2-icon",d:"M5.21771 0H0.579746C0.259726 0 0 0.339394 0 0.757576C0 1.17576 0.258567 1.51515 0.579746 1.51515H5.21771C5.53773 1.51515 5.79746 1.17576 5.79746 0.757576C5.79746 0.339394 5.53773 0 5.21771 0Z",transform:"translate(5.79761 21.9697)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Ring-3-icon",d:"M2.89873 0H0.579746C0.259726 0 0 0.339394 0 0.757576C0 1.17576 0.258567 1.51515 0.579746 1.51515H2.89873C3.21875 1.51515 3.47848 1.17576 3.47848 0.757576C3.47848 0.339394 3.21875 0 2.89873 0Z",transform:"translate(6.95703 23.4848)"})]})}),"sidebar-proposals":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"26px",height:"19px",viewBox:"0 0 26 19",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",d:"M1.18286 4.07342C1.37569 5.24106 1.55655 6.34353 2.20154 6.98852C2.86116 7.64814 3.72825 7.97795 4.59533 7.97795C5.23101 7.97795 5.86403 7.79709 6.41726 7.44334C7.96258 9.60705 9.97336 15.7684 10.6662 18.1409C10.75 18.4255 11.0093 18.6183 11.3046 18.6183C11.3099 18.6183 11.3152 18.6183 11.3205 18.6183C11.6211 18.6117 11.8804 18.4016 11.9509 18.109C11.9575 18.0837 12.2847 16.7764 13.2728 14.8242C14.3261 15.5636 15.5416 15.9532 16.7651 15.9519C18.3237 15.9519 19.877 15.3561 21.0619 14.1712C22.2003 13.0328 22.546 10.9303 22.9118 8.70539C23.3067 6.30629 23.715 3.82473 25.0728 2.4656C25.263 2.27542 25.3202 1.9895 25.2164 1.74081C25.114 1.49213 24.8707 1.32988 24.602 1.32988C19.6123 1.32988 15.0602 2.90313 12.427 5.53629C10.9069 7.05634 10.3072 9.3065 10.8644 11.4117C10.9322 11.6697 11.149 11.8625 11.4136 11.8998C11.6796 11.937 11.9403 11.8147 12.0772 11.5846C13.2954 9.56051 14.7982 7.64947 16.543 5.90334C16.8023 5.64401 17.2239 5.64401 17.4832 5.90334C17.7425 6.16266 17.7425 6.58424 17.4832 6.84356C16.9725 7.35424 16.5084 7.86092 16.0682 8.36362C16.0256 8.41282 15.9858 8.46203 15.9432 8.51123C13.451 11.3944 12.0573 14.0781 11.3405 15.8123C10.4761 13.11 8.85626 8.47001 7.37744 6.50976C8.28574 5.19185 8.15941 3.37125 6.98778 2.20095C5.59008 0.801918 3.2854 0 0.665532 0C0.396896 0 0.153528 0.162245 0.0511275 0.410933C-0.0526031 0.65962 0.00458148 0.945545 0.194754 1.13572C0.79985 1.73948 0.994012 2.92707 1.18286 4.07342Z"})}),"user-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z"})}),notification:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,19V20H3V19L5,17V11C5,7.9 7.03,5.17 10,4.29C10,4.19 10,4.1 10,4A2,2 0 0,1 12,2A2,2 0 0,1 14,4C14,4.1 14,4.19 14,4.29C16.97,5.17 19,7.9 19,11V17L21,19M14,21A2,2 0 0,1 12,23A2,2 0 0,1 10,21"})}),search:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z"})}),lock:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z"})}),facebook:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"4.588 4.588 257.717 257.719",...props,children:(0,jsx_runtime.jsx)("path",{d:"M248.082 4.588H18.812c-7.856 0-14.224 6.367-14.224 14.224v229.27c0 7.855 6.366 14.226 14.224 14.226h123.432v-99.803H108.66V123.61h33.584V94.924c0-33.287 20.33-51.413 50.024-51.413 14.225 0 26.45 1.06 30.012 1.533v34.788l-20.596.01c-16.147 0-19.274 7.673-19.274 18.934v24.832h38.515l-5.016 38.895h-33.5v99.803h65.673c7.854 0 14.223-6.37 14.223-14.225V18.813c0-7.858-6.37-14.225-14.224-14.225z"})}),"facebook-messenger":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"96.216 93 2484.567 2500",...props,children:(0,jsx_runtime.jsx)("path",{d:"M1338.5 93C652.405 93 96.216 611.187 96.216 1250.407c0 364.236 180.648 689.128 462.963 901.289V2593l422.986-233.588c112.886 31.436 232.477 48.402 356.335 48.402 686.096 0 1242.283-518.187 1242.283-1157.407S2024.596 93 1338.5 93zm123.456 1558.643l-316.357-339.507-617.284 339.507 679.012-725.31 324.074 339.507 609.568-339.507-679.013 725.31z"})}),twitter:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"1.001 0.991 298.004 242.19",...props,children:(0,jsx_runtime.jsx)("path",{d:"M94.72 243.182c112.46 0 173.96-93.168 173.96-173.96 0-2.646-.054-5.28-.173-7.903 11.938-8.63 22.314-19.4 30.498-31.66-10.955 4.868-22.744 8.146-35.11 9.625 12.623-7.57 22.313-19.543 26.886-33.817-11.812 7.003-24.895 12.093-38.823 14.84C240.8 8.426 224.917.994 207.327.994c-33.763 0-61.143 27.38-61.143 61.132 0 4.798.536 9.465 1.585 13.94-50.816-2.557-95.875-26.886-126.03-63.88-5.252 9.035-8.28 19.53-8.28 30.73 0 21.212 10.795 39.938 27.21 50.893-10.032-.31-19.455-3.063-27.69-7.646-.01.257-.01.507-.01.78 0 29.61 21.075 54.332 49.052 59.935-5.138 1.4-10.543 2.15-16.122 2.15-3.934 0-7.767-.386-11.49-1.102 7.782 24.293 30.353 41.97 57.114 42.465-20.927 16.402-47.287 26.17-75.938 26.17-4.93 0-9.798-.28-14.584-.845 27.06 17.344 59.19 27.464 93.722 27.464"})}),"microsoft-windows":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3,12V6.75L9,5.43V11.91L3,12M20,3V11.75L10,11.9V5.21L20,3M3,13L9,13.09V19.9L3,18.75V13M20,13.25V22L10,20.09V13.1L20,13.25Z"})}),google:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 533.5 544.3",...props,children:[(0,jsx_runtime.jsx)("path",{fill:"#4285f4",d:"M533.5 278.4c0-18.5-1.5-37.1-4.7-55.3H272.1v104.8h147c-6.1 33.8-25.7 63.7-54.4 82.7v68h87.7c51.5-47.4 81.1-117.4 81.1-200.2z"}),(0,jsx_runtime.jsx)("path",{fill:"#34a853",d:"M272.1 544.3c73.4 0 135.3-24.1 180.4-65.7l-87.7-68c-24.4 16.6-55.9 26-92.6 26-71 0-131.2-47.9-152.8-112.3H28.9v70.1c46.2 91.9 140.3 149.9 243.2 149.9z"}),(0,jsx_runtime.jsx)("path",{fill:"#fbbc04",d:"M119.3 324.3c-11.4-33.8-11.4-70.4 0-104.2V150H28.9c-38.6 76.9-38.6 167.5 0 244.4l90.4-70.1z"}),(0,jsx_runtime.jsx)("path",{fill:"#ea4335",d:"M272.1 107.7c38.8-.6 76.3 14 104.4 40.8l77.7-77.7C405 24.6 339.7-.8 272.1 0 169.2 0 75.1 58 28.9 150l90.4 70.1c21.5-64.5 81.8-112.4 152.8-112.4z"})]}),hoplr:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 141 164","fill-rule":"evenodd","clip-rule":"evenodd","stroke-linejoin":"round","stroke-miterlimit":"1.414",...props,children:[(0,jsx_runtime.jsx)("path",{fill:"#ff314b",d:"M69.399.001c5.638.095 11.219 2.232 15.516 5.94 11.947 10.562 23.82 21.229 35.689 31.914 10.936 9.98 17.471 24.629 17.62 39.576.051 15.57.05 31.141 0 46.712-.188 20.202-17.081 38.926-38.598 39.133-20.33.065-40.66.065-60.99 0C18.748 163.084.242 145.959.038 124.143-.011 108.572-.014 93 .038 77.43c.148-14.906 6.654-29.57 17.62-39.576C29.46 27.231 41.327 16.69 53.158 6.11 57.626 2.16 63.458-.032 69.399 0zm-.294 22.172c-.52.01-1.032.196-1.437.53C55.56 32.913 44.01 43.784 32.234 54.386c-6.406 5.846-10.24 14.431-10.326 23.193-.052 15.512-.145 31.025 0 46.537.14 8.903 7.78 16.9 16.866 16.987 20.275.065 40.55.194 60.824 0 8.764-.142 16.669-7.75 16.757-17.1.048-15.474.05-30.95 0-46.424-.087-8.762-3.898-17.327-10.327-23.193-11.754-10.58-23.57-21.077-35.343-31.605a2.348 2.348 0 0 0-1.58-.608z",fillRule:"nonzero"}),(0,jsx_runtime.jsx)("path",{fill:"none",d:"M0 0h140.87v163.324H0z"})]}),comment:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4z"})}),comments:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,12V3A1,1 0 0,0 16,2H3A1,1 0 0,0 2,3V17L6,13H16A1,1 0 0,0 17,12M21,6H19V15H6V17A1,1 0 0,0 7,18H18L22,22V7A1,1 0 0,0 21,6Z"})}),"info-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z"})}),"calendar-range":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M9,10H7V12H9V10M13,10H11V12H13V10M17,10H15V12H17V10M19,3H18V1H16V3H8V1H6V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3M19,19H5V8H19V19Z"})}),calendar:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1M17,12H12V17H17V12Z"})}),power:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16.56,5.44L15.11,6.89C16.84,7.94 18,9.83 18,12A6,6 0 0,1 12,18A6,6 0 0,1 6,12C6,9.83 7.16,7.94 8.88,6.88L7.44,5.44C5.36,6.88 4,9.28 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12C20,9.28 18.64,6.88 16.56,5.44M13,3H11V13H13"})}),"shield-checkered":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 22q-3.475-.875-5.737-3.988Q4 14.9 4 11.1V5l8-3 8 3v6.1q0 3.8-2.262 6.912Q15.475 21.125 12 22Zm0-2.1q2.425-.75 4.05-2.962 1.625-2.213 1.9-4.938H12V4.125l-6 2.25v5.175q0 .175.05.45H12Z"})}),"sidebar-settings":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"25px",height:"26px",viewBox:"0 0 25 26",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Settings-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Gear-Big-icon",d:"M16.9145 10.4054C16.9362 10.1898 16.9481 9.96992 16.9481 9.75C16.9481 9.52683 16.9351 9.30475 16.9134 9.08158L18.637 7.72958C19.0183 7.40783 19.1104 6.86725 18.8613 6.45233L17.0153 3.26192C16.7672 2.85025 16.2797 2.65525 15.7824 2.8405L13.775 3.64758C13.4143 3.39083 13.0383 3.17092 12.6375 2.98242L12.3331 0.821167C12.2464 0.35425 11.8196 0 11.3418 0H7.65851C7.17751 0 6.75067 0.361833 6.66184 0.860167L6.36176 2.99975C5.95659 3.19042 5.57634 3.4125 5.22426 3.66167L3.20492 2.84917C2.75534 2.68233 2.23426 2.86 1.98076 3.2825L0.143424 6.45883C-0.110076 6.88133 -0.0169095 7.42083 0.378507 7.75558L2.08584 9.0935C2.06526 9.31017 2.05226 9.53008 2.05226 9.75C2.05226 9.97317 2.06526 10.1952 2.08692 10.4184L0.36334 11.7704C-0.0179929 12.0922 -0.110076 12.6328 0.139091 13.0477L1.98509 16.2381C2.23317 16.6508 2.72176 16.848 3.21792 16.6595L5.22534 15.8524C5.58609 16.1092 5.96201 16.3291 6.36284 16.5176L6.66726 18.6788C6.75501 19.1458 7.18076 19.5 7.65851 19.5H11.3418C11.8228 19.5 12.2497 19.1382 12.3385 18.6398L12.6386 16.5013C13.0438 16.3096 13.424 16.0875 13.775 15.8383L15.7943 16.6508C15.9081 16.6942 16.0283 16.7158 16.1508 16.7158C16.5072 16.7158 16.83 16.5328 17.0196 16.2186L18.8569 13.0422C19.1104 12.6197 19.0173 12.0802 18.6218 11.7455L16.9145 10.4054ZM9.50017 11.9167C8.30526 11.9167 7.33351 10.9449 7.33351 9.75C7.33351 8.55508 8.30526 7.58333 9.50017 7.58333C10.6951 7.58333 11.6668 8.55508 11.6668 9.75C11.6668 10.9449 10.6951 11.9167 9.50017 11.9167Z",transform:"translate(0 6.5)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Gear-Small-icon",d:"M10.2882 6.27575L9.48332 5.65175C9.48981 5.57483 9.49307 5.49683 9.49307 5.41667C9.49307 5.33542 9.4909 5.25633 9.48657 5.17725L10.3066 4.53375C10.5861 4.28458 10.6576 3.88267 10.4735 3.54683L9.50498 1.872C9.36957 1.62283 9.10523 1.46792 8.81707 1.46792C8.74773 1.46792 8.58956 1.49608 8.52456 1.52208L7.59073 1.898C7.45531 1.80808 7.3199 1.729 7.18231 1.66075L7.04365 0.703083C7.01223 0.30875 6.67206 0 6.27015 0H4.32015C3.93881 0 3.60515 0.28275 3.54015 0.6695L3.39715 1.66725C3.25415 1.73983 3.11981 1.81675 2.99198 1.89908L2.03865 1.51558C1.97906 1.49392 1.83173 1.46792 1.76781 1.46792C1.49481 1.46792 1.2424 1.60658 1.08098 1.86008L0.100564 3.55767C-0.0868525 3.9 -0.00776914 4.30842 0.299898 4.55542L1.10265 5.18375C1.0994 5.26067 1.09723 5.33758 1.09723 5.41667C1.09723 5.49575 1.0994 5.57267 1.10265 5.6485L0.274981 6.29742C-0.00560221 6.54658 -0.0781853 6.9485 0.107065 7.2865L1.07556 8.96133C1.21098 9.2105 1.47531 9.36542 1.76348 9.36542C1.83281 9.36542 1.99098 9.33725 2.05598 9.31125L2.98982 8.93533C3.12523 9.02525 3.26065 9.10433 3.39823 9.17258L3.54232 10.1757C3.60623 10.5571 3.9334 10.8333 4.32015 10.8333H6.27015C6.65148 10.8333 6.98515 10.5506 7.05015 10.1638L7.19315 9.165C7.33506 9.0935 7.46831 9.0155 7.5929 8.93533L8.55056 9.31883C8.61015 9.3405 8.75748 9.3665 8.8214 9.3665C9.0944 9.3665 9.34682 9.22783 9.50823 8.97433L10.4897 7.27458C10.6674 6.94742 10.5948 6.54658 10.2882 6.27575ZM5.29515 6.5C4.69823 6.5 4.21182 6.01358 4.21182 5.41667C4.21182 4.81975 4.69823 4.33333 5.29515 4.33333C5.89207 4.33333 6.37848 4.81975 6.37848 5.41667C6.37848 6.01358 5.89315 6.5 5.29515 6.5Z",transform:"translate(13.9551)"})]})}),send:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M2,21L23,12L2,3V10L17,12L2,14V21Z"})}),group:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16 17V19H2V17S2 13 9 13 16 17 16 17M12.5 7.5A3.5 3.5 0 1 0 9 11A3.5 3.5 0 0 0 12.5 7.5M15.94 13A5.32 5.32 0 0 1 18 17V19H22V17S22 13.37 15.94 13M15 4A3.39 3.39 0 0 0 13.07 4.59A5 5 0 0 1 13.07 10.41A3.39 3.39 0 0 0 15 11A3.5 3.5 0 0 0 15 4Z"})}),building:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.5,1L2,6V8H21V6M16,10V17H19V10M2,22H21V19H2M10,10V17H13V10M4,10V17H7V10H4Z"})}),position:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,11.5A2.5,2.5 0 0,1 9.5,9A2.5,2.5 0 0,1 12,6.5A2.5,2.5 0 0,1 14.5,9A2.5,2.5 0 0,1 12,11.5M12,2A7,7 0 0,0 5,9C5,14.25 12,22 12,22C12,22 19,14.25 19,9A7,7 0 0,0 12,2Z"})}),mention:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,15C12.81,15 13.5,14.7 14.11,14.11C14.7,13.5 15,12.81 15,12C15,11.19 14.7,10.5 14.11,9.89C13.5,9.3 12.81,9 12,9C11.19,9 10.5,9.3 9.89,9.89C9.3,10.5 9,11.19 9,12C9,12.81 9.3,13.5 9.89,14.11C10.5,14.7 11.19,15 12,15M12,2C14.75,2 17.1,3 19.05,4.95C21,6.9 22,9.25 22,12V13.45C22,14.45 21.65,15.3 21,16C20.3,16.67 19.5,17 18.5,17C17.3,17 16.31,16.5 15.56,15.5C14.56,16.5 13.38,17 12,17C10.63,17 9.45,16.5 8.46,15.54C7.5,14.55 7,13.38 7,12C7,10.63 7.5,9.45 8.46,8.46C9.45,7.5 10.63,7 12,7C13.38,7 14.55,7.5 15.54,8.46C16.5,9.45 17,10.63 17,12V13.45C17,13.86 17.16,14.22 17.46,14.53C17.76,14.84 18.11,15 18.5,15C18.92,15 19.27,14.84 19.57,14.53C19.87,14.22 20,13.86 20,13.45V12C20,9.81 19.23,7.93 17.65,6.35C16.07,4.77 14.19,4 12,4C9.81,4 7.93,4.77 6.35,6.35C4.77,7.93 4,9.81 4,12C4,14.19 4.77,16.07 6.35,17.65C7.93,19.23 9.81,20 12,20H17V22H12C9.25,22 6.9,21 4.95,19.05C3,17.1 2,14.75 2,12C2,9.25 3,6.9 4.95,4.95C6.9,3 9.25,2 12,2Z"})}),"dots-horizontal":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z"})}),map:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15,19L9,16.89V5L15,7.11M20.5,3C20.44,3 20.39,3 20.34,3L15,5.1L9,3L3.36,4.9C3.15,4.97 3,5.15 3,5.38V20.5A0.5,0.5 0 0,0 3.5,21C3.55,21 3.61,21 3.66,20.97L9,18.9L15,21L20.64,19.1C20.85,19 21,18.85 21,18.62V3.5A0.5,0.5 0 0,0 20.5,3Z"})}),gps:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,8A4,4 0 0,1 16,12A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8M3.05,13H1V11H3.05C3.5,6.83 6.83,3.5 11,3.05V1H13V3.05C17.17,3.5 20.5,6.83 20.95,11H23V13H20.95C20.5,17.17 17.17,20.5 13,20.95V23H11V20.95C6.83,20.5 3.5,17.17 3.05,13M12,5A7,7 0 0,0 5,12A7,7 0 0,0 12,19A7,7 0 0,0 19,12A7,7 0 0,0 12,5Z"})}),"location-simple":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 36 48",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16.2 47C2.5 27.3 0 25.3 0 18a18 18 0 1136 0c0 7.3-2.5 9.3-16.2 29a2.3 2.3 0 01-3.6 0z"})}),timeline:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3,14L3.5,14.07L8.07,9.5C7.89,8.85 8.06,8.11 8.59,7.59C9.37,6.8 10.63,6.8 11.41,7.59C11.94,8.11 12.11,8.85 11.93,9.5L14.5,12.07L15,12C15.18,12 15.35,12 15.5,12.07L19.07,8.5C19,8.35 19,8.18 19,8A2,2 0 0,1 21,6A2,2 0 0,1 23,8A2,2 0 0,1 21,10C20.82,10 20.65,10 20.5,9.93L16.93,13.5C17,13.65 17,13.82 17,14A2,2 0 0,1 15,16A2,2 0 0,1 13,14L13.07,13.5L10.5,10.93C10.18,11 9.82,11 9.5,10.93L4.93,15.5L5,16A2,2 0 0,1 3,18A2,2 0 0,1 1,16A2,2 0 0,1 3,14Z"})}),survey:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 30 30",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M15 1C14.3416 1.00402 13.6958 1.17679 13.128 1.50089C12.5629 1.82261 12.0963 2.28491 11.776 2.84022H3V29H27V2.82622H18.224C17.904 2.274 17.4352 1.81511 16.8688 1.49311C16.3011 1.17226 15.6566 1.0022 15 1ZM13.68 5.29489L13.8976 4.32578C13.954 4.08387 14.0941 3.86809 14.2944 3.71444C14.4445 3.59981 14.6218 3.52368 14.8101 3.49304C14.9983 3.46241 15.1915 3.47824 15.3718 3.5391C15.5521 3.59996 15.7138 3.70389 15.842 3.84135C15.9702 3.97881 16.0609 4.14538 16.1056 4.32578L16.3232 5.29489H18.1184V6.38378H11.8848V5.27933L13.68 5.29489ZM24.4448 26.5453H5.5552V5.28089H9.3296V8.82444H20.6704V5.27778H24.4448V26.5453Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M7.1712 17.0953H13.4528V11.0644H7.1712V17.0953ZM9.728 13.5176H10.896V14.6422H9.728V13.5176Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M22.8272 12.8533H14.7536V15.3064H22.8272V12.8533Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M7.1712 24.4578H13.4528V18.4269H7.1712V24.4593V24.4578ZM9.728 20.8816H10.896V22.0047H9.728V20.8816Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M22.8272 20.2173H14.7536V22.6704H22.8272V20.2173Z",fill:props.fill})]}),download:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z"})}),"user-check":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.1,12.5L22.5,13.91L15.97,20.5L12.5,17L13.9,15.59L15.97,17.67L21.1,12.5M10,17L13,20H3V18C3,15.79 6.58,14 11,14L12.89,14.11L10,17M11,4A4,4 0 0,1 15,8A4,4 0 0,1 11,12A4,4 0 0,1 7,8A4,4 0 0,1 11,4Z"})}),label:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17.63,5.84C17.27,5.33 16.67,5 16,5H5A2,2 0 0,0 3,7V17A2,2 0 0,0 5,19H16C16.67,19 17.27,18.66 17.63,18.15L22,12L17.63,5.84Z"})}),"arrow-left":props=>(0,jsx_runtime.jsx)(MirrorOnRtlSvg,{viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z"})}),"shield-check":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,17L6,13L7.41,11.59L10,14.17L16.59,7.58L18,9M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1Z"})}),"sidebar-pages-menu":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 53 70",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Blank-Page-icon",children:[(0,jsx_runtime.jsx)("path",{className:"Fillin-Paper-icon",d:"M8.5 7.75L17 0H51V66H0V17.5L8.5 7.75Z",transform:"translate(2 1)",fill:"rgba(1, 161, 177, 0.2)"}),(0,jsx_runtime.jsxs)("g",{className:"Stroke-Paper-icon",children:[(0,jsx_runtime.jsx)("path",{d:"M51.5278 70H1.47222C0.659556 70 0 69.3467 0 68.5417V18.9583C0 18.5704 0.156055 18.2 0.429889 17.9258L18.0966 0.425833C18.3733 0.154583 18.7473 0 19.1389 0H51.5278C52.3404 0 53 0.653333 53 1.45833V68.5417C53 69.3467 52.3404 70 51.5278 70ZM2.94444 67.0833H50.0556V2.91667H19.7484L2.94444 19.5621V67.0833Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M19.1389 20.4167H1.47222C0.659556 20.4167 0 19.7633 0 18.9583C0 18.1533 0.659556 17.5 1.47222 17.5H17.6667V1.45833C17.6667 0.653333 18.3262 0 19.1389 0C19.9516 0 20.6111 0.653333 20.6111 1.45833V18.9583C20.6111 19.7633 19.9516 20.4167 19.1389 20.4167Z",fill:"#01A1B1"})]})]})}),"email-2":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 60 40",...props,children:(0,jsx_runtime.jsx)("path",{d:"M53.75 0H6.25A6.259 6.259 0 0 0 0 6.25v27.5A6.259 6.259 0 0 0 6.25 40h47.5A6.259 6.259 0 0 0 60 33.75V6.25A6.259 6.259 0 0 0 53.75 0zm-31.7 22.21l-15 12.5c-.232.195-.518.29-.8.29a1.252 1.252 0 0 1-.803-2.212l15-12.5c.53-.44 1.32-.368 1.763.16.442.532.37 1.322-.16 1.762zm7.95.332a6.98 6.98 0 0 1-3.953-1.232L5.546 7.283a1.252 1.252 0 0 1-.327-1.738 1.246 1.246 0 0 1 1.737-.325l20.502 14.027a4.476 4.476 0 0 0 5.083 0L53.042 5.22a1.25 1.25 0 0 1 1.413 2.063L33.953 21.31A6.98 6.98 0 0 1 30 22.543zM54.71 34.55a1.244 1.244 0 0 1-1.76.16l-15-12.5a1.252 1.252 0 0 1-.16-1.762c.443-.528 1.23-.6 1.763-.16l15 12.5c.527.442.6 1.232.157 1.762z",fill:"#01A1B1",fillOpacity:".25"})}),"minus-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,13H7V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),"sidebar-guide":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"23px",height:"23px",viewBox:"0 0 23 23",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.5 0C5.159 0 0 5.159 0 11.5C0 17.841 5.159 23 11.5 23C17.841 23 23 17.841 23 11.5C23 5.159 17.841 0 11.5 0ZM11.5 19C10.949 19 10.5 18.552 10.5 18C10.5 17.448 10.949 17 11.5 17C12.051 17 12.5 17.448 12.5 18C12.5 18.552 12.051 19 11.5 19ZM15 9.258C15 10.18 14.626 11.081 13.975 11.733L12.733 12.975C12.267 13.439 12 14.084 12 14.742V15.5C12 15.776 11.776 16 11.5 16C11.224 16 11 15.776 11 15.5V14.742C11 13.82 11.374 12.919 12.025 12.267L13.267 11.025C13.733 10.561 14 9.916 14 9.258V8.5C14 7.121 12.878 6 11.5 6C10.122 6 9 7.121 9 8.5V9.5C9 9.776 8.776 10 8.5 10C8.224 10 8 9.776 8 9.5V8.5C8 6.57 9.57 5 11.5 5C13.43 5 15 6.57 15 8.5V9.258Z",fill:"#32B67A"})}),paperclip:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16.5,6V17.5A4,4 0 0,1 12.5,21.5A4,4 0 0,1 8.5,17.5V5A2.5,2.5 0 0,1 11,2.5A2.5,2.5 0 0,1 13.5,5V15.5A1,1 0 0,1 12.5,16.5A1,1 0 0,1 11.5,15.5V6H10V15.5A2.5,2.5 0 0,0 12.5,18A2.5,2.5 0 0,0 15,15.5V5A4,4 0 0,0 11,1A4,4 0 0,0 7,5V17.5A5.5,5.5 0 0,0 12.5,23A5.5,5.5 0 0,0 18,17.5V6H16.5Z"})}),code:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14.6,16.6L19.2,12L14.6,7.4L16,6L22,12L16,18L14.6,16.6M9.4,16.6L4.8,12L9.4,7.4L8,6L2,12L8,18L9.4,16.6Z"})}),"question-bubble":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 17.391 20",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15.459 0H1.932C.865 0 0 .853 0 1.905v13.333c0 1.053.865 1.904 1.932 1.904h3.865L8.696 20l2.898-2.857h3.865c1.067 0 1.932-.852 1.932-1.904V1.905C17.391.853 16.526 0 15.459 0zM9.662 15.238H7.729v-1.904h1.933v1.904zm1.995-7.376l-.864.876c-.696.686-1.131 1.262-1.131 2.691H7.729v-.477c0-1.052.435-2.004 1.13-2.695l1.203-1.2c.348-.343.565-.819.565-1.343 0-1.052-.864-1.905-1.932-1.905s-1.932.853-1.932 1.905H4.831c0-2.105 1.729-3.81 3.865-3.81s3.865 1.705 3.865 3.81c0 .838-.344 1.596-.904 2.148z"})}),"question-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11,18H13V16H11V18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,6A4,4 0 0,0 8,10H10A2,2 0 0,1 12,8A2,2 0 0,1 14,10C14,12 11,11.75 11,15H13C13,12.75 16,12.5 16,10A4,4 0 0,0 12,6Z"})}),refresh:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z"})}),translate:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12.87,15.07L10.33,12.56L10.36,12.53C12.1,10.59 13.34,8.36 14.07,6H17V4H10V2H8V4H1V6H12.17C11.5,7.92 10.44,9.75 9,11.35C8.07,10.32 7.3,9.19 6.69,8H4.69C5.42,9.63 6.42,11.17 7.67,12.56L2.58,17.58L4,19L9,14L12.11,17.11L12.87,15.07M18.5,10H16.5L12,22H14L15.12,19H19.87L21,22H23L18.5,10M15.88,17L17.5,12.67L19.12,17H15.88Z"})}),share:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,12L14,5V9C7,10 4,15 3,20C5.5,16.5 9,14.9 14,14.9V19L21,12Z"})}),flash:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7,2V13H10V22L17,10H13L17,2H7Z"})}),database:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 11q-3.75 0-6.375-1.175T3 7q0-1.65 2.625-2.825Q8.25 3 12 3t6.375 1.175Q21 5.35 21 7q0 1.65-2.625 2.825Q15.75 11 12 11Zm0 5q-3.75 0-6.375-1.175T3 12V9.5q0 1.1 1.025 1.863 1.025.762 2.45 1.237 1.425.475 2.963.687 1.537.213 2.562.213t2.562-.213q1.538-.212 2.963-.687 1.425-.475 2.45-1.237Q21 10.6 21 9.5V12q0 1.65-2.625 2.825Q15.75 16 12 16Zm0 5q-3.75 0-6.375-1.175T3 17v-2.5q0 1.1 1.025 1.863 1.025.762 2.45 1.237 1.425.475 2.963.688 1.537.212 2.562.212t2.562-.212q1.538-.213 2.963-.688t2.45-1.237Q21 15.6 21 14.5V17q0 1.65-2.625 2.825Q15.75 21 12 21Z"})}),"folder-move":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14,18V15H10V11H14V8L19,13M20,6H12L10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6Z"})}),"user-data":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 9C11 10.66 9.66 12 8 12C6.34 12 5 10.66 5 9C5 7.34 6.34 6 8 6C9.66 6 11 7.34 11 9M14 20H2V18C2 15.79 4.69 14 8 14C11.31 14 14 15.79 14 18M22 12V14H13V12M22 8V10H13V8M22 4V6H13V4Z"})}),settings:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z"})}),initiatives:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 26 19",...props,children:(0,jsx_runtime.jsx)("path",{d:"M1.183 4.073c.193 1.168.374 2.27 1.019 2.916a3.382 3.382 0 0 0 4.216.455c1.545 2.163 3.555 8.324 4.248 10.697a.664.664 0 0 0 .639.477h.015c.301-.006.56-.216.63-.509.008-.025.335-1.333 1.323-3.285 1.053.74 2.269 1.13 3.492 1.128a6.057 6.057 0 0 0 4.297-1.78c1.138-1.14 1.484-3.242 1.85-5.467.395-2.399.803-4.88 2.16-6.24a.665.665 0 1 0-.47-1.136c-4.99 0-9.542 1.574-12.175 4.207-1.52 1.52-2.12 3.77-1.563 5.876a.664.664 0 0 0 1.213.173 29.822 29.822 0 0 1 4.466-5.682.665.665 0 0 1 .94.94c-.51.511-.975 1.018-1.415 1.52-.042.05-.082.099-.125.148-2.492 2.883-3.886 5.567-4.602 7.301-.865-2.702-2.485-7.342-3.964-9.302a3.384 3.384 0 0 0-.39-4.309C5.59.801 3.286 0 .667 0a.665.665 0 0 0-.471 1.136c.605.603.799 1.791.988 2.937z"})}),"sidebar-folder":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 26 20",width:"26px",height:"20px",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Folder-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Cover-icon",d:"M23.2917 3.15789H10.7694C10.0696 3.15789 9.44992 2.72421 9.22783 2.07895L9.1325 1.79895C8.76308 0.723158 7.73067 0 6.56392 0H2.70833C1.2155 0 0 1.18105 0 2.63158V15.2632C0 16.7137 1.2155 17.8947 2.70833 17.8947H23.2917C24.7845 17.8947 26 16.7137 26 15.2632V5.78947C26 4.33895 24.7845 3.15789 23.2917 3.15789Z",transform:"translate(0 2.10526)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Back-Cover-icon",d:"M16.1861 0H0.541667C0.242667 0 1.65304e-08 0.235789 1.65304e-08 0.526316C1.65304e-08 0.816842 0.242667 1.05263 0.541667 1.05263C2.17533 1.05263 3.62158 2.06526 4.13833 3.57053L4.23367 3.85158C4.30733 4.06737 4.51425 4.21263 4.74825 4.21263L17.2694 4.21053C17.5576 4.21053 17.8577 4.25263 18.2163 4.34316C18.2618 4.35474 18.3073 4.36 18.3528 4.36C18.4708 4.36 18.5878 4.32211 18.6842 4.25053C18.8164 4.15053 18.8944 3.99684 18.8944 3.83368V2.63158C18.8944 1.18105 17.6789 0 16.1861 0Z",transform:"translate(6.02246)"})]})}),"folder-add":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14 16h2v-2h2v-2h-2v-2h-2v2h-2v2h2ZM4 20q-.825 0-1.412-.587Q2 18.825 2 18V6q0-.825.588-1.412Q3.175 4 4 4h6l2 2h8q.825 0 1.413.588Q22 7.175 22 8v10q0 .825-.587 1.413Q20.825 20 20 20Z"})}),"sidebar-activity":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 45 45",width:"45px",height:"45px",...props,children:[(0,jsx_runtime.jsx)("defs",{children:(0,jsx_runtime.jsx)("clipPath",{id:"a",clipPathUnits:"userSpaceOnUse",children:(0,jsx_runtime.jsx)("path",{d:"M198.958 198.958h1375v1375h-1375z",clipRule:"evenodd"})})}),(0,jsx_runtime.jsxs)("g",{children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",d:"M14.025 9.317a.471.471 0 00-.443.31l-5.65 15.537-.028.161v9.417c0 .52.421.941.942.941h27.308c.52 0 .942-.421.942-.941v-9.418l-.028-.16-5.65-15.538a.471.471 0 00-.443-.31zm.33.941h16.29l5.308 14.596h-8.745c-.26 0-.47.211-.47.471v2.825h-8.476v-2.825c0-.26-.21-.47-.47-.47H9.047z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent",d:"M27.208 14.025a.47.47 0 00-.333.138l-6.258 6.259-2.492-2.492a.47.47 0 10-.666.665l2.825 2.825a.47.47 0 00.666 0l6.591-6.591a.47.47 0 00-.333-.804z"})]})]}),"sidebar-workshops":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 43 43",width:"43px",height:"43px",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent",d:"M28.6 13.3l-4.5 3.1v-3.1h-9.6V22.9h9.6v-2.8l4.5 2.8z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",d:"M35.7 7.5V5.6H7.5v26.2H28l2.3 1.7 5.3 4.1v-9l.1-21.1zm-25 21.1V8.8h21.8v19.8H10.7z"})]}),"sidebar-users":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"28px",height:"28px",viewBox:"0 0 28 28",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Users-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Body-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M22.9087 1.0619L19.9068 0.0315792C19.6875 -0.0433321 19.4437 0.0177481 19.2862 0.18601C17.815 1.77183 15.9378 2.64541 14 2.64541C12.0633 2.64541 10.1862 1.77183 8.715 0.18601C8.5575 0.0177481 8.31367 -0.0433321 8.09317 0.0315792L5.0925 1.0619C2.04633 2.10835 0 4.95152 0 8.13813V8.98406C0 9.30214 0.261333 9.5603 0.583333 9.5603H27.4167C27.7398 9.5603 28 9.30214 28 8.98406V8.13813C28 4.95152 25.9548 2.10835 22.9087 1.0619Z",transform:"translate(0 18.4397)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Face-Top-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M8.16667 0C3.6645 0 0 3.61879 0 8.06737C0 8.60212 0.0676669 9.1507 0.211167 9.79494C0.2695 10.0589 0.506334 10.2467 0.7805 10.2467C1.44083 10.2467 2.23883 10.3643 2.247 10.3654C2.27967 10.3712 2.31 10.3735 2.345 10.3723C2.66467 10.3769 2.94 10.1188 2.94 9.79609C2.94 9.72579 2.92833 9.6601 2.905 9.59787C2.83383 8.44769 2.90733 7.28484 3.0695 6.91489H3.15817C5.1765 6.91489 6.181 6.28333 6.64533 5.48466C7.903 6.7109 10.4323 7.89335 12.8777 8.05008C13.0165 9.01817 13.4458 9.98164 13.4668 10.03C13.5613 10.2398 13.7713 10.3723 14 10.3723C14.0163 10.3723 14.0315 10.3723 14.0478 10.3712L15.6018 10.2456C15.8573 10.2248 16.0685 10.0416 16.1233 9.79494C16.2668 9.1507 16.3333 8.60212 16.3333 8.06737C16.3333 3.61879 12.67 0 8.16667 0Z",transform:"translate(5.83325)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-secondary Face-Bottom-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M8.16667 10.498C5.29433 10.498 2.74167 8.20461 1.68233 4.73449C0.718667 4.67917 0 3.45984 0 1.85444C0 1.33697 0.0793335 0.832184 0.2275 0.394241C0.329 0.0922908 0.659167 -0.0713615 0.964834 0.0300569C1.2705 0.130323 1.435 0.457629 1.3335 0.758426C1.225 1.08112 1.16667 1.46029 1.16667 1.85444C1.16667 2.97004 1.60533 3.58316 1.75 3.58316C1.90867 3.48635 2.12333 3.45523 2.29717 3.52553C2.46983 3.59468 2.61683 3.72722 2.66233 3.90701C3.47783 7.16046 5.691 9.34557 8.16667 9.34557C10.6435 9.34557 12.8567 7.16046 13.6722 3.90701C13.7177 3.72722 13.846 3.58085 14.0198 3.5117C14.1925 3.44256 14.3885 3.45869 14.5472 3.5555C14.7478 3.58201 15.1667 2.96888 15.1667 1.85444C15.1667 1.46029 15.1095 1.08112 15.001 0.758426C14.8983 0.457629 15.064 0.130323 15.3697 0.0300569C15.6753 -0.0713615 16.0055 0.0922908 16.107 0.394241C16.2552 0.832184 16.3333 1.33697 16.3333 1.85444C16.3333 3.45984 15.6158 4.67917 14.6522 4.73449C13.5928 8.20461 11.0402 10.498 8.16667 10.498Z",transform:"translate(5.83325 9.21985)"})]})}),"sidebar-dashboards":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"27px",height:"25px",viewBox:"0 0 27 25",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Stats-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-secondary Segment-2-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M0.452157 0C0.202566 0 0 0.197891 0 0.449752V10.3443C0 10.5962 0.202566 10.7941 0.452157 10.7941H10.3996C10.6492 10.7941 10.8518 10.5962 10.8518 10.3443C10.8518 4.64144 6.18641 0 0.452157 0Z",transform:"matrix(0.998753 -0.0499261 0.0513545 0.99868 13.2483 0.541794)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Segment-3-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M11.9495 0H0.568901C0.350394 0 0.150095 0.115402 0.0556365 0.29375C-0.0388223 0.482589 -0.0115086 0.692411 0.126197 0.849777L7.52358 9.29509C7.62259 9.41049 7.76826 9.48393 7.92645 9.49442H7.96628C8.10968 9.49442 8.24852 9.44197 8.35436 9.34755C11.0003 7.07098 12.5185 3.86071 12.5185 0.524554C12.5185 0.230804 12.2636 0 11.9495 0Z",transform:"translate(14.4814 12.6067)"}),(0,jsx_runtime.jsxs)("g",{className:"cl-icon-primary Segment-1-icon",transform:"translate(1 2.01292)",children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M17.0821 19.9883C15.1739 21.5493 13.7169 21.9871 11.0531 21.9871C4.94878 21.9871 0 17.065 0 10.9935C0 4.92211 4.55288 0 10.0483 0V10.9935L17.0821 19.9883Z"}),(0,jsx_runtime.jsx)("path",{d:"M17.0821 19.9883C15.1739 21.5493 13.7169 21.9871 11.0531 21.9871C4.94878 21.9871 0 17.065 0 10.9935C0 4.92211 4.55288 0 10.0483 0V10.9935L17.0821 19.9883Z",strokeWidth:"1.1",strokeLinecap:"round",strokeLinejoin:"round"})]})]})}),"chart-bar":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M4 20V9h4v11Zm6 0V4h4v16Zm6 0v-7h4v7Z"})}),"sidebar-invitations":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"25px",height:"25px",viewBox:"0 0 25 25",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Invitations-plus-icon",d:"M11.1897 15.8621L19.8276 9.69224V6.22155V5.60345V0.431034C19.8276 0.316379 19.7819 0.206896 19.7017 0.125862C19.6216 0.0448275 19.5112 0 19.3966 0L0.431035 0.0137929C0.193103 0.0137929 0 0.206896 0 0.444827V5.60345V6.22241V9.69138L8.63793 15.8431C9.40172 15.425 10.4172 15.431 11.1897 15.8621ZM6.03448 7.32759C6.03448 7.08965 6.22759 6.89655 6.46552 6.89655H9.48276V3.87931C9.48276 3.64138 9.67586 3.44828 9.91379 3.44828C10.1517 3.44828 10.3448 3.64138 10.3448 3.87931V6.89655H13.3621C13.6 6.89655 13.7931 7.08965 13.7931 7.32759C13.7931 7.56552 13.6 7.75862 13.3621 7.75862H10.3448V10.7759C10.3448 11.0138 10.1517 11.2069 9.91379 11.2069C9.67586 11.2069 9.48276 11.0138 9.48276 10.7759V7.75862H6.46552C6.22759 7.75862 6.03448 7.56552 6.03448 7.32759Z",transform:"translate(2.58618)"}),(0,jsx_runtime.jsxs)("g",{className:"cl-icon-primary Invitations-envelope-icon",children:[(0,jsx_runtime.jsx)("path",{d:"M1.90517 3.52328C1.79138 3.44224 1.72414 3.31207 1.72414 3.17241V-2.63083e-07L0.586207 0.686207C0.225 0.987069 0 1.44397 0 1.87931V16.75C0 17.0112 0.0732759 17.2543 0.190517 17.469L10.4802 9.63103L1.90517 3.52328Z",transform:"translate(0 6.74138)"}),(0,jsx_runtime.jsx)("path",{d:"M10.6569 0.315486L-1.31541e-08 8.43273C0.209483 8.54393 0.444828 8.61204 0.697414 8.61204H22.6802C22.9328 8.61204 23.1681 8.54393 23.3776 8.43359L12.7216 0.334453C12.1457 -0.10434 11.2198 -0.1121 10.6569 0.315486Z",transform:"translate(0.811035 16.388)"}),(0,jsx_runtime.jsx)("path",{d:"M9.83965 0.65L8.75603 3.3543e-07V3.175C8.75603 3.31466 8.68879 3.44483 8.57586 3.52586L3.55161e-07 9.65172L10.2897 17.4716C10.4069 17.2569 10.4802 17.0138 10.4802 16.7526V1.8819C10.4802 1.44655 10.2552 0.989655 9.83965 0.65Z",transform:"translate(14.5198 6.73879)"})]})]}),"sidebar-messaging":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"32px",height:"17px",viewBox:"0 0 32 17",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary emails-icon",d:"M26.3743 1.04615C26.0518 0.392308 25.4067 0 24.8691 0H7.02205C5.7319 0 4.54926 0.915384 4.01169 2.48461L0.14124 13.8615C-0.0737851 14.5154 -0.0737848 15.4308 0.356266 15.9538C0.786316 16.4769 1.32388 17 1.86144 17H19.8161C21.1062 17 22.2888 16.0846 22.8264 14.5154L26.3743 3.13846C26.8044 2.48461 26.6969 1.7 26.3743 1.04615ZM10.4625 10.4615L3.47413 14.3846C3.36662 14.3846 3.36662 14.3846 3.25911 14.3846C3.04408 14.3846 2.82906 14.2538 2.72154 13.9923C2.61403 13.6 2.72154 13.3385 2.93657 13.0769L9.92489 9.15385C10.2474 9.02308 10.4625 9.15385 10.6775 9.41538C10.8925 9.80769 10.785 10.2 10.4625 10.4615ZM19.8161 14.1231C19.7085 14.2538 19.601 14.3846 19.386 14.3846C19.2785 14.3846 19.171 14.3846 19.0635 14.2538L15.3005 10.3308C15.0855 10.0692 15.0855 9.67692 15.193 9.41538C15.408 9.15385 15.7306 9.15385 15.9456 9.28462L19.7085 13.2077C20.0311 13.4692 20.0311 13.8615 19.8161 14.1231ZM22.3964 3.79231L15.408 8.63077C14.763 9.02308 14.1179 9.15385 13.4728 9.15385C12.5052 9.15385 11.5376 8.76154 10.6775 7.97692L6.80702 3.79231C6.592 3.53077 6.592 3.13846 6.80702 2.87692C7.02205 2.61538 7.34459 2.61538 7.55961 2.87692L11.4301 7.06154C12.3977 7.97692 13.7953 8.23846 14.978 7.58462L21.9663 2.87692C22.1813 2.74615 22.5039 2.87692 22.7189 3.13846C22.7189 3.26923 22.6114 3.66154 22.3964 3.79231Z",transform:"translate(5.34204)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent emails-icon",d:"M5.91319 1.30769H0.537563C0.215025 1.30769 0 1.04615 0 0.653846C0 0.261538 0.215025 0 0.537563 0H5.91319C6.23573 0 6.45076 0.261538 6.45076 0.653846C6.45076 1.04615 6.23573 1.30769 5.91319 1.30769Z",transform:"translate(0 1.30774)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent emails-icon",d:"M1.93523 1.30769H0.537563C0.215025 1.30769 0 1.04615 0 0.653846C0 0.261538 0.215025 0 0.537563 0H1.93523C2.25777 0 2.47279 0.261538 2.47279 0.653846C2.47279 1.04615 2.25777 1.30769 1.93523 1.30769Z",transform:"translate(0 14.3846)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent emails-icon",d:"M3.22538 1.30769H0.537563C0.215025 1.30769 0 1.04615 0 0.653846C0 0.261538 0.215025 0 0.537563 0H3.22538C3.54792 0 3.76294 0.261538 3.76294 0.653846C3.76294 1.04615 3.54792 1.30769 3.22538 1.30769Z",transform:"translate(0 7.84619)"})]}),"sidebar-academy":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"25px",height:"23px",viewBox:"0 0 25 23",fill:"none",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M12.5357 22.2223C12.5214 22.2223 12.5071 22.2223 12.4928 22.2223C6.82895 22.2011 4.76591 18.2966 4.67995 18.1325C4.59877 17.9739 4.55579 17.7886 4.55579 17.6088L4.57967 11.4768C4.58444 10.8949 5.01424 10.4187 5.53955 10.424C6.06486 10.4293 6.49466 10.9002 6.48988 11.4875L6.46601 17.2914C6.65226 17.5664 7.05338 18.085 7.7029 18.5928C8.98269 19.5928 10.5969 20.1007 12.4928 20.1113C14.3552 20.1166 15.936 19.6139 17.1871 18.614C17.8318 18.0955 18.2234 17.5718 18.4049 17.2966L18.4287 11.4768C18.4335 10.8949 18.8633 10.4187 19.3887 10.424C19.9139 10.4293 20.3437 10.9002 20.339 11.4875L20.3151 17.6193C20.3151 17.7939 20.2721 17.9686 20.1957 18.122C20.1193 18.286 18.1088 22.2223 12.5357 22.2223Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M12.469 14.6724C12.3591 14.6724 12.254 14.6512 12.149 14.6089L0.635147 10.0747C0.253103 9.92659 0 9.52451 0 9.07478L0.00955097 5.90038C0.00955097 5.31841 0.439351 4.84753 0.96466 4.84753C0.96466 4.84753 0.96466 4.84753 0.969437 4.84753C1.49474 4.84753 1.92455 5.32369 1.91977 5.91096L1.91022 8.33409L12.469 12.4926L23.0898 8.31826V5.91625C23.0898 5.33428 23.5196 4.85812 24.0449 4.85812C24.5702 4.85812 25 5.33428 25 5.91625V9.06423C25 9.51395 24.7469 9.91069 24.3649 10.0589L12.7889 14.6089C12.6839 14.6512 12.5788 14.6724 12.469 14.6724Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M12.469 11.1806C12.3591 11.1806 12.254 11.1594 12.149 11.1171L0.635147 6.58294C0.253103 6.4348 0 6.0327 0 5.58828C0 5.14387 0.253103 4.74178 0.635147 4.59364L12.149 0.0595202C12.3544 -0.0198401 12.5788 -0.0198401 12.7889 0.0595202L24.3649 4.59364C24.7469 4.74178 25 5.14387 25 5.59358C25 6.04328 24.7469 6.44009 24.3649 6.59352L12.7889 11.1224C12.6839 11.1594 12.5788 11.1806 12.469 11.1806ZM3.80611 5.58828L12.469 9.00076L21.1748 5.59358L12.469 2.18108L3.80611 5.58828Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M16.041 16.778C15.6446 16.778 15.3246 16.4236 15.3246 15.9844V8.16483L12.1824 6.18609C11.8385 5.96918 11.7192 5.48243 11.9149 5.1015C12.1107 4.72057 12.5501 4.58831 12.8939 4.80523L16.3992 7.01671C16.6236 7.15955 16.7621 7.41886 16.7621 7.70455V15.9898C16.7574 16.4236 16.4326 16.778 16.041 16.778Z",fill:"#80CFD8"}),(0,jsx_runtime.jsx)("path",{d:"M16.041 18.9578C15.3008 18.9578 14.7039 18.2964 14.7039 17.4764V15.5928C14.7039 14.7728 15.3008 14.1115 16.041 14.1115C16.7812 14.1115 17.3782 14.7728 17.3782 15.5928V17.4764C17.3782 18.2964 16.7764 18.9578 16.041 18.9578Z",fill:"#80CFD8"})]}),email:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M22 6C22 4.9 21.1 4 20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6M20 6L12 11L4 6H20M20 18H4V8L12 13L20 8V18Z"})}),"money-bag":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 19 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M10 17.133v1.803c.575-.141 1-.511 1-.936 0-.397-.333-.676-1-.867zM8 15c0 .397.334.674 1 .867v-1.803c-.575.141-1 .512-1 .936z"}),(0,jsx_runtime.jsx)("g",{children:(0,jsx_runtime.jsx)("path",{d:"M6.14 6h6.72c1.265-1.128 3.196-3.049 3.312-4.365.032-.375-.07-.709-.297-.966-.142-.16-.406-.351-.867-.351-1.006 0-2.604.972-3.375 1.484C11.062.992 10.217 0 9.5 0c-.719 0-1.563.992-2.134 1.803C6.594 1.29 4.996.319 3.991.319c-.46 0-.726.191-.867.351-.227.256-.329.59-.296.965C2.942 2.95 4.875 4.872 6.14 6zM12.658 7H6.343C4.434 9.065 0 14.114 0 16.5 0 20.636 4.262 24 9.5 24s9.5-3.364 9.5-7.5c0-2.387-4.434-7.436-6.342-9.5zM10 19.959v.541a.5.5 0 0 1-1 0v-.539c-1.094-.171-1.921-.898-1.998-1.822a.5.5 0 1 1 .996-.084c.034.405.451.75 1.002.883v-2.039c-1.345-.331-2-.963-2-1.899 0-.966.86-1.773 2-1.959V12.5a.5.5 0 0 1 1 0v.539c1.094.171 1.92.896 1.998 1.822a.501.501 0 0 1-.456.541c-.267.035-.517-.182-.54-.457-.034-.405-.451-.748-1.002-.883v2.039c1.346.33 2 .961 2 1.899 0 .966-.859 1.773-2 1.959z"})})]}),home:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z"})}),"info-solid":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),dot:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 19q-2.925 0-4.962-2.038Q5 14.925 5 12t2.038-4.963Q9.075 5 12 5t4.962 2.037Q19 9.075 19 12q0 2.925-2.038 4.962Q14.925 19 12 19Z"})}),pen:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"16px",height:"17px",viewBox:"0 0 16 17",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M13.44 6.0667L10.9334 3.56004L10.3467 2.97337C10.24 2.8667 10.08 2.8667 9.97337 2.97337L5.44003 7.5067C5.33337 7.61337 5.33337 7.77337 5.44003 7.88004C5.49337 7.93337 5.5467 7.93337 5.65337 7.93337C5.76003 7.93337 5.81337 7.93337 5.8667 7.88004L10.1334 3.5067L10.56 3.93337L1.8667 12.6267L4.37337 15.1334C5.12003 14.3334 8.64003 10.8667 11.52 7.98671C12.0534 7.45337 12.5867 6.92004 13.0667 6.44004L13.44 6.81337C13.5467 6.92004 13.7067 6.92004 13.8134 6.81337C13.92 6.7067 13.92 6.54671 13.8134 6.44004L13.44 6.0667Z"}),(0,jsx_runtime.jsx)("path",{d:"M15.36 1.48003C14.72 0.786698 13.6534 0.840031 12.8534 1.5867L11.3067 3.13336L13.8134 5.64003C14.4 5.05336 14.9334 4.52003 15.36 4.09336C15.7867 3.72003 16 3.1867 16 2.7067C15.9467 2.2267 15.7334 1.80003 15.36 1.48003Z"}),(0,jsx_runtime.jsx)("path",{d:"M0.0533414 16.6267C8.0578e-06 16.7333 0.0533414 16.84 0.106675 16.9467C0.160008 16.9467 0.213341 17 0.266675 17C0.320008 17 0.320008 17 0.373341 17L3.94667 15.4533L1.54667 13.0533L0.0533414 16.6267Z"})]}),"cl-favicon":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20.034",...props,children:[(0,jsx_runtime.jsx)("path",{fill:"none",d:"M-2-1.966h24v24H-2z"}),(0,jsx_runtime.jsx)("path",{d:"M12.953 2.973H3.588v4.923c0 2.167.267 4.109.848 5.69.49 1.354 1.16 2.529 2.007 3.432.045.046.09.09.09.135.356.362.713.679 1.115.947.044.046.09.046.09.091 0 0 .044 0 .044.046 0 0 .045 0 .045.045.89.586 1.65.723 1.739.768l.267.044.267-.044c.09 0 .491-.091 1.117-.407.757-.361 1.471-.949 2.094-1.58.848-.905 1.517-2.08 2.008-3.433.579-1.626.846-3.522.846-5.69V5.636c.044-.27.044-.497.044-.677V2.973zM5.06 6.676V4.463h4.103V6.09L7.648 7.625H5.06zm4.102 10.567c-.133-.09-.312-.18-.446-.271h-.044s-.045 0-.045-.046c-.045 0-.045-.045-.09-.045a7.219 7.219 0 01-.89-.768l-.135-.134c-.713-.768-1.25-1.716-1.65-2.892-.4-1.127-.668-2.481-.758-3.972h2.542l1.516 1.536zm.715-7.947l-.893-.905.893-.902.89.902zm4.057 3.791c-.4 1.176-.98 2.124-1.693 2.892a6.249 6.249 0 01-1.65 1.264V10.65l1.514-1.536h2.587c-.09 1.49-.312 2.8-.758 3.972zm.758-8.533V7.58h-2.587L10.59 6.044v-1.58h4.102z"})]}),filter:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 21v-6h2v2h8v2h-8v2Zm-8-2v-2h6v2Zm4-4v-2H3v-2h4V9h2v6Zm4-2v-2h10v2Zm4-4V3h2v2h4v2h-4v2ZM3 7V5h10v2Z"})}),clock:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z"})}),bullseye:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,10.84 21.79,9.69 21.39,8.61L19.79,10.21C19.93,10.8 20,11.4 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.6,4 13.2,4.07 13.79,4.21L15.4,2.6C14.31,2.21 13.16,2 12,2M19,2L15,6V7.5L12.45,10.05C12.3,10 12.15,10 12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12C14,11.85 14,11.7 13.95,11.55L16.5,9H18L22,5H19V2M12,6A6,6 0 0,0 6,12A6,6 0 0,0 12,18A6,6 0 0,0 18,12H16A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8V6Z"})}),"email-check":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 52 52",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M45.5 2.16663H6.50004C3.51221 2.16663 1.08337 4.59763 1.08337 7.58329V31.4166C1.08337 34.4023 3.51221 36.8333 6.50004 36.8333H11.0067C11.5462 36.8333 12.0034 36.4368 12.0792 35.9038C13.0694 29.0225 19.0537 23.8333 26 23.8333C32.9464 23.8333 38.9307 29.0225 39.9209 35.9038C39.9967 36.4368 40.6272 36.8333 41.1667 36.8333H45.5C48.4879 36.8333 50.9167 34.4023 50.9167 31.4166V7.58329C50.9167 4.59763 48.4879 2.16663 45.5 2.16663ZM18.1004 21.3503L7.26704 32.1836C7.05471 32.3938 6.77737 32.5 6.50004 32.5C6.22271 32.5 5.94537 32.3938 5.73304 32.1836C5.31054 31.7611 5.31054 31.0743 5.73304 30.6518L16.5664 19.8185C16.9889 19.396 17.6757 19.396 18.0982 19.8185C18.5207 20.241 18.5229 20.9256 18.1004 21.3503ZM26 21.6883C24.843 21.6883 23.6882 21.333 22.7002 20.6201L5.86521 8.46296C5.37987 8.11196 5.27154 7.43379 5.62254 6.94846C5.97354 6.46096 6.64954 6.35696 7.13487 6.70579L23.9699 18.863C25.2005 19.7535 26.8017 19.7535 28.0324 18.863L44.8674 6.70579C45.3527 6.35479 46.0287 6.46313 46.3797 6.94846C46.7307 7.43379 46.6202 8.11196 46.137 8.46079L29.302 20.618C28.3119 21.3308 27.157 21.6883 26 21.6883ZM46.267 32.1836C46.0547 32.3938 45.7774 32.5 45.5 32.5C45.2227 32.5 44.9454 32.3938 44.733 32.1836L33.8997 21.3503C33.4772 20.9278 33.4772 20.241 33.8997 19.8185C34.3222 19.396 35.009 19.396 35.4315 19.8185L46.2649 30.6518C46.6895 31.0743 46.6895 31.759 46.267 32.1836Z",fillOpacity:"0.6"}),(0,jsx_runtime.jsx)("path",{d:"M26 26C19.4307 26 14.0834 31.3452 14.0834 37.9167C14.0834 44.4882 19.4307 49.8333 26 49.8333C32.5694 49.8333 37.9167 44.4882 37.9167 37.9167C37.9167 31.3452 32.5694 26 26 26ZM32.1837 35.4337L24.6004 43.017C24.388 43.2272 24.1107 43.3333 23.8334 43.3333C23.556 43.3333 23.2787 43.2272 23.0664 43.017L18.733 38.6837C18.3105 38.2612 18.3105 37.5743 18.733 37.1518C19.1555 36.7293 19.8424 36.7293 20.2649 37.1518L23.8334 40.7182L30.6497 33.9018C31.0722 33.4793 31.759 33.4793 32.1815 33.9018C32.604 34.3243 32.6062 35.009 32.1837 35.4337Z"})]}),"check-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),template:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 23 23",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M12.65 3.833h-2.3c-.843 0-1.533-.69-1.533-1.533S9.507.767 10.35.767h2.3c.843 0 1.533.69 1.533 1.533s-.69 1.533-1.533 1.533zm-2.3-2.3c-.46 0-.767.307-.767.767s.307.767.767.767h2.3c.46 0 .767-.307.767-.767s-.307-.767-.767-.767h-2.3zM21.237 13.033H1.763c-.766 0-1.38.537-1.38 1.15 0 .614.614 1.15 1.38 1.15h19.55c.767 0 1.38-.536 1.38-1.15 0-.613-.69-1.15-1.456-1.15z"}),(0,jsx_runtime.jsx)("path",{d:"M1.533 12.267H21.39c.077 0 .153 0 .23-.077.077-.077.153-.153.153-.307v-9.2c.077-.23-.076-.383-.306-.383h-6.21c-.154 0-.384.153-.384.307C14.72 3.757 13.8 4.6 12.65 4.6h-2.3c-1.15 0-2.07-.843-2.3-1.993 0-.154-.153-.307-.383-.307H1.533c-.23 0-.383.153-.383.383v9.2c0 .077.077.23.153.307.077.077.154.077.23.077zM11.5 1.533c-.23 0-.383-.153-.383-.383V.383c0-.23.153-.383.383-.383s.383.153.383.383v.767c0 .23-.153.383-.383.383zM8.357 16.483L5.75 21.697c-.077.153 0 .383.153.536h.23c.154 0 .307-.076.307-.23l2.76-5.52h-.843zM11.117 16.483v6.134c0 .23.153.383.383.383s.383-.153.383-.383v-6.134h-.766zM14.797 16.483h-.844l2.607 5.52c.077.154.23.23.383.23h.154c.23-.076.306-.306.153-.536l-2.453-5.214z"})]}),"blank-paper":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 17 21",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15.938 0H6.312c-.02 0-.036.009-.056.011a.385.385 0 0 0-.055.012.433.433 0 0 0-.198.106L.753 5.378a.43.43 0 0 0-.105.197.424.424 0 0 0-.012.056c-.002.02-.011.036-.011.056v14.875c0 .242.196.438.438.438h14.874a.438.438 0 0 0 .438-.438V.438A.438.438 0 0 0 15.937 0zM5.874 1.494v3.319a.438.438 0 0 1-.438.437H2.12l3.756-3.756z"})}),list:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M9,5V9H21V5M9,19H21V15H9M9,14H21V10H9M4,9H8V5H4M4,19H8V15H4M4,14H8V10H4V14Z"})}),menu:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z"})}),link:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z"})}),"participation-level":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M23.5 10.125H22V1.94a.724.724 0 0 1 1 .685.5.5 0 0 0 1 0c0-.618-.315-1.177-.845-1.497a1.74 1.74 0 0 0-1.719-.05L2.312 11.163c-.008.003-.014.008-.022.01l-.423.224A3.494 3.494 0 0 0 0 14.493v.13a.5.5 0 0 0 1 0v-.13c0-.79.384-1.505 1-1.972v6.604H.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h23a.5.5 0 0 0 .5-.5v-12a.5.5 0 0 0-.5-.5zM3 11.93L21 2.44v7.685h-2.5a.5.5 0 0 0-.5.5v2.5h-5.5a.5.5 0 0 0-.5.5v2.5H6.5a.5.5 0 0 0-.5.5v2.5H3V11.93z"})}),key:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7 14C5.9 14 5 13.1 5 12S5.9 10 7 10 9 10.9 9 12 8.1 14 7 14M12.6 10C11.8 7.7 9.6 6 7 6C3.7 6 1 8.7 1 12S3.7 18 7 18C9.6 18 11.8 16.3 12.6 14H16V18H20V14H23V10H12.6Z"})}),minus:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,13H5V11H19V13Z"})}),inbox:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,15H15A3,3 0 0,1 12,18A3,3 0 0,1 9,15H5V5H19M19,3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3Z"})}),bookmark:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,3H7A2,2 0 0,0 5,5V21L12,18L19,21V5C19,3.89 18.1,3 17,3Z"})}),"bookmark-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17 3H7c-1.1 0-2 .9-2 2v16l7-3 7 3V5c0-1.1-.9-2-2-2zm0 15-5-2.18L7 18V5h10v13z"})}),eye:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z"})}),"eye-off":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.2 16.38,18.66L16.81,19.08L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z"})}),"open-in-new":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z"})}),file:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z"})}),"file-add":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 18h2v-3h3v-2h-3v-3h-2v3H8v2h3Zm-5 4q-.825 0-1.412-.587Q4 20.825 4 20V4q0-.825.588-1.413Q5.175 2 6 2h8l6 6v12q0 .825-.587 1.413Q18.825 22 18 22Zm7-13h5l-5-5Z"})}),"folder-solid":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"})}),"folder-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20,18H4V8H20M20,6H12L10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6Z"})}),flag:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14.4,6L14,4H5V21H7V14H12.6L13,16H20V6H14.4Z"})}),user:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z"})}),basket:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M5.5,21C4.72,21 4.04,20.55 3.71,19.9V19.9L1.1,10.44L1,10A1,1 0 0,1 2,9H6.58L11.18,2.43C11.36,2.17 11.66,2 12,2C12.34,2 12.65,2.17 12.83,2.44L17.42,9H22A1,1 0 0,1 23,10L22.96,10.29L20.29,19.9C19.96,20.55 19.28,21 18.5,21H5.5M12,4.74L9,9H15L12,4.74M12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17A2,2 0 0,0 14,15A2,2 0 0,0 12,13Z"})}),"basket-plus":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 15V18H23V20H20V23H18V20H15V18H18V15H20M23 10L22.96 10.29L22 13.8C21.11 13.29 20.09 13 19 13C15.69 13 13 15.69 13 19C13 19.7 13.13 20.37 13.35 21H5.5C4.72 21 4.04 20.55 3.71 19.9L1.1 10.44L1 10C1 9.45 1.45 9 2 9H6.58L11.18 2.43C11.36 2.17 11.66 2 12 2S12.65 2.17 12.83 2.44L17.42 9H22C22.55 9 23 9.45 23 10M14 15C14 13.9 13.11 13 12 13S10 13.9 10 15 10.9 17 12 17 14 16.11 14 15M15 9L12 4.74L9 9H15Z"})}),"basket-minus":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M23 18V20H15V18H23M23 10L22.96 10.29L22 13.8C21.11 13.29 20.09 13 19 13C15.69 13 13 15.69 13 19C13 19.7 13.13 20.37 13.35 21H5.5C4.72 21 4.04 20.55 3.71 19.9L1.1 10.44L1 10C1 9.45 1.45 9 2 9H6.58L11.18 2.43C11.36 2.17 11.66 2 12 2S12.65 2.17 12.83 2.44L17.42 9H22C22.55 9 23 9.45 23 10M14 15C14 13.9 13.11 13 12 13S10 13.9 10 15 10.9 17 12 17 14 16.11 14 15M15 9L12 4.74L9 9H15Z"})}),"basket-checkmark":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.63 16.27L17.76 20.17L16.41 18.8L15 20.22L17.75 23L23.03 17.68L21.63 16.27M13 20C13 16.69 15.69 14 19 14C20 14 20.92 14.24 21.74 14.67L22.96 10.29L23 10C23 9.45 22.55 9 22 9H17.42L12.83 2.44C12.65 2.17 12.34 2 12 2S11.36 2.17 11.18 2.43L6.58 9H2C1.45 9 1 9.45 1 10L1.1 10.44L3.71 19.9C4.04 20.55 4.72 21 5.5 21H13.09C13.04 20.67 13 20.34 13 20M12 4.74L15 9H9L12 4.74M10 15C10 13.9 10.9 13 12 13S14 13.9 14 15 13.11 17 12 17 10 16.11 10 15Z"})}),volunteer:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 28",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M21 6a2.74 2.74 0 00-1 .19V5a3 3 0 00-3-3 2.87 2.87 0 00-1.13.25 3 3 0 00-5.75 0A2.82 2.82 0 009 2a3 3 0 00-3 3v10.75l-.88-.87a3 3 0 00-4.25 0 3 3 0 000 4.25l6.78 6.78A6.74 6.74 0 0012.37 28H17a7 7 0 007-7V9a3 3 0 00-3-3zm1 15a5 5 0 01-5 5h-4.63a4.65 4.65 0 01-3.28-1.53l-6.81-6.75a1 1 0 010-1.44h.06a1 1 0 011.38 0l2.56 2.6L8 20.59V5a1 1 0 012 0v8h2V3a1 1 0 012 0v10h2V5a1 1 0 012 0v8h2V9a1 1 0 012 0z"}),(0,jsx_runtime.jsx)("path",{d:"M17 16a2 2 0 00-2 2 2 2 0 00-4 0c0 1.95 4 5 4 5s4-2.83 4-5a2 2 0 00-2-2z"})]}),"volunteer-off":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 25.34 28",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M.001 3.804L1.465 2.34l23.872 23.872-1.464 1.464zM16.6 16.2l2.67 2.68a2.41 2.41 0 00.19-.88 2 2 0 00-2-2 2.05 2.05 0 00-.86.2zM15.46 23s.54-.38 1.21-1l-5-5a2 2 0 00-.24.93C11.46 20 15.46 23 15.46 23z"}),(0,jsx_runtime.jsx)("path",{d:"M8.46 5a1 1 0 012 0v5.07l2 2V3a1 1 0 012 0v10h2V5a1 1 0 012 0v8h2V9a1 1 0 012 0v12a4.43 4.43 0 01-.1 1l1.6 1.6a6.88 6.88 0 00.5-2.57V9a3 3 0 00-3-3 2.82 2.82 0 00-1 .19V5a3 3 0 00-3-3 2.82 2.82 0 00-1.12.25 3 3 0 00-5.75 0A2.87 2.87 0 009.46 2a3 3 0 00-3 3v1.07l2 2zM17.46 26h-4.62a4.63 4.63 0 01-3.28-1.53l-6.82-6.75a1 1 0 010-1.44h.07a1 1 0 011.37 0l2.56 2.6 1.72 1.71v-6.76l-2-2v3.92l-.87-.87a3 3 0 00-4.25 4.25l6.78 6.78A6.72 6.72 0 0012.84 28h4.62a6.93 6.93 0 003.95-1.23L20 25.32a5 5 0 01-2.54.68z"})]}),"cl-logo":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 137 30",width:"137px",height:"30px",...props,children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M37.517 11.892c1.687 0 2.46 1.097 2.81 2.194l3.023-1.097c-.562-2.194-2.46-4.461-5.903-4.461-3.655 0-6.536 2.925-6.536 6.948 0 4.022 2.881 6.948 6.606 6.948 3.373 0 5.27-2.268 5.833-4.462l-2.952-1.024c-.28 1.024-1.124 2.195-2.881 2.195-1.757 0-3.233-1.317-3.233-3.73 0-2.414 1.546-3.511 3.233-3.511z"}),(0,jsx_runtime.jsx)("path",{d:"M49.075 8.957h-3.373v13.091h3.373V8.957z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M45.35 4.715c0 1.17.913 2.194 2.108 2.194s2.108-.95 2.108-2.194c0-1.243-.913-2.194-2.108-2.194-1.195-.073-2.108.95-2.108 2.194zM56.454 5.08h-3.092v1.83c0 1.17-.633 2.047-1.968 2.047h-.632v3.145h2.319v6.143c0 2.56 1.546 4.023 4.005 4.023.984 0 1.617-.22 1.898-.293V19.05c-.211.073-.633.073-1.054.073-.984 0-1.476-.366-1.476-1.536v-5.485h2.53V8.957h-2.53V5.081z"}),(0,jsx_runtime.jsx)("path",{d:"M64.778 8.957h-3.373v13.091h3.373V8.957z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M60.983 4.715c0 1.17.914 2.194 2.109 2.194 1.194 0 2.108-.95 2.108-2.194 0-1.243-.914-2.194-2.108-2.194-1.125-.073-2.109.95-2.109 2.194zM77.6 22.074v-3.072h-6.183l6.113-7.094V8.909H67.411v3.072h5.763L67.2 18.93v3.145h10.4zM82.974 14.108h5.621c-.07-1.316-.842-2.56-2.81-2.56-1.757-.072-2.741 1.317-2.811 2.56zm5.973 3.365l2.811.877c-.632 2.268-2.6 4.17-5.692 4.17-3.444 0-6.465-2.56-6.465-7.022 0-4.169 2.95-6.875 6.184-6.875 3.865 0 6.184 2.56 6.184 6.802 0 .512-.07 1.024-.07 1.097h-8.995c.07 1.755 1.476 2.998 3.162 2.998 1.616 0 2.46-.877 2.881-2.047zM97.34 14.547c0-1.536.844-2.706 2.32-2.706 1.617 0 2.319 1.17 2.319 2.633v7.606h3.373v-8.264c0-2.852-1.405-5.193-4.567-5.193-1.336 0-2.882.585-3.655 1.975V8.916h-3.162V22.08h3.373v-7.533z"}),(0,jsx_runtime.jsx)("path",{d:"M109.742 2.803h-2.389v19.308h2.389V2.803z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M116.17 20.465c1.968 0 3.514-.95 3.514-3.803v-.585l-3.725.585c-1.054.146-1.757.804-1.757 1.901-.07.951.703 1.902 1.968 1.902zm-4.427-1.755c0-2.268 1.617-3.584 3.724-3.877l3.304-.511c.772-.074.913-.512.913-.951 0-1.244-.773-2.268-2.671-2.268-1.686 0-2.599 1.098-2.811 2.56l-2.318-.585c.28-2.486 2.389-4.169 5.059-4.169 3.655 0 5.131 2.194 5.131 4.681v6.436c0 1.097.07 1.755.14 2.121h-2.319c-.07-.293-.141-.804-.141-1.755-.562.877-1.757 2.12-3.935 2.12-2.53 0-4.076-1.755-4.076-3.802zM133.84 15.602c0-2.779-1.405-4.534-3.654-4.534-2.108 0-3.654 1.755-3.654 4.534 0 2.78 1.546 4.608 3.654 4.608 2.249 0 3.654-1.829 3.654-4.608zm-7.238 6.51h-2.389V2.802h2.389v8.265c.562-1.17 2.038-2.194 4.076-2.194 3.724 0 5.622 2.998 5.622 6.728 0 3.803-2.038 6.802-5.693 6.802-1.827 0-3.232-.805-4.005-2.194v1.901zM0 0v19.471C0 23.536 7.494 28.167 11.288 30c3.794-1.833 11.288-6.464 11.288-10.529V0H0zm19.73 19.471c-.04.906-1.57 3.433-7.197 6.667V15.236l3.132-3.132h4.065v7.367zm-4.25-9.943h4.25V2.717h-7.197v3.865l2.946 2.946zM9.957 6.531V2.717H2.846v6.811H6.96l2.998-2.997zm-3.184 5.573H2.846v7.367c.04.901 1.555 3.407 7.112 6.618V15.287l-3.184-3.183zm2.448-1.195l1.998-1.998 1.998 1.998-1.998 1.998-1.998-1.998z"})]}),"arrow-left-circle":props=>(0,jsx_runtime.jsx)(MirrorOnRtlSvg,{viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"m12 16 1.4-1.4-1.6-1.6H16v-2h-4.2l1.6-1.6L12 8l-4 4Zm0 6q-2.075 0-3.9-.788-1.825-.787-3.175-2.137-1.35-1.35-2.137-3.175Q2 14.075 2 12t.788-3.9q.787-1.825 2.137-3.175 1.35-1.35 3.175-2.138Q9.925 2 12 2t3.9.787q1.825.788 3.175 2.138 1.35 1.35 2.137 3.175Q22 9.925 22 12t-.788 3.9q-.787 1.825-2.137 3.175-1.35 1.35-3.175 2.137Q14.075 22 12 22Z"})}),whatsapp:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M.057 24l1.687-6.163a11.867 11.867 0 01-1.587-5.946C.16 5.335 5.495 0 12.05 0a11.817 11.817 0 018.413 3.488 11.824 11.824 0 013.48 8.414c-.003 6.557-5.338 11.892-11.893 11.892a11.9 11.9 0 01-5.688-1.448L.057 24zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.148-.669-1.611-.916-2.206-.242-.579-.487-.501-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.709.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.695.248-1.29.173-1.414z"})}),"sidebar-reporting":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 27 31",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Processing-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Head",d:"M22.0671 21.8819C23.0755 17.9491 28.3528 16.0332 26.6721 8.0333C24.9579 0.0333888 15.5462 -0.773325 10.6723 0.470358C5.63035 1.78127 1.59679 7.15936 2.94131 11.6299C3.04215 11.966 2.97492 12.3358 2.77324 12.6383C2.16821 13.5795 0.487556 15.6635 0.0505859 16.8735C-0.117479 17.3105 0.151425 17.7811 0.588395 17.9155C0.722847 17.9492 1.59679 18.2853 1.73124 18.3189C2.9077 18.6886 2.6724 21.2768 2.6724 23.6298C2.6724 26.0835 5.29422 25.7474 6.13455 25.5793C7.00849 25.3776 8.92444 25.2096 8.92444 27.5625C8.92444 27.865 8.92444 28.1339 8.95805 28.3356C8.99166 28.8062 9.29418 29.2095 9.73115 29.3776C11.4454 30.0499 16.4538 31.0919 22.5041 28.907C22.8739 28.7726 23.0083 28.3692 22.8402 28.0331C22.3024 26.9575 21.294 24.8062 22.0671 21.8819ZM19.5126 5.41148C20.7226 5.57954 21.5629 6.68878 21.3613 7.89885C21.1932 9.10892 20.084 9.94924 18.8739 9.74756C17.6638 9.5795 16.8235 8.47027 17.0252 7.2602C17.1932 6.08374 18.3025 5.24341 19.5126 5.41148ZM15.0084 19.4954C10.3362 19.4954 6.53791 15.6971 6.53791 11.0249C6.53791 6.35264 10.3362 2.55437 15.0084 2.55437C15.7143 2.55437 16.4201 2.65521 17.0924 2.82327C17.0252 3.26024 16.7899 3.6636 16.4201 3.9325C15.8487 4.36947 15.1429 4.40309 14.5378 4.10057C14.2689 4.4367 14.0336 4.84006 13.8656 5.24341C14.4034 5.61316 14.7059 6.28542 14.605 6.99129C14.5042 7.69717 14.0336 8.23498 13.395 8.43665C13.4622 8.87362 13.563 9.31059 13.7311 9.71395C14.3698 9.61311 15.0756 9.8484 15.479 10.4198C15.916 10.9912 15.9496 11.6971 15.647 12.3022C15.9832 12.5711 16.3865 12.8064 16.7899 12.9744C17.1596 12.4366 17.8319 12.1341 18.5378 12.2349C19.2436 12.3358 19.7815 12.8064 19.9831 13.445C20.4201 13.3778 20.8571 13.2769 21.2604 13.1089C21.1596 12.4702 21.3949 11.7643 21.9663 11.361C22.4369 11.0249 22.9747 10.924 23.4789 11.0585C23.4789 15.6971 19.6806 19.4954 15.0084 19.4954Z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Gear",d:"M14.5042 12.5375C14.3698 12.2013 14.437 11.798 14.6387 11.5291C14.5042 11.361 14.3025 11.1929 14.1345 11.0249C13.8656 11.2602 13.4958 11.3274 13.1261 11.1929C12.7563 11.0585 12.5547 10.7224 12.521 10.3862C12.2858 10.3526 12.0505 10.3526 11.8152 10.3862C11.7816 10.756 11.5799 11.0585 11.2101 11.2266C10.874 11.361 10.4707 11.2938 10.2017 11.0921C10.0337 11.2266 9.86562 11.4282 9.69755 11.5963C9.93284 11.8652 10.0001 12.235 9.86562 12.6047C9.73116 12.9744 9.39503 13.1761 9.0589 13.2097C9.02529 13.445 9.02529 13.6803 9.0589 13.9156C9.42864 13.9492 9.73116 14.1509 9.89923 14.5206C10.0337 14.8568 9.96645 15.2601 9.76478 15.529C9.89923 15.6971 10.1009 15.8652 10.269 16.0332C10.5379 15.7979 10.9076 15.7307 11.2774 15.8652C11.6471 15.9996 11.8488 16.3357 11.8824 16.6719C12.1177 16.7055 12.353 16.7055 12.5883 16.6719C12.6219 16.3021 12.8236 15.9996 13.1933 15.8315C13.5294 15.6971 13.9328 15.7643 14.2017 15.966C14.3698 15.8315 14.5378 15.6299 14.7059 15.4618C14.4706 15.1929 14.4034 14.8232 14.5378 14.4534C14.6723 14.0837 15.0084 13.882 15.3445 13.8484C15.3782 13.6131 15.3782 13.3778 15.3445 13.1425C14.9748 13.1089 14.6387 12.9072 14.5042 12.5375ZM13.2941 13.9828C13.0589 14.5879 12.353 14.8904 11.7479 14.6551C11.1429 14.4198 10.8404 13.7139 11.0757 13.1089C11.311 12.5039 12.0169 12.2013 12.6219 12.4366C13.2269 12.6719 13.5294 13.3778 13.2941 13.9828Z"})]})}),"alert-octagon":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 17q.425 0 .713-.288Q13 16.425 13 16t-.287-.713Q12.425 15 12 15t-.712.287Q11 15.575 11 16t.288.712Q11.575 17 12 17Zm-1-4h2V7h-2Zm-2.75 8L3 15.75v-7.5L8.25 3h7.5L21 8.25v7.5L15.75 21Zm.85-2h5.8l4.1-4.1V9.1L14.9 5H9.1L5 9.1v5.8Zm2.9-7Z"})}),"alert-octagon-off":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"m19.8 16.95-1.45-1.4.65-.65V9.1L14.9 5H9.1l-.65.65-1.4-1.45L8.25 3h7.5L21 8.25v7.45ZM13 10.2V7h-2v1.2Zm7.5 13.1-3.55-3.55-1.2 1.25h-7.5L3 15.7V8.25l1.2-1.2L.7 3.5l1.4-1.4 19.8 19.8Zm-7.1-12.7ZM9.1 19h5.8l.65-.65-9.9-9.9L5 9.1v5.8Zm2.9-2q-.425 0-.712-.288Q11 16.425 11 16t.288-.713Q11.575 15 12 15t.713.287Q13 15.575 13 16t-.287.712Q12.425 17 12 17Zm-1.4-3.6Z"})}),"filter-2":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 20q-.425 0-.712-.288Q10 19.425 10 19v-6L4.2 5.6q-.375-.5-.112-1.05Q4.35 4 5 4h14q.65 0 .913.55.262.55-.113 1.05L14 13v6q0 .425-.287.712Q13.425 20 13 20Z"})}),categories:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15 21v-3h-4V8H9v3H2V3h7v3h6V3h7v8h-7V8h-2v8h2v-3h7v8Z"})}),token:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 5C7.03158 5 2 6.49067 2 9.33983C2 12.189 7.03158 13.6797 12 13.6797C16.9705 13.6797 22 12.189 22 9.33983C22 6.49067 16.9705 5 12 5ZM7 14.5853V17.4778C8.23684 17.7671 9.60526 17.9437 11 18V15.1075C9.65417 15.057 8.31547 14.8822 7 14.5853V14.5853ZM13 15.1053V18C14.3459 17.9505 15.6847 17.7757 17 17.4778V14.5853C15.6874 14.8822 14.3474 15.0566 13 15.1064V15.1053ZM19 13.9668V16.8592C20.8011 16.1334 22 15.0696 22 13.6807V10.7883C22 12.1771 20.8011 13.2398 19 13.9678V13.9668ZM5 16.8592V13.9668C3.2 13.2388 2 12.1749 2 10.7872V13.6797C2 15.0685 3.2 16.1313 5 16.8603V16.8592Z",fill:"black"})}),"coin-stack":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsxs)("g",{clipPath:"url(#clip0)",fill:props.fill,children:[(0,jsx_runtime.jsx)("path",{d:"M5.81 11.42c.563 0 1.106-.036 1.62-.103V5.682a12.465 12.465 0 00-1.62-.104C2.603 5.578 0 6.758 0 8.214v.571c0 1.456 2.602 2.636 5.81 2.636zM5.81 14.363c.563 0 1.106-.036 1.62-.104v-1.652a12.45 12.45 0 01-1.62.105c-2.8 0-5.138-.9-5.688-2.096-.08.175-.122.355-.122.54v.571c0 1.456 2.602 2.636 5.81 2.636zM7.43 15.678v-.128c-.514.067-1.057.104-1.62.104-2.8 0-5.139-.899-5.688-2.095-.08.174-.122.354-.122.54v.57c0 1.456 2.602 2.636 5.81 2.636.643 0 1.26-.047 1.837-.134a2.079 2.079 0 01-.217-.921v-.572zM14.19 1.114c-3.21 0-5.812 1.18-5.812 2.636v.572c0 1.455 2.602 2.635 5.811 2.635C17.4 6.957 20 5.777 20 4.322V3.75c0-1.456-2.602-2.636-5.81-2.636z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 8.248c-2.802 0-5.14-.899-5.69-2.095-.08.174-.122.354-.122.54v.57C8.378 8.72 10.98 9.9 14.19 9.9 17.4 9.9 20 8.72 20 7.264v-.572c0-.185-.042-.365-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 11.19c-2.802 0-5.14-.898-5.69-2.095-.08.174-.122.355-.122.54v.571c0 1.456 2.602 2.636 5.811 2.636 3.21 0 5.811-1.18 5.811-2.636v-.571c0-.185-.042-.366-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 14.292c-2.802 0-5.14-.9-5.69-2.096-.08.175-.122.355-.122.54v.572c0 1.455 2.602 2.635 5.811 2.635 3.21 0 5.811-1.18 5.811-2.635v-.572c0-.185-.042-.366-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 17.234c-2.802 0-5.14-.899-5.69-2.095-.08.174-.122.354-.122.54v.571c0 1.456 2.602 2.636 5.811 2.636 3.21 0 5.811-1.18 5.811-2.636v-.572c0-.185-.042-.365-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"})]}),(0,jsx_runtime.jsx)("defs",{children:(0,jsx_runtime.jsx)("clipPath",{id:"clip0",children:(0,jsx_runtime.jsx)("path",{fill:"#fff",d:"M0 0h20v20H0z"})})})]}),image:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 127 103",...props,children:(0,jsx_runtime.jsx)("path",{d:"M127 91.5556V11.4444C127 5.15 120.65 0 112.889 0H14.1111C6.35 0 0 5.15 0 11.4444V91.5556C0 97.85 6.35 103 14.1111 103H112.889C120.65 103 127 97.85 127 91.5556ZM38.8056 60.0833L56.4444 77.3072L81.1389 51.5L112.889 85.8333H14.1111L38.8056 60.0833Z"})}),accordion:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M1 13.0015C0.447715 13.0015 -1.95703e-08 12.5537 -4.37114e-08 12.0015L-2.13006e-07 8.12845C-2.37147e-07 7.57617 0.447715 7.12845 1 7.12845L19 7.12845C19.5523 7.12845 20 7.57617 20 8.12845L20 12.0015C20 12.5537 19.5523 13.0015 19 13.0015L1 13.0015Z"}),(0,jsx_runtime.jsx)("rect",{y:"6.01709",width:"5.87302",height:"20",rx:"1",transform:"rotate(-90 0 6.01709)"}),(0,jsx_runtime.jsx)("rect",{y:"19.9854",width:"5.87302",height:"20",rx:"1",transform:"rotate(-90 0 19.9854)"})]}),"layout-1column":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 77 126",...props,children:(0,jsx_runtime.jsx)("rect",{width:"77",height:"126",rx:"10"})}),"layout-2column-1":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("rect",{x:"69",width:"57",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{width:"57",height:"126",rx:"2"})]}),"layout-3column":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M44 2C44 0.89543 44.8954 0 46 0H79C80.1046 0 81 0.895431 81 2V124C81 125.105 80.1046 126 79 126H46C44.8954 126 44 125.105 44 124V2Z"}),(0,jsx_runtime.jsx)("rect",{x:"88",width:"37",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{width:"37",height:"126",rx:"2"})]}),"layout-2column-3":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("rect",{width:"75",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{x:"88",width:"38",height:"126",rx:"2"})]}),"layout-2column-2":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("rect",{x:"51",width:"75",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{width:"38",height:"126",rx:"2"})]}),text:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 129 126",...props,children:(0,jsx_runtime.jsx)("path",{d:"M119.232 0L129 36.54L120.916 38.724C117.127 31.416 113.254 24.108 108.791 20.412C104.328 16.8 99.1077 16.8 93.9713 16.8H72.9204V105C72.9204 109.2 72.9204 113.4 75.6991 115.5C78.562 117.6 84.1194 117.6 89.7611 117.6V126H39.2389V117.6C44.8805 117.6 50.438 117.6 53.3009 115.5C56.0796 113.4 56.0796 109.2 56.0796 105V16.8H35.0287C29.8923 16.8 24.6717 16.8 20.2089 20.412C15.7461 24.108 11.8727 31.416 8.08355 38.724L0 36.54L9.76762 0H119.232Z"})}),message:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 40 40",...props,children:(0,jsx_runtime.jsx)("path",{d:"M36 0H4a4 4 0 0 0-4 4v36l8-8h28a4 4 0 0 0 4-4V4a4 4 0 0 0-4-4ZM8 14h24v4H8v-4Zm16 10H8v-4h16v4Zm8-12H8V8h24",fill:"#01A1B1",fillOpacity:".25"})}),"layout-white-space":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 14",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0 6C1.10457 6 2 5.10457 2 4V2H5.5C6.60457 2 7.5 1.10457 7.5 0H1C0.95575 0 0.912171 0.00287412 0.86944 0.00844586C0.781234 0.0199471 0.696641 0.0429428 0.617212 0.0758806C0.372772 0.177246 0.177246 0.372772 0.0758805 0.617213C0.0429427 0.696641 0.0199471 0.781235 0.00844584 0.86944C0.00287411 0.912171 0 0.95575 0 1V6ZM12.5 0C12.5 1.10457 13.3954 2 14.5 2H18V4C18 5.10457 18.8954 6 20 6V1C20 0.955748 19.9971 0.912176 19.9916 0.869444C19.98 0.78124 19.9571 0.69664 19.9241 0.617212C19.8228 0.372772 19.6272 0.177246 19.3828 0.0758809C19.3034 0.0429431 19.2188 0.019947 19.1306 0.0084458C19.0878 0.0028741 19.0443 0 19 0H12.5ZM20 8C18.8954 8 18 8.89543 18 10V12H14.5C13.3954 12 12.5 12.8954 12.5 14H19C19.0443 14 19.0878 13.9971 19.1306 13.9915C19.2188 13.98 19.3034 13.9571 19.3828 13.9241C19.6272 13.8228 19.8228 13.6272 19.9241 13.3828C19.9571 13.3034 19.98 13.2188 19.9916 13.1306C19.9971 13.0878 20 13.0443 20 13V8ZM7.5 14C7.5 12.8954 6.60457 12 5.5 12H2V10C2 8.89543 1.10457 8 0 8V13C0 13.0443 0.00287411 13.0878 0.00844585 13.1306C0.0199471 13.2188 0.0429427 13.3034 0.0758806 13.3828C0.177246 13.6272 0.372772 13.8228 0.617212 13.9241C0.696641 13.9571 0.781235 13.9801 0.86944 13.9916C0.912171 13.9971 0.95575 14 1 14H7.5Z",fill:props.fill})}),"section-info-accordion":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.617212 19.9241L1 19.001V19H1.9V20H1C0.864409 20 0.73512 19.973 0.617212 19.9241ZM18.1 20V19H19L19.3828 19.9241C19.2649 19.973 19.1356 20 19 20H18.1ZM20 1.9H19V1L19.9241 0.617212C19.973 0.73512 20 0.864409 20 1V1.9ZM1.9 0H1C0.864408 0 0.73512 0.0269862 0.617212 0.0758805L1 0.998965V1H1.9V0ZM0.0758806 19.3828L0.998963 19H1L1 18.1H0V19C0 19.1356 0.0269862 19.2649 0.0758806 19.3828ZM0 16.3H1V14.5H0V16.3ZM0 12.7H1V10.9H0V12.7ZM0 9.1H1V7.3H0V9.1ZM0 5.5H1V3.7H0V5.5ZM0 1.9H1V1L0.0758806 0.617212C0.0269862 0.73512 0 0.864409 0 1V1.9ZM3.7 0V1H5.5V0H3.7ZM7.3 0V1H9.1V0H7.3ZM10.9 0V1H12.7V0H10.9ZM14.5 0V1H16.3V0H14.5ZM18.1 0V1H19L19.3828 0.0758806C19.2649 0.0269862 19.1356 0 19 0H18.1ZM20 3.7H19V5.5H20V3.7ZM20 7.3H19V9.1H20V7.3ZM20 10.9H19V12.7H20V10.9ZM20 14.5H19V16.3H20V14.5ZM20 18.1H19V19L19.9241 19.3828C19.973 19.2649 20 19.1356 20 19V18.1ZM16.3 20V19H14.5V20H16.3ZM12.7 20V19H10.9V20H12.7ZM9.1 20V19H7.3V20H9.1ZM5.5 20V19H3.7V20H5.5Z"}),(0,jsx_runtime.jsx)("path",{d:"M3 12C2.44772 12 2 11.5523 2 11C2 10.4477 2.44772 10 3 10H9C9.55228 10 10 10.4477 10 11C10 11.5523 9.55228 12 9 12H3Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 3L3 8H9V3L3 3ZM2 8C2 8.55228 2.44772 9 3 9H9C9.55228 9 10 8.55228 10 8V3C10 2.44772 9.55228 2 9 2L3 2C2.44772 2 2 2.44772 2 3L2 8Z"}),(0,jsx_runtime.jsx)("path",{d:"M12 9C11.4477 9 11 8.55228 11 8V3C11 2.44772 11.4477 2 12 2L17 2C17.5523 2 18 2.44772 18 3V8C18 8.55228 17.5523 9 17 9H12Z"}),(0,jsx_runtime.jsx)("path",{d:"M3 15C2.44772 15 2 14.5523 2 14C2 13.4477 2.44772 13 3 13H9C9.55228 13 10 13.4477 10 14C10 14.5523 9.55228 15 9 15H3Z"}),(0,jsx_runtime.jsx)("path",{d:"M3 18C2.44772 18 2 17.5523 2 17C2 16.4477 2.44772 16 3 16H9C9.55228 16 10 16.4477 10 17C10 17.5523 9.55228 18 9 18H3Z"})]}),"section-image-text":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.617212 19.9241L1 19.001V19H1.9V20H1C0.864409 20 0.73512 19.973 0.617212 19.9241ZM18.1 20V19H19L19.3828 19.9241C19.2649 19.973 19.1356 20 19 20H18.1ZM20 1.9H19V1L19.9241 0.617212C19.973 0.73512 20 0.864409 20 1V1.9ZM1.9 0H1C0.864408 0 0.73512 0.0269862 0.617212 0.0758805L1 0.998965V1H1.9V0ZM0.0758806 19.3828L0.998963 19H1L1 18.1H0V19C0 19.1356 0.0269862 19.2649 0.0758806 19.3828ZM0 16.3H1V14.5H0V16.3ZM0 12.7H1V10.9H0V12.7ZM0 9.1H1V7.3H0V9.1ZM0 5.5H1V3.7H0V5.5ZM0 1.9H1V1L0.0758806 0.617212C0.0269862 0.73512 0 0.864409 0 1V1.9ZM3.7 0V1H5.5V0H3.7ZM7.3 0V1H9.1V0H7.3ZM10.9 0V1H12.7V0H10.9ZM14.5 0V1H16.3V0H14.5ZM18.1 0V1H19L19.3828 0.0758806C19.2649 0.0269862 19.1356 0 19 0H18.1ZM20 3.7H19V5.5H20V3.7ZM20 7.3H19V9.1H20V7.3ZM20 10.9H19V12.7H20V10.9ZM20 14.5H19V16.3H20V14.5ZM20 18.1H19V19L19.9241 19.3828C19.973 19.2649 20 19.1356 20 19V18.1ZM16.3 20V19H14.5V20H16.3ZM12.7 20V19H10.9V20H12.7ZM9.1 20V19H7.3V20H9.1ZM5.5 20V19H3.7V20H5.5Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.617212 19.9241L1 19.001V19H1.9V20H1C0.864409 20 0.73512 19.973 0.617212 19.9241ZM18.1 20V19H19L19.3828 19.9241C19.2649 19.973 19.1356 20 19 20H18.1ZM20 1.9H19V1L19.9241 0.617212C19.973 0.73512 20 0.864409 20 1V1.9ZM1.9 0H1C0.864408 0 0.73512 0.0269862 0.617212 0.0758805L1 0.998965V1H1.9V0ZM0.0758806 19.3828L0.998963 19H1L1 18.1H0V19C0 19.1356 0.0269862 19.2649 0.0758806 19.3828ZM0 16.3H1V14.5H0V16.3ZM0 12.7H1V10.9H0V12.7ZM0 9.1H1V7.3H0V9.1ZM0 5.5H1V3.7H0V5.5ZM0 1.9H1V1L0.0758806 0.617212C0.0269862 0.73512 0 0.864409 0 1V1.9ZM3.7 0V1H5.5V0H3.7ZM7.3 0V1H9.1V0H7.3ZM10.9 0V1H12.7V0H10.9ZM14.5 0V1H16.3V0H14.5ZM18.1 0V1H19L19.3828 0.0758806C19.2649 0.0269862 19.1356 0 19 0H18.1ZM20 3.7H19V5.5H20V3.7ZM20 7.3H19V9.1H20V7.3ZM20 10.9H19V12.7H20V10.9ZM20 14.5H19V16.3H20V14.5ZM20 18.1H19V19L19.9241 19.3828C19.973 19.2649 20 19.1356 20 19V18.1ZM16.3 20V19H14.5V20H16.3ZM12.7 20V19H10.9V20H12.7ZM9.1 20V19H7.3V20H9.1ZM5.5 20V19H3.7V20H5.5Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 3V5H5V3L3 3ZM2 5C2 5.55228 2.44772 6 3 6H5C5.55228 6 6 5.55228 6 5V3C6 2.44772 5.55228 2 5 2L3 2C2.44772 2 2 2.44772 2 3L2 5Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 15V17H5V15H3ZM2 17C2 17.5523 2.44772 18 3 18H5C5.55228 18 6 17.5523 6 17V15C6 14.4477 5.55228 14 5 14H3C2.44772 14 2 14.4477 2 15L2 17Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 9V11H5V9H3ZM2 11C2 11.5523 2.44772 12 3 12H5C5.55228 12 6 11.5523 6 11V9C6 8.44772 5.55228 8 5 8H3C2.44772 8 2 8.44772 2 9L2 11Z"}),(0,jsx_runtime.jsx)("path",{d:"M8 18C7.44771 18 7 17.5523 7 17V15C7 14.4477 7.44772 14 8 14H17C17.5523 14 18 14.4477 18 15V17C18 17.5523 17.5523 18 17 18H8Z"}),(0,jsx_runtime.jsx)("path",{d:"M8 12C7.44771 12 7 11.5523 7 11V9C7 8.44772 7.44772 8 8 8H17C17.5523 8 18 8.44772 18 9V11C18 11.5523 17.5523 12 17 12L8 12Z"}),(0,jsx_runtime.jsx)("path",{d:"M8 6C7.44771 6 7 5.55228 7 5V3C7 2.44772 7.44772 2 8 2L17 2C17.5523 2 18 2.44772 18 3V5C18 5.55228 17.5523 6 17 6L8 6Z"})]}),button:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 20.5C20 21.3 19.3 22 18.5 22H13C12.6 22 12.3 21.9 12 21.6L8 17.4L8.7 16.6C8.9 16.4 9.2 16.3 9.5 16.3H9.7L12 18V9C12 8.4 12.4 8 13 8S14 8.4 14 9V13.5L15.2 13.6L19.1 15.8C19.6 16 20 16.6 20 17.1V20.5M20 2H4C2.9 2 2 2.9 2 4V12C2 13.1 2.9 14 4 14H8V12H4V4H20V12H18V14H20C21.1 14 22 13.1 22 12V4C22 2.9 21.1 2 20 2Z"})}),tablet:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 30 30",...props,children:(0,jsx_runtime.jsx)("path",{d:"M24.2639 23.1667H5.7361V4.5H24.2639V23.1667ZM17.5556 26.6666H12.4444V25.4999H17.5556V26.6666ZM22.6666 1H7.33333C6.31667 1 5.34165 1.36875 4.62277 2.02513C3.90386 2.68151 3.5 3.57175 3.5 4.5V25.4999C3.5 26.4282 3.90386 27.3184 4.62277 27.9748C5.34165 28.6311 6.31667 29 7.33333 29H22.6666C23.6834 29 24.6583 28.6311 25.3773 27.9748C26.0961 27.3184 26.5 26.4282 26.5 25.4999V4.5C26.5 3.57175 26.0961 2.68151 25.3773 2.02513C24.6583 1.36875 23.6834 1 22.6666 1Z",fill:props.fill})}),desktop:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,16H3V4H21M21,2H3C1.89,2 1,2.89 1,4V16A2,2 0 0,0 3,18H10V20H8V22H16V20H14V18H21A2,2 0 0,0 23,16V4C23,2.89 22.1,2 21,2Z"})}),"survey-number-field":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M9.58637 16.5L10.0788 14.0677H9.30005V13.3048H10.2277L10.5656 11.6297H9.30005V10.884H10.7145L11.2127 8.40002H11.9685L11.4646 10.884H13.1539L13.6464 8.40002H14.4023L13.8984 10.884H14.7V11.6297H13.7552L13.4116 13.3048H14.7V14.0677H13.2684L12.776 16.5H12.0144L12.5068 14.0677H10.8405L10.3251 16.5H9.58637ZM10.9893 13.3048H12.6729L13.005 11.6297H11.3215L10.9893 13.3048Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M19 5H5V19H19V5ZM5 3C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3H5Z"})]}),sort:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M5.90916 10.1817H18.6362C18.8824 10.1817 19.0956 10.0918 19.2754 9.91188C19.4552 9.73198 19.5454 9.51894 19.5454 9.27272C19.5454 9.0265 19.4552 8.81357 19.2754 8.63342L12.9119 2.26985C12.7321 2.09015 12.5191 2 12.2727 2C12.0263 2 11.8134 2.09015 11.6334 2.26985L5.26985 8.63342C5.0899 8.81337 5 9.0265 5 9.27272C5 9.51889 5.0899 9.73198 5.26985 9.91188C5.45 10.0918 5.66299 10.1817 5.90916 10.1817Z"}),(0,jsx_runtime.jsx)("path",{d:"M18.6362 13.8184H5.90916C5.66279 13.8184 5.4498 13.9084 5.26985 14.0881C5.0899 14.2681 5 14.4811 5 14.7273C5 14.9735 5.0899 15.1866 5.26985 15.3665L11.6334 21.7299C11.8136 21.9099 12.0265 22 12.2727 22C12.5189 22 12.7321 21.9099 12.9119 21.7299L19.2754 15.3664C19.4552 15.1866 19.5454 14.9735 19.5454 14.7272C19.5454 14.4811 19.4552 14.2681 19.2754 14.0881C19.0956 13.9082 18.8824 13.8184 18.6362 13.8184Z"})]}),page:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M6 2C5.46957 2 4.96086 2.21071 4.58579 2.58579C4.21071 2.96086 4 3.46957 4 4V20C4 20.5304 4.21071 21.0391 4.58579 21.4142C4.96086 21.7893 5.46957 22 6 22H18C18.5304 22 19.0391 21.7893 19.4142 21.4142C19.7893 21.0391 20 20.5304 20 20V8L14 2H6ZM6 4H13V9H18V20H6V4ZM8 12V14H16V12H8ZM8 16V18H13V16H8Z"})}),"survey-short-answer":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V6C2 5.46957 2.21071 4.96086 2.58579 4.58579C2.96086 4.21071 3.46957 4 4 4H20C20.5304 4 21.0391 4.21071 21.4142 4.58579C21.7893 4.96086 22 5.46957 22 6V18C22 18.5304 21.7893 19.0391 21.4142 19.4142C21.0391 19.7893 20.5304 20 20 20ZM4 6V18H20V6H4ZM6 9H18V11H6V9ZM6 13H16V15H6V13Z"})}),"survey-long-answer":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M5 3C3.89 3 3 3.89 3 5V19C3 20.11 3.89 21 5 21H19C20.11 21 21 20.11 21 19V5C21 3.89 20.11 3 19 3H5ZM5 5H19V19H5V5ZM7 7V9H17V7H7ZM7 11V13H17V11H7ZM7 15V17H14V15H7Z"})}),"survey-linear-scale":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 5",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17.5 0C16.47 0 15.6 0.62 15.21 1.5H12.29C11.9 0.62 11.03 0 10 0C8.97 0 8.1 0.62 7.71 1.5H4.79C4.4 0.62 3.53 0 2.5 0C1.12 0 0 1.12 0 2.5C0 3.88 1.12 5 2.5 5C3.53 5 4.4 4.38 4.79 3.5H7.71C8.1 4.38 8.97 5 10 5C11.03 5 11.9 4.38 12.29 3.5H15.21C15.6 4.38 16.47 5 17.5 5C18.88 5 20 3.88 20 2.5C20 1.12 18.88 0 17.5 0Z"})}),"survey-multiple-choice":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 15H17V17H11V15M9 7H7V9H9V7M11 13H17V11H11V13M11 9H17V7H11V9M9 11H7V13H9V11M21 5V19C21 20.1 20.1 21 19 21H5C3.9 21 3 20.1 3 19V5C3 3.9 3.9 3 5 3H19C20.1 3 21 3.9 21 5M19 5H5V19H19V5M9 15H7V17H9V15Z"})}),"survey-long-answer-2":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M13.8 22.7502V20.3752L19.325 14.8502L21.7 17.2252L16.175 22.7502H13.8ZM4.8 17.7752V15.4002H12V17.7752H4.8ZM22.775 16.1502L20.4 13.7752L21.125 13.0502C21.3417 12.8335 21.6167 12.7252 21.95 12.7252C22.2833 12.7252 22.5583 12.8335 22.775 13.0502L23.5 13.7752C23.7167 13.9919 23.825 14.2669 23.825 14.6002C23.825 14.9335 23.7167 15.2085 23.5 15.4252L22.775 16.1502ZM4.8 13.0502V10.7002H15.6V13.0502H4.8ZM4.8 8.3502V6.0002H17.4V8.3502H4.8Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0 3.6002C0 2.27471 1.07452 1.2002 2.4 1.2002H19.2C20.5255 1.2002 21.6 2.27471 21.6 3.6002V9.6002H19.2V3.6002H2.4V20.4002H9.6V22.8002H2.4C1.07452 22.8002 0 21.7257 0 20.4002V3.6002Z"})]}),"survey-short-answer-2":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.6 21.5999H2.4C1.76348 21.5999 1.15303 21.347 0.702944 20.897C0.252856 20.4469 0 19.8364 0 19.1999V4.7999C0 4.16338 0.252856 3.55293 0.702944 3.10285C1.15303 2.65276 1.76348 2.3999 2.4 2.3999H21.6C22.2365 2.3999 22.847 2.65276 23.2971 3.10285C23.7471 3.55293 24 4.16338 24 4.7999V19.1999C24 19.8364 23.7471 20.4469 23.2971 20.897C22.847 21.347 22.2365 21.5999 21.6 21.5999ZM2.4 4.7999V19.1999H21.6V4.7999H2.4ZM4.8 8.3999H19.2V10.7999H4.8V8.3999ZM4.8 13.1999H13.2V15.5999H4.8V13.1999Z"})}),"survey-multiple-choice-2":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("g",{clipPath:"url(#clip0_1805_18537)",children:(0,jsx_runtime.jsx)("path",{d:"M12.825 13.7748L18.725 7.8498L17.475 6.6498L12.85 11.2748L10.425 8.8248L9.17499 10.0998L12.825 13.7748ZM7.14999 19.1998C6.49999 19.1998 5.94582 18.9706 5.48749 18.5123C5.02915 18.054 4.79999 17.4998 4.79999 16.8498V3.2998C4.79999 2.6498 5.02915 2.09147 5.48749 1.6248C5.94582 1.15814 6.49999 0.924805 7.14999 0.924805H20.7C21.35 0.924805 21.9083 1.15814 22.375 1.6248C22.8417 2.09147 23.075 2.6498 23.075 3.2998V16.8498C23.075 17.4998 22.8417 18.054 22.375 18.5123C21.9083 18.9706 21.35 19.1998 20.7 19.1998H7.14999ZM7.14999 16.8498H20.7V3.2998H7.14999V16.8498V16.8498ZM3.29999 23.0748C2.64999 23.0748 2.09165 22.8415 1.62499 22.3748C1.15832 21.9081 0.924988 21.3498 0.924988 20.6998V4.7998H3.29999V20.6998H19.2V23.0748H3.29999ZM7.14999 3.2998V16.8498V3.2998Z"})}),(0,jsx_runtime.jsx)("defs",{children:(0,jsx_runtime.jsx)("clipPath",{id:"clip0_1805_18537",children:(0,jsx_runtime.jsx)("rect",{width:"24",height:"24",fill:"white"})})})]}),"survey-single-choice":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10.475 16.9251L17.825 9.5751L16.175 7.9251L10.475 13.6251L7.7 10.8501L6.075 12.5001L10.475 16.9251ZM12 22.6251C10.5333 22.6251 9.15417 22.3501 7.8625 21.8001C6.57083 21.2501 5.44167 20.4918 4.475 19.5251C3.50833 18.5584 2.75 17.4293 2.2 16.1376C1.65 14.8459 1.375 13.4668 1.375 12.0001C1.375 10.5168 1.65 9.12926 2.2 7.8376C2.75 6.54593 3.50833 5.42093 4.475 4.4626C5.44167 3.50426 6.57083 2.74593 7.8625 2.1876C9.15417 1.62926 10.5333 1.3501 12 1.3501C13.4833 1.3501 14.8708 1.62926 16.1625 2.1876C17.4542 2.74593 18.5792 3.50426 19.5375 4.4626C20.4958 5.42093 21.2542 6.54593 21.8125 7.8376C22.3708 9.12926 22.65 10.5168 22.65 12.0001C22.65 13.4668 22.3708 14.8459 21.8125 16.1376C21.2542 17.4293 20.4958 18.5584 19.5375 19.5251C18.5792 20.4918 17.4542 21.2501 16.1625 21.8001C14.8708 22.3501 13.4833 22.6251 12 22.6251ZM12 20.2751C14.3 20.2751 16.2542 19.4709 17.8625 17.8626C19.4708 16.2543 20.275 14.3001 20.275 12.0001C20.275 9.7001 19.4708 7.74593 17.8625 6.1376C16.2542 4.52926 14.3 3.7251 12 3.7251C9.7 3.7251 7.74583 4.52926 6.1375 6.1376C4.52917 7.74593 3.725 9.7001 3.725 12.0001C3.725 14.3001 4.52917 16.2543 6.1375 17.8626C7.74583 19.4709 9.7 20.2751 12 20.2751Z"})}),section:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 14 14",...props,children:(0,jsx_runtime.jsx)("path",{d:"M2.03372 6.51634C1.73372 6.51634 1.46984 6.40523 1.24206 6.18301C1.01428 5.96078 0.900391 5.69412 0.900391 5.38301V1.98301C0.900391 1.6719 1.01428 1.40245 1.24206 1.17467C1.46984 0.946897 1.73372 0.833008 2.03372 0.833008H11.9671C12.2782 0.833008 12.5448 0.946897 12.7671 1.17467C12.9893 1.40245 13.1004 1.6719 13.1004 1.98301V5.38301C13.1004 5.69412 12.9893 5.96078 12.7671 6.18301C12.5448 6.40523 12.2782 6.51634 11.9671 6.51634H2.03372ZM2.03372 13.1663C1.73372 13.1663 1.46984 13.0525 1.24206 12.8247C1.01428 12.5969 0.900391 12.3275 0.900391 12.0163V8.61634C0.900391 8.30523 1.01428 8.03856 1.24206 7.81634C1.46984 7.59412 1.73372 7.48301 2.03372 7.48301H11.9671C12.2782 7.48301 12.5448 7.59412 12.7671 7.81634C12.9893 8.03856 13.1004 8.30523 13.1004 8.61634V12.0163C13.1004 12.3275 12.9893 12.5969 12.7671 12.8247C12.5448 13.0525 12.2782 13.1663 11.9671 13.1663H2.03372Z"})}),rectangle:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 19 19",...props,children:(0,jsx_runtime.jsx)("rect",{width:"19",height:"19",rx:"3"})}),line:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 19.7",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 2.8a2.8 2.8 0 01-3.8 2.5L5.3 15.9a2.8 2.8 0 01-2.5 3.8A2.8 2.8 0 114 14.4L14.7 4A2.7 2.7 0 0117.2 0C18.8 0 20 1.2 20 2.8z",clipRule:"evenodd",fillRule:"evenodd"})}),logic:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 18 14",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7.33301 7.83398C7.33301 5.03398 6.20801 4.11732 5.46634 3.81732C5.08301 4.70898 4.19968 5.33398 3.16634 5.33398C2.5033 5.33398 1.86742 5.07059 1.39858 4.60175C0.929735 4.13291 0.666344 3.49702 0.666344 2.83398C0.666344 2.17094 0.929735 1.53506 1.39858 1.06622C1.86742 0.597376 2.5033 0.333984 3.16634 0.333984C4.25801 0.333984 5.18301 1.02565 5.52468 2.00065L12.4747 2.00065C12.8163 1.02565 13.7413 0.333984 14.833 0.333984C15.496 0.333984 16.1319 0.597376 16.6008 1.06622C17.0696 1.53506 17.333 2.17094 17.333 2.83398C17.333 3.49703 17.0696 4.13291 16.6008 4.60175C16.1319 5.07059 15.496 5.33398 14.833 5.33398C13.7413 5.33398 12.8163 4.64232 12.4747 3.66732L8.06634 3.66732C8.60801 4.40065 8.99968 5.46732 8.99968 7.00065C8.99968 9.22565 10.1163 9.96732 10.858 10.209C11.233 9.30898 12.1247 8.66732 13.1663 8.66732C13.8294 8.66732 14.4653 8.93071 14.9341 9.39955C15.4029 9.86839 15.6663 10.5043 15.6663 11.1673C15.6663 11.8304 15.4029 12.4662 14.9341 12.9351C14.4653 13.4039 13.8294 13.6673 13.1663 13.6673C12.0497 13.6673 11.083 12.934 10.783 11.9256C9.59134 11.709 7.33301 10.9006 7.33301 7.83398ZM3.99968 2.83398C3.99968 2.61297 3.91188 2.40101 3.7556 2.24473C3.59932 2.08845 3.38736 2.00065 3.16634 2.00065C2.94533 2.00065 2.73337 2.08845 2.57709 2.24473C2.42081 2.40101 2.33301 2.61297 2.33301 2.83398C2.33301 3.055 2.42081 3.26696 2.57709 3.42324C2.73337 3.57952 2.94533 3.66732 3.16634 3.66732C3.38736 3.66732 3.59932 3.57952 3.7556 3.42324C3.91188 3.26696 3.99968 3.055 3.99968 2.83398ZM15.6663 2.83398C15.6663 2.61297 15.5785 2.40101 15.4223 2.24473C15.266 2.08845 15.054 2.00065 14.833 2.00065C14.612 2.00065 14.4 2.08845 14.2438 2.24473C14.0875 2.40101 13.9997 2.61297 13.9997 2.83398C13.9997 3.055 14.0875 3.26696 14.2438 3.42324C14.4 3.57952 14.612 3.66732 14.833 3.66732C15.054 3.66732 15.266 3.57952 15.4223 3.42324C15.5785 3.26696 15.6663 3.055 15.6663 2.83398ZM13.9997 11.1673C13.9997 10.9463 13.9119 10.7343 13.7556 10.5781C13.5993 10.4218 13.3874 10.334 13.1663 10.334C12.9453 10.334 12.7334 10.4218 12.5771 10.5781C12.4208 10.7343 12.333 10.9463 12.333 11.1673C12.333 11.3883 12.4208 11.6003 12.5771 11.7566C12.7334 11.9129 12.9453 12.0007 13.1663 12.0007C13.3874 12.0007 13.5993 11.9129 13.7556 11.7566C13.9119 11.6003 13.9997 11.3883 13.9997 11.1673Z"})}),save:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 18 18",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M-3-3h24v24H-3z",fill:"none"}),(0,jsx_runtime.jsx)("path",{d:"M14 0H2a2 2 0 00-2 2v14c0 1.1.9 2 2 2h14a2 2 0 002-2V4zM9 16a3 3 0 110-6 3 3 0 010 6zm3-10H2V2h10z"})]}),grid:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H9C9.53043 3 10.0391 3.21071 10.4142 3.58579C10.7893 3.96086 11 4.46957 11 5V9C11 9.53043 10.7893 10.0391 10.4142 10.4142C10.0391 10.7893 9.53043 11 9 11H5C4.46957 11 3.96086 10.7893 3.58579 10.4142C3.21071 10.0391 3 9.53043 3 9V5C3 4.46957 3.21071 3.96086 3.58579 3.58579ZM9 5H5V9H9V5ZM13.5858 3.58579C13.9609 3.21071 14.4696 3 15 3H19C19.5304 3 20.0391 3.21071 20.4142 3.58579C20.7893 3.96086 21 4.46957 21 5V9C21 9.53043 20.7893 10.0391 20.4142 10.4142C20.0391 10.7893 19.5304 11 19 11H15C14.4696 11 13.9609 10.7893 13.5858 10.4142C13.2107 10.0391 13 9.53043 13 9V5C13 4.46957 13.2107 3.96086 13.5858 3.58579ZM19 5H15V9H19L19 5ZM3.58579 13.5858C3.96086 13.2107 4.46957 13 5 13H9C9.53043 13 10.0391 13.2107 10.4142 13.5858C10.7893 13.9609 11 14.4696 11 15V19C11 19.5304 10.7893 20.0391 10.4142 20.4142C10.0391 20.7893 9.53043 21 9 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V15C3 14.4696 3.21071 13.9609 3.58579 13.5858ZM9 15H5V19H9V15ZM13.5858 13.5858C13.9609 13.2107 14.4696 13 15 13H19C19.5304 13 20.0391 13.2107 20.4142 13.5858C20.7893 13.9609 21 14.4696 21 15V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H15C14.4696 21 13.9609 20.7893 13.5858 20.4142C13.2107 20.0391 13 19.5304 13 19V15C13 14.4696 13.2107 13.9609 13.5858 13.5858ZM19 15H15V19H19L19 15Z"})}),projects:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M4.17157 4.17157C4.92172 3.42143 5.93913 3 7 3H11C12.0609 3 13.0783 3.42143 13.8284 4.17157C14.5786 4.92172 15 5.93913 15 7V20H18V17.8284C17.5821 17.6807 17.1981 17.4407 16.8787 17.1213C16.3161 16.5587 16 15.7957 16 15V13C16 12.2044 16.3161 11.4413 16.8787 10.8787C17.4413 10.3161 18.2043 10 19 10C19.7956 10 20.5587 10.3161 21.1213 10.8787C21.6839 11.4413 22 12.2044 22 13V15C22 15.7957 21.6839 16.5587 21.1213 17.1213C20.8019 17.4407 20.4179 17.6807 20 17.8284V20H21C21.5523 20 22 20.4477 22 21C22 21.5523 21.5523 22 21 22H3C2.44772 22 2 21.5523 2 21C2 20.4477 2.44772 20 3 20V7C3 5.93913 3.42143 4.92172 4.17157 4.17157ZM5 20H8V17C8 16.4477 8.44772 16 9 16C9.55229 16 10 16.4477 10 17V20H13V7C13 6.46957 12.7893 5.96086 12.4142 5.58579C12.0391 5.21071 11.5304 5 11 5H7C6.46957 5 5.96086 5.21071 5.58579 5.58579C5.21071 5.96086 5 6.46957 5 7V20ZM7 9C7 8.44772 7.44772 8 8 8H10C10.5523 8 11 8.44772 11 9C11 9.55228 10.5523 10 10 10H8C7.44772 10 7 9.55228 7 9ZM19 12C18.7348 12 18.4804 12.1054 18.2929 12.2929C18.1054 12.4804 18 12.7348 18 13V15C18 15.2652 18.1054 15.5196 18.2929 15.7071C18.4804 15.8946 18.7348 16 19 16C19.2652 16 19.5196 15.8946 19.7071 15.7071C19.8946 15.5196 20 15.2652 20 15V13C20 12.7348 19.8946 12.4804 19.7071 12.2929C19.5196 12.1054 19.2652 12 19 12ZM7 13C7 12.4477 7.44772 12 8 12H10C10.5523 12 11 12.4477 11 13C11 13.5523 10.5523 14 10 14H8C7.44772 14 7 13.5523 7 13Z"})}),messages:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M5 6C4.73478 6 4.48043 6.10536 4.29289 6.29289C4.21971 6.36608 4.15904 6.44944 4.11226 6.53965L12 11.7981L19.8877 6.53965C19.841 6.44944 19.7803 6.36608 19.7071 6.29289C19.5196 6.10536 19.2652 6 19 6H5ZM20 8.86852L12.5547 13.832C12.2188 14.056 11.7812 14.056 11.4453 13.832L4 8.86852V17C4 17.2652 4.10536 17.5196 4.29289 17.7071C4.48043 17.8946 4.73478 18 5 18H19C19.2652 18 19.5196 17.8946 19.7071 17.7071C19.8946 17.5196 20 17.2652 20 17V8.86852ZM2.87868 4.87868C3.44129 4.31607 4.20435 4 5 4H19C19.7956 4 20.5587 4.31607 21.1213 4.87868C21.6839 5.44129 22 6.20435 22 7V17C22 17.7957 21.6839 18.5587 21.1213 19.1213C20.5587 19.6839 19.7956 20 19 20H5C4.20435 20 3.44129 19.6839 2.87868 19.1213C2.31607 18.5587 2 17.7956 2 17V7C2 6.20435 2.31607 5.44129 2.87868 4.87868Z"})}),users:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M5.46447 3.46447C6.40215 2.52678 7.67392 2 9 2C10.3261 2 11.5979 2.52678 12.5355 3.46447C13.4732 4.40215 14 5.67392 14 7C14 8.32608 13.4732 9.59785 12.5355 10.5355C11.5979 11.4732 10.3261 12 9 12C7.67392 12 6.40215 11.4732 5.46447 10.5355C4.52678 9.59785 4 8.32608 4 7C4 5.67392 4.52678 4.40215 5.46447 3.46447ZM9 4C8.20435 4 7.44129 4.31607 6.87868 4.87868C6.31607 5.44129 6 6.20435 6 7C6 7.79565 6.31607 8.55871 6.87868 9.12132C7.44129 9.68393 8.20435 10 9 10C9.79565 10 10.5587 9.68393 11.1213 9.12132C11.6839 8.55871 12 7.79565 12 7C12 6.20435 11.6839 5.44129 11.1213 4.87868C10.5587 4.31607 9.79565 4 9 4ZM15.0313 2.88196C15.1682 2.34694 15.713 2.02426 16.248 2.16125C17.3236 2.43663 18.2768 3.06213 18.9576 3.93914C19.6383 4.81615 20.0078 5.89479 20.0078 7.005C20.0078 8.11521 19.6383 9.19385 18.9576 10.0709C18.2768 10.9479 17.3236 11.5734 16.248 11.8488C15.713 11.9857 15.1682 11.6631 15.0313 11.128C14.8943 10.593 15.2169 10.0482 15.752 9.91125C16.3973 9.74602 16.9692 9.37072 17.3777 8.84452C17.7861 8.31831 18.0078 7.67113 18.0078 7.005C18.0078 6.33887 17.7861 5.69169 17.3777 5.16548C16.9692 4.63928 16.3973 4.26398 15.752 4.09875C15.2169 3.96176 14.8943 3.41699 15.0313 2.88196ZM7 16C6.20435 16 5.44129 16.3161 4.87868 16.8787C4.31607 17.4413 4 18.2044 4 19V21C4 21.5523 3.55228 22 3 22C2.44772 22 2 21.5523 2 21V19C2 17.6739 2.52678 16.4021 3.46447 15.4645C4.40215 14.5268 5.67392 14 7 14H11C12.3261 14 13.5979 14.5268 14.5355 15.4645C15.4732 16.4021 16 17.6739 16 19V21C16 21.5523 15.5523 22 15 22C14.4477 22 14 21.5523 14 21V19C14 18.2044 13.6839 17.4413 13.1213 16.8787C12.5587 16.3161 11.7956 16 11 16H7ZM17.0317 14.9C17.1698 14.3653 17.7152 14.0437 18.25 14.1817C19.3185 14.4576 20.2658 15.0793 20.9441 15.9498C21.6224 16.8202 21.9936 17.8907 22 18.9942L22 19L22 21C22 21.5523 21.5523 22 21 22C20.4477 22 20 21.5523 20 21V19.003C19.9956 18.3418 19.7729 17.7006 19.3665 17.179C18.9595 16.6568 18.3911 16.2838 17.75 16.1182C17.2153 15.9802 16.8937 15.4348 17.0317 14.9Z"})}),proposals:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M5.96096 5.86961C8.08606 4.02614 11.3577 3 15.986 3H20C20.5523 3 21 3.44772 21 4V6C21 6.01911 20.9994 6.03822 20.9984 6.0573C20.7402 10.5562 19.4959 13.8287 17.3515 15.974C15.1973 18.129 12.2822 19 8.99999 19H6.36933C6.20008 19.6673 6.07604 20.371 5.99388 21.1104C5.93289 21.6593 5.43847 22.0549 4.88956 21.9939C4.34065 21.9329 3.94512 21.4385 4.00611 20.8896C4.12017 19.8631 4.30975 18.8746 4.58876 17.933C2.98991 15.9072 2.98599 13.9562 2.98599 13L2.986 12.9972C2.99356 10.2954 3.81138 7.73432 5.96096 5.86961ZM7.06464 17C7.28661 16.5136 7.54179 16.0526 7.83204 15.6172C8.84199 14.1023 10.3121 12.8445 12.4061 11.9138C12.9108 11.6895 13.1381 11.0985 12.9138 10.5939C12.6895 10.0892 12.0985 9.86189 11.5939 10.0862C9.18791 11.1555 7.40799 12.6477 6.16794 14.5078C5.92318 14.8749 5.70085 15.2543 5.49963 15.645C4.98597 14.574 4.98598 13.6271 4.98599 13.008L4.98599 13.0014C4.99269 10.7039 5.67492 8.7654 7.27152 7.38039C8.89293 5.97386 11.6143 5 15.986 5H19V5.97107C18.7547 10.1681 17.6093 12.8871 15.937 14.56C14.2706 16.227 11.9357 17 8.99999 17H7.06464Z"})}),"messages-inbox":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M6 5H18C18.5523 5 19 5.44772 19 6V12H17.9142C17.3838 12 16.8751 12.2107 16.5 12.5858L14.5858 14.5H9.48063L8.08111 12.7506C7.70157 12.2762 7.12694 12 6.51938 12H5V6C5 5.44772 5.44772 5 6 5ZM5 14V18C5 18.5523 5.44772 19 6 19H18C18.5523 19 19 18.5523 19 18V14H17.9142L16 15.9142C15.6249 16.2893 15.1162 16.5 14.5858 16.5H9.48063C8.87306 16.5 8.29843 16.2238 7.91889 15.7494L6.51937 14H5ZM3 6C3 4.34315 4.34315 3 6 3H18C19.6569 3 21 4.34315 21 6V18C21 19.6569 19.6569 21 18 21H6C4.34315 21 3 19.6569 3 18V6Z"})}),dashboard:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M13.9431 3.00163C14.3802 2.97674 14.7826 3.239 14.9363 3.64889L17.693 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H17C16.5832 13 16.21 12.7414 16.0637 12.3511L14.1913 7.35805L10.9701 20.2425C10.864 20.6672 10.4939 20.9735 10.0569 20.9984C9.61982 21.0233 9.21738 20.761 9.06367 20.3511L6.307 13H3C2.44772 13 2 12.5523 2 12C2 11.4477 2.44772 11 3 11H7C7.41684 11 7.78997 11.2586 7.93633 11.6489L9.80873 16.642L13.0299 3.75748C13.136 3.33279 13.5061 3.02652 13.9431 3.00163Z"})}),help:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M8.55585 3.68508C9.64778 3.23279 10.8181 3 12 3C13.1819 3 14.3522 3.23279 15.4441 3.68508C16.5361 4.13738 17.5282 4.80031 18.364 5.63604C19.1997 6.47177 19.8626 7.46392 20.3149 8.55585C20.7672 9.64778 21 10.8181 21 12C21 13.1819 20.7672 14.3522 20.3149 15.4441C19.8626 16.5361 19.1997 17.5282 18.364 18.364C17.5282 19.1997 16.5361 19.8626 15.4441 20.3149C14.3522 20.7672 13.1819 21 12 21C10.8181 21 9.64778 20.7672 8.55585 20.3149C7.46392 19.8626 6.47177 19.1997 5.63604 18.364C4.80031 17.5282 4.13738 16.5361 3.68508 15.4441C3.23279 14.3522 3 13.1819 3 12C3 10.8181 3.23279 9.64778 3.68508 8.55585C4.13738 7.46392 4.80031 6.47177 5.63604 5.63604C6.47177 4.80031 7.46392 4.13738 8.55585 3.68508ZM12 4.8C11.0545 4.8 10.1182 4.98623 9.24468 5.34807C8.37114 5.7099 7.57741 6.24025 6.90883 6.90883C6.24025 7.57741 5.7099 8.37114 5.34807 9.24468C4.98623 10.1182 4.8 11.0545 4.8 12C4.8 12.9455 4.98623 13.8818 5.34807 14.7553C5.7099 15.6289 6.24025 16.4226 6.90883 17.0912C7.57741 17.7597 8.37114 18.2901 9.24468 18.6519C10.1182 19.0138 11.0545 19.2 12 19.2C12.9455 19.2 13.8818 19.0138 14.7553 18.6519C15.6289 18.2901 16.4226 17.7597 17.0912 17.0912C17.7597 16.4226 18.2901 15.6289 18.6519 14.7553C19.0138 13.8818 19.2 12.9455 19.2 12C19.2 11.0545 19.0138 10.1182 18.6519 9.24468C18.2901 8.37114 17.7597 7.57741 17.0912 6.90883C16.4226 6.24025 15.6289 5.7099 14.7553 5.34807C13.8818 4.98623 12.9455 4.8 12 4.8ZM10.6273 6.91042C11.0767 6.68802 11.5717 6.57298 12.0732 6.57438C12.5746 6.57577 13.0689 6.69354 13.5172 6.91843C13.9654 7.14332 14.3553 7.46918 14.6562 7.87036C14.9571 8.27154 15.1607 8.73709 15.2511 9.23035C15.3415 9.72362 15.3162 10.2311 15.1771 10.7129C15.038 11.1947 14.789 11.6377 14.4496 12.0069C14.1103 12.3761 13.6899 12.6615 13.2215 12.8406C13.2139 12.8435 13.2062 12.8463 13.1986 12.849C13.1065 12.8814 13.0275 12.9428 12.9734 13.0239C12.9193 13.1051 12.893 13.2016 12.8986 13.299C12.9267 13.7953 12.5472 14.2204 12.051 14.2486C11.5547 14.2767 11.1296 13.8972 11.1014 13.401C11.0738 12.914 11.2052 12.4313 11.4757 12.0255C11.7434 11.6239 12.1331 11.3191 12.5871 11.1561C12.7918 11.0763 12.9756 10.9507 13.1244 10.7888C13.2752 10.6247 13.3859 10.4279 13.4477 10.2137C13.5095 9.99959 13.5208 9.77403 13.4806 9.5548C13.4404 9.33558 13.3499 9.12867 13.2162 8.95036C13.0825 8.77206 12.9092 8.62723 12.71 8.52728C12.5107 8.42733 12.2911 8.37499 12.0682 8.37437C11.8453 8.37375 11.6253 8.42488 11.4256 8.52372C11.2258 8.62256 11.0517 8.76643 10.917 8.94399C10.6166 9.33997 10.052 9.41743 9.65601 9.11699C9.26003 8.81656 9.18257 8.252 9.48301 7.85601C9.78611 7.45651 10.1778 7.13281 10.6273 6.91042ZM12 15.6C12.4971 15.6 12.9 16.0029 12.9 16.5V16.5103C12.9 17.0073 12.4971 17.4103 12 17.4103C11.5029 17.4103 11.1 17.0073 11.1 16.5103V16.5C11.1 16.0029 11.5029 15.6 12 15.6Z"})}),cog:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M9.86692 4.22393C10.2542 3.56068 10.8982 3.133 11.6588 3.02404C12.5741 2.89293 13.5551 3.30499 14.0546 4.08955C14.1539 4.24555 14.2339 4.40757 14.2945 4.5823C14.3083 4.62175 14.3212 4.66138 14.334 4.70075C14.4199 4.96444 14.5021 5.21687 14.7951 5.33309C15.0384 5.42961 15.2437 5.32316 15.4516 5.21536C15.4791 5.20108 15.5067 5.18678 15.5344 5.17293C15.6972 5.09153 15.8738 5.02924 16.0496 4.98286C16.784 4.78916 17.5943 4.98669 18.1778 5.4662C18.9135 6.07085 19.251 7.03911 19.0207 7.96436C18.9717 8.1613 18.8922 8.34438 18.7993 8.5243C18.7918 8.53875 18.7843 8.55309 18.7769 8.56736C18.6747 8.76331 18.5798 8.94513 18.6605 9.17384C18.7782 9.50744 19.093 9.61487 19.4067 9.72189C19.5572 9.77327 19.7075 9.82455 19.8356 9.90071C20.4405 10.2605 20.8683 10.8952 20.9714 11.5928C21.1123 12.5469 20.7295 13.5368 19.9028 14.0634C19.755 14.1575 19.5978 14.2372 19.4323 14.2952C19.3881 14.3107 19.3437 14.325 19.2998 14.3391C19.0551 14.4179 18.8235 14.4925 18.693 14.7509C18.5501 15.034 18.6941 15.3152 18.8345 15.5891C18.8988 15.7145 18.9623 15.8385 18.9971 15.9604C19.1695 16.5644 19.1089 17.1919 18.8217 17.7522C18.3409 18.6897 17.2297 19.2744 16.184 19.0587C15.97 19.0146 15.7531 18.9395 15.5568 18.8439C15.5225 18.8272 15.4888 18.8099 15.4554 18.7928C15.2266 18.6758 15.0138 18.567 14.7503 18.6991C14.496 18.8266 14.4267 19.0354 14.348 19.2727C14.3379 19.303 14.3277 19.3337 14.317 19.3648C14.2608 19.5271 14.1888 19.686 14.1035 19.8352C13.7577 20.4399 13.1098 20.869 12.4205 20.9708C11.4819 21.1094 10.5026 20.753 9.96782 19.9472C9.87163 19.8022 9.78509 19.6404 9.72541 19.4768C9.70606 19.4237 9.68856 19.3704 9.67124 19.3176C9.58228 19.0464 9.49833 18.7904 9.19459 18.6689C8.95639 18.5737 8.76565 18.6728 8.55918 18.7801C8.54702 18.7864 8.53481 18.7928 8.52253 18.7991C8.35705 18.8845 8.18784 18.9614 8.00728 19.0091C7.23757 19.2121 6.42664 19.0415 5.81188 18.5297C5.09963 17.9367 4.74579 16.9793 4.97125 16.0724C5.01498 15.8964 5.07681 15.7195 5.15795 15.5572C5.17354 15.526 5.1895 15.4953 5.20527 15.465C5.3172 15.2499 5.42029 15.0517 5.32551 14.7957C5.21157 14.4878 4.90173 14.3855 4.59786 14.2852C4.44787 14.2357 4.29934 14.1866 4.17654 14.1136C3.51001 13.7172 3.11168 13.0494 3.01804 12.2871C2.9039 11.3579 3.3381 10.4165 4.13173 9.92248C4.293 9.82212 4.46604 9.74191 4.64698 9.68328C4.6754 9.67407 4.70372 9.66527 4.7318 9.65654C4.95855 9.58605 5.16966 9.52042 5.29249 9.28583C5.45141 8.98231 5.30296 8.68506 5.15747 8.39375C5.09286 8.26439 5.02884 8.1362 4.99258 8.00916C4.8221 7.41181 4.90682 6.78901 5.19041 6.23973C5.69725 5.25806 6.82334 4.73989 7.89527 4.96779C8.07274 5.0055 8.24734 5.06905 8.41052 5.14802C8.44617 5.16528 8.48129 5.18306 8.51607 5.20068C8.76577 5.32713 8.99794 5.44471 9.2842 5.29488C9.53534 5.16344 9.62148 4.89371 9.70674 4.62672C9.75212 4.48459 9.79726 4.34323 9.86692 4.22393ZM11.3327 5.43237C11.4272 5.15599 11.5177 4.89099 11.8604 4.8178C11.9324 4.80241 12.0114 4.80214 12.0844 4.81009C12.4804 4.8531 12.5889 5.17285 12.6972 5.49229C12.7407 5.62051 12.7842 5.74869 12.8462 5.85889C13.1648 6.42481 13.6565 6.86092 14.2798 7.06066C14.7642 7.21584 15.2983 7.22101 15.7808 7.0528C15.8811 7.01783 15.9818 6.96942 16.083 6.92083C16.4048 6.76623 16.7305 6.60979 17.0568 6.87841C17.1138 6.92531 17.1582 6.98214 17.1948 7.04597C17.3688 7.34961 17.2363 7.6165 17.1016 7.8877C17.0525 7.98664 17.0031 8.08617 16.9681 8.18826C16.7877 8.71597 16.7797 9.29751 16.9776 9.82329C17.1956 10.4025 17.613 10.8671 18.1554 11.1602C18.2544 11.2138 18.3745 11.2534 18.4971 11.2939C18.8087 11.3968 19.1372 11.5052 19.1817 11.8615C19.1924 11.9471 19.1922 12.0447 19.1818 12.1303C19.1366 12.5011 18.7986 12.6136 18.4754 12.7212C18.3446 12.7648 18.2162 12.8075 18.1106 12.8663C17.6697 13.1117 17.3051 13.4931 17.0794 13.9445C16.8037 14.4957 16.765 15.126 16.9328 15.7139C16.9673 15.8345 17.0277 15.9556 17.0887 16.0777C17.2296 16.36 17.3731 16.6474 17.2026 16.9458C17.1648 17.0118 17.1138 17.0702 17.0573 17.1208C16.8838 17.2766 16.6283 17.3254 16.408 17.2471C16.3343 17.2208 16.2656 17.1818 16.1969 17.1428C16.1483 17.1152 16.0998 17.0877 16.0496 17.0647C15.8862 16.9898 15.7098 16.9274 15.5343 16.8881C14.7726 16.7177 13.9276 16.9431 13.3614 17.4842C13.1318 17.7036 12.9285 17.953 12.7982 18.2449C12.7586 18.3336 12.7269 18.4258 12.6958 18.5164C12.5904 18.8236 12.4911 19.1132 12.1068 19.1899C12.0305 19.2051 11.9594 19.2092 11.8828 19.193C11.5033 19.1126 11.3972 18.8023 11.289 18.486C11.2448 18.3567 11.2003 18.2265 11.1366 18.1105C10.8399 17.5703 10.3381 17.1535 9.75462 16.9573C9.25291 16.7887 8.7093 16.7925 8.20888 16.9607C8.10367 16.9961 7.99978 17.046 7.89641 17.0956C7.58533 17.2449 7.27888 17.3919 6.95471 17.1355C6.89583 17.0889 6.84706 17.0323 6.80829 16.9682C6.62533 16.6654 6.75783 16.401 6.89319 16.131C6.9434 16.0308 6.99399 15.9299 7.02904 15.8259C7.21161 15.2841 7.22823 14.7065 7.01701 14.1685C6.80345 13.6246 6.41871 13.1567 5.90147 12.8763C5.78938 12.8156 5.66161 12.7704 5.53382 12.7253C5.1918 12.6044 4.84965 12.4836 4.80761 12.0631C4.80015 11.9887 4.80212 11.9117 4.82082 11.8391C4.9079 11.5009 5.18965 11.408 5.47555 11.3138C5.59118 11.2756 5.70748 11.2373 5.81187 11.1824C6.27306 10.9399 6.66899 10.5589 6.90401 10.0921C7.182 9.53983 7.24714 8.91777 7.07919 8.32264C7.04424 8.19877 6.98202 8.0737 6.91923 7.94746C6.77643 7.6604 6.63062 7.36727 6.79543 7.06837C6.83158 7.00279 6.87854 6.94303 6.93286 6.89154C6.97928 6.84753 7.03103 6.812 7.08878 6.78454C7.36754 6.65196 7.58458 6.76127 7.8184 6.87902C7.87973 6.90991 7.94221 6.94138 8.00726 6.96921C8.18709 7.04615 8.37531 7.10291 8.56732 7.13993C9.33963 7.2889 10.1568 7.00263 10.7159 6.45982C10.9582 6.22462 11.1439 5.92498 11.2679 5.61251C11.2914 5.55317 11.3122 5.4925 11.3327 5.43237Z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M9.97867 9.01783C10.4596 8.68936 11.0187 8.50404 11.5916 8.42202C12.0125 8.36177 12.4814 8.41416 12.8909 8.51607C13.3152 8.62161 13.7202 8.80402 14.0782 9.05572C14.3981 9.28062 14.6741 9.55217 14.9037 9.86829C15.7711 11.0624 15.8361 12.7233 15.026 13.9671C14.7612 14.3735 14.4111 14.7235 14.011 14.9967C13.5581 15.306 13.0281 15.4925 12.4877 15.5701C12.0405 15.6343 11.5816 15.6075 11.1436 15.4985C10.6466 15.3748 10.1829 15.1567 9.77705 14.8431C9.48916 14.6206 9.24484 14.3558 9.03834 14.0567C7.9162 12.431 8.34695 10.1322 9.97867 9.01783ZM11.0092 10.4962C11.2428 10.3399 11.517 10.2533 11.7932 10.2138C11.9997 10.1842 12.2186 10.2033 12.4205 10.2519C13.7023 10.5607 14.2183 12.1508 13.3819 13.1607C13.2453 13.3256 13.0807 13.468 12.8909 13.5687C12.7026 13.6688 12.4991 13.7533 12.2861 13.7813C11.8226 13.8424 11.3518 13.7506 10.9643 13.4794C10.1915 12.9385 9.95668 11.7988 10.4946 11.0105C10.6311 10.8104 10.8076 10.6311 11.0092 10.4962Z"})]}),organigram:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M11 4C10.7348 4 10.4804 4.10536 10.2929 4.29289C10.1054 4.48043 10 4.73478 10 5V7C10 7.26522 10.1054 7.51957 10.2929 7.70711C10.4804 7.89464 10.7348 8 11 8H13C13.2652 8 13.5196 7.89464 13.7071 7.70711C13.8946 7.51957 14 7.26522 14 7V5C14 4.73478 13.8946 4.48043 13.7071 4.29289C13.5196 4.10536 13.2652 4 13 4H11ZM8.87868 2.87868C9.44129 2.31607 10.2044 2 11 2H13C13.7956 2 14.5587 2.31607 15.1213 2.87868C15.6839 3.44129 16 4.20435 16 5V7C16 7.79565 15.6839 8.55871 15.1213 9.12132C14.5587 9.68393 13.7957 10 13 10V11H16C16.7957 11 17.5587 11.3161 18.1213 11.8787C18.6839 12.4413 19 13.2044 19 14C19.7957 14 20.5587 14.3161 21.1213 14.8787C21.6839 15.4413 22 16.2044 22 17V19C22 19.7957 21.6839 20.5587 21.1213 21.1213C20.5587 21.6839 19.7957 22 19 22H17C16.2044 22 15.4413 21.6839 14.8787 21.1213C14.3161 20.5587 14 19.7957 14 19V17C14 16.2044 14.3161 15.4413 14.8787 14.8787C15.4413 14.3161 16.2044 14 17 14C17 13.7348 16.8946 13.4804 16.7071 13.2929C16.5196 13.1054 16.2652 13 16 13H8C7.73478 13 7.48043 13.1054 7.29289 13.2929C7.10536 13.4804 7 13.7348 7 14C7.79565 14 8.55871 14.3161 9.12132 14.8787C9.68393 15.4413 10 16.2044 10 17V19C10 19.7957 9.68393 20.5587 9.12132 21.1213C8.55871 21.6839 7.79565 22 7 22H5C4.20435 22 3.44129 21.6839 2.87868 21.1213C2.31607 20.5587 2 19.7957 2 19V17C2 16.2044 2.31607 15.4413 2.87868 14.8787C3.44129 14.3161 4.20435 14 5 14C5 13.2044 5.31607 12.4413 5.87868 11.8787C6.44129 11.3161 7.20435 11 8 11H11L11 10C10.2043 10 9.44129 9.68393 8.87868 9.12132C8.31607 8.55871 8 7.79565 8 7V5C8 4.20435 8.31607 3.44129 8.87868 2.87868ZM5 16C4.73478 16 4.48043 16.1054 4.29289 16.2929C4.10536 16.4804 4 16.7348 4 17V19C4 19.2652 4.10536 19.5196 4.29289 19.7071C4.48043 19.8946 4.73478 20 5 20H7C7.26522 20 7.51957 19.8946 7.70711 19.7071C7.89464 19.5196 8 19.2652 8 19V17C8 16.7348 7.89464 16.4804 7.70711 16.2929C7.51957 16.1054 7.26522 16 7 16H5ZM17 16C16.7348 16 16.4804 16.1054 16.2929 16.2929C16.1054 16.4804 16 16.7348 16 17V19C16 19.2652 16.1054 19.5196 16.2929 19.7071C16.4804 19.8946 16.7348 20 17 20H19C19.2652 20 19.5196 19.8946 19.7071 19.7071C19.8946 19.5196 20 19.2652 20 19V17C20 16.7348 19.8946 16.4804 19.7071 16.2929C19.5196 16.1054 19.2652 16 19 16H17Z"})}),community:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12.8321 2.4453C12.6466 2.1671 12.3344 2 12 2C11.6656 2 11.3534 2.1671 11.168 2.4453L9.16795 5.4453C9.08337 5.57217 9.02892 5.7167 9.00877 5.86784L8.72448 8H8C7.44772 8 7 8.44772 7 9C7 9.55228 7.44772 10 8 10H8.45782L7.00877 20.8678C6.97067 21.1536 7.05773 21.4418 7.24762 21.6587C7.4375 21.8756 7.71174 22 8 22H16C16.2883 22 16.5625 21.8756 16.7524 21.6587C16.9423 21.4418 17.0293 21.1536 16.9912 20.8678L15.5422 10H16C16.5523 10 17 9.55228 17 9C17 8.44772 16.5523 8 16 8H15.2755L14.9912 5.86784C14.9711 5.7167 14.9166 5.57217 14.8321 5.4453L12.8321 2.4453ZM13.2578 8L13.0394 6.36188L12 4.80278L10.9606 6.36188L10.7422 8H13.2578ZM10.4755 10L9.14218 20H14.8578L13.5245 10H10.4755ZM2.29289 6.29289C2.68342 5.90237 3.31658 5.90237 3.70711 6.29289L5.70711 8.29289C6.09763 8.68342 6.09763 9.31658 5.70711 9.70711L3.70711 11.7071C3.31658 12.0976 2.68342 12.0976 2.29289 11.7071C1.90237 11.3166 1.90237 10.6834 2.29289 10.2929L3.58579 9L2.29289 7.70711C1.90237 7.31658 1.90237 6.68342 2.29289 6.29289ZM21.7071 7.70711C22.0976 7.31658 22.0976 6.68342 21.7071 6.29289C21.3166 5.90237 20.6834 5.90237 20.2929 6.29289L18.2929 8.29289C17.9024 8.68342 17.9024 9.31658 18.2929 9.70711L20.2929 11.7071C20.6834 12.0976 21.3166 12.0976 21.7071 11.7071C22.0976 11.3166 22.0976 10.6834 21.7071 10.2929L20.4142 9L21.7071 7.70711Z"})}),academy:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12.3714 4.07152C12.133 3.97616 11.867 3.97616 11.6286 4.07152L1.62861 8.07152C1.24895 8.22339 1 8.59109 1 9C1 9.4089 1.24895 9.77661 1.62861 9.92848L5 11.277V16C5 17.3662 6.06101 18.3912 7.31015 19.0157C8.60606 19.6637 10.2935 20 12 20C13.7065 20 15.3939 19.6637 16.6899 19.0157C17.939 18.3912 19 17.3662 19 16V11.277L21 10.477V15C21 15.5523 21.4477 16 22 16C22.5523 16 23 15.5523 23 15V9C23 8.59109 22.751 8.22339 22.3714 8.07152L12.3714 4.07152ZM17.6502 9.66289C17.6358 9.66825 17.6216 9.67393 17.6076 9.67992L12 11.923L6.39247 9.67996C6.37839 9.67394 6.36414 9.66824 6.34974 9.66286L4.69258 9L12 6.07703L19.3074 9L17.6502 9.66289ZM7 12.077L11.6286 13.9285C11.867 14.0238 12.133 14.0238 12.3714 13.9285L17 12.077V16C17 16.2251 16.7967 16.7262 15.7954 17.2269C14.8409 17.7041 13.4761 18 12 18C10.5239 18 9.15909 17.7041 8.20457 17.2269C7.20327 16.7262 7 16.2251 7 16V12.077Z"})}),book:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M2.00491 5.90004C2.00092 5.93951 1.99925 5.97929 1.99998 6.01916V18.9826C1.9983 19.0747 2.00934 19.1677 2.03382 19.2588C2.06553 19.3775 2.11851 19.4874 2.18842 19.5844C2.27298 19.7021 2.37957 19.7967 2.49917 19.8657C2.61982 19.9357 2.75645 19.9811 2.90223 19.9952C3.02031 20.0069 3.14112 19.9978 3.25887 19.9661C3.34974 19.9418 3.43551 19.9051 3.51423 19.8578C4.72691 19.161 6.10117 18.7942 7.49998 18.7942C8.89879 18.7942 10.2731 19.161 11.4857 19.8578C11.6254 19.9417 11.7873 19.9925 11.9605 19.9992C11.9737 19.9997 11.9868 20 12 20C12.0108 20 12.0216 19.9998 12.0324 19.9994C12.2082 19.9938 12.3726 19.9429 12.5142 19.8578C13.7269 19.161 15.1012 18.7942 16.5 18.7942C17.8988 18.7942 19.2731 19.161 20.4857 19.8578C20.5645 19.9051 20.6502 19.9418 20.7411 19.9661C20.8588 19.9978 20.9797 20.0069 21.0977 19.9952C21.2434 19.9811 21.38 19.9357 21.5006 19.8658C21.6204 19.7967 21.7271 19.702 21.8117 19.5841C21.8816 19.4872 21.9345 19.3774 21.9662 19.2588C21.9906 19.1677 22.0017 19.0747 22 18.9826V6.01917C22.0007 5.97926 21.9991 5.93945 21.995 5.89995C21.9807 5.75543 21.9356 5.61997 21.8663 5.5002C21.7968 5.37946 21.7013 5.27194 21.5823 5.1869C21.5504 5.16399 21.517 5.14292 21.4825 5.12384C19.9665 4.25271 18.2486 3.79419 16.5 3.79419C14.9344 3.79419 13.3934 4.16174 12 4.8639C10.6066 4.16174 9.06557 3.79419 7.49998 3.79419C5.75136 3.79419 4.03343 4.25271 2.51752 5.12384C2.48254 5.14314 2.44884 5.16448 2.41658 5.18769C2.29807 5.2726 2.20294 5.3798 2.13367 5.50014C2.06439 5.61995 2.01926 5.75547 2.00491 5.90004ZM20 6.60044C18.9117 6.07096 17.7151 5.79419 16.5 5.79419C15.2848 5.79419 14.0882 6.07096 13 6.60044V17.4267C14.1153 17.01 15.3004 16.7942 16.5 16.7942C17.6995 16.7942 18.8846 17.01 20 17.4267V6.60044ZM11 6.60044V17.4267C9.88463 17.01 8.69953 16.7942 7.49998 16.7942C6.30044 16.7942 5.11534 17.01 3.99998 17.4267V6.60044C5.08824 6.07096 6.28485 5.79419 7.49998 5.79419C8.71512 5.79419 9.91173 6.07096 11 6.60044Z"})}),reports:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M7 4C6.73478 4 6.48043 4.10536 6.29289 4.29289C6.10536 4.48043 6 4.73478 6 5V19C6 19.2652 6.10536 19.5196 6.29289 19.7071C6.48043 19.8946 6.73478 20 7 20H17C17.2652 20 17.5196 19.8946 17.7071 19.7071C17.8946 19.5196 18 19.2652 18 19L18 9H15C14.4696 9 13.9609 8.78929 13.5858 8.41421C13.2107 8.03914 13 7.53043 13 7V4H7ZM15 5.41421L16.5858 7H15V5.41421ZM4.87868 2.87868C5.44129 2.31607 6.20435 2 7 2H14C14.2652 2 14.5196 2.10536 14.7071 2.29289L19.7071 7.29289C19.8946 7.48043 20 7.73478 20 8L20 19C20 19.7956 19.6839 20.5587 19.1213 21.1213C18.5587 21.6839 17.7957 22 17 22H7C6.20435 22 5.44129 21.6839 4.87868 21.1213C4.31607 20.5587 4 19.7956 4 19V5C4 4.20435 4.31607 3.44129 4.87868 2.87868ZM9 11C9.55229 11 10 11.4477 10 12V17C10 17.5523 9.55229 18 9 18C8.44772 18 8 17.5523 8 17V12C8 11.4477 8.44772 11 9 11ZM15 13C15.5523 13 16 13.4477 16 14V17C16 17.5523 15.5523 18 15 18C14.4477 18 14 17.5523 14 17V14C14 13.4477 14.4477 13 15 13ZM12 15C12.5523 15 13 15.4477 13 16V17C13 17.5523 12.5523 18 12 18C11.4477 18 11 17.5523 11 17V16C11 15.4477 11.4477 15 12 15Z"})}),unlock:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 16 17",...props,children:(0,jsx_runtime.jsx)("path",{d:"M8.00002 11.8332C8.35364 11.8332 8.69278 11.6927 8.94283 11.4426C9.19288 11.1926 9.33335 10.8535 9.33335 10.4998C9.33335 9.75984 8.73335 9.1665 8.00002 9.1665C7.6464 9.1665 7.30726 9.30698 7.05721 9.55703C6.80716 9.80708 6.66669 10.1462 6.66669 10.4998C6.66669 10.8535 6.80716 11.1926 7.05721 11.4426C7.30726 11.6927 7.6464 11.8332 8.00002 11.8332ZM12 5.83317C12.3536 5.83317 12.6928 5.97365 12.9428 6.2237C13.1929 6.47374 13.3334 6.81288 13.3334 7.1665V13.8332C13.3334 14.1868 13.1929 14.5259 12.9428 14.776C12.6928 15.026 12.3536 15.1665 12 15.1665H4.00002C3.6464 15.1665 3.30726 15.026 3.05721 14.776C2.80716 14.5259 2.66669 14.1868 2.66669 13.8332V7.1665C2.66669 6.4265 3.26669 5.83317 4.00002 5.83317H4.66669V4.49984C4.66669 3.61578 5.01788 2.76794 5.643 2.14281C6.26812 1.51769 7.11596 1.1665 8.00002 1.1665C8.43776 1.1665 8.87121 1.25272 9.27563 1.42024C9.68005 1.58775 10.0475 1.83329 10.357 2.14281C10.6666 2.45234 10.9121 2.81981 11.0796 3.22423C11.2471 3.62864 11.3334 4.0621 11.3334 4.49984V5.1665V5.83317H12ZM8.00002 2.49984C7.46959 2.49984 6.96088 2.71055 6.58581 3.08562C6.21073 3.4607 6.00002 3.9694 6.00002 4.49984V5.83317H10H11.3334V4.49984H10C10 3.9694 9.78931 3.4607 9.41423 3.08562C9.03916 2.71055 8.53045 2.49984 8.00002 2.49984Z"})}),"notification-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M12 2C10.3151 2 8.69922 2.66601 7.50781 3.85152C6.3164 5.03703 5.64708 6.64492 5.64708 8.32148C5.64708 11.2392 5.02018 13.0376 4.45284 14.0726C4.1677 14.5928 3.89179 14.9309 3.70379 15.1283C3.60952 15.2274 3.53661 15.2918 3.49474 15.3265C3.47429 15.3435 3.4612 15.3534 3.45662 15.3568C3.07888 15.6166 2.91199 16.09 3.04545 16.5286C3.18066 16.973 3.59226 17.2769 4.05884 17.2769H19.9412C20.4078 17.2769 20.8194 16.973 20.9546 16.5286C21.088 16.09 20.9212 15.6166 20.5434 15.3568C20.5388 15.3534 20.5258 15.3435 20.5053 15.3265C20.4634 15.2918 20.3905 15.2274 20.2962 15.1283C20.1082 14.9309 19.8323 14.5928 19.5472 14.0726C18.9798 13.0376 18.353 11.2392 18.353 8.32148C18.353 6.64492 17.6836 5.03703 16.4922 3.85152C15.3008 2.66601 13.6849 2 12 2ZM3.45662 15.3568L3.46228 15.3529L3.46643 15.3501L3.45662 15.3568ZM6.26293 15.1697H17.7371C17.7208 15.1407 17.7044 15.1114 17.6881 15.0816C16.9319 13.7022 16.2353 11.5497 16.2353 8.32148C16.2353 7.20377 15.7891 6.13184 14.9948 5.34151C14.2006 4.55117 13.1233 4.10716 12 4.10716C10.8767 4.10716 9.79948 4.55117 9.00521 5.34151C8.21094 6.13184 7.76472 7.20377 7.76472 8.32148C7.76472 11.5497 7.06809 13.7022 6.31191 15.0816C6.2956 15.1114 6.27927 15.1407 6.26293 15.1697ZM20.5285 15.3467L20.5299 15.3476C20.5299 15.3476 20.5285 15.3467 19.9412 16.2233L20.5285 15.3467ZM11.3895 19.2067C11.0961 18.7034 10.4481 18.5321 9.9423 18.824C9.43648 19.116 9.26429 19.7607 9.55771 20.2641C9.80591 20.6898 10.1622 21.0432 10.5908 21.2889C11.0194 21.5345 11.5054 21.6638 12.0001 21.6638C12.4947 21.6638 12.9807 21.5345 13.4093 21.2889C13.838 21.0432 14.1942 20.6898 14.4424 20.2641C14.7358 19.7607 14.5636 19.116 14.0578 18.824C13.552 18.5321 12.9041 18.7034 12.6106 19.2067C12.5486 19.3132 12.4595 19.4015 12.3524 19.4629C12.2452 19.5244 12.1237 19.5567 12.0001 19.5567C11.8764 19.5567 11.7549 19.5244 11.6477 19.4629C11.5406 19.4015 11.4515 19.3132 11.3895 19.2067Z"})}),"vote-ballot":props=>(0,jsx_runtime.jsx)(Icon_Svg,{width:"15",height:"17",viewBox:"0 0 15 17",...props,children:(0,jsx_runtime.jsx)("path",{d:"M1.38587 16.8334C1.00543 16.8334 0.679348 16.6904 0.407609 16.4045C0.13587 16.1185 0 15.7802 0 15.3896V11.3093L2.85326 8.08694L3.8519 9.11225L1.44701 11.7906H13.553L11.2908 9.1541L12.2894 8.12879L15 11.3093V15.3896C15 15.7802 14.8641 16.1185 14.5924 16.4045C14.3207 16.6904 13.9946 16.8334 13.6141 16.8334H1.38587ZM6.60326 10.2003L3.44429 6.95702C3.14538 6.65012 3.00951 6.31184 3.03668 5.94217C3.06386 5.57251 3.22011 5.2412 3.50543 4.94826L7.74456 0.595945C8.0163 0.316951 8.34239 0.173966 8.72283 0.166991C9.10326 0.160016 9.43614 0.303001 9.72147 0.595945L12.8804 3.86018C13.1522 4.12522 13.288 4.44607 13.288 4.82271C13.288 5.19935 13.1386 5.54112 12.8397 5.84801L8.60054 10.2003C8.3288 10.4793 8.00272 10.6258 7.62228 10.6397C7.24185 10.6537 6.90217 10.5072 6.60326 10.2003ZM11.7187 4.78086L8.74321 1.72587L4.5856 5.99449L7.56114 9.0704L11.7187 4.78086Z"})})},Icon=props=>icons[props.name](props),components_Icon=Icon;try{Icon.displayName="Icon",Icon.__docgenInfo={description:"",displayName:"Icon",props:{ariaHidden:{defaultValue:null,description:"",name:"ariaHidden",required:!1,type:{name:"boolean | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"enum",value:[{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"((string | Element) & (string | Element | undefined)) | undefined"}},viewBox:{defaultValue:null,description:"",name:"viewBox",required:!1,type:{name:"string | undefined"}},fill:{defaultValue:null,description:"",name:"fill",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}},"data-testid":{defaultValue:null,description:"",name:"data-testid",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Icon/index.tsx#Icon"]={docgenInfo:Icon.__docgenInfo,name:"Icon",path:"src/components/Icon/index.tsx#Icon"})}catch(__react_docgen_typescript_loader_error){}},"./node_modules/memoizerific sync recursive":module=>{function webpackEmptyContext(req){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/memoizerific sync recursive",module.exports=webpackEmptyContext}}]); -//# sourceMappingURL=621.7c03b4d5.iframe.bundle.js.map \ No newline at end of file +`,icons={close:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z"})}),copy:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"})}),"upload-image":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0.621 79 53.713",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M72.227 39.8C71.234 34.785 66.81 31 61.5 31c-4.215 0-7.867 2.392-9.697 5.885-4.383.473-7.803 4.185-7.803 8.7 0 4.833 3.916 8.75 8.75 8.75h18.96c4.023 0 7.29-3.27 7.29-7.294 0-3.85-2.997-6.97-6.773-7.24zm-7.81 4.325v5.834h-5.833v-5.835H54.21l7.29-7.29 7.29 7.29h-4.374zM27.378 11.803c0 2.73 2.243 4.97 4.978 4.97s4.978-2.24 4.978-4.97-2.244-4.97-4.978-4.97-4.978 2.24-4.978 4.97zm7.466 0c0 1.387-1.1 2.485-2.49 2.485s-2.488-1.098-2.488-2.485c0-1.387 1.1-2.485 2.49-2.485s2.488 1.098 2.488 2.485z"}),(0,jsx_runtime.jsx)("path",{d:"M42.597 37.895h-2.833l-6.222-6.95 8.128-8.62 8.77 9.575c.562-.622 1.187-1.17 1.836-1.685l-9.673-10.57c-.255-.27-.62-.413-.99-.387-.32.018-.62.156-.837.388L31.87 29.08 18.98 14.697c-.28-.32-.707-.474-1.127-.408-.276.044-.53.182-.72.388L2.49 30.38V4.35c0-.71.533-1.244 1.244-1.244h48.533c.71 0 1.245.533 1.245 1.243V29.33c.79-.5 1.618-.932 2.488-1.276V4.35C56 2.305 54.313.62 52.267.62H3.733C1.687.62 0 2.306 0 4.35V36.65c0 2.044 1.687 3.728 3.733 3.728h37.392c.398-.884.89-1.718 1.472-2.485zm-38.864 0c-.71 0-1.245-.533-1.245-1.243v-2.62l15.536-16.657 18.395 20.52H3.732z"})]}),"upload-file":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14,13V17H10V13H7L12,8L17,13M19.35,10.03C18.67,6.59 15.64,4 12,4C9.11,4 6.6,5.64 5.35,8.03C2.34,8.36 0,10.9 0,14A6,6 0 0,0 6,20H19A5,5 0 0,0 24,15C24,12.36 21.95,10.22 19.35,10.03Z"})}),"alert-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11,15H13V17H11V15M11,7H13V13H11V7M12,2C6.47,2 2,6.5 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20Z"})}),check:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"})}),halt:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22 2 17.5 2 12 6.5 2 12 2M12 4C10.1 4 8.4 4.6 7.1 5.7L18.3 16.9C19.3 15.5 20 13.8 20 12C20 7.6 16.4 4 12 4M16.9 18.3L5.7 7.1C4.6 8.4 4 10.1 4 12C4 16.4 7.6 20 12 20C13.9 20 15.6 19.4 16.9 18.3Z"})}),"arrow-right":props=>(0,jsx_runtime.jsx)(MirrorOnRtlSvg,{viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z"})}),"arrow-down":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"m12 20-8-8 1.4-1.425 5.6 5.6V4h2v12.175l5.6-5.6L20 12Z"})}),"arrow-up":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 20V7.825l-5.6 5.6L4 12l8-8 8 8-1.4 1.425-5.6-5.6V20Z"})}),plus:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z"})}),"plus-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),delete:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7 21q-.825 0-1.412-.587Q5 19.825 5 19V6H4V4h5V3h6v1h5v2h-1v13q0 .825-.587 1.413Q17.825 21 17 21Zm2-4h2V8H9Zm4 0h2V8h-2Z"})}),edit:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z"})}),"vote-up":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M23,10C23,8.89 22.1,8 21,8H14.68L15.64,3.43C15.66,3.33 15.67,3.22 15.67,3.11C15.67,2.7 15.5,2.32 15.23,2.05L14.17,1L7.59,7.58C7.22,7.95 7,8.45 7,9V19A2,2 0 0,0 9,21H18C18.83,21 19.54,20.5 19.84,19.78L22.86,12.73C22.95,12.5 23,12.26 23,12V10M1,21H5V9H1V21Z"})}),"vote-down":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,15H23V3H19M15,3H6C5.17,3 4.46,3.5 4.16,4.22L1.14,11.27C1.05,11.5 1,11.74 1,12V14A2,2 0 0,0 3,16H9.31L8.36,20.57C8.34,20.67 8.33,20.77 8.33,20.88C8.33,21.3 8.5,21.67 8.77,21.94L9.83,23L16.41,16.41C16.78,16.05 17,15.55 17,15V5C17,3.89 16.1,3 15,3Z"})}),"chevron-right":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z"})}),"chevron-left":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z"})}),"chevron-up":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z"})}),"chevron-down":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"})}),idea:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,2A7,7 0 0,1 19,9C19,11.38 17.81,13.47 16,14.74V17A1,1 0 0,1 15,18H9A1,1 0 0,1 8,17V14.74C6.19,13.47 5,11.38 5,9A7,7 0 0,1 12,2M9,21V20H15V21A1,1 0 0,1 14,22H10A1,1 0 0,1 9,21M12,4A5,5 0 0,0 7,9C7,11.05 8.23,12.81 10,13.58V16H14V13.58C15.77,12.81 17,11.05 17,9A5,5 0 0,0 12,4Z"})}),"sidebar-input-manager":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 18 25",width:"18px",height:"25px",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Ideas-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary LightBulb-icon",d:"M8.69628 0L8.55598 0.00113636C6.27294 0.0363636 4.03628 1.01705 2.41879 2.68864C0.798979 4.36364 -0.0810757 6.60909 0.00588619 8.84886C0.0963265 11.2034 1.20132 13.4398 3.0368 14.983C3.14463 15.0739 3.20956 15.1784 3.23275 15.2966C3.52378 16.8409 4.20788 20.4545 6.37729 20.4545H11.0153C13.1858 20.4545 13.8931 16.7057 14.1598 15.2943C14.1818 15.1784 14.2468 15.0739 14.3534 14.9841C16.284 13.3602 17.3913 11.0057 17.3913 8.52273C17.3925 3.82386 13.4919 0 8.69628 0Z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Ring-1-icon",d:"M7.3048 0H0.811644C0.363617 0 0 0.339394 0 0.757576C0 1.17576 0.361993 1.51515 0.811644 1.51515H7.3048C7.75283 1.51515 8.11644 1.17576 8.11644 0.757576C8.11644 0.339394 7.75283 0 7.3048 0Z",transform:"translate(4.63794 20.4545)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-secondary Ring-2-icon",d:"M5.21771 0H0.579746C0.259726 0 0 0.339394 0 0.757576C0 1.17576 0.258567 1.51515 0.579746 1.51515H5.21771C5.53773 1.51515 5.79746 1.17576 5.79746 0.757576C5.79746 0.339394 5.53773 0 5.21771 0Z",transform:"translate(5.79761 21.9697)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Ring-3-icon",d:"M2.89873 0H0.579746C0.259726 0 0 0.339394 0 0.757576C0 1.17576 0.258567 1.51515 0.579746 1.51515H2.89873C3.21875 1.51515 3.47848 1.17576 3.47848 0.757576C3.47848 0.339394 3.21875 0 2.89873 0Z",transform:"translate(6.95703 23.4848)"})]})}),"sidebar-proposals":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"26px",height:"19px",viewBox:"0 0 26 19",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",d:"M1.18286 4.07342C1.37569 5.24106 1.55655 6.34353 2.20154 6.98852C2.86116 7.64814 3.72825 7.97795 4.59533 7.97795C5.23101 7.97795 5.86403 7.79709 6.41726 7.44334C7.96258 9.60705 9.97336 15.7684 10.6662 18.1409C10.75 18.4255 11.0093 18.6183 11.3046 18.6183C11.3099 18.6183 11.3152 18.6183 11.3205 18.6183C11.6211 18.6117 11.8804 18.4016 11.9509 18.109C11.9575 18.0837 12.2847 16.7764 13.2728 14.8242C14.3261 15.5636 15.5416 15.9532 16.7651 15.9519C18.3237 15.9519 19.877 15.3561 21.0619 14.1712C22.2003 13.0328 22.546 10.9303 22.9118 8.70539C23.3067 6.30629 23.715 3.82473 25.0728 2.4656C25.263 2.27542 25.3202 1.9895 25.2164 1.74081C25.114 1.49213 24.8707 1.32988 24.602 1.32988C19.6123 1.32988 15.0602 2.90313 12.427 5.53629C10.9069 7.05634 10.3072 9.3065 10.8644 11.4117C10.9322 11.6697 11.149 11.8625 11.4136 11.8998C11.6796 11.937 11.9403 11.8147 12.0772 11.5846C13.2954 9.56051 14.7982 7.64947 16.543 5.90334C16.8023 5.64401 17.2239 5.64401 17.4832 5.90334C17.7425 6.16266 17.7425 6.58424 17.4832 6.84356C16.9725 7.35424 16.5084 7.86092 16.0682 8.36362C16.0256 8.41282 15.9858 8.46203 15.9432 8.51123C13.451 11.3944 12.0573 14.0781 11.3405 15.8123C10.4761 13.11 8.85626 8.47001 7.37744 6.50976C8.28574 5.19185 8.15941 3.37125 6.98778 2.20095C5.59008 0.801918 3.2854 0 0.665532 0C0.396896 0 0.153528 0.162245 0.0511275 0.410933C-0.0526031 0.65962 0.00458148 0.945545 0.194754 1.13572C0.79985 1.73948 0.994012 2.92707 1.18286 4.07342Z"})}),"user-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z"})}),notification:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,19V20H3V19L5,17V11C5,7.9 7.03,5.17 10,4.29C10,4.19 10,4.1 10,4A2,2 0 0,1 12,2A2,2 0 0,1 14,4C14,4.1 14,4.19 14,4.29C16.97,5.17 19,7.9 19,11V17L21,19M14,21A2,2 0 0,1 12,23A2,2 0 0,1 10,21"})}),search:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z"})}),lock:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z"})}),facebook:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"4.588 4.588 257.717 257.719",...props,children:(0,jsx_runtime.jsx)("path",{d:"M248.082 4.588H18.812c-7.856 0-14.224 6.367-14.224 14.224v229.27c0 7.855 6.366 14.226 14.224 14.226h123.432v-99.803H108.66V123.61h33.584V94.924c0-33.287 20.33-51.413 50.024-51.413 14.225 0 26.45 1.06 30.012 1.533v34.788l-20.596.01c-16.147 0-19.274 7.673-19.274 18.934v24.832h38.515l-5.016 38.895h-33.5v99.803h65.673c7.854 0 14.223-6.37 14.223-14.225V18.813c0-7.858-6.37-14.225-14.224-14.225z"})}),"facebook-messenger":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"96.216 93 2484.567 2500",...props,children:(0,jsx_runtime.jsx)("path",{d:"M1338.5 93C652.405 93 96.216 611.187 96.216 1250.407c0 364.236 180.648 689.128 462.963 901.289V2593l422.986-233.588c112.886 31.436 232.477 48.402 356.335 48.402 686.096 0 1242.283-518.187 1242.283-1157.407S2024.596 93 1338.5 93zm123.456 1558.643l-316.357-339.507-617.284 339.507 679.012-725.31 324.074 339.507 609.568-339.507-679.013 725.31z"})}),twitter:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"1.001 0.991 298.004 242.19",...props,children:(0,jsx_runtime.jsx)("path",{d:"M94.72 243.182c112.46 0 173.96-93.168 173.96-173.96 0-2.646-.054-5.28-.173-7.903 11.938-8.63 22.314-19.4 30.498-31.66-10.955 4.868-22.744 8.146-35.11 9.625 12.623-7.57 22.313-19.543 26.886-33.817-11.812 7.003-24.895 12.093-38.823 14.84C240.8 8.426 224.917.994 207.327.994c-33.763 0-61.143 27.38-61.143 61.132 0 4.798.536 9.465 1.585 13.94-50.816-2.557-95.875-26.886-126.03-63.88-5.252 9.035-8.28 19.53-8.28 30.73 0 21.212 10.795 39.938 27.21 50.893-10.032-.31-19.455-3.063-27.69-7.646-.01.257-.01.507-.01.78 0 29.61 21.075 54.332 49.052 59.935-5.138 1.4-10.543 2.15-16.122 2.15-3.934 0-7.767-.386-11.49-1.102 7.782 24.293 30.353 41.97 57.114 42.465-20.927 16.402-47.287 26.17-75.938 26.17-4.93 0-9.798-.28-14.584-.845 27.06 17.344 59.19 27.464 93.722 27.464"})}),"microsoft-windows":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3,12V6.75L9,5.43V11.91L3,12M20,3V11.75L10,11.9V5.21L20,3M3,13L9,13.09V19.9L3,18.75V13M20,13.25V22L10,20.09V13.1L20,13.25Z"})}),google:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 533.5 544.3",...props,children:[(0,jsx_runtime.jsx)("path",{fill:"#4285f4",d:"M533.5 278.4c0-18.5-1.5-37.1-4.7-55.3H272.1v104.8h147c-6.1 33.8-25.7 63.7-54.4 82.7v68h87.7c51.5-47.4 81.1-117.4 81.1-200.2z"}),(0,jsx_runtime.jsx)("path",{fill:"#34a853",d:"M272.1 544.3c73.4 0 135.3-24.1 180.4-65.7l-87.7-68c-24.4 16.6-55.9 26-92.6 26-71 0-131.2-47.9-152.8-112.3H28.9v70.1c46.2 91.9 140.3 149.9 243.2 149.9z"}),(0,jsx_runtime.jsx)("path",{fill:"#fbbc04",d:"M119.3 324.3c-11.4-33.8-11.4-70.4 0-104.2V150H28.9c-38.6 76.9-38.6 167.5 0 244.4l90.4-70.1z"}),(0,jsx_runtime.jsx)("path",{fill:"#ea4335",d:"M272.1 107.7c38.8-.6 76.3 14 104.4 40.8l77.7-77.7C405 24.6 339.7-.8 272.1 0 169.2 0 75.1 58 28.9 150l90.4 70.1c21.5-64.5 81.8-112.4 152.8-112.4z"})]}),hoplr:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 141 164","fill-rule":"evenodd","clip-rule":"evenodd","stroke-linejoin":"round","stroke-miterlimit":"1.414",...props,children:[(0,jsx_runtime.jsx)("path",{fill:"#ff314b",d:"M69.399.001c5.638.095 11.219 2.232 15.516 5.94 11.947 10.562 23.82 21.229 35.689 31.914 10.936 9.98 17.471 24.629 17.62 39.576.051 15.57.05 31.141 0 46.712-.188 20.202-17.081 38.926-38.598 39.133-20.33.065-40.66.065-60.99 0C18.748 163.084.242 145.959.038 124.143-.011 108.572-.014 93 .038 77.43c.148-14.906 6.654-29.57 17.62-39.576C29.46 27.231 41.327 16.69 53.158 6.11 57.626 2.16 63.458-.032 69.399 0zm-.294 22.172c-.52.01-1.032.196-1.437.53C55.56 32.913 44.01 43.784 32.234 54.386c-6.406 5.846-10.24 14.431-10.326 23.193-.052 15.512-.145 31.025 0 46.537.14 8.903 7.78 16.9 16.866 16.987 20.275.065 40.55.194 60.824 0 8.764-.142 16.669-7.75 16.757-17.1.048-15.474.05-30.95 0-46.424-.087-8.762-3.898-17.327-10.327-23.193-11.754-10.58-23.57-21.077-35.343-31.605a2.348 2.348 0 0 0-1.58-.608z",fillRule:"nonzero"}),(0,jsx_runtime.jsx)("path",{fill:"none",d:"M0 0h140.87v163.324H0z"})]}),comment:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4z"})}),comments:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,12V3A1,1 0 0,0 16,2H3A1,1 0 0,0 2,3V17L6,13H16A1,1 0 0,0 17,12M21,6H19V15H6V17A1,1 0 0,0 7,18H18L22,22V7A1,1 0 0,0 21,6Z"})}),"info-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z"})}),"calendar-range":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M9,10H7V12H9V10M13,10H11V12H13V10M17,10H15V12H17V10M19,3H18V1H16V3H8V1H6V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3M19,19H5V8H19V19Z"})}),calendar:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1M17,12H12V17H17V12Z"})}),power:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16.56,5.44L15.11,6.89C16.84,7.94 18,9.83 18,12A6,6 0 0,1 12,18A6,6 0 0,1 6,12C6,9.83 7.16,7.94 8.88,6.88L7.44,5.44C5.36,6.88 4,9.28 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12C20,9.28 18.64,6.88 16.56,5.44M13,3H11V13H13"})}),"shield-checkered":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 22q-3.475-.875-5.737-3.988Q4 14.9 4 11.1V5l8-3 8 3v6.1q0 3.8-2.262 6.912Q15.475 21.125 12 22Zm0-2.1q2.425-.75 4.05-2.962 1.625-2.213 1.9-4.938H12V4.125l-6 2.25v5.175q0 .175.05.45H12Z"})}),"sidebar-settings":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"25px",height:"26px",viewBox:"0 0 25 26",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Settings-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Gear-Big-icon",d:"M16.9145 10.4054C16.9362 10.1898 16.9481 9.96992 16.9481 9.75C16.9481 9.52683 16.9351 9.30475 16.9134 9.08158L18.637 7.72958C19.0183 7.40783 19.1104 6.86725 18.8613 6.45233L17.0153 3.26192C16.7672 2.85025 16.2797 2.65525 15.7824 2.8405L13.775 3.64758C13.4143 3.39083 13.0383 3.17092 12.6375 2.98242L12.3331 0.821167C12.2464 0.35425 11.8196 0 11.3418 0H7.65851C7.17751 0 6.75067 0.361833 6.66184 0.860167L6.36176 2.99975C5.95659 3.19042 5.57634 3.4125 5.22426 3.66167L3.20492 2.84917C2.75534 2.68233 2.23426 2.86 1.98076 3.2825L0.143424 6.45883C-0.110076 6.88133 -0.0169095 7.42083 0.378507 7.75558L2.08584 9.0935C2.06526 9.31017 2.05226 9.53008 2.05226 9.75C2.05226 9.97317 2.06526 10.1952 2.08692 10.4184L0.36334 11.7704C-0.0179929 12.0922 -0.110076 12.6328 0.139091 13.0477L1.98509 16.2381C2.23317 16.6508 2.72176 16.848 3.21792 16.6595L5.22534 15.8524C5.58609 16.1092 5.96201 16.3291 6.36284 16.5176L6.66726 18.6788C6.75501 19.1458 7.18076 19.5 7.65851 19.5H11.3418C11.8228 19.5 12.2497 19.1382 12.3385 18.6398L12.6386 16.5013C13.0438 16.3096 13.424 16.0875 13.775 15.8383L15.7943 16.6508C15.9081 16.6942 16.0283 16.7158 16.1508 16.7158C16.5072 16.7158 16.83 16.5328 17.0196 16.2186L18.8569 13.0422C19.1104 12.6197 19.0173 12.0802 18.6218 11.7455L16.9145 10.4054ZM9.50017 11.9167C8.30526 11.9167 7.33351 10.9449 7.33351 9.75C7.33351 8.55508 8.30526 7.58333 9.50017 7.58333C10.6951 7.58333 11.6668 8.55508 11.6668 9.75C11.6668 10.9449 10.6951 11.9167 9.50017 11.9167Z",transform:"translate(0 6.5)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Gear-Small-icon",d:"M10.2882 6.27575L9.48332 5.65175C9.48981 5.57483 9.49307 5.49683 9.49307 5.41667C9.49307 5.33542 9.4909 5.25633 9.48657 5.17725L10.3066 4.53375C10.5861 4.28458 10.6576 3.88267 10.4735 3.54683L9.50498 1.872C9.36957 1.62283 9.10523 1.46792 8.81707 1.46792C8.74773 1.46792 8.58956 1.49608 8.52456 1.52208L7.59073 1.898C7.45531 1.80808 7.3199 1.729 7.18231 1.66075L7.04365 0.703083C7.01223 0.30875 6.67206 0 6.27015 0H4.32015C3.93881 0 3.60515 0.28275 3.54015 0.6695L3.39715 1.66725C3.25415 1.73983 3.11981 1.81675 2.99198 1.89908L2.03865 1.51558C1.97906 1.49392 1.83173 1.46792 1.76781 1.46792C1.49481 1.46792 1.2424 1.60658 1.08098 1.86008L0.100564 3.55767C-0.0868525 3.9 -0.00776914 4.30842 0.299898 4.55542L1.10265 5.18375C1.0994 5.26067 1.09723 5.33758 1.09723 5.41667C1.09723 5.49575 1.0994 5.57267 1.10265 5.6485L0.274981 6.29742C-0.00560221 6.54658 -0.0781853 6.9485 0.107065 7.2865L1.07556 8.96133C1.21098 9.2105 1.47531 9.36542 1.76348 9.36542C1.83281 9.36542 1.99098 9.33725 2.05598 9.31125L2.98982 8.93533C3.12523 9.02525 3.26065 9.10433 3.39823 9.17258L3.54232 10.1757C3.60623 10.5571 3.9334 10.8333 4.32015 10.8333H6.27015C6.65148 10.8333 6.98515 10.5506 7.05015 10.1638L7.19315 9.165C7.33506 9.0935 7.46831 9.0155 7.5929 8.93533L8.55056 9.31883C8.61015 9.3405 8.75748 9.3665 8.8214 9.3665C9.0944 9.3665 9.34682 9.22783 9.50823 8.97433L10.4897 7.27458C10.6674 6.94742 10.5948 6.54658 10.2882 6.27575ZM5.29515 6.5C4.69823 6.5 4.21182 6.01358 4.21182 5.41667C4.21182 4.81975 4.69823 4.33333 5.29515 4.33333C5.89207 4.33333 6.37848 4.81975 6.37848 5.41667C6.37848 6.01358 5.89315 6.5 5.29515 6.5Z",transform:"translate(13.9551)"})]})}),send:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M2,21L23,12L2,3V10L17,12L2,14V21Z"})}),group:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16 17V19H2V17S2 13 9 13 16 17 16 17M12.5 7.5A3.5 3.5 0 1 0 9 11A3.5 3.5 0 0 0 12.5 7.5M15.94 13A5.32 5.32 0 0 1 18 17V19H22V17S22 13.37 15.94 13M15 4A3.39 3.39 0 0 0 13.07 4.59A5 5 0 0 1 13.07 10.41A3.39 3.39 0 0 0 15 11A3.5 3.5 0 0 0 15 4Z"})}),building:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.5,1L2,6V8H21V6M16,10V17H19V10M2,22H21V19H2M10,10V17H13V10M4,10V17H7V10H4Z"})}),position:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,11.5A2.5,2.5 0 0,1 9.5,9A2.5,2.5 0 0,1 12,6.5A2.5,2.5 0 0,1 14.5,9A2.5,2.5 0 0,1 12,11.5M12,2A7,7 0 0,0 5,9C5,14.25 12,22 12,22C12,22 19,14.25 19,9A7,7 0 0,0 12,2Z"})}),mention:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,15C12.81,15 13.5,14.7 14.11,14.11C14.7,13.5 15,12.81 15,12C15,11.19 14.7,10.5 14.11,9.89C13.5,9.3 12.81,9 12,9C11.19,9 10.5,9.3 9.89,9.89C9.3,10.5 9,11.19 9,12C9,12.81 9.3,13.5 9.89,14.11C10.5,14.7 11.19,15 12,15M12,2C14.75,2 17.1,3 19.05,4.95C21,6.9 22,9.25 22,12V13.45C22,14.45 21.65,15.3 21,16C20.3,16.67 19.5,17 18.5,17C17.3,17 16.31,16.5 15.56,15.5C14.56,16.5 13.38,17 12,17C10.63,17 9.45,16.5 8.46,15.54C7.5,14.55 7,13.38 7,12C7,10.63 7.5,9.45 8.46,8.46C9.45,7.5 10.63,7 12,7C13.38,7 14.55,7.5 15.54,8.46C16.5,9.45 17,10.63 17,12V13.45C17,13.86 17.16,14.22 17.46,14.53C17.76,14.84 18.11,15 18.5,15C18.92,15 19.27,14.84 19.57,14.53C19.87,14.22 20,13.86 20,13.45V12C20,9.81 19.23,7.93 17.65,6.35C16.07,4.77 14.19,4 12,4C9.81,4 7.93,4.77 6.35,6.35C4.77,7.93 4,9.81 4,12C4,14.19 4.77,16.07 6.35,17.65C7.93,19.23 9.81,20 12,20H17V22H12C9.25,22 6.9,21 4.95,19.05C3,17.1 2,14.75 2,12C2,9.25 3,6.9 4.95,4.95C6.9,3 9.25,2 12,2Z"})}),"dots-horizontal":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z"})}),map:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15,19L9,16.89V5L15,7.11M20.5,3C20.44,3 20.39,3 20.34,3L15,5.1L9,3L3.36,4.9C3.15,4.97 3,5.15 3,5.38V20.5A0.5,0.5 0 0,0 3.5,21C3.55,21 3.61,21 3.66,20.97L9,18.9L15,21L20.64,19.1C20.85,19 21,18.85 21,18.62V3.5A0.5,0.5 0 0,0 20.5,3Z"})}),gps:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,8A4,4 0 0,1 16,12A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8M3.05,13H1V11H3.05C3.5,6.83 6.83,3.5 11,3.05V1H13V3.05C17.17,3.5 20.5,6.83 20.95,11H23V13H20.95C20.5,17.17 17.17,20.5 13,20.95V23H11V20.95C6.83,20.5 3.5,17.17 3.05,13M12,5A7,7 0 0,0 5,12A7,7 0 0,0 12,19A7,7 0 0,0 19,12A7,7 0 0,0 12,5Z"})}),"location-simple":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 36 48",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16.2 47C2.5 27.3 0 25.3 0 18a18 18 0 1136 0c0 7.3-2.5 9.3-16.2 29a2.3 2.3 0 01-3.6 0z"})}),timeline:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3,14L3.5,14.07L8.07,9.5C7.89,8.85 8.06,8.11 8.59,7.59C9.37,6.8 10.63,6.8 11.41,7.59C11.94,8.11 12.11,8.85 11.93,9.5L14.5,12.07L15,12C15.18,12 15.35,12 15.5,12.07L19.07,8.5C19,8.35 19,8.18 19,8A2,2 0 0,1 21,6A2,2 0 0,1 23,8A2,2 0 0,1 21,10C20.82,10 20.65,10 20.5,9.93L16.93,13.5C17,13.65 17,13.82 17,14A2,2 0 0,1 15,16A2,2 0 0,1 13,14L13.07,13.5L10.5,10.93C10.18,11 9.82,11 9.5,10.93L4.93,15.5L5,16A2,2 0 0,1 3,18A2,2 0 0,1 1,16A2,2 0 0,1 3,14Z"})}),survey:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 30 30",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M15 1C14.3416 1.00402 13.6958 1.17679 13.128 1.50089C12.5629 1.82261 12.0963 2.28491 11.776 2.84022H3V29H27V2.82622H18.224C17.904 2.274 17.4352 1.81511 16.8688 1.49311C16.3011 1.17226 15.6566 1.0022 15 1ZM13.68 5.29489L13.8976 4.32578C13.954 4.08387 14.0941 3.86809 14.2944 3.71444C14.4445 3.59981 14.6218 3.52368 14.8101 3.49304C14.9983 3.46241 15.1915 3.47824 15.3718 3.5391C15.5521 3.59996 15.7138 3.70389 15.842 3.84135C15.9702 3.97881 16.0609 4.14538 16.1056 4.32578L16.3232 5.29489H18.1184V6.38378H11.8848V5.27933L13.68 5.29489ZM24.4448 26.5453H5.5552V5.28089H9.3296V8.82444H20.6704V5.27778H24.4448V26.5453Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M7.1712 17.0953H13.4528V11.0644H7.1712V17.0953ZM9.728 13.5176H10.896V14.6422H9.728V13.5176Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M22.8272 12.8533H14.7536V15.3064H22.8272V12.8533Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M7.1712 24.4578H13.4528V18.4269H7.1712V24.4593V24.4578ZM9.728 20.8816H10.896V22.0047H9.728V20.8816Z",fill:props.fill}),(0,jsx_runtime.jsx)("path",{d:"M22.8272 20.2173H14.7536V22.6704H22.8272V20.2173Z",fill:props.fill})]}),download:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z"})}),"user-check":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.1,12.5L22.5,13.91L15.97,20.5L12.5,17L13.9,15.59L15.97,17.67L21.1,12.5M10,17L13,20H3V18C3,15.79 6.58,14 11,14L12.89,14.11L10,17M11,4A4,4 0 0,1 15,8A4,4 0 0,1 11,12A4,4 0 0,1 7,8A4,4 0 0,1 11,4Z"})}),label:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17.63,5.84C17.27,5.33 16.67,5 16,5H5A2,2 0 0,0 3,7V17A2,2 0 0,0 5,19H16C16.67,19 17.27,18.66 17.63,18.15L22,12L17.63,5.84Z"})}),"arrow-left":props=>(0,jsx_runtime.jsx)(MirrorOnRtlSvg,{viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z"})}),"shield-check":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,17L6,13L7.41,11.59L10,14.17L16.59,7.58L18,9M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1Z"})}),"sidebar-pages-menu":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 53 70",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Blank-Page-icon",children:[(0,jsx_runtime.jsx)("path",{className:"Fillin-Paper-icon",d:"M8.5 7.75L17 0H51V66H0V17.5L8.5 7.75Z",transform:"translate(2 1)",fill:"rgba(1, 161, 177, 0.2)"}),(0,jsx_runtime.jsxs)("g",{className:"Stroke-Paper-icon",children:[(0,jsx_runtime.jsx)("path",{d:"M51.5278 70H1.47222C0.659556 70 0 69.3467 0 68.5417V18.9583C0 18.5704 0.156055 18.2 0.429889 17.9258L18.0966 0.425833C18.3733 0.154583 18.7473 0 19.1389 0H51.5278C52.3404 0 53 0.653333 53 1.45833V68.5417C53 69.3467 52.3404 70 51.5278 70ZM2.94444 67.0833H50.0556V2.91667H19.7484L2.94444 19.5621V67.0833Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M19.1389 20.4167H1.47222C0.659556 20.4167 0 19.7633 0 18.9583C0 18.1533 0.659556 17.5 1.47222 17.5H17.6667V1.45833C17.6667 0.653333 18.3262 0 19.1389 0C19.9516 0 20.6111 0.653333 20.6111 1.45833V18.9583C20.6111 19.7633 19.9516 20.4167 19.1389 20.4167Z",fill:"#01A1B1"})]})]})}),"email-2":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 60 40",...props,children:(0,jsx_runtime.jsx)("path",{d:"M53.75 0H6.25A6.259 6.259 0 0 0 0 6.25v27.5A6.259 6.259 0 0 0 6.25 40h47.5A6.259 6.259 0 0 0 60 33.75V6.25A6.259 6.259 0 0 0 53.75 0zm-31.7 22.21l-15 12.5c-.232.195-.518.29-.8.29a1.252 1.252 0 0 1-.803-2.212l15-12.5c.53-.44 1.32-.368 1.763.16.442.532.37 1.322-.16 1.762zm7.95.332a6.98 6.98 0 0 1-3.953-1.232L5.546 7.283a1.252 1.252 0 0 1-.327-1.738 1.246 1.246 0 0 1 1.737-.325l20.502 14.027a4.476 4.476 0 0 0 5.083 0L53.042 5.22a1.25 1.25 0 0 1 1.413 2.063L33.953 21.31A6.98 6.98 0 0 1 30 22.543zM54.71 34.55a1.244 1.244 0 0 1-1.76.16l-15-12.5a1.252 1.252 0 0 1-.16-1.762c.443-.528 1.23-.6 1.763-.16l15 12.5c.527.442.6 1.232.157 1.762z",fill:"#01A1B1",fillOpacity:".25"})}),"minus-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,13H7V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),"sidebar-guide":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"23px",height:"23px",viewBox:"0 0 23 23",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.5 0C5.159 0 0 5.159 0 11.5C0 17.841 5.159 23 11.5 23C17.841 23 23 17.841 23 11.5C23 5.159 17.841 0 11.5 0ZM11.5 19C10.949 19 10.5 18.552 10.5 18C10.5 17.448 10.949 17 11.5 17C12.051 17 12.5 17.448 12.5 18C12.5 18.552 12.051 19 11.5 19ZM15 9.258C15 10.18 14.626 11.081 13.975 11.733L12.733 12.975C12.267 13.439 12 14.084 12 14.742V15.5C12 15.776 11.776 16 11.5 16C11.224 16 11 15.776 11 15.5V14.742C11 13.82 11.374 12.919 12.025 12.267L13.267 11.025C13.733 10.561 14 9.916 14 9.258V8.5C14 7.121 12.878 6 11.5 6C10.122 6 9 7.121 9 8.5V9.5C9 9.776 8.776 10 8.5 10C8.224 10 8 9.776 8 9.5V8.5C8 6.57 9.57 5 11.5 5C13.43 5 15 6.57 15 8.5V9.258Z",fill:"#32B67A"})}),paperclip:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M16.5,6V17.5A4,4 0 0,1 12.5,21.5A4,4 0 0,1 8.5,17.5V5A2.5,2.5 0 0,1 11,2.5A2.5,2.5 0 0,1 13.5,5V15.5A1,1 0 0,1 12.5,16.5A1,1 0 0,1 11.5,15.5V6H10V15.5A2.5,2.5 0 0,0 12.5,18A2.5,2.5 0 0,0 15,15.5V5A4,4 0 0,0 11,1A4,4 0 0,0 7,5V17.5A5.5,5.5 0 0,0 12.5,23A5.5,5.5 0 0,0 18,17.5V6H16.5Z"})}),code:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14.6,16.6L19.2,12L14.6,7.4L16,6L22,12L16,18L14.6,16.6M9.4,16.6L4.8,12L9.4,7.4L8,6L2,12L8,18L9.4,16.6Z"})}),"question-bubble":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 17.391 20",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15.459 0H1.932C.865 0 0 .853 0 1.905v13.333c0 1.053.865 1.904 1.932 1.904h3.865L8.696 20l2.898-2.857h3.865c1.067 0 1.932-.852 1.932-1.904V1.905C17.391.853 16.526 0 15.459 0zM9.662 15.238H7.729v-1.904h1.933v1.904zm1.995-7.376l-.864.876c-.696.686-1.131 1.262-1.131 2.691H7.729v-.477c0-1.052.435-2.004 1.13-2.695l1.203-1.2c.348-.343.565-.819.565-1.343 0-1.052-.864-1.905-1.932-1.905s-1.932.853-1.932 1.905H4.831c0-2.105 1.729-3.81 3.865-3.81s3.865 1.705 3.865 3.81c0 .838-.344 1.596-.904 2.148z"})}),"question-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11,18H13V16H11V18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,6A4,4 0 0,0 8,10H10A2,2 0 0,1 12,8A2,2 0 0,1 14,10C14,12 11,11.75 11,15H13C13,12.75 16,12.5 16,10A4,4 0 0,0 12,6Z"})}),refresh:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z"})}),translate:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12.87,15.07L10.33,12.56L10.36,12.53C12.1,10.59 13.34,8.36 14.07,6H17V4H10V2H8V4H1V6H12.17C11.5,7.92 10.44,9.75 9,11.35C8.07,10.32 7.3,9.19 6.69,8H4.69C5.42,9.63 6.42,11.17 7.67,12.56L2.58,17.58L4,19L9,14L12.11,17.11L12.87,15.07M18.5,10H16.5L12,22H14L15.12,19H19.87L21,22H23L18.5,10M15.88,17L17.5,12.67L19.12,17H15.88Z"})}),share:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,12L14,5V9C7,10 4,15 3,20C5.5,16.5 9,14.9 14,14.9V19L21,12Z"})}),flash:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7,2V13H10V22L17,10H13L17,2H7Z"})}),database:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 11q-3.75 0-6.375-1.175T3 7q0-1.65 2.625-2.825Q8.25 3 12 3t6.375 1.175Q21 5.35 21 7q0 1.65-2.625 2.825Q15.75 11 12 11Zm0 5q-3.75 0-6.375-1.175T3 12V9.5q0 1.1 1.025 1.863 1.025.762 2.45 1.237 1.425.475 2.963.687 1.537.213 2.562.213t2.562-.213q1.538-.212 2.963-.687 1.425-.475 2.45-1.237Q21 10.6 21 9.5V12q0 1.65-2.625 2.825Q15.75 16 12 16Zm0 5q-3.75 0-6.375-1.175T3 17v-2.5q0 1.1 1.025 1.863 1.025.762 2.45 1.237 1.425.475 2.963.688 1.537.212 2.562.212t2.562-.212q1.538-.213 2.963-.688t2.45-1.237Q21 15.6 21 14.5V17q0 1.65-2.625 2.825Q15.75 21 12 21Z"})}),"folder-move":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14,18V15H10V11H14V8L19,13M20,6H12L10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6Z"})}),"user-data":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 9C11 10.66 9.66 12 8 12C6.34 12 5 10.66 5 9C5 7.34 6.34 6 8 6C9.66 6 11 7.34 11 9M14 20H2V18C2 15.79 4.69 14 8 14C11.31 14 14 15.79 14 18M22 12V14H13V12M22 8V10H13V8M22 4V6H13V4Z"})}),settings:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z"})}),initiatives:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 26 19",...props,children:(0,jsx_runtime.jsx)("path",{d:"M1.183 4.073c.193 1.168.374 2.27 1.019 2.916a3.382 3.382 0 0 0 4.216.455c1.545 2.163 3.555 8.324 4.248 10.697a.664.664 0 0 0 .639.477h.015c.301-.006.56-.216.63-.509.008-.025.335-1.333 1.323-3.285 1.053.74 2.269 1.13 3.492 1.128a6.057 6.057 0 0 0 4.297-1.78c1.138-1.14 1.484-3.242 1.85-5.467.395-2.399.803-4.88 2.16-6.24a.665.665 0 1 0-.47-1.136c-4.99 0-9.542 1.574-12.175 4.207-1.52 1.52-2.12 3.77-1.563 5.876a.664.664 0 0 0 1.213.173 29.822 29.822 0 0 1 4.466-5.682.665.665 0 0 1 .94.94c-.51.511-.975 1.018-1.415 1.52-.042.05-.082.099-.125.148-2.492 2.883-3.886 5.567-4.602 7.301-.865-2.702-2.485-7.342-3.964-9.302a3.384 3.384 0 0 0-.39-4.309C5.59.801 3.286 0 .667 0a.665.665 0 0 0-.471 1.136c.605.603.799 1.791.988 2.937z"})}),"sidebar-folder":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 26 20",width:"26px",height:"20px",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Folder-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Cover-icon",d:"M23.2917 3.15789H10.7694C10.0696 3.15789 9.44992 2.72421 9.22783 2.07895L9.1325 1.79895C8.76308 0.723158 7.73067 0 6.56392 0H2.70833C1.2155 0 0 1.18105 0 2.63158V15.2632C0 16.7137 1.2155 17.8947 2.70833 17.8947H23.2917C24.7845 17.8947 26 16.7137 26 15.2632V5.78947C26 4.33895 24.7845 3.15789 23.2917 3.15789Z",transform:"translate(0 2.10526)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Back-Cover-icon",d:"M16.1861 0H0.541667C0.242667 0 1.65304e-08 0.235789 1.65304e-08 0.526316C1.65304e-08 0.816842 0.242667 1.05263 0.541667 1.05263C2.17533 1.05263 3.62158 2.06526 4.13833 3.57053L4.23367 3.85158C4.30733 4.06737 4.51425 4.21263 4.74825 4.21263L17.2694 4.21053C17.5576 4.21053 17.8577 4.25263 18.2163 4.34316C18.2618 4.35474 18.3073 4.36 18.3528 4.36C18.4708 4.36 18.5878 4.32211 18.6842 4.25053C18.8164 4.15053 18.8944 3.99684 18.8944 3.83368V2.63158C18.8944 1.18105 17.6789 0 16.1861 0Z",transform:"translate(6.02246)"})]})}),"folder-add":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14 16h2v-2h2v-2h-2v-2h-2v2h-2v2h2ZM4 20q-.825 0-1.412-.587Q2 18.825 2 18V6q0-.825.588-1.412Q3.175 4 4 4h6l2 2h8q.825 0 1.413.588Q22 7.175 22 8v10q0 .825-.587 1.413Q20.825 20 20 20Z"})}),"sidebar-activity":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 45 45",width:"45px",height:"45px",...props,children:[(0,jsx_runtime.jsx)("defs",{children:(0,jsx_runtime.jsx)("clipPath",{id:"a",clipPathUnits:"userSpaceOnUse",children:(0,jsx_runtime.jsx)("path",{d:"M198.958 198.958h1375v1375h-1375z",clipRule:"evenodd"})})}),(0,jsx_runtime.jsxs)("g",{children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",d:"M14.025 9.317a.471.471 0 00-.443.31l-5.65 15.537-.028.161v9.417c0 .52.421.941.942.941h27.308c.52 0 .942-.421.942-.941v-9.418l-.028-.16-5.65-15.538a.471.471 0 00-.443-.31zm.33.941h16.29l5.308 14.596h-8.745c-.26 0-.47.211-.47.471v2.825h-8.476v-2.825c0-.26-.21-.47-.47-.47H9.047z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent",d:"M27.208 14.025a.47.47 0 00-.333.138l-6.258 6.259-2.492-2.492a.47.47 0 10-.666.665l2.825 2.825a.47.47 0 00.666 0l6.591-6.591a.47.47 0 00-.333-.804z"})]})]}),"sidebar-workshops":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 43 43",width:"43px",height:"43px",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent",d:"M28.6 13.3l-4.5 3.1v-3.1h-9.6V22.9h9.6v-2.8l4.5 2.8z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",d:"M35.7 7.5V5.6H7.5v26.2H28l2.3 1.7 5.3 4.1v-9l.1-21.1zm-25 21.1V8.8h21.8v19.8H10.7z"})]}),"sidebar-users":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"28px",height:"28px",viewBox:"0 0 28 28",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Users-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Body-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M22.9087 1.0619L19.9068 0.0315792C19.6875 -0.0433321 19.4437 0.0177481 19.2862 0.18601C17.815 1.77183 15.9378 2.64541 14 2.64541C12.0633 2.64541 10.1862 1.77183 8.715 0.18601C8.5575 0.0177481 8.31367 -0.0433321 8.09317 0.0315792L5.0925 1.0619C2.04633 2.10835 0 4.95152 0 8.13813V8.98406C0 9.30214 0.261333 9.5603 0.583333 9.5603H27.4167C27.7398 9.5603 28 9.30214 28 8.98406V8.13813C28 4.95152 25.9548 2.10835 22.9087 1.0619Z",transform:"translate(0 18.4397)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Face-Top-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M8.16667 0C3.6645 0 0 3.61879 0 8.06737C0 8.60212 0.0676669 9.1507 0.211167 9.79494C0.2695 10.0589 0.506334 10.2467 0.7805 10.2467C1.44083 10.2467 2.23883 10.3643 2.247 10.3654C2.27967 10.3712 2.31 10.3735 2.345 10.3723C2.66467 10.3769 2.94 10.1188 2.94 9.79609C2.94 9.72579 2.92833 9.6601 2.905 9.59787C2.83383 8.44769 2.90733 7.28484 3.0695 6.91489H3.15817C5.1765 6.91489 6.181 6.28333 6.64533 5.48466C7.903 6.7109 10.4323 7.89335 12.8777 8.05008C13.0165 9.01817 13.4458 9.98164 13.4668 10.03C13.5613 10.2398 13.7713 10.3723 14 10.3723C14.0163 10.3723 14.0315 10.3723 14.0478 10.3712L15.6018 10.2456C15.8573 10.2248 16.0685 10.0416 16.1233 9.79494C16.2668 9.1507 16.3333 8.60212 16.3333 8.06737C16.3333 3.61879 12.67 0 8.16667 0Z",transform:"translate(5.83325)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-secondary Face-Bottom-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M8.16667 10.498C5.29433 10.498 2.74167 8.20461 1.68233 4.73449C0.718667 4.67917 0 3.45984 0 1.85444C0 1.33697 0.0793335 0.832184 0.2275 0.394241C0.329 0.0922908 0.659167 -0.0713615 0.964834 0.0300569C1.2705 0.130323 1.435 0.457629 1.3335 0.758426C1.225 1.08112 1.16667 1.46029 1.16667 1.85444C1.16667 2.97004 1.60533 3.58316 1.75 3.58316C1.90867 3.48635 2.12333 3.45523 2.29717 3.52553C2.46983 3.59468 2.61683 3.72722 2.66233 3.90701C3.47783 7.16046 5.691 9.34557 8.16667 9.34557C10.6435 9.34557 12.8567 7.16046 13.6722 3.90701C13.7177 3.72722 13.846 3.58085 14.0198 3.5117C14.1925 3.44256 14.3885 3.45869 14.5472 3.5555C14.7478 3.58201 15.1667 2.96888 15.1667 1.85444C15.1667 1.46029 15.1095 1.08112 15.001 0.758426C14.8983 0.457629 15.064 0.130323 15.3697 0.0300569C15.6753 -0.0713615 16.0055 0.0922908 16.107 0.394241C16.2552 0.832184 16.3333 1.33697 16.3333 1.85444C16.3333 3.45984 15.6158 4.67917 14.6522 4.73449C13.5928 8.20461 11.0402 10.498 8.16667 10.498Z",transform:"translate(5.83325 9.21985)"})]})}),"sidebar-dashboards":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"27px",height:"25px",viewBox:"0 0 27 25",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Stats-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-secondary Segment-2-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M0.452157 0C0.202566 0 0 0.197891 0 0.449752V10.3443C0 10.5962 0.202566 10.7941 0.452157 10.7941H10.3996C10.6492 10.7941 10.8518 10.5962 10.8518 10.3443C10.8518 4.64144 6.18641 0 0.452157 0Z",transform:"matrix(0.998753 -0.0499261 0.0513545 0.99868 13.2483 0.541794)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Segment-3-icon",fillRule:"evenodd",clipRule:"evenodd",d:"M11.9495 0H0.568901C0.350394 0 0.150095 0.115402 0.0556365 0.29375C-0.0388223 0.482589 -0.0115086 0.692411 0.126197 0.849777L7.52358 9.29509C7.62259 9.41049 7.76826 9.48393 7.92645 9.49442H7.96628C8.10968 9.49442 8.24852 9.44197 8.35436 9.34755C11.0003 7.07098 12.5185 3.86071 12.5185 0.524554C12.5185 0.230804 12.2636 0 11.9495 0Z",transform:"translate(14.4814 12.6067)"}),(0,jsx_runtime.jsxs)("g",{className:"cl-icon-primary Segment-1-icon",transform:"translate(1 2.01292)",children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M17.0821 19.9883C15.1739 21.5493 13.7169 21.9871 11.0531 21.9871C4.94878 21.9871 0 17.065 0 10.9935C0 4.92211 4.55288 0 10.0483 0V10.9935L17.0821 19.9883Z"}),(0,jsx_runtime.jsx)("path",{d:"M17.0821 19.9883C15.1739 21.5493 13.7169 21.9871 11.0531 21.9871C4.94878 21.9871 0 17.065 0 10.9935C0 4.92211 4.55288 0 10.0483 0V10.9935L17.0821 19.9883Z",strokeWidth:"1.1",strokeLinecap:"round",strokeLinejoin:"round"})]})]})}),"chart-bar":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M4 20V9h4v11Zm6 0V4h4v16Zm6 0v-7h4v7Z"})}),"sidebar-invitations":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"25px",height:"25px",viewBox:"0 0 25 25",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Invitations-plus-icon",d:"M11.1897 15.8621L19.8276 9.69224V6.22155V5.60345V0.431034C19.8276 0.316379 19.7819 0.206896 19.7017 0.125862C19.6216 0.0448275 19.5112 0 19.3966 0L0.431035 0.0137929C0.193103 0.0137929 0 0.206896 0 0.444827V5.60345V6.22241V9.69138L8.63793 15.8431C9.40172 15.425 10.4172 15.431 11.1897 15.8621ZM6.03448 7.32759C6.03448 7.08965 6.22759 6.89655 6.46552 6.89655H9.48276V3.87931C9.48276 3.64138 9.67586 3.44828 9.91379 3.44828C10.1517 3.44828 10.3448 3.64138 10.3448 3.87931V6.89655H13.3621C13.6 6.89655 13.7931 7.08965 13.7931 7.32759C13.7931 7.56552 13.6 7.75862 13.3621 7.75862H10.3448V10.7759C10.3448 11.0138 10.1517 11.2069 9.91379 11.2069C9.67586 11.2069 9.48276 11.0138 9.48276 10.7759V7.75862H6.46552C6.22759 7.75862 6.03448 7.56552 6.03448 7.32759Z",transform:"translate(2.58618)"}),(0,jsx_runtime.jsxs)("g",{className:"cl-icon-primary Invitations-envelope-icon",children:[(0,jsx_runtime.jsx)("path",{d:"M1.90517 3.52328C1.79138 3.44224 1.72414 3.31207 1.72414 3.17241V-2.63083e-07L0.586207 0.686207C0.225 0.987069 0 1.44397 0 1.87931V16.75C0 17.0112 0.0732759 17.2543 0.190517 17.469L10.4802 9.63103L1.90517 3.52328Z",transform:"translate(0 6.74138)"}),(0,jsx_runtime.jsx)("path",{d:"M10.6569 0.315486L-1.31541e-08 8.43273C0.209483 8.54393 0.444828 8.61204 0.697414 8.61204H22.6802C22.9328 8.61204 23.1681 8.54393 23.3776 8.43359L12.7216 0.334453C12.1457 -0.10434 11.2198 -0.1121 10.6569 0.315486Z",transform:"translate(0.811035 16.388)"}),(0,jsx_runtime.jsx)("path",{d:"M9.83965 0.65L8.75603 3.3543e-07V3.175C8.75603 3.31466 8.68879 3.44483 8.57586 3.52586L3.55161e-07 9.65172L10.2897 17.4716C10.4069 17.2569 10.4802 17.0138 10.4802 16.7526V1.8819C10.4802 1.44655 10.2552 0.989655 9.83965 0.65Z",transform:"translate(14.5198 6.73879)"})]})]}),"sidebar-messaging":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"32px",height:"17px",viewBox:"0 0 32 17",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary emails-icon",d:"M26.3743 1.04615C26.0518 0.392308 25.4067 0 24.8691 0H7.02205C5.7319 0 4.54926 0.915384 4.01169 2.48461L0.14124 13.8615C-0.0737851 14.5154 -0.0737848 15.4308 0.356266 15.9538C0.786316 16.4769 1.32388 17 1.86144 17H19.8161C21.1062 17 22.2888 16.0846 22.8264 14.5154L26.3743 3.13846C26.8044 2.48461 26.6969 1.7 26.3743 1.04615ZM10.4625 10.4615L3.47413 14.3846C3.36662 14.3846 3.36662 14.3846 3.25911 14.3846C3.04408 14.3846 2.82906 14.2538 2.72154 13.9923C2.61403 13.6 2.72154 13.3385 2.93657 13.0769L9.92489 9.15385C10.2474 9.02308 10.4625 9.15385 10.6775 9.41538C10.8925 9.80769 10.785 10.2 10.4625 10.4615ZM19.8161 14.1231C19.7085 14.2538 19.601 14.3846 19.386 14.3846C19.2785 14.3846 19.171 14.3846 19.0635 14.2538L15.3005 10.3308C15.0855 10.0692 15.0855 9.67692 15.193 9.41538C15.408 9.15385 15.7306 9.15385 15.9456 9.28462L19.7085 13.2077C20.0311 13.4692 20.0311 13.8615 19.8161 14.1231ZM22.3964 3.79231L15.408 8.63077C14.763 9.02308 14.1179 9.15385 13.4728 9.15385C12.5052 9.15385 11.5376 8.76154 10.6775 7.97692L6.80702 3.79231C6.592 3.53077 6.592 3.13846 6.80702 2.87692C7.02205 2.61538 7.34459 2.61538 7.55961 2.87692L11.4301 7.06154C12.3977 7.97692 13.7953 8.23846 14.978 7.58462L21.9663 2.87692C22.1813 2.74615 22.5039 2.87692 22.7189 3.13846C22.7189 3.26923 22.6114 3.66154 22.3964 3.79231Z",transform:"translate(5.34204)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent emails-icon",d:"M5.91319 1.30769H0.537563C0.215025 1.30769 0 1.04615 0 0.653846C0 0.261538 0.215025 0 0.537563 0H5.91319C6.23573 0 6.45076 0.261538 6.45076 0.653846C6.45076 1.04615 6.23573 1.30769 5.91319 1.30769Z",transform:"translate(0 1.30774)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent emails-icon",d:"M1.93523 1.30769H0.537563C0.215025 1.30769 0 1.04615 0 0.653846C0 0.261538 0.215025 0 0.537563 0H1.93523C2.25777 0 2.47279 0.261538 2.47279 0.653846C2.47279 1.04615 2.25777 1.30769 1.93523 1.30769Z",transform:"translate(0 14.3846)"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent emails-icon",d:"M3.22538 1.30769H0.537563C0.215025 1.30769 0 1.04615 0 0.653846C0 0.261538 0.215025 0 0.537563 0H3.22538C3.54792 0 3.76294 0.261538 3.76294 0.653846C3.76294 1.04615 3.54792 1.30769 3.22538 1.30769Z",transform:"translate(0 7.84619)"})]}),"sidebar-academy":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"25px",height:"23px",viewBox:"0 0 25 23",fill:"none",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M12.5357 22.2223C12.5214 22.2223 12.5071 22.2223 12.4928 22.2223C6.82895 22.2011 4.76591 18.2966 4.67995 18.1325C4.59877 17.9739 4.55579 17.7886 4.55579 17.6088L4.57967 11.4768C4.58444 10.8949 5.01424 10.4187 5.53955 10.424C6.06486 10.4293 6.49466 10.9002 6.48988 11.4875L6.46601 17.2914C6.65226 17.5664 7.05338 18.085 7.7029 18.5928C8.98269 19.5928 10.5969 20.1007 12.4928 20.1113C14.3552 20.1166 15.936 19.6139 17.1871 18.614C17.8318 18.0955 18.2234 17.5718 18.4049 17.2966L18.4287 11.4768C18.4335 10.8949 18.8633 10.4187 19.3887 10.424C19.9139 10.4293 20.3437 10.9002 20.339 11.4875L20.3151 17.6193C20.3151 17.7939 20.2721 17.9686 20.1957 18.122C20.1193 18.286 18.1088 22.2223 12.5357 22.2223Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M12.469 14.6724C12.3591 14.6724 12.254 14.6512 12.149 14.6089L0.635147 10.0747C0.253103 9.92659 0 9.52451 0 9.07478L0.00955097 5.90038C0.00955097 5.31841 0.439351 4.84753 0.96466 4.84753C0.96466 4.84753 0.96466 4.84753 0.969437 4.84753C1.49474 4.84753 1.92455 5.32369 1.91977 5.91096L1.91022 8.33409L12.469 12.4926L23.0898 8.31826V5.91625C23.0898 5.33428 23.5196 4.85812 24.0449 4.85812C24.5702 4.85812 25 5.33428 25 5.91625V9.06423C25 9.51395 24.7469 9.91069 24.3649 10.0589L12.7889 14.6089C12.6839 14.6512 12.5788 14.6724 12.469 14.6724Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M12.469 11.1806C12.3591 11.1806 12.254 11.1594 12.149 11.1171L0.635147 6.58294C0.253103 6.4348 0 6.0327 0 5.58828C0 5.14387 0.253103 4.74178 0.635147 4.59364L12.149 0.0595202C12.3544 -0.0198401 12.5788 -0.0198401 12.7889 0.0595202L24.3649 4.59364C24.7469 4.74178 25 5.14387 25 5.59358C25 6.04328 24.7469 6.44009 24.3649 6.59352L12.7889 11.1224C12.6839 11.1594 12.5788 11.1806 12.469 11.1806ZM3.80611 5.58828L12.469 9.00076L21.1748 5.59358L12.469 2.18108L3.80611 5.58828Z",fill:"#01A1B1"}),(0,jsx_runtime.jsx)("path",{d:"M16.041 16.778C15.6446 16.778 15.3246 16.4236 15.3246 15.9844V8.16483L12.1824 6.18609C11.8385 5.96918 11.7192 5.48243 11.9149 5.1015C12.1107 4.72057 12.5501 4.58831 12.8939 4.80523L16.3992 7.01671C16.6236 7.15955 16.7621 7.41886 16.7621 7.70455V15.9898C16.7574 16.4236 16.4326 16.778 16.041 16.778Z",fill:"#80CFD8"}),(0,jsx_runtime.jsx)("path",{d:"M16.041 18.9578C15.3008 18.9578 14.7039 18.2964 14.7039 17.4764V15.5928C14.7039 14.7728 15.3008 14.1115 16.041 14.1115C16.7812 14.1115 17.3782 14.7728 17.3782 15.5928V17.4764C17.3782 18.2964 16.7764 18.9578 16.041 18.9578Z",fill:"#80CFD8"})]}),email:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M22 6C22 4.9 21.1 4 20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6M20 6L12 11L4 6H20M20 18H4V8L12 13L20 8V18Z"})}),"money-bag":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 19 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M10 17.133v1.803c.575-.141 1-.511 1-.936 0-.397-.333-.676-1-.867zM8 15c0 .397.334.674 1 .867v-1.803c-.575.141-1 .512-1 .936z"}),(0,jsx_runtime.jsx)("g",{children:(0,jsx_runtime.jsx)("path",{d:"M6.14 6h6.72c1.265-1.128 3.196-3.049 3.312-4.365.032-.375-.07-.709-.297-.966-.142-.16-.406-.351-.867-.351-1.006 0-2.604.972-3.375 1.484C11.062.992 10.217 0 9.5 0c-.719 0-1.563.992-2.134 1.803C6.594 1.29 4.996.319 3.991.319c-.46 0-.726.191-.867.351-.227.256-.329.59-.296.965C2.942 2.95 4.875 4.872 6.14 6zM12.658 7H6.343C4.434 9.065 0 14.114 0 16.5 0 20.636 4.262 24 9.5 24s9.5-3.364 9.5-7.5c0-2.387-4.434-7.436-6.342-9.5zM10 19.959v.541a.5.5 0 0 1-1 0v-.539c-1.094-.171-1.921-.898-1.998-1.822a.5.5 0 1 1 .996-.084c.034.405.451.75 1.002.883v-2.039c-1.345-.331-2-.963-2-1.899 0-.966.86-1.773 2-1.959V12.5a.5.5 0 0 1 1 0v.539c1.094.171 1.92.896 1.998 1.822a.501.501 0 0 1-.456.541c-.267.035-.517-.182-.54-.457-.034-.405-.451-.748-1.002-.883v2.039c1.346.33 2 .961 2 1.899 0 .966-.859 1.773-2 1.959z"})})]}),home:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z"})}),"info-solid":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),dot:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 19q-2.925 0-4.962-2.038Q5 14.925 5 12t2.038-4.963Q9.075 5 12 5t4.962 2.037Q19 9.075 19 12q0 2.925-2.038 4.962Q14.925 19 12 19Z"})}),pen:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,width:"16px",height:"17px",viewBox:"0 0 16 17",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M13.44 6.0667L10.9334 3.56004L10.3467 2.97337C10.24 2.8667 10.08 2.8667 9.97337 2.97337L5.44003 7.5067C5.33337 7.61337 5.33337 7.77337 5.44003 7.88004C5.49337 7.93337 5.5467 7.93337 5.65337 7.93337C5.76003 7.93337 5.81337 7.93337 5.8667 7.88004L10.1334 3.5067L10.56 3.93337L1.8667 12.6267L4.37337 15.1334C5.12003 14.3334 8.64003 10.8667 11.52 7.98671C12.0534 7.45337 12.5867 6.92004 13.0667 6.44004L13.44 6.81337C13.5467 6.92004 13.7067 6.92004 13.8134 6.81337C13.92 6.7067 13.92 6.54671 13.8134 6.44004L13.44 6.0667Z"}),(0,jsx_runtime.jsx)("path",{d:"M15.36 1.48003C14.72 0.786698 13.6534 0.840031 12.8534 1.5867L11.3067 3.13336L13.8134 5.64003C14.4 5.05336 14.9334 4.52003 15.36 4.09336C15.7867 3.72003 16 3.1867 16 2.7067C15.9467 2.2267 15.7334 1.80003 15.36 1.48003Z"}),(0,jsx_runtime.jsx)("path",{d:"M0.0533414 16.6267C8.0578e-06 16.7333 0.0533414 16.84 0.106675 16.9467C0.160008 16.9467 0.213341 17 0.266675 17C0.320008 17 0.320008 17 0.373341 17L3.94667 15.4533L1.54667 13.0533L0.0533414 16.6267Z"})]}),"cl-favicon":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20.034",...props,children:[(0,jsx_runtime.jsx)("path",{fill:"none",d:"M-2-1.966h24v24H-2z"}),(0,jsx_runtime.jsx)("path",{d:"M12.953 2.973H3.588v4.923c0 2.167.267 4.109.848 5.69.49 1.354 1.16 2.529 2.007 3.432.045.046.09.09.09.135.356.362.713.679 1.115.947.044.046.09.046.09.091 0 0 .044 0 .044.046 0 0 .045 0 .045.045.89.586 1.65.723 1.739.768l.267.044.267-.044c.09 0 .491-.091 1.117-.407.757-.361 1.471-.949 2.094-1.58.848-.905 1.517-2.08 2.008-3.433.579-1.626.846-3.522.846-5.69V5.636c.044-.27.044-.497.044-.677V2.973zM5.06 6.676V4.463h4.103V6.09L7.648 7.625H5.06zm4.102 10.567c-.133-.09-.312-.18-.446-.271h-.044s-.045 0-.045-.046c-.045 0-.045-.045-.09-.045a7.219 7.219 0 01-.89-.768l-.135-.134c-.713-.768-1.25-1.716-1.65-2.892-.4-1.127-.668-2.481-.758-3.972h2.542l1.516 1.536zm.715-7.947l-.893-.905.893-.902.89.902zm4.057 3.791c-.4 1.176-.98 2.124-1.693 2.892a6.249 6.249 0 01-1.65 1.264V10.65l1.514-1.536h2.587c-.09 1.49-.312 2.8-.758 3.972zm.758-8.533V7.58h-2.587L10.59 6.044v-1.58h4.102z"})]}),filter:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 21v-6h2v2h8v2h-8v2Zm-8-2v-2h6v2Zm4-4v-2H3v-2h4V9h2v6Zm4-2v-2h10v2Zm4-4V3h2v2h4v2h-4v2ZM3 7V5h10v2Z"})}),clock:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z"})}),bullseye:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,10.84 21.79,9.69 21.39,8.61L19.79,10.21C19.93,10.8 20,11.4 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.6,4 13.2,4.07 13.79,4.21L15.4,2.6C14.31,2.21 13.16,2 12,2M19,2L15,6V7.5L12.45,10.05C12.3,10 12.15,10 12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12C14,11.85 14,11.7 13.95,11.55L16.5,9H18L22,5H19V2M12,6A6,6 0 0,0 6,12A6,6 0 0,0 12,18A6,6 0 0,0 18,12H16A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8V6Z"})}),"email-check":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 52 52",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M45.5 2.16663H6.50004C3.51221 2.16663 1.08337 4.59763 1.08337 7.58329V31.4166C1.08337 34.4023 3.51221 36.8333 6.50004 36.8333H11.0067C11.5462 36.8333 12.0034 36.4368 12.0792 35.9038C13.0694 29.0225 19.0537 23.8333 26 23.8333C32.9464 23.8333 38.9307 29.0225 39.9209 35.9038C39.9967 36.4368 40.6272 36.8333 41.1667 36.8333H45.5C48.4879 36.8333 50.9167 34.4023 50.9167 31.4166V7.58329C50.9167 4.59763 48.4879 2.16663 45.5 2.16663ZM18.1004 21.3503L7.26704 32.1836C7.05471 32.3938 6.77737 32.5 6.50004 32.5C6.22271 32.5 5.94537 32.3938 5.73304 32.1836C5.31054 31.7611 5.31054 31.0743 5.73304 30.6518L16.5664 19.8185C16.9889 19.396 17.6757 19.396 18.0982 19.8185C18.5207 20.241 18.5229 20.9256 18.1004 21.3503ZM26 21.6883C24.843 21.6883 23.6882 21.333 22.7002 20.6201L5.86521 8.46296C5.37987 8.11196 5.27154 7.43379 5.62254 6.94846C5.97354 6.46096 6.64954 6.35696 7.13487 6.70579L23.9699 18.863C25.2005 19.7535 26.8017 19.7535 28.0324 18.863L44.8674 6.70579C45.3527 6.35479 46.0287 6.46313 46.3797 6.94846C46.7307 7.43379 46.6202 8.11196 46.137 8.46079L29.302 20.618C28.3119 21.3308 27.157 21.6883 26 21.6883ZM46.267 32.1836C46.0547 32.3938 45.7774 32.5 45.5 32.5C45.2227 32.5 44.9454 32.3938 44.733 32.1836L33.8997 21.3503C33.4772 20.9278 33.4772 20.241 33.8997 19.8185C34.3222 19.396 35.009 19.396 35.4315 19.8185L46.2649 30.6518C46.6895 31.0743 46.6895 31.759 46.267 32.1836Z",fillOpacity:"0.6"}),(0,jsx_runtime.jsx)("path",{d:"M26 26C19.4307 26 14.0834 31.3452 14.0834 37.9167C14.0834 44.4882 19.4307 49.8333 26 49.8333C32.5694 49.8333 37.9167 44.4882 37.9167 37.9167C37.9167 31.3452 32.5694 26 26 26ZM32.1837 35.4337L24.6004 43.017C24.388 43.2272 24.1107 43.3333 23.8334 43.3333C23.556 43.3333 23.2787 43.2272 23.0664 43.017L18.733 38.6837C18.3105 38.2612 18.3105 37.5743 18.733 37.1518C19.1555 36.7293 19.8424 36.7293 20.2649 37.1518L23.8334 40.7182L30.6497 33.9018C31.0722 33.4793 31.759 33.4793 32.1815 33.9018C32.604 34.3243 32.6062 35.009 32.1837 35.4337Z"})]}),"check-circle":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"})}),template:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 23 23",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M12.65 3.833h-2.3c-.843 0-1.533-.69-1.533-1.533S9.507.767 10.35.767h2.3c.843 0 1.533.69 1.533 1.533s-.69 1.533-1.533 1.533zm-2.3-2.3c-.46 0-.767.307-.767.767s.307.767.767.767h2.3c.46 0 .767-.307.767-.767s-.307-.767-.767-.767h-2.3zM21.237 13.033H1.763c-.766 0-1.38.537-1.38 1.15 0 .614.614 1.15 1.38 1.15h19.55c.767 0 1.38-.536 1.38-1.15 0-.613-.69-1.15-1.456-1.15z"}),(0,jsx_runtime.jsx)("path",{d:"M1.533 12.267H21.39c.077 0 .153 0 .23-.077.077-.077.153-.153.153-.307v-9.2c.077-.23-.076-.383-.306-.383h-6.21c-.154 0-.384.153-.384.307C14.72 3.757 13.8 4.6 12.65 4.6h-2.3c-1.15 0-2.07-.843-2.3-1.993 0-.154-.153-.307-.383-.307H1.533c-.23 0-.383.153-.383.383v9.2c0 .077.077.23.153.307.077.077.154.077.23.077zM11.5 1.533c-.23 0-.383-.153-.383-.383V.383c0-.23.153-.383.383-.383s.383.153.383.383v.767c0 .23-.153.383-.383.383zM8.357 16.483L5.75 21.697c-.077.153 0 .383.153.536h.23c.154 0 .307-.076.307-.23l2.76-5.52h-.843zM11.117 16.483v6.134c0 .23.153.383.383.383s.383-.153.383-.383v-6.134h-.766zM14.797 16.483h-.844l2.607 5.52c.077.154.23.23.383.23h.154c.23-.076.306-.306.153-.536l-2.453-5.214z"})]}),"blank-paper":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 17 21",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15.938 0H6.312c-.02 0-.036.009-.056.011a.385.385 0 0 0-.055.012.433.433 0 0 0-.198.106L.753 5.378a.43.43 0 0 0-.105.197.424.424 0 0 0-.012.056c-.002.02-.011.036-.011.056v14.875c0 .242.196.438.438.438h14.874a.438.438 0 0 0 .438-.438V.438A.438.438 0 0 0 15.937 0zM5.874 1.494v3.319a.438.438 0 0 1-.438.437H2.12l3.756-3.756z"})}),list:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M9,5V9H21V5M9,19H21V15H9M9,14H21V10H9M4,9H8V5H4M4,19H8V15H4M4,14H8V10H4V14Z"})}),menu:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z"})}),link:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z"})}),"participation-level":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M23.5 10.125H22V1.94a.724.724 0 0 1 1 .685.5.5 0 0 0 1 0c0-.618-.315-1.177-.845-1.497a1.74 1.74 0 0 0-1.719-.05L2.312 11.163c-.008.003-.014.008-.022.01l-.423.224A3.494 3.494 0 0 0 0 14.493v.13a.5.5 0 0 0 1 0v-.13c0-.79.384-1.505 1-1.972v6.604H.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h23a.5.5 0 0 0 .5-.5v-12a.5.5 0 0 0-.5-.5zM3 11.93L21 2.44v7.685h-2.5a.5.5 0 0 0-.5.5v2.5h-5.5a.5.5 0 0 0-.5.5v2.5H6.5a.5.5 0 0 0-.5.5v2.5H3V11.93z"})}),key:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7 14C5.9 14 5 13.1 5 12S5.9 10 7 10 9 10.9 9 12 8.1 14 7 14M12.6 10C11.8 7.7 9.6 6 7 6C3.7 6 1 8.7 1 12S3.7 18 7 18C9.6 18 11.8 16.3 12.6 14H16V18H20V14H23V10H12.6Z"})}),minus:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,13H5V11H19V13Z"})}),inbox:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M19,15H15A3,3 0 0,1 12,18A3,3 0 0,1 9,15H5V5H19M19,3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3Z"})}),bookmark:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17,3H7A2,2 0 0,0 5,5V21L12,18L19,21V5C19,3.89 18.1,3 17,3Z"})}),"bookmark-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17 3H7c-1.1 0-2 .9-2 2v16l7-3 7 3V5c0-1.1-.9-2-2-2zm0 15-5-2.18L7 18V5h10v13z"})}),eye:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z"})}),"eye-off":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.2 16.38,18.66L16.81,19.08L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z"})}),"open-in-new":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z"})}),file:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z"})}),"file-add":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 18h2v-3h3v-2h-3v-3h-2v3H8v2h3Zm-5 4q-.825 0-1.412-.587Q4 20.825 4 20V4q0-.825.588-1.413Q5.175 2 6 2h8l6 6v12q0 .825-.587 1.413Q18.825 22 18 22Zm7-13h5l-5-5Z"})}),"folder-solid":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"})}),"folder-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20,18H4V8H20M20,6H12L10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6Z"})}),flag:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M14.4,6L14,4H5V21H7V14H12.6L13,16H20V6H14.4Z"})}),user:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z"})}),basket:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M5.5,21C4.72,21 4.04,20.55 3.71,19.9V19.9L1.1,10.44L1,10A1,1 0 0,1 2,9H6.58L11.18,2.43C11.36,2.17 11.66,2 12,2C12.34,2 12.65,2.17 12.83,2.44L17.42,9H22A1,1 0 0,1 23,10L22.96,10.29L20.29,19.9C19.96,20.55 19.28,21 18.5,21H5.5M12,4.74L9,9H15L12,4.74M12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17A2,2 0 0,0 14,15A2,2 0 0,0 12,13Z"})}),"basket-plus":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 15V18H23V20H20V23H18V20H15V18H18V15H20M23 10L22.96 10.29L22 13.8C21.11 13.29 20.09 13 19 13C15.69 13 13 15.69 13 19C13 19.7 13.13 20.37 13.35 21H5.5C4.72 21 4.04 20.55 3.71 19.9L1.1 10.44L1 10C1 9.45 1.45 9 2 9H6.58L11.18 2.43C11.36 2.17 11.66 2 12 2S12.65 2.17 12.83 2.44L17.42 9H22C22.55 9 23 9.45 23 10M14 15C14 13.9 13.11 13 12 13S10 13.9 10 15 10.9 17 12 17 14 16.11 14 15M15 9L12 4.74L9 9H15Z"})}),"basket-minus":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M23 18V20H15V18H23M23 10L22.96 10.29L22 13.8C21.11 13.29 20.09 13 19 13C15.69 13 13 15.69 13 19C13 19.7 13.13 20.37 13.35 21H5.5C4.72 21 4.04 20.55 3.71 19.9L1.1 10.44L1 10C1 9.45 1.45 9 2 9H6.58L11.18 2.43C11.36 2.17 11.66 2 12 2S12.65 2.17 12.83 2.44L17.42 9H22C22.55 9 23 9.45 23 10M14 15C14 13.9 13.11 13 12 13S10 13.9 10 15 10.9 17 12 17 14 16.11 14 15M15 9L12 4.74L9 9H15Z"})}),"basket-checkmark":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.63 16.27L17.76 20.17L16.41 18.8L15 20.22L17.75 23L23.03 17.68L21.63 16.27M13 20C13 16.69 15.69 14 19 14C20 14 20.92 14.24 21.74 14.67L22.96 10.29L23 10C23 9.45 22.55 9 22 9H17.42L12.83 2.44C12.65 2.17 12.34 2 12 2S11.36 2.17 11.18 2.43L6.58 9H2C1.45 9 1 9.45 1 10L1.1 10.44L3.71 19.9C4.04 20.55 4.72 21 5.5 21H13.09C13.04 20.67 13 20.34 13 20M12 4.74L15 9H9L12 4.74M10 15C10 13.9 10.9 13 12 13S14 13.9 14 15 13.11 17 12 17 10 16.11 10 15Z"})}),volunteer:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 28",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M21 6a2.74 2.74 0 00-1 .19V5a3 3 0 00-3-3 2.87 2.87 0 00-1.13.25 3 3 0 00-5.75 0A2.82 2.82 0 009 2a3 3 0 00-3 3v10.75l-.88-.87a3 3 0 00-4.25 0 3 3 0 000 4.25l6.78 6.78A6.74 6.74 0 0012.37 28H17a7 7 0 007-7V9a3 3 0 00-3-3zm1 15a5 5 0 01-5 5h-4.63a4.65 4.65 0 01-3.28-1.53l-6.81-6.75a1 1 0 010-1.44h.06a1 1 0 011.38 0l2.56 2.6L8 20.59V5a1 1 0 012 0v8h2V3a1 1 0 012 0v10h2V5a1 1 0 012 0v8h2V9a1 1 0 012 0z"}),(0,jsx_runtime.jsx)("path",{d:"M17 16a2 2 0 00-2 2 2 2 0 00-4 0c0 1.95 4 5 4 5s4-2.83 4-5a2 2 0 00-2-2z"})]}),"volunteer-off":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 25.34 28",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M.001 3.804L1.465 2.34l23.872 23.872-1.464 1.464zM16.6 16.2l2.67 2.68a2.41 2.41 0 00.19-.88 2 2 0 00-2-2 2.05 2.05 0 00-.86.2zM15.46 23s.54-.38 1.21-1l-5-5a2 2 0 00-.24.93C11.46 20 15.46 23 15.46 23z"}),(0,jsx_runtime.jsx)("path",{d:"M8.46 5a1 1 0 012 0v5.07l2 2V3a1 1 0 012 0v10h2V5a1 1 0 012 0v8h2V9a1 1 0 012 0v12a4.43 4.43 0 01-.1 1l1.6 1.6a6.88 6.88 0 00.5-2.57V9a3 3 0 00-3-3 2.82 2.82 0 00-1 .19V5a3 3 0 00-3-3 2.82 2.82 0 00-1.12.25 3 3 0 00-5.75 0A2.87 2.87 0 009.46 2a3 3 0 00-3 3v1.07l2 2zM17.46 26h-4.62a4.63 4.63 0 01-3.28-1.53l-6.82-6.75a1 1 0 010-1.44h.07a1 1 0 011.37 0l2.56 2.6 1.72 1.71v-6.76l-2-2v3.92l-.87-.87a3 3 0 00-4.25 4.25l6.78 6.78A6.72 6.72 0 0012.84 28h4.62a6.93 6.93 0 003.95-1.23L20 25.32a5 5 0 01-2.54.68z"})]}),"cl-logo":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 137 30",width:"137px",height:"30px",...props,children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M37.517 11.892c1.687 0 2.46 1.097 2.81 2.194l3.023-1.097c-.562-2.194-2.46-4.461-5.903-4.461-3.655 0-6.536 2.925-6.536 6.948 0 4.022 2.881 6.948 6.606 6.948 3.373 0 5.27-2.268 5.833-4.462l-2.952-1.024c-.28 1.024-1.124 2.195-2.881 2.195-1.757 0-3.233-1.317-3.233-3.73 0-2.414 1.546-3.511 3.233-3.511z"}),(0,jsx_runtime.jsx)("path",{d:"M49.075 8.957h-3.373v13.091h3.373V8.957z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M45.35 4.715c0 1.17.913 2.194 2.108 2.194s2.108-.95 2.108-2.194c0-1.243-.913-2.194-2.108-2.194-1.195-.073-2.108.95-2.108 2.194zM56.454 5.08h-3.092v1.83c0 1.17-.633 2.047-1.968 2.047h-.632v3.145h2.319v6.143c0 2.56 1.546 4.023 4.005 4.023.984 0 1.617-.22 1.898-.293V19.05c-.211.073-.633.073-1.054.073-.984 0-1.476-.366-1.476-1.536v-5.485h2.53V8.957h-2.53V5.081z"}),(0,jsx_runtime.jsx)("path",{d:"M64.778 8.957h-3.373v13.091h3.373V8.957z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M60.983 4.715c0 1.17.914 2.194 2.109 2.194 1.194 0 2.108-.95 2.108-2.194 0-1.243-.914-2.194-2.108-2.194-1.125-.073-2.109.95-2.109 2.194zM77.6 22.074v-3.072h-6.183l6.113-7.094V8.909H67.411v3.072h5.763L67.2 18.93v3.145h10.4zM82.974 14.108h5.621c-.07-1.316-.842-2.56-2.81-2.56-1.757-.072-2.741 1.317-2.811 2.56zm5.973 3.365l2.811.877c-.632 2.268-2.6 4.17-5.692 4.17-3.444 0-6.465-2.56-6.465-7.022 0-4.169 2.95-6.875 6.184-6.875 3.865 0 6.184 2.56 6.184 6.802 0 .512-.07 1.024-.07 1.097h-8.995c.07 1.755 1.476 2.998 3.162 2.998 1.616 0 2.46-.877 2.881-2.047zM97.34 14.547c0-1.536.844-2.706 2.32-2.706 1.617 0 2.319 1.17 2.319 2.633v7.606h3.373v-8.264c0-2.852-1.405-5.193-4.567-5.193-1.336 0-2.882.585-3.655 1.975V8.916h-3.162V22.08h3.373v-7.533z"}),(0,jsx_runtime.jsx)("path",{d:"M109.742 2.803h-2.389v19.308h2.389V2.803z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M116.17 20.465c1.968 0 3.514-.95 3.514-3.803v-.585l-3.725.585c-1.054.146-1.757.804-1.757 1.901-.07.951.703 1.902 1.968 1.902zm-4.427-1.755c0-2.268 1.617-3.584 3.724-3.877l3.304-.511c.772-.074.913-.512.913-.951 0-1.244-.773-2.268-2.671-2.268-1.686 0-2.599 1.098-2.811 2.56l-2.318-.585c.28-2.486 2.389-4.169 5.059-4.169 3.655 0 5.131 2.194 5.131 4.681v6.436c0 1.097.07 1.755.14 2.121h-2.319c-.07-.293-.141-.804-.141-1.755-.562.877-1.757 2.12-3.935 2.12-2.53 0-4.076-1.755-4.076-3.802zM133.84 15.602c0-2.779-1.405-4.534-3.654-4.534-2.108 0-3.654 1.755-3.654 4.534 0 2.78 1.546 4.608 3.654 4.608 2.249 0 3.654-1.829 3.654-4.608zm-7.238 6.51h-2.389V2.802h2.389v8.265c.562-1.17 2.038-2.194 4.076-2.194 3.724 0 5.622 2.998 5.622 6.728 0 3.803-2.038 6.802-5.693 6.802-1.827 0-3.232-.805-4.005-2.194v1.901zM0 0v19.471C0 23.536 7.494 28.167 11.288 30c3.794-1.833 11.288-6.464 11.288-10.529V0H0zm19.73 19.471c-.04.906-1.57 3.433-7.197 6.667V15.236l3.132-3.132h4.065v7.367zm-4.25-9.943h4.25V2.717h-7.197v3.865l2.946 2.946zM9.957 6.531V2.717H2.846v6.811H6.96l2.998-2.997zm-3.184 5.573H2.846v7.367c.04.901 1.555 3.407 7.112 6.618V15.287l-3.184-3.183zm2.448-1.195l1.998-1.998 1.998 1.998-1.998 1.998-1.998-1.998z"})]}),"arrow-left-circle":props=>(0,jsx_runtime.jsx)(MirrorOnRtlSvg,{viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"m12 16 1.4-1.4-1.6-1.6H16v-2h-4.2l1.6-1.6L12 8l-4 4Zm0 6q-2.075 0-3.9-.788-1.825-.787-3.175-2.137-1.35-1.35-2.137-3.175Q2 14.075 2 12t.788-3.9q.787-1.825 2.137-3.175 1.35-1.35 3.175-2.138Q9.925 2 12 2t3.9.787q1.825.788 3.175 2.138 1.35 1.35 2.137 3.175Q22 9.925 22 12t-.788 3.9q-.787 1.825-2.137 3.175-1.35 1.35-3.175 2.137Q14.075 22 12 22Z"})}),whatsapp:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M.057 24l1.687-6.163a11.867 11.867 0 01-1.587-5.946C.16 5.335 5.495 0 12.05 0a11.817 11.817 0 018.413 3.488 11.824 11.824 0 013.48 8.414c-.003 6.557-5.338 11.892-11.893 11.892a11.9 11.9 0 01-5.688-1.448L.057 24zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.148-.669-1.611-.916-2.206-.242-.579-.487-.501-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.709.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.695.248-1.29.173-1.414z"})}),"sidebar-reporting":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 27 31",...props,children:(0,jsx_runtime.jsxs)("g",{className:"Processing-icon",children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary Head",d:"M22.0671 21.8819C23.0755 17.9491 28.3528 16.0332 26.6721 8.0333C24.9579 0.0333888 15.5462 -0.773325 10.6723 0.470358C5.63035 1.78127 1.59679 7.15936 2.94131 11.6299C3.04215 11.966 2.97492 12.3358 2.77324 12.6383C2.16821 13.5795 0.487556 15.6635 0.0505859 16.8735C-0.117479 17.3105 0.151425 17.7811 0.588395 17.9155C0.722847 17.9492 1.59679 18.2853 1.73124 18.3189C2.9077 18.6886 2.6724 21.2768 2.6724 23.6298C2.6724 26.0835 5.29422 25.7474 6.13455 25.5793C7.00849 25.3776 8.92444 25.2096 8.92444 27.5625C8.92444 27.865 8.92444 28.1339 8.95805 28.3356C8.99166 28.8062 9.29418 29.2095 9.73115 29.3776C11.4454 30.0499 16.4538 31.0919 22.5041 28.907C22.8739 28.7726 23.0083 28.3692 22.8402 28.0331C22.3024 26.9575 21.294 24.8062 22.0671 21.8819ZM19.5126 5.41148C20.7226 5.57954 21.5629 6.68878 21.3613 7.89885C21.1932 9.10892 20.084 9.94924 18.8739 9.74756C17.6638 9.5795 16.8235 8.47027 17.0252 7.2602C17.1932 6.08374 18.3025 5.24341 19.5126 5.41148ZM15.0084 19.4954C10.3362 19.4954 6.53791 15.6971 6.53791 11.0249C6.53791 6.35264 10.3362 2.55437 15.0084 2.55437C15.7143 2.55437 16.4201 2.65521 17.0924 2.82327C17.0252 3.26024 16.7899 3.6636 16.4201 3.9325C15.8487 4.36947 15.1429 4.40309 14.5378 4.10057C14.2689 4.4367 14.0336 4.84006 13.8656 5.24341C14.4034 5.61316 14.7059 6.28542 14.605 6.99129C14.5042 7.69717 14.0336 8.23498 13.395 8.43665C13.4622 8.87362 13.563 9.31059 13.7311 9.71395C14.3698 9.61311 15.0756 9.8484 15.479 10.4198C15.916 10.9912 15.9496 11.6971 15.647 12.3022C15.9832 12.5711 16.3865 12.8064 16.7899 12.9744C17.1596 12.4366 17.8319 12.1341 18.5378 12.2349C19.2436 12.3358 19.7815 12.8064 19.9831 13.445C20.4201 13.3778 20.8571 13.2769 21.2604 13.1089C21.1596 12.4702 21.3949 11.7643 21.9663 11.361C22.4369 11.0249 22.9747 10.924 23.4789 11.0585C23.4789 15.6971 19.6806 19.4954 15.0084 19.4954Z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-accent Gear",d:"M14.5042 12.5375C14.3698 12.2013 14.437 11.798 14.6387 11.5291C14.5042 11.361 14.3025 11.1929 14.1345 11.0249C13.8656 11.2602 13.4958 11.3274 13.1261 11.1929C12.7563 11.0585 12.5547 10.7224 12.521 10.3862C12.2858 10.3526 12.0505 10.3526 11.8152 10.3862C11.7816 10.756 11.5799 11.0585 11.2101 11.2266C10.874 11.361 10.4707 11.2938 10.2017 11.0921C10.0337 11.2266 9.86562 11.4282 9.69755 11.5963C9.93284 11.8652 10.0001 12.235 9.86562 12.6047C9.73116 12.9744 9.39503 13.1761 9.0589 13.2097C9.02529 13.445 9.02529 13.6803 9.0589 13.9156C9.42864 13.9492 9.73116 14.1509 9.89923 14.5206C10.0337 14.8568 9.96645 15.2601 9.76478 15.529C9.89923 15.6971 10.1009 15.8652 10.269 16.0332C10.5379 15.7979 10.9076 15.7307 11.2774 15.8652C11.6471 15.9996 11.8488 16.3357 11.8824 16.6719C12.1177 16.7055 12.353 16.7055 12.5883 16.6719C12.6219 16.3021 12.8236 15.9996 13.1933 15.8315C13.5294 15.6971 13.9328 15.7643 14.2017 15.966C14.3698 15.8315 14.5378 15.6299 14.7059 15.4618C14.4706 15.1929 14.4034 14.8232 14.5378 14.4534C14.6723 14.0837 15.0084 13.882 15.3445 13.8484C15.3782 13.6131 15.3782 13.3778 15.3445 13.1425C14.9748 13.1089 14.6387 12.9072 14.5042 12.5375ZM13.2941 13.9828C13.0589 14.5879 12.353 14.8904 11.7479 14.6551C11.1429 14.4198 10.8404 13.7139 11.0757 13.1089C11.311 12.5039 12.0169 12.2013 12.6219 12.4366C13.2269 12.6719 13.5294 13.3778 13.2941 13.9828Z"})]})}),"alert-octagon":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 17q.425 0 .713-.288Q13 16.425 13 16t-.287-.713Q12.425 15 12 15t-.712.287Q11 15.575 11 16t.288.712Q11.575 17 12 17Zm-1-4h2V7h-2Zm-2.75 8L3 15.75v-7.5L8.25 3h7.5L21 8.25v7.5L15.75 21Zm.85-2h5.8l4.1-4.1V9.1L14.9 5H9.1L5 9.1v5.8Zm2.9-7Z"})}),"alert-octagon-off":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"m19.8 16.95-1.45-1.4.65-.65V9.1L14.9 5H9.1l-.65.65-1.4-1.45L8.25 3h7.5L21 8.25v7.45ZM13 10.2V7h-2v1.2Zm7.5 13.1-3.55-3.55-1.2 1.25h-7.5L3 15.7V8.25l1.2-1.2L.7 3.5l1.4-1.4 19.8 19.8Zm-7.1-12.7ZM9.1 19h5.8l.65-.65-9.9-9.9L5 9.1v5.8Zm2.9-2q-.425 0-.712-.288Q11 16.425 11 16t.288-.713Q11.575 15 12 15t.713.287Q13 15.575 13 16t-.287.712Q12.425 17 12 17Zm-1.4-3.6Z"})}),"filter-2":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 20q-.425 0-.712-.288Q10 19.425 10 19v-6L4.2 5.6q-.375-.5-.112-1.05Q4.35 4 5 4h14q.65 0 .913.55.262.55-.113 1.05L14 13v6q0 .425-.287.712Q13.425 20 13 20Z"})}),categories:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M15 21v-3h-4V8H9v3H2V3h7v3h6V3h7v8h-7V8h-2v8h2v-3h7v8Z"})}),token:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M12 5C7.03158 5 2 6.49067 2 9.33983C2 12.189 7.03158 13.6797 12 13.6797C16.9705 13.6797 22 12.189 22 9.33983C22 6.49067 16.9705 5 12 5ZM7 14.5853V17.4778C8.23684 17.7671 9.60526 17.9437 11 18V15.1075C9.65417 15.057 8.31547 14.8822 7 14.5853V14.5853ZM13 15.1053V18C14.3459 17.9505 15.6847 17.7757 17 17.4778V14.5853C15.6874 14.8822 14.3474 15.0566 13 15.1064V15.1053ZM19 13.9668V16.8592C20.8011 16.1334 22 15.0696 22 13.6807V10.7883C22 12.1771 20.8011 13.2398 19 13.9678V13.9668ZM5 16.8592V13.9668C3.2 13.2388 2 12.1749 2 10.7872V13.6797C2 15.0685 3.2 16.1313 5 16.8603V16.8592Z",fill:"black"})}),"coin-stack":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsxs)("g",{clipPath:"url(#clip0)",fill:props.fill,children:[(0,jsx_runtime.jsx)("path",{d:"M5.81 11.42c.563 0 1.106-.036 1.62-.103V5.682a12.465 12.465 0 00-1.62-.104C2.603 5.578 0 6.758 0 8.214v.571c0 1.456 2.602 2.636 5.81 2.636zM5.81 14.363c.563 0 1.106-.036 1.62-.104v-1.652a12.45 12.45 0 01-1.62.105c-2.8 0-5.138-.9-5.688-2.096-.08.175-.122.355-.122.54v.571c0 1.456 2.602 2.636 5.81 2.636zM7.43 15.678v-.128c-.514.067-1.057.104-1.62.104-2.8 0-5.139-.899-5.688-2.095-.08.174-.122.354-.122.54v.57c0 1.456 2.602 2.636 5.81 2.636.643 0 1.26-.047 1.837-.134a2.079 2.079 0 01-.217-.921v-.572zM14.19 1.114c-3.21 0-5.812 1.18-5.812 2.636v.572c0 1.455 2.602 2.635 5.811 2.635C17.4 6.957 20 5.777 20 4.322V3.75c0-1.456-2.602-2.636-5.81-2.636z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 8.248c-2.802 0-5.14-.899-5.69-2.095-.08.174-.122.354-.122.54v.57C8.378 8.72 10.98 9.9 14.19 9.9 17.4 9.9 20 8.72 20 7.264v-.572c0-.185-.042-.365-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 11.19c-2.802 0-5.14-.898-5.69-2.095-.08.174-.122.355-.122.54v.571c0 1.456 2.602 2.636 5.811 2.636 3.21 0 5.811-1.18 5.811-2.636v-.571c0-.185-.042-.366-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 14.292c-2.802 0-5.14-.9-5.69-2.096-.08.175-.122.355-.122.54v.572c0 1.455 2.602 2.635 5.811 2.635 3.21 0 5.811-1.18 5.811-2.635v-.572c0-.185-.042-.366-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"}),(0,jsx_runtime.jsx)("path",{d:"M14.19 17.234c-2.802 0-5.14-.899-5.69-2.095-.08.174-.122.354-.122.54v.571c0 1.456 2.602 2.636 5.811 2.636 3.21 0 5.811-1.18 5.811-2.636v-.572c0-.185-.042-.365-.122-.54-.55 1.197-2.887 2.096-5.689 2.096z"})]}),(0,jsx_runtime.jsx)("defs",{children:(0,jsx_runtime.jsx)("clipPath",{id:"clip0",children:(0,jsx_runtime.jsx)("path",{fill:"#fff",d:"M0 0h20v20H0z"})})})]}),image:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 127 103",...props,children:(0,jsx_runtime.jsx)("path",{d:"M127 91.5556V11.4444C127 5.15 120.65 0 112.889 0H14.1111C6.35 0 0 5.15 0 11.4444V91.5556C0 97.85 6.35 103 14.1111 103H112.889C120.65 103 127 97.85 127 91.5556ZM38.8056 60.0833L56.4444 77.3072L81.1389 51.5L112.889 85.8333H14.1111L38.8056 60.0833Z"})}),accordion:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M1 13.0015C0.447715 13.0015 -1.95703e-08 12.5537 -4.37114e-08 12.0015L-2.13006e-07 8.12845C-2.37147e-07 7.57617 0.447715 7.12845 1 7.12845L19 7.12845C19.5523 7.12845 20 7.57617 20 8.12845L20 12.0015C20 12.5537 19.5523 13.0015 19 13.0015L1 13.0015Z"}),(0,jsx_runtime.jsx)("rect",{y:"6.01709",width:"5.87302",height:"20",rx:"1",transform:"rotate(-90 0 6.01709)"}),(0,jsx_runtime.jsx)("rect",{y:"19.9854",width:"5.87302",height:"20",rx:"1",transform:"rotate(-90 0 19.9854)"})]}),"layout-1column":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 77 126",...props,children:(0,jsx_runtime.jsx)("rect",{width:"77",height:"126",rx:"10"})}),"layout-2column-1":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("rect",{x:"69",width:"57",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{width:"57",height:"126",rx:"2"})]}),"layout-3column":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M44 2C44 0.89543 44.8954 0 46 0H79C80.1046 0 81 0.895431 81 2V124C81 125.105 80.1046 126 79 126H46C44.8954 126 44 125.105 44 124V2Z"}),(0,jsx_runtime.jsx)("rect",{x:"88",width:"37",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{width:"37",height:"126",rx:"2"})]}),"layout-2column-3":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("rect",{width:"75",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{x:"88",width:"38",height:"126",rx:"2"})]}),"layout-2column-2":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 126 126",...props,children:[(0,jsx_runtime.jsx)("rect",{x:"51",width:"75",height:"126",rx:"2"}),(0,jsx_runtime.jsx)("rect",{width:"38",height:"126",rx:"2"})]}),text:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 129 126",...props,children:(0,jsx_runtime.jsx)("path",{d:"M119.232 0L129 36.54L120.916 38.724C117.127 31.416 113.254 24.108 108.791 20.412C104.328 16.8 99.1077 16.8 93.9713 16.8H72.9204V105C72.9204 109.2 72.9204 113.4 75.6991 115.5C78.562 117.6 84.1194 117.6 89.7611 117.6V126H39.2389V117.6C44.8805 117.6 50.438 117.6 53.3009 115.5C56.0796 113.4 56.0796 109.2 56.0796 105V16.8H35.0287C29.8923 16.8 24.6717 16.8 20.2089 20.412C15.7461 24.108 11.8727 31.416 8.08355 38.724L0 36.54L9.76762 0H119.232Z"})}),message:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 40 40",...props,children:(0,jsx_runtime.jsx)("path",{d:"M36 0H4a4 4 0 0 0-4 4v36l8-8h28a4 4 0 0 0 4-4V4a4 4 0 0 0-4-4ZM8 14h24v4H8v-4Zm16 10H8v-4h16v4Zm8-12H8V8h24",fill:"#01A1B1",fillOpacity:".25"})}),"layout-white-space":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 14",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0 6C1.10457 6 2 5.10457 2 4V2H5.5C6.60457 2 7.5 1.10457 7.5 0H1C0.95575 0 0.912171 0.00287412 0.86944 0.00844586C0.781234 0.0199471 0.696641 0.0429428 0.617212 0.0758806C0.372772 0.177246 0.177246 0.372772 0.0758805 0.617213C0.0429427 0.696641 0.0199471 0.781235 0.00844584 0.86944C0.00287411 0.912171 0 0.95575 0 1V6ZM12.5 0C12.5 1.10457 13.3954 2 14.5 2H18V4C18 5.10457 18.8954 6 20 6V1C20 0.955748 19.9971 0.912176 19.9916 0.869444C19.98 0.78124 19.9571 0.69664 19.9241 0.617212C19.8228 0.372772 19.6272 0.177246 19.3828 0.0758809C19.3034 0.0429431 19.2188 0.019947 19.1306 0.0084458C19.0878 0.0028741 19.0443 0 19 0H12.5ZM20 8C18.8954 8 18 8.89543 18 10V12H14.5C13.3954 12 12.5 12.8954 12.5 14H19C19.0443 14 19.0878 13.9971 19.1306 13.9915C19.2188 13.98 19.3034 13.9571 19.3828 13.9241C19.6272 13.8228 19.8228 13.6272 19.9241 13.3828C19.9571 13.3034 19.98 13.2188 19.9916 13.1306C19.9971 13.0878 20 13.0443 20 13V8ZM7.5 14C7.5 12.8954 6.60457 12 5.5 12H2V10C2 8.89543 1.10457 8 0 8V13C0 13.0443 0.00287411 13.0878 0.00844585 13.1306C0.0199471 13.2188 0.0429427 13.3034 0.0758806 13.3828C0.177246 13.6272 0.372772 13.8228 0.617212 13.9241C0.696641 13.9571 0.781235 13.9801 0.86944 13.9916C0.912171 13.9971 0.95575 14 1 14H7.5Z",fill:props.fill})}),"section-info-accordion":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.617212 19.9241L1 19.001V19H1.9V20H1C0.864409 20 0.73512 19.973 0.617212 19.9241ZM18.1 20V19H19L19.3828 19.9241C19.2649 19.973 19.1356 20 19 20H18.1ZM20 1.9H19V1L19.9241 0.617212C19.973 0.73512 20 0.864409 20 1V1.9ZM1.9 0H1C0.864408 0 0.73512 0.0269862 0.617212 0.0758805L1 0.998965V1H1.9V0ZM0.0758806 19.3828L0.998963 19H1L1 18.1H0V19C0 19.1356 0.0269862 19.2649 0.0758806 19.3828ZM0 16.3H1V14.5H0V16.3ZM0 12.7H1V10.9H0V12.7ZM0 9.1H1V7.3H0V9.1ZM0 5.5H1V3.7H0V5.5ZM0 1.9H1V1L0.0758806 0.617212C0.0269862 0.73512 0 0.864409 0 1V1.9ZM3.7 0V1H5.5V0H3.7ZM7.3 0V1H9.1V0H7.3ZM10.9 0V1H12.7V0H10.9ZM14.5 0V1H16.3V0H14.5ZM18.1 0V1H19L19.3828 0.0758806C19.2649 0.0269862 19.1356 0 19 0H18.1ZM20 3.7H19V5.5H20V3.7ZM20 7.3H19V9.1H20V7.3ZM20 10.9H19V12.7H20V10.9ZM20 14.5H19V16.3H20V14.5ZM20 18.1H19V19L19.9241 19.3828C19.973 19.2649 20 19.1356 20 19V18.1ZM16.3 20V19H14.5V20H16.3ZM12.7 20V19H10.9V20H12.7ZM9.1 20V19H7.3V20H9.1ZM5.5 20V19H3.7V20H5.5Z"}),(0,jsx_runtime.jsx)("path",{d:"M3 12C2.44772 12 2 11.5523 2 11C2 10.4477 2.44772 10 3 10H9C9.55228 10 10 10.4477 10 11C10 11.5523 9.55228 12 9 12H3Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 3L3 8H9V3L3 3ZM2 8C2 8.55228 2.44772 9 3 9H9C9.55228 9 10 8.55228 10 8V3C10 2.44772 9.55228 2 9 2L3 2C2.44772 2 2 2.44772 2 3L2 8Z"}),(0,jsx_runtime.jsx)("path",{d:"M12 9C11.4477 9 11 8.55228 11 8V3C11 2.44772 11.4477 2 12 2L17 2C17.5523 2 18 2.44772 18 3V8C18 8.55228 17.5523 9 17 9H12Z"}),(0,jsx_runtime.jsx)("path",{d:"M3 15C2.44772 15 2 14.5523 2 14C2 13.4477 2.44772 13 3 13H9C9.55228 13 10 13.4477 10 14C10 14.5523 9.55228 15 9 15H3Z"}),(0,jsx_runtime.jsx)("path",{d:"M3 18C2.44772 18 2 17.5523 2 17C2 16.4477 2.44772 16 3 16H9C9.55228 16 10 16.4477 10 17C10 17.5523 9.55228 18 9 18H3Z"})]}),"section-image-text":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 20",...props,children:[(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.617212 19.9241L1 19.001V19H1.9V20H1C0.864409 20 0.73512 19.973 0.617212 19.9241ZM18.1 20V19H19L19.3828 19.9241C19.2649 19.973 19.1356 20 19 20H18.1ZM20 1.9H19V1L19.9241 0.617212C19.973 0.73512 20 0.864409 20 1V1.9ZM1.9 0H1C0.864408 0 0.73512 0.0269862 0.617212 0.0758805L1 0.998965V1H1.9V0ZM0.0758806 19.3828L0.998963 19H1L1 18.1H0V19C0 19.1356 0.0269862 19.2649 0.0758806 19.3828ZM0 16.3H1V14.5H0V16.3ZM0 12.7H1V10.9H0V12.7ZM0 9.1H1V7.3H0V9.1ZM0 5.5H1V3.7H0V5.5ZM0 1.9H1V1L0.0758806 0.617212C0.0269862 0.73512 0 0.864409 0 1V1.9ZM3.7 0V1H5.5V0H3.7ZM7.3 0V1H9.1V0H7.3ZM10.9 0V1H12.7V0H10.9ZM14.5 0V1H16.3V0H14.5ZM18.1 0V1H19L19.3828 0.0758806C19.2649 0.0269862 19.1356 0 19 0H18.1ZM20 3.7H19V5.5H20V3.7ZM20 7.3H19V9.1H20V7.3ZM20 10.9H19V12.7H20V10.9ZM20 14.5H19V16.3H20V14.5ZM20 18.1H19V19L19.9241 19.3828C19.973 19.2649 20 19.1356 20 19V18.1ZM16.3 20V19H14.5V20H16.3ZM12.7 20V19H10.9V20H12.7ZM9.1 20V19H7.3V20H9.1ZM5.5 20V19H3.7V20H5.5Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.617212 19.9241L1 19.001V19H1.9V20H1C0.864409 20 0.73512 19.973 0.617212 19.9241ZM18.1 20V19H19L19.3828 19.9241C19.2649 19.973 19.1356 20 19 20H18.1ZM20 1.9H19V1L19.9241 0.617212C19.973 0.73512 20 0.864409 20 1V1.9ZM1.9 0H1C0.864408 0 0.73512 0.0269862 0.617212 0.0758805L1 0.998965V1H1.9V0ZM0.0758806 19.3828L0.998963 19H1L1 18.1H0V19C0 19.1356 0.0269862 19.2649 0.0758806 19.3828ZM0 16.3H1V14.5H0V16.3ZM0 12.7H1V10.9H0V12.7ZM0 9.1H1V7.3H0V9.1ZM0 5.5H1V3.7H0V5.5ZM0 1.9H1V1L0.0758806 0.617212C0.0269862 0.73512 0 0.864409 0 1V1.9ZM3.7 0V1H5.5V0H3.7ZM7.3 0V1H9.1V0H7.3ZM10.9 0V1H12.7V0H10.9ZM14.5 0V1H16.3V0H14.5ZM18.1 0V1H19L19.3828 0.0758806C19.2649 0.0269862 19.1356 0 19 0H18.1ZM20 3.7H19V5.5H20V3.7ZM20 7.3H19V9.1H20V7.3ZM20 10.9H19V12.7H20V10.9ZM20 14.5H19V16.3H20V14.5ZM20 18.1H19V19L19.9241 19.3828C19.973 19.2649 20 19.1356 20 19V18.1ZM16.3 20V19H14.5V20H16.3ZM12.7 20V19H10.9V20H12.7ZM9.1 20V19H7.3V20H9.1ZM5.5 20V19H3.7V20H5.5Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 3V5H5V3L3 3ZM2 5C2 5.55228 2.44772 6 3 6H5C5.55228 6 6 5.55228 6 5V3C6 2.44772 5.55228 2 5 2L3 2C2.44772 2 2 2.44772 2 3L2 5Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 15V17H5V15H3ZM2 17C2 17.5523 2.44772 18 3 18H5C5.55228 18 6 17.5523 6 17V15C6 14.4477 5.55228 14 5 14H3C2.44772 14 2 14.4477 2 15L2 17Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 9V11H5V9H3ZM2 11C2 11.5523 2.44772 12 3 12H5C5.55228 12 6 11.5523 6 11V9C6 8.44772 5.55228 8 5 8H3C2.44772 8 2 8.44772 2 9L2 11Z"}),(0,jsx_runtime.jsx)("path",{d:"M8 18C7.44771 18 7 17.5523 7 17V15C7 14.4477 7.44772 14 8 14H17C17.5523 14 18 14.4477 18 15V17C18 17.5523 17.5523 18 17 18H8Z"}),(0,jsx_runtime.jsx)("path",{d:"M8 12C7.44771 12 7 11.5523 7 11V9C7 8.44772 7.44772 8 8 8H17C17.5523 8 18 8.44772 18 9V11C18 11.5523 17.5523 12 17 12L8 12Z"}),(0,jsx_runtime.jsx)("path",{d:"M8 6C7.44771 6 7 5.55228 7 5V3C7 2.44772 7.44772 2 8 2L17 2C17.5523 2 18 2.44772 18 3V5C18 5.55228 17.5523 6 17 6L8 6Z"})]}),button:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 20.5C20 21.3 19.3 22 18.5 22H13C12.6 22 12.3 21.9 12 21.6L8 17.4L8.7 16.6C8.9 16.4 9.2 16.3 9.5 16.3H9.7L12 18V9C12 8.4 12.4 8 13 8S14 8.4 14 9V13.5L15.2 13.6L19.1 15.8C19.6 16 20 16.6 20 17.1V20.5M20 2H4C2.9 2 2 2.9 2 4V12C2 13.1 2.9 14 4 14H8V12H4V4H20V12H18V14H20C21.1 14 22 13.1 22 12V4C22 2.9 21.1 2 20 2Z"})}),tablet:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 30 30",...props,children:(0,jsx_runtime.jsx)("path",{d:"M24.2639 23.1667H5.7361V4.5H24.2639V23.1667ZM17.5556 26.6666H12.4444V25.4999H17.5556V26.6666ZM22.6666 1H7.33333C6.31667 1 5.34165 1.36875 4.62277 2.02513C3.90386 2.68151 3.5 3.57175 3.5 4.5V25.4999C3.5 26.4282 3.90386 27.3184 4.62277 27.9748C5.34165 28.6311 6.31667 29 7.33333 29H22.6666C23.6834 29 24.6583 28.6311 25.3773 27.9748C26.0961 27.3184 26.5 26.4282 26.5 25.4999V4.5C26.5 3.57175 26.0961 2.68151 25.3773 2.02513C24.6583 1.36875 23.6834 1 22.6666 1Z",fill:props.fill})}),desktop:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21,16H3V4H21M21,2H3C1.89,2 1,2.89 1,4V16A2,2 0 0,0 3,18H10V20H8V22H16V20H14V18H21A2,2 0 0,0 23,16V4C23,2.89 22.1,2 21,2Z"})}),"survey-number-field":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M9.58637 16.5L10.0788 14.0677H9.30005V13.3048H10.2277L10.5656 11.6297H9.30005V10.884H10.7145L11.2127 8.40002H11.9685L11.4646 10.884H13.1539L13.6464 8.40002H14.4023L13.8984 10.884H14.7V11.6297H13.7552L13.4116 13.3048H14.7V14.0677H13.2684L12.776 16.5H12.0144L12.5068 14.0677H10.8405L10.3251 16.5H9.58637ZM10.9893 13.3048H12.6729L13.005 11.6297H11.3215L10.9893 13.3048Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M19 5H5V19H19V5ZM5 3C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3H5Z"})]}),sort:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M5.90916 10.1817H18.6362C18.8824 10.1817 19.0956 10.0918 19.2754 9.91188C19.4552 9.73198 19.5454 9.51894 19.5454 9.27272C19.5454 9.0265 19.4552 8.81357 19.2754 8.63342L12.9119 2.26985C12.7321 2.09015 12.5191 2 12.2727 2C12.0263 2 11.8134 2.09015 11.6334 2.26985L5.26985 8.63342C5.0899 8.81337 5 9.0265 5 9.27272C5 9.51889 5.0899 9.73198 5.26985 9.91188C5.45 10.0918 5.66299 10.1817 5.90916 10.1817Z"}),(0,jsx_runtime.jsx)("path",{d:"M18.6362 13.8184H5.90916C5.66279 13.8184 5.4498 13.9084 5.26985 14.0881C5.0899 14.2681 5 14.4811 5 14.7273C5 14.9735 5.0899 15.1866 5.26985 15.3665L11.6334 21.7299C11.8136 21.9099 12.0265 22 12.2727 22C12.5189 22 12.7321 21.9099 12.9119 21.7299L19.2754 15.3664C19.4552 15.1866 19.5454 14.9735 19.5454 14.7272C19.5454 14.4811 19.4552 14.2681 19.2754 14.0881C19.0956 13.9082 18.8824 13.8184 18.6362 13.8184Z"})]}),page:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M6 2C5.46957 2 4.96086 2.21071 4.58579 2.58579C4.21071 2.96086 4 3.46957 4 4V20C4 20.5304 4.21071 21.0391 4.58579 21.4142C4.96086 21.7893 5.46957 22 6 22H18C18.5304 22 19.0391 21.7893 19.4142 21.4142C19.7893 21.0391 20 20.5304 20 20V8L14 2H6ZM6 4H13V9H18V20H6V4ZM8 12V14H16V12H8ZM8 16V18H13V16H8Z"})}),"survey-short-answer":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V6C2 5.46957 2.21071 4.96086 2.58579 4.58579C2.96086 4.21071 3.46957 4 4 4H20C20.5304 4 21.0391 4.21071 21.4142 4.58579C21.7893 4.96086 22 5.46957 22 6V18C22 18.5304 21.7893 19.0391 21.4142 19.4142C21.0391 19.7893 20.5304 20 20 20ZM4 6V18H20V6H4ZM6 9H18V11H6V9ZM6 13H16V15H6V13Z"})}),"survey-long-answer":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M5 3C3.89 3 3 3.89 3 5V19C3 20.11 3.89 21 5 21H19C20.11 21 21 20.11 21 19V5C21 3.89 20.11 3 19 3H5ZM5 5H19V19H5V5ZM7 7V9H17V7H7ZM7 11V13H17V11H7ZM7 15V17H14V15H7Z"})}),"survey-linear-scale":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 5",...props,children:(0,jsx_runtime.jsx)("path",{d:"M17.5 0C16.47 0 15.6 0.62 15.21 1.5H12.29C11.9 0.62 11.03 0 10 0C8.97 0 8.1 0.62 7.71 1.5H4.79C4.4 0.62 3.53 0 2.5 0C1.12 0 0 1.12 0 2.5C0 3.88 1.12 5 2.5 5C3.53 5 4.4 4.38 4.79 3.5H7.71C8.1 4.38 8.97 5 10 5C11.03 5 11.9 4.38 12.29 3.5H15.21C15.6 4.38 16.47 5 17.5 5C18.88 5 20 3.88 20 2.5C20 1.12 18.88 0 17.5 0Z"})}),"survey-multiple-choice":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11 15H17V17H11V15M9 7H7V9H9V7M11 13H17V11H11V13M11 9H17V7H11V9M9 11H7V13H9V11M21 5V19C21 20.1 20.1 21 19 21H5C3.9 21 3 20.1 3 19V5C3 3.9 3.9 3 5 3H19C20.1 3 21 3.9 21 5M19 5H5V19H19V5M9 15H7V17H9V15Z"})}),"survey-long-answer-2":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M13.8 22.7502V20.3752L19.325 14.8502L21.7 17.2252L16.175 22.7502H13.8ZM4.8 17.7752V15.4002H12V17.7752H4.8ZM22.775 16.1502L20.4 13.7752L21.125 13.0502C21.3417 12.8335 21.6167 12.7252 21.95 12.7252C22.2833 12.7252 22.5583 12.8335 22.775 13.0502L23.5 13.7752C23.7167 13.9919 23.825 14.2669 23.825 14.6002C23.825 14.9335 23.7167 15.2085 23.5 15.4252L22.775 16.1502ZM4.8 13.0502V10.7002H15.6V13.0502H4.8ZM4.8 8.3502V6.0002H17.4V8.3502H4.8Z"}),(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0 3.6002C0 2.27471 1.07452 1.2002 2.4 1.2002H19.2C20.5255 1.2002 21.6 2.27471 21.6 3.6002V9.6002H19.2V3.6002H2.4V20.4002H9.6V22.8002H2.4C1.07452 22.8002 0 21.7257 0 20.4002V3.6002Z"})]}),"survey-short-answer-2":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M21.6 21.5999H2.4C1.76348 21.5999 1.15303 21.347 0.702944 20.897C0.252856 20.4469 0 19.8364 0 19.1999V4.7999C0 4.16338 0.252856 3.55293 0.702944 3.10285C1.15303 2.65276 1.76348 2.3999 2.4 2.3999H21.6C22.2365 2.3999 22.847 2.65276 23.2971 3.10285C23.7471 3.55293 24 4.16338 24 4.7999V19.1999C24 19.8364 23.7471 20.4469 23.2971 20.897C22.847 21.347 22.2365 21.5999 21.6 21.5999ZM2.4 4.7999V19.1999H21.6V4.7999H2.4ZM4.8 8.3999H19.2V10.7999H4.8V8.3999ZM4.8 13.1999H13.2V15.5999H4.8V13.1999Z"})}),"survey-multiple-choice-2":props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("g",{clipPath:"url(#clip0_1805_18537)",children:(0,jsx_runtime.jsx)("path",{d:"M12.825 13.7748L18.725 7.8498L17.475 6.6498L12.85 11.2748L10.425 8.8248L9.17499 10.0998L12.825 13.7748ZM7.14999 19.1998C6.49999 19.1998 5.94582 18.9706 5.48749 18.5123C5.02915 18.054 4.79999 17.4998 4.79999 16.8498V3.2998C4.79999 2.6498 5.02915 2.09147 5.48749 1.6248C5.94582 1.15814 6.49999 0.924805 7.14999 0.924805H20.7C21.35 0.924805 21.9083 1.15814 22.375 1.6248C22.8417 2.09147 23.075 2.6498 23.075 3.2998V16.8498C23.075 17.4998 22.8417 18.054 22.375 18.5123C21.9083 18.9706 21.35 19.1998 20.7 19.1998H7.14999ZM7.14999 16.8498H20.7V3.2998H7.14999V16.8498V16.8498ZM3.29999 23.0748C2.64999 23.0748 2.09165 22.8415 1.62499 22.3748C1.15832 21.9081 0.924988 21.3498 0.924988 20.6998V4.7998H3.29999V20.6998H19.2V23.0748H3.29999ZM7.14999 3.2998V16.8498V3.2998Z"})}),(0,jsx_runtime.jsx)("defs",{children:(0,jsx_runtime.jsx)("clipPath",{id:"clip0_1805_18537",children:(0,jsx_runtime.jsx)("rect",{width:"24",height:"24",fill:"white"})})})]}),"survey-single-choice":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{d:"M10.475 16.9251L17.825 9.5751L16.175 7.9251L10.475 13.6251L7.7 10.8501L6.075 12.5001L10.475 16.9251ZM12 22.6251C10.5333 22.6251 9.15417 22.3501 7.8625 21.8001C6.57083 21.2501 5.44167 20.4918 4.475 19.5251C3.50833 18.5584 2.75 17.4293 2.2 16.1376C1.65 14.8459 1.375 13.4668 1.375 12.0001C1.375 10.5168 1.65 9.12926 2.2 7.8376C2.75 6.54593 3.50833 5.42093 4.475 4.4626C5.44167 3.50426 6.57083 2.74593 7.8625 2.1876C9.15417 1.62926 10.5333 1.3501 12 1.3501C13.4833 1.3501 14.8708 1.62926 16.1625 2.1876C17.4542 2.74593 18.5792 3.50426 19.5375 4.4626C20.4958 5.42093 21.2542 6.54593 21.8125 7.8376C22.3708 9.12926 22.65 10.5168 22.65 12.0001C22.65 13.4668 22.3708 14.8459 21.8125 16.1376C21.2542 17.4293 20.4958 18.5584 19.5375 19.5251C18.5792 20.4918 17.4542 21.2501 16.1625 21.8001C14.8708 22.3501 13.4833 22.6251 12 22.6251ZM12 20.2751C14.3 20.2751 16.2542 19.4709 17.8625 17.8626C19.4708 16.2543 20.275 14.3001 20.275 12.0001C20.275 9.7001 19.4708 7.74593 17.8625 6.1376C16.2542 4.52926 14.3 3.7251 12 3.7251C9.7 3.7251 7.74583 4.52926 6.1375 6.1376C4.52917 7.74593 3.725 9.7001 3.725 12.0001C3.725 14.3001 4.52917 16.2543 6.1375 17.8626C7.74583 19.4709 9.7 20.2751 12 20.2751Z"})}),section:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 14 14",...props,children:(0,jsx_runtime.jsx)("path",{d:"M2.03372 6.51634C1.73372 6.51634 1.46984 6.40523 1.24206 6.18301C1.01428 5.96078 0.900391 5.69412 0.900391 5.38301V1.98301C0.900391 1.6719 1.01428 1.40245 1.24206 1.17467C1.46984 0.946897 1.73372 0.833008 2.03372 0.833008H11.9671C12.2782 0.833008 12.5448 0.946897 12.7671 1.17467C12.9893 1.40245 13.1004 1.6719 13.1004 1.98301V5.38301C13.1004 5.69412 12.9893 5.96078 12.7671 6.18301C12.5448 6.40523 12.2782 6.51634 11.9671 6.51634H2.03372ZM2.03372 13.1663C1.73372 13.1663 1.46984 13.0525 1.24206 12.8247C1.01428 12.5969 0.900391 12.3275 0.900391 12.0163V8.61634C0.900391 8.30523 1.01428 8.03856 1.24206 7.81634C1.46984 7.59412 1.73372 7.48301 2.03372 7.48301H11.9671C12.2782 7.48301 12.5448 7.59412 12.7671 7.81634C12.9893 8.03856 13.1004 8.30523 13.1004 8.61634V12.0163C13.1004 12.3275 12.9893 12.5969 12.7671 12.8247C12.5448 13.0525 12.2782 13.1663 11.9671 13.1663H2.03372Z"})}),rectangle:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 19 19",...props,children:(0,jsx_runtime.jsx)("rect",{width:"19",height:"19",rx:"3"})}),line:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 20 19.7",...props,children:(0,jsx_runtime.jsx)("path",{d:"M20 2.8a2.8 2.8 0 01-3.8 2.5L5.3 15.9a2.8 2.8 0 01-2.5 3.8A2.8 2.8 0 114 14.4L14.7 4A2.7 2.7 0 0117.2 0C18.8 0 20 1.2 20 2.8z",clipRule:"evenodd",fillRule:"evenodd"})}),logic:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 18 14",...props,children:(0,jsx_runtime.jsx)("path",{d:"M7.33301 7.83398C7.33301 5.03398 6.20801 4.11732 5.46634 3.81732C5.08301 4.70898 4.19968 5.33398 3.16634 5.33398C2.5033 5.33398 1.86742 5.07059 1.39858 4.60175C0.929735 4.13291 0.666344 3.49702 0.666344 2.83398C0.666344 2.17094 0.929735 1.53506 1.39858 1.06622C1.86742 0.597376 2.5033 0.333984 3.16634 0.333984C4.25801 0.333984 5.18301 1.02565 5.52468 2.00065L12.4747 2.00065C12.8163 1.02565 13.7413 0.333984 14.833 0.333984C15.496 0.333984 16.1319 0.597376 16.6008 1.06622C17.0696 1.53506 17.333 2.17094 17.333 2.83398C17.333 3.49703 17.0696 4.13291 16.6008 4.60175C16.1319 5.07059 15.496 5.33398 14.833 5.33398C13.7413 5.33398 12.8163 4.64232 12.4747 3.66732L8.06634 3.66732C8.60801 4.40065 8.99968 5.46732 8.99968 7.00065C8.99968 9.22565 10.1163 9.96732 10.858 10.209C11.233 9.30898 12.1247 8.66732 13.1663 8.66732C13.8294 8.66732 14.4653 8.93071 14.9341 9.39955C15.4029 9.86839 15.6663 10.5043 15.6663 11.1673C15.6663 11.8304 15.4029 12.4662 14.9341 12.9351C14.4653 13.4039 13.8294 13.6673 13.1663 13.6673C12.0497 13.6673 11.083 12.934 10.783 11.9256C9.59134 11.709 7.33301 10.9006 7.33301 7.83398ZM3.99968 2.83398C3.99968 2.61297 3.91188 2.40101 3.7556 2.24473C3.59932 2.08845 3.38736 2.00065 3.16634 2.00065C2.94533 2.00065 2.73337 2.08845 2.57709 2.24473C2.42081 2.40101 2.33301 2.61297 2.33301 2.83398C2.33301 3.055 2.42081 3.26696 2.57709 3.42324C2.73337 3.57952 2.94533 3.66732 3.16634 3.66732C3.38736 3.66732 3.59932 3.57952 3.7556 3.42324C3.91188 3.26696 3.99968 3.055 3.99968 2.83398ZM15.6663 2.83398C15.6663 2.61297 15.5785 2.40101 15.4223 2.24473C15.266 2.08845 15.054 2.00065 14.833 2.00065C14.612 2.00065 14.4 2.08845 14.2438 2.24473C14.0875 2.40101 13.9997 2.61297 13.9997 2.83398C13.9997 3.055 14.0875 3.26696 14.2438 3.42324C14.4 3.57952 14.612 3.66732 14.833 3.66732C15.054 3.66732 15.266 3.57952 15.4223 3.42324C15.5785 3.26696 15.6663 3.055 15.6663 2.83398ZM13.9997 11.1673C13.9997 10.9463 13.9119 10.7343 13.7556 10.5781C13.5993 10.4218 13.3874 10.334 13.1663 10.334C12.9453 10.334 12.7334 10.4218 12.5771 10.5781C12.4208 10.7343 12.333 10.9463 12.333 11.1673C12.333 11.3883 12.4208 11.6003 12.5771 11.7566C12.7334 11.9129 12.9453 12.0007 13.1663 12.0007C13.3874 12.0007 13.5993 11.9129 13.7556 11.7566C13.9119 11.6003 13.9997 11.3883 13.9997 11.1673Z"})}),save:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 18 18",...props,children:[(0,jsx_runtime.jsx)("path",{d:"M-3-3h24v24H-3z",fill:"none"}),(0,jsx_runtime.jsx)("path",{d:"M14 0H2a2 2 0 00-2 2v14c0 1.1.9 2 2 2h14a2 2 0 002-2V4zM9 16a3 3 0 110-6 3 3 0 010 6zm3-10H2V2h10z"})]}),grid:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H9C9.53043 3 10.0391 3.21071 10.4142 3.58579C10.7893 3.96086 11 4.46957 11 5V9C11 9.53043 10.7893 10.0391 10.4142 10.4142C10.0391 10.7893 9.53043 11 9 11H5C4.46957 11 3.96086 10.7893 3.58579 10.4142C3.21071 10.0391 3 9.53043 3 9V5C3 4.46957 3.21071 3.96086 3.58579 3.58579ZM9 5H5V9H9V5ZM13.5858 3.58579C13.9609 3.21071 14.4696 3 15 3H19C19.5304 3 20.0391 3.21071 20.4142 3.58579C20.7893 3.96086 21 4.46957 21 5V9C21 9.53043 20.7893 10.0391 20.4142 10.4142C20.0391 10.7893 19.5304 11 19 11H15C14.4696 11 13.9609 10.7893 13.5858 10.4142C13.2107 10.0391 13 9.53043 13 9V5C13 4.46957 13.2107 3.96086 13.5858 3.58579ZM19 5H15V9H19L19 5ZM3.58579 13.5858C3.96086 13.2107 4.46957 13 5 13H9C9.53043 13 10.0391 13.2107 10.4142 13.5858C10.7893 13.9609 11 14.4696 11 15V19C11 19.5304 10.7893 20.0391 10.4142 20.4142C10.0391 20.7893 9.53043 21 9 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V15C3 14.4696 3.21071 13.9609 3.58579 13.5858ZM9 15H5V19H9V15ZM13.5858 13.5858C13.9609 13.2107 14.4696 13 15 13H19C19.5304 13 20.0391 13.2107 20.4142 13.5858C20.7893 13.9609 21 14.4696 21 15V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H15C14.4696 21 13.9609 20.7893 13.5858 20.4142C13.2107 20.0391 13 19.5304 13 19V15C13 14.4696 13.2107 13.9609 13.5858 13.5858ZM19 15H15V19H19L19 15Z"})}),projects:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M4.17157 4.17157C4.92172 3.42143 5.93913 3 7 3H11C12.0609 3 13.0783 3.42143 13.8284 4.17157C14.5786 4.92172 15 5.93913 15 7V20H18V17.8284C17.5821 17.6807 17.1981 17.4407 16.8787 17.1213C16.3161 16.5587 16 15.7957 16 15V13C16 12.2044 16.3161 11.4413 16.8787 10.8787C17.4413 10.3161 18.2043 10 19 10C19.7956 10 20.5587 10.3161 21.1213 10.8787C21.6839 11.4413 22 12.2044 22 13V15C22 15.7957 21.6839 16.5587 21.1213 17.1213C20.8019 17.4407 20.4179 17.6807 20 17.8284V20H21C21.5523 20 22 20.4477 22 21C22 21.5523 21.5523 22 21 22H3C2.44772 22 2 21.5523 2 21C2 20.4477 2.44772 20 3 20V7C3 5.93913 3.42143 4.92172 4.17157 4.17157ZM5 20H8V17C8 16.4477 8.44772 16 9 16C9.55229 16 10 16.4477 10 17V20H13V7C13 6.46957 12.7893 5.96086 12.4142 5.58579C12.0391 5.21071 11.5304 5 11 5H7C6.46957 5 5.96086 5.21071 5.58579 5.58579C5.21071 5.96086 5 6.46957 5 7V20ZM7 9C7 8.44772 7.44772 8 8 8H10C10.5523 8 11 8.44772 11 9C11 9.55228 10.5523 10 10 10H8C7.44772 10 7 9.55228 7 9ZM19 12C18.7348 12 18.4804 12.1054 18.2929 12.2929C18.1054 12.4804 18 12.7348 18 13V15C18 15.2652 18.1054 15.5196 18.2929 15.7071C18.4804 15.8946 18.7348 16 19 16C19.2652 16 19.5196 15.8946 19.7071 15.7071C19.8946 15.5196 20 15.2652 20 15V13C20 12.7348 19.8946 12.4804 19.7071 12.2929C19.5196 12.1054 19.2652 12 19 12ZM7 13C7 12.4477 7.44772 12 8 12H10C10.5523 12 11 12.4477 11 13C11 13.5523 10.5523 14 10 14H8C7.44772 14 7 13.5523 7 13Z"})}),messages:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M5 6C4.73478 6 4.48043 6.10536 4.29289 6.29289C4.21971 6.36608 4.15904 6.44944 4.11226 6.53965L12 11.7981L19.8877 6.53965C19.841 6.44944 19.7803 6.36608 19.7071 6.29289C19.5196 6.10536 19.2652 6 19 6H5ZM20 8.86852L12.5547 13.832C12.2188 14.056 11.7812 14.056 11.4453 13.832L4 8.86852V17C4 17.2652 4.10536 17.5196 4.29289 17.7071C4.48043 17.8946 4.73478 18 5 18H19C19.2652 18 19.5196 17.8946 19.7071 17.7071C19.8946 17.5196 20 17.2652 20 17V8.86852ZM2.87868 4.87868C3.44129 4.31607 4.20435 4 5 4H19C19.7956 4 20.5587 4.31607 21.1213 4.87868C21.6839 5.44129 22 6.20435 22 7V17C22 17.7957 21.6839 18.5587 21.1213 19.1213C20.5587 19.6839 19.7956 20 19 20H5C4.20435 20 3.44129 19.6839 2.87868 19.1213C2.31607 18.5587 2 17.7956 2 17V7C2 6.20435 2.31607 5.44129 2.87868 4.87868Z"})}),users:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M5.46447 3.46447C6.40215 2.52678 7.67392 2 9 2C10.3261 2 11.5979 2.52678 12.5355 3.46447C13.4732 4.40215 14 5.67392 14 7C14 8.32608 13.4732 9.59785 12.5355 10.5355C11.5979 11.4732 10.3261 12 9 12C7.67392 12 6.40215 11.4732 5.46447 10.5355C4.52678 9.59785 4 8.32608 4 7C4 5.67392 4.52678 4.40215 5.46447 3.46447ZM9 4C8.20435 4 7.44129 4.31607 6.87868 4.87868C6.31607 5.44129 6 6.20435 6 7C6 7.79565 6.31607 8.55871 6.87868 9.12132C7.44129 9.68393 8.20435 10 9 10C9.79565 10 10.5587 9.68393 11.1213 9.12132C11.6839 8.55871 12 7.79565 12 7C12 6.20435 11.6839 5.44129 11.1213 4.87868C10.5587 4.31607 9.79565 4 9 4ZM15.0313 2.88196C15.1682 2.34694 15.713 2.02426 16.248 2.16125C17.3236 2.43663 18.2768 3.06213 18.9576 3.93914C19.6383 4.81615 20.0078 5.89479 20.0078 7.005C20.0078 8.11521 19.6383 9.19385 18.9576 10.0709C18.2768 10.9479 17.3236 11.5734 16.248 11.8488C15.713 11.9857 15.1682 11.6631 15.0313 11.128C14.8943 10.593 15.2169 10.0482 15.752 9.91125C16.3973 9.74602 16.9692 9.37072 17.3777 8.84452C17.7861 8.31831 18.0078 7.67113 18.0078 7.005C18.0078 6.33887 17.7861 5.69169 17.3777 5.16548C16.9692 4.63928 16.3973 4.26398 15.752 4.09875C15.2169 3.96176 14.8943 3.41699 15.0313 2.88196ZM7 16C6.20435 16 5.44129 16.3161 4.87868 16.8787C4.31607 17.4413 4 18.2044 4 19V21C4 21.5523 3.55228 22 3 22C2.44772 22 2 21.5523 2 21V19C2 17.6739 2.52678 16.4021 3.46447 15.4645C4.40215 14.5268 5.67392 14 7 14H11C12.3261 14 13.5979 14.5268 14.5355 15.4645C15.4732 16.4021 16 17.6739 16 19V21C16 21.5523 15.5523 22 15 22C14.4477 22 14 21.5523 14 21V19C14 18.2044 13.6839 17.4413 13.1213 16.8787C12.5587 16.3161 11.7956 16 11 16H7ZM17.0317 14.9C17.1698 14.3653 17.7152 14.0437 18.25 14.1817C19.3185 14.4576 20.2658 15.0793 20.9441 15.9498C21.6224 16.8202 21.9936 17.8907 22 18.9942L22 19L22 21C22 21.5523 21.5523 22 21 22C20.4477 22 20 21.5523 20 21V19.003C19.9956 18.3418 19.7729 17.7006 19.3665 17.179C18.9595 16.6568 18.3911 16.2838 17.75 16.1182C17.2153 15.9802 16.8937 15.4348 17.0317 14.9Z"})}),proposals:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M5.96096 5.86961C8.08606 4.02614 11.3577 3 15.986 3H20C20.5523 3 21 3.44772 21 4V6C21 6.01911 20.9994 6.03822 20.9984 6.0573C20.7402 10.5562 19.4959 13.8287 17.3515 15.974C15.1973 18.129 12.2822 19 8.99999 19H6.36933C6.20008 19.6673 6.07604 20.371 5.99388 21.1104C5.93289 21.6593 5.43847 22.0549 4.88956 21.9939C4.34065 21.9329 3.94512 21.4385 4.00611 20.8896C4.12017 19.8631 4.30975 18.8746 4.58876 17.933C2.98991 15.9072 2.98599 13.9562 2.98599 13L2.986 12.9972C2.99356 10.2954 3.81138 7.73432 5.96096 5.86961ZM7.06464 17C7.28661 16.5136 7.54179 16.0526 7.83204 15.6172C8.84199 14.1023 10.3121 12.8445 12.4061 11.9138C12.9108 11.6895 13.1381 11.0985 12.9138 10.5939C12.6895 10.0892 12.0985 9.86189 11.5939 10.0862C9.18791 11.1555 7.40799 12.6477 6.16794 14.5078C5.92318 14.8749 5.70085 15.2543 5.49963 15.645C4.98597 14.574 4.98598 13.6271 4.98599 13.008L4.98599 13.0014C4.99269 10.7039 5.67492 8.7654 7.27152 7.38039C8.89293 5.97386 11.6143 5 15.986 5H19V5.97107C18.7547 10.1681 17.6093 12.8871 15.937 14.56C14.2706 16.227 11.9357 17 8.99999 17H7.06464Z"})}),"messages-inbox":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M6 5H18C18.5523 5 19 5.44772 19 6V12H17.9142C17.3838 12 16.8751 12.2107 16.5 12.5858L14.5858 14.5H9.48063L8.08111 12.7506C7.70157 12.2762 7.12694 12 6.51938 12H5V6C5 5.44772 5.44772 5 6 5ZM5 14V18C5 18.5523 5.44772 19 6 19H18C18.5523 19 19 18.5523 19 18V14H17.9142L16 15.9142C15.6249 16.2893 15.1162 16.5 14.5858 16.5H9.48063C8.87306 16.5 8.29843 16.2238 7.91889 15.7494L6.51937 14H5ZM3 6C3 4.34315 4.34315 3 6 3H18C19.6569 3 21 4.34315 21 6V18C21 19.6569 19.6569 21 18 21H6C4.34315 21 3 19.6569 3 18V6Z"})}),dashboard:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M13.9431 3.00163C14.3802 2.97674 14.7826 3.239 14.9363 3.64889L17.693 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H17C16.5832 13 16.21 12.7414 16.0637 12.3511L14.1913 7.35805L10.9701 20.2425C10.864 20.6672 10.4939 20.9735 10.0569 20.9984C9.61982 21.0233 9.21738 20.761 9.06367 20.3511L6.307 13H3C2.44772 13 2 12.5523 2 12C2 11.4477 2.44772 11 3 11H7C7.41684 11 7.78997 11.2586 7.93633 11.6489L9.80873 16.642L13.0299 3.75748C13.136 3.33279 13.5061 3.02652 13.9431 3.00163Z"})}),help:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M8.55585 3.68508C9.64778 3.23279 10.8181 3 12 3C13.1819 3 14.3522 3.23279 15.4441 3.68508C16.5361 4.13738 17.5282 4.80031 18.364 5.63604C19.1997 6.47177 19.8626 7.46392 20.3149 8.55585C20.7672 9.64778 21 10.8181 21 12C21 13.1819 20.7672 14.3522 20.3149 15.4441C19.8626 16.5361 19.1997 17.5282 18.364 18.364C17.5282 19.1997 16.5361 19.8626 15.4441 20.3149C14.3522 20.7672 13.1819 21 12 21C10.8181 21 9.64778 20.7672 8.55585 20.3149C7.46392 19.8626 6.47177 19.1997 5.63604 18.364C4.80031 17.5282 4.13738 16.5361 3.68508 15.4441C3.23279 14.3522 3 13.1819 3 12C3 10.8181 3.23279 9.64778 3.68508 8.55585C4.13738 7.46392 4.80031 6.47177 5.63604 5.63604C6.47177 4.80031 7.46392 4.13738 8.55585 3.68508ZM12 4.8C11.0545 4.8 10.1182 4.98623 9.24468 5.34807C8.37114 5.7099 7.57741 6.24025 6.90883 6.90883C6.24025 7.57741 5.7099 8.37114 5.34807 9.24468C4.98623 10.1182 4.8 11.0545 4.8 12C4.8 12.9455 4.98623 13.8818 5.34807 14.7553C5.7099 15.6289 6.24025 16.4226 6.90883 17.0912C7.57741 17.7597 8.37114 18.2901 9.24468 18.6519C10.1182 19.0138 11.0545 19.2 12 19.2C12.9455 19.2 13.8818 19.0138 14.7553 18.6519C15.6289 18.2901 16.4226 17.7597 17.0912 17.0912C17.7597 16.4226 18.2901 15.6289 18.6519 14.7553C19.0138 13.8818 19.2 12.9455 19.2 12C19.2 11.0545 19.0138 10.1182 18.6519 9.24468C18.2901 8.37114 17.7597 7.57741 17.0912 6.90883C16.4226 6.24025 15.6289 5.7099 14.7553 5.34807C13.8818 4.98623 12.9455 4.8 12 4.8ZM10.6273 6.91042C11.0767 6.68802 11.5717 6.57298 12.0732 6.57438C12.5746 6.57577 13.0689 6.69354 13.5172 6.91843C13.9654 7.14332 14.3553 7.46918 14.6562 7.87036C14.9571 8.27154 15.1607 8.73709 15.2511 9.23035C15.3415 9.72362 15.3162 10.2311 15.1771 10.7129C15.038 11.1947 14.789 11.6377 14.4496 12.0069C14.1103 12.3761 13.6899 12.6615 13.2215 12.8406C13.2139 12.8435 13.2062 12.8463 13.1986 12.849C13.1065 12.8814 13.0275 12.9428 12.9734 13.0239C12.9193 13.1051 12.893 13.2016 12.8986 13.299C12.9267 13.7953 12.5472 14.2204 12.051 14.2486C11.5547 14.2767 11.1296 13.8972 11.1014 13.401C11.0738 12.914 11.2052 12.4313 11.4757 12.0255C11.7434 11.6239 12.1331 11.3191 12.5871 11.1561C12.7918 11.0763 12.9756 10.9507 13.1244 10.7888C13.2752 10.6247 13.3859 10.4279 13.4477 10.2137C13.5095 9.99959 13.5208 9.77403 13.4806 9.5548C13.4404 9.33558 13.3499 9.12867 13.2162 8.95036C13.0825 8.77206 12.9092 8.62723 12.71 8.52728C12.5107 8.42733 12.2911 8.37499 12.0682 8.37437C11.8453 8.37375 11.6253 8.42488 11.4256 8.52372C11.2258 8.62256 11.0517 8.76643 10.917 8.94399C10.6166 9.33997 10.052 9.41743 9.65601 9.11699C9.26003 8.81656 9.18257 8.252 9.48301 7.85601C9.78611 7.45651 10.1778 7.13281 10.6273 6.91042ZM12 15.6C12.4971 15.6 12.9 16.0029 12.9 16.5V16.5103C12.9 17.0073 12.4971 17.4103 12 17.4103C11.5029 17.4103 11.1 17.0073 11.1 16.5103V16.5C11.1 16.0029 11.5029 15.6 12 15.6Z"})}),cog:props=>(0,jsx_runtime.jsxs)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:[(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M9.86692 4.22393C10.2542 3.56068 10.8982 3.133 11.6588 3.02404C12.5741 2.89293 13.5551 3.30499 14.0546 4.08955C14.1539 4.24555 14.2339 4.40757 14.2945 4.5823C14.3083 4.62175 14.3212 4.66138 14.334 4.70075C14.4199 4.96444 14.5021 5.21687 14.7951 5.33309C15.0384 5.42961 15.2437 5.32316 15.4516 5.21536C15.4791 5.20108 15.5067 5.18678 15.5344 5.17293C15.6972 5.09153 15.8738 5.02924 16.0496 4.98286C16.784 4.78916 17.5943 4.98669 18.1778 5.4662C18.9135 6.07085 19.251 7.03911 19.0207 7.96436C18.9717 8.1613 18.8922 8.34438 18.7993 8.5243C18.7918 8.53875 18.7843 8.55309 18.7769 8.56736C18.6747 8.76331 18.5798 8.94513 18.6605 9.17384C18.7782 9.50744 19.093 9.61487 19.4067 9.72189C19.5572 9.77327 19.7075 9.82455 19.8356 9.90071C20.4405 10.2605 20.8683 10.8952 20.9714 11.5928C21.1123 12.5469 20.7295 13.5368 19.9028 14.0634C19.755 14.1575 19.5978 14.2372 19.4323 14.2952C19.3881 14.3107 19.3437 14.325 19.2998 14.3391C19.0551 14.4179 18.8235 14.4925 18.693 14.7509C18.5501 15.034 18.6941 15.3152 18.8345 15.5891C18.8988 15.7145 18.9623 15.8385 18.9971 15.9604C19.1695 16.5644 19.1089 17.1919 18.8217 17.7522C18.3409 18.6897 17.2297 19.2744 16.184 19.0587C15.97 19.0146 15.7531 18.9395 15.5568 18.8439C15.5225 18.8272 15.4888 18.8099 15.4554 18.7928C15.2266 18.6758 15.0138 18.567 14.7503 18.6991C14.496 18.8266 14.4267 19.0354 14.348 19.2727C14.3379 19.303 14.3277 19.3337 14.317 19.3648C14.2608 19.5271 14.1888 19.686 14.1035 19.8352C13.7577 20.4399 13.1098 20.869 12.4205 20.9708C11.4819 21.1094 10.5026 20.753 9.96782 19.9472C9.87163 19.8022 9.78509 19.6404 9.72541 19.4768C9.70606 19.4237 9.68856 19.3704 9.67124 19.3176C9.58228 19.0464 9.49833 18.7904 9.19459 18.6689C8.95639 18.5737 8.76565 18.6728 8.55918 18.7801C8.54702 18.7864 8.53481 18.7928 8.52253 18.7991C8.35705 18.8845 8.18784 18.9614 8.00728 19.0091C7.23757 19.2121 6.42664 19.0415 5.81188 18.5297C5.09963 17.9367 4.74579 16.9793 4.97125 16.0724C5.01498 15.8964 5.07681 15.7195 5.15795 15.5572C5.17354 15.526 5.1895 15.4953 5.20527 15.465C5.3172 15.2499 5.42029 15.0517 5.32551 14.7957C5.21157 14.4878 4.90173 14.3855 4.59786 14.2852C4.44787 14.2357 4.29934 14.1866 4.17654 14.1136C3.51001 13.7172 3.11168 13.0494 3.01804 12.2871C2.9039 11.3579 3.3381 10.4165 4.13173 9.92248C4.293 9.82212 4.46604 9.74191 4.64698 9.68328C4.6754 9.67407 4.70372 9.66527 4.7318 9.65654C4.95855 9.58605 5.16966 9.52042 5.29249 9.28583C5.45141 8.98231 5.30296 8.68506 5.15747 8.39375C5.09286 8.26439 5.02884 8.1362 4.99258 8.00916C4.8221 7.41181 4.90682 6.78901 5.19041 6.23973C5.69725 5.25806 6.82334 4.73989 7.89527 4.96779C8.07274 5.0055 8.24734 5.06905 8.41052 5.14802C8.44617 5.16528 8.48129 5.18306 8.51607 5.20068C8.76577 5.32713 8.99794 5.44471 9.2842 5.29488C9.53534 5.16344 9.62148 4.89371 9.70674 4.62672C9.75212 4.48459 9.79726 4.34323 9.86692 4.22393ZM11.3327 5.43237C11.4272 5.15599 11.5177 4.89099 11.8604 4.8178C11.9324 4.80241 12.0114 4.80214 12.0844 4.81009C12.4804 4.8531 12.5889 5.17285 12.6972 5.49229C12.7407 5.62051 12.7842 5.74869 12.8462 5.85889C13.1648 6.42481 13.6565 6.86092 14.2798 7.06066C14.7642 7.21584 15.2983 7.22101 15.7808 7.0528C15.8811 7.01783 15.9818 6.96942 16.083 6.92083C16.4048 6.76623 16.7305 6.60979 17.0568 6.87841C17.1138 6.92531 17.1582 6.98214 17.1948 7.04597C17.3688 7.34961 17.2363 7.6165 17.1016 7.8877C17.0525 7.98664 17.0031 8.08617 16.9681 8.18826C16.7877 8.71597 16.7797 9.29751 16.9776 9.82329C17.1956 10.4025 17.613 10.8671 18.1554 11.1602C18.2544 11.2138 18.3745 11.2534 18.4971 11.2939C18.8087 11.3968 19.1372 11.5052 19.1817 11.8615C19.1924 11.9471 19.1922 12.0447 19.1818 12.1303C19.1366 12.5011 18.7986 12.6136 18.4754 12.7212C18.3446 12.7648 18.2162 12.8075 18.1106 12.8663C17.6697 13.1117 17.3051 13.4931 17.0794 13.9445C16.8037 14.4957 16.765 15.126 16.9328 15.7139C16.9673 15.8345 17.0277 15.9556 17.0887 16.0777C17.2296 16.36 17.3731 16.6474 17.2026 16.9458C17.1648 17.0118 17.1138 17.0702 17.0573 17.1208C16.8838 17.2766 16.6283 17.3254 16.408 17.2471C16.3343 17.2208 16.2656 17.1818 16.1969 17.1428C16.1483 17.1152 16.0998 17.0877 16.0496 17.0647C15.8862 16.9898 15.7098 16.9274 15.5343 16.8881C14.7726 16.7177 13.9276 16.9431 13.3614 17.4842C13.1318 17.7036 12.9285 17.953 12.7982 18.2449C12.7586 18.3336 12.7269 18.4258 12.6958 18.5164C12.5904 18.8236 12.4911 19.1132 12.1068 19.1899C12.0305 19.2051 11.9594 19.2092 11.8828 19.193C11.5033 19.1126 11.3972 18.8023 11.289 18.486C11.2448 18.3567 11.2003 18.2265 11.1366 18.1105C10.8399 17.5703 10.3381 17.1535 9.75462 16.9573C9.25291 16.7887 8.7093 16.7925 8.20888 16.9607C8.10367 16.9961 7.99978 17.046 7.89641 17.0956C7.58533 17.2449 7.27888 17.3919 6.95471 17.1355C6.89583 17.0889 6.84706 17.0323 6.80829 16.9682C6.62533 16.6654 6.75783 16.401 6.89319 16.131C6.9434 16.0308 6.99399 15.9299 7.02904 15.8259C7.21161 15.2841 7.22823 14.7065 7.01701 14.1685C6.80345 13.6246 6.41871 13.1567 5.90147 12.8763C5.78938 12.8156 5.66161 12.7704 5.53382 12.7253C5.1918 12.6044 4.84965 12.4836 4.80761 12.0631C4.80015 11.9887 4.80212 11.9117 4.82082 11.8391C4.9079 11.5009 5.18965 11.408 5.47555 11.3138C5.59118 11.2756 5.70748 11.2373 5.81187 11.1824C6.27306 10.9399 6.66899 10.5589 6.90401 10.0921C7.182 9.53983 7.24714 8.91777 7.07919 8.32264C7.04424 8.19877 6.98202 8.0737 6.91923 7.94746C6.77643 7.6604 6.63062 7.36727 6.79543 7.06837C6.83158 7.00279 6.87854 6.94303 6.93286 6.89154C6.97928 6.84753 7.03103 6.812 7.08878 6.78454C7.36754 6.65196 7.58458 6.76127 7.8184 6.87902C7.87973 6.90991 7.94221 6.94138 8.00726 6.96921C8.18709 7.04615 8.37531 7.10291 8.56732 7.13993C9.33963 7.2889 10.1568 7.00263 10.7159 6.45982C10.9582 6.22462 11.1439 5.92498 11.2679 5.61251C11.2914 5.55317 11.3122 5.4925 11.3327 5.43237Z"}),(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M9.97867 9.01783C10.4596 8.68936 11.0187 8.50404 11.5916 8.42202C12.0125 8.36177 12.4814 8.41416 12.8909 8.51607C13.3152 8.62161 13.7202 8.80402 14.0782 9.05572C14.3981 9.28062 14.6741 9.55217 14.9037 9.86829C15.7711 11.0624 15.8361 12.7233 15.026 13.9671C14.7612 14.3735 14.4111 14.7235 14.011 14.9967C13.5581 15.306 13.0281 15.4925 12.4877 15.5701C12.0405 15.6343 11.5816 15.6075 11.1436 15.4985C10.6466 15.3748 10.1829 15.1567 9.77705 14.8431C9.48916 14.6206 9.24484 14.3558 9.03834 14.0567C7.9162 12.431 8.34695 10.1322 9.97867 9.01783ZM11.0092 10.4962C11.2428 10.3399 11.517 10.2533 11.7932 10.2138C11.9997 10.1842 12.2186 10.2033 12.4205 10.2519C13.7023 10.5607 14.2183 12.1508 13.3819 13.1607C13.2453 13.3256 13.0807 13.468 12.8909 13.5687C12.7026 13.6688 12.4991 13.7533 12.2861 13.7813C11.8226 13.8424 11.3518 13.7506 10.9643 13.4794C10.1915 12.9385 9.95668 11.7988 10.4946 11.0105C10.6311 10.8104 10.8076 10.6311 11.0092 10.4962Z"})]}),organigram:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M11 4C10.7348 4 10.4804 4.10536 10.2929 4.29289C10.1054 4.48043 10 4.73478 10 5V7C10 7.26522 10.1054 7.51957 10.2929 7.70711C10.4804 7.89464 10.7348 8 11 8H13C13.2652 8 13.5196 7.89464 13.7071 7.70711C13.8946 7.51957 14 7.26522 14 7V5C14 4.73478 13.8946 4.48043 13.7071 4.29289C13.5196 4.10536 13.2652 4 13 4H11ZM8.87868 2.87868C9.44129 2.31607 10.2044 2 11 2H13C13.7956 2 14.5587 2.31607 15.1213 2.87868C15.6839 3.44129 16 4.20435 16 5V7C16 7.79565 15.6839 8.55871 15.1213 9.12132C14.5587 9.68393 13.7957 10 13 10V11H16C16.7957 11 17.5587 11.3161 18.1213 11.8787C18.6839 12.4413 19 13.2044 19 14C19.7957 14 20.5587 14.3161 21.1213 14.8787C21.6839 15.4413 22 16.2044 22 17V19C22 19.7957 21.6839 20.5587 21.1213 21.1213C20.5587 21.6839 19.7957 22 19 22H17C16.2044 22 15.4413 21.6839 14.8787 21.1213C14.3161 20.5587 14 19.7957 14 19V17C14 16.2044 14.3161 15.4413 14.8787 14.8787C15.4413 14.3161 16.2044 14 17 14C17 13.7348 16.8946 13.4804 16.7071 13.2929C16.5196 13.1054 16.2652 13 16 13H8C7.73478 13 7.48043 13.1054 7.29289 13.2929C7.10536 13.4804 7 13.7348 7 14C7.79565 14 8.55871 14.3161 9.12132 14.8787C9.68393 15.4413 10 16.2044 10 17V19C10 19.7957 9.68393 20.5587 9.12132 21.1213C8.55871 21.6839 7.79565 22 7 22H5C4.20435 22 3.44129 21.6839 2.87868 21.1213C2.31607 20.5587 2 19.7957 2 19V17C2 16.2044 2.31607 15.4413 2.87868 14.8787C3.44129 14.3161 4.20435 14 5 14C5 13.2044 5.31607 12.4413 5.87868 11.8787C6.44129 11.3161 7.20435 11 8 11H11L11 10C10.2043 10 9.44129 9.68393 8.87868 9.12132C8.31607 8.55871 8 7.79565 8 7V5C8 4.20435 8.31607 3.44129 8.87868 2.87868ZM5 16C4.73478 16 4.48043 16.1054 4.29289 16.2929C4.10536 16.4804 4 16.7348 4 17V19C4 19.2652 4.10536 19.5196 4.29289 19.7071C4.48043 19.8946 4.73478 20 5 20H7C7.26522 20 7.51957 19.8946 7.70711 19.7071C7.89464 19.5196 8 19.2652 8 19V17C8 16.7348 7.89464 16.4804 7.70711 16.2929C7.51957 16.1054 7.26522 16 7 16H5ZM17 16C16.7348 16 16.4804 16.1054 16.2929 16.2929C16.1054 16.4804 16 16.7348 16 17V19C16 19.2652 16.1054 19.5196 16.2929 19.7071C16.4804 19.8946 16.7348 20 17 20H19C19.2652 20 19.5196 19.8946 19.7071 19.7071C19.8946 19.5196 20 19.2652 20 19V17C20 16.7348 19.8946 16.4804 19.7071 16.2929C19.5196 16.1054 19.2652 16 19 16H17Z"})}),community:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12.8321 2.4453C12.6466 2.1671 12.3344 2 12 2C11.6656 2 11.3534 2.1671 11.168 2.4453L9.16795 5.4453C9.08337 5.57217 9.02892 5.7167 9.00877 5.86784L8.72448 8H8C7.44772 8 7 8.44772 7 9C7 9.55228 7.44772 10 8 10H8.45782L7.00877 20.8678C6.97067 21.1536 7.05773 21.4418 7.24762 21.6587C7.4375 21.8756 7.71174 22 8 22H16C16.2883 22 16.5625 21.8756 16.7524 21.6587C16.9423 21.4418 17.0293 21.1536 16.9912 20.8678L15.5422 10H16C16.5523 10 17 9.55228 17 9C17 8.44772 16.5523 8 16 8H15.2755L14.9912 5.86784C14.9711 5.7167 14.9166 5.57217 14.8321 5.4453L12.8321 2.4453ZM13.2578 8L13.0394 6.36188L12 4.80278L10.9606 6.36188L10.7422 8H13.2578ZM10.4755 10L9.14218 20H14.8578L13.5245 10H10.4755ZM2.29289 6.29289C2.68342 5.90237 3.31658 5.90237 3.70711 6.29289L5.70711 8.29289C6.09763 8.68342 6.09763 9.31658 5.70711 9.70711L3.70711 11.7071C3.31658 12.0976 2.68342 12.0976 2.29289 11.7071C1.90237 11.3166 1.90237 10.6834 2.29289 10.2929L3.58579 9L2.29289 7.70711C1.90237 7.31658 1.90237 6.68342 2.29289 6.29289ZM21.7071 7.70711C22.0976 7.31658 22.0976 6.68342 21.7071 6.29289C21.3166 5.90237 20.6834 5.90237 20.2929 6.29289L18.2929 8.29289C17.9024 8.68342 17.9024 9.31658 18.2929 9.70711L20.2929 11.7071C20.6834 12.0976 21.3166 12.0976 21.7071 11.7071C22.0976 11.3166 22.0976 10.6834 21.7071 10.2929L20.4142 9L21.7071 7.70711Z"})}),academy:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12.3714 4.07152C12.133 3.97616 11.867 3.97616 11.6286 4.07152L1.62861 8.07152C1.24895 8.22339 1 8.59109 1 9C1 9.4089 1.24895 9.77661 1.62861 9.92848L5 11.277V16C5 17.3662 6.06101 18.3912 7.31015 19.0157C8.60606 19.6637 10.2935 20 12 20C13.7065 20 15.3939 19.6637 16.6899 19.0157C17.939 18.3912 19 17.3662 19 16V11.277L21 10.477V15C21 15.5523 21.4477 16 22 16C22.5523 16 23 15.5523 23 15V9C23 8.59109 22.751 8.22339 22.3714 8.07152L12.3714 4.07152ZM17.6502 9.66289C17.6358 9.66825 17.6216 9.67393 17.6076 9.67992L12 11.923L6.39247 9.67996C6.37839 9.67394 6.36414 9.66824 6.34974 9.66286L4.69258 9L12 6.07703L19.3074 9L17.6502 9.66289ZM7 12.077L11.6286 13.9285C11.867 14.0238 12.133 14.0238 12.3714 13.9285L17 12.077V16C17 16.2251 16.7967 16.7262 15.7954 17.2269C14.8409 17.7041 13.4761 18 12 18C10.5239 18 9.15909 17.7041 8.20457 17.2269C7.20327 16.7262 7 16.2251 7 16V12.077Z"})}),book:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M2.00491 5.90004C2.00092 5.93951 1.99925 5.97929 1.99998 6.01916V18.9826C1.9983 19.0747 2.00934 19.1677 2.03382 19.2588C2.06553 19.3775 2.11851 19.4874 2.18842 19.5844C2.27298 19.7021 2.37957 19.7967 2.49917 19.8657C2.61982 19.9357 2.75645 19.9811 2.90223 19.9952C3.02031 20.0069 3.14112 19.9978 3.25887 19.9661C3.34974 19.9418 3.43551 19.9051 3.51423 19.8578C4.72691 19.161 6.10117 18.7942 7.49998 18.7942C8.89879 18.7942 10.2731 19.161 11.4857 19.8578C11.6254 19.9417 11.7873 19.9925 11.9605 19.9992C11.9737 19.9997 11.9868 20 12 20C12.0108 20 12.0216 19.9998 12.0324 19.9994C12.2082 19.9938 12.3726 19.9429 12.5142 19.8578C13.7269 19.161 15.1012 18.7942 16.5 18.7942C17.8988 18.7942 19.2731 19.161 20.4857 19.8578C20.5645 19.9051 20.6502 19.9418 20.7411 19.9661C20.8588 19.9978 20.9797 20.0069 21.0977 19.9952C21.2434 19.9811 21.38 19.9357 21.5006 19.8658C21.6204 19.7967 21.7271 19.702 21.8117 19.5841C21.8816 19.4872 21.9345 19.3774 21.9662 19.2588C21.9906 19.1677 22.0017 19.0747 22 18.9826V6.01917C22.0007 5.97926 21.9991 5.93945 21.995 5.89995C21.9807 5.75543 21.9356 5.61997 21.8663 5.5002C21.7968 5.37946 21.7013 5.27194 21.5823 5.1869C21.5504 5.16399 21.517 5.14292 21.4825 5.12384C19.9665 4.25271 18.2486 3.79419 16.5 3.79419C14.9344 3.79419 13.3934 4.16174 12 4.8639C10.6066 4.16174 9.06557 3.79419 7.49998 3.79419C5.75136 3.79419 4.03343 4.25271 2.51752 5.12384C2.48254 5.14314 2.44884 5.16448 2.41658 5.18769C2.29807 5.2726 2.20294 5.3798 2.13367 5.50014C2.06439 5.61995 2.01926 5.75547 2.00491 5.90004ZM20 6.60044C18.9117 6.07096 17.7151 5.79419 16.5 5.79419C15.2848 5.79419 14.0882 6.07096 13 6.60044V17.4267C14.1153 17.01 15.3004 16.7942 16.5 16.7942C17.6995 16.7942 18.8846 17.01 20 17.4267V6.60044ZM11 6.60044V17.4267C9.88463 17.01 8.69953 16.7942 7.49998 16.7942C6.30044 16.7942 5.11534 17.01 3.99998 17.4267V6.60044C5.08824 6.07096 6.28485 5.79419 7.49998 5.79419C8.71512 5.79419 9.91173 6.07096 11 6.60044Z"})}),reports:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M7 4C6.73478 4 6.48043 4.10536 6.29289 4.29289C6.10536 4.48043 6 4.73478 6 5V19C6 19.2652 6.10536 19.5196 6.29289 19.7071C6.48043 19.8946 6.73478 20 7 20H17C17.2652 20 17.5196 19.8946 17.7071 19.7071C17.8946 19.5196 18 19.2652 18 19L18 9H15C14.4696 9 13.9609 8.78929 13.5858 8.41421C13.2107 8.03914 13 7.53043 13 7V4H7ZM15 5.41421L16.5858 7H15V5.41421ZM4.87868 2.87868C5.44129 2.31607 6.20435 2 7 2H14C14.2652 2 14.5196 2.10536 14.7071 2.29289L19.7071 7.29289C19.8946 7.48043 20 7.73478 20 8L20 19C20 19.7956 19.6839 20.5587 19.1213 21.1213C18.5587 21.6839 17.7957 22 17 22H7C6.20435 22 5.44129 21.6839 4.87868 21.1213C4.31607 20.5587 4 19.7956 4 19V5C4 4.20435 4.31607 3.44129 4.87868 2.87868ZM9 11C9.55229 11 10 11.4477 10 12V17C10 17.5523 9.55229 18 9 18C8.44772 18 8 17.5523 8 17V12C8 11.4477 8.44772 11 9 11ZM15 13C15.5523 13 16 13.4477 16 14V17C16 17.5523 15.5523 18 15 18C14.4477 18 14 17.5523 14 17V14C14 13.4477 14.4477 13 15 13ZM12 15C12.5523 15 13 15.4477 13 16V17C13 17.5523 12.5523 18 12 18C11.4477 18 11 17.5523 11 17V16C11 15.4477 11.4477 15 12 15Z"})}),unlock:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 16 17",...props,children:(0,jsx_runtime.jsx)("path",{d:"M8.00002 11.8332C8.35364 11.8332 8.69278 11.6927 8.94283 11.4426C9.19288 11.1926 9.33335 10.8535 9.33335 10.4998C9.33335 9.75984 8.73335 9.1665 8.00002 9.1665C7.6464 9.1665 7.30726 9.30698 7.05721 9.55703C6.80716 9.80708 6.66669 10.1462 6.66669 10.4998C6.66669 10.8535 6.80716 11.1926 7.05721 11.4426C7.30726 11.6927 7.6464 11.8332 8.00002 11.8332ZM12 5.83317C12.3536 5.83317 12.6928 5.97365 12.9428 6.2237C13.1929 6.47374 13.3334 6.81288 13.3334 7.1665V13.8332C13.3334 14.1868 13.1929 14.5259 12.9428 14.776C12.6928 15.026 12.3536 15.1665 12 15.1665H4.00002C3.6464 15.1665 3.30726 15.026 3.05721 14.776C2.80716 14.5259 2.66669 14.1868 2.66669 13.8332V7.1665C2.66669 6.4265 3.26669 5.83317 4.00002 5.83317H4.66669V4.49984C4.66669 3.61578 5.01788 2.76794 5.643 2.14281C6.26812 1.51769 7.11596 1.1665 8.00002 1.1665C8.43776 1.1665 8.87121 1.25272 9.27563 1.42024C9.68005 1.58775 10.0475 1.83329 10.357 2.14281C10.6666 2.45234 10.9121 2.81981 11.0796 3.22423C11.2471 3.62864 11.3334 4.0621 11.3334 4.49984V5.1665V5.83317H12ZM8.00002 2.49984C7.46959 2.49984 6.96088 2.71055 6.58581 3.08562C6.21073 3.4607 6.00002 3.9694 6.00002 4.49984V5.83317H10H11.3334V4.49984H10C10 3.9694 9.78931 3.4607 9.41423 3.08562C9.03916 2.71055 8.53045 2.49984 8.00002 2.49984Z"})}),"notification-outline":props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 24 24",...props,children:(0,jsx_runtime.jsx)("path",{className:"cl-icon-primary",fillRule:"evenodd",clipRule:"evenodd",d:"M12 2C10.3151 2 8.69922 2.66601 7.50781 3.85152C6.3164 5.03703 5.64708 6.64492 5.64708 8.32148C5.64708 11.2392 5.02018 13.0376 4.45284 14.0726C4.1677 14.5928 3.89179 14.9309 3.70379 15.1283C3.60952 15.2274 3.53661 15.2918 3.49474 15.3265C3.47429 15.3435 3.4612 15.3534 3.45662 15.3568C3.07888 15.6166 2.91199 16.09 3.04545 16.5286C3.18066 16.973 3.59226 17.2769 4.05884 17.2769H19.9412C20.4078 17.2769 20.8194 16.973 20.9546 16.5286C21.088 16.09 20.9212 15.6166 20.5434 15.3568C20.5388 15.3534 20.5258 15.3435 20.5053 15.3265C20.4634 15.2918 20.3905 15.2274 20.2962 15.1283C20.1082 14.9309 19.8323 14.5928 19.5472 14.0726C18.9798 13.0376 18.353 11.2392 18.353 8.32148C18.353 6.64492 17.6836 5.03703 16.4922 3.85152C15.3008 2.66601 13.6849 2 12 2ZM3.45662 15.3568L3.46228 15.3529L3.46643 15.3501L3.45662 15.3568ZM6.26293 15.1697H17.7371C17.7208 15.1407 17.7044 15.1114 17.6881 15.0816C16.9319 13.7022 16.2353 11.5497 16.2353 8.32148C16.2353 7.20377 15.7891 6.13184 14.9948 5.34151C14.2006 4.55117 13.1233 4.10716 12 4.10716C10.8767 4.10716 9.79948 4.55117 9.00521 5.34151C8.21094 6.13184 7.76472 7.20377 7.76472 8.32148C7.76472 11.5497 7.06809 13.7022 6.31191 15.0816C6.2956 15.1114 6.27927 15.1407 6.26293 15.1697ZM20.5285 15.3467L20.5299 15.3476C20.5299 15.3476 20.5285 15.3467 19.9412 16.2233L20.5285 15.3467ZM11.3895 19.2067C11.0961 18.7034 10.4481 18.5321 9.9423 18.824C9.43648 19.116 9.26429 19.7607 9.55771 20.2641C9.80591 20.6898 10.1622 21.0432 10.5908 21.2889C11.0194 21.5345 11.5054 21.6638 12.0001 21.6638C12.4947 21.6638 12.9807 21.5345 13.4093 21.2889C13.838 21.0432 14.1942 20.6898 14.4424 20.2641C14.7358 19.7607 14.5636 19.116 14.0578 18.824C13.552 18.5321 12.9041 18.7034 12.6106 19.2067C12.5486 19.3132 12.4595 19.4015 12.3524 19.4629C12.2452 19.5244 12.1237 19.5567 12.0001 19.5567C11.8764 19.5567 11.7549 19.5244 11.6477 19.4629C11.5406 19.4015 11.4515 19.3132 11.3895 19.2067Z"})}),"vote-ballot":props=>(0,jsx_runtime.jsx)(Icon_Svg,{width:"15",height:"17",viewBox:"0 0 15 17",...props,children:(0,jsx_runtime.jsx)("path",{d:"M1.38587 16.8334C1.00543 16.8334 0.679348 16.6904 0.407609 16.4045C0.13587 16.1185 0 15.7802 0 15.3896V11.3093L2.85326 8.08694L3.8519 9.11225L1.44701 11.7906H13.553L11.2908 9.1541L12.2894 8.12879L15 11.3093V15.3896C15 15.7802 14.8641 16.1185 14.5924 16.4045C14.3207 16.6904 13.9946 16.8334 13.6141 16.8334H1.38587ZM6.60326 10.2003L3.44429 6.95702C3.14538 6.65012 3.00951 6.31184 3.03668 5.94217C3.06386 5.57251 3.22011 5.2412 3.50543 4.94826L7.74456 0.595945C8.0163 0.316951 8.34239 0.173966 8.72283 0.166991C9.10326 0.160016 9.43614 0.303001 9.72147 0.595945L12.8804 3.86018C13.1522 4.12522 13.288 4.44607 13.288 4.82271C13.288 5.19935 13.1386 5.54112 12.8397 5.84801L8.60054 10.2003C8.3288 10.4793 8.00272 10.6258 7.62228 10.6397C7.24185 10.6537 6.90217 10.5072 6.60326 10.2003ZM11.7187 4.78086L8.74321 1.72587L4.5856 5.99449L7.56114 9.0704L11.7187 4.78086Z"})}),print:props=>(0,jsx_runtime.jsx)(Icon_Svg,{className:`cl-icon ${props.className?props.className:""}`,viewBox:"0 0 14 12",...props,children:(0,jsx_runtime.jsx)("path",{d:"M11.666 3.333H2.333c-1.107 0-2 .894-2 2v4H3V12h8V9.333h2.666v-4c0-1.106-.893-2-2-2Zm-2 7.334H4.333V7.333h5.333v3.334Zm2-4.667A.669.669 0 0 1 11 5.333c0-.366.3-.666.666-.666.367 0 .667.3.667.666 0 .367-.3.667-.667.667ZM11 0H3v2.667h8V0Z"})})},Icon=props=>icons[props.name](props),components_Icon=Icon;try{Icon.displayName="Icon",Icon.__docgenInfo={description:"",displayName:"Icon",props:{ariaHidden:{defaultValue:null,description:"",name:"ariaHidden",required:!1,type:{name:"boolean | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"enum",value:[{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"((string | Element) & (string | Element | undefined)) | undefined"}},viewBox:{defaultValue:null,description:"",name:"viewBox",required:!1,type:{name:"string | undefined"}},fill:{defaultValue:null,description:"",name:"fill",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}},"data-testid":{defaultValue:null,description:"",name:"data-testid",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Icon/index.tsx#Icon"]={docgenInfo:Icon.__docgenInfo,name:"Icon",path:"src/components/Icon/index.tsx#Icon"})}catch(__react_docgen_typescript_loader_error){}},"./node_modules/memoizerific sync recursive":module=>{function webpackEmptyContext(req){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/memoizerific sync recursive",module.exports=webpackEmptyContext}}]); +//# sourceMappingURL=621.3702e134.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/621.7c03b4d5.iframe.bundle.js.map b/docs/621.3702e134.iframe.bundle.js.map similarity index 99% rename from docs/621.7c03b4d5.iframe.bundle.js.map rename to docs/621.3702e134.iframe.bundle.js.map index b6bcb021d8b1..3951b28a9a63 100644 --- a/docs/621.7c03b4d5.iframe.bundle.js.map +++ b/docs/621.3702e134.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"621.7c03b4d5.iframe.bundle.js","mappings":";;AA2LA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAIA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAIA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAIA;AACA;;AAIA;ACjTA;AACA;AAGA;ACTA;;;AAKA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Box/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Icon/Svg.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Icon/index.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\n\ntype Overflow =\n | 'visible'\n | 'hidden'\n | 'scroll'\n | 'auto'\n | 'initial'\n | 'inherit';\n\ntype FlexContent =\n | 'flex-start'\n | 'flex-end'\n | 'center'\n | 'space-between'\n | 'space-around'\n | 'space-evenly'\n | 'initial'\n | 'inherit';\n\ntype FlexAlign =\n | 'flex-start'\n | 'flex-end'\n | 'center'\n | 'baseline'\n | 'stretch'\n | 'initial'\n | 'inherit';\n\nexport type BoxColorProps = {\n color?: string;\n bgColor?: string;\n opacity?: number;\n};\n\nexport type BoxBackgroundProps = {\n bg?: string;\n background?: string;\n};\n\nexport type BoxPaddingProps = {\n padding?: string;\n p?: string;\n paddingLeft?: string;\n pl?: string;\n paddingRight?: string;\n pr?: string;\n paddingTop?: string;\n pt?: string;\n paddingBottom?: string;\n pb?: string;\n paddingX?: string;\n px?: string;\n paddingY?: string;\n py?: string;\n};\n\nexport type BoxMarginProps = {\n margin?: string;\n m?: string;\n marginLeft?: string;\n ml?: string;\n marginRight?: string;\n mr?: string;\n marginTop?: string;\n mt?: string;\n marginBottom?: string;\n mb?: string;\n marginX?: string;\n mx?: string;\n marginY?: string;\n my?: string;\n};\n\nexport type BoxHeightProps = {\n height?: string;\n h?: string;\n maxHeight?: string;\n minHeight?: string;\n};\n\nexport type BoxWidthProps = {\n width?: string;\n w?: string;\n maxWidth?: string;\n minWidth?: string;\n};\n\nexport type BoxShadowProps = {\n boxShadow?: string;\n};\n\nexport type BoxDisplayProps = {\n display?:\n | 'block'\n | 'inline-block'\n | 'inline'\n | 'flex'\n | 'inline-flex'\n | 'none'\n | 'inherit';\n};\n\nexport type BoxOverflowProps = {\n overflow?: Overflow;\n overflowX?: Overflow;\n overflowY?: Overflow;\n};\n\nexport type BoxPositionProps = {\n position?: 'static' | 'relative' | 'fixed' | 'absolute' | 'sticky';\n top?: string;\n bottom?: string;\n left?: string;\n right?: string;\n};\n\nexport type BoxFlexProps = {\n flexDirection?:\n | 'row'\n | 'row-reverse'\n | 'column'\n | 'column-reverse'\n | 'initial'\n | 'inherit';\n flexWrap?: 'nowrap' | 'wrap' | 'wrap-reverse' | 'initial' | 'inherit';\n alignItems?: FlexAlign;\n justifyContent?: FlexContent;\n alignContent?: FlexContent;\n order?: number;\n flexGrow?: number;\n flexShrink?: number;\n flexBasis?: number;\n flex?: string;\n alignSelf?: 'auto' | FlexAlign;\n gap?: string;\n};\n\nexport type BoxBorderProps = {\n border?: string;\n borderTop?: string;\n borderBottom?: string;\n borderLeft?: string;\n borderRight?: string;\n borderColor?: string;\n borderWidth?: string;\n borderRadius?: string;\n borderStyle?:\n | 'dotted'\n | 'dashed'\n | 'solid'\n | 'double'\n | 'groove'\n | 'ridge'\n | 'inset'\n | 'outset'\n | 'none'\n | 'hidden'\n | 'initial';\n};\n\nexport type BoxVisibilityProps = {\n visibility?: 'visible' | 'hidden' | 'initial' | 'inherit';\n};\n\nexport type BoxZIndexProps = {\n zIndex?: string;\n};\n\nexport type BoxProps = BoxColorProps &\n BoxShadowProps &\n BoxBackgroundProps &\n BoxPaddingProps &\n BoxMarginProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxPositionProps &\n BoxFlexProps &\n BoxBorderProps &\n BoxVisibilityProps &\n BoxZIndexProps &\n React.HTMLAttributes;\n\nconst Box = styled.div`\n // colors and background\n ${(props) => css`\n ${props.color ? `color: ${props.color}` : ''};\n ${props.bgColor ? `background-color: ${props.bgColor}` : ''};\n ${props.background ? `background: ${props.background}` : ''};\n ${props.bg ? `background: ${props.bg}` : ''};\n ${typeof props.opacity === 'number' ? `opacity: ${props.opacity}` : ''};\n `}\n\n // shadow\n ${(props) => css`\n ${props.boxShadow ? `box-shadow: ${props.boxShadow}` : ''};\n `}\n\n // padding\n ${(props) => css`\n ${props.padding ? `padding: ${props.padding}` : ''};\n ${props.p ? `padding: ${props.p}` : ''};\n\n // top\n ${props.paddingY ? `padding-top: ${props.paddingY}` : ''};\n ${props.py ? `padding-top: ${props.py}` : ''};\n ${props.paddingTop ? `padding-top: ${props.paddingTop}` : ''};\n ${props.pt ? `padding-top: ${props.pt}` : ''};\n\n // bottom\n ${props.paddingY ? `padding-bottom: ${props.paddingY}` : ''};\n ${props.py ? `padding-bottom: ${props.py}` : ''};\n ${props.paddingBottom ? `padding-bottom: ${props.paddingBottom}` : ''};\n ${props.pb ? `padding-bottom: ${props.pb}` : ''};\n\n // left\n ${props.paddingX ? `padding-left: ${props.paddingX}` : ''};\n ${props.px ? `padding-left: ${props.px}` : ''};\n ${props.paddingLeft ? `padding-left: ${props.paddingLeft}` : ''};\n ${props.pl ? `padding-left: ${props.pl}` : ''};\n\n // right\n ${props.paddingX ? `padding-right: ${props.paddingX}` : ''};\n ${props.px ? `padding-right: ${props.px}` : ''};\n ${props.paddingRight ? `padding-right: ${props.paddingRight}` : ''};\n ${props.pr ? `padding-right: ${props.pr}` : ''};\n `}\n \n // margin\n ${(props) => css`\n ${props.margin ? `margin: ${props.margin}` : ''};\n ${props.m ? `margin: ${props.m}` : ''};\n\n // top\n ${props.marginY ? `margin-top: ${props.marginY}` : ''};\n ${props.my ? `margin-top: ${props.my}` : ''};\n ${props.marginTop ? `margin-top: ${props.marginTop}` : ''};\n ${props.mt ? `margin-top: ${props.mt}` : ''};\n\n // bottom\n ${props.marginY ? `margin-bottom: ${props.marginY}` : ''};\n ${props.my ? `margin-bottom: ${props.my}` : ''};\n ${props.marginBottom ? `margin-bottom: ${props.marginBottom}` : ''};\n ${props.mb ? `margin-bottom: ${props.mb}` : ''};\n\n // left\n ${props.marginX ? `margin-left: ${props.marginX}` : ''};\n ${props.mx ? `margin-left: ${props.mx}` : ''};\n ${props.marginLeft ? `margin-left: ${props.marginLeft}` : ''};\n ${props.ml ? `margin-left: ${props.ml}` : ''};\n\n // right\n ${props.marginX ? `margin-right: ${props.marginX}` : ''};\n ${props.mx ? `margin-right: ${props.mx}` : ''};\n ${props.marginRight ? `margin-right: ${props.marginRight}` : ''};\n ${props.mr ? `margin-right: ${props.mr}` : ''};\n `}\n\n // height\n ${(props) => css`\n ${props.height ? `height: ${props.height}` : ''};\n ${props.h ? `height: ${props.h}` : ''};\n ${props.maxHeight ? `max-height: ${props.maxHeight}` : ''};\n ${props.minHeight ? `min-height: ${props.minHeight}` : ''};\n `}\n \n // width\n ${(props) => css`\n ${props.width ? `width: ${props.width}` : ''};\n ${props.w ? `width: ${props.w}` : ''};\n ${props.maxWidth ? `max-width: ${props.maxWidth}` : ''};\n ${props.minWidth ? `min-width: ${props.minWidth}` : ''};\n `}\n \n // display\n ${(props) => css`\n ${props.display ? `display: ${props.display}` : ''};\n `}\n\n // overflow\n ${(props) => css`\n ${props.overflow ? `overflow: ${props.overflow}` : ''};\n ${props.overflowX ? `overflow-x: ${props.overflowX}` : ''};\n ${props.overflowY ? `overflow-y: ${props.overflowY}` : ''};\n `}\n\n // position\n ${(props) => css`\n ${props.position ? `position: ${props.position}` : ''};\n ${props.left ? `left: ${props.left}` : ''};\n ${props.right ? `right: ${props.right}` : ''};\n ${props.top ? `top: ${props.top}` : ''};\n ${props.bottom ? `bottom: ${props.bottom}` : ''};\n `}\n\n // flex\n ${(props) => css`\n ${props.flexDirection ? `flex-direction: ${props.flexDirection}` : ''};\n ${props.flexWrap ? `flex-wrap: ${props.flexWrap}` : ''};\n ${props.justifyContent ? `justify-content: ${props.justifyContent}` : ''};\n ${props.alignItems ? `align-items: ${props.alignItems}` : ''};\n ${props.alignContent ? `align-content: ${props.alignContent}` : ''};\n ${props.order ? `order: ${props.order}` : ''};\n ${props.flexGrow ? `flex-grow: ${props.flexGrow}` : ''};\n ${props.flexShrink ? `flex-shrink: ${props.flexShrink}` : ''};\n ${props.flexBasis ? `flex-basis: ${props.flexBasis}` : ''};\n ${props.flex ? `flex: ${props.flex}` : ''};\n ${props.alignSelf ? `align-self: ${props.alignSelf}` : ''};\n ${props.gap ? `gap: ${props.gap}` : ''};\n `}\n\n // border\n ${(props) => css`\n ${props.border ? `border: ${props.border}` : ''};\n ${props.borderTop ? `border-top: ${props.borderTop}` : ''};\n ${props.borderLeft ? `border-left: ${props.borderLeft}` : ''};\n ${props.borderRight ? `border-right: ${props.borderRight}` : ''};\n ${props.borderBottom ? `border-bottom: ${props.borderBottom}` : ''};\n ${props.borderWidth ? `border-width: ${props.borderWidth}` : ''};\n ${props.borderStyle ? `border-style: ${props.borderStyle}` : ''};\n ${props.borderRadius ? `border-radius: ${props.borderRadius}` : ''};\n ${props.borderColor ? `border-color: ${props.borderColor}` : ''};\n `}\n\n // visibility\n ${(props) => css`\n ${props.visibility ? `visibility: ${props.visibility}` : ''};\n `}\n\n // z-index\n ${(props) => css`\n ${props.zIndex ? `z-index: ${props.zIndex}` : ''};\n `}\n`;\n\nexport default Box;\n","import React from 'react';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\n\nimport styled from 'styled-components';\n\nexport type SvgProps = {\n className?: string;\n children?: JSX.Element | JSX.Element[];\n name: string;\n // if ariaHidden is not specified (or false), a title is 'required' (for a11y)\n title?: string | JSX.Element;\n viewBox?: string;\n fill?: string;\n ariaHidden?: boolean;\n height?: string;\n width?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst StyledBox = styled(Box)<{ fill?: string; transform?: string }>`\n fill: ${({ fill }) => fill};\n ${({ transform }) => transform && `transform: ${transform};`}\n`;\n\nconst Svg = ({\n className,\n children,\n title,\n viewBox,\n fill = '#000',\n ariaHidden = true,\n height = '24px',\n width = '24px',\n transform,\n ...rest\n}: SvgProps) => {\n return (\n \n {title && {title}}\n {children}\n \n );\n};\n\nexport default Svg;\n","import React from 'react';\nimport Svg, { SvgProps } from './Svg';\nimport styled from 'styled-components';\nimport { isRtl } from '../../utils/styleUtils';\n\nexport type IconNames = keyof typeof icons;\n\ntype ariaHiddenTrue = {\n ariaHidden?: true;\n};\n\ntype ariaHiddenFalse = {\n ariaHidden: false;\n title: string | JSX.Element;\n};\n\ntype ariaHiddenProps = ariaHiddenTrue | ariaHiddenFalse;\n\ntype IconPropsWithoutName = ariaHiddenProps &\n SvgProps & {\n className?: string;\n 'data-testid'?: string;\n };\n\nexport type IconProps = IconPropsWithoutName & { name: IconNames };\n\nconst MirrorOnRtlSvg = styled(Svg)`\n ${isRtl`\n transform: rotate(180deg);\n `}\n`;\n\nexport const icons = {\n close: (props: IconPropsWithoutName) => (\n \n \n \n ),\n copy: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'upload-image': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'upload-file': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'alert-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n check: (props: IconPropsWithoutName) => (\n \n \n \n ),\n halt: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-right': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-down': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-up': (props: IconPropsWithoutName) => (\n \n \n \n ),\n plus: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'plus-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n delete: (props: IconPropsWithoutName) => (\n \n \n \n ),\n edit: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'vote-up': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'vote-down': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-right': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-left': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-up': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-down': (props: IconPropsWithoutName) => (\n \n \n \n ),\n idea: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-input-manager': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n ),\n 'sidebar-proposals': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'user-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n notification: (props: IconPropsWithoutName) => (\n \n \n \n ),\n search: (props: IconPropsWithoutName) => (\n \n \n \n ),\n lock: (props: IconPropsWithoutName) => (\n \n \n \n ),\n facebook: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'facebook-messenger': (props: IconPropsWithoutName) => (\n \n \n \n ),\n twitter: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'microsoft-windows': (props: IconPropsWithoutName) => (\n \n \n \n ),\n google: (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n hoplr: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n comment: (props: IconPropsWithoutName) => (\n \n \n \n ),\n comments: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'info-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'calendar-range': (props: IconPropsWithoutName) => (\n \n \n \n ),\n calendar: (props: IconPropsWithoutName) => (\n \n \n \n ),\n power: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'shield-checkered': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-settings': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n send: (props: IconPropsWithoutName) => (\n \n \n \n ),\n group: (props: IconPropsWithoutName) => (\n \n \n \n ),\n building: (props: IconPropsWithoutName) => (\n \n \n \n ),\n position: (props: IconPropsWithoutName) => (\n \n \n \n ),\n mention: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'dots-horizontal': (props: IconPropsWithoutName) => (\n \n \n \n ),\n map: (props: IconPropsWithoutName) => (\n \n \n \n ),\n gps: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'location-simple': (props: IconPropsWithoutName) => (\n \n \n \n ),\n timeline: (props: IconPropsWithoutName) => (\n \n \n \n ),\n survey: (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n ),\n download: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'user-check': (props: IconPropsWithoutName) => (\n \n \n \n ),\n label: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-left': (props: IconPropsWithoutName) => (\n \n \n \n ),\n\n 'shield-check': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-pages-menu': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n ),\n 'email-2': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'minus-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-guide': (props: IconPropsWithoutName) => (\n \n \n \n ),\n paperclip: (props: IconPropsWithoutName) => (\n \n \n \n ),\n code: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'question-bubble': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'question-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n refresh: (props: IconPropsWithoutName) => (\n \n \n \n ),\n translate: (props: IconPropsWithoutName) => (\n \n \n \n ),\n share: (props: IconPropsWithoutName) => (\n \n \n \n ),\n flash: (props: IconPropsWithoutName) => (\n \n \n \n ),\n database: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'folder-move': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'user-data': (props: IconPropsWithoutName) => (\n \n \n \n ),\n settings: (props: IconPropsWithoutName) => (\n \n \n \n ),\n initiatives: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-folder': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n 'folder-add': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-activity': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n \n ),\n 'sidebar-workshops': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'sidebar-users': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n ),\n 'sidebar-dashboards': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n ),\n 'chart-bar': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-invitations': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n ),\n 'sidebar-messaging': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n 'sidebar-academy': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n ),\n email: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'money-bag': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n home: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'info-solid': (props: IconPropsWithoutName) => (\n \n \n \n ),\n dot: (props: IconPropsWithoutName) => (\n \n \n \n ),\n pen: (props: IconPropsWithoutName) => (\n \n \n \n \n \n ),\n 'cl-favicon': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n filter: (props: IconPropsWithoutName) => (\n \n \n \n ),\n clock: (props: IconPropsWithoutName) => (\n \n \n \n ),\n bullseye: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'email-check': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'check-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n template: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'blank-paper': (props: IconPropsWithoutName) => (\n \n \n \n ),\n list: (props: IconPropsWithoutName) => (\n \n \n \n ),\n menu: (props: IconPropsWithoutName) => (\n \n \n \n ),\n link: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'participation-level': (props: IconPropsWithoutName) => (\n \n \n \n ),\n key: (props: IconPropsWithoutName) => (\n \n \n \n ),\n minus: (props: IconPropsWithoutName) => (\n \n \n \n ),\n inbox: (props: IconPropsWithoutName) => (\n \n \n \n ),\n bookmark: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'bookmark-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n eye: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'eye-off': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'open-in-new': (props: IconPropsWithoutName) => (\n \n \n \n ),\n file: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'file-add': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'folder-solid': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'folder-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n flag: (props: IconPropsWithoutName) => (\n \n \n \n ),\n user: (props: IconPropsWithoutName) => (\n \n \n \n ),\n basket: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'basket-plus': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'basket-minus': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'basket-checkmark': (props: IconPropsWithoutName) => (\n \n \n \n ),\n volunteer: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'volunteer-off': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'cl-logo': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n ),\n 'arrow-left-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n whatsapp: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-reporting': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n 'alert-octagon': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'alert-octagon-off': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'filter-2': (props: IconPropsWithoutName) => (\n \n \n \n ),\n categories: (props: IconPropsWithoutName) => (\n \n \n \n ),\n token: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'coin-stack': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ),\n image: (props: IconPropsWithoutName) => (\n \n \n \n ),\n accordion: (props: IconPropsWithoutName) => (\n \n \n \n \n \n ),\n 'layout-1column': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'layout-2column-1': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'layout-3column': (props: IconPropsWithoutName) => (\n \n \n \n \n \n ),\n 'layout-2column-3': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'layout-2column-2': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n text: (props: IconPropsWithoutName) => (\n \n \n \n ),\n message: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'layout-white-space': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'section-info-accordion': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n ),\n 'section-image-text': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n ),\n button: (props: IconPropsWithoutName) => (\n \n \n \n ),\n tablet: (props: IconPropsWithoutName) => (\n \n \n \n ),\n desktop: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-number-field': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n sort: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n page: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-short-answer': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-long-answer': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-linear-scale': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-multiple-choice': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-long-answer-2': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'survey-short-answer-2': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-multiple-choice-2': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n ),\n 'survey-single-choice': (props: IconPropsWithoutName) => (\n \n \n \n ),\n section: (props: IconPropsWithoutName) => (\n \n \n \n ),\n rectangle: (props: IconPropsWithoutName) => (\n \n \n \n ),\n line: (props: IconPropsWithoutName) => (\n \n \n \n ),\n logic: (props: IconPropsWithoutName) => (\n \n \n \n ),\n save: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n grid: (props: IconPropsWithoutName) => (\n \n \n \n ),\n projects: (props: IconPropsWithoutName) => (\n \n \n \n ),\n messages: (props: IconPropsWithoutName) => (\n \n \n \n ),\n users: (props: IconPropsWithoutName) => (\n \n \n \n ),\n proposals: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'messages-inbox': (props: IconPropsWithoutName) => (\n \n \n \n ),\n dashboard: (props: IconPropsWithoutName) => (\n \n \n \n ),\n help: (props: IconPropsWithoutName) => (\n \n \n \n ),\n cog: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n organigram: (props: IconPropsWithoutName) => (\n \n \n \n ),\n community: (props: IconPropsWithoutName) => (\n \n \n \n ),\n academy: (props: IconPropsWithoutName) => (\n \n \n \n ),\n book: (props: IconPropsWithoutName) => (\n \n \n \n ),\n reports: (props: IconPropsWithoutName) => (\n \n \n \n ),\n unlock: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'notification-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'vote-ballot': (props: IconPropsWithoutName) => (\n \n \n \n ),\n} as const;\n\nconst Icon = (props: IconProps) => {\n return icons[props.name](props);\n};\n\nexport default Icon;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"621.3702e134.iframe.bundle.js","mappings":";;AA2LA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAIA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAIA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAIA;AACA;;AAIA;ACjTA;AACA;AAGA;ACTA;;;AAKA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Box/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Icon/Svg.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Icon/index.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\n\ntype Overflow =\n | 'visible'\n | 'hidden'\n | 'scroll'\n | 'auto'\n | 'initial'\n | 'inherit';\n\ntype FlexContent =\n | 'flex-start'\n | 'flex-end'\n | 'center'\n | 'space-between'\n | 'space-around'\n | 'space-evenly'\n | 'initial'\n | 'inherit';\n\ntype FlexAlign =\n | 'flex-start'\n | 'flex-end'\n | 'center'\n | 'baseline'\n | 'stretch'\n | 'initial'\n | 'inherit';\n\nexport type BoxColorProps = {\n color?: string;\n bgColor?: string;\n opacity?: number;\n};\n\nexport type BoxBackgroundProps = {\n bg?: string;\n background?: string;\n};\n\nexport type BoxPaddingProps = {\n padding?: string;\n p?: string;\n paddingLeft?: string;\n pl?: string;\n paddingRight?: string;\n pr?: string;\n paddingTop?: string;\n pt?: string;\n paddingBottom?: string;\n pb?: string;\n paddingX?: string;\n px?: string;\n paddingY?: string;\n py?: string;\n};\n\nexport type BoxMarginProps = {\n margin?: string;\n m?: string;\n marginLeft?: string;\n ml?: string;\n marginRight?: string;\n mr?: string;\n marginTop?: string;\n mt?: string;\n marginBottom?: string;\n mb?: string;\n marginX?: string;\n mx?: string;\n marginY?: string;\n my?: string;\n};\n\nexport type BoxHeightProps = {\n height?: string;\n h?: string;\n maxHeight?: string;\n minHeight?: string;\n};\n\nexport type BoxWidthProps = {\n width?: string;\n w?: string;\n maxWidth?: string;\n minWidth?: string;\n};\n\nexport type BoxShadowProps = {\n boxShadow?: string;\n};\n\nexport type BoxDisplayProps = {\n display?:\n | 'block'\n | 'inline-block'\n | 'inline'\n | 'flex'\n | 'inline-flex'\n | 'none'\n | 'inherit';\n};\n\nexport type BoxOverflowProps = {\n overflow?: Overflow;\n overflowX?: Overflow;\n overflowY?: Overflow;\n};\n\nexport type BoxPositionProps = {\n position?: 'static' | 'relative' | 'fixed' | 'absolute' | 'sticky';\n top?: string;\n bottom?: string;\n left?: string;\n right?: string;\n};\n\nexport type BoxFlexProps = {\n flexDirection?:\n | 'row'\n | 'row-reverse'\n | 'column'\n | 'column-reverse'\n | 'initial'\n | 'inherit';\n flexWrap?: 'nowrap' | 'wrap' | 'wrap-reverse' | 'initial' | 'inherit';\n alignItems?: FlexAlign;\n justifyContent?: FlexContent;\n alignContent?: FlexContent;\n order?: number;\n flexGrow?: number;\n flexShrink?: number;\n flexBasis?: number;\n flex?: string;\n alignSelf?: 'auto' | FlexAlign;\n gap?: string;\n};\n\nexport type BoxBorderProps = {\n border?: string;\n borderTop?: string;\n borderBottom?: string;\n borderLeft?: string;\n borderRight?: string;\n borderColor?: string;\n borderWidth?: string;\n borderRadius?: string;\n borderStyle?:\n | 'dotted'\n | 'dashed'\n | 'solid'\n | 'double'\n | 'groove'\n | 'ridge'\n | 'inset'\n | 'outset'\n | 'none'\n | 'hidden'\n | 'initial';\n};\n\nexport type BoxVisibilityProps = {\n visibility?: 'visible' | 'hidden' | 'initial' | 'inherit';\n};\n\nexport type BoxZIndexProps = {\n zIndex?: string;\n};\n\nexport type BoxProps = BoxColorProps &\n BoxShadowProps &\n BoxBackgroundProps &\n BoxPaddingProps &\n BoxMarginProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxPositionProps &\n BoxFlexProps &\n BoxBorderProps &\n BoxVisibilityProps &\n BoxZIndexProps &\n React.HTMLAttributes;\n\nconst Box = styled.div`\n // colors and background\n ${(props) => css`\n ${props.color ? `color: ${props.color}` : ''};\n ${props.bgColor ? `background-color: ${props.bgColor}` : ''};\n ${props.background ? `background: ${props.background}` : ''};\n ${props.bg ? `background: ${props.bg}` : ''};\n ${typeof props.opacity === 'number' ? `opacity: ${props.opacity}` : ''};\n `}\n\n // shadow\n ${(props) => css`\n ${props.boxShadow ? `box-shadow: ${props.boxShadow}` : ''};\n `}\n\n // padding\n ${(props) => css`\n ${props.padding ? `padding: ${props.padding}` : ''};\n ${props.p ? `padding: ${props.p}` : ''};\n\n // top\n ${props.paddingY ? `padding-top: ${props.paddingY}` : ''};\n ${props.py ? `padding-top: ${props.py}` : ''};\n ${props.paddingTop ? `padding-top: ${props.paddingTop}` : ''};\n ${props.pt ? `padding-top: ${props.pt}` : ''};\n\n // bottom\n ${props.paddingY ? `padding-bottom: ${props.paddingY}` : ''};\n ${props.py ? `padding-bottom: ${props.py}` : ''};\n ${props.paddingBottom ? `padding-bottom: ${props.paddingBottom}` : ''};\n ${props.pb ? `padding-bottom: ${props.pb}` : ''};\n\n // left\n ${props.paddingX ? `padding-left: ${props.paddingX}` : ''};\n ${props.px ? `padding-left: ${props.px}` : ''};\n ${props.paddingLeft ? `padding-left: ${props.paddingLeft}` : ''};\n ${props.pl ? `padding-left: ${props.pl}` : ''};\n\n // right\n ${props.paddingX ? `padding-right: ${props.paddingX}` : ''};\n ${props.px ? `padding-right: ${props.px}` : ''};\n ${props.paddingRight ? `padding-right: ${props.paddingRight}` : ''};\n ${props.pr ? `padding-right: ${props.pr}` : ''};\n `}\n \n // margin\n ${(props) => css`\n ${props.margin ? `margin: ${props.margin}` : ''};\n ${props.m ? `margin: ${props.m}` : ''};\n\n // top\n ${props.marginY ? `margin-top: ${props.marginY}` : ''};\n ${props.my ? `margin-top: ${props.my}` : ''};\n ${props.marginTop ? `margin-top: ${props.marginTop}` : ''};\n ${props.mt ? `margin-top: ${props.mt}` : ''};\n\n // bottom\n ${props.marginY ? `margin-bottom: ${props.marginY}` : ''};\n ${props.my ? `margin-bottom: ${props.my}` : ''};\n ${props.marginBottom ? `margin-bottom: ${props.marginBottom}` : ''};\n ${props.mb ? `margin-bottom: ${props.mb}` : ''};\n\n // left\n ${props.marginX ? `margin-left: ${props.marginX}` : ''};\n ${props.mx ? `margin-left: ${props.mx}` : ''};\n ${props.marginLeft ? `margin-left: ${props.marginLeft}` : ''};\n ${props.ml ? `margin-left: ${props.ml}` : ''};\n\n // right\n ${props.marginX ? `margin-right: ${props.marginX}` : ''};\n ${props.mx ? `margin-right: ${props.mx}` : ''};\n ${props.marginRight ? `margin-right: ${props.marginRight}` : ''};\n ${props.mr ? `margin-right: ${props.mr}` : ''};\n `}\n\n // height\n ${(props) => css`\n ${props.height ? `height: ${props.height}` : ''};\n ${props.h ? `height: ${props.h}` : ''};\n ${props.maxHeight ? `max-height: ${props.maxHeight}` : ''};\n ${props.minHeight ? `min-height: ${props.minHeight}` : ''};\n `}\n \n // width\n ${(props) => css`\n ${props.width ? `width: ${props.width}` : ''};\n ${props.w ? `width: ${props.w}` : ''};\n ${props.maxWidth ? `max-width: ${props.maxWidth}` : ''};\n ${props.minWidth ? `min-width: ${props.minWidth}` : ''};\n `}\n \n // display\n ${(props) => css`\n ${props.display ? `display: ${props.display}` : ''};\n `}\n\n // overflow\n ${(props) => css`\n ${props.overflow ? `overflow: ${props.overflow}` : ''};\n ${props.overflowX ? `overflow-x: ${props.overflowX}` : ''};\n ${props.overflowY ? `overflow-y: ${props.overflowY}` : ''};\n `}\n\n // position\n ${(props) => css`\n ${props.position ? `position: ${props.position}` : ''};\n ${props.left ? `left: ${props.left}` : ''};\n ${props.right ? `right: ${props.right}` : ''};\n ${props.top ? `top: ${props.top}` : ''};\n ${props.bottom ? `bottom: ${props.bottom}` : ''};\n `}\n\n // flex\n ${(props) => css`\n ${props.flexDirection ? `flex-direction: ${props.flexDirection}` : ''};\n ${props.flexWrap ? `flex-wrap: ${props.flexWrap}` : ''};\n ${props.justifyContent ? `justify-content: ${props.justifyContent}` : ''};\n ${props.alignItems ? `align-items: ${props.alignItems}` : ''};\n ${props.alignContent ? `align-content: ${props.alignContent}` : ''};\n ${props.order ? `order: ${props.order}` : ''};\n ${props.flexGrow ? `flex-grow: ${props.flexGrow}` : ''};\n ${props.flexShrink ? `flex-shrink: ${props.flexShrink}` : ''};\n ${props.flexBasis ? `flex-basis: ${props.flexBasis}` : ''};\n ${props.flex ? `flex: ${props.flex}` : ''};\n ${props.alignSelf ? `align-self: ${props.alignSelf}` : ''};\n ${props.gap ? `gap: ${props.gap}` : ''};\n `}\n\n // border\n ${(props) => css`\n ${props.border ? `border: ${props.border}` : ''};\n ${props.borderTop ? `border-top: ${props.borderTop}` : ''};\n ${props.borderLeft ? `border-left: ${props.borderLeft}` : ''};\n ${props.borderRight ? `border-right: ${props.borderRight}` : ''};\n ${props.borderBottom ? `border-bottom: ${props.borderBottom}` : ''};\n ${props.borderWidth ? `border-width: ${props.borderWidth}` : ''};\n ${props.borderStyle ? `border-style: ${props.borderStyle}` : ''};\n ${props.borderRadius ? `border-radius: ${props.borderRadius}` : ''};\n ${props.borderColor ? `border-color: ${props.borderColor}` : ''};\n `}\n\n // visibility\n ${(props) => css`\n ${props.visibility ? `visibility: ${props.visibility}` : ''};\n `}\n\n // z-index\n ${(props) => css`\n ${props.zIndex ? `z-index: ${props.zIndex}` : ''};\n `}\n`;\n\nexport default Box;\n","import React from 'react';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\n\nimport styled from 'styled-components';\n\nexport type SvgProps = {\n className?: string;\n children?: JSX.Element | JSX.Element[];\n name: string;\n // if ariaHidden is not specified (or false), a title is 'required' (for a11y)\n title?: string | JSX.Element;\n viewBox?: string;\n fill?: string;\n ariaHidden?: boolean;\n height?: string;\n width?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst StyledBox = styled(Box)<{ fill?: string; transform?: string }>`\n fill: ${({ fill }) => fill};\n ${({ transform }) => transform && `transform: ${transform};`}\n`;\n\nconst Svg = ({\n className,\n children,\n title,\n viewBox,\n fill = '#000',\n ariaHidden = true,\n height = '24px',\n width = '24px',\n transform,\n ...rest\n}: SvgProps) => {\n return (\n \n {title && {title}}\n {children}\n \n );\n};\n\nexport default Svg;\n","import React from 'react';\nimport Svg, { SvgProps } from './Svg';\nimport styled from 'styled-components';\nimport { isRtl } from '../../utils/styleUtils';\n\nexport type IconNames = keyof typeof icons;\n\ntype ariaHiddenTrue = {\n ariaHidden?: true;\n};\n\ntype ariaHiddenFalse = {\n ariaHidden: false;\n title: string | JSX.Element;\n};\n\ntype ariaHiddenProps = ariaHiddenTrue | ariaHiddenFalse;\n\ntype IconPropsWithoutName = ariaHiddenProps &\n SvgProps & {\n className?: string;\n 'data-testid'?: string;\n };\n\nexport type IconProps = IconPropsWithoutName & { name: IconNames };\n\nconst MirrorOnRtlSvg = styled(Svg)`\n ${isRtl`\n transform: rotate(180deg);\n `}\n`;\n\nexport const icons = {\n close: (props: IconPropsWithoutName) => (\n \n \n \n ),\n copy: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'upload-image': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'upload-file': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'alert-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n check: (props: IconPropsWithoutName) => (\n \n \n \n ),\n halt: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-right': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-down': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-up': (props: IconPropsWithoutName) => (\n \n \n \n ),\n plus: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'plus-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n delete: (props: IconPropsWithoutName) => (\n \n \n \n ),\n edit: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'vote-up': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'vote-down': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-right': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-left': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-up': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'chevron-down': (props: IconPropsWithoutName) => (\n \n \n \n ),\n idea: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-input-manager': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n ),\n 'sidebar-proposals': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'user-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n notification: (props: IconPropsWithoutName) => (\n \n \n \n ),\n search: (props: IconPropsWithoutName) => (\n \n \n \n ),\n lock: (props: IconPropsWithoutName) => (\n \n \n \n ),\n facebook: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'facebook-messenger': (props: IconPropsWithoutName) => (\n \n \n \n ),\n twitter: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'microsoft-windows': (props: IconPropsWithoutName) => (\n \n \n \n ),\n google: (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n hoplr: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n comment: (props: IconPropsWithoutName) => (\n \n \n \n ),\n comments: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'info-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'calendar-range': (props: IconPropsWithoutName) => (\n \n \n \n ),\n calendar: (props: IconPropsWithoutName) => (\n \n \n \n ),\n power: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'shield-checkered': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-settings': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n send: (props: IconPropsWithoutName) => (\n \n \n \n ),\n group: (props: IconPropsWithoutName) => (\n \n \n \n ),\n building: (props: IconPropsWithoutName) => (\n \n \n \n ),\n position: (props: IconPropsWithoutName) => (\n \n \n \n ),\n mention: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'dots-horizontal': (props: IconPropsWithoutName) => (\n \n \n \n ),\n map: (props: IconPropsWithoutName) => (\n \n \n \n ),\n gps: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'location-simple': (props: IconPropsWithoutName) => (\n \n \n \n ),\n timeline: (props: IconPropsWithoutName) => (\n \n \n \n ),\n survey: (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n ),\n download: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'user-check': (props: IconPropsWithoutName) => (\n \n \n \n ),\n label: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'arrow-left': (props: IconPropsWithoutName) => (\n \n \n \n ),\n\n 'shield-check': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-pages-menu': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n ),\n 'email-2': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'minus-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-guide': (props: IconPropsWithoutName) => (\n \n \n \n ),\n paperclip: (props: IconPropsWithoutName) => (\n \n \n \n ),\n code: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'question-bubble': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'question-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n refresh: (props: IconPropsWithoutName) => (\n \n \n \n ),\n translate: (props: IconPropsWithoutName) => (\n \n \n \n ),\n share: (props: IconPropsWithoutName) => (\n \n \n \n ),\n flash: (props: IconPropsWithoutName) => (\n \n \n \n ),\n database: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'folder-move': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'user-data': (props: IconPropsWithoutName) => (\n \n \n \n ),\n settings: (props: IconPropsWithoutName) => (\n \n \n \n ),\n initiatives: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-folder': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n 'folder-add': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-activity': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n \n ),\n 'sidebar-workshops': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'sidebar-users': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n ),\n 'sidebar-dashboards': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n ),\n 'chart-bar': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-invitations': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n ),\n 'sidebar-messaging': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n 'sidebar-academy': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n ),\n email: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'money-bag': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n home: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'info-solid': (props: IconPropsWithoutName) => (\n \n \n \n ),\n dot: (props: IconPropsWithoutName) => (\n \n \n \n ),\n pen: (props: IconPropsWithoutName) => (\n \n \n \n \n \n ),\n 'cl-favicon': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n filter: (props: IconPropsWithoutName) => (\n \n \n \n ),\n clock: (props: IconPropsWithoutName) => (\n \n \n \n ),\n bullseye: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'email-check': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'check-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n template: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'blank-paper': (props: IconPropsWithoutName) => (\n \n \n \n ),\n list: (props: IconPropsWithoutName) => (\n \n \n \n ),\n menu: (props: IconPropsWithoutName) => (\n \n \n \n ),\n link: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'participation-level': (props: IconPropsWithoutName) => (\n \n \n \n ),\n key: (props: IconPropsWithoutName) => (\n \n \n \n ),\n minus: (props: IconPropsWithoutName) => (\n \n \n \n ),\n inbox: (props: IconPropsWithoutName) => (\n \n \n \n ),\n bookmark: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'bookmark-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n eye: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'eye-off': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'open-in-new': (props: IconPropsWithoutName) => (\n \n \n \n ),\n file: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'file-add': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'folder-solid': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'folder-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n flag: (props: IconPropsWithoutName) => (\n \n \n \n ),\n user: (props: IconPropsWithoutName) => (\n \n \n \n ),\n basket: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'basket-plus': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'basket-minus': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'basket-checkmark': (props: IconPropsWithoutName) => (\n \n \n \n ),\n volunteer: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'volunteer-off': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'cl-logo': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n ),\n 'arrow-left-circle': (props: IconPropsWithoutName) => (\n \n \n \n ),\n whatsapp: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'sidebar-reporting': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n ),\n 'alert-octagon': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'alert-octagon-off': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'filter-2': (props: IconPropsWithoutName) => (\n \n \n \n ),\n categories: (props: IconPropsWithoutName) => (\n \n \n \n ),\n token: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'coin-stack': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ),\n image: (props: IconPropsWithoutName) => (\n \n \n \n ),\n accordion: (props: IconPropsWithoutName) => (\n \n \n \n \n \n ),\n 'layout-1column': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'layout-2column-1': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'layout-3column': (props: IconPropsWithoutName) => (\n \n \n \n \n \n ),\n 'layout-2column-3': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'layout-2column-2': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n text: (props: IconPropsWithoutName) => (\n \n \n \n ),\n message: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'layout-white-space': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'section-info-accordion': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n ),\n 'section-image-text': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n ),\n button: (props: IconPropsWithoutName) => (\n \n \n \n ),\n tablet: (props: IconPropsWithoutName) => (\n \n \n \n ),\n desktop: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-number-field': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n sort: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n page: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-short-answer': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-long-answer': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-linear-scale': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-multiple-choice': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-long-answer-2': (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n 'survey-short-answer-2': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'survey-multiple-choice-2': (props: IconPropsWithoutName) => (\n \n \n \n \n \n \n \n \n \n \n ),\n 'survey-single-choice': (props: IconPropsWithoutName) => (\n \n \n \n ),\n section: (props: IconPropsWithoutName) => (\n \n \n \n ),\n rectangle: (props: IconPropsWithoutName) => (\n \n \n \n ),\n line: (props: IconPropsWithoutName) => (\n \n \n \n ),\n logic: (props: IconPropsWithoutName) => (\n \n \n \n ),\n save: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n grid: (props: IconPropsWithoutName) => (\n \n \n \n ),\n projects: (props: IconPropsWithoutName) => (\n \n \n \n ),\n messages: (props: IconPropsWithoutName) => (\n \n \n \n ),\n users: (props: IconPropsWithoutName) => (\n \n \n \n ),\n proposals: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'messages-inbox': (props: IconPropsWithoutName) => (\n \n \n \n ),\n dashboard: (props: IconPropsWithoutName) => (\n \n \n \n ),\n help: (props: IconPropsWithoutName) => (\n \n \n \n ),\n cog: (props: IconPropsWithoutName) => (\n \n \n \n \n ),\n organigram: (props: IconPropsWithoutName) => (\n \n \n \n ),\n community: (props: IconPropsWithoutName) => (\n \n \n \n ),\n academy: (props: IconPropsWithoutName) => (\n \n \n \n ),\n book: (props: IconPropsWithoutName) => (\n \n \n \n ),\n reports: (props: IconPropsWithoutName) => (\n \n \n \n ),\n unlock: (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'notification-outline': (props: IconPropsWithoutName) => (\n \n \n \n ),\n 'vote-ballot': (props: IconPropsWithoutName) => (\n \n \n \n ),\n print: (props: IconPropsWithoutName) => (\n \n \n \n ),\n} as const;\n\nconst Icon = (props: IconProps) => {\n return icons[props.name](props);\n};\n\nexport default Icon;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js b/docs/components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js similarity index 89% rename from docs/components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js rename to docs/components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js index 460f97d3c356..b31ad080f3a5 100644 --- a/docs/components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js +++ b/docs/components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js @@ -95,7 +95,7 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/ListItem/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/react/index.js");var _Box__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/Box/index.tsx"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/utils/styleUtils.ts"),styled_components__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");const StyledBox=(0,styled_components__WEBPACK_IMPORTED_MODULE_4__.Ay)(_Box__WEBPACK_IMPORTED_MODULE_1__.A)` +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/ListItem/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/react/index.js");var _Box__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/Box/index.tsx"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/utils/styleUtils.ts"),styled_components__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");const StyledBox=(0,styled_components__WEBPACK_IMPORTED_MODULE_4__.Ay)(_Box__WEBPACK_IMPORTED_MODULE_1__.A)` & + & { border-top: none; } @@ -118,4 +118,4 @@ ${"h6"===variant?`\n font-size: ${fontSize?_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.GR[fontSize]:_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.GR.s}px;\n `:""} `} `,Title=({children,variant="h1",color,as,fontSize,fontWeight,...props})=>{const mb=props.mb||props.my||props.m||"16px";return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(StyledTitle,{variant,color,as:as||variant,fontSize,fontWeight,mb,...props,children})};Title.displayName="Title";const __WEBPACK_DEFAULT_EXPORT__=Title;try{Title.displayName="Title",Title.__docgenInfo={description:"",displayName:"Title",props:{variant:{defaultValue:{value:"h1"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"h1"'},{value:'"h2"'},{value:'"h3"'},{value:'"h4"'},{value:'"h5"'},{value:'"h6"'}]}},color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"disabled"'},{value:'"black"'},{value:'"white"'},{value:'"grey800"'},{value:'"grey700"'},{value:'"grey600"'},{value:'"grey500"'},{value:'"grey400"'},{value:'"grey300"'},{value:'"grey200"'},{value:'"grey100"'},{value:'"grey50"'},{value:'"coolGrey700"'},{value:'"coolGrey600"'},{value:'"coolGrey500"'},{value:'"coolGrey300"'},{value:'"blue700"'},{value:'"blue500"'},{value:'"blue400"'},{value:'"teal700"'},{value:'"teal500"'},{value:'"teal400"'},{value:'"teal300"'},{value:'"teal200"'},{value:'"teal100"'},{value:'"teal50"'},{value:'"red100"'},{value:'"red400"'},{value:'"red500"'},{value:'"red600"'},{value:'"red800"'},{value:'"green700"'},{value:'"green500"'},{value:'"green400"'},{value:'"green100"'},{value:'"orange"'},{value:'"brown"'},{value:'"textPrimary"'},{value:'"borderDark"'},{value:'"placeholder"'},{value:'"borderLight"'},{value:'"divider"'},{value:'"textSecondary"'},{value:'"primary"'},{value:'"teal"'},{value:'"tealLight"'},{value:'"error"'},{value:'"errorLight"'},{value:'"success"'},{value:'"successLight"'},{value:'"background"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"facebookMessenger"'},{value:'"tenantPrimary"'},{value:'"tenantSecondary"'},{value:'"tenantText"'}]}},fontSize:{defaultValue:null,description:"",name:"fontSize",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"m"'},{value:'"xs"'},{value:'"s"'},{value:'"base"'},{value:'"l"'},{value:'"xl"'},{value:'"xxl"'},{value:'"xxxl"'},{value:'"xxxxl"'},{value:'"xxxxxl"'}]}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"h1"'},{value:'"h2"'},{value:'"h3"'},{value:'"h4"'},{value:'"h5"'},{value:'"h6"'}]}},fontWeight:{defaultValue:null,description:"",name:"fontWeight",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"bold"'},{value:'"normal"'}]}},fontStyle:{defaultValue:null,description:"",name:"fontStyle",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"normal"'},{value:'"italic"'}]}},textAlign:{defaultValue:null,description:"",name:"textAlign",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'},{value:'"center"'},{value:'"justify"'},{value:'"initial"'},{value:'"inherit"'}]}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},h:{defaultValue:null,description:"",name:"h",required:!1,type:{name:"string | undefined"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string | undefined"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},overflow:{defaultValue:null,description:"",name:"overflow",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowX:{defaultValue:null,description:"",name:"overflowX",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowY:{defaultValue:null,description:"",name:"overflowY",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Title/index.tsx#Title"]={docgenInfo:Title.__docgenInfo,name:"Title",path:"src/components/Title/index.tsx#Title"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js.map b/docs/components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js.map similarity index 99% rename from docs/components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js.map rename to docs/components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js.map index 260350f3d0da..92645fa5a135 100644 --- a/docs/components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js.map +++ b/docs/components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-Accordion-Accordion-stories-mdx.eeed2f56.iframe.bundle.js","mappings":";AAyBA;;;AAKA;;;;;;;AAOA;;;AAGA;;;;;AAKA;;;;;AAKA;;;;AAMA;;;;;;AASA;;;AAIA;;;;;;;;;;;;AAYA;;;;;;;;;;;;AAYA;;;;;;;;;AAWA;;;;ACnFA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;;;AChEA;;;ACyCA;;AAEA;AAQA;AAEA;AACA;;AAEA;AACA;AAKA;AAKA;AAKA;AAKA;AAKA;;AAQA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Accordion/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/ListItem/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Title/index.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from 'react';\n\n// Styling\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { colors, isRtl } from '../../utils/styleUtils';\n\n// Components\nimport ListItem from '../ListItem';\nimport Box, { BoxMarginProps, BoxPaddingProps, BoxWidthProps } from '../Box';\nimport Icon from '../Icon';\n\ntype AccordionProps = {\n title: ReactNode;\n children: ReactNode;\n isOpenByDefault?: boolean;\n className?: string;\n onChange?: (isOpen: boolean) => void;\n timeoutMilliseconds?: number;\n transitionHeightPx?: number;\n} & BoxMarginProps &\n BoxWidthProps &\n BoxPaddingProps;\n\nconst ChevronIcon = styled(Icon)`\n fill: ${colors.textSecondary};\n margin-left: 20px;\n transition: fill 80ms ease-out, transform 200ms ease-out;\n`;\n\nconst TitleButton = styled(Box)`\n align-items: center;\n display: flex;\n justify-content: space-between;\n cursor: pointer;\n width: 100%;\n text-align: left;\n ${isRtl`\n text-align: right;\n direction: rtl;\n ${ChevronIcon} {\n transform: rotate(180deg);\n }\n`}\n &.expanded {\n ${ChevronIcon} {\n transform: rotate(90deg);\n }\n }\n &:hover {\n ${ChevronIcon} {\n fill: #000;\n }\n }\n`;\n\nconst CollapseContainer = styled(Box)<{\n timeout: number;\n transitionHeight: number;\n}>`\n padding-top: 12px;\n margin-bottom: 24px;\n opacity: 1;\n display: flex;\n flex-wrap: wrap;\n transition: ${(props) =>\n `all ${props.timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1)`};\n will-change: opacity, height;\n\n ${isRtl`\n text-align: right;\n direction: rtl;\n`}\n\n &.expanded-enter {\n opacity: 0;\n max-height: 0px;\n overflow: hidden;\n\n &.expanded-enter-active {\n opacity: 1;\n max-height: ${(props) => `${props.transitionHeight}px`};\n overflow: hidden;\n }\n }\n\n &.expanded-enter-done {\n opacity: 1;\n overflow: visible;\n }\n\n &.expanded-exit {\n opacity: 1;\n max-height: ${(props) => `${props.transitionHeight}px`};\n overflow: hidden;\n\n &.collapsed-exit-active {\n opacity: 0;\n max-height: 0px;\n overflow: hidden;\n }\n }\n`;\n\nconst Accordion = ({\n isOpenByDefault,\n title,\n className,\n onChange,\n children,\n timeoutMilliseconds = 1500,\n transitionHeightPx = 600,\n ...rest\n}: AccordionProps) => {\n const [isExpanded, setIsExpanded] = useState(isOpenByDefault);\n\n useEffect(() => {\n setIsExpanded(isOpenByDefault);\n }, [isOpenByDefault]);\n\n const handleChange = () => {\n setIsExpanded(!isExpanded);\n onChange && onChange(!isExpanded);\n };\n\n return (\n \n \n {title}\n \n \n \n \n {children}\n \n \n \n );\n};\n\nexport default Accordion;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React from 'react';\n\n// components\nimport Box, { BoxProps } from '../Box';\nimport { colors } from '../../utils/styleUtils';\n\n// styling\nimport styled from 'styled-components';\n\nconst StyledBox = styled(Box)`\n & + & {\n border-top: none;\n }\n`;\n\nconst ListItem = ({ children, ...otherProps }: BoxProps) => (\n \n {children}\n \n);\n\nexport default ListItem;\n","import React from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n Color,\n colors,\n fontSizes,\n isRtl,\n MainThemeProps,\n} from '../../utils/styleUtils';\n\nimport Box, {\n BoxMarginProps,\n BoxPaddingProps,\n BoxPositionProps,\n BoxZIndexProps,\n BoxHeightProps,\n BoxWidthProps,\n BoxDisplayProps,\n BoxOverflowProps,\n BoxVisibilityProps,\n} from '../Box';\n\ntype Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\ntype FontSize = keyof typeof fontSizes;\ntype FontWeight = 'bold' | 'normal';\ntype FontStyle = 'italic' | 'normal';\ntype TextAlign =\n | 'left'\n | 'right'\n | 'center'\n | 'justify'\n | 'initial'\n | 'inherit';\n\nexport type TitleProps = {\n variant?: Variant;\n color?: Color;\n fontSize?: FontSize;\n as?: Variant;\n fontWeight?: FontWeight;\n fontStyle?: FontStyle;\n textAlign?: TextAlign;\n} & BoxMarginProps &\n BoxPaddingProps &\n BoxPositionProps &\n BoxZIndexProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxVisibilityProps &\n React.HTMLAttributes;\n\nconst StyledTitle = styled(Box)`\n line-height: 1.3;\n\n ${isRtl`direction: rtl;`}\n\n ${({\n variant,\n color,\n fontSize,\n fontWeight,\n fontStyle,\n textAlign,\n }: TitleProps) => css`\n color: ${({ theme }: { theme: MainThemeProps }) =>\n color ? theme.colors[color] : colors.textPrimary};\n font-weight: ${fontWeight ? fontWeight : 'bold'};\n font-style: ${fontStyle ? fontStyle : 'normal'};\n\n ${textAlign ? `text-align: ${textAlign};` : ''}\n ${variant === 'h1'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxxl}px;\n `\n : ''}\n ${variant === 'h2'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxl}px;\n `\n : ''}\n ${variant === 'h3'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xl}px;\n `\n : ''}\n ${variant === 'h4'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.l}px;\n `\n : ''}\n ${variant === 'h5'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.m}px;\n `\n : ''}\n ${variant === 'h6'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.s}px;\n `\n : ''}\n `}\n`;\n\nconst Title: React.FC = ({\n children,\n variant = 'h1',\n color,\n as,\n fontSize,\n fontWeight,\n ...props\n}) => {\n const mb = props.mb || props.my || props.m || '16px';\n\n return (\n \n {children}\n \n );\n};\n\nexport default Title;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-Accordion-Accordion-stories-mdx.fd4725f6.iframe.bundle.js","mappings":";AAyBA;;;AAKA;;;;;;;AAOA;;;AAGA;;;;;AAKA;;;;;AAKA;;;;AAMA;;;;;;AASA;;;AAIA;;;;;;;;;;;;AAYA;;;;;;;;;;;;AAYA;;;;;;;;;AAWA;;;;ACnFA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;;;AChEA;;;ACyCA;;AAEA;AAQA;AAEA;AACA;;AAEA;AACA;AAKA;AAKA;AAKA;AAKA;AAKA;;AAQA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Accordion/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/ListItem/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Title/index.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from 'react';\n\n// Styling\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { colors, isRtl } from '../../utils/styleUtils';\n\n// Components\nimport ListItem from '../ListItem';\nimport Box, { BoxMarginProps, BoxPaddingProps, BoxWidthProps } from '../Box';\nimport Icon from '../Icon';\n\ntype AccordionProps = {\n title: ReactNode;\n children: ReactNode;\n isOpenByDefault?: boolean;\n className?: string;\n onChange?: (isOpen: boolean) => void;\n timeoutMilliseconds?: number;\n transitionHeightPx?: number;\n} & BoxMarginProps &\n BoxWidthProps &\n BoxPaddingProps;\n\nconst ChevronIcon = styled(Icon)`\n fill: ${colors.textSecondary};\n margin-left: 20px;\n transition: fill 80ms ease-out, transform 200ms ease-out;\n`;\n\nconst TitleButton = styled(Box)`\n align-items: center;\n display: flex;\n justify-content: space-between;\n cursor: pointer;\n width: 100%;\n text-align: left;\n ${isRtl`\n text-align: right;\n direction: rtl;\n ${ChevronIcon} {\n transform: rotate(180deg);\n }\n`}\n &.expanded {\n ${ChevronIcon} {\n transform: rotate(90deg);\n }\n }\n &:hover {\n ${ChevronIcon} {\n fill: #000;\n }\n }\n`;\n\nconst CollapseContainer = styled(Box)<{\n timeout: number;\n transitionHeight: number;\n}>`\n padding-top: 12px;\n margin-bottom: 24px;\n opacity: 1;\n display: flex;\n flex-wrap: wrap;\n transition: ${(props) =>\n `all ${props.timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1)`};\n will-change: opacity, height;\n\n ${isRtl`\n text-align: right;\n direction: rtl;\n`}\n\n &.expanded-enter {\n opacity: 0;\n max-height: 0px;\n overflow: hidden;\n\n &.expanded-enter-active {\n opacity: 1;\n max-height: ${(props) => `${props.transitionHeight}px`};\n overflow: hidden;\n }\n }\n\n &.expanded-enter-done {\n opacity: 1;\n overflow: visible;\n }\n\n &.expanded-exit {\n opacity: 1;\n max-height: ${(props) => `${props.transitionHeight}px`};\n overflow: hidden;\n\n &.collapsed-exit-active {\n opacity: 0;\n max-height: 0px;\n overflow: hidden;\n }\n }\n`;\n\nconst Accordion = ({\n isOpenByDefault,\n title,\n className,\n onChange,\n children,\n timeoutMilliseconds = 1500,\n transitionHeightPx = 600,\n ...rest\n}: AccordionProps) => {\n const [isExpanded, setIsExpanded] = useState(isOpenByDefault);\n\n useEffect(() => {\n setIsExpanded(isOpenByDefault);\n }, [isOpenByDefault]);\n\n const handleChange = () => {\n setIsExpanded(!isExpanded);\n onChange && onChange(!isExpanded);\n };\n\n return (\n \n \n {title}\n \n \n \n \n {children}\n \n \n \n );\n};\n\nexport default Accordion;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React from 'react';\n\n// components\nimport Box, { BoxProps } from '../Box';\nimport { colors } from '../../utils/styleUtils';\n\n// styling\nimport styled from 'styled-components';\n\nconst StyledBox = styled(Box)`\n & + & {\n border-top: none;\n }\n`;\n\nconst ListItem = ({ children, ...otherProps }: BoxProps) => (\n \n {children}\n \n);\n\nexport default ListItem;\n","import React from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n Color,\n colors,\n fontSizes,\n isRtl,\n MainThemeProps,\n} from '../../utils/styleUtils';\n\nimport Box, {\n BoxMarginProps,\n BoxPaddingProps,\n BoxPositionProps,\n BoxZIndexProps,\n BoxHeightProps,\n BoxWidthProps,\n BoxDisplayProps,\n BoxOverflowProps,\n BoxVisibilityProps,\n} from '../Box';\n\ntype Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\ntype FontSize = keyof typeof fontSizes;\ntype FontWeight = 'bold' | 'normal';\ntype FontStyle = 'italic' | 'normal';\ntype TextAlign =\n | 'left'\n | 'right'\n | 'center'\n | 'justify'\n | 'initial'\n | 'inherit';\n\nexport type TitleProps = {\n variant?: Variant;\n color?: Color;\n fontSize?: FontSize;\n as?: Variant;\n fontWeight?: FontWeight;\n fontStyle?: FontStyle;\n textAlign?: TextAlign;\n} & BoxMarginProps &\n BoxPaddingProps &\n BoxPositionProps &\n BoxZIndexProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxVisibilityProps &\n React.HTMLAttributes;\n\nconst StyledTitle = styled(Box)`\n line-height: 1.3;\n\n ${isRtl`direction: rtl;`}\n\n ${({\n variant,\n color,\n fontSize,\n fontWeight,\n fontStyle,\n textAlign,\n }: TitleProps) => css`\n color: ${({ theme }: { theme: MainThemeProps }) =>\n color ? theme.colors[color] : colors.textPrimary};\n font-weight: ${fontWeight ? fontWeight : 'bold'};\n font-style: ${fontStyle ? fontStyle : 'normal'};\n\n ${textAlign ? `text-align: ${textAlign};` : ''}\n ${variant === 'h1'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxxl}px;\n `\n : ''}\n ${variant === 'h2'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxl}px;\n `\n : ''}\n ${variant === 'h3'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xl}px;\n `\n : ''}\n ${variant === 'h4'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.l}px;\n `\n : ''}\n ${variant === 'h5'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.m}px;\n `\n : ''}\n ${variant === 'h6'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.s}px;\n `\n : ''}\n `}\n`;\n\nconst Title: React.FC = ({\n children,\n variant = 'h1',\n color,\n as,\n fontSize,\n fontWeight,\n ...props\n}) => {\n const mb = props.mb || props.my || props.m || '16px';\n\n return (\n \n {children}\n \n );\n};\n\nexport default Title;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js b/docs/components-Button-Button-stories-mdx.26475c00.iframe.bundle.js similarity index 54% rename from docs/components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js rename to docs/components-Button-Button-stories-mdx.26475c00.iframe.bundle.js index 2eacf629f192..f49e2691d0e6 100644 --- a/docs/components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js +++ b/docs/components-Button-Button-stories-mdx.26475c00.iframe.bundle.js @@ -50,7 +50,7 @@ bottom: 0px; `,HiddenText=styled_components_browser_esm.Ay.span` ${(0,styleUtils.bS)()} -`;class Button extends react.PureComponent{handleOnClick=event=>{const{onClick,processing,disabled}=this.props;onClick&&(event.preventDefault(),event.stopPropagation(),disabled||processing||onClick(event))};removeFocus=event=>{event.preventDefault()};getSpinnerSize=size=>{switch(size){case"m":return"26px";case"l":return"28px";case"xl":return"30px";default:return"24px"}};render(){const{type="submit",text,form,iconColor,iconHoverColor,textColor,textHoverColor,textDisabledColor,bgColor,bgHoverColor,bgDisabledColor,borderColor,borderHoverColor,borderDisabledColor,borderThickness,boxShadow,boxShadowHover,borderRadius,justify,justifyWrapper,icon,hiddenText,children,fontWeight,lineHeight,textDecoration,textDecorationHover,whiteSpace,fullWidth,role,ariaLabel,fontSize,autoFocus,ariaExpanded,ariaDescribedby,ariaDisabled,opacityDisabled,className,onClick:_onClick,processing=!1,disabled=!1,as,...rest}=this.props,id=this.props.id||"",size=this.props.size||"s",buttonStyle=this.props.buttonStyle||"primary",iconPos=this.props.iconPos||"left",spinnerSize=this.getSpinnerSize(size),hasText=!(0,isNil.A)(text)||!(0,isNil.A)(children),buttonType=type&&!as?type:void 0,containerClassNames=[className,disabled?"disabled":null,processing?"processing":null,fullWidth?"fullWidth":null].filter((item=>!(0,isNil.A)(item))).join(" "),buttonClassNames=["button","Button",buttonStyle,disabled?"disabled":null,processing?"processing":null,fullWidth?"fullWidth":null].filter((item=>!(0,isNil.A)(item))).join(" "),childContent=(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[icon&&"left"===iconPos&&(0,jsx_runtime.jsx)(StyledIcon,{name:icon,className:`buttonIcon ${iconPos} ${hasText&&"hasText"}`}),hasText&&(0,jsx_runtime.jsx)(ButtonText,{className:"buttonText",children:text||children}),hiddenText&&(0,jsx_runtime.jsx)(HiddenText,{children:hiddenText}),icon&&"right"===iconPos&&(0,jsx_runtime.jsx)(StyledIcon,{name:icon,className:`buttonIcon ${iconPos} ${hasText&&"hasText"}`}),processing&&(0,jsx_runtime.jsx)(SpinnerWrapper,{children:(0,jsx_runtime.jsx)(Spinner.A,{size:spinnerSize})})]});return(0,jsx_runtime.jsx)(Container,{onClick:this.handleOnClick,className:containerClassNames,onMouseDown:this.removeFocus,buttonStyle,id,size,justify,justifyWrapper,processing,disabled,iconColor,iconHoverColor,textColor,textHoverColor,textDisabledColor,bgColor,bgHoverColor,bgDisabledColor,borderColor,borderHoverColor,borderDisabledColor,borderThickness,boxShadow,boxShadowHover,borderRadius,fontWeight,lineHeight,textDecoration,textDecorationHover,whiteSpace,fontSize,opacityDisabled,...rest,children:(0,jsx_runtime.jsx)(StyledButton,{role,"aria-label":ariaLabel,"aria-expanded":ariaExpanded,"aria-describedby":ariaDescribedby,"aria-disabled":ariaDisabled,disabled,ref:this.props.setSubmitButtonRef,className:buttonClassNames,form,type:buttonType,autoFocus,as,children:childContent})})}}Button.displayName="Button";const components_Button=Button;try{Button.displayName="Button",Button.__docgenInfo={description:"",displayName:"Button",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},form:{defaultValue:null,description:"",name:"form",required:!1,type:{name:"string | undefined"}},hiddenText:{defaultValue:null,description:"",name:"hiddenText",required:!1,type:{name:"string | Element | undefined"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},iconPos:{defaultValue:null,description:"",name:"iconPos",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'}]}},setSubmitButtonRef:{defaultValue:null,description:"",name:"setSubmitButtonRef",required:!1,type:{name:"((value: any) => void) | undefined"}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"string | Element | undefined"}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"MainThemeProps | undefined"}},type:{defaultValue:null,description:"",name:"type",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"button"'},{value:'"submit"'},{value:'"reset"'}]}},spinnerColor:{defaultValue:null,description:"",name:"spinnerColor",required:!1,type:{name:"string | undefined"}},role:{defaultValue:null,description:"",name:"role",required:!1,type:{name:"string | undefined"}},ariaLabel:{defaultValue:null,description:"",name:"ariaLabel",required:!1,type:{name:"string | undefined"}},autoFocus:{defaultValue:null,description:"",name:"autoFocus",required:!1,type:{name:"boolean | undefined"}},fontSize:{defaultValue:null,description:"",name:"fontSize",required:!1,type:{name:"string | undefined"}},ariaExpanded:{defaultValue:null,description:"",name:"ariaExpanded",required:!1,type:{name:"boolean | undefined"}},ariaDescribedby:{defaultValue:null,description:"",name:"ariaDescribedby",required:!1,type:{name:"string | undefined"}},ariaDisabled:{defaultValue:null,description:"",name:"ariaDisabled",required:!1,type:{name:"boolean | undefined"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"ElementType | undefined"}},buttonStyle:{defaultValue:null,description:"",name:"buttonStyle",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"white"'},{value:'"primary"'},{value:'"success"'},{value:'"text"'},{value:'"delete"'},{value:'"primary-inverse"'},{value:'"primary-outlined"'},{value:'"secondary"'},{value:'"secondary-outlined"'},{value:'"cl-blue"'},{value:'"cl-blue-outlined"'},{value:'"admin-dark"'},{value:'"admin-dark-outlined"'},{value:'"admin-dark-text"'}]}},size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"m"'},{value:'"s"'},{value:'"l"'},{value:'"xl"'}]}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"boolean | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},justify:{defaultValue:null,description:"",name:"justify",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'},{value:'"center"'},{value:'"space-between"'}]}},justifyWrapper:{defaultValue:null,description:"",name:"justifyWrapper",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'},{value:'"center"'},{value:'"space-between"'}]}},processing:{defaultValue:null,description:"",name:"processing",required:!1,type:{name:"boolean | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},textColor:{defaultValue:null,description:"",name:"textColor",required:!1,type:{name:"string | undefined"}},textHoverColor:{defaultValue:null,description:"",name:"textHoverColor",required:!1,type:{name:"string | undefined"}},textDisabledColor:{defaultValue:null,description:"",name:"textDisabledColor",required:!1,type:{name:"string | undefined"}},bgColor:{defaultValue:null,description:"",name:"bgColor",required:!1,type:{name:"string | undefined"}},bgHoverColor:{defaultValue:null,description:"",name:"bgHoverColor",required:!1,type:{name:"string | undefined"}},bgDisabledColor:{defaultValue:null,description:"",name:"bgDisabledColor",required:!1,type:{name:"string | undefined"}},borderColor:{defaultValue:null,description:"",name:"borderColor",required:!1,type:{name:"string | undefined"}},borderHoverColor:{defaultValue:null,description:"",name:"borderHoverColor",required:!1,type:{name:"string | undefined"}},borderDisabledColor:{defaultValue:null,description:"",name:"borderDisabledColor",required:!1,type:{name:"string | undefined"}},borderThickness:{defaultValue:null,description:"",name:"borderThickness",required:!1,type:{name:"string | undefined"}},boxShadow:{defaultValue:null,description:"",name:"boxShadow",required:!1,type:{name:"string | undefined"}},boxShadowHover:{defaultValue:null,description:"",name:"boxShadowHover",required:!1,type:{name:"string | undefined"}},borderRadius:{defaultValue:null,description:"",name:"borderRadius",required:!1,type:{name:"string | undefined"}},fontWeight:{defaultValue:null,description:"",name:"fontWeight",required:!1,type:{name:"string | undefined"}},lineHeight:{defaultValue:null,description:"",name:"lineHeight",required:!1,type:{name:"string | undefined"}},textDecoration:{defaultValue:null,description:"",name:"textDecoration",required:!1,type:{name:"string | undefined"}},textDecorationHover:{defaultValue:null,description:"",name:"textDecorationHover",required:!1,type:{name:"string | undefined"}},whiteSpace:{defaultValue:null,description:"",name:"whiteSpace",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}},opacityDisabled:{defaultValue:null,description:"",name:"opacityDisabled",required:!1,type:{name:"string | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"(((arg: MouseEvent) => void) & MouseEventHandler) | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},h:{defaultValue:null,description:"",name:"h",required:!1,type:{name:"string | undefined"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string | undefined"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Button/index.tsx#Button"]={docgenInfo:Button.__docgenInfo,name:"Button",path:"src/components/Button/index.tsx#Button"})}catch(__react_docgen_typescript_loader_error){}var addon_knobs_dist=__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js"),addon_actions_dist=__webpack_require__("./node_modules/@storybook/addon-actions/dist/index.mjs");const primary=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primary.storyName="primary",primary.parameters={storySource:{source:'
'}};const primaryWithIcon=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary",icon:"info-outline",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primaryWithIcon.storyName="primary with icon",primaryWithIcon.parameters={storySource:{source:'
'}};const primaryOutlined=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primaryOutlined.storyName="primary-outlined",primaryOutlined.parameters={storySource:{source:'
'}};const primaryInverse=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-inverse",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primaryInverse.storyName="primary-inverse",primaryInverse.parameters={storySource:{source:'
'}};const secondary=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});secondary.storyName="secondary",secondary.parameters={storySource:{source:'
'}};const secondaryOutlined=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});secondaryOutlined.storyName="secondary-outlined",secondaryOutlined.parameters={storySource:{source:'
'}};const success=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"success",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});success.storyName="success",success.parameters={storySource:{source:'
'}};const textStyle=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});textStyle.storyName="text style",textStyle.parameters={storySource:{source:'
'}};const clBlue=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"cl-blue",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});clBlue.storyName="cl-blue",clBlue.parameters={storySource:{source:'
'}};const adminDark=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});adminDark.storyName="admin-dark",adminDark.parameters={storySource:{source:'
'}};const adminDarkText=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark-text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});adminDarkText.storyName="admin-dark-text",adminDarkText.parameters={storySource:{source:'
'}};const deleteStory=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"delete",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});deleteStory.storyName="delete",deleteStory.parameters={storySource:{source:'
'}};const white=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex",background:"#f4f4f4",padding:"10px"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"white",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});white.storyName="white",white.parameters={storySource:{source:'
'}};const buttonLink=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),as:props=>(0,jsx_runtime.jsx)("a",{...props,href:"#",children:props.children}),children:(0,jsx_runtime.jsx)("p",{children:"Button that is actually a link"})})});buttonLink.storyName="button-link",buttonLink.parameters={storySource:{source:'
'}};const componentMeta={title:"Components/Button",component:components_Button,tags:["stories-mdx"],includeStories:["primary","primaryWithIcon","primaryOutlined","primaryInverse","secondary","secondaryOutlined","success","textStyle","clBlue","adminDark","adminDarkText","deleteStory","white","buttonLink"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1",p:"p",a:"a"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/Button",component:components_Button}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"button",children:"Button"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_Button}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary with icon",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary",icon:"info-outline",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary-outlined",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary-inverse",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-inverse",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"secondary",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"secondary-outlined",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"success",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"success",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"text style",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"cl-blue",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"cl-blue",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"admin-dark",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"admin-dark-text",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark-text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"delete",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"delete",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"white",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex",background:"#f4f4f4",padding:"10px"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"white",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"button-link",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),as:props=>(0,jsx_runtime.jsx)(_components.a,{...props,href:"#",children:props.children}),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button that is actually a link"})})})})})]})}}};const Button_stories=componentMeta,__namedExportsOrder=["primary","primaryWithIcon","primaryOutlined","primaryInverse","secondary","secondaryOutlined","success","textStyle","clBlue","adminDark","adminDarkText","deleteStory","white","buttonLink"]},"./src/components/Spinner/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utils/testUtils/testEnv.ts"),styled_components__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js");const rotate=styled_components__WEBPACK_IMPORTED_MODULE_3__.i7` +`;class Button extends react.PureComponent{handleOnClick=event=>{const{onClick,processing,disabled}=this.props;onClick&&(event.preventDefault(),event.stopPropagation(),disabled||processing||onClick(event))};removeFocus=event=>{event.preventDefault()};getSpinnerSize=size=>{switch(size){case"m":return"26px";case"l":return"28px";case"xl":return"30px";default:return"24px"}};render(){const{type="submit",text,form,iconColor,iconHoverColor,textColor,textHoverColor,textDisabledColor,bgColor,bgHoverColor,bgDisabledColor,borderColor,borderHoverColor,borderDisabledColor,borderThickness,boxShadow,boxShadowHover,borderRadius,justify,justifyWrapper,icon,hiddenText,children,fontWeight,lineHeight,textDecoration,textDecorationHover,whiteSpace,fullWidth,role,ariaLabel,fontSize,autoFocus,ariaExpanded,ariaDescribedby,ariaDisabled,opacityDisabled,className,onClick:_onClick,processing=!1,disabled=!1,as,...rest}=this.props,id=this.props.id||"",size=this.props.size||"s",buttonStyle=this.props.buttonStyle||"primary",iconPos=this.props.iconPos||"left",spinnerSize=this.getSpinnerSize(size),hasText=!(0,isNil.A)(text)||!(0,isNil.A)(children),buttonType=type&&!as?type:void 0,containerClassNames=[className,disabled?"disabled":null,processing?"processing":null,fullWidth?"fullWidth":null].filter((item=>!(0,isNil.A)(item))).join(" "),buttonClassNames=["button","Button",buttonStyle,disabled?"disabled":null,processing?"processing":null,fullWidth?"fullWidth":null].filter((item=>!(0,isNil.A)(item))).join(" "),childContent=(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[icon&&"left"===iconPos&&(0,jsx_runtime.jsx)(StyledIcon,{name:icon,className:`buttonIcon ${iconPos} ${hasText&&"hasText"}`}),hasText&&(0,jsx_runtime.jsx)(ButtonText,{className:"buttonText",children:text||children}),hiddenText&&(0,jsx_runtime.jsx)(HiddenText,{children:hiddenText}),icon&&"right"===iconPos&&(0,jsx_runtime.jsx)(StyledIcon,{name:icon,className:`buttonIcon ${iconPos} ${hasText&&"hasText"}`}),processing&&(0,jsx_runtime.jsx)(SpinnerWrapper,{children:(0,jsx_runtime.jsx)(Spinner.A,{size:spinnerSize})})]});return(0,jsx_runtime.jsx)(Container,{onClick:this.handleOnClick,className:containerClassNames,onMouseDown:this.removeFocus,buttonStyle,id,size,justify,justifyWrapper,processing,disabled,iconColor,iconHoverColor,textColor,textHoverColor,textDisabledColor,bgColor,bgHoverColor,bgDisabledColor,borderColor,borderHoverColor,borderDisabledColor,borderThickness,boxShadow,boxShadowHover,borderRadius,fontWeight,lineHeight,textDecoration,textDecorationHover,whiteSpace,fontSize,opacityDisabled,...rest,children:(0,jsx_runtime.jsx)(StyledButton,{role,"aria-label":ariaLabel,"aria-expanded":ariaExpanded,"aria-describedby":ariaDescribedby,"aria-disabled":ariaDisabled,disabled,ref:this.props.setSubmitButtonRef,className:buttonClassNames,form,type:buttonType,autoFocus,as,children:childContent})})}}Button.displayName="Button";const components_Button=Button;try{Button.displayName="Button",Button.__docgenInfo={description:"",displayName:"Button",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},form:{defaultValue:null,description:"",name:"form",required:!1,type:{name:"string | undefined"}},hiddenText:{defaultValue:null,description:"",name:"hiddenText",required:!1,type:{name:"string | Element | undefined"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},iconPos:{defaultValue:null,description:"",name:"iconPos",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'}]}},setSubmitButtonRef:{defaultValue:null,description:"",name:"setSubmitButtonRef",required:!1,type:{name:"((value: any) => void) | undefined"}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"string | Element | undefined"}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"MainThemeProps | undefined"}},type:{defaultValue:null,description:"",name:"type",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"button"'},{value:'"submit"'},{value:'"reset"'}]}},spinnerColor:{defaultValue:null,description:"",name:"spinnerColor",required:!1,type:{name:"string | undefined"}},role:{defaultValue:null,description:"",name:"role",required:!1,type:{name:"string | undefined"}},ariaLabel:{defaultValue:null,description:"",name:"ariaLabel",required:!1,type:{name:"string | undefined"}},autoFocus:{defaultValue:null,description:"",name:"autoFocus",required:!1,type:{name:"boolean | undefined"}},fontSize:{defaultValue:null,description:"",name:"fontSize",required:!1,type:{name:"string | undefined"}},ariaExpanded:{defaultValue:null,description:"",name:"ariaExpanded",required:!1,type:{name:"boolean | undefined"}},ariaDescribedby:{defaultValue:null,description:"",name:"ariaDescribedby",required:!1,type:{name:"string | undefined"}},ariaDisabled:{defaultValue:null,description:"",name:"ariaDisabled",required:!1,type:{name:"boolean | undefined"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"ElementType | undefined"}},buttonStyle:{defaultValue:null,description:"",name:"buttonStyle",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"white"'},{value:'"primary"'},{value:'"success"'},{value:'"text"'},{value:'"delete"'},{value:'"primary-inverse"'},{value:'"primary-outlined"'},{value:'"secondary"'},{value:'"secondary-outlined"'},{value:'"cl-blue"'},{value:'"cl-blue-outlined"'},{value:'"admin-dark"'},{value:'"admin-dark-outlined"'},{value:'"admin-dark-text"'}]}},size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"m"'},{value:'"s"'},{value:'"l"'},{value:'"xl"'}]}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"boolean | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},justify:{defaultValue:null,description:"",name:"justify",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'},{value:'"center"'},{value:'"space-between"'}]}},justifyWrapper:{defaultValue:null,description:"",name:"justifyWrapper",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'},{value:'"center"'},{value:'"space-between"'}]}},processing:{defaultValue:null,description:"",name:"processing",required:!1,type:{name:"boolean | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},textColor:{defaultValue:null,description:"",name:"textColor",required:!1,type:{name:"string | undefined"}},textHoverColor:{defaultValue:null,description:"",name:"textHoverColor",required:!1,type:{name:"string | undefined"}},textDisabledColor:{defaultValue:null,description:"",name:"textDisabledColor",required:!1,type:{name:"string | undefined"}},bgColor:{defaultValue:null,description:"",name:"bgColor",required:!1,type:{name:"string | undefined"}},bgHoverColor:{defaultValue:null,description:"",name:"bgHoverColor",required:!1,type:{name:"string | undefined"}},bgDisabledColor:{defaultValue:null,description:"",name:"bgDisabledColor",required:!1,type:{name:"string | undefined"}},borderColor:{defaultValue:null,description:"",name:"borderColor",required:!1,type:{name:"string | undefined"}},borderHoverColor:{defaultValue:null,description:"",name:"borderHoverColor",required:!1,type:{name:"string | undefined"}},borderDisabledColor:{defaultValue:null,description:"",name:"borderDisabledColor",required:!1,type:{name:"string | undefined"}},borderThickness:{defaultValue:null,description:"",name:"borderThickness",required:!1,type:{name:"string | undefined"}},boxShadow:{defaultValue:null,description:"",name:"boxShadow",required:!1,type:{name:"string | undefined"}},boxShadowHover:{defaultValue:null,description:"",name:"boxShadowHover",required:!1,type:{name:"string | undefined"}},borderRadius:{defaultValue:null,description:"",name:"borderRadius",required:!1,type:{name:"string | undefined"}},fontWeight:{defaultValue:null,description:"",name:"fontWeight",required:!1,type:{name:"string | undefined"}},lineHeight:{defaultValue:null,description:"",name:"lineHeight",required:!1,type:{name:"string | undefined"}},textDecoration:{defaultValue:null,description:"",name:"textDecoration",required:!1,type:{name:"string | undefined"}},textDecorationHover:{defaultValue:null,description:"",name:"textDecorationHover",required:!1,type:{name:"string | undefined"}},whiteSpace:{defaultValue:null,description:"",name:"whiteSpace",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}},opacityDisabled:{defaultValue:null,description:"",name:"opacityDisabled",required:!1,type:{name:"string | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"(((arg: MouseEvent) => void) & MouseEventHandler) | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},h:{defaultValue:null,description:"",name:"h",required:!1,type:{name:"string | undefined"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string | undefined"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Button/index.tsx#Button"]={docgenInfo:Button.__docgenInfo,name:"Button",path:"src/components/Button/index.tsx#Button"})}catch(__react_docgen_typescript_loader_error){}var addon_knobs_dist=__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js"),addon_actions_dist=__webpack_require__("./node_modules/@storybook/addon-actions/dist/index.mjs");const primary=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primary.storyName="primary",primary.parameters={storySource:{source:'
'}};const primaryWithIcon=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary",icon:"info-outline",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primaryWithIcon.storyName="primary with icon",primaryWithIcon.parameters={storySource:{source:'
'}};const primaryOutlined=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primaryOutlined.storyName="primary-outlined",primaryOutlined.parameters={storySource:{source:'
'}};const primaryInverse=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-inverse",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});primaryInverse.storyName="primary-inverse",primaryInverse.parameters={storySource:{source:'
'}};const secondary=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});secondary.storyName="secondary",secondary.parameters={storySource:{source:'
'}};const secondaryOutlined=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});secondaryOutlined.storyName="secondary-outlined",secondaryOutlined.parameters={storySource:{source:'
'}};const success=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"success",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});success.storyName="success",success.parameters={storySource:{source:'
'}};const textStyle=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});textStyle.storyName="text style",textStyle.parameters={storySource:{source:'
'}};const clBlue=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"cl-blue",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});clBlue.storyName="cl-blue",clBlue.parameters={storySource:{source:'
'}};const adminDark=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});adminDark.storyName="admin-dark",adminDark.parameters={storySource:{source:'
'}};const adminDarkText=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark-text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});adminDarkText.storyName="admin-dark-text",adminDarkText.parameters={storySource:{source:'
'}};const deleteStory=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"delete",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});deleteStory.storyName="delete",deleteStory.parameters={storySource:{source:'
'}};const white=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex",background:"#f4f4f4",padding:"10px"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"white",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)("p",{children:"Button"})})});white.storyName="white",white.parameters={storySource:{source:'
'}};const buttonLink=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),as:props=>(0,jsx_runtime.jsx)("a",{...props,href:"#",children:props.children}),children:(0,jsx_runtime.jsx)("p",{children:"Button that is actually a link"})})});buttonLink.storyName="button-link",buttonLink.parameters={storySource:{source:'
'}};const componentMeta={title:"Components/Button",component:components_Button,tags:["stories-mdx"],includeStories:["primary","primaryWithIcon","primaryOutlined","primaryInverse","secondary","secondaryOutlined","success","textStyle","clBlue","adminDark","adminDarkText","deleteStory","white","buttonLink"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1",p:"p",a:"a"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/Button",component:components_Button}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"button",children:"Button"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_Button}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary with icon",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary",icon:"info-outline",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary-outlined",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"primary-inverse",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"primary-inverse",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"secondary",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"secondary-outlined",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"secondary-outlined",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"success",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"success",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"text style",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"cl-blue",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"cl-blue",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"admin-dark",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"admin-dark-text",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"admin-dark-text",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"delete",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"delete",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"white",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex",background:"#f4f4f4",padding:"10px"},children:(0,jsx_runtime.jsx)(components_Button,{locale:"en",buttonStyle:"white",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),onClick:(0,addon_actions_dist.XI)("button clicked"),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button"})})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"button-link",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_Button,{buttonStyle:"primary",disabled:(0,addon_knobs_dist.boolean)("Disabled",!1),processing:(0,addon_knobs_dist.boolean)("Processing",!1),as:props=>(0,jsx_runtime.jsx)(_components.a,{...props,href:"#",children:props.children}),children:(0,jsx_runtime.jsx)(_components.p,{children:"Button that is actually a link"})})})})})]})}}};const Button_stories=componentMeta,__namedExportsOrder=["primary","primaryWithIcon","primaryOutlined","primaryInverse","secondary","secondaryOutlined","success","textStyle","clBlue","adminDark","adminDarkText","deleteStory","white","buttonLink"]},"./src/components/Spinner/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utils/testUtils/testEnv.ts"),styled_components__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js");const rotate=styled_components__WEBPACK_IMPORTED_MODULE_3__.i7` 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } `,Container=styled_components__WEBPACK_IMPORTED_MODULE_3__.Ay.span` @@ -71,4 +71,4 @@ padding: 0; margin: 0; `;class Spinner extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent{static defaultProps={size:"32px",thickness:"3px",color:"#666"};render(){const{size,thickness,color,className}=this.props;return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Container,{className,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(StyledSpinner,{className:"spinner",size,thickness,color,"data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_1__.A)("spinner")})})}}Spinner.displayName="Spinner";const __WEBPACK_DEFAULT_EXPORT__=Spinner;try{Spinner.displayName="Spinner",Spinner.__docgenInfo={description:"",displayName:"Spinner",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},size:{defaultValue:{value:"32px"},description:"",name:"size",required:!1,type:{name:"string"}},thickness:{defaultValue:{value:"3px"},description:"",name:"thickness",required:!1,type:{name:"string"}},color:{defaultValue:{value:"#666"},description:"",name:"color",required:!1,type:{name:"string"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Spinner/index.tsx#Spinner"]={docgenInfo:Spinner.__docgenInfo,name:"Spinner",path:"src/components/Spinner/index.tsx#Spinner"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}},"./node_modules/lodash-es/isNil.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});const __WEBPACK_DEFAULT_EXPORT__=function isNil(value){return null==value}}}]); -//# sourceMappingURL=components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-Button-Button-stories-mdx.26475c00.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js.map b/docs/components-Button-Button-stories-mdx.26475c00.iframe.bundle.js.map similarity index 99% rename from docs/components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js.map rename to docs/components-Button-Button-stories-mdx.26475c00.iframe.bundle.js.map index 7ce5939f7e57..371146debf83 100644 --- a/docs/components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js.map +++ b/docs/components-Button-Button-stories-mdx.26475c00.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-Button-Button-stories-mdx.e5030c7d.iframe.bundle.js","mappings":";;AAiWA;;;;;;;;;;;AAoEA;;;;;;;;;;;;;AAeA;;;AAGA;;;;;;;;;AASA;AACA;;AAIA;;;;;;;;;AAWA;AACA;AAsEA;;;AC9gBA;;;;AAMA;AAKA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAgBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Button/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Spinner/index.tsx"],"sourcesContent":["import React, { PureComponent, MouseEvent, ButtonHTMLAttributes } from 'react';\r\nimport { isNil, get } from 'lodash-es';\r\nimport styled from 'styled-components';\r\nimport { darken, lighten, transparentize, opacify, rgba } from 'polished';\r\nimport {\r\n colors,\r\n invisibleA11yText,\r\n fontSizes,\r\n defaultStyles,\r\n isRtl,\r\n MainThemeProps,\r\n} from '../../utils/styleUtils';\r\nimport Spinner from '../Spinner';\r\nimport Icon, { IconProps } from '../Icon';\r\nimport Box, {\r\n BoxMarginProps,\r\n BoxPaddingProps,\r\n BoxPositionProps,\r\n BoxWidthProps,\r\n BoxHeightProps,\r\n} from '../Box';\r\n\r\nexport type ButtonStyles =\r\n | 'primary'\r\n | 'primary-inverse'\r\n | 'primary-outlined'\r\n | 'secondary'\r\n | 'secondary-outlined'\r\n | 'white'\r\n | 'success'\r\n | 'text'\r\n | 'cl-blue'\r\n | 'cl-blue-outlined'\r\n | 'admin-dark'\r\n | 'admin-dark-outlined'\r\n | 'admin-dark-text'\r\n | 'delete';\r\n\r\ntype DefaultStyleValues = {\r\n [key in ButtonStyles]: {\r\n bgColor: string;\r\n bgHoverColor?: string;\r\n textColor: string;\r\n textHoverColor?: string;\r\n borderColor?: string;\r\n borderHoverColor?: string;\r\n boxShadow?: string;\r\n boxShadowHover?: string;\r\n iconColor?: string;\r\n iconHoverColor?: string;\r\n padding?: string;\r\n };\r\n};\r\n\r\nfunction getFontSize(props: ButtonContainerProps & { theme: MainThemeProps }) {\r\n if (props.fontSize) {\r\n return props.fontSize;\r\n } else {\r\n switch (props.size) {\r\n case 'm':\r\n return `${fontSizes.l}px`;\r\n case 'l':\r\n return `${fontSizes.xl}px`;\r\n default:\r\n return `${fontSizes.base}px`;\r\n }\r\n }\r\n}\r\n\r\nfunction getPadding(props: ButtonContainerProps & { theme: MainThemeProps }) {\r\n if (props.padding) {\r\n return props.padding;\r\n } else if (props.p) {\r\n return props.p;\r\n } else {\r\n switch (props.size) {\r\n case 'm':\r\n return '11px 22px';\r\n case 'l':\r\n return '13px 24px';\r\n case 'xl':\r\n return '15px 26px';\r\n default:\r\n // return '.65em 1.45em';\r\n return '9px 18px';\r\n }\r\n }\r\n}\r\n\r\nfunction getLineHeight(\r\n props: ButtonContainerProps & { theme: MainThemeProps }\r\n) {\r\n if (props.lineHeight) {\r\n return props.lineHeight;\r\n } else {\r\n switch (props.size) {\r\n case 'xl':\r\n return '28px';\r\n default:\r\n return '26px';\r\n }\r\n }\r\n}\r\n\r\nfunction getButtonStyle(\r\n props: ButtonContainerProps & { theme: MainThemeProps }\r\n) {\r\n const defaultStyleValues: DefaultStyleValues = {\r\n primary: {\r\n bgColor: get(props.theme.colors, 'tenantPrimary'),\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n 'primary-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: transparentize(\r\n 0.95,\r\n get(props.theme.colors, 'tenantPrimary')\r\n ),\r\n textColor: get(props.theme.colors, 'tenantPrimary'),\r\n borderColor: get(props.theme.colors, 'tenantPrimary'),\r\n },\r\n 'primary-inverse': {\r\n bgColor: '#fff',\r\n textColor: get(props.theme.colors, 'tenantText'),\r\n textHoverColor: get(props.theme.colors, 'tenantText'),\r\n },\r\n secondary: {\r\n bgColor: colors.grey200,\r\n textColor: darken(0.1, colors.textSecondary),\r\n bgHoverColor: darken(0.05, colors.grey200),\r\n },\r\n 'secondary-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: transparentize(0.95, colors.textSecondary),\r\n textColor: colors.textSecondary,\r\n borderColor: lighten(0.25, colors.textSecondary),\r\n },\r\n white: {\r\n bgColor: '#fff',\r\n bgHoverColor: '#fff',\r\n iconColor: colors.textSecondary,\r\n textColor: get(props.theme.colors, 'tenantText'),\r\n borderColor: 'transparent',\r\n boxShadow: defaultStyles.boxShadow,\r\n boxShadowHover: defaultStyles.boxShadowHoverSmall,\r\n },\r\n text: {\r\n bgColor: 'transparent',\r\n bgHoverColor: 'transparent',\r\n textColor: colors.textSecondary,\r\n iconColor: colors.textSecondary,\r\n },\r\n success: {\r\n bgColor: colors.green500,\r\n bgHoverColor: colors.green700,\r\n textColor: colors.white,\r\n textHoverColor: colors.white,\r\n iconHoverColor: colors.white,\r\n },\r\n 'cl-blue': {\r\n bgColor: colors.primary,\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n 'cl-blue-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: 'transparent',\r\n textColor: colors.primary,\r\n borderColor: colors.primary,\r\n },\r\n 'admin-dark': {\r\n bgColor: colors.primary,\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n 'admin-dark-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: 'transparent',\r\n textColor: colors.primary,\r\n borderColor: colors.primary,\r\n },\r\n 'admin-dark-text': {\r\n bgColor: 'transparent',\r\n bgHoverColor: rgba(colors.primary, 0.1),\r\n textColor: colors.primary,\r\n },\r\n delete: {\r\n bgColor: colors.red600,\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n };\r\n\r\n const backgroundColor =\r\n props.bgColor ||\r\n (get(defaultStyleValues, `${props.buttonStyle}.bgColor`) as string);\r\n\r\n const backgroundHoverColor =\r\n props.bgHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.bgHoverColor`) ||\r\n darken(0.12, backgroundColor);\r\n const backgroundActiveColor =\r\n backgroundHoverColor !== 'transparent'\r\n ? backgroundHoverColor?.startsWith('rgba')\r\n ? opacify(0.12, backgroundHoverColor)\r\n : darken(0.12, backgroundHoverColor)\r\n : 'inherit';\r\n const backgroundDisabledColor =\r\n props.bgDisabledColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.bgDisabledColor`) ||\r\n backgroundColor;\r\n const textColor =\r\n props.textColor ||\r\n (get(defaultStyleValues, `${props.buttonStyle}.textColor`) as string);\r\n const textHoverColor =\r\n props.textHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textHoverColor`) ||\r\n darken(0.2, textColor);\r\n const iconColor =\r\n props.iconColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.iconColor`) ||\r\n (textColor as string);\r\n const iconHoverColor =\r\n props.iconHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.iconHoverColor`) ||\r\n darken(0.2, iconColor);\r\n const textDisabledColor =\r\n props.textDisabledColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textDisabledColor`) ||\r\n textColor;\r\n const borderColor =\r\n props.borderColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderColor`) ||\r\n 'transparent';\r\n const borderHoverColor =\r\n props.borderHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderHoverColor`) ||\r\n darken(0.2, borderColor);\r\n const borderDisabledColor =\r\n props.borderDisabledColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderDisabledColor`) ||\r\n borderColor;\r\n const boxShadow =\r\n props.boxShadow ||\r\n get(defaultStyleValues, `${props.buttonStyle}.boxShadow`) ||\r\n 'none';\r\n const boxShadowHover =\r\n props.boxShadowHover ||\r\n get(defaultStyleValues, `${props.buttonStyle}.boxShadowHover`) ||\r\n 'none';\r\n const borderRadius =\r\n props.borderRadius ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderRadius`) ||\r\n props.theme.borderRadius;\r\n const textDecoration =\r\n props.textDecoration ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textDecoration`) ||\r\n 'none';\r\n const textDecorationHover =\r\n props.textDecorationHover ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textDecorationHover`) ||\r\n 'none';\r\n const padding =\r\n get(defaultStyleValues, `${props.buttonStyle}.padding`) ||\r\n getPadding(props);\r\n const fontSize = getFontSize(props);\r\n const lineHeight = getLineHeight(props);\r\n const fontWeight = props.fontWeight || 'normal';\r\n const borderWidth = props.borderThickness || '1px';\r\n const display = !props.width ? 'inline-flex' : 'flex';\r\n const height = props.height || props.h || 'auto';\r\n const minHeight = props.minHeight || 'initial';\r\n const maxHeight = props.maxHeight || 'initial';\r\n const justifyContent = props.justify || 'center';\r\n const minWidth = props.minWidth || 'initial';\r\n const maxWidth = props.maxWidth || 'initial';\r\n const width = props.width || props.w || '100%';\r\n const buttonTextOpacity = props.processing ? 0 : 1;\r\n const iconOpacity = props.processing ? 0 : 1;\r\n const iconSize = props.iconSize ? props.iconSize : '24px';\r\n const whiteSpace = props.whiteSpace || 'nowrap';\r\n const opacityDisabled = props.opacityDisabled || '0.37';\r\n const flexDirection = props.theme.isRtl ? 'row-reverse' : 'row';\r\n\r\n return `\r\n width: ${width};\r\n min-width: ${minWidth};\r\n max-width: ${maxWidth};\r\n height: ${height};\r\n min-height: ${minHeight};\r\n max-height: ${maxHeight};\r\n display: ${display};\r\n align-items: center;\r\n justify-content: ${justifyContent};\r\n margin: 0;\r\n position: relative;\r\n border-radius: ${borderRadius};\r\n background: ${backgroundColor};\r\n border-width: ${borderWidth};\r\n border-style: solid;\r\n border-color: ${borderColor};\r\n box-shadow: ${boxShadow};\r\n cursor: pointer;\r\n transition: background 80ms ease-out, border-color 80ms ease-out, box-shadow 125ms ease-in-out 0s;\r\n flex-direction: ${flexDirection};\r\n\r\n // padding\r\n padding: ${padding};\r\n ${props.paddingY ? `padding-top: ${props.paddingY}` : ''};\r\n ${props.py ? `padding-top: ${props.py}` : ''};\r\n ${props.paddingTop ? `padding-top: ${props.paddingTop}` : ''};\r\n ${props.pt ? `padding-top: ${props.pt}` : ''};\r\n ${props.paddingY ? `padding-bottom: ${props.paddingY}` : ''};\r\n ${props.py ? `padding-bottom: ${props.py}` : ''};\r\n ${props.paddingBottom ? `padding-bottom: ${props.paddingBottom}` : ''};\r\n ${props.pb ? `padding-bottom: ${props.pb}` : ''};\r\n ${props.paddingX ? `padding-left: ${props.paddingX}` : ''};\r\n ${props.px ? `padding-left: ${props.px}` : ''};\r\n ${props.paddingLeft ? `padding-left: ${props.paddingLeft}` : ''};\r\n ${props.pl ? `padding-left: ${props.pl}` : ''};\r\n ${props.paddingX ? `padding-right: ${props.paddingX}` : ''};\r\n ${props.px ? `padding-right: ${props.px}` : ''};\r\n ${props.paddingRight ? `padding-right: ${props.paddingRight}` : ''};\r\n ${props.pr ? `padding-right: ${props.pr}` : ''};\r\n\r\n ${ButtonText} {\r\n color: ${textColor};\r\n opacity: ${buttonTextOpacity};\r\n font-size: ${fontSize};\r\n line-height: ${lineHeight};\r\n font-weight: ${fontWeight};\r\n text-decoration: ${textDecoration};\r\n white-space: ${whiteSpace};\r\n text-align: left;\r\n margin: 0;\r\n margin-top: -1px;\r\n padding: 0;\r\n transition: color 80ms ease-out;\r\n\r\n ${isRtl`\r\n text-align: right;\r\n `}\r\n }\r\n\r\n ${StyledIcon} {\r\n fill: ${iconColor};\r\n flex: 0 0 ${iconSize};\r\n height: ${iconSize};\r\n width: ${iconSize};\r\n opacity: ${iconOpacity};\r\n transition: fill 80ms ease-out;\r\n }\r\n\r\n &:not(.disabled):not(.processing):active {\r\n background: ${backgroundActiveColor} !important;\r\n }\r\n\r\n &:not(.disabled):not(.processing):hover {\r\n background: ${backgroundHoverColor};\r\n border-color: ${borderHoverColor};\r\n box-shadow: ${boxShadowHover};\r\n\r\n ${ButtonText} {\r\n color: ${textHoverColor};\r\n text-decoration: ${textDecorationHover};\r\n }\r\n\r\n ${StyledIcon} {\r\n fill: ${iconHoverColor};\r\n }\r\n }\r\n\r\n &.fullWidth {\r\n flex: 1;\r\n width: 100%;\r\n }\r\n\r\n &.disabled {\r\n background: ${backgroundDisabledColor};\r\n border-color: ${borderDisabledColor};\r\n opacity: ${opacityDisabled};\r\n cursor: not-allowed;\r\n\r\n ${ButtonText} {\r\n color: ${textDisabledColor};\r\n }\r\n\r\n ${StyledIcon} {\r\n fill: ${textDisabledColor};\r\n }\r\n }\r\n\r\n & .spinner {\r\n border-color: ${textColor} !important;\r\n border-right-color: transparent !important;\r\n }\r\n `;\r\n}\r\n\r\nconst StyledButton = styled.button``;\r\nconst ButtonText = styled.span``;\r\nconst StyledIcon = styled(Icon)`\r\n &.hasText {\r\n &.left {\r\n margin-right: 10px;\r\n }\r\n\r\n &.right {\r\n margin-left: 10px;\r\n }\r\n }\r\n\r\n ${isRtl`\r\n &.hasText {\r\n &.left {\r\n margin-right: 0px;\r\n margin-left: 10px;\r\n }\r\n\r\n &.right {\r\n margin-left: 0px;\r\n margin-right: 10px;\r\n }\r\n }\r\n `}\r\n`;\r\n\r\nconst Container = styled(Box)`\r\n display: flex;\r\n align-items: center;\r\n justify-content: ${(props) => props.justifyWrapper || 'center'};\r\n padding: 0;\r\n user-select: none;\r\n background-color: transparent;\r\n\r\n &.fullWidth {\r\n width: 100%;\r\n }\r\n\r\n ${StyledButton} {\r\n ${(props) => getButtonStyle(props)}\r\n }\r\n`;\r\n\r\nconst SpinnerWrapper = styled.span`\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0px;\r\n`;\r\n\r\nconst HiddenText = styled.span`\r\n ${invisibleA11yText()}\r\n`;\r\n\r\ntype Size = 's' | 'm' | 'l' | 'xl' | undefined;\r\n\r\nexport type ButtonContainerProps = {\r\n buttonStyle?: ButtonStyles;\r\n size?: Size;\r\n width?: string;\r\n height?: string;\r\n fullWidth?: boolean;\r\n padding?: string;\r\n justify?: 'left' | 'center' | 'right' | 'space-between';\r\n justifyWrapper?: 'left' | 'center' | 'right' | 'space-between';\r\n processing?: boolean;\r\n disabled?: boolean;\r\n iconColor?: string;\r\n iconSize?: string;\r\n iconHoverColor?: string;\r\n textColor?: string;\r\n textHoverColor?: string;\r\n textDisabledColor?: string;\r\n bgColor?: string;\r\n bgHoverColor?: string;\r\n bgDisabledColor?: string;\r\n borderColor?: string;\r\n borderHoverColor?: string;\r\n borderDisabledColor?: string;\r\n borderThickness?: string;\r\n boxShadow?: string;\r\n boxShadowHover?: string;\r\n borderRadius?: string;\r\n fontWeight?: string;\r\n lineHeight?: string;\r\n textDecoration?: string;\r\n textDecorationHover?: string;\r\n whiteSpace?: string;\r\n minWidth?: string;\r\n fontSize?: string;\r\n opacityDisabled?: string;\r\n onClick?: (arg: MouseEvent) => void;\r\n} & BoxMarginProps &\r\n BoxPaddingProps &\r\n BoxPositionProps &\r\n BoxWidthProps &\r\n BoxHeightProps &\r\n React.HTMLAttributes;\r\n\r\nexport interface Props extends ButtonContainerProps {\r\n children?: React.ReactNode;\r\n className?: string;\r\n form?: string;\r\n hiddenText?: string | JSX.Element;\r\n icon?: IconProps['name'];\r\n iconPos?: 'left' | 'right';\r\n setSubmitButtonRef?: (value: any) => void;\r\n text?: string | JSX.Element;\r\n theme?: MainThemeProps | undefined;\r\n type?: ButtonHTMLAttributes['type'];\r\n spinnerColor?: string;\r\n role?: string;\r\n ariaLabel?: string;\r\n autoFocus?: boolean;\r\n fontSize?: string;\r\n ariaExpanded?: boolean;\r\n ariaDescribedby?: string;\r\n ariaDisabled?: boolean;\r\n as?: React.ElementType;\r\n}\r\n\r\nclass Button extends PureComponent {\r\n handleOnClick = (event: any) => {\r\n const { onClick, processing, disabled } = this.props;\r\n\r\n if (onClick) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n\r\n if (!disabled && !processing) {\r\n onClick(event);\r\n }\r\n }\r\n };\r\n\r\n removeFocus = (event: MouseEvent) => {\r\n event.preventDefault();\r\n };\r\n\r\n getSpinnerSize = (size: Size) => {\r\n switch (size) {\r\n case 'm':\r\n return '26px';\r\n case 'l':\r\n return '28px';\r\n case 'xl':\r\n return '30px';\r\n default:\r\n return '24px';\r\n }\r\n };\r\n\r\n render() {\r\n const {\r\n type = 'submit',\r\n text,\r\n form,\r\n iconColor,\r\n iconHoverColor,\r\n textColor,\r\n textHoverColor,\r\n textDisabledColor,\r\n bgColor,\r\n bgHoverColor,\r\n bgDisabledColor,\r\n borderColor,\r\n borderHoverColor,\r\n borderDisabledColor,\r\n borderThickness,\r\n boxShadow,\r\n boxShadowHover,\r\n borderRadius,\r\n justify,\r\n justifyWrapper,\r\n icon,\r\n hiddenText,\r\n children,\r\n fontWeight,\r\n lineHeight,\r\n textDecoration,\r\n textDecorationHover,\r\n whiteSpace,\r\n fullWidth,\r\n role,\r\n ariaLabel,\r\n fontSize,\r\n autoFocus,\r\n ariaExpanded,\r\n ariaDescribedby,\r\n ariaDisabled,\r\n opacityDisabled,\r\n className,\r\n onClick: _onClick,\r\n processing = false,\r\n disabled = false,\r\n as,\r\n ...rest\r\n } = this.props;\r\n\r\n const id = this.props.id || '';\r\n const size = this.props.size || 's';\r\n const buttonStyle = this.props.buttonStyle || 'primary';\r\n const iconPos = this.props.iconPos || 'left';\r\n const spinnerSize = this.getSpinnerSize(size);\r\n const hasText = !isNil(text) || !isNil(children);\r\n const buttonType = type && !as ? type : undefined;\r\n const containerClassNames = [\r\n className,\r\n disabled ? 'disabled' : null,\r\n processing ? 'processing' : null,\r\n fullWidth ? 'fullWidth' : null,\r\n ]\r\n .filter((item: any) => !isNil(item))\r\n .join(' ');\r\n const buttonClassNames = [\r\n 'button',\r\n 'Button',\r\n buttonStyle,\r\n disabled ? 'disabled' : null,\r\n processing ? 'processing' : null,\r\n fullWidth ? 'fullWidth' : null,\r\n ]\r\n .filter((item: any) => !isNil(item))\r\n .join(' ');\r\n\r\n const childContent = (\r\n <>\r\n {icon && iconPos === 'left' && (\r\n \r\n )}\r\n {hasText && (\r\n {text || children}\r\n )}\r\n {hiddenText && {hiddenText}}\r\n {icon && iconPos === 'right' && (\r\n \r\n )}\r\n {processing && (\r\n \r\n \r\n \r\n )}\r\n \r\n );\r\n\r\n return (\r\n \r\n \r\n {childContent}\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nexport default Button;\r\n","import React, { PureComponent } from 'react';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport styled, { css, keyframes } from 'styled-components';\n\nconst rotate = keyframes`\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n`;\n\nconst Container = styled.span`\n display: flex;\n width: 100%;\n justify-content: center;\n`;\n\nconst StyledSpinner = styled.span<{\n size: string;\n thickness: string;\n color: string;\n}>`\n width: ${(props) => props.size};\n height: ${(props) => props.size};\n animation: ${css`\n ${rotate} 800ms infinite linear\n `};\n border-style: solid;\n border-right-color: transparent !important;\n border-width: ${(props) => props.thickness};\n border-color: ${(props) => props.color};\n border-radius: 50%;\n padding: 0;\n margin: 0;\n`;\n\ninterface DefaultProps {\n size: string;\n thickness: string;\n color: string;\n}\n\ninterface Props extends DefaultProps {\n className?: string;\n}\n\nclass Spinner extends PureComponent {\n static defaultProps: DefaultProps = {\n size: '32px',\n thickness: '3px',\n color: '#666',\n };\n\n render() {\n const { size, thickness, color, className } = this.props;\n\n return (\n \n \n \n );\n }\n}\n\nexport default Spinner;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-Button-Button-stories-mdx.26475c00.iframe.bundle.js","mappings":";;AAiWA;;;;;;;;;;;AAoEA;;;;;;;;;;;;;AAeA;;;AAGA;;;;;;;;;AASA;AACA;;AAIA;;;;;;;;;AAWA;AACA;AAsEA;;;AC9gBA;;;;AAMA;AAKA;AACA;AACA;AACA;;;;AAIA;AACA;;;;AAgBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Button/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Spinner/index.tsx"],"sourcesContent":["import React, { PureComponent, MouseEvent, ButtonHTMLAttributes } from 'react';\r\nimport { isNil, get } from 'lodash-es';\r\nimport styled from 'styled-components';\r\nimport { darken, lighten, transparentize, opacify, rgba } from 'polished';\r\nimport {\r\n colors,\r\n invisibleA11yText,\r\n fontSizes,\r\n defaultStyles,\r\n isRtl,\r\n MainThemeProps,\r\n} from '../../utils/styleUtils';\r\nimport Spinner from '../Spinner';\r\nimport Icon, { IconProps } from '../Icon';\r\nimport Box, {\r\n BoxMarginProps,\r\n BoxPaddingProps,\r\n BoxPositionProps,\r\n BoxWidthProps,\r\n BoxHeightProps,\r\n} from '../Box';\r\n\r\nexport type ButtonStyles =\r\n | 'primary'\r\n | 'primary-inverse'\r\n | 'primary-outlined'\r\n | 'secondary'\r\n | 'secondary-outlined'\r\n | 'white'\r\n | 'success'\r\n | 'text'\r\n | 'cl-blue'\r\n | 'cl-blue-outlined'\r\n | 'admin-dark'\r\n | 'admin-dark-outlined'\r\n | 'admin-dark-text'\r\n | 'delete';\r\n\r\ntype DefaultStyleValues = {\r\n [key in ButtonStyles]: {\r\n bgColor: string;\r\n bgHoverColor?: string;\r\n textColor: string;\r\n textHoverColor?: string;\r\n borderColor?: string;\r\n borderHoverColor?: string;\r\n boxShadow?: string;\r\n boxShadowHover?: string;\r\n iconColor?: string;\r\n iconHoverColor?: string;\r\n padding?: string;\r\n };\r\n};\r\n\r\nfunction getFontSize(props: ButtonContainerProps & { theme: MainThemeProps }) {\r\n if (props.fontSize) {\r\n return props.fontSize;\r\n } else {\r\n switch (props.size) {\r\n case 'm':\r\n return `${fontSizes.l}px`;\r\n case 'l':\r\n return `${fontSizes.xl}px`;\r\n default:\r\n return `${fontSizes.base}px`;\r\n }\r\n }\r\n}\r\n\r\nfunction getPadding(props: ButtonContainerProps & { theme: MainThemeProps }) {\r\n if (props.padding) {\r\n return props.padding;\r\n } else if (props.p) {\r\n return props.p;\r\n } else {\r\n switch (props.size) {\r\n case 'm':\r\n return '11px 22px';\r\n case 'l':\r\n return '13px 24px';\r\n case 'xl':\r\n return '15px 26px';\r\n default:\r\n // return '.65em 1.45em';\r\n return '9px 18px';\r\n }\r\n }\r\n}\r\n\r\nfunction getLineHeight(\r\n props: ButtonContainerProps & { theme: MainThemeProps }\r\n) {\r\n if (props.lineHeight) {\r\n return props.lineHeight;\r\n } else {\r\n switch (props.size) {\r\n case 'xl':\r\n return '28px';\r\n default:\r\n return '26px';\r\n }\r\n }\r\n}\r\n\r\nfunction getButtonStyle(\r\n props: ButtonContainerProps & { theme: MainThemeProps }\r\n) {\r\n const defaultStyleValues: DefaultStyleValues = {\r\n primary: {\r\n bgColor: get(props.theme.colors, 'tenantPrimary'),\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n 'primary-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: transparentize(\r\n 0.95,\r\n get(props.theme.colors, 'tenantPrimary')\r\n ),\r\n textColor: get(props.theme.colors, 'tenantPrimary'),\r\n borderColor: get(props.theme.colors, 'tenantPrimary'),\r\n },\r\n 'primary-inverse': {\r\n bgColor: '#fff',\r\n textColor: get(props.theme.colors, 'tenantText'),\r\n textHoverColor: get(props.theme.colors, 'tenantText'),\r\n },\r\n secondary: {\r\n bgColor: colors.grey200,\r\n textColor: darken(0.1, colors.textSecondary),\r\n bgHoverColor: darken(0.05, colors.grey200),\r\n },\r\n 'secondary-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: transparentize(0.95, colors.textSecondary),\r\n textColor: colors.textSecondary,\r\n borderColor: lighten(0.25, colors.textSecondary),\r\n },\r\n white: {\r\n bgColor: '#fff',\r\n bgHoverColor: '#fff',\r\n iconColor: colors.textSecondary,\r\n textColor: get(props.theme.colors, 'tenantText'),\r\n borderColor: 'transparent',\r\n boxShadow: defaultStyles.boxShadow,\r\n boxShadowHover: defaultStyles.boxShadowHoverSmall,\r\n },\r\n text: {\r\n bgColor: 'transparent',\r\n bgHoverColor: 'transparent',\r\n textColor: colors.textSecondary,\r\n iconColor: colors.textSecondary,\r\n },\r\n success: {\r\n bgColor: colors.green500,\r\n bgHoverColor: colors.green700,\r\n textColor: colors.white,\r\n textHoverColor: colors.white,\r\n iconHoverColor: colors.white,\r\n },\r\n 'cl-blue': {\r\n bgColor: colors.primary,\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n 'cl-blue-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: 'transparent',\r\n textColor: colors.primary,\r\n borderColor: colors.primary,\r\n },\r\n 'admin-dark': {\r\n bgColor: colors.primary,\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n 'admin-dark-outlined': {\r\n bgColor: 'transparent',\r\n bgHoverColor: 'transparent',\r\n textColor: colors.primary,\r\n borderColor: colors.primary,\r\n },\r\n 'admin-dark-text': {\r\n bgColor: 'transparent',\r\n bgHoverColor: rgba(colors.primary, 0.1),\r\n textColor: colors.primary,\r\n },\r\n delete: {\r\n bgColor: colors.red600,\r\n textColor: '#fff',\r\n textHoverColor: '#fff',\r\n iconColor: '#fff',\r\n iconHoverColor: '#fff',\r\n },\r\n };\r\n\r\n const backgroundColor =\r\n props.bgColor ||\r\n (get(defaultStyleValues, `${props.buttonStyle}.bgColor`) as string);\r\n\r\n const backgroundHoverColor =\r\n props.bgHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.bgHoverColor`) ||\r\n darken(0.12, backgroundColor);\r\n const backgroundActiveColor =\r\n backgroundHoverColor !== 'transparent'\r\n ? backgroundHoverColor?.startsWith('rgba')\r\n ? opacify(0.12, backgroundHoverColor)\r\n : darken(0.12, backgroundHoverColor)\r\n : 'inherit';\r\n const backgroundDisabledColor =\r\n props.bgDisabledColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.bgDisabledColor`) ||\r\n backgroundColor;\r\n const textColor =\r\n props.textColor ||\r\n (get(defaultStyleValues, `${props.buttonStyle}.textColor`) as string);\r\n const textHoverColor =\r\n props.textHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textHoverColor`) ||\r\n darken(0.2, textColor);\r\n const iconColor =\r\n props.iconColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.iconColor`) ||\r\n (textColor as string);\r\n const iconHoverColor =\r\n props.iconHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.iconHoverColor`) ||\r\n darken(0.2, iconColor);\r\n const textDisabledColor =\r\n props.textDisabledColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textDisabledColor`) ||\r\n textColor;\r\n const borderColor =\r\n props.borderColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderColor`) ||\r\n 'transparent';\r\n const borderHoverColor =\r\n props.borderHoverColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderHoverColor`) ||\r\n darken(0.2, borderColor);\r\n const borderDisabledColor =\r\n props.borderDisabledColor ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderDisabledColor`) ||\r\n borderColor;\r\n const boxShadow =\r\n props.boxShadow ||\r\n get(defaultStyleValues, `${props.buttonStyle}.boxShadow`) ||\r\n 'none';\r\n const boxShadowHover =\r\n props.boxShadowHover ||\r\n get(defaultStyleValues, `${props.buttonStyle}.boxShadowHover`) ||\r\n 'none';\r\n const borderRadius =\r\n props.borderRadius ||\r\n get(defaultStyleValues, `${props.buttonStyle}.borderRadius`) ||\r\n props.theme.borderRadius;\r\n const textDecoration =\r\n props.textDecoration ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textDecoration`) ||\r\n 'none';\r\n const textDecorationHover =\r\n props.textDecorationHover ||\r\n get(defaultStyleValues, `${props.buttonStyle}.textDecorationHover`) ||\r\n 'none';\r\n const padding =\r\n get(defaultStyleValues, `${props.buttonStyle}.padding`) ||\r\n getPadding(props);\r\n const fontSize = getFontSize(props);\r\n const lineHeight = getLineHeight(props);\r\n const fontWeight = props.fontWeight || 'normal';\r\n const borderWidth = props.borderThickness || '1px';\r\n const display = !props.width ? 'inline-flex' : 'flex';\r\n const height = props.height || props.h || 'auto';\r\n const minHeight = props.minHeight || 'initial';\r\n const maxHeight = props.maxHeight || 'initial';\r\n const justifyContent = props.justify || 'center';\r\n const minWidth = props.minWidth || 'initial';\r\n const maxWidth = props.maxWidth || 'initial';\r\n const width = props.width || props.w || '100%';\r\n const buttonTextOpacity = props.processing ? 0 : 1;\r\n const iconOpacity = props.processing ? 0 : 1;\r\n const iconSize = props.iconSize ? props.iconSize : '24px';\r\n const whiteSpace = props.whiteSpace || 'nowrap';\r\n const opacityDisabled = props.opacityDisabled || '0.37';\r\n const flexDirection = props.theme.isRtl ? 'row-reverse' : 'row';\r\n\r\n return `\r\n width: ${width};\r\n min-width: ${minWidth};\r\n max-width: ${maxWidth};\r\n height: ${height};\r\n min-height: ${minHeight};\r\n max-height: ${maxHeight};\r\n display: ${display};\r\n align-items: center;\r\n justify-content: ${justifyContent};\r\n margin: 0;\r\n position: relative;\r\n border-radius: ${borderRadius};\r\n background: ${backgroundColor};\r\n border-width: ${borderWidth};\r\n border-style: solid;\r\n border-color: ${borderColor};\r\n box-shadow: ${boxShadow};\r\n cursor: pointer;\r\n transition: background 80ms ease-out, border-color 80ms ease-out, box-shadow 125ms ease-in-out 0s;\r\n flex-direction: ${flexDirection};\r\n\r\n // padding\r\n padding: ${padding};\r\n ${props.paddingY ? `padding-top: ${props.paddingY}` : ''};\r\n ${props.py ? `padding-top: ${props.py}` : ''};\r\n ${props.paddingTop ? `padding-top: ${props.paddingTop}` : ''};\r\n ${props.pt ? `padding-top: ${props.pt}` : ''};\r\n ${props.paddingY ? `padding-bottom: ${props.paddingY}` : ''};\r\n ${props.py ? `padding-bottom: ${props.py}` : ''};\r\n ${props.paddingBottom ? `padding-bottom: ${props.paddingBottom}` : ''};\r\n ${props.pb ? `padding-bottom: ${props.pb}` : ''};\r\n ${props.paddingX ? `padding-left: ${props.paddingX}` : ''};\r\n ${props.px ? `padding-left: ${props.px}` : ''};\r\n ${props.paddingLeft ? `padding-left: ${props.paddingLeft}` : ''};\r\n ${props.pl ? `padding-left: ${props.pl}` : ''};\r\n ${props.paddingX ? `padding-right: ${props.paddingX}` : ''};\r\n ${props.px ? `padding-right: ${props.px}` : ''};\r\n ${props.paddingRight ? `padding-right: ${props.paddingRight}` : ''};\r\n ${props.pr ? `padding-right: ${props.pr}` : ''};\r\n\r\n ${ButtonText} {\r\n color: ${textColor};\r\n opacity: ${buttonTextOpacity};\r\n font-size: ${fontSize};\r\n line-height: ${lineHeight};\r\n font-weight: ${fontWeight};\r\n text-decoration: ${textDecoration};\r\n white-space: ${whiteSpace};\r\n text-align: left;\r\n margin: 0;\r\n margin-top: -1px;\r\n padding: 0;\r\n transition: color 80ms ease-out;\r\n\r\n ${isRtl`\r\n text-align: right;\r\n `}\r\n }\r\n\r\n ${StyledIcon} {\r\n fill: ${iconColor};\r\n flex: 0 0 ${iconSize};\r\n height: ${iconSize};\r\n width: ${iconSize};\r\n opacity: ${iconOpacity};\r\n transition: fill 80ms ease-out;\r\n }\r\n\r\n &:not(.disabled):not(.processing):active {\r\n background: ${backgroundActiveColor} !important;\r\n }\r\n\r\n &:not(.disabled):not(.processing):hover {\r\n background: ${backgroundHoverColor};\r\n border-color: ${borderHoverColor};\r\n box-shadow: ${boxShadowHover};\r\n\r\n ${ButtonText} {\r\n color: ${textHoverColor};\r\n text-decoration: ${textDecorationHover};\r\n }\r\n\r\n ${StyledIcon} {\r\n fill: ${iconHoverColor};\r\n }\r\n }\r\n\r\n &.fullWidth {\r\n flex: 1;\r\n width: 100%;\r\n }\r\n\r\n &.disabled {\r\n background: ${backgroundDisabledColor};\r\n border-color: ${borderDisabledColor};\r\n opacity: ${opacityDisabled};\r\n cursor: not-allowed;\r\n\r\n ${ButtonText} {\r\n color: ${textDisabledColor};\r\n }\r\n\r\n ${StyledIcon} {\r\n fill: ${textDisabledColor};\r\n }\r\n }\r\n\r\n & .spinner {\r\n border-color: ${textColor} !important;\r\n border-right-color: transparent !important;\r\n }\r\n `;\r\n}\r\n\r\nconst StyledButton = styled.button``;\r\nconst ButtonText = styled.span``;\r\nconst StyledIcon = styled(Icon)`\r\n &.hasText {\r\n &.left {\r\n margin-right: 10px;\r\n }\r\n\r\n &.right {\r\n margin-left: 10px;\r\n }\r\n }\r\n\r\n ${isRtl`\r\n &.hasText {\r\n &.left {\r\n margin-right: 0px;\r\n margin-left: 10px;\r\n }\r\n\r\n &.right {\r\n margin-left: 0px;\r\n margin-right: 10px;\r\n }\r\n }\r\n `}\r\n`;\r\n\r\nconst Container = styled(Box)`\r\n display: flex;\r\n align-items: center;\r\n justify-content: ${(props) => props.justifyWrapper || 'center'};\r\n padding: 0;\r\n user-select: none;\r\n background-color: transparent;\r\n\r\n &.fullWidth {\r\n width: 100%;\r\n }\r\n\r\n ${StyledButton} {\r\n ${(props) => getButtonStyle(props)}\r\n }\r\n`;\r\n\r\nconst SpinnerWrapper = styled.span`\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0px;\r\n`;\r\n\r\nconst HiddenText = styled.span`\r\n ${invisibleA11yText()}\r\n`;\r\n\r\ntype Size = 's' | 'm' | 'l' | 'xl' | undefined;\r\n\r\nexport type ButtonContainerProps = {\r\n buttonStyle?: ButtonStyles;\r\n size?: Size;\r\n width?: string;\r\n height?: string;\r\n fullWidth?: boolean;\r\n padding?: string;\r\n justify?: 'left' | 'center' | 'right' | 'space-between';\r\n justifyWrapper?: 'left' | 'center' | 'right' | 'space-between';\r\n processing?: boolean;\r\n disabled?: boolean;\r\n iconColor?: string;\r\n iconSize?: string;\r\n iconHoverColor?: string;\r\n textColor?: string;\r\n textHoverColor?: string;\r\n textDisabledColor?: string;\r\n bgColor?: string;\r\n bgHoverColor?: string;\r\n bgDisabledColor?: string;\r\n borderColor?: string;\r\n borderHoverColor?: string;\r\n borderDisabledColor?: string;\r\n borderThickness?: string;\r\n boxShadow?: string;\r\n boxShadowHover?: string;\r\n borderRadius?: string;\r\n fontWeight?: string;\r\n lineHeight?: string;\r\n textDecoration?: string;\r\n textDecorationHover?: string;\r\n whiteSpace?: string;\r\n minWidth?: string;\r\n fontSize?: string;\r\n opacityDisabled?: string;\r\n onClick?: (arg: MouseEvent) => void;\r\n} & BoxMarginProps &\r\n BoxPaddingProps &\r\n BoxPositionProps &\r\n BoxWidthProps &\r\n BoxHeightProps &\r\n React.HTMLAttributes;\r\n\r\nexport interface Props extends ButtonContainerProps {\r\n children?: React.ReactNode;\r\n className?: string;\r\n form?: string;\r\n hiddenText?: string | JSX.Element;\r\n icon?: IconProps['name'];\r\n iconPos?: 'left' | 'right';\r\n setSubmitButtonRef?: (value: any) => void;\r\n text?: string | JSX.Element;\r\n theme?: MainThemeProps | undefined;\r\n type?: ButtonHTMLAttributes['type'];\r\n spinnerColor?: string;\r\n role?: string;\r\n ariaLabel?: string;\r\n autoFocus?: boolean;\r\n fontSize?: string;\r\n ariaExpanded?: boolean;\r\n ariaDescribedby?: string;\r\n ariaDisabled?: boolean;\r\n as?: React.ElementType;\r\n}\r\n\r\nclass Button extends PureComponent {\r\n handleOnClick = (event: any) => {\r\n const { onClick, processing, disabled } = this.props;\r\n\r\n if (onClick) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n\r\n if (!disabled && !processing) {\r\n onClick(event);\r\n }\r\n }\r\n };\r\n\r\n removeFocus = (event: MouseEvent) => {\r\n event.preventDefault();\r\n };\r\n\r\n getSpinnerSize = (size: Size) => {\r\n switch (size) {\r\n case 'm':\r\n return '26px';\r\n case 'l':\r\n return '28px';\r\n case 'xl':\r\n return '30px';\r\n default:\r\n return '24px';\r\n }\r\n };\r\n\r\n render() {\r\n const {\r\n type = 'submit',\r\n text,\r\n form,\r\n iconColor,\r\n iconHoverColor,\r\n textColor,\r\n textHoverColor,\r\n textDisabledColor,\r\n bgColor,\r\n bgHoverColor,\r\n bgDisabledColor,\r\n borderColor,\r\n borderHoverColor,\r\n borderDisabledColor,\r\n borderThickness,\r\n boxShadow,\r\n boxShadowHover,\r\n borderRadius,\r\n justify,\r\n justifyWrapper,\r\n icon,\r\n hiddenText,\r\n children,\r\n fontWeight,\r\n lineHeight,\r\n textDecoration,\r\n textDecorationHover,\r\n whiteSpace,\r\n fullWidth,\r\n role,\r\n ariaLabel,\r\n fontSize,\r\n autoFocus,\r\n ariaExpanded,\r\n ariaDescribedby,\r\n ariaDisabled,\r\n opacityDisabled,\r\n className,\r\n onClick: _onClick,\r\n processing = false,\r\n disabled = false,\r\n as,\r\n ...rest\r\n } = this.props;\r\n\r\n const id = this.props.id || '';\r\n const size = this.props.size || 's';\r\n const buttonStyle = this.props.buttonStyle || 'primary';\r\n const iconPos = this.props.iconPos || 'left';\r\n const spinnerSize = this.getSpinnerSize(size);\r\n const hasText = !isNil(text) || !isNil(children);\r\n const buttonType = type && !as ? type : undefined;\r\n const containerClassNames = [\r\n className,\r\n disabled ? 'disabled' : null,\r\n processing ? 'processing' : null,\r\n fullWidth ? 'fullWidth' : null,\r\n ]\r\n .filter((item: any) => !isNil(item))\r\n .join(' ');\r\n const buttonClassNames = [\r\n 'button',\r\n 'Button',\r\n buttonStyle,\r\n disabled ? 'disabled' : null,\r\n processing ? 'processing' : null,\r\n fullWidth ? 'fullWidth' : null,\r\n ]\r\n .filter((item: any) => !isNil(item))\r\n .join(' ');\r\n\r\n const childContent = (\r\n <>\r\n {icon && iconPos === 'left' && (\r\n \r\n )}\r\n {hasText && (\r\n {text || children}\r\n )}\r\n {hiddenText && {hiddenText}}\r\n {icon && iconPos === 'right' && (\r\n \r\n )}\r\n {processing && (\r\n \r\n \r\n \r\n )}\r\n \r\n );\r\n\r\n return (\r\n \r\n \r\n {childContent}\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nexport default Button;\r\n","import React, { PureComponent } from 'react';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport styled, { css, keyframes } from 'styled-components';\n\nconst rotate = keyframes`\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n`;\n\nconst Container = styled.span`\n display: flex;\n width: 100%;\n justify-content: center;\n`;\n\nconst StyledSpinner = styled.span<{\n size: string;\n thickness: string;\n color: string;\n}>`\n width: ${(props) => props.size};\n height: ${(props) => props.size};\n animation: ${css`\n ${rotate} 800ms infinite linear\n `};\n border-style: solid;\n border-right-color: transparent !important;\n border-width: ${(props) => props.thickness};\n border-color: ${(props) => props.color};\n border-radius: 50%;\n padding: 0;\n margin: 0;\n`;\n\ninterface DefaultProps {\n size: string;\n thickness: string;\n color: string;\n}\n\ninterface Props extends DefaultProps {\n className?: string;\n}\n\nclass Spinner extends PureComponent {\n static defaultProps: DefaultProps = {\n size: '32px',\n thickness: '3px',\n color: '#666',\n };\n\n render() {\n const { size, thickness, color, className } = this.props;\n\n return (\n \n \n \n );\n }\n}\n\nexport default Spinner;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js b/docs/components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js similarity index 71% rename from docs/components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js rename to docs/components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js index bcab96926c8a..ad111972727f 100644 --- a/docs/components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js +++ b/docs/components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js @@ -1,4 +1,4 @@ -"use strict";(self.webpackChunk_citizenlab_cl2_component_library=self.webpackChunk_citizenlab_cl2_component_library||[]).push([[659],{"./node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{BN:()=>MDXContext,RP:()=>useMDXComponents,gz:()=>withMDXComponents,xA:()=>MDXProvider});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");const MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return function boundMDXComponent(props){const allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents})}}function useMDXComponents(components){const contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo((()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components}),[contextComponents,components])}const emptyObject={};function MDXProvider({components,children,disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./node_modules/@storybook/addon-actions/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{XI:()=>action});var v4=__webpack_require__("./node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v4.js"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api"),external_STORYBOOK_MODULE_GLOBAL_=__webpack_require__("@storybook/global"),preview_errors=__webpack_require__("./node_modules/@storybook/addon-actions/node_modules/@storybook/core-events/dist/errors/preview-errors.mjs"),ADDON_ID="storybook/actions",EVENT_ID=`${ADDON_ID}/action-event`,config={depth:10,clearOnStoryChange:!0,limit:50},findProto=(obj,callback)=>{let proto=Object.getPrototypeOf(obj);return!proto||callback(proto)?proto:findProto(proto,callback)},serializeArg=a=>{if("object"==typeof(e=a)&&e&&findProto(e,(proto=>/^Synthetic(?:Base)?Event$/.test(proto.constructor.name)))&&"function"==typeof e.persist){let e=Object.create(a.constructor.prototype,Object.getOwnPropertyDescriptors(a));e.persist();let viewDescriptor=Object.getOwnPropertyDescriptor(e,"view"),view=viewDescriptor?.value;return"object"==typeof view&&"Window"===view?.constructor.name&&Object.defineProperty(e,"view",{...viewDescriptor,value:Object.create(view.constructor.prototype)}),e}var e;return a},generateId=()=>"object"==typeof crypto&&"function"==typeof crypto.getRandomValues?(0,v4.A)():Date.now().toString(36)+Math.random().toString(36).substring(2);function action(name,options={}){let actionOptions={...config,...options},handler=function(...args){if(options.implicit){let storyRenderer=("__STORYBOOK_PREVIEW__"in external_STORYBOOK_MODULE_GLOBAL_.global?external_STORYBOOK_MODULE_GLOBAL_.global.__STORYBOOK_PREVIEW__:void 0)?.storyRenders.find((render=>"playing"===render.phase||"rendering"===render.phase));if(storyRenderer){let deprecated=!window?.FEATURES?.disallowImplicitActionsInRenderV8,error=new preview_errors._U({phase:storyRenderer.phase,name,deprecated});if(!deprecated)throw error;console.warn(error)}}let channel=external_STORYBOOK_MODULE_PREVIEW_API_.addons.getChannel(),id=generateId(),serializedArgs=args.map(serializeArg),normalizedArgs=args.length>1?serializedArgs:serializedArgs[0],actionDisplayToEmit={id,count:0,data:{name,args:normalizedArgs},options:{...actionOptions,maxDepth:5+(actionOptions.depth||3),allowFunction:actionOptions.allowFunction||!1}};channel.emit(EVENT_ID,actionDisplayToEmit)};return handler.isAction=!0,handler}},"./node_modules/@storybook/addon-docs/dist/blocks.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Hl:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.Hl,W8:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.W8,gG:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.gG,uY:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.uY});var _storybook_client_logger__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("@storybook/client-logger"),_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");(0,_storybook_client_logger__WEBPACK_IMPORTED_MODULE_0__.deprecate)("Import from '@storybook/addon-docs/blocks' is deprecated. Please import from '@storybook/blocks' instead.")},"./node_modules/@storybook/addon-docs/dist/chunk-HLWAVYOI.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{f:()=>DocsRenderer});var react=__webpack_require__("./node_modules/react/index.js"),react_dom=__webpack_require__("./node_modules/react-dom/index.js"),dist=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs"),defaultComponents={code:dist.XA,a:dist.zE,...dist.Sw},ErrorBoundary=class extends react.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(err){let{showException}=this.props;showException(err)}render(){let{hasError}=this.state,{children}=this.props;return hasError?null:react.createElement(react.Fragment,null,children)}},DocsRenderer=class{constructor(){this.render=async(context,docsParameter,element)=>{let components={...defaultComponents,...docsParameter?.components},TDocs=dist.kQ;return new Promise(((resolve,reject)=>{__webpack_require__.e(294).then(__webpack_require__.bind(__webpack_require__,"./node_modules/@mdx-js/react/index.js")).then((({MDXProvider})=>(async(node,el)=>new Promise((resolve=>{react_dom.render(node,el,(()=>resolve(null)))})))(react.createElement(ErrorBoundary,{showException:reject,key:Math.random()},react.createElement(MDXProvider,{components},react.createElement(TDocs,{context,docsParameter}))),element))).then((()=>resolve()))}))},this.unmount=element=>{var el;el=element,react_dom.unmountComponentAtNode(el)}}}},"./node_modules/@storybook/addon-docs/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{uY:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.uY});__webpack_require__("./node_modules/@storybook/addon-docs/dist/chunk-HLWAVYOI.mjs");var _storybook_blocks__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs")},"./src/components/CardButton/CardButton.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{__namedExportsOrder:()=>__namedExportsOrder,default:()=>CardButton_stories,defaultStory:()=>defaultStory,longTitle:()=>longTitle});var react=__webpack_require__("./node_modules/react/index.js"),lib=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),blocks=__webpack_require__("./node_modules/@storybook/addon-docs/dist/blocks.mjs"),dist=__webpack_require__("./node_modules/@storybook/addon-docs/dist/index.mjs"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),Box=__webpack_require__("./src/components/Box/index.tsx"),Title=__webpack_require__("./src/components/Title/index.tsx"),Text=__webpack_require__("./src/components/Text/index.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const backgroundColor=(0,polished_esm.a)(.1,styleUtils.Tj.tealLight),CardButton=({selected,iconName,icon,title,subtitle,onMouseEnter,onMouseLeave,...rest})=>{const[isHover,setIsHover]=(0,react.useState)(!1);return(0,jsx_runtime.jsxs)(Box.A,{width:"240px",minHeight:"210px",background:selected||isHover?backgroundColor:styleUtils.Tj.white,onMouseEnter:e=>{setIsHover(!0),onMouseEnter?.(e)},onMouseLeave:e=>{setIsHover(!1),onMouseLeave?.(e)},padding:"16px",border:selected?`solid 1px ${styleUtils.Tj.primary}`:`solid 1px ${styleUtils.Tj.grey400}`,style:{cursor:"pointer"},as:"button",display:"flex",flexDirection:"column",alignItems:"flex-start",justifyContent:"flex-start",...rest,children:[iconName&&(0,jsx_runtime.jsx)(Icon.A,{width:"28px",height:"28px",name:iconName,fill:selected?styleUtils.Tj.teal200:styleUtils.Tj.grey400}),icon??null,title&&(0,jsx_runtime.jsx)(Title.A,{variant:"h5",color:selected?"primary":"coolGrey700",textAlign:"left",children:title}),subtitle&&(0,jsx_runtime.jsx)(Text.A,{fontSize:"s",color:selected?"primary":"coolGrey700",textAlign:"left",children:subtitle})]})};CardButton.displayName="CardButton";const components_CardButton=CardButton;try{CardButton.displayName="CardButton",CardButton.__docgenInfo={description:"",displayName:"CardButton",props:{selected:{defaultValue:null,description:"",name:"selected",required:!1,type:{name:"boolean | undefined"}},iconName:{defaultValue:null,description:"",name:"iconName",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"ReactNode"}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string | undefined"}},subtitle:{defaultValue:null,description:"",name:"subtitle",required:!1,type:{name:"string | undefined"}},color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"string | undefined"}},bgColor:{defaultValue:null,description:"",name:"bgColor",required:!1,type:{name:"string | undefined"}},opacity:{defaultValue:null,description:"",name:"opacity",required:!1,type:{name:"number | undefined"}},boxShadow:{defaultValue:null,description:"",name:"boxShadow",required:!1,type:{name:"string | undefined"}},bg:{defaultValue:null,description:"",name:"bg",required:!1,type:{name:"string | undefined"}},background:{defaultValue:null,description:"",name:"background",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},h:{defaultValue:null,description:"",name:"h",required:!1,type:{name:"string | undefined"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string | undefined"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},overflow:{defaultValue:null,description:"",name:"overflow",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowX:{defaultValue:null,description:"",name:"overflowX",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowY:{defaultValue:null,description:"",name:"overflowY",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},flexDirection:{defaultValue:null,description:"",name:"flexDirection",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"initial"'},{value:'"inherit"'},{value:'"row"'},{value:'"row-reverse"'},{value:'"column"'},{value:'"column-reverse"'}]}},flexWrap:{defaultValue:null,description:"",name:"flexWrap",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"initial"'},{value:'"inherit"'},{value:'"nowrap"'},{value:'"wrap"'},{value:'"wrap-reverse"'}]}},alignItems:{defaultValue:null,description:"",name:"alignItems",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"baseline"'},{value:'"stretch"'}]}},justifyContent:{defaultValue:null,description:"",name:"justifyContent",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'}]}},alignContent:{defaultValue:null,description:"",name:"alignContent",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'}]}},order:{defaultValue:null,description:"",name:"order",required:!1,type:{name:"number | undefined"}},flexGrow:{defaultValue:null,description:"",name:"flexGrow",required:!1,type:{name:"number | undefined"}},flexShrink:{defaultValue:null,description:"",name:"flexShrink",required:!1,type:{name:"number | undefined"}},flexBasis:{defaultValue:null,description:"",name:"flexBasis",required:!1,type:{name:"number | undefined"}},flex:{defaultValue:null,description:"",name:"flex",required:!1,type:{name:"string | undefined"}},alignSelf:{defaultValue:null,description:"",name:"alignSelf",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"auto"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"baseline"'},{value:'"stretch"'}]}},gap:{defaultValue:null,description:"",name:"gap",required:!1,type:{name:"string | undefined"}},border:{defaultValue:null,description:"",name:"border",required:!1,type:{name:"string | undefined"}},borderTop:{defaultValue:null,description:"",name:"borderTop",required:!1,type:{name:"string | undefined"}},borderBottom:{defaultValue:null,description:"",name:"borderBottom",required:!1,type:{name:"string | undefined"}},borderLeft:{defaultValue:null,description:"",name:"borderLeft",required:!1,type:{name:"string | undefined"}},borderRight:{defaultValue:null,description:"",name:"borderRight",required:!1,type:{name:"string | undefined"}},borderColor:{defaultValue:null,description:"",name:"borderColor",required:!1,type:{name:"string | undefined"}},borderWidth:{defaultValue:null,description:"",name:"borderWidth",required:!1,type:{name:"string | undefined"}},borderRadius:{defaultValue:null,description:"",name:"borderRadius",required:!1,type:{name:"string | undefined"}},borderStyle:{defaultValue:null,description:"",name:"borderStyle",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"none"'},{value:'"dotted"'},{value:'"dashed"'},{value:'"solid"'},{value:'"double"'},{value:'"groove"'},{value:'"ridge"'},{value:'"inset"'},{value:'"outset"'}]}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/CardButton/index.tsx#CardButton"]={docgenInfo:CardButton.__docgenInfo,name:"CardButton",path:"src/components/CardButton/index.tsx#CardButton"})}catch(__react_docgen_typescript_loader_error){}var addon_actions_dist=__webpack_require__("./node_modules/@storybook/addon-actions/dist/index.mjs");const defaultStory=()=>(0,jsx_runtime.jsxs)("div",{style:{display:"flex"},children:[(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Close",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0}),(0,jsx_runtime.jsx)(components_CardButton,{iconName:"copy",title:"Copy",subtitle:"copy",onClick:(0,addon_actions_dist.XI)("Copy CardButton clicked")})]});defaultStory.storyName="default",defaultStory.parameters={storySource:{source:'
'}};const longTitle=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Looong title with many words and such",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0})});longTitle.storyName="long title",longTitle.parameters={storySource:{source:'
'}};const componentMeta={title:"Components/CardButton",component:components_CardButton,tags:["stories-mdx"],includeStories:["defaultStory","longTitle"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/CardButton",component:components_CardButton}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"cardbutton",children:"CardButton"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_CardButton}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"default",children:(0,jsx_runtime.jsxs)("div",{style:{display:"flex"},children:[(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Close",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0}),(0,jsx_runtime.jsx)(components_CardButton,{iconName:"copy",title:"Copy",subtitle:"copy",onClick:(0,addon_actions_dist.XI)("Copy CardButton clicked")})]})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"long title",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Looong title with many words and such",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0})})})})]})}}};const CardButton_stories=componentMeta,__namedExportsOrder=["defaultStory","longTitle"]},"./src/components/Text/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/react/index.js");var styled_components__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utils/styleUtils.ts"),_Box__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/components/Box/index.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");const StyledText=(0,styled_components__WEBPACK_IMPORTED_MODULE_4__.Ay)(_Box__WEBPACK_IMPORTED_MODULE_2__.A)` +"use strict";(self.webpackChunk_citizenlab_cl2_component_library=self.webpackChunk_citizenlab_cl2_component_library||[]).push([[659],{"./node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{BN:()=>MDXContext,RP:()=>useMDXComponents,gz:()=>withMDXComponents,xA:()=>MDXProvider});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");const MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return function boundMDXComponent(props){const allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents})}}function useMDXComponents(components){const contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo((()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components}),[contextComponents,components])}const emptyObject={};function MDXProvider({components,children,disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./node_modules/@storybook/addon-actions/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{XI:()=>action});var v4=__webpack_require__("./node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v4.js"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api"),external_STORYBOOK_MODULE_GLOBAL_=__webpack_require__("@storybook/global"),preview_errors=__webpack_require__("./node_modules/@storybook/addon-actions/node_modules/@storybook/core-events/dist/errors/preview-errors.mjs"),ADDON_ID="storybook/actions",EVENT_ID=`${ADDON_ID}/action-event`,config={depth:10,clearOnStoryChange:!0,limit:50},findProto=(obj,callback)=>{let proto=Object.getPrototypeOf(obj);return!proto||callback(proto)?proto:findProto(proto,callback)},serializeArg=a=>{if("object"==typeof(e=a)&&e&&findProto(e,(proto=>/^Synthetic(?:Base)?Event$/.test(proto.constructor.name)))&&"function"==typeof e.persist){let e=Object.create(a.constructor.prototype,Object.getOwnPropertyDescriptors(a));e.persist();let viewDescriptor=Object.getOwnPropertyDescriptor(e,"view"),view=viewDescriptor?.value;return"object"==typeof view&&"Window"===view?.constructor.name&&Object.defineProperty(e,"view",{...viewDescriptor,value:Object.create(view.constructor.prototype)}),e}var e;return a},generateId=()=>"object"==typeof crypto&&"function"==typeof crypto.getRandomValues?(0,v4.A)():Date.now().toString(36)+Math.random().toString(36).substring(2);function action(name,options={}){let actionOptions={...config,...options},handler=function(...args){if(options.implicit){let storyRenderer=("__STORYBOOK_PREVIEW__"in external_STORYBOOK_MODULE_GLOBAL_.global?external_STORYBOOK_MODULE_GLOBAL_.global.__STORYBOOK_PREVIEW__:void 0)?.storyRenders.find((render=>"playing"===render.phase||"rendering"===render.phase));if(storyRenderer){let deprecated=!window?.FEATURES?.disallowImplicitActionsInRenderV8,error=new preview_errors._U({phase:storyRenderer.phase,name,deprecated});if(!deprecated)throw error;console.warn(error)}}let channel=external_STORYBOOK_MODULE_PREVIEW_API_.addons.getChannel(),id=generateId(),serializedArgs=args.map(serializeArg),normalizedArgs=args.length>1?serializedArgs:serializedArgs[0],actionDisplayToEmit={id,count:0,data:{name,args:normalizedArgs},options:{...actionOptions,maxDepth:5+(actionOptions.depth||3),allowFunction:actionOptions.allowFunction||!1}};channel.emit(EVENT_ID,actionDisplayToEmit)};return handler.isAction=!0,handler}},"./node_modules/@storybook/addon-docs/dist/blocks.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Hl:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.Hl,W8:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.W8,gG:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.gG,uY:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.uY});var _storybook_client_logger__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("@storybook/client-logger"),_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");(0,_storybook_client_logger__WEBPACK_IMPORTED_MODULE_0__.deprecate)("Import from '@storybook/addon-docs/blocks' is deprecated. Please import from '@storybook/blocks' instead.")},"./node_modules/@storybook/addon-docs/dist/chunk-HLWAVYOI.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{f:()=>DocsRenderer});var react=__webpack_require__("./node_modules/react/index.js"),react_dom=__webpack_require__("./node_modules/react-dom/index.js"),dist=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs"),defaultComponents={code:dist.XA,a:dist.zE,...dist.Sw},ErrorBoundary=class extends react.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(err){let{showException}=this.props;showException(err)}render(){let{hasError}=this.state,{children}=this.props;return hasError?null:react.createElement(react.Fragment,null,children)}},DocsRenderer=class{constructor(){this.render=async(context,docsParameter,element)=>{let components={...defaultComponents,...docsParameter?.components},TDocs=dist.kQ;return new Promise(((resolve,reject)=>{__webpack_require__.e(294).then(__webpack_require__.bind(__webpack_require__,"./node_modules/@mdx-js/react/index.js")).then((({MDXProvider})=>(async(node,el)=>new Promise((resolve=>{react_dom.render(node,el,(()=>resolve(null)))})))(react.createElement(ErrorBoundary,{showException:reject,key:Math.random()},react.createElement(MDXProvider,{components},react.createElement(TDocs,{context,docsParameter}))),element))).then((()=>resolve()))}))},this.unmount=element=>{var el;el=element,react_dom.unmountComponentAtNode(el)}}}},"./node_modules/@storybook/addon-docs/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{uY:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.uY});__webpack_require__("./node_modules/@storybook/addon-docs/dist/chunk-HLWAVYOI.mjs");var _storybook_blocks__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs")},"./src/components/CardButton/CardButton.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{__namedExportsOrder:()=>__namedExportsOrder,default:()=>CardButton_stories,defaultStory:()=>defaultStory,longTitle:()=>longTitle});var react=__webpack_require__("./node_modules/react/index.js"),lib=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),blocks=__webpack_require__("./node_modules/@storybook/addon-docs/dist/blocks.mjs"),dist=__webpack_require__("./node_modules/@storybook/addon-docs/dist/index.mjs"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),Box=__webpack_require__("./src/components/Box/index.tsx"),Title=__webpack_require__("./src/components/Title/index.tsx"),Text=__webpack_require__("./src/components/Text/index.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const backgroundColor=(0,polished_esm.a)(.1,styleUtils.Tj.tealLight),CardButton=({selected,iconName,icon,title,subtitle,onMouseEnter,onMouseLeave,...rest})=>{const[isHover,setIsHover]=(0,react.useState)(!1);return(0,jsx_runtime.jsxs)(Box.A,{width:"240px",minHeight:"210px",background:selected||isHover?backgroundColor:styleUtils.Tj.white,onMouseEnter:e=>{setIsHover(!0),onMouseEnter?.(e)},onMouseLeave:e=>{setIsHover(!1),onMouseLeave?.(e)},padding:"16px",border:selected?`solid 1px ${styleUtils.Tj.primary}`:`solid 1px ${styleUtils.Tj.grey400}`,style:{cursor:"pointer"},as:"button",display:"flex",flexDirection:"column",alignItems:"flex-start",justifyContent:"flex-start",...rest,children:[iconName&&(0,jsx_runtime.jsx)(Icon.A,{width:"28px",height:"28px",name:iconName,fill:selected?styleUtils.Tj.teal200:styleUtils.Tj.grey400}),icon??null,title&&(0,jsx_runtime.jsx)(Title.A,{variant:"h5",color:selected?"primary":"coolGrey700",textAlign:"left",children:title}),subtitle&&(0,jsx_runtime.jsx)(Text.A,{fontSize:"s",color:selected?"primary":"coolGrey700",textAlign:"left",children:subtitle})]})};CardButton.displayName="CardButton";const components_CardButton=CardButton;try{CardButton.displayName="CardButton",CardButton.__docgenInfo={description:"",displayName:"CardButton",props:{selected:{defaultValue:null,description:"",name:"selected",required:!1,type:{name:"boolean | undefined"}},iconName:{defaultValue:null,description:"",name:"iconName",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"ReactNode"}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string | undefined"}},subtitle:{defaultValue:null,description:"",name:"subtitle",required:!1,type:{name:"string | undefined"}},color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"string | undefined"}},bgColor:{defaultValue:null,description:"",name:"bgColor",required:!1,type:{name:"string | undefined"}},opacity:{defaultValue:null,description:"",name:"opacity",required:!1,type:{name:"number | undefined"}},boxShadow:{defaultValue:null,description:"",name:"boxShadow",required:!1,type:{name:"string | undefined"}},bg:{defaultValue:null,description:"",name:"bg",required:!1,type:{name:"string | undefined"}},background:{defaultValue:null,description:"",name:"background",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},h:{defaultValue:null,description:"",name:"h",required:!1,type:{name:"string | undefined"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string | undefined"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},overflow:{defaultValue:null,description:"",name:"overflow",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowX:{defaultValue:null,description:"",name:"overflowX",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowY:{defaultValue:null,description:"",name:"overflowY",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},flexDirection:{defaultValue:null,description:"",name:"flexDirection",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"initial"'},{value:'"inherit"'},{value:'"row"'},{value:'"row-reverse"'},{value:'"column"'},{value:'"column-reverse"'}]}},flexWrap:{defaultValue:null,description:"",name:"flexWrap",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"initial"'},{value:'"inherit"'},{value:'"nowrap"'},{value:'"wrap"'},{value:'"wrap-reverse"'}]}},alignItems:{defaultValue:null,description:"",name:"alignItems",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"baseline"'},{value:'"stretch"'}]}},justifyContent:{defaultValue:null,description:"",name:"justifyContent",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'}]}},alignContent:{defaultValue:null,description:"",name:"alignContent",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'}]}},order:{defaultValue:null,description:"",name:"order",required:!1,type:{name:"number | undefined"}},flexGrow:{defaultValue:null,description:"",name:"flexGrow",required:!1,type:{name:"number | undefined"}},flexShrink:{defaultValue:null,description:"",name:"flexShrink",required:!1,type:{name:"number | undefined"}},flexBasis:{defaultValue:null,description:"",name:"flexBasis",required:!1,type:{name:"number | undefined"}},flex:{defaultValue:null,description:"",name:"flex",required:!1,type:{name:"string | undefined"}},alignSelf:{defaultValue:null,description:"",name:"alignSelf",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"center"'},{value:'"initial"'},{value:'"inherit"'},{value:'"auto"'},{value:'"flex-start"'},{value:'"flex-end"'},{value:'"baseline"'},{value:'"stretch"'}]}},gap:{defaultValue:null,description:"",name:"gap",required:!1,type:{name:"string | undefined"}},border:{defaultValue:null,description:"",name:"border",required:!1,type:{name:"string | undefined"}},borderTop:{defaultValue:null,description:"",name:"borderTop",required:!1,type:{name:"string | undefined"}},borderBottom:{defaultValue:null,description:"",name:"borderBottom",required:!1,type:{name:"string | undefined"}},borderLeft:{defaultValue:null,description:"",name:"borderLeft",required:!1,type:{name:"string | undefined"}},borderRight:{defaultValue:null,description:"",name:"borderRight",required:!1,type:{name:"string | undefined"}},borderColor:{defaultValue:null,description:"",name:"borderColor",required:!1,type:{name:"string | undefined"}},borderWidth:{defaultValue:null,description:"",name:"borderWidth",required:!1,type:{name:"string | undefined"}},borderRadius:{defaultValue:null,description:"",name:"borderRadius",required:!1,type:{name:"string | undefined"}},borderStyle:{defaultValue:null,description:"",name:"borderStyle",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"none"'},{value:'"dotted"'},{value:'"dashed"'},{value:'"solid"'},{value:'"double"'},{value:'"groove"'},{value:'"ridge"'},{value:'"inset"'},{value:'"outset"'}]}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/CardButton/index.tsx#CardButton"]={docgenInfo:CardButton.__docgenInfo,name:"CardButton",path:"src/components/CardButton/index.tsx#CardButton"})}catch(__react_docgen_typescript_loader_error){}var addon_actions_dist=__webpack_require__("./node_modules/@storybook/addon-actions/dist/index.mjs");const defaultStory=()=>(0,jsx_runtime.jsxs)("div",{style:{display:"flex"},children:[(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Close",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0}),(0,jsx_runtime.jsx)(components_CardButton,{iconName:"copy",title:"Copy",subtitle:"copy",onClick:(0,addon_actions_dist.XI)("Copy CardButton clicked")})]});defaultStory.storyName="default",defaultStory.parameters={storySource:{source:'
'}};const longTitle=()=>(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Looong title with many words and such",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0})});longTitle.storyName="long title",longTitle.parameters={storySource:{source:'
'}};const componentMeta={title:"Components/CardButton",component:components_CardButton,tags:["stories-mdx"],includeStories:["defaultStory","longTitle"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/CardButton",component:components_CardButton}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"cardbutton",children:"CardButton"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_CardButton}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"default",children:(0,jsx_runtime.jsxs)("div",{style:{display:"flex"},children:[(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Close",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0}),(0,jsx_runtime.jsx)(components_CardButton,{iconName:"copy",title:"Copy",subtitle:"copy",onClick:(0,addon_actions_dist.XI)("Copy CardButton clicked")})]})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"long title",children:(0,jsx_runtime.jsx)("div",{style:{display:"flex"},children:(0,jsx_runtime.jsx)(components_CardButton,{iconName:"close",title:"Looong title with many words and such",subtitle:"close",onClick:(0,addon_actions_dist.XI)("Close CardButton clicked"),mr:"8px",selected:!0})})})})]})}}};const CardButton_stories=componentMeta,__namedExportsOrder=["defaultStory","longTitle"]},"./src/components/Text/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/react/index.js");var styled_components__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utils/styleUtils.ts"),_Box__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/components/Box/index.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");const StyledText=(0,styled_components__WEBPACK_IMPORTED_MODULE_4__.Ay)(_Box__WEBPACK_IMPORTED_MODULE_2__.A)` line-height: 1.5; ${_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.Pv`direction: rtl;`} ${({variant,color,fontSize,fontWeight,fontStyle,textDecoration,textOverflow,whiteSpace,textAlign,theme})=>styled_components__WEBPACK_IMPORTED_MODULE_4__.AH` @@ -33,4 +33,4 @@ ${"h6"===variant?`\n font-size: ${fontSize?_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.GR[fontSize]:_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.GR.s}px;\n `:""} `} `,Title=({children,variant="h1",color,as,fontSize,fontWeight,...props})=>{const mb=props.mb||props.my||props.m||"16px";return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(StyledTitle,{variant,color,as:as||variant,fontSize,fontWeight,mb,...props,children})};Title.displayName="Title";const __WEBPACK_DEFAULT_EXPORT__=Title;try{Title.displayName="Title",Title.__docgenInfo={description:"",displayName:"Title",props:{variant:{defaultValue:{value:"h1"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"h1"'},{value:'"h2"'},{value:'"h3"'},{value:'"h4"'},{value:'"h5"'},{value:'"h6"'}]}},color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"disabled"'},{value:'"black"'},{value:'"white"'},{value:'"grey800"'},{value:'"grey700"'},{value:'"grey600"'},{value:'"grey500"'},{value:'"grey400"'},{value:'"grey300"'},{value:'"grey200"'},{value:'"grey100"'},{value:'"grey50"'},{value:'"coolGrey700"'},{value:'"coolGrey600"'},{value:'"coolGrey500"'},{value:'"coolGrey300"'},{value:'"blue700"'},{value:'"blue500"'},{value:'"blue400"'},{value:'"teal700"'},{value:'"teal500"'},{value:'"teal400"'},{value:'"teal300"'},{value:'"teal200"'},{value:'"teal100"'},{value:'"teal50"'},{value:'"red100"'},{value:'"red400"'},{value:'"red500"'},{value:'"red600"'},{value:'"red800"'},{value:'"green700"'},{value:'"green500"'},{value:'"green400"'},{value:'"green100"'},{value:'"orange"'},{value:'"brown"'},{value:'"textPrimary"'},{value:'"borderDark"'},{value:'"placeholder"'},{value:'"borderLight"'},{value:'"divider"'},{value:'"textSecondary"'},{value:'"primary"'},{value:'"teal"'},{value:'"tealLight"'},{value:'"error"'},{value:'"errorLight"'},{value:'"success"'},{value:'"successLight"'},{value:'"background"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"facebookMessenger"'},{value:'"tenantPrimary"'},{value:'"tenantSecondary"'},{value:'"tenantText"'}]}},fontSize:{defaultValue:null,description:"",name:"fontSize",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"m"'},{value:'"xs"'},{value:'"s"'},{value:'"base"'},{value:'"l"'},{value:'"xl"'},{value:'"xxl"'},{value:'"xxxl"'},{value:'"xxxxl"'},{value:'"xxxxxl"'}]}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"h1"'},{value:'"h2"'},{value:'"h3"'},{value:'"h4"'},{value:'"h5"'},{value:'"h6"'}]}},fontWeight:{defaultValue:null,description:"",name:"fontWeight",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"bold"'},{value:'"normal"'}]}},fontStyle:{defaultValue:null,description:"",name:"fontStyle",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"normal"'},{value:'"italic"'}]}},textAlign:{defaultValue:null,description:"",name:"textAlign",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"left"'},{value:'"right"'},{value:'"center"'},{value:'"justify"'},{value:'"initial"'},{value:'"inherit"'}]}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},h:{defaultValue:null,description:"",name:"h",required:!1,type:{name:"string | undefined"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string | undefined"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},overflow:{defaultValue:null,description:"",name:"overflow",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowX:{defaultValue:null,description:"",name:"overflowX",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},overflowY:{defaultValue:null,description:"",name:"overflowY",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'},{value:'"scroll"'},{value:'"auto"'}]}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Title/index.tsx#Title"]={docgenInfo:Title.__docgenInfo,name:"Title",path:"src/components/Title/index.tsx#Title"})}catch(__react_docgen_typescript_loader_error){}}}]); -//# sourceMappingURL=components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js.map b/docs/components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js.map similarity index 99% rename from docs/components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js.map rename to docs/components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js.map index 1246db49d1b8..df7fa29cd3d6 100644 --- a/docs/components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js.map +++ b/docs/components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-CardButton-CardButton-stories-mdx.65911a5f.iframe.bundle.js","mappings":";;AAmEA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAKA;AAKA;;AAQA;;;ACvDA;;AAEA;AAQA;AAEA;AACA;;AAEA;AACA;AAKA;AAKA;AAKA;AAKA;AAKA;;AAQA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Text/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Title/index.tsx"],"sourcesContent":["import React from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n MainThemeProps,\n colors,\n fontSizes,\n isRtl,\n Color,\n} from '../../utils/styleUtils';\n\nimport Box, {\n BoxMarginProps,\n BoxPaddingProps,\n BoxPositionProps,\n BoxZIndexProps,\n BoxHeightProps,\n BoxWidthProps,\n BoxDisplayProps,\n BoxOverflowProps,\n BoxVisibilityProps,\n} from '../Box';\n\ntype Variant = 'bodyL' | 'bodyM' | 'bodyS' | 'bodyXs';\ntype FontSize = keyof typeof fontSizes;\ntype FontWeight = 'bold' | 'normal';\ntype FontStyle = 'italic' | 'normal';\ntype TextDecoration = string;\ntype TextOverflow = 'ellipsis' | 'clip';\ntype WhiteSpace =\n | 'normal'\n | 'nowrap'\n | 'pre'\n | 'pre-wrap'\n | 'pre-line'\n | 'break-spaces';\ntype TextAlign =\n | 'left'\n | 'right'\n | 'center'\n | 'justify'\n | 'initial'\n | 'inherit';\n\nexport type TextProps = {\n variant?: Variant;\n color?: Color;\n fontSize?: FontSize;\n as?: 'p' | 'span' | 'blockquote' | 'ul' | 'ol' | 'li';\n fontWeight?: FontWeight;\n fontStyle?: FontStyle;\n textDecoration?: TextDecoration;\n textOverflow?: TextOverflow;\n whiteSpace?: WhiteSpace;\n textAlign?: TextAlign;\n} & BoxMarginProps &\n BoxPaddingProps &\n BoxPositionProps &\n BoxZIndexProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxVisibilityProps &\n React.HTMLAttributes;\n\nconst StyledText = styled(Box)`\n line-height: 1.5;\n ${isRtl`direction: rtl;`}\n ${({\n variant,\n color,\n fontSize,\n fontWeight,\n fontStyle,\n textDecoration,\n textOverflow,\n whiteSpace,\n textAlign,\n theme,\n }: TextProps & { theme: MainThemeProps }) => css`\n color: ${color ? theme.colors[color] : colors.textPrimary};\n font-weight: ${fontWeight ? fontWeight : 'normal'};\n font-style: ${fontStyle ? fontStyle : 'normal'};\n text-decoration: ${textDecoration ? textDecoration : 'none'};\n text-overflow: ${textOverflow ? textOverflow : 'clip'};\n white-space: ${whiteSpace ? whiteSpace : 'normal'};\n ${textAlign ? `text-align: ${textAlign};` : ''}\n ${variant === 'bodyL'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.l}px;\n font-weight: ${fontWeight ? fontWeight : '600'};\n `\n : ''}\n ${variant === 'bodyM'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.m}px;\n `\n : ''}\n ${variant === 'bodyS'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.s}px;\n `\n : ''}\n ${variant === 'bodyXs'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xs}px;\n `\n : ''}\n `}\n`;\n\nconst Text: React.FC = ({\n children,\n variant = 'bodyM',\n color,\n as,\n fontSize,\n fontWeight,\n ...props\n}) => {\n const mb = props.mb || props.my || props.m || '16px';\n\n return (\n \n {children}\n \n );\n};\n\nexport default Text;\n","import React from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n Color,\n colors,\n fontSizes,\n isRtl,\n MainThemeProps,\n} from '../../utils/styleUtils';\n\nimport Box, {\n BoxMarginProps,\n BoxPaddingProps,\n BoxPositionProps,\n BoxZIndexProps,\n BoxHeightProps,\n BoxWidthProps,\n BoxDisplayProps,\n BoxOverflowProps,\n BoxVisibilityProps,\n} from '../Box';\n\ntype Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\ntype FontSize = keyof typeof fontSizes;\ntype FontWeight = 'bold' | 'normal';\ntype FontStyle = 'italic' | 'normal';\ntype TextAlign =\n | 'left'\n | 'right'\n | 'center'\n | 'justify'\n | 'initial'\n | 'inherit';\n\nexport type TitleProps = {\n variant?: Variant;\n color?: Color;\n fontSize?: FontSize;\n as?: Variant;\n fontWeight?: FontWeight;\n fontStyle?: FontStyle;\n textAlign?: TextAlign;\n} & BoxMarginProps &\n BoxPaddingProps &\n BoxPositionProps &\n BoxZIndexProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxVisibilityProps &\n React.HTMLAttributes;\n\nconst StyledTitle = styled(Box)`\n line-height: 1.3;\n\n ${isRtl`direction: rtl;`}\n\n ${({\n variant,\n color,\n fontSize,\n fontWeight,\n fontStyle,\n textAlign,\n }: TitleProps) => css`\n color: ${({ theme }: { theme: MainThemeProps }) =>\n color ? theme.colors[color] : colors.textPrimary};\n font-weight: ${fontWeight ? fontWeight : 'bold'};\n font-style: ${fontStyle ? fontStyle : 'normal'};\n\n ${textAlign ? `text-align: ${textAlign};` : ''}\n ${variant === 'h1'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxxl}px;\n `\n : ''}\n ${variant === 'h2'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxl}px;\n `\n : ''}\n ${variant === 'h3'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xl}px;\n `\n : ''}\n ${variant === 'h4'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.l}px;\n `\n : ''}\n ${variant === 'h5'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.m}px;\n `\n : ''}\n ${variant === 'h6'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.s}px;\n `\n : ''}\n `}\n`;\n\nconst Title: React.FC = ({\n children,\n variant = 'h1',\n color,\n as,\n fontSize,\n fontWeight,\n ...props\n}) => {\n const mb = props.mb || props.my || props.m || '16px';\n\n return (\n \n {children}\n \n );\n};\n\nexport default Title;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-CardButton-CardButton-stories-mdx.b090bb21.iframe.bundle.js","mappings":";;AAmEA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAKA;AAKA;;AAQA;;;ACvDA;;AAEA;AAQA;AAEA;AACA;;AAEA;AACA;AAKA;AAKA;AAKA;AAKA;AAKA;;AAQA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Text/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Title/index.tsx"],"sourcesContent":["import React from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n MainThemeProps,\n colors,\n fontSizes,\n isRtl,\n Color,\n} from '../../utils/styleUtils';\n\nimport Box, {\n BoxMarginProps,\n BoxPaddingProps,\n BoxPositionProps,\n BoxZIndexProps,\n BoxHeightProps,\n BoxWidthProps,\n BoxDisplayProps,\n BoxOverflowProps,\n BoxVisibilityProps,\n} from '../Box';\n\ntype Variant = 'bodyL' | 'bodyM' | 'bodyS' | 'bodyXs';\ntype FontSize = keyof typeof fontSizes;\ntype FontWeight = 'bold' | 'normal';\ntype FontStyle = 'italic' | 'normal';\ntype TextDecoration = string;\ntype TextOverflow = 'ellipsis' | 'clip';\ntype WhiteSpace =\n | 'normal'\n | 'nowrap'\n | 'pre'\n | 'pre-wrap'\n | 'pre-line'\n | 'break-spaces';\ntype TextAlign =\n | 'left'\n | 'right'\n | 'center'\n | 'justify'\n | 'initial'\n | 'inherit';\n\nexport type TextProps = {\n variant?: Variant;\n color?: Color;\n fontSize?: FontSize;\n as?: 'p' | 'span' | 'blockquote' | 'ul' | 'ol' | 'li';\n fontWeight?: FontWeight;\n fontStyle?: FontStyle;\n textDecoration?: TextDecoration;\n textOverflow?: TextOverflow;\n whiteSpace?: WhiteSpace;\n textAlign?: TextAlign;\n} & BoxMarginProps &\n BoxPaddingProps &\n BoxPositionProps &\n BoxZIndexProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxVisibilityProps &\n React.HTMLAttributes;\n\nconst StyledText = styled(Box)`\n line-height: 1.5;\n ${isRtl`direction: rtl;`}\n ${({\n variant,\n color,\n fontSize,\n fontWeight,\n fontStyle,\n textDecoration,\n textOverflow,\n whiteSpace,\n textAlign,\n theme,\n }: TextProps & { theme: MainThemeProps }) => css`\n color: ${color ? theme.colors[color] : colors.textPrimary};\n font-weight: ${fontWeight ? fontWeight : 'normal'};\n font-style: ${fontStyle ? fontStyle : 'normal'};\n text-decoration: ${textDecoration ? textDecoration : 'none'};\n text-overflow: ${textOverflow ? textOverflow : 'clip'};\n white-space: ${whiteSpace ? whiteSpace : 'normal'};\n ${textAlign ? `text-align: ${textAlign};` : ''}\n ${variant === 'bodyL'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.l}px;\n font-weight: ${fontWeight ? fontWeight : '600'};\n `\n : ''}\n ${variant === 'bodyM'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.m}px;\n `\n : ''}\n ${variant === 'bodyS'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.s}px;\n `\n : ''}\n ${variant === 'bodyXs'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xs}px;\n `\n : ''}\n `}\n`;\n\nconst Text: React.FC = ({\n children,\n variant = 'bodyM',\n color,\n as,\n fontSize,\n fontWeight,\n ...props\n}) => {\n const mb = props.mb || props.my || props.m || '16px';\n\n return (\n \n {children}\n \n );\n};\n\nexport default Text;\n","import React from 'react';\nimport styled, { css } from 'styled-components';\nimport {\n Color,\n colors,\n fontSizes,\n isRtl,\n MainThemeProps,\n} from '../../utils/styleUtils';\n\nimport Box, {\n BoxMarginProps,\n BoxPaddingProps,\n BoxPositionProps,\n BoxZIndexProps,\n BoxHeightProps,\n BoxWidthProps,\n BoxDisplayProps,\n BoxOverflowProps,\n BoxVisibilityProps,\n} from '../Box';\n\ntype Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\ntype FontSize = keyof typeof fontSizes;\ntype FontWeight = 'bold' | 'normal';\ntype FontStyle = 'italic' | 'normal';\ntype TextAlign =\n | 'left'\n | 'right'\n | 'center'\n | 'justify'\n | 'initial'\n | 'inherit';\n\nexport type TitleProps = {\n variant?: Variant;\n color?: Color;\n fontSize?: FontSize;\n as?: Variant;\n fontWeight?: FontWeight;\n fontStyle?: FontStyle;\n textAlign?: TextAlign;\n} & BoxMarginProps &\n BoxPaddingProps &\n BoxPositionProps &\n BoxZIndexProps &\n BoxHeightProps &\n BoxWidthProps &\n BoxDisplayProps &\n BoxOverflowProps &\n BoxVisibilityProps &\n React.HTMLAttributes;\n\nconst StyledTitle = styled(Box)`\n line-height: 1.3;\n\n ${isRtl`direction: rtl;`}\n\n ${({\n variant,\n color,\n fontSize,\n fontWeight,\n fontStyle,\n textAlign,\n }: TitleProps) => css`\n color: ${({ theme }: { theme: MainThemeProps }) =>\n color ? theme.colors[color] : colors.textPrimary};\n font-weight: ${fontWeight ? fontWeight : 'bold'};\n font-style: ${fontStyle ? fontStyle : 'normal'};\n\n ${textAlign ? `text-align: ${textAlign};` : ''}\n ${variant === 'h1'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxxl}px;\n `\n : ''}\n ${variant === 'h2'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xxl}px;\n `\n : ''}\n ${variant === 'h3'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.xl}px;\n `\n : ''}\n ${variant === 'h4'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.l}px;\n `\n : ''}\n ${variant === 'h5'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.m}px;\n `\n : ''}\n ${variant === 'h6'\n ? `\n font-size: ${fontSize ? fontSizes[fontSize] : fontSizes.s}px;\n `\n : ''}\n `}\n`;\n\nconst Title: React.FC = ({\n children,\n variant = 'h1',\n color,\n as,\n fontSize,\n fontWeight,\n ...props\n}) => {\n const mb = props.mb || props.my || props.m || '16px';\n\n return (\n \n {children}\n \n );\n};\n\nexport default Title;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js b/docs/components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js similarity index 83% rename from docs/components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js rename to docs/components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js index 111ae9f0a2b6..9d0da4312efb 100644 --- a/docs/components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js +++ b/docs/components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js @@ -55,5 +55,5 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js.map \ No newline at end of file +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); +//# sourceMappingURL=components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js.map b/docs/components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js.map similarity index 98% rename from docs/components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js.map rename to docs/components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js.map index e4db4e4341e1..7f86344bce3a 100644 --- a/docs/components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js.map +++ b/docs/components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-Checkbox-Checkbox-stories-mdx.7ca18a6e.iframe.bundle.js","mappings":";AAWA;AAGA;;AAIA;;AAIA;;;;;AAKA;AAGA;AACA;AAGA;AAKA;;AAmCA;AACA;AACA;;;;AAIA;;;;AAIA;AACA;;AAwBA;;;;ACxFA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Checkbox/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { Color, defaultOutline } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Icon from '../../components/Icon';\nimport { hideVisually } from 'polished';\nimport IconTooltip from '../IconTooltip';\nimport Box, { BoxMarginProps, BoxPaddingProps } from '../Box';\nimport { getColor } from './utils';\n\nconst CheckboxContainer = styled.div<{ hasLabel: boolean }>`\n margin-right: ${({ hasLabel }) => (hasLabel ? '10px' : '0px')};\n`;\n\nconst CheckMarkIcon = styled(Icon)<{ size: string }>`\n fill: #fff;\n`;\n\nconst IndeterminateIcon = styled(Icon)<{ size: string }>`\n fill: #fff;\n`;\n\nconst StyledBox = styled(Box)<{ disabled: boolean }>`\n position: relative;\n flex: 1;\n display: flex;\n align-items: center;\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n`;\n\nconst HiddenCheckbox = styled.input.attrs({ type: 'checkbox' })`\n ${hideVisually()};\n`;\n\nconst StyledCheckbox = styled.div<{\n checkedOrIndeterminate: boolean;\n checkedColor?: Color;\n size: string;\n}>`\n ${(props) => `\n background: ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'background',\n })};\n border: solid 1px ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'border',\n })};\n &.enabled {\n &:hover {\n background: ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'hoverBackground',\n })};\n border-color: ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'hoverBorder',\n })};\n }\n }\n `}\n\n width: ${({ size }) => parseInt(size, 10)}px;\n height: ${({ size }) => parseInt(size, 10)}px;\n flex: 0 0 ${({ size }) => parseInt(size, 10)}px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ${(props) => props.theme.borderRadius};\n\n transition: all 120ms ease-out;\n\n ${HiddenCheckbox}.focus-visible + & {\n ${defaultOutline};\n }\n`;\n\ntype DefaultProps = {\n size?: string;\n disabled?: boolean;\n indeterminate?: boolean;\n};\n\ntype Props = DefaultProps &\n BoxPaddingProps &\n BoxMarginProps & {\n checked: boolean;\n onChange: (event: React.ChangeEvent) => void;\n className?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n id?: string;\n name?: string;\n stopLabelPropagation?: boolean;\n checkedColor?: Color;\n };\n\nconst Checkbox = ({\n id,\n label,\n labelTooltipText,\n stopLabelPropagation,\n size = '24px',\n checked,\n className,\n disabled = false,\n indeterminate = false,\n onChange,\n name,\n checkedColor,\n ...rest\n}: Props) => {\n const hasLabel = !!label;\n\n const handleLabelClick = (event: React.MouseEvent) => {\n stopLabelPropagation && event.stopPropagation();\n };\n const checkedOrIndeterminate = checked || indeterminate;\n\n return (\n \n \n \n \n {checked && (\n \n )}\n {indeterminate && (\n \n )}\n \n \n \n {label}\n \n {labelTooltipText && }\n \n );\n};\n\nexport default Checkbox;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-Checkbox-Checkbox-stories-mdx.20bfb43d.iframe.bundle.js","mappings":";AAWA;AAGA;;AAIA;;AAIA;;;;;AAKA;AAGA;AACA;AAGA;AAKA;;AAmCA;AACA;AACA;;;;AAIA;;;;AAIA;AACA;;AAwBA;;;;ACxFA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Checkbox/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { Color, defaultOutline } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Icon from '../../components/Icon';\nimport { hideVisually } from 'polished';\nimport IconTooltip from '../IconTooltip';\nimport Box, { BoxMarginProps, BoxPaddingProps } from '../Box';\nimport { getColor } from './utils';\n\nconst CheckboxContainer = styled.div<{ hasLabel: boolean }>`\n margin-right: ${({ hasLabel }) => (hasLabel ? '10px' : '0px')};\n`;\n\nconst CheckMarkIcon = styled(Icon)<{ size: string }>`\n fill: #fff;\n`;\n\nconst IndeterminateIcon = styled(Icon)<{ size: string }>`\n fill: #fff;\n`;\n\nconst StyledBox = styled(Box)<{ disabled: boolean }>`\n position: relative;\n flex: 1;\n display: flex;\n align-items: center;\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n`;\n\nconst HiddenCheckbox = styled.input.attrs({ type: 'checkbox' })`\n ${hideVisually()};\n`;\n\nconst StyledCheckbox = styled.div<{\n checkedOrIndeterminate: boolean;\n checkedColor?: Color;\n size: string;\n}>`\n ${(props) => `\n background: ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'background',\n })};\n border: solid 1px ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'border',\n })};\n &.enabled {\n &:hover {\n background: ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'hoverBackground',\n })};\n border-color: ${getColor({\n checkedColor: props.checkedColor\n ? props.theme.colors[props.checkedColor]\n : undefined,\n checkedOrIndeterminate: props.checkedOrIndeterminate,\n element: 'hoverBorder',\n })};\n }\n }\n `}\n\n width: ${({ size }) => parseInt(size, 10)}px;\n height: ${({ size }) => parseInt(size, 10)}px;\n flex: 0 0 ${({ size }) => parseInt(size, 10)}px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ${(props) => props.theme.borderRadius};\n\n transition: all 120ms ease-out;\n\n ${HiddenCheckbox}.focus-visible + & {\n ${defaultOutline};\n }\n`;\n\ntype DefaultProps = {\n size?: string;\n disabled?: boolean;\n indeterminate?: boolean;\n};\n\ntype Props = DefaultProps &\n BoxPaddingProps &\n BoxMarginProps & {\n checked: boolean;\n onChange: (event: React.ChangeEvent) => void;\n className?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n id?: string;\n name?: string;\n stopLabelPropagation?: boolean;\n checkedColor?: Color;\n };\n\nconst Checkbox = ({\n id,\n label,\n labelTooltipText,\n stopLabelPropagation,\n size = '24px',\n checked,\n className,\n disabled = false,\n indeterminate = false,\n onChange,\n name,\n checkedColor,\n ...rest\n}: Props) => {\n const hasLabel = !!label;\n\n const handleLabelClick = (event: React.MouseEvent) => {\n stopLabelPropagation && event.stopPropagation();\n };\n const checkedOrIndeterminate = checked || indeterminate;\n\n return (\n \n \n \n \n {checked && (\n \n )}\n {indeterminate && (\n \n )}\n \n \n \n {label}\n \n {labelTooltipText && }\n \n );\n};\n\nexport default Checkbox;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js b/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js similarity index 82% rename from docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js rename to docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js index c7db679ef923..0a66e4f1bca6 100644 --- a/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js +++ b/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js @@ -67,7 +67,7 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Input/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>components_Input});var react=__webpack_require__("./node_modules/react/index.js"),lodash_es_size=__webpack_require__("./node_modules/lodash-es/size.js"),isNil=__webpack_require__("./node_modules/lodash-es/isNil.js"),isEmpty=__webpack_require__("./node_modules/lodash-es/isEmpty.js"),isBoolean=__webpack_require__("./node_modules/lodash-es/isBoolean.js"),CSSTransition=__webpack_require__("./node_modules/react-transition-group/esm/CSSTransition.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const ErrorMessageText=styled_components_browser_esm.Ay.div` +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Input/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>components_Input});var react=__webpack_require__("./node_modules/react/index.js"),lodash_es_size=__webpack_require__("./node_modules/lodash-es/size.js"),isNil=__webpack_require__("./node_modules/lodash-es/isNil.js"),isEmpty=__webpack_require__("./node_modules/lodash-es/isEmpty.js"),isBoolean=__webpack_require__("./node_modules/lodash-es/isBoolean.js"),CSSTransition=__webpack_require__("./node_modules/react-transition-group/esm/CSSTransition.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const ErrorMessageText=styled_components_browser_esm.Ay.div` flex: 1 1 100%; color: ${styleUtils.Tj.red600}; font-size: ${styleUtils.GR.base}px; @@ -199,4 +199,4 @@ ${_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.bS} } `;class Label extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent{handleOnClick=event=>{this.props.onClick&&this.props.onClick(event)};render(){const{value,htmlFor,children,id,className,hidden}=this.props;return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Container,{id,className:`${className||""} ${hidden?"invisible":""}`,htmlFor,onClick:this.handleOnClick,children:children||value})}}Label.displayName="Label";try{Label.displayName="Label",Label.__docgenInfo={description:"",displayName:"Label",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | Element | undefined"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string | undefined"}},hidden:{defaultValue:null,description:"",name:"hidden",required:!1,type:{name:"boolean | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((event: MouseEvent) => void) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Label/index.tsx#Label"]={docgenInfo:Label.__docgenInfo,name:"Label",path:"src/components/Label/index.tsx#Label"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js.map b/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js.map similarity index 99% rename from docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js.map rename to docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js.map index c37444dab188..f27ebf2b76e1 100644 --- a/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js.map +++ b/docs/components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-ColorPickerInput-ColorPickerInput-stories-mdx.a45c1136.iframe.bundle.js","mappings":";;;;AAiBA;;;;AAIA;AACA;;;AAGA;;;;;;AAQA;;;;;;;AAOA;;AAIA;;;;;;;;;AAWA;;;;;;AAuBA;;;;ACzDA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;ACpEA;AACA;;;;;AAKA;;;;;AAKA;;;;;;;;AAUA;;AAEA;;;;AAMA;;;;;AAKA;AACA;AACA;AAIA;;;;AAIA;AACA;AACA;;;;;;;;;;AAlDA;AAAA;;;;;;;;;;;AAAA;AAAA;;;AA+FA;;AChGA;;AAOA;;AATA;AAiBA;ACKA;;;;;;;;;;AAUA;;AAEA;;;AAGA;;AAIA;AACA;AACA;;;;AAIA;;;AAGA;;;;;;;;AAgDA;ACjGA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/ColorPickerInput/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Error/index.tsx","webpack://@citizenlab/cl2-component-library/./src/utils/a11y.ts","webpack://@citizenlab/cl2-component-library/./src/components/Input/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { PureComponent, FormEvent } from 'react';\nimport styled from 'styled-components';\nimport { colors } from '../../utils/styleUtils';\nimport { ChromePicker, ColorResult } from 'react-color';\nimport Input from '../Input';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\nimport testEnv from '../../utils/testUtils/testEnv';\n\nconst Container = styled.div``;\n\nconst InputWrapper = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n`;\n\nconst SelectedColorSquare = styled.div`\n flex: 0 0 46px;\n width: 46px;\n height: 46px;\n border: 1px solid ${colors.grey700};\n border-radius: ${({ theme }) => theme.borderRadius};\n border-bottom-right-radius: 0px;\n border-top-right-radius: 0px;\n background: ${(props) => props.color};\n cursor: pointer;\n position: absolute;\n top: 0px;\n left: 0px;\n z-index: 1;\n`;\n\nconst SelectedColorValueInput = styled(Input)`\n input {\n height: 46px;\n width: 180px;\n padding: 0px;\n padding-left: 54px;\n cursor: pointer;\n border: 1px solid ${colors.grey700};\n }\n`;\n\nconst Popover = styled.div`\n position: absolute;\n top: 50px;\n left: 0px;\n z-index: 2;\n\n & * {\n font-family: 'Public Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;\n }\n`;\n\nconst Cover = styled.div`\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n`;\n\nexport interface Props {\n id?: string;\n type: 'text';\n value: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n className?: string;\n onChange: (arg: string) => void;\n}\n\ninterface State {\n opened: boolean;\n value: string;\n}\n\nclass ColorPickerInput extends PureComponent {\n constructor(props: Props) {\n super(props);\n this.state = {\n opened: false,\n value: props.value,\n };\n }\n\n componentDidMount() {\n this.setState({ value: this.props.value });\n }\n\n componentDidUpdate(prevProps: Props) {\n if (!this.state.opened && prevProps.value !== this.props.value) {\n this.setState({ value: this.props.value });\n }\n }\n\n open = (event: FormEvent) => {\n event.preventDefault();\n this.setState({ opened: true });\n };\n\n close = (event: FormEvent) => {\n event.preventDefault();\n this.setState({ opened: false });\n };\n\n change = (ColorDescription: ColorResult) => {\n const hexColor = ColorDescription.hex;\n this.setState({ value: hexColor });\n this.props.onChange(this.state.value);\n };\n\n render() {\n const { label, labelTooltipText, className, id } = this.props;\n const { opened, value } = this.state;\n\n return (\n \n {label && (\n \n )}\n\n \n \n \n {opened && (\n \n \n \n \n )}\n \n \n );\n }\n}\n\nexport default ColorPickerInput;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon from '../Icon';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\nconst timeout = 350;\n\nconst ErrorMessageText = styled.div`\n flex: 1 1 100%;\n color: ${colors.red600};\n font-size: ${fontSizes.base}px;\n line-height: normal;\n font-weight: 400;\n\n a {\n color: ${colors.red600};\n font-weight: 500;\n text-decoration: underline;\n\n &:hover {\n color: ${darken(0.2, colors.red600)};\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 500;\n }\n`;\n\nconst ErrorIcon = styled(Icon)`\n flex: 0 0 24px;\n fill: ${colors.red600};\n padding: 0px;\n margin: 0px;\n margin-right: 10px;\n`;\n\nconst ContainerInner = styled.div<{ showBackground: boolean }>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 13px;\n border-radius: ${(props) => props.theme.borderRadius};\n background: ${colors.red100};\n background: ${(props) =>\n props.showBackground ? colors.red100 : 'transparent'};\n`;\n\nconst Container = styled.div<{ marginTop: string; marginBottom: string }>`\n position: relative;\n overflow: hidden;\n\n ${ContainerInner} {\n margin-top: ${(props) => props.marginTop};\n margin-bottom: ${(props) => props.marginBottom};\n }\n\n &.error-enter {\n max-height: 0px;\n opacity: 0;\n\n &.error-enter-active {\n max-height: 60px;\n opacity: 1;\n transition: max-height ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1),\n opacity ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1);\n }\n }\n\n &.error-exit {\n max-height: 100px;\n opacity: 1;\n\n &.error-exit-active {\n max-height: 0px;\n opacity: 0;\n transition: max-height ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1),\n opacity ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n }\n`;\n\ninterface DefaultProps {\n marginTop: string;\n marginBottom: string;\n showIcon: boolean;\n showBackground: boolean;\n className: string;\n animate: boolean | undefined;\n}\n\ninterface Props extends DefaultProps {\n text?: string | null;\n}\n\ninterface State {\n mounted: boolean;\n}\n\nclass Error extends PureComponent {\n static defaultProps: DefaultProps = {\n marginTop: '3px',\n marginBottom: '0px',\n showIcon: true,\n showBackground: true,\n className: '',\n animate: true,\n };\n\n constructor(props: Props) {\n super(props);\n this.state = {\n mounted: false,\n };\n }\n\n componentDidMount() {\n this.setState({ mounted: true });\n }\n\n componentWillUnmount() {\n this.setState({ mounted: false });\n }\n\n render() {\n const { mounted } = this.state;\n const {\n text,\n marginTop,\n marginBottom,\n showIcon,\n showBackground,\n className,\n animate,\n } = this.props;\n\n return (\n \n \n \n {showIcon && (\n \n )}\n {text &&

{text}

}\n \n \n \n );\n }\n}\n\nexport default Error;\n","import styled from 'styled-components';\nimport { hideVisually } from 'polished';\nimport { invisibleA11yText } from './styleUtils';\n\nexport const HiddenLabel = styled.label`\n span:first-child {\n ${hideVisually()}\n }\n`;\n\n/**\n * Our fieldsets usually don't have borders\n */\nexport const Fieldset = styled.fieldset`\n border: none;\n`;\n\n/**\n * Wrap in this component any element that should only be visible by screen readers\n */\nexport const ScreenReaderOnly = styled.span`\n ${invisibleA11yText()}\n`;\n","import React, { PureComponent, FormEvent, KeyboardEvent } from 'react';\nimport { isNil, isEmpty, size as lodashSize, isBoolean } from 'lodash-es';\n\n// components\nimport Error from '../Error';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\n\n// style\nimport styled from 'styled-components';\nimport {\n colors,\n fontSizes,\n defaultInputStyle,\n defaultStyles,\n isRtl,\n} from '../../utils/styleUtils';\nimport { ScreenReaderOnly } from '../../utils/a11y';\n\n// typings\nimport { Locale, InputSize } from '../../utils/typings';\n\ninterface ContainerProps {\n size: InputSize;\n}\n\nconst Container = styled.div`\n width: 100%;\n position: relative;\n\n input {\n width: 100%;\n\n &.hasMaxCharCount {\n padding-right: 62px;\n }\n ${isRtl`\n &.hasMaxCharCount {\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 62px;\n }`}\n ${defaultInputStyle};\n }\n`;\n\nconst CharCount = styled.div<{ inputSize?: InputSize }>`\n color: ${colors.textSecondary};\n font-size: ${fontSizes.s}px;\n font-weight: 400;\n text-align: right;\n position: absolute;\n bottom: ${({ inputSize }) => (inputSize === 'small' ? '10px' : '14px')};\n right: 10px;\n\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n\n &.error {\n color: red;\n }\n`;\n\nexport interface InputProps {\n ariaLabel?: string;\n id?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n value?: string | null;\n locale?: Locale;\n type: 'text' | 'email' | 'password' | 'number' | 'date';\n placeholder?: string | null;\n error?: string | null;\n onChange?: (arg: string, locale: Locale | undefined) => void;\n onFocus?: (arg: FormEvent) => void;\n onBlur?: (arg: FormEvent) => void;\n setRef?: (arg: HTMLInputElement) => void | undefined;\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocus?: boolean;\n min?: string;\n max?: string;\n name?: string;\n maxCharCount?: number;\n disabled?: boolean;\n spellCheck?: boolean;\n readOnly?: boolean;\n required?: boolean;\n autocomplete?:\n | 'email'\n | 'given-name'\n | 'family-name'\n | 'current-password'\n | 'new-password'\n | 'off'\n | 'on'; // https://www.w3.org/TR/WCAG21/#input-purposes\n a11yCharactersLeftMessage?: string;\n className?: string;\n size?: InputSize;\n 'data-testid'?: string;\n}\n\nclass Input extends PureComponent {\n handleOnChange = (event: FormEvent) => {\n const { maxCharCount, onChange, locale } = this.props;\n\n if (\n !maxCharCount ||\n lodashSize(event.currentTarget.value) <= maxCharCount\n ) {\n if (onChange) {\n onChange(event.currentTarget.value, locale);\n }\n }\n };\n\n handleOnBlur = (event: FormEvent) => {\n const { onBlur } = this.props;\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n handleRef = (element: HTMLInputElement) => {\n this.props.setRef && this.props.setRef(element);\n };\n\n render() {\n const {\n label,\n labelTooltipText,\n ariaLabel,\n a11yCharactersLeftMessage,\n className,\n onKeyDown,\n } = this.props;\n const {\n id,\n type,\n name,\n maxCharCount,\n min,\n max,\n autoFocus,\n onFocus,\n disabled,\n spellCheck,\n readOnly,\n required,\n autocomplete,\n size = 'medium',\n 'data-testid': dataTestId,\n } = this.props;\n const hasError = !isNil(this.props.error) && !isEmpty(this.props.error);\n const optionalProps = isBoolean(spellCheck) ? { spellCheck } : null;\n const value = !isNil(this.props.value) ? this.props.value : '';\n const placeholder = this.props.placeholder || '';\n const error = this.props.error || null;\n const currentCharCount = maxCharCount && lodashSize(value);\n const tooManyChars = !!(\n maxCharCount &&\n currentCharCount &&\n currentCharCount > maxCharCount\n );\n\n return (\n \n {label && (\n \n )}\n\n \n\n {maxCharCount && (\n <>\n {a11yCharactersLeftMessage && (\n \n {a11yCharactersLeftMessage}\n \n )}\n \n {currentCharCount}/{maxCharCount}\n \n \n )}\n\n \n \n );\n }\n}\n\nexport default Input;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-ColorPickerInput-ColorPickerInput-stories-mdx.e6a0e8c4.iframe.bundle.js","mappings":";;;;AAiBA;;;;AAIA;AACA;;;AAGA;;;;;;AAQA;;;;;;;AAOA;;AAIA;;;;;;;;;AAWA;;;;;;AAuBA;;;;ACzDA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;ACpEA;AACA;;;;;AAKA;;;;;AAKA;;;;;;;;AAUA;;AAEA;;;;AAMA;;;;;AAKA;AACA;AACA;AAIA;;;;AAIA;AACA;AACA;;;;;;;;;;AAlDA;AAAA;;;;;;;;;;;AAAA;AAAA;;;AA+FA;;AChGA;;AAOA;;AATA;AAiBA;ACKA;;;;;;;;;;AAUA;;AAEA;;;AAGA;;AAIA;AACA;AACA;;;;AAIA;;;AAGA;;;;;;;;AAgDA;ACjGA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/ColorPickerInput/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Error/index.tsx","webpack://@citizenlab/cl2-component-library/./src/utils/a11y.ts","webpack://@citizenlab/cl2-component-library/./src/components/Input/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { PureComponent, FormEvent } from 'react';\nimport styled from 'styled-components';\nimport { colors } from '../../utils/styleUtils';\nimport { ChromePicker, ColorResult } from 'react-color';\nimport Input from '../Input';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\nimport testEnv from '../../utils/testUtils/testEnv';\n\nconst Container = styled.div``;\n\nconst InputWrapper = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n`;\n\nconst SelectedColorSquare = styled.div`\n flex: 0 0 46px;\n width: 46px;\n height: 46px;\n border: 1px solid ${colors.grey700};\n border-radius: ${({ theme }) => theme.borderRadius};\n border-bottom-right-radius: 0px;\n border-top-right-radius: 0px;\n background: ${(props) => props.color};\n cursor: pointer;\n position: absolute;\n top: 0px;\n left: 0px;\n z-index: 1;\n`;\n\nconst SelectedColorValueInput = styled(Input)`\n input {\n height: 46px;\n width: 180px;\n padding: 0px;\n padding-left: 54px;\n cursor: pointer;\n border: 1px solid ${colors.grey700};\n }\n`;\n\nconst Popover = styled.div`\n position: absolute;\n top: 50px;\n left: 0px;\n z-index: 2;\n\n & * {\n font-family: 'Public Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;\n }\n`;\n\nconst Cover = styled.div`\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n`;\n\nexport interface Props {\n id?: string;\n type: 'text';\n value: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n className?: string;\n onChange: (arg: string) => void;\n}\n\ninterface State {\n opened: boolean;\n value: string;\n}\n\nclass ColorPickerInput extends PureComponent {\n constructor(props: Props) {\n super(props);\n this.state = {\n opened: false,\n value: props.value,\n };\n }\n\n componentDidMount() {\n this.setState({ value: this.props.value });\n }\n\n componentDidUpdate(prevProps: Props) {\n if (!this.state.opened && prevProps.value !== this.props.value) {\n this.setState({ value: this.props.value });\n }\n }\n\n open = (event: FormEvent) => {\n event.preventDefault();\n this.setState({ opened: true });\n };\n\n close = (event: FormEvent) => {\n event.preventDefault();\n this.setState({ opened: false });\n };\n\n change = (ColorDescription: ColorResult) => {\n const hexColor = ColorDescription.hex;\n this.setState({ value: hexColor });\n this.props.onChange(this.state.value);\n };\n\n render() {\n const { label, labelTooltipText, className, id } = this.props;\n const { opened, value } = this.state;\n\n return (\n \n {label && (\n \n )}\n\n \n \n \n {opened && (\n \n \n \n \n )}\n \n \n );\n }\n}\n\nexport default ColorPickerInput;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon from '../Icon';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\nconst timeout = 350;\n\nconst ErrorMessageText = styled.div`\n flex: 1 1 100%;\n color: ${colors.red600};\n font-size: ${fontSizes.base}px;\n line-height: normal;\n font-weight: 400;\n\n a {\n color: ${colors.red600};\n font-weight: 500;\n text-decoration: underline;\n\n &:hover {\n color: ${darken(0.2, colors.red600)};\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 500;\n }\n`;\n\nconst ErrorIcon = styled(Icon)`\n flex: 0 0 24px;\n fill: ${colors.red600};\n padding: 0px;\n margin: 0px;\n margin-right: 10px;\n`;\n\nconst ContainerInner = styled.div<{ showBackground: boolean }>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 13px;\n border-radius: ${(props) => props.theme.borderRadius};\n background: ${colors.red100};\n background: ${(props) =>\n props.showBackground ? colors.red100 : 'transparent'};\n`;\n\nconst Container = styled.div<{ marginTop: string; marginBottom: string }>`\n position: relative;\n overflow: hidden;\n\n ${ContainerInner} {\n margin-top: ${(props) => props.marginTop};\n margin-bottom: ${(props) => props.marginBottom};\n }\n\n &.error-enter {\n max-height: 0px;\n opacity: 0;\n\n &.error-enter-active {\n max-height: 60px;\n opacity: 1;\n transition: max-height ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1),\n opacity ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1);\n }\n }\n\n &.error-exit {\n max-height: 100px;\n opacity: 1;\n\n &.error-exit-active {\n max-height: 0px;\n opacity: 0;\n transition: max-height ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1),\n opacity ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n }\n`;\n\ninterface DefaultProps {\n marginTop: string;\n marginBottom: string;\n showIcon: boolean;\n showBackground: boolean;\n className: string;\n animate: boolean | undefined;\n}\n\ninterface Props extends DefaultProps {\n text?: string | null;\n}\n\ninterface State {\n mounted: boolean;\n}\n\nclass Error extends PureComponent {\n static defaultProps: DefaultProps = {\n marginTop: '3px',\n marginBottom: '0px',\n showIcon: true,\n showBackground: true,\n className: '',\n animate: true,\n };\n\n constructor(props: Props) {\n super(props);\n this.state = {\n mounted: false,\n };\n }\n\n componentDidMount() {\n this.setState({ mounted: true });\n }\n\n componentWillUnmount() {\n this.setState({ mounted: false });\n }\n\n render() {\n const { mounted } = this.state;\n const {\n text,\n marginTop,\n marginBottom,\n showIcon,\n showBackground,\n className,\n animate,\n } = this.props;\n\n return (\n \n \n \n {showIcon && (\n \n )}\n {text &&

{text}

}\n \n \n \n );\n }\n}\n\nexport default Error;\n","import styled from 'styled-components';\nimport { hideVisually } from 'polished';\nimport { invisibleA11yText } from './styleUtils';\n\nexport const HiddenLabel = styled.label`\n span:first-child {\n ${hideVisually()}\n }\n`;\n\n/**\n * Our fieldsets usually don't have borders\n */\nexport const Fieldset = styled.fieldset`\n border: none;\n`;\n\n/**\n * Wrap in this component any element that should only be visible by screen readers\n */\nexport const ScreenReaderOnly = styled.span`\n ${invisibleA11yText()}\n`;\n","import React, { PureComponent, FormEvent, KeyboardEvent } from 'react';\nimport { isNil, isEmpty, size as lodashSize, isBoolean } from 'lodash-es';\n\n// components\nimport Error from '../Error';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\n\n// style\nimport styled from 'styled-components';\nimport {\n colors,\n fontSizes,\n defaultInputStyle,\n defaultStyles,\n isRtl,\n} from '../../utils/styleUtils';\nimport { ScreenReaderOnly } from '../../utils/a11y';\n\n// typings\nimport { Locale, InputSize } from '../../utils/typings';\n\ninterface ContainerProps {\n size: InputSize;\n}\n\nconst Container = styled.div`\n width: 100%;\n position: relative;\n\n input {\n width: 100%;\n\n &.hasMaxCharCount {\n padding-right: 62px;\n }\n ${isRtl`\n &.hasMaxCharCount {\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 62px;\n }`}\n ${defaultInputStyle};\n }\n`;\n\nconst CharCount = styled.div<{ inputSize?: InputSize }>`\n color: ${colors.textSecondary};\n font-size: ${fontSizes.s}px;\n font-weight: 400;\n text-align: right;\n position: absolute;\n bottom: ${({ inputSize }) => (inputSize === 'small' ? '10px' : '14px')};\n right: 10px;\n\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n\n &.error {\n color: red;\n }\n`;\n\nexport interface InputProps {\n ariaLabel?: string;\n id?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n value?: string | null;\n locale?: Locale;\n type: 'text' | 'email' | 'password' | 'number' | 'date';\n placeholder?: string | null;\n error?: string | null;\n onChange?: (arg: string, locale: Locale | undefined) => void;\n onFocus?: (arg: FormEvent) => void;\n onBlur?: (arg: FormEvent) => void;\n setRef?: (arg: HTMLInputElement) => void | undefined;\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocus?: boolean;\n min?: string;\n max?: string;\n name?: string;\n maxCharCount?: number;\n disabled?: boolean;\n spellCheck?: boolean;\n readOnly?: boolean;\n required?: boolean;\n autocomplete?:\n | 'email'\n | 'given-name'\n | 'family-name'\n | 'current-password'\n | 'new-password'\n | 'off'\n | 'on'; // https://www.w3.org/TR/WCAG21/#input-purposes\n a11yCharactersLeftMessage?: string;\n className?: string;\n size?: InputSize;\n 'data-testid'?: string;\n}\n\nclass Input extends PureComponent {\n handleOnChange = (event: FormEvent) => {\n const { maxCharCount, onChange, locale } = this.props;\n\n if (\n !maxCharCount ||\n lodashSize(event.currentTarget.value) <= maxCharCount\n ) {\n if (onChange) {\n onChange(event.currentTarget.value, locale);\n }\n }\n };\n\n handleOnBlur = (event: FormEvent) => {\n const { onBlur } = this.props;\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n handleRef = (element: HTMLInputElement) => {\n this.props.setRef && this.props.setRef(element);\n };\n\n render() {\n const {\n label,\n labelTooltipText,\n ariaLabel,\n a11yCharactersLeftMessage,\n className,\n onKeyDown,\n } = this.props;\n const {\n id,\n type,\n name,\n maxCharCount,\n min,\n max,\n autoFocus,\n onFocus,\n disabled,\n spellCheck,\n readOnly,\n required,\n autocomplete,\n size = 'medium',\n 'data-testid': dataTestId,\n } = this.props;\n const hasError = !isNil(this.props.error) && !isEmpty(this.props.error);\n const optionalProps = isBoolean(spellCheck) ? { spellCheck } : null;\n const value = !isNil(this.props.value) ? this.props.value : '';\n const placeholder = this.props.placeholder || '';\n const error = this.props.error || null;\n const currentCharCount = maxCharCount && lodashSize(value);\n const tooManyChars = !!(\n maxCharCount &&\n currentCharCount &&\n currentCharCount > maxCharCount\n );\n\n return (\n \n {label && (\n \n )}\n\n \n\n {maxCharCount && (\n <>\n {a11yCharactersLeftMessage && (\n \n {a11yCharactersLeftMessage}\n \n )}\n \n {currentCharCount}/{maxCharCount}\n \n \n )}\n\n \n \n );\n }\n}\n\nexport default Input;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js b/docs/components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js similarity index 74% rename from docs/components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js rename to docs/components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js index 6cbe3c5b2d26..81f7e14e6454 100644 --- a/docs/components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js +++ b/docs/components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js @@ -25,5 +25,5 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js.map \ No newline at end of file +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); +//# sourceMappingURL=components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js.map b/docs/components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js.map similarity index 98% rename from docs/components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js.map rename to docs/components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js.map index f4ea5306f01a..7e27adf86ef7 100644 --- a/docs/components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js.map +++ b/docs/components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-IconTooltip-IconTooltip-stories-mdx.6c0ce6bc.iframe.bundle.js","mappings":";;;;AAqBA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx"],"sourcesContent":["import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-IconTooltip-IconTooltip-stories-mdx.f104e663.iframe.bundle.js","mappings":";;;;AAqBA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx"],"sourcesContent":["import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js b/docs/components-Input-Input-stories-mdx.f39798db.iframe.bundle.js similarity index 85% rename from docs/components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js rename to docs/components-Input-Input-stories-mdx.f39798db.iframe.bundle.js index bed4903a6c4a..1012753061ef 100644 --- a/docs/components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js +++ b/docs/components-Input-Input-stories-mdx.f39798db.iframe.bundle.js @@ -25,7 +25,7 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Input/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>components_Input});var react=__webpack_require__("./node_modules/react/index.js"),lodash_es_size=__webpack_require__("./node_modules/lodash-es/size.js"),isNil=__webpack_require__("./node_modules/lodash-es/isNil.js"),isEmpty=__webpack_require__("./node_modules/lodash-es/isEmpty.js"),isBoolean=__webpack_require__("./node_modules/lodash-es/isBoolean.js"),CSSTransition=__webpack_require__("./node_modules/react-transition-group/esm/CSSTransition.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const ErrorMessageText=styled_components_browser_esm.Ay.div` +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Input/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>components_Input});var react=__webpack_require__("./node_modules/react/index.js"),lodash_es_size=__webpack_require__("./node_modules/lodash-es/size.js"),isNil=__webpack_require__("./node_modules/lodash-es/isNil.js"),isEmpty=__webpack_require__("./node_modules/lodash-es/isEmpty.js"),isBoolean=__webpack_require__("./node_modules/lodash-es/isBoolean.js"),CSSTransition=__webpack_require__("./node_modules/react-transition-group/esm/CSSTransition.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const ErrorMessageText=styled_components_browser_esm.Ay.div` flex: 1 1 100%; color: ${styleUtils.Tj.red600}; font-size: ${styleUtils.GR.base}px; @@ -157,4 +157,4 @@ ${_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.bS} } `;class Label extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent{handleOnClick=event=>{this.props.onClick&&this.props.onClick(event)};render(){const{value,htmlFor,children,id,className,hidden}=this.props;return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Container,{id,className:`${className||""} ${hidden?"invisible":""}`,htmlFor,onClick:this.handleOnClick,children:children||value})}}Label.displayName="Label";try{Label.displayName="Label",Label.__docgenInfo={description:"",displayName:"Label",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | Element | undefined"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string | undefined"}},hidden:{defaultValue:null,description:"",name:"hidden",required:!1,type:{name:"boolean | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((event: MouseEvent) => void) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Label/index.tsx#Label"]={docgenInfo:Label.__docgenInfo,name:"Label",path:"src/components/Label/index.tsx#Label"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-Input-Input-stories-mdx.f39798db.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js.map b/docs/components-Input-Input-stories-mdx.f39798db.iframe.bundle.js.map similarity index 99% rename from docs/components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js.map rename to docs/components-Input-Input-stories-mdx.f39798db.iframe.bundle.js.map index d7e4ed356920..f73758614e78 100644 --- a/docs/components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js.map +++ b/docs/components-Input-Input-stories-mdx.f39798db.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-Input-Input-stories-mdx.fbc06919.iframe.bundle.js","mappings":";;;;AAqBA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;ACpEA;AACA;;;;;AAKA;;;;;AAKA;;;;;;;;AAUA;;AAEA;;;;AAMA;;;;;AAKA;AACA;AACA;AAIA;;;;AAIA;AACA;AACA;;;;;;;;;;AAlDA;AAAA;;;;;;;;;;;AAAA;AAAA;;;AA+FA;;AChGA;;AAOA;;AATA;AAiBA;ACKA;;;;;;;;;;AAUA;;AAEA;;;AAGA;;AAIA;AACA;AACA;;;;AAIA;;;AAGA;;;;;;;;AAgDA;ACjGA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Error/index.tsx","webpack://@citizenlab/cl2-component-library/./src/utils/a11y.ts","webpack://@citizenlab/cl2-component-library/./src/components/Input/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon from '../Icon';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\nconst timeout = 350;\n\nconst ErrorMessageText = styled.div`\n flex: 1 1 100%;\n color: ${colors.red600};\n font-size: ${fontSizes.base}px;\n line-height: normal;\n font-weight: 400;\n\n a {\n color: ${colors.red600};\n font-weight: 500;\n text-decoration: underline;\n\n &:hover {\n color: ${darken(0.2, colors.red600)};\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 500;\n }\n`;\n\nconst ErrorIcon = styled(Icon)`\n flex: 0 0 24px;\n fill: ${colors.red600};\n padding: 0px;\n margin: 0px;\n margin-right: 10px;\n`;\n\nconst ContainerInner = styled.div<{ showBackground: boolean }>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 13px;\n border-radius: ${(props) => props.theme.borderRadius};\n background: ${colors.red100};\n background: ${(props) =>\n props.showBackground ? colors.red100 : 'transparent'};\n`;\n\nconst Container = styled.div<{ marginTop: string; marginBottom: string }>`\n position: relative;\n overflow: hidden;\n\n ${ContainerInner} {\n margin-top: ${(props) => props.marginTop};\n margin-bottom: ${(props) => props.marginBottom};\n }\n\n &.error-enter {\n max-height: 0px;\n opacity: 0;\n\n &.error-enter-active {\n max-height: 60px;\n opacity: 1;\n transition: max-height ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1),\n opacity ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1);\n }\n }\n\n &.error-exit {\n max-height: 100px;\n opacity: 1;\n\n &.error-exit-active {\n max-height: 0px;\n opacity: 0;\n transition: max-height ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1),\n opacity ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n }\n`;\n\ninterface DefaultProps {\n marginTop: string;\n marginBottom: string;\n showIcon: boolean;\n showBackground: boolean;\n className: string;\n animate: boolean | undefined;\n}\n\ninterface Props extends DefaultProps {\n text?: string | null;\n}\n\ninterface State {\n mounted: boolean;\n}\n\nclass Error extends PureComponent {\n static defaultProps: DefaultProps = {\n marginTop: '3px',\n marginBottom: '0px',\n showIcon: true,\n showBackground: true,\n className: '',\n animate: true,\n };\n\n constructor(props: Props) {\n super(props);\n this.state = {\n mounted: false,\n };\n }\n\n componentDidMount() {\n this.setState({ mounted: true });\n }\n\n componentWillUnmount() {\n this.setState({ mounted: false });\n }\n\n render() {\n const { mounted } = this.state;\n const {\n text,\n marginTop,\n marginBottom,\n showIcon,\n showBackground,\n className,\n animate,\n } = this.props;\n\n return (\n \n \n \n {showIcon && (\n \n )}\n {text &&

{text}

}\n \n \n \n );\n }\n}\n\nexport default Error;\n","import styled from 'styled-components';\nimport { hideVisually } from 'polished';\nimport { invisibleA11yText } from './styleUtils';\n\nexport const HiddenLabel = styled.label`\n span:first-child {\n ${hideVisually()}\n }\n`;\n\n/**\n * Our fieldsets usually don't have borders\n */\nexport const Fieldset = styled.fieldset`\n border: none;\n`;\n\n/**\n * Wrap in this component any element that should only be visible by screen readers\n */\nexport const ScreenReaderOnly = styled.span`\n ${invisibleA11yText()}\n`;\n","import React, { PureComponent, FormEvent, KeyboardEvent } from 'react';\nimport { isNil, isEmpty, size as lodashSize, isBoolean } from 'lodash-es';\n\n// components\nimport Error from '../Error';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\n\n// style\nimport styled from 'styled-components';\nimport {\n colors,\n fontSizes,\n defaultInputStyle,\n defaultStyles,\n isRtl,\n} from '../../utils/styleUtils';\nimport { ScreenReaderOnly } from '../../utils/a11y';\n\n// typings\nimport { Locale, InputSize } from '../../utils/typings';\n\ninterface ContainerProps {\n size: InputSize;\n}\n\nconst Container = styled.div`\n width: 100%;\n position: relative;\n\n input {\n width: 100%;\n\n &.hasMaxCharCount {\n padding-right: 62px;\n }\n ${isRtl`\n &.hasMaxCharCount {\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 62px;\n }`}\n ${defaultInputStyle};\n }\n`;\n\nconst CharCount = styled.div<{ inputSize?: InputSize }>`\n color: ${colors.textSecondary};\n font-size: ${fontSizes.s}px;\n font-weight: 400;\n text-align: right;\n position: absolute;\n bottom: ${({ inputSize }) => (inputSize === 'small' ? '10px' : '14px')};\n right: 10px;\n\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n\n &.error {\n color: red;\n }\n`;\n\nexport interface InputProps {\n ariaLabel?: string;\n id?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n value?: string | null;\n locale?: Locale;\n type: 'text' | 'email' | 'password' | 'number' | 'date';\n placeholder?: string | null;\n error?: string | null;\n onChange?: (arg: string, locale: Locale | undefined) => void;\n onFocus?: (arg: FormEvent) => void;\n onBlur?: (arg: FormEvent) => void;\n setRef?: (arg: HTMLInputElement) => void | undefined;\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocus?: boolean;\n min?: string;\n max?: string;\n name?: string;\n maxCharCount?: number;\n disabled?: boolean;\n spellCheck?: boolean;\n readOnly?: boolean;\n required?: boolean;\n autocomplete?:\n | 'email'\n | 'given-name'\n | 'family-name'\n | 'current-password'\n | 'new-password'\n | 'off'\n | 'on'; // https://www.w3.org/TR/WCAG21/#input-purposes\n a11yCharactersLeftMessage?: string;\n className?: string;\n size?: InputSize;\n 'data-testid'?: string;\n}\n\nclass Input extends PureComponent {\n handleOnChange = (event: FormEvent) => {\n const { maxCharCount, onChange, locale } = this.props;\n\n if (\n !maxCharCount ||\n lodashSize(event.currentTarget.value) <= maxCharCount\n ) {\n if (onChange) {\n onChange(event.currentTarget.value, locale);\n }\n }\n };\n\n handleOnBlur = (event: FormEvent) => {\n const { onBlur } = this.props;\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n handleRef = (element: HTMLInputElement) => {\n this.props.setRef && this.props.setRef(element);\n };\n\n render() {\n const {\n label,\n labelTooltipText,\n ariaLabel,\n a11yCharactersLeftMessage,\n className,\n onKeyDown,\n } = this.props;\n const {\n id,\n type,\n name,\n maxCharCount,\n min,\n max,\n autoFocus,\n onFocus,\n disabled,\n spellCheck,\n readOnly,\n required,\n autocomplete,\n size = 'medium',\n 'data-testid': dataTestId,\n } = this.props;\n const hasError = !isNil(this.props.error) && !isEmpty(this.props.error);\n const optionalProps = isBoolean(spellCheck) ? { spellCheck } : null;\n const value = !isNil(this.props.value) ? this.props.value : '';\n const placeholder = this.props.placeholder || '';\n const error = this.props.error || null;\n const currentCharCount = maxCharCount && lodashSize(value);\n const tooManyChars = !!(\n maxCharCount &&\n currentCharCount &&\n currentCharCount > maxCharCount\n );\n\n return (\n \n {label && (\n \n )}\n\n \n\n {maxCharCount && (\n <>\n {a11yCharactersLeftMessage && (\n \n {a11yCharactersLeftMessage}\n \n )}\n \n {currentCharCount}/{maxCharCount}\n \n \n )}\n\n \n \n );\n }\n}\n\nexport default Input;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-Input-Input-stories-mdx.f39798db.iframe.bundle.js","mappings":";;;;AAqBA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;ACpEA;AACA;;;;;AAKA;;;;;AAKA;;;;;;;;AAUA;;AAEA;;;;AAMA;;;;;AAKA;AACA;AACA;AAIA;;;;AAIA;AACA;AACA;;;;;;;;;;AAlDA;AAAA;;;;;;;;;;;AAAA;AAAA;;;AA+FA;;AChGA;;AAOA;;AATA;AAiBA;ACKA;;;;;;;;;;AAUA;;AAEA;;;AAGA;;AAIA;AACA;AACA;;;;AAIA;;;AAGA;;;;;;;;AAgDA;ACjGA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Error/index.tsx","webpack://@citizenlab/cl2-component-library/./src/utils/a11y.ts","webpack://@citizenlab/cl2-component-library/./src/components/Input/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon from '../Icon';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\nconst timeout = 350;\n\nconst ErrorMessageText = styled.div`\n flex: 1 1 100%;\n color: ${colors.red600};\n font-size: ${fontSizes.base}px;\n line-height: normal;\n font-weight: 400;\n\n a {\n color: ${colors.red600};\n font-weight: 500;\n text-decoration: underline;\n\n &:hover {\n color: ${darken(0.2, colors.red600)};\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 500;\n }\n`;\n\nconst ErrorIcon = styled(Icon)`\n flex: 0 0 24px;\n fill: ${colors.red600};\n padding: 0px;\n margin: 0px;\n margin-right: 10px;\n`;\n\nconst ContainerInner = styled.div<{ showBackground: boolean }>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 13px;\n border-radius: ${(props) => props.theme.borderRadius};\n background: ${colors.red100};\n background: ${(props) =>\n props.showBackground ? colors.red100 : 'transparent'};\n`;\n\nconst Container = styled.div<{ marginTop: string; marginBottom: string }>`\n position: relative;\n overflow: hidden;\n\n ${ContainerInner} {\n margin-top: ${(props) => props.marginTop};\n margin-bottom: ${(props) => props.marginBottom};\n }\n\n &.error-enter {\n max-height: 0px;\n opacity: 0;\n\n &.error-enter-active {\n max-height: 60px;\n opacity: 1;\n transition: max-height ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1),\n opacity ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1);\n }\n }\n\n &.error-exit {\n max-height: 100px;\n opacity: 1;\n\n &.error-exit-active {\n max-height: 0px;\n opacity: 0;\n transition: max-height ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1),\n opacity ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n }\n`;\n\ninterface DefaultProps {\n marginTop: string;\n marginBottom: string;\n showIcon: boolean;\n showBackground: boolean;\n className: string;\n animate: boolean | undefined;\n}\n\ninterface Props extends DefaultProps {\n text?: string | null;\n}\n\ninterface State {\n mounted: boolean;\n}\n\nclass Error extends PureComponent {\n static defaultProps: DefaultProps = {\n marginTop: '3px',\n marginBottom: '0px',\n showIcon: true,\n showBackground: true,\n className: '',\n animate: true,\n };\n\n constructor(props: Props) {\n super(props);\n this.state = {\n mounted: false,\n };\n }\n\n componentDidMount() {\n this.setState({ mounted: true });\n }\n\n componentWillUnmount() {\n this.setState({ mounted: false });\n }\n\n render() {\n const { mounted } = this.state;\n const {\n text,\n marginTop,\n marginBottom,\n showIcon,\n showBackground,\n className,\n animate,\n } = this.props;\n\n return (\n \n \n \n {showIcon && (\n \n )}\n {text &&

{text}

}\n \n \n \n );\n }\n}\n\nexport default Error;\n","import styled from 'styled-components';\nimport { hideVisually } from 'polished';\nimport { invisibleA11yText } from './styleUtils';\n\nexport const HiddenLabel = styled.label`\n span:first-child {\n ${hideVisually()}\n }\n`;\n\n/**\n * Our fieldsets usually don't have borders\n */\nexport const Fieldset = styled.fieldset`\n border: none;\n`;\n\n/**\n * Wrap in this component any element that should only be visible by screen readers\n */\nexport const ScreenReaderOnly = styled.span`\n ${invisibleA11yText()}\n`;\n","import React, { PureComponent, FormEvent, KeyboardEvent } from 'react';\nimport { isNil, isEmpty, size as lodashSize, isBoolean } from 'lodash-es';\n\n// components\nimport Error from '../Error';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\n\n// style\nimport styled from 'styled-components';\nimport {\n colors,\n fontSizes,\n defaultInputStyle,\n defaultStyles,\n isRtl,\n} from '../../utils/styleUtils';\nimport { ScreenReaderOnly } from '../../utils/a11y';\n\n// typings\nimport { Locale, InputSize } from '../../utils/typings';\n\ninterface ContainerProps {\n size: InputSize;\n}\n\nconst Container = styled.div`\n width: 100%;\n position: relative;\n\n input {\n width: 100%;\n\n &.hasMaxCharCount {\n padding-right: 62px;\n }\n ${isRtl`\n &.hasMaxCharCount {\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 62px;\n }`}\n ${defaultInputStyle};\n }\n`;\n\nconst CharCount = styled.div<{ inputSize?: InputSize }>`\n color: ${colors.textSecondary};\n font-size: ${fontSizes.s}px;\n font-weight: 400;\n text-align: right;\n position: absolute;\n bottom: ${({ inputSize }) => (inputSize === 'small' ? '10px' : '14px')};\n right: 10px;\n\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n\n &.error {\n color: red;\n }\n`;\n\nexport interface InputProps {\n ariaLabel?: string;\n id?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n value?: string | null;\n locale?: Locale;\n type: 'text' | 'email' | 'password' | 'number' | 'date';\n placeholder?: string | null;\n error?: string | null;\n onChange?: (arg: string, locale: Locale | undefined) => void;\n onFocus?: (arg: FormEvent) => void;\n onBlur?: (arg: FormEvent) => void;\n setRef?: (arg: HTMLInputElement) => void | undefined;\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocus?: boolean;\n min?: string;\n max?: string;\n name?: string;\n maxCharCount?: number;\n disabled?: boolean;\n spellCheck?: boolean;\n readOnly?: boolean;\n required?: boolean;\n autocomplete?:\n | 'email'\n | 'given-name'\n | 'family-name'\n | 'current-password'\n | 'new-password'\n | 'off'\n | 'on'; // https://www.w3.org/TR/WCAG21/#input-purposes\n a11yCharactersLeftMessage?: string;\n className?: string;\n size?: InputSize;\n 'data-testid'?: string;\n}\n\nclass Input extends PureComponent {\n handleOnChange = (event: FormEvent) => {\n const { maxCharCount, onChange, locale } = this.props;\n\n if (\n !maxCharCount ||\n lodashSize(event.currentTarget.value) <= maxCharCount\n ) {\n if (onChange) {\n onChange(event.currentTarget.value, locale);\n }\n }\n };\n\n handleOnBlur = (event: FormEvent) => {\n const { onBlur } = this.props;\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n handleRef = (element: HTMLInputElement) => {\n this.props.setRef && this.props.setRef(element);\n };\n\n render() {\n const {\n label,\n labelTooltipText,\n ariaLabel,\n a11yCharactersLeftMessage,\n className,\n onKeyDown,\n } = this.props;\n const {\n id,\n type,\n name,\n maxCharCount,\n min,\n max,\n autoFocus,\n onFocus,\n disabled,\n spellCheck,\n readOnly,\n required,\n autocomplete,\n size = 'medium',\n 'data-testid': dataTestId,\n } = this.props;\n const hasError = !isNil(this.props.error) && !isEmpty(this.props.error);\n const optionalProps = isBoolean(spellCheck) ? { spellCheck } : null;\n const value = !isNil(this.props.value) ? this.props.value : '';\n const placeholder = this.props.placeholder || '';\n const error = this.props.error || null;\n const currentCharCount = maxCharCount && lodashSize(value);\n const tooManyChars = !!(\n maxCharCount &&\n currentCharCount &&\n currentCharCount > maxCharCount\n );\n\n return (\n \n {label && (\n \n )}\n\n \n\n {maxCharCount && (\n <>\n {a11yCharactersLeftMessage && (\n \n {a11yCharactersLeftMessage}\n \n )}\n \n {currentCharCount}/{maxCharCount}\n \n \n )}\n\n \n \n );\n }\n}\n\nexport default Input;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js b/docs/components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js similarity index 75% rename from docs/components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js rename to docs/components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js index e2cdbb80b671..1f863945d7c1 100644 --- a/docs/components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js +++ b/docs/components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js @@ -16,7 +16,7 @@ fill: ${({iconColorOnHover})=>iconColorOnHover}; } } -`,IconButton=({className,iconName,onClick,a11y_buttonActionMessage,iconWidth="24px",iconHeight="24px",iconColor,iconColorOnHover,ariaExpanded,ariaControls,buttonType,transform,...rest})=>(0,jsx_runtime.jsx)(StyledBox,{as:"button",className:className??"",onClick,iconColorOnHover,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,type:buttonType,display:"flex",alignItems:"center",justifyContent:"center",role:"button",...rest,children:(0,jsx_runtime.jsx)(StyledIcon,{name:iconName,title:a11y_buttonActionMessage,ariaHidden:!1,width:iconWidth,height:iconHeight,iconColor,transform})});IconButton.displayName="IconButton";const components_IconButton=IconButton;try{IconButton.displayName="IconButton",IconButton.__docgenInfo={description:"",displayName:"IconButton",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},iconName:{defaultValue:null,description:"",name:"iconName",required:!0,type:{name:"enum",value:[{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},a11y_buttonActionMessage:{defaultValue:null,description:"",name:"a11y_buttonActionMessage",required:!0,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!0,type:{name:"(event?: MouseEvent | KeyboardEvent | undefined) => void"}},iconWidth:{defaultValue:{value:"24px"},description:"",name:"iconWidth",required:!1,type:{name:"string | undefined"}},iconHeight:{defaultValue:{value:"24px"},description:"",name:"iconHeight",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!0,type:{name:"string"}},iconColorOnHover:{defaultValue:null,description:"",name:"iconColorOnHover",required:!0,type:{name:"string"}},ariaExpanded:{defaultValue:null,description:"",name:"ariaExpanded",required:!1,type:{name:"boolean | undefined"}},ariaControls:{defaultValue:null,description:"",name:"ariaControls",required:!1,type:{name:"string | undefined"}},buttonType:{defaultValue:null,description:"",name:"buttonType",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"button"'},{value:'"submit"'},{value:'"reset"'}]}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconButton/index.tsx#IconButton"]={docgenInfo:IconButton.__docgenInfo,name:"IconButton",path:"src/components/IconButton/index.tsx#IconButton"})}catch(__react_docgen_typescript_loader_error){}var styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),testEnv=__webpack_require__("./src/utils/testUtils/testEnv.ts");const StyledInput=(0,styled_components_browser_esm.Ay)(Input.A)` +`,IconButton=({className,iconName,onClick,a11y_buttonActionMessage,iconWidth="24px",iconHeight="24px",iconColor,iconColorOnHover,ariaExpanded,ariaControls,buttonType,transform,...rest})=>(0,jsx_runtime.jsx)(StyledBox,{as:"button",className:className??"",onClick,iconColorOnHover,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,type:buttonType,display:"flex",alignItems:"center",justifyContent:"center",role:"button",...rest,children:(0,jsx_runtime.jsx)(StyledIcon,{name:iconName,title:a11y_buttonActionMessage,ariaHidden:!1,width:iconWidth,height:iconHeight,iconColor,transform})});IconButton.displayName="IconButton";const components_IconButton=IconButton;try{IconButton.displayName="IconButton",IconButton.__docgenInfo={description:"",displayName:"IconButton",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},iconName:{defaultValue:null,description:"",name:"iconName",required:!0,type:{name:"enum",value:[{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},a11y_buttonActionMessage:{defaultValue:null,description:"",name:"a11y_buttonActionMessage",required:!0,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!0,type:{name:"(event?: MouseEvent | KeyboardEvent | undefined) => void"}},iconWidth:{defaultValue:{value:"24px"},description:"",name:"iconWidth",required:!1,type:{name:"string | undefined"}},iconHeight:{defaultValue:{value:"24px"},description:"",name:"iconHeight",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!0,type:{name:"string"}},iconColorOnHover:{defaultValue:null,description:"",name:"iconColorOnHover",required:!0,type:{name:"string"}},ariaExpanded:{defaultValue:null,description:"",name:"ariaExpanded",required:!1,type:{name:"boolean | undefined"}},ariaControls:{defaultValue:null,description:"",name:"ariaControls",required:!1,type:{name:"string | undefined"}},buttonType:{defaultValue:null,description:"",name:"buttonType",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"button"'},{value:'"submit"'},{value:'"reset"'}]}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconButton/index.tsx#IconButton"]={docgenInfo:IconButton.__docgenInfo,name:"IconButton",path:"src/components/IconButton/index.tsx#IconButton"})}catch(__react_docgen_typescript_loader_error){}var styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),testEnv=__webpack_require__("./src/utils/testUtils/testEnv.ts");const StyledInput=(0,styled_components_browser_esm.Ay)(Input.A)` input { padding-right: 40px; width: 100%; @@ -67,7 +67,7 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Input/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>components_Input});var react=__webpack_require__("./node_modules/react/index.js"),lodash_es_size=__webpack_require__("./node_modules/lodash-es/size.js"),isNil=__webpack_require__("./node_modules/lodash-es/isNil.js"),isEmpty=__webpack_require__("./node_modules/lodash-es/isEmpty.js"),isBoolean=__webpack_require__("./node_modules/lodash-es/isBoolean.js"),CSSTransition=__webpack_require__("./node_modules/react-transition-group/esm/CSSTransition.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const ErrorMessageText=styled_components_browser_esm.Ay.div` +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Input/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>components_Input});var react=__webpack_require__("./node_modules/react/index.js"),lodash_es_size=__webpack_require__("./node_modules/lodash-es/size.js"),isNil=__webpack_require__("./node_modules/lodash-es/isNil.js"),isEmpty=__webpack_require__("./node_modules/lodash-es/isEmpty.js"),isBoolean=__webpack_require__("./node_modules/lodash-es/isBoolean.js"),CSSTransition=__webpack_require__("./node_modules/react-transition-group/esm/CSSTransition.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished_esm=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),Icon=__webpack_require__("./src/components/Icon/index.tsx"),styleUtils=__webpack_require__("./src/utils/styleUtils.ts"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const ErrorMessageText=styled_components_browser_esm.Ay.div` flex: 1 1 100%; color: ${styleUtils.Tj.red600}; font-size: ${styleUtils.GR.base}px; @@ -199,4 +199,4 @@ ${_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.bS} } `;class Label extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent{handleOnClick=event=>{this.props.onClick&&this.props.onClick(event)};render(){const{value,htmlFor,children,id,className,hidden}=this.props;return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Container,{id,className:`${className||""} ${hidden?"invisible":""}`,htmlFor,onClick:this.handleOnClick,children:children||value})}}Label.displayName="Label";try{Label.displayName="Label",Label.__docgenInfo={description:"",displayName:"Label",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | Element | undefined"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string | undefined"}},hidden:{defaultValue:null,description:"",name:"hidden",required:!1,type:{name:"boolean | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((event: MouseEvent) => void) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Label/index.tsx#Label"]={docgenInfo:Label.__docgenInfo,name:"Label",path:"src/components/Label/index.tsx#Label"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js.map b/docs/components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js.map similarity index 99% rename from docs/components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js.map rename to docs/components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js.map index ace00858c0ae..4e9854d7fd01 100644 --- a/docs/components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js.map +++ b/docs/components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-SearchInput-SearchInput-stories-mdx.5ecf0120.iframe.bundle.js","mappings":";AAkBA;AACA;AACA;AACA;;;;;AAOA;;;;;AAOA;AACA;;;AA2BA;;;;;;;;;;AC3BA;;AAEA;;;;AAMA;;;AAGA;AACA;;;;AAoBA;;;;AC/CA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;ACpEA;AACA;;;;;AAKA;;;;;AAKA;;;;;;;;AAUA;;AAEA;;;;AAMA;;;;;AAKA;AACA;AACA;AAIA;;;;AAIA;AACA;AACA;;;;;;;;;;AAlDA;AAAA;;;;;;;;;;;AAAA;AAAA;;;AA+FA;;AChGA;;AAOA;;AATA;AAiBA;ACKA;;;;;;;;;;AAUA;;AAEA;;;AAGA;;AAIA;AACA;AACA;;;;AAIA;;;AAGA;;;;;;;;AAgDA;ACjGA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/IconButton/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/SearchInput/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Error/index.tsx","webpack://@citizenlab/cl2-component-library/./src/utils/a11y.ts","webpack://@citizenlab/cl2-component-library/./src/components/Input/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { MouseEvent, KeyboardEvent } from 'react';\r\nimport Icon, { IconNames } from '../../components/Icon';\r\nimport styled from 'styled-components';\r\nimport Box, {\r\n BoxPositionProps,\r\n BoxMarginProps,\r\n BoxPaddingProps,\r\n BoxVisibilityProps,\r\n BoxDisplayProps,\r\n BoxZIndexProps,\r\n} from '../Box';\r\n\r\nconst StyledIcon = styled(Icon)<{\r\n width: string;\r\n height: string;\r\n iconColor: string;\r\n transform: string | undefined;\r\n}>`\r\n width: ${({ width }) => width};\r\n height: ${({ height }) => height};\r\n fill: ${({ iconColor }) => iconColor};\r\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\r\n\r\n transition: fill 100ms ease-out;\r\n justify-content: center;\r\n align-items: center;\r\n`;\r\n\r\nconst StyledBox = styled(Box)<{\r\n iconColorOnHover: string;\r\n}>`\r\n cursor: pointer;\r\n\r\n &:hover,\r\n &:focus {\r\n ${StyledIcon} {\r\n fill: ${({ iconColorOnHover }) => iconColorOnHover};\r\n }\r\n }\r\n`;\r\n\r\nexport type IconButtonProps = {\r\n className?: string;\r\n iconName: IconNames;\r\n // Provide a description that describes the button's task\r\n // E.g. close idea page modal\r\n a11y_buttonActionMessage: string;\r\n onClick: (event?: MouseEvent | KeyboardEvent) => void;\r\n iconWidth?: string;\r\n iconHeight?: string;\r\n iconColor: string;\r\n iconColorOnHover: string;\r\n ariaExpanded?: boolean;\r\n ariaControls?: string;\r\n buttonType?: 'submit' | 'button' | 'reset';\r\n transform?: string;\r\n} & BoxPositionProps &\r\n BoxMarginProps &\r\n BoxPaddingProps &\r\n BoxVisibilityProps &\r\n BoxDisplayProps &\r\n BoxZIndexProps;\r\n\r\nconst IconButton = ({\r\n className,\r\n iconName,\r\n onClick,\r\n a11y_buttonActionMessage,\r\n iconWidth = '24px',\r\n iconHeight = '24px',\r\n iconColor,\r\n iconColorOnHover,\r\n ariaExpanded,\r\n ariaControls,\r\n buttonType,\r\n transform,\r\n ...rest\r\n}: IconButtonProps) => {\r\n return (\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default IconButton;\r\n","import React, {\n useState,\n useCallback,\n MouseEvent,\n useMemo,\n KeyboardEvent,\n} from 'react';\nimport { isEmpty } from 'lodash-es';\nimport debounceFn from 'lodash/debounce';\n\n// components\nimport Input from '../Input';\nimport Box from '../Box';\nimport IconButton from '../IconButton';\nimport Icon from '../Icon';\n\n// styling\nimport styled from 'styled-components';\nimport { colors, isRtl, defaultStyles } from '../../utils/styleUtils';\n\n// typings\nimport { InputSize } from '../../utils/typings';\n\n// utils\nimport testEnv from '../../utils/testUtils/testEnv';\n\nconst StyledInput = styled(Input)`\n input {\n padding-right: 40px;\n width: 100%;\n\n &::-ms-clear {\n display: none;\n }\n }\n\n ${isRtl`\n input{\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 40px;\n }\n `}\n`;\n\nconst IconContainer = styled.div<{ inputSize?: InputSize }>`\n position: absolute;\n right: 10px;\n top: ${({ inputSize }) => (inputSize === 'small' ? '7px' : '10px')};\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n`;\n\nexport interface Props {\n id: string;\n defaultValue?: string;\n placeholder: string;\n ariaLabel: string;\n debounce?: number;\n a11y_closeIconTitle: string;\n setClearButtonRef?: (arg: HTMLButtonElement) => void;\n onChange: (arg: string | null) => void;\n className?: string;\n size?: InputSize;\n setInputRef?: (arg: HTMLInputElement) => void;\n}\n\nconst SearchInput = ({\n id,\n defaultValue,\n placeholder,\n ariaLabel,\n debounce = 500,\n a11y_closeIconTitle,\n onChange,\n className,\n size,\n setInputRef,\n}: Props) => {\n const [internalSearchTerm, setInternalSearchTerm] = useState(\n defaultValue ?? null\n );\n\n const debouncedOnChange = useMemo(\n () =>\n debounceFn((value: string | null) => {\n onChange(value);\n }, debounce),\n [onChange, debounce]\n );\n\n const handleOnChange = useCallback(\n (value: string) => {\n const newValue = !isEmpty(value) ? value : null;\n\n setInternalSearchTerm(newValue);\n debouncedOnChange(newValue);\n },\n [debouncedOnChange]\n );\n\n const handleOnReset = (event?: MouseEvent | KeyboardEvent) => {\n event?.preventDefault();\n\n if (!isEmpty(internalSearchTerm)) {\n onChange(null);\n setInternalSearchTerm(null);\n }\n };\n\n const handleRef = (element: HTMLInputElement) => {\n setInputRef && setInputRef(element);\n };\n\n const userHasEnteredSearchTerm = !isEmpty(internalSearchTerm);\n\n return (\n \n \n \n {userHasEnteredSearchTerm ? (\n \n ) : (\n \n )}\n \n \n );\n};\n\nexport default SearchInput;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon from '../Icon';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\nconst timeout = 350;\n\nconst ErrorMessageText = styled.div`\n flex: 1 1 100%;\n color: ${colors.red600};\n font-size: ${fontSizes.base}px;\n line-height: normal;\n font-weight: 400;\n\n a {\n color: ${colors.red600};\n font-weight: 500;\n text-decoration: underline;\n\n &:hover {\n color: ${darken(0.2, colors.red600)};\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 500;\n }\n`;\n\nconst ErrorIcon = styled(Icon)`\n flex: 0 0 24px;\n fill: ${colors.red600};\n padding: 0px;\n margin: 0px;\n margin-right: 10px;\n`;\n\nconst ContainerInner = styled.div<{ showBackground: boolean }>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 13px;\n border-radius: ${(props) => props.theme.borderRadius};\n background: ${colors.red100};\n background: ${(props) =>\n props.showBackground ? colors.red100 : 'transparent'};\n`;\n\nconst Container = styled.div<{ marginTop: string; marginBottom: string }>`\n position: relative;\n overflow: hidden;\n\n ${ContainerInner} {\n margin-top: ${(props) => props.marginTop};\n margin-bottom: ${(props) => props.marginBottom};\n }\n\n &.error-enter {\n max-height: 0px;\n opacity: 0;\n\n &.error-enter-active {\n max-height: 60px;\n opacity: 1;\n transition: max-height ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1),\n opacity ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1);\n }\n }\n\n &.error-exit {\n max-height: 100px;\n opacity: 1;\n\n &.error-exit-active {\n max-height: 0px;\n opacity: 0;\n transition: max-height ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1),\n opacity ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n }\n`;\n\ninterface DefaultProps {\n marginTop: string;\n marginBottom: string;\n showIcon: boolean;\n showBackground: boolean;\n className: string;\n animate: boolean | undefined;\n}\n\ninterface Props extends DefaultProps {\n text?: string | null;\n}\n\ninterface State {\n mounted: boolean;\n}\n\nclass Error extends PureComponent {\n static defaultProps: DefaultProps = {\n marginTop: '3px',\n marginBottom: '0px',\n showIcon: true,\n showBackground: true,\n className: '',\n animate: true,\n };\n\n constructor(props: Props) {\n super(props);\n this.state = {\n mounted: false,\n };\n }\n\n componentDidMount() {\n this.setState({ mounted: true });\n }\n\n componentWillUnmount() {\n this.setState({ mounted: false });\n }\n\n render() {\n const { mounted } = this.state;\n const {\n text,\n marginTop,\n marginBottom,\n showIcon,\n showBackground,\n className,\n animate,\n } = this.props;\n\n return (\n \n \n \n {showIcon && (\n \n )}\n {text &&

{text}

}\n \n \n \n );\n }\n}\n\nexport default Error;\n","import styled from 'styled-components';\nimport { hideVisually } from 'polished';\nimport { invisibleA11yText } from './styleUtils';\n\nexport const HiddenLabel = styled.label`\n span:first-child {\n ${hideVisually()}\n }\n`;\n\n/**\n * Our fieldsets usually don't have borders\n */\nexport const Fieldset = styled.fieldset`\n border: none;\n`;\n\n/**\n * Wrap in this component any element that should only be visible by screen readers\n */\nexport const ScreenReaderOnly = styled.span`\n ${invisibleA11yText()}\n`;\n","import React, { PureComponent, FormEvent, KeyboardEvent } from 'react';\nimport { isNil, isEmpty, size as lodashSize, isBoolean } from 'lodash-es';\n\n// components\nimport Error from '../Error';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\n\n// style\nimport styled from 'styled-components';\nimport {\n colors,\n fontSizes,\n defaultInputStyle,\n defaultStyles,\n isRtl,\n} from '../../utils/styleUtils';\nimport { ScreenReaderOnly } from '../../utils/a11y';\n\n// typings\nimport { Locale, InputSize } from '../../utils/typings';\n\ninterface ContainerProps {\n size: InputSize;\n}\n\nconst Container = styled.div`\n width: 100%;\n position: relative;\n\n input {\n width: 100%;\n\n &.hasMaxCharCount {\n padding-right: 62px;\n }\n ${isRtl`\n &.hasMaxCharCount {\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 62px;\n }`}\n ${defaultInputStyle};\n }\n`;\n\nconst CharCount = styled.div<{ inputSize?: InputSize }>`\n color: ${colors.textSecondary};\n font-size: ${fontSizes.s}px;\n font-weight: 400;\n text-align: right;\n position: absolute;\n bottom: ${({ inputSize }) => (inputSize === 'small' ? '10px' : '14px')};\n right: 10px;\n\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n\n &.error {\n color: red;\n }\n`;\n\nexport interface InputProps {\n ariaLabel?: string;\n id?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n value?: string | null;\n locale?: Locale;\n type: 'text' | 'email' | 'password' | 'number' | 'date';\n placeholder?: string | null;\n error?: string | null;\n onChange?: (arg: string, locale: Locale | undefined) => void;\n onFocus?: (arg: FormEvent) => void;\n onBlur?: (arg: FormEvent) => void;\n setRef?: (arg: HTMLInputElement) => void | undefined;\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocus?: boolean;\n min?: string;\n max?: string;\n name?: string;\n maxCharCount?: number;\n disabled?: boolean;\n spellCheck?: boolean;\n readOnly?: boolean;\n required?: boolean;\n autocomplete?:\n | 'email'\n | 'given-name'\n | 'family-name'\n | 'current-password'\n | 'new-password'\n | 'off'\n | 'on'; // https://www.w3.org/TR/WCAG21/#input-purposes\n a11yCharactersLeftMessage?: string;\n className?: string;\n size?: InputSize;\n 'data-testid'?: string;\n}\n\nclass Input extends PureComponent {\n handleOnChange = (event: FormEvent) => {\n const { maxCharCount, onChange, locale } = this.props;\n\n if (\n !maxCharCount ||\n lodashSize(event.currentTarget.value) <= maxCharCount\n ) {\n if (onChange) {\n onChange(event.currentTarget.value, locale);\n }\n }\n };\n\n handleOnBlur = (event: FormEvent) => {\n const { onBlur } = this.props;\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n handleRef = (element: HTMLInputElement) => {\n this.props.setRef && this.props.setRef(element);\n };\n\n render() {\n const {\n label,\n labelTooltipText,\n ariaLabel,\n a11yCharactersLeftMessage,\n className,\n onKeyDown,\n } = this.props;\n const {\n id,\n type,\n name,\n maxCharCount,\n min,\n max,\n autoFocus,\n onFocus,\n disabled,\n spellCheck,\n readOnly,\n required,\n autocomplete,\n size = 'medium',\n 'data-testid': dataTestId,\n } = this.props;\n const hasError = !isNil(this.props.error) && !isEmpty(this.props.error);\n const optionalProps = isBoolean(spellCheck) ? { spellCheck } : null;\n const value = !isNil(this.props.value) ? this.props.value : '';\n const placeholder = this.props.placeholder || '';\n const error = this.props.error || null;\n const currentCharCount = maxCharCount && lodashSize(value);\n const tooManyChars = !!(\n maxCharCount &&\n currentCharCount &&\n currentCharCount > maxCharCount\n );\n\n return (\n \n {label && (\n \n )}\n\n \n\n {maxCharCount && (\n <>\n {a11yCharactersLeftMessage && (\n \n {a11yCharactersLeftMessage}\n \n )}\n \n {currentCharCount}/{maxCharCount}\n \n \n )}\n\n \n \n );\n }\n}\n\nexport default Input;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-SearchInput-SearchInput-stories-mdx.68c7be48.iframe.bundle.js","mappings":";AAkBA;AACA;AACA;AACA;;;;;AAOA;;;;;AAOA;AACA;;;AA2BA;;;;;;;;;;AC3BA;;AAEA;;;;AAMA;;;AAGA;AACA;;;;AAoBA;;;;AC/CA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;;ACpEA;AACA;;;;;AAKA;;;;;AAKA;;;;;;;;AAUA;;AAEA;;;;AAMA;;;;;AAKA;AACA;AACA;AAIA;;;;AAIA;AACA;AACA;;;;;;;;;;AAlDA;AAAA;;;;;;;;;;;AAAA;AAAA;;;AA+FA;;AChGA;;AAOA;;AATA;AAiBA;ACKA;;;;;;;;;;AAUA;;AAEA;;;AAGA;;AAIA;AACA;AACA;;;;AAIA;;;AAGA;;;;;;;;AAgDA;ACjGA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/IconButton/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/SearchInput/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Error/index.tsx","webpack://@citizenlab/cl2-component-library/./src/utils/a11y.ts","webpack://@citizenlab/cl2-component-library/./src/components/Input/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { MouseEvent, KeyboardEvent } from 'react';\r\nimport Icon, { IconNames } from '../../components/Icon';\r\nimport styled from 'styled-components';\r\nimport Box, {\r\n BoxPositionProps,\r\n BoxMarginProps,\r\n BoxPaddingProps,\r\n BoxVisibilityProps,\r\n BoxDisplayProps,\r\n BoxZIndexProps,\r\n} from '../Box';\r\n\r\nconst StyledIcon = styled(Icon)<{\r\n width: string;\r\n height: string;\r\n iconColor: string;\r\n transform: string | undefined;\r\n}>`\r\n width: ${({ width }) => width};\r\n height: ${({ height }) => height};\r\n fill: ${({ iconColor }) => iconColor};\r\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\r\n\r\n transition: fill 100ms ease-out;\r\n justify-content: center;\r\n align-items: center;\r\n`;\r\n\r\nconst StyledBox = styled(Box)<{\r\n iconColorOnHover: string;\r\n}>`\r\n cursor: pointer;\r\n\r\n &:hover,\r\n &:focus {\r\n ${StyledIcon} {\r\n fill: ${({ iconColorOnHover }) => iconColorOnHover};\r\n }\r\n }\r\n`;\r\n\r\nexport type IconButtonProps = {\r\n className?: string;\r\n iconName: IconNames;\r\n // Provide a description that describes the button's task\r\n // E.g. close idea page modal\r\n a11y_buttonActionMessage: string;\r\n onClick: (event?: MouseEvent | KeyboardEvent) => void;\r\n iconWidth?: string;\r\n iconHeight?: string;\r\n iconColor: string;\r\n iconColorOnHover: string;\r\n ariaExpanded?: boolean;\r\n ariaControls?: string;\r\n buttonType?: 'submit' | 'button' | 'reset';\r\n transform?: string;\r\n} & BoxPositionProps &\r\n BoxMarginProps &\r\n BoxPaddingProps &\r\n BoxVisibilityProps &\r\n BoxDisplayProps &\r\n BoxZIndexProps;\r\n\r\nconst IconButton = ({\r\n className,\r\n iconName,\r\n onClick,\r\n a11y_buttonActionMessage,\r\n iconWidth = '24px',\r\n iconHeight = '24px',\r\n iconColor,\r\n iconColorOnHover,\r\n ariaExpanded,\r\n ariaControls,\r\n buttonType,\r\n transform,\r\n ...rest\r\n}: IconButtonProps) => {\r\n return (\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default IconButton;\r\n","import React, {\n useState,\n useCallback,\n MouseEvent,\n useMemo,\n KeyboardEvent,\n} from 'react';\nimport { isEmpty } from 'lodash-es';\nimport debounceFn from 'lodash/debounce';\n\n// components\nimport Input from '../Input';\nimport Box from '../Box';\nimport IconButton from '../IconButton';\nimport Icon from '../Icon';\n\n// styling\nimport styled from 'styled-components';\nimport { colors, isRtl, defaultStyles } from '../../utils/styleUtils';\n\n// typings\nimport { InputSize } from '../../utils/typings';\n\n// utils\nimport testEnv from '../../utils/testUtils/testEnv';\n\nconst StyledInput = styled(Input)`\n input {\n padding-right: 40px;\n width: 100%;\n\n &::-ms-clear {\n display: none;\n }\n }\n\n ${isRtl`\n input{\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 40px;\n }\n `}\n`;\n\nconst IconContainer = styled.div<{ inputSize?: InputSize }>`\n position: absolute;\n right: 10px;\n top: ${({ inputSize }) => (inputSize === 'small' ? '7px' : '10px')};\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n`;\n\nexport interface Props {\n id: string;\n defaultValue?: string;\n placeholder: string;\n ariaLabel: string;\n debounce?: number;\n a11y_closeIconTitle: string;\n setClearButtonRef?: (arg: HTMLButtonElement) => void;\n onChange: (arg: string | null) => void;\n className?: string;\n size?: InputSize;\n setInputRef?: (arg: HTMLInputElement) => void;\n}\n\nconst SearchInput = ({\n id,\n defaultValue,\n placeholder,\n ariaLabel,\n debounce = 500,\n a11y_closeIconTitle,\n onChange,\n className,\n size,\n setInputRef,\n}: Props) => {\n const [internalSearchTerm, setInternalSearchTerm] = useState(\n defaultValue ?? null\n );\n\n const debouncedOnChange = useMemo(\n () =>\n debounceFn((value: string | null) => {\n onChange(value);\n }, debounce),\n [onChange, debounce]\n );\n\n const handleOnChange = useCallback(\n (value: string) => {\n const newValue = !isEmpty(value) ? value : null;\n\n setInternalSearchTerm(newValue);\n debouncedOnChange(newValue);\n },\n [debouncedOnChange]\n );\n\n const handleOnReset = (event?: MouseEvent | KeyboardEvent) => {\n event?.preventDefault();\n\n if (!isEmpty(internalSearchTerm)) {\n onChange(null);\n setInternalSearchTerm(null);\n }\n };\n\n const handleRef = (element: HTMLInputElement) => {\n setInputRef && setInputRef(element);\n };\n\n const userHasEnteredSearchTerm = !isEmpty(internalSearchTerm);\n\n return (\n \n \n \n {userHasEnteredSearchTerm ? (\n \n ) : (\n \n )}\n \n \n );\n};\n\nexport default SearchInput;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon from '../Icon';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\nconst timeout = 350;\n\nconst ErrorMessageText = styled.div`\n flex: 1 1 100%;\n color: ${colors.red600};\n font-size: ${fontSizes.base}px;\n line-height: normal;\n font-weight: 400;\n\n a {\n color: ${colors.red600};\n font-weight: 500;\n text-decoration: underline;\n\n &:hover {\n color: ${darken(0.2, colors.red600)};\n text-decoration: underline;\n }\n }\n\n strong {\n font-weight: 500;\n }\n`;\n\nconst ErrorIcon = styled(Icon)`\n flex: 0 0 24px;\n fill: ${colors.red600};\n padding: 0px;\n margin: 0px;\n margin-right: 10px;\n`;\n\nconst ContainerInner = styled.div<{ showBackground: boolean }>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 13px;\n border-radius: ${(props) => props.theme.borderRadius};\n background: ${colors.red100};\n background: ${(props) =>\n props.showBackground ? colors.red100 : 'transparent'};\n`;\n\nconst Container = styled.div<{ marginTop: string; marginBottom: string }>`\n position: relative;\n overflow: hidden;\n\n ${ContainerInner} {\n margin-top: ${(props) => props.marginTop};\n margin-bottom: ${(props) => props.marginBottom};\n }\n\n &.error-enter {\n max-height: 0px;\n opacity: 0;\n\n &.error-enter-active {\n max-height: 60px;\n opacity: 1;\n transition: max-height ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1),\n opacity ${timeout}ms cubic-bezier(0.165, 0.84, 0.44, 1);\n }\n }\n\n &.error-exit {\n max-height: 100px;\n opacity: 1;\n\n &.error-exit-active {\n max-height: 0px;\n opacity: 0;\n transition: max-height ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1),\n opacity ${timeout}ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n }\n`;\n\ninterface DefaultProps {\n marginTop: string;\n marginBottom: string;\n showIcon: boolean;\n showBackground: boolean;\n className: string;\n animate: boolean | undefined;\n}\n\ninterface Props extends DefaultProps {\n text?: string | null;\n}\n\ninterface State {\n mounted: boolean;\n}\n\nclass Error extends PureComponent {\n static defaultProps: DefaultProps = {\n marginTop: '3px',\n marginBottom: '0px',\n showIcon: true,\n showBackground: true,\n className: '',\n animate: true,\n };\n\n constructor(props: Props) {\n super(props);\n this.state = {\n mounted: false,\n };\n }\n\n componentDidMount() {\n this.setState({ mounted: true });\n }\n\n componentWillUnmount() {\n this.setState({ mounted: false });\n }\n\n render() {\n const { mounted } = this.state;\n const {\n text,\n marginTop,\n marginBottom,\n showIcon,\n showBackground,\n className,\n animate,\n } = this.props;\n\n return (\n \n \n \n {showIcon && (\n \n )}\n {text &&

{text}

}\n \n \n \n );\n }\n}\n\nexport default Error;\n","import styled from 'styled-components';\nimport { hideVisually } from 'polished';\nimport { invisibleA11yText } from './styleUtils';\n\nexport const HiddenLabel = styled.label`\n span:first-child {\n ${hideVisually()}\n }\n`;\n\n/**\n * Our fieldsets usually don't have borders\n */\nexport const Fieldset = styled.fieldset`\n border: none;\n`;\n\n/**\n * Wrap in this component any element that should only be visible by screen readers\n */\nexport const ScreenReaderOnly = styled.span`\n ${invisibleA11yText()}\n`;\n","import React, { PureComponent, FormEvent, KeyboardEvent } from 'react';\nimport { isNil, isEmpty, size as lodashSize, isBoolean } from 'lodash-es';\n\n// components\nimport Error from '../Error';\nimport Label from '../Label';\nimport IconTooltip from '../IconTooltip';\n\n// style\nimport styled from 'styled-components';\nimport {\n colors,\n fontSizes,\n defaultInputStyle,\n defaultStyles,\n isRtl,\n} from '../../utils/styleUtils';\nimport { ScreenReaderOnly } from '../../utils/a11y';\n\n// typings\nimport { Locale, InputSize } from '../../utils/typings';\n\ninterface ContainerProps {\n size: InputSize;\n}\n\nconst Container = styled.div`\n width: 100%;\n position: relative;\n\n input {\n width: 100%;\n\n &.hasMaxCharCount {\n padding-right: 62px;\n }\n ${isRtl`\n &.hasMaxCharCount {\n padding-right: ${defaultStyles.inputPadding};\n padding-left: 62px;\n }`}\n ${defaultInputStyle};\n }\n`;\n\nconst CharCount = styled.div<{ inputSize?: InputSize }>`\n color: ${colors.textSecondary};\n font-size: ${fontSizes.s}px;\n font-weight: 400;\n text-align: right;\n position: absolute;\n bottom: ${({ inputSize }) => (inputSize === 'small' ? '10px' : '14px')};\n right: 10px;\n\n ${isRtl`\n left: 10px;\n right: auto;\n `}\n\n &.error {\n color: red;\n }\n`;\n\nexport interface InputProps {\n ariaLabel?: string;\n id?: string;\n label?: string | JSX.Element | null;\n labelTooltipText?: string | JSX.Element | null;\n value?: string | null;\n locale?: Locale;\n type: 'text' | 'email' | 'password' | 'number' | 'date';\n placeholder?: string | null;\n error?: string | null;\n onChange?: (arg: string, locale: Locale | undefined) => void;\n onFocus?: (arg: FormEvent) => void;\n onBlur?: (arg: FormEvent) => void;\n setRef?: (arg: HTMLInputElement) => void | undefined;\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocus?: boolean;\n min?: string;\n max?: string;\n name?: string;\n maxCharCount?: number;\n disabled?: boolean;\n spellCheck?: boolean;\n readOnly?: boolean;\n required?: boolean;\n autocomplete?:\n | 'email'\n | 'given-name'\n | 'family-name'\n | 'current-password'\n | 'new-password'\n | 'off'\n | 'on'; // https://www.w3.org/TR/WCAG21/#input-purposes\n a11yCharactersLeftMessage?: string;\n className?: string;\n size?: InputSize;\n 'data-testid'?: string;\n}\n\nclass Input extends PureComponent {\n handleOnChange = (event: FormEvent) => {\n const { maxCharCount, onChange, locale } = this.props;\n\n if (\n !maxCharCount ||\n lodashSize(event.currentTarget.value) <= maxCharCount\n ) {\n if (onChange) {\n onChange(event.currentTarget.value, locale);\n }\n }\n };\n\n handleOnBlur = (event: FormEvent) => {\n const { onBlur } = this.props;\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n handleRef = (element: HTMLInputElement) => {\n this.props.setRef && this.props.setRef(element);\n };\n\n render() {\n const {\n label,\n labelTooltipText,\n ariaLabel,\n a11yCharactersLeftMessage,\n className,\n onKeyDown,\n } = this.props;\n const {\n id,\n type,\n name,\n maxCharCount,\n min,\n max,\n autoFocus,\n onFocus,\n disabled,\n spellCheck,\n readOnly,\n required,\n autocomplete,\n size = 'medium',\n 'data-testid': dataTestId,\n } = this.props;\n const hasError = !isNil(this.props.error) && !isEmpty(this.props.error);\n const optionalProps = isBoolean(spellCheck) ? { spellCheck } : null;\n const value = !isNil(this.props.value) ? this.props.value : '';\n const placeholder = this.props.placeholder || '';\n const error = this.props.error || null;\n const currentCharCount = maxCharCount && lodashSize(value);\n const tooManyChars = !!(\n maxCharCount &&\n currentCharCount &&\n currentCharCount > maxCharCount\n );\n\n return (\n \n {label && (\n \n )}\n\n \n\n {maxCharCount && (\n <>\n {a11yCharactersLeftMessage && (\n \n {a11yCharactersLeftMessage}\n \n )}\n \n {currentCharCount}/{maxCharCount}\n \n \n )}\n\n \n \n );\n }\n}\n\nexport default Input;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-Select-Select-stories-mdx.838c2537.iframe.bundle.js b/docs/components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js similarity index 60% rename from docs/components-Select-Select-stories-mdx.838c2537.iframe.bundle.js rename to docs/components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js index 8ce0908fed33..abbd502550f4 100644 --- a/docs/components-Select-Select-stories-mdx.838c2537.iframe.bundle.js +++ b/docs/components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js @@ -61,7 +61,7 @@ } ${styleUtils.D0}; } -`;class Select extends react.PureComponent{static defaultProps={canBeEmpty:!1};handleOnChange=event=>{const{options,onChange}=this.props,selectedOption=options?.find((option=>option.value.toString()===event.target.value.toString()));selectedOption&&onChange(selectedOption)};handleOnBlur=event=>{this.props?.onBlur?.(event)};render(){const{id,disabled,className,options,canBeEmpty,label,labelTooltipText,labelTooltipPlacement,size,value,placeholder}=this.props,selectedValue=((options,value,placeholder)=>{const selectedValue=options?.find((option=>option.value===value))?.value;return selectedValue||(void 0!==placeholder?"PLACEHOLDER_SELECT_VALUE":"DEFAULT_SELECT_VALUE")})(options,(0,isString.A)(value)||lodash_es_isNumber(value)?value:(0,get.A)(value,"value",null),placeholder),showPlaceholder="PLACEHOLDER_SELECT_VALUE"===selectedValue;return(0,jsx_runtime.jsxs)(Container,{className:`${className} ${disabled?"disabled":"enabled"}`,children:[label&&(0,jsx_runtime.jsxs)(Label.A,{htmlFor:id,children:[(0,jsx_runtime.jsx)("span",{children:label}),labelTooltipText&&(0,jsx_runtime.jsx)(IconTooltip.A,{content:labelTooltipText,placement:labelTooltipPlacement})]}),(0,jsx_runtime.jsxs)(SelectWrapper,{size,children:[(0,jsx_runtime.jsxs)("select",{id,disabled,onChange:this.handleOnChange,onBlur:this.handleOnBlur,className:`${disabled?"disabled":"enabled"} ${showPlaceholder?"placeholder":""}`,value:selectedValue,"data-testid":(0,testEnv.A)("select"),children:[void 0!==placeholder&&(0,jsx_runtime.jsx)("option",{value:"PLACEHOLDER_SELECT_VALUE","aria-selected":showPlaceholder,hidden:!0,disabled:!0,children:placeholder}),(0,jsx_runtime.jsx)("option",{value:"DEFAULT_SELECT_VALUE","aria-selected":"DEFAULT_SELECT_VALUE"===selectedValue,hidden:!canBeEmpty,disabled:!canBeEmpty}),options&&options.length>0&&options.map(((option,index)=>(0,jsx_runtime.jsx)("option",{value:option.value,"aria-selected":selectedValue===option.value,disabled:option.disabled,children:option.label},index)))]}),(0,jsx_runtime.jsx)(SelectIcon,{name:"chevron-down",ariaHidden:!0,className:"arrow "+(disabled?"disabled":"enabled")})]})]})}}Select.displayName="Select";const components_Select=Select;try{SelectIcon.displayName="SelectIcon",SelectIcon.__docgenInfo={description:"",displayName:"SelectIcon",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"((string | Element) & (string | Element | undefined)) | undefined"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"enum",value:[{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},ariaHidden:{defaultValue:null,description:"",name:"ariaHidden",required:!1,type:{name:"boolean | undefined"}},viewBox:{defaultValue:null,description:"",name:"viewBox",required:!1,type:{name:"string | undefined"}},fill:{defaultValue:null,description:"",name:"fill",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},"data-testid":{defaultValue:null,description:"",name:"data-testid",required:!1,type:{name:"string | undefined"}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Select/index.tsx#SelectIcon"]={docgenInfo:SelectIcon.__docgenInfo,name:"SelectIcon",path:"src/components/Select/index.tsx#SelectIcon"})}catch(__react_docgen_typescript_loader_error){}try{SelectWrapper.displayName="SelectWrapper",SelectWrapper.__docgenInfo={description:"",displayName:"SelectWrapper",props:{size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"small"'},{value:'"medium"'}]}},ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Select/index.tsx#SelectWrapper"]={docgenInfo:SelectWrapper.__docgenInfo,name:"SelectWrapper",path:"src/components/Select/index.tsx#SelectWrapper"})}catch(__react_docgen_typescript_loader_error){}try{Select.displayName="Select",Select.__docgenInfo={description:"",displayName:"Select",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(arg: IOption) => void"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"((event: FocusEvent) => void) | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | number | IOption | null | undefined"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"IOption[] | null"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"string | Element | null | undefined"}},labelTooltipText:{defaultValue:null,description:"",name:"labelTooltipText",required:!1,type:{name:"string | Element | null | undefined"}},labelTooltipPlacement:{defaultValue:null,description:"",name:"labelTooltipPlacement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"small"'},{value:'"medium"'}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string | undefined"}},canBeEmpty:{defaultValue:{value:"false"},description:"",name:"canBeEmpty",required:!1,type:{name:"boolean | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Select/index.tsx#Select"]={docgenInfo:Select.__docgenInfo,name:"Select",path:"src/components/Select/index.tsx#Select"})}catch(__react_docgen_typescript_loader_error){}const defaultStory=()=>(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})});defaultStory.storyName="default",defaultStory.parameters={storySource:{source:'
'}};const withLabel=()=>(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{label:"This is a label",options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})});withLabel.storyName="with label",withLabel.parameters={storySource:{source:'
'}};const withNumberValues=()=>(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}],value:{value:3,label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",value:2})});withNumberValues.storyName="with number values",withNumberValues.parameters={storySource:{source:'
'}};const componentMeta={title:"Components/Select",component:components_Select,tags:["stories-mdx"],includeStories:["defaultStory","withSelectedOption","withLabel","disabled","withNumberValues","withPlaceholder"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/Select",component:components_Select}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"select",children:"Select"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_Select}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"default",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with selected option",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with label",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{label:"This is a label",options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"disabled",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",disabled:!0})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with number values",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}],value:{value:3,label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",value:2})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with placeholder",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}],onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",placeholder:"Placeholder"})})})})]})}}};const Select_stories=componentMeta,__namedExportsOrder=["defaultStory","withSelectedOption","withLabel","disabled","withNumberValues","withPlaceholder"]},"./src/components/IconTooltip/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@tippyjs/react/dist/tippy-react.esm.js"),styled_components__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),_Icon__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/Icon/index.tsx"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/utils/styleUtils.ts"),_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/utils/testUtils/testEnv.ts"),_Box__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/components/Box/index.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react/jsx-runtime.js");const ContentWrapper=styled_components__WEBPACK_IMPORTED_MODULE_6__.Ay.div` +`;class Select extends react.PureComponent{static defaultProps={canBeEmpty:!1};handleOnChange=event=>{const{options,onChange}=this.props,selectedOption=options?.find((option=>option.value.toString()===event.target.value.toString()));selectedOption&&onChange(selectedOption)};handleOnBlur=event=>{this.props?.onBlur?.(event)};render(){const{id,disabled,className,options,canBeEmpty,label,labelTooltipText,labelTooltipPlacement,size,value,placeholder}=this.props,selectedValue=((options,value,placeholder)=>{const selectedValue=options?.find((option=>option.value===value))?.value;return selectedValue||(void 0!==placeholder?"PLACEHOLDER_SELECT_VALUE":"DEFAULT_SELECT_VALUE")})(options,(0,isString.A)(value)||lodash_es_isNumber(value)?value:(0,get.A)(value,"value",null),placeholder),showPlaceholder="PLACEHOLDER_SELECT_VALUE"===selectedValue;return(0,jsx_runtime.jsxs)(Container,{className:`${className} ${disabled?"disabled":"enabled"}`,children:[label&&(0,jsx_runtime.jsxs)(Label.A,{htmlFor:id,children:[(0,jsx_runtime.jsx)("span",{children:label}),labelTooltipText&&(0,jsx_runtime.jsx)(IconTooltip.A,{content:labelTooltipText,placement:labelTooltipPlacement})]}),(0,jsx_runtime.jsxs)(SelectWrapper,{size,children:[(0,jsx_runtime.jsxs)("select",{id,disabled,onChange:this.handleOnChange,onBlur:this.handleOnBlur,className:`${disabled?"disabled":"enabled"} ${showPlaceholder?"placeholder":""}`,value:selectedValue,"data-testid":(0,testEnv.A)("select"),children:[void 0!==placeholder&&(0,jsx_runtime.jsx)("option",{value:"PLACEHOLDER_SELECT_VALUE","aria-selected":showPlaceholder,hidden:!0,disabled:!0,children:placeholder}),(0,jsx_runtime.jsx)("option",{value:"DEFAULT_SELECT_VALUE","aria-selected":"DEFAULT_SELECT_VALUE"===selectedValue,hidden:!canBeEmpty,disabled:!canBeEmpty}),options&&options.length>0&&options.map(((option,index)=>(0,jsx_runtime.jsx)("option",{value:option.value,"aria-selected":selectedValue===option.value,disabled:option.disabled,children:option.label},index)))]}),(0,jsx_runtime.jsx)(SelectIcon,{name:"chevron-down",ariaHidden:!0,className:"arrow "+(disabled?"disabled":"enabled")})]})]})}}Select.displayName="Select";const components_Select=Select;try{SelectIcon.displayName="SelectIcon",SelectIcon.__docgenInfo={description:"",displayName:"SelectIcon",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | undefined"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"((string | Element) & (string | Element | undefined)) | undefined"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"enum",value:[{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},ariaHidden:{defaultValue:null,description:"",name:"ariaHidden",required:!1,type:{name:"boolean | undefined"}},viewBox:{defaultValue:null,description:"",name:"viewBox",required:!1,type:{name:"string | undefined"}},fill:{defaultValue:null,description:"",name:"fill",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},"data-testid":{defaultValue:null,description:"",name:"data-testid",required:!1,type:{name:"string | undefined"}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Select/index.tsx#SelectIcon"]={docgenInfo:SelectIcon.__docgenInfo,name:"SelectIcon",path:"src/components/Select/index.tsx#SelectIcon"})}catch(__react_docgen_typescript_loader_error){}try{SelectWrapper.displayName="SelectWrapper",SelectWrapper.__docgenInfo={description:"",displayName:"SelectWrapper",props:{size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"small"'},{value:'"medium"'}]}},ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Select/index.tsx#SelectWrapper"]={docgenInfo:SelectWrapper.__docgenInfo,name:"SelectWrapper",path:"src/components/Select/index.tsx#SelectWrapper"})}catch(__react_docgen_typescript_loader_error){}try{Select.displayName="Select",Select.__docgenInfo={description:"",displayName:"Select",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(arg: IOption) => void"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"((event: FocusEvent) => void) | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | number | IOption | null | undefined"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"IOption[] | null"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"string | Element | null | undefined"}},labelTooltipText:{defaultValue:null,description:"",name:"labelTooltipText",required:!1,type:{name:"string | Element | null | undefined"}},labelTooltipPlacement:{defaultValue:null,description:"",name:"labelTooltipPlacement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"small"'},{value:'"medium"'}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string | undefined"}},canBeEmpty:{defaultValue:{value:"false"},description:"",name:"canBeEmpty",required:!1,type:{name:"boolean | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Select/index.tsx#Select"]={docgenInfo:Select.__docgenInfo,name:"Select",path:"src/components/Select/index.tsx#Select"})}catch(__react_docgen_typescript_loader_error){}const defaultStory=()=>(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})});defaultStory.storyName="default",defaultStory.parameters={storySource:{source:'
'}};const withLabel=()=>(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{label:"This is a label",options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})});withLabel.storyName="with label",withLabel.parameters={storySource:{source:'
'}};const withNumberValues=()=>(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}],value:{value:3,label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",value:2})});withNumberValues.storyName="with number values",withNumberValues.parameters={storySource:{source:'
'}};const componentMeta={title:"Components/Select",component:components_Select,tags:["stories-mdx"],includeStories:["defaultStory","withSelectedOption","withLabel","disabled","withNumberValues","withPlaceholder"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/Select",component:components_Select}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"select",children:"Select"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_Select}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"default",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with selected option",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with label",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{label:"This is a label",options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal"})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"disabled",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:"option-1",label:"Option 1"},{value:"option-1",label:"Option 2"}],value:{value:"option-1",label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",disabled:!0})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with number values",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}],value:{value:3,label:"Option 1"},onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",value:2})})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with placeholder",children:(0,jsx_runtime.jsx)("div",{style:{maxWidth:"400px"},children:(0,jsx_runtime.jsx)(components_Select,{options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}],onChange:(0,addon_actions_dist.XI)("Select onChange triggered"),size:(0,addon_knobs_dist.boolean)("Small",!1)?"small":"normal",placeholder:"Placeholder"})})})})]})}}};const Select_stories=componentMeta,__namedExportsOrder=["defaultStory","withSelectedOption","withLabel","disabled","withNumberValues","withPlaceholder"]},"./src/components/IconTooltip/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@tippyjs/react/dist/tippy-react.esm.js"),styled_components__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),polished__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/polished/dist/polished.esm.js"),_Icon__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/Icon/index.tsx"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/utils/styleUtils.ts"),_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/utils/testUtils/testEnv.ts"),_Box__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/components/Box/index.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react/jsx-runtime.js");const ContentWrapper=styled_components__WEBPACK_IMPORTED_MODULE_6__.Ay.div` padding: 5px; a { @@ -88,7 +88,7 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Label/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>Label});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),styled_components__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utils/styleUtils.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js");const Container=styled_components__WEBPACK_IMPORTED_MODULE_3__.Ay.label` +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Label/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>Label});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),styled_components__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utils/styleUtils.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js");const Container=styled_components__WEBPACK_IMPORTED_MODULE_3__.Ay.label` color: ${_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.Tj.textSecondary}; display: flex; align-items: center; @@ -111,4 +111,4 @@ ${_utils_styleUtils__WEBPACK_IMPORTED_MODULE_1__.bS} } `;class Label extends react__WEBPACK_IMPORTED_MODULE_0__.PureComponent{handleOnClick=event=>{this.props.onClick&&this.props.onClick(event)};render(){const{value,htmlFor,children,id,className,hidden}=this.props;return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Container,{id,className:`${className||""} ${hidden?"invisible":""}`,htmlFor,onClick:this.handleOnClick,children:children||value})}}Label.displayName="Label";try{Label.displayName="Label",Label.__docgenInfo={description:"",displayName:"Label",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | Element | undefined"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string | undefined"}},hidden:{defaultValue:null,description:"",name:"hidden",required:!1,type:{name:"boolean | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((event: MouseEvent) => void) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Label/index.tsx#Label"]={docgenInfo:Label.__docgenInfo,name:"Label",path:"src/components/Label/index.tsx#Label"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}},"./node_modules/lodash-es/isString.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _baseGetTag_js__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/lodash-es/_baseGetTag.js"),_isArray_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/lodash-es/isArray.js"),_isObjectLike_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/lodash-es/isObjectLike.js");const __WEBPACK_DEFAULT_EXPORT__=function isString(value){return"string"==typeof value||!(0,_isArray_js__WEBPACK_IMPORTED_MODULE_0__.A)(value)&&(0,_isObjectLike_js__WEBPACK_IMPORTED_MODULE_1__.A)(value)&&"[object String]"==(0,_baseGetTag_js__WEBPACK_IMPORTED_MODULE_2__.A)(value)}}}]); -//# sourceMappingURL=components-Select-Select-stories-mdx.838c2537.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-Select-Select-stories-mdx.838c2537.iframe.bundle.js.map b/docs/components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js.map similarity index 98% rename from docs/components-Select-Select-stories-mdx.838c2537.iframe.bundle.js.map rename to docs/components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js.map index f4224a373cd9..23eea5e45147 100644 --- a/docs/components-Select-Select-stories-mdx.838c2537.iframe.bundle.js.map +++ b/docs/components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-Select-Select-stories-mdx.838c2537.iframe.bundle.js","mappings":";;;;;;;;;AAoBA;;;;AAMA;;;;;;AAMA;AACA;;;;;AAKA;AACA;;;;;;AAMA;;;;;;AAMA;;;;AAIA;;AAIA;;;;;;;;;;AAUA;;;;;;;AAOA;;AAuCA;;;;AC9FA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;AC1EA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Select/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { PureComponent, FocusEvent, ChangeEvent } from 'react';\r\nimport { isString, get, isNumber } from 'lodash-es';\r\nimport Icon from '../Icon';\r\nimport Label from '../Label';\r\nimport IconTooltip from '../IconTooltip';\r\nimport { IOption, InputSize } from '../../utils/typings';\r\nimport styled from 'styled-components';\r\nimport { defaultInputStyle, colors, isRtl } from '../../utils/styleUtils';\r\nimport testEnv from '../../utils/testUtils/testEnv';\r\nimport { Placement } from 'tippy.js';\r\n\r\nexport const SelectIcon = styled(Icon)`\r\n fill: #999;\r\n pointer-events: none;\r\n margin: auto;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n right: 11px;\r\n\r\n ${isRtl`\r\n right: auto;\r\n left: 11px;\r\n `}\r\n`;\r\n\r\nconst Container = styled.div`\r\n position: relative;\r\n outline: none !important;\r\n\r\n &.enabled {\r\n &:hover {\r\n ${SelectIcon} {\r\n fill: ${colors.black};\r\n }\r\n }\r\n\r\n &:focus {\r\n ${SelectIcon} {\r\n fill: ${colors.black};\r\n }\r\n }\r\n }\r\n\r\n &.disabled {\r\n ${SelectIcon} {\r\n fill: #666;\r\n }\r\n }\r\n\r\n select.placeholder {\r\n color: ${colors.placeholder};\r\n }\r\n\r\n select.placeholder > option {\r\n color: ${colors.textPrimary};\r\n }\r\n`;\r\n\r\nexport const SelectWrapper = styled.div`\r\n width: 100%;\r\n position: relative;\r\n select {\r\n width: 100%;\r\n margin: 0;\r\n padding-right: 27px;\r\n cursor: pointer;\r\n outline: none !important;\r\n\r\n ${isRtl`\r\n padding-right: 0;\r\n padding-left: 27px;\r\n `}\r\n &::-ms-expand {\r\n display: none;\r\n }\r\n ${defaultInputStyle};\r\n }\r\n`;\r\n\r\nexport interface DefaultProps {\r\n canBeEmpty?: boolean;\r\n}\r\n\r\nexport interface Props extends DefaultProps {\r\n id?: string;\r\n disabled?: boolean;\r\n onChange: (arg: IOption) => void;\r\n onBlur?: (event: FocusEvent) => void;\r\n value?: IOption | string | number | null;\r\n options: IOption[] | null;\r\n label?: string | JSX.Element | null;\r\n labelTooltipText?: string | JSX.Element | null;\r\n labelTooltipPlacement?: Placement;\r\n className?: string;\r\n size?: InputSize;\r\n placeholder?: string;\r\n}\r\n\r\nconst defaultValue = 'DEFAULT_SELECT_VALUE';\r\nconst placeholderValue = 'PLACEHOLDER_SELECT_VALUE';\r\n\r\nconst getSelectedValue = (\r\n options: IOption[] | null,\r\n value: any,\r\n placeholder?: string\r\n) => {\r\n const selectedValue = options?.find(\r\n (option) => option.value === value\r\n )?.value;\r\n if (selectedValue) return selectedValue;\r\n\r\n return placeholder !== undefined ? placeholderValue : defaultValue;\r\n};\r\n\r\nclass Select extends PureComponent {\r\n static defaultProps: DefaultProps = {\r\n canBeEmpty: false,\r\n };\r\n\r\n handleOnChange = (event: ChangeEvent) => {\r\n const { options, onChange } = this.props;\r\n\r\n // comparing the string versions since event.target.value returns a string even when the value was defined as a number\r\n const selectedOption = options?.find(\r\n (option) => option.value.toString() === event.target.value.toString()\r\n );\r\n if (selectedOption) onChange(selectedOption);\r\n };\r\n\r\n handleOnBlur = (event: FocusEvent) => {\r\n this.props?.onBlur?.(event);\r\n };\r\n\r\n render() {\r\n const {\r\n id,\r\n disabled,\r\n className,\r\n options,\r\n canBeEmpty,\r\n label,\r\n labelTooltipText,\r\n labelTooltipPlacement,\r\n size,\r\n value,\r\n placeholder,\r\n } = this.props;\r\n const safeValue =\r\n isString(value) || isNumber(value) ? value : get(value, 'value', null);\r\n\r\n const selectedValue = getSelectedValue(options, safeValue, placeholder);\r\n\r\n const showPlaceholder = selectedValue === placeholderValue;\r\n\r\n return (\r\n \r\n {label && (\r\n \r\n )}\r\n \r\n \r\n {placeholder !== undefined && (\r\n \r\n {placeholder}\r\n \r\n )}\r\n\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nexport default Select;\r\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-Select-Select-stories-mdx.f365f2f8.iframe.bundle.js","mappings":";;;;;;;;;AAoBA;;;;AAMA;;;;;;AAMA;AACA;;;;;AAKA;AACA;;;;;;AAMA;;;;;;AAMA;;;;AAIA;;AAIA;;;;;;;;;;AAUA;;;;;;;AAOA;;AAuCA;;;;AC9FA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA;AC1EA;;;AAGA;;;;;;;;;;;;;;;;AAgBA;;AAcA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Select/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Label/index.tsx"],"sourcesContent":["import React, { PureComponent, FocusEvent, ChangeEvent } from 'react';\r\nimport { isString, get, isNumber } from 'lodash-es';\r\nimport Icon from '../Icon';\r\nimport Label from '../Label';\r\nimport IconTooltip from '../IconTooltip';\r\nimport { IOption, InputSize } from '../../utils/typings';\r\nimport styled from 'styled-components';\r\nimport { defaultInputStyle, colors, isRtl } from '../../utils/styleUtils';\r\nimport testEnv from '../../utils/testUtils/testEnv';\r\nimport { Placement } from 'tippy.js';\r\n\r\nexport const SelectIcon = styled(Icon)`\r\n fill: #999;\r\n pointer-events: none;\r\n margin: auto;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n right: 11px;\r\n\r\n ${isRtl`\r\n right: auto;\r\n left: 11px;\r\n `}\r\n`;\r\n\r\nconst Container = styled.div`\r\n position: relative;\r\n outline: none !important;\r\n\r\n &.enabled {\r\n &:hover {\r\n ${SelectIcon} {\r\n fill: ${colors.black};\r\n }\r\n }\r\n\r\n &:focus {\r\n ${SelectIcon} {\r\n fill: ${colors.black};\r\n }\r\n }\r\n }\r\n\r\n &.disabled {\r\n ${SelectIcon} {\r\n fill: #666;\r\n }\r\n }\r\n\r\n select.placeholder {\r\n color: ${colors.placeholder};\r\n }\r\n\r\n select.placeholder > option {\r\n color: ${colors.textPrimary};\r\n }\r\n`;\r\n\r\nexport const SelectWrapper = styled.div`\r\n width: 100%;\r\n position: relative;\r\n select {\r\n width: 100%;\r\n margin: 0;\r\n padding-right: 27px;\r\n cursor: pointer;\r\n outline: none !important;\r\n\r\n ${isRtl`\r\n padding-right: 0;\r\n padding-left: 27px;\r\n `}\r\n &::-ms-expand {\r\n display: none;\r\n }\r\n ${defaultInputStyle};\r\n }\r\n`;\r\n\r\nexport interface DefaultProps {\r\n canBeEmpty?: boolean;\r\n}\r\n\r\nexport interface Props extends DefaultProps {\r\n id?: string;\r\n disabled?: boolean;\r\n onChange: (arg: IOption) => void;\r\n onBlur?: (event: FocusEvent) => void;\r\n value?: IOption | string | number | null;\r\n options: IOption[] | null;\r\n label?: string | JSX.Element | null;\r\n labelTooltipText?: string | JSX.Element | null;\r\n labelTooltipPlacement?: Placement;\r\n className?: string;\r\n size?: InputSize;\r\n placeholder?: string;\r\n}\r\n\r\nconst defaultValue = 'DEFAULT_SELECT_VALUE';\r\nconst placeholderValue = 'PLACEHOLDER_SELECT_VALUE';\r\n\r\nconst getSelectedValue = (\r\n options: IOption[] | null,\r\n value: any,\r\n placeholder?: string\r\n) => {\r\n const selectedValue = options?.find(\r\n (option) => option.value === value\r\n )?.value;\r\n if (selectedValue) return selectedValue;\r\n\r\n return placeholder !== undefined ? placeholderValue : defaultValue;\r\n};\r\n\r\nclass Select extends PureComponent {\r\n static defaultProps: DefaultProps = {\r\n canBeEmpty: false,\r\n };\r\n\r\n handleOnChange = (event: ChangeEvent) => {\r\n const { options, onChange } = this.props;\r\n\r\n // comparing the string versions since event.target.value returns a string even when the value was defined as a number\r\n const selectedOption = options?.find(\r\n (option) => option.value.toString() === event.target.value.toString()\r\n );\r\n if (selectedOption) onChange(selectedOption);\r\n };\r\n\r\n handleOnBlur = (event: FocusEvent) => {\r\n this.props?.onBlur?.(event);\r\n };\r\n\r\n render() {\r\n const {\r\n id,\r\n disabled,\r\n className,\r\n options,\r\n canBeEmpty,\r\n label,\r\n labelTooltipText,\r\n labelTooltipPlacement,\r\n size,\r\n value,\r\n placeholder,\r\n } = this.props;\r\n const safeValue =\r\n isString(value) || isNumber(value) ? value : get(value, 'value', null);\r\n\r\n const selectedValue = getSelectedValue(options, safeValue, placeholder);\r\n\r\n const showPlaceholder = selectedValue === placeholderValue;\r\n\r\n return (\r\n \r\n {label && (\r\n \r\n )}\r\n \r\n \r\n {placeholder !== undefined && (\r\n \r\n {placeholder}\r\n \r\n )}\r\n\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nexport default Select;\r\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n","import React, { PureComponent, MouseEvent } from 'react';\nimport styled from 'styled-components';\nimport { fontSizes, colors, invisibleA11yText } from '../../utils/styleUtils';\n\nconst Container = styled.label`\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n font-size: ${fontSizes.base}px;\n font-weight: 400;\n line-height: normal;\n margin: 0;\n padding: 0;\n margin-bottom: 10px;\n\n & > :not(last-child) {\n margin-right: 4px;\n }\n\n & .tooltip-icon {\n margin-left: 6px;\n }\n\n &.invisible {\n ${invisibleA11yText}\n }\n`;\n\ntype Props = {\n id?: string;\n value?: string | JSX.Element;\n htmlFor?: string;\n children?: any;\n hidden?: boolean;\n className?: string;\n onClick?: (event: MouseEvent) => void;\n};\n\nexport default class Label extends PureComponent {\n handleOnClick = (event: MouseEvent) => {\n this.props.onClick && this.props.onClick(event);\n };\n\n render() {\n const { value, htmlFor, children, id, className, hidden } = this.props;\n\n return (\n \n {children || value}\n \n );\n }\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js b/docs/components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js similarity index 72% rename from docs/components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js rename to docs/components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js index a86e4f036700..51dc3d52bbf4 100644 --- a/docs/components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js +++ b/docs/components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js @@ -16,5 +16,5 @@ ${"default"===variant?"\n color: #fff;\n ":""} ${"outlined"===variant?`\n color: ${styleUtils.Tj.textSecondary};\n border: 1px solid ${styleUtils.Tj.textSecondary};\n `:""} `} -`,StatusLabel=(0,react.memo)((({backgroundColor,className,icon,text,variant="default",...rest})=>(0,jsx_runtime.jsxs)(Container,{backgroundColor,className:className||"",variant,...rest,children:[icon&&(0,jsx_runtime.jsx)(Icon.A,{name:icon,height:"16px",marginRight:"8px",fill:"outlined"===variant?styleUtils.Tj.textSecondary:"#fff"}),text]}))),components_StatusLabel=StatusLabel;try{StatusLabel.displayName="StatusLabel",StatusLabel.__docgenInfo={description:"",displayName:"StatusLabel",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"string | Element"}},backgroundColor:{defaultValue:null,description:"",name:"backgroundColor",required:!0,type:{name:"string"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"default"'},{value:'"outlined"'}]}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/StatusLabel/index.tsx#StatusLabel"]={docgenInfo:StatusLabel.__docgenInfo,name:"StatusLabel",path:"src/components/StatusLabel/index.tsx#StatusLabel"})}catch(__react_docgen_typescript_loader_error){}const defaultStory=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",backgroundColor:"navy"});defaultStory.storyName="default",defaultStory.parameters={storySource:{source:''}};const withIconProp=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",icon:"lock",backgroundColor:"navy"});withIconProp.storyName="with icon prop",withIconProp.parameters={storySource:{source:''}};const variantOutlined=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,variant:"outlined"});variantOutlined.storyName="variant - outlined",variantOutlined.parameters={storySource:{source:''}};const variantOutlinedWithIcon=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,icon:"lock",variant:"outlined"});variantOutlinedWithIcon.storyName="variant - outlined with icon",variantOutlinedWithIcon.parameters={storySource:{source:''}};const componentMeta={title:"Components/StatusLabel",component:components_StatusLabel,tags:["stories-mdx"],includeStories:["defaultStory","withIconProp","variantOutlined","variantOutlinedWithIcon"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/StatusLabel",component:components_StatusLabel}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"statuslabel",children:"StatusLabel"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_StatusLabel}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"default",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",backgroundColor:"navy"})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with icon prop",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",icon:"lock",backgroundColor:"navy"})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"variant - outlined",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,variant:"outlined"})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"variant - outlined with icon",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,icon:"lock",variant:"outlined"})})})]})}}};const StatusLabel_stories=componentMeta,__namedExportsOrder=["defaultStory","withIconProp","variantOutlined","variantOutlinedWithIcon"]}}]); -//# sourceMappingURL=components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js.map \ No newline at end of file +`,StatusLabel=(0,react.memo)((({backgroundColor,className,icon,text,variant="default",...rest})=>(0,jsx_runtime.jsxs)(Container,{backgroundColor,className:className||"",variant,...rest,children:[icon&&(0,jsx_runtime.jsx)(Icon.A,{name:icon,height:"16px",marginRight:"8px",fill:"outlined"===variant?styleUtils.Tj.textSecondary:"#fff"}),text]}))),components_StatusLabel=StatusLabel;try{StatusLabel.displayName="StatusLabel",StatusLabel.__docgenInfo={description:"",displayName:"StatusLabel",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"string | Element"}},backgroundColor:{defaultValue:null,description:"",name:"backgroundColor",required:!0,type:{name:"string"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"default"'},{value:'"outlined"'}]}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | undefined"}},w:{defaultValue:null,description:"",name:"w",required:!1,type:{name:"string | undefined"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string | undefined"}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/StatusLabel/index.tsx#StatusLabel"]={docgenInfo:StatusLabel.__docgenInfo,name:"StatusLabel",path:"src/components/StatusLabel/index.tsx#StatusLabel"})}catch(__react_docgen_typescript_loader_error){}const defaultStory=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",backgroundColor:"navy"});defaultStory.storyName="default",defaultStory.parameters={storySource:{source:''}};const withIconProp=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",icon:"lock",backgroundColor:"navy"});withIconProp.storyName="with icon prop",withIconProp.parameters={storySource:{source:''}};const variantOutlined=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,variant:"outlined"});variantOutlined.storyName="variant - outlined",variantOutlined.parameters={storySource:{source:''}};const variantOutlinedWithIcon=()=>(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,icon:"lock",variant:"outlined"});variantOutlinedWithIcon.storyName="variant - outlined with icon",variantOutlinedWithIcon.parameters={storySource:{source:''}};const componentMeta={title:"Components/StatusLabel",component:components_StatusLabel,tags:["stories-mdx"],includeStories:["defaultStory","withIconProp","variantOutlined","variantOutlinedWithIcon"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{})}):_createMdxContent();function _createMdxContent(){const _components=Object.assign({h1:"h1"},(0,lib.RP)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(blocks.W8,{title:"Components/StatusLabel",component:components_StatusLabel}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"statuslabel",children:"StatusLabel"}),"\n",(0,jsx_runtime.jsx)(dist.uY,{of:components_StatusLabel}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"default",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",backgroundColor:"navy"})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"with icon prop",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"In consideration",icon:"lock",backgroundColor:"navy"})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"variant - outlined",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,variant:"outlined"})})}),"\n",(0,jsx_runtime.jsx)(blocks.Hl,{children:(0,jsx_runtime.jsx)(blocks.gG,{name:"variant - outlined with icon",children:(0,jsx_runtime.jsx)(components_StatusLabel,{text:"Beta",backgroundColor:styleUtils.Tj.adminBackground,icon:"lock",variant:"outlined"})})})]})}}};const StatusLabel_stories=componentMeta,__namedExportsOrder=["defaultStory","withIconProp","variantOutlined","variantOutlinedWithIcon"]}}]); +//# sourceMappingURL=components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js.map b/docs/components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js.map similarity index 97% rename from docs/components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js.map rename to docs/components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js.map index c2c02ed5bf93..793d36189a72 100644 --- a/docs/components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js.map +++ b/docs/components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-StatusLabel-StatusLabel-stories-mdx.8de82296.iframe.bundle.js","mappings":";;AAQA;;;;;;;;AAQA;AACA;;;AAGA;AACA;AAKA;;AAmBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/StatusLabel/index.tsx"],"sourcesContent":["import React, { FC, memo } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { fontSizes, colors } from '../../utils/styleUtils';\r\nimport Icon, { IconProps } from '../Icon';\r\nimport Box, { BoxWidthProps } from '../Box';\r\n\r\nconst Container = styled(Box)<{ backgroundColor: string; variant: Variant }>`\r\n height: 28px;\r\n font-size: ${fontSizes.xs}px;\r\n font-weight: 500;\r\n line-height: normal;\r\n text-transform: uppercase;\r\n white-space: nowrap;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: ${(props) => props.theme.borderRadius};\r\n background: ${(props) => props.backgroundColor};\r\n padding-left: 10px;\r\n padding-right: 10px;\r\n ${({ variant }: { variant: Variant }) => css`\r\n ${variant === 'default'\r\n ? `\r\n color: #fff;\r\n `\r\n : ''}\r\n ${variant === 'outlined'\r\n ? `\r\n color: ${colors.textSecondary};\r\n border: 1px solid ${colors.textSecondary};\r\n `\r\n : ''}\r\n `}\r\n`;\r\n\r\ntype Variant = 'default' | 'outlined';\r\n\r\ntype Props = {\r\n className?: string;\r\n text: JSX.Element | string;\r\n backgroundColor: string;\r\n icon?: IconProps['name'];\r\n variant?: Variant;\r\n} & BoxWidthProps;\r\n\r\nconst StatusLabel: FC = memo(\r\n ({\r\n backgroundColor,\r\n className,\r\n icon,\r\n text,\r\n variant = 'default',\r\n ...rest\r\n }) => {\r\n return (\r\n \r\n {icon && (\r\n \r\n )}\r\n {text}\r\n \r\n );\r\n }\r\n);\r\n\r\nexport default StatusLabel;\r\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-StatusLabel-StatusLabel-stories-mdx.8cb3fb96.iframe.bundle.js","mappings":";;AAQA;;;;;;;;AAQA;AACA;;;AAGA;AACA;AAKA;;AAmBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/StatusLabel/index.tsx"],"sourcesContent":["import React, { FC, memo } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { fontSizes, colors } from '../../utils/styleUtils';\r\nimport Icon, { IconProps } from '../Icon';\r\nimport Box, { BoxWidthProps } from '../Box';\r\n\r\nconst Container = styled(Box)<{ backgroundColor: string; variant: Variant }>`\r\n height: 28px;\r\n font-size: ${fontSizes.xs}px;\r\n font-weight: 500;\r\n line-height: normal;\r\n text-transform: uppercase;\r\n white-space: nowrap;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: ${(props) => props.theme.borderRadius};\r\n background: ${(props) => props.backgroundColor};\r\n padding-left: 10px;\r\n padding-right: 10px;\r\n ${({ variant }: { variant: Variant }) => css`\r\n ${variant === 'default'\r\n ? `\r\n color: #fff;\r\n `\r\n : ''}\r\n ${variant === 'outlined'\r\n ? `\r\n color: ${colors.textSecondary};\r\n border: 1px solid ${colors.textSecondary};\r\n `\r\n : ''}\r\n `}\r\n`;\r\n\r\ntype Variant = 'default' | 'outlined';\r\n\r\ntype Props = {\r\n className?: string;\r\n text: JSX.Element | string;\r\n backgroundColor: string;\r\n icon?: IconProps['name'];\r\n variant?: Variant;\r\n} & BoxWidthProps;\r\n\r\nconst StatusLabel: FC = memo(\r\n ({\r\n backgroundColor,\r\n className,\r\n icon,\r\n text,\r\n variant = 'default',\r\n ...rest\r\n }) => {\r\n return (\r\n \r\n {icon && (\r\n \r\n )}\r\n {text}\r\n \r\n );\r\n }\r\n);\r\n\r\nexport default StatusLabel;\r\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js b/docs/components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js similarity index 93% rename from docs/components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js rename to docs/components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js index 3755ab6d0f8d..2015623cd230 100644 --- a/docs/components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js +++ b/docs/components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js @@ -46,5 +46,5 @@ &:hover { fill: ${({iconColor,iconHoverColor})=>iconHoverColor||(iconColor?(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,iconColor):(0,polished__WEBPACK_IMPORTED_MODULE_7__.e$)(.2,_utils_styleUtils__WEBPACK_IMPORTED_MODULE_2__.Tj.textSecondary))}; } -`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); -//# sourceMappingURL=components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js.map \ No newline at end of file +`,IconTooltip=(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)((({content,icon,placement,theme,iconSize="20px",iconColor,iconHoverColor,maxTooltipWidth,iconAriaTitle,className,transform,...rest})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_tippyjs_react__WEBPACK_IMPORTED_MODULE_8__.Ay,{interactive:!0,placement:placement||"right-end",theme:theme||"",maxWidth:maxTooltipWidth||350,content:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(ContentWrapper,{id:"tooltip-content",tippytheme:theme,children:content}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Box__WEBPACK_IMPORTED_MODULE_4__.A,{as:"button",className:`${className||""} tooltip-icon`,"aria-describedby":"tooltip-content","data-testid":(0,_utils_testUtils_testEnv__WEBPACK_IMPORTED_MODULE_3__.A)("tooltip-icon-button"),p:"0px",type:"button",display:"flex",justifyContent:"center",alignItems:"center",...rest,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(TooltipIcon,{name:icon||"info-solid",iconSize,iconColor,iconHoverColor,title:iconAriaTitle,transform})})}))),__WEBPACK_DEFAULT_EXPORT__=IconTooltip;try{ContentWrapper.displayName="ContentWrapper",ContentWrapper.__docgenInfo={description:"",displayName:"ContentWrapper",props:{ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"((instance: HTMLDivElement | null) => void) | RefObject | null | undefined"}},tippytheme:{defaultValue:null,description:"",name:"tippytheme",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"any"}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"undefined"}},forwardedAs:{defaultValue:null,description:"",name:"forwardedAs",required:!1,type:{name:"undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#ContentWrapper"]={docgenInfo:ContentWrapper.__docgenInfo,name:"ContentWrapper",path:"src/components/IconTooltip/index.tsx#ContentWrapper"})}catch(__react_docgen_typescript_loader_error){}try{IconTooltip.displayName="IconTooltip",IconTooltip.__docgenInfo={description:"",displayName:"IconTooltip",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"ReactChild"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"label"'},{value:'"twitter"'},{value:'"facebook"'},{value:'"position"'},{value:'"translate"'},{value:'"button"'},{value:'"grid"'},{value:'"group"'},{value:'"link"'},{value:'"list"'},{value:'"menu"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"page"'},{value:'"copy"'},{value:'"close"'},{value:'"upload-image"'},{value:'"upload-file"'},{value:'"alert-circle"'},{value:'"check"'},{value:'"halt"'},{value:'"arrow-right"'},{value:'"arrow-down"'},{value:'"arrow-up"'},{value:'"plus"'},{value:'"plus-circle"'},{value:'"delete"'},{value:'"edit"'},{value:'"vote-up"'},{value:'"vote-down"'},{value:'"chevron-right"'},{value:'"chevron-left"'},{value:'"chevron-up"'},{value:'"chevron-down"'},{value:'"idea"'},{value:'"sidebar-input-manager"'},{value:'"sidebar-proposals"'},{value:'"user-circle"'},{value:'"notification"'},{value:'"lock"'},{value:'"facebook-messenger"'},{value:'"microsoft-windows"'},{value:'"google"'},{value:'"hoplr"'},{value:'"comment"'},{value:'"comments"'},{value:'"info-outline"'},{value:'"calendar-range"'},{value:'"calendar"'},{value:'"power"'},{value:'"shield-checkered"'},{value:'"sidebar-settings"'},{value:'"send"'},{value:'"building"'},{value:'"mention"'},{value:'"dots-horizontal"'},{value:'"map"'},{value:'"gps"'},{value:'"location-simple"'},{value:'"timeline"'},{value:'"survey"'},{value:'"download"'},{value:'"user-check"'},{value:'"arrow-left"'},{value:'"shield-check"'},{value:'"sidebar-pages-menu"'},{value:'"email-2"'},{value:'"minus-circle"'},{value:'"sidebar-guide"'},{value:'"paperclip"'},{value:'"code"'},{value:'"question-bubble"'},{value:'"question-circle"'},{value:'"refresh"'},{value:'"share"'},{value:'"flash"'},{value:'"database"'},{value:'"folder-move"'},{value:'"user-data"'},{value:'"settings"'},{value:'"initiatives"'},{value:'"sidebar-folder"'},{value:'"folder-add"'},{value:'"sidebar-activity"'},{value:'"sidebar-workshops"'},{value:'"sidebar-users"'},{value:'"sidebar-dashboards"'},{value:'"chart-bar"'},{value:'"sidebar-invitations"'},{value:'"sidebar-messaging"'},{value:'"sidebar-academy"'},{value:'"money-bag"'},{value:'"home"'},{value:'"info-solid"'},{value:'"dot"'},{value:'"pen"'},{value:'"cl-favicon"'},{value:'"filter"'},{value:'"clock"'},{value:'"bullseye"'},{value:'"email-check"'},{value:'"check-circle"'},{value:'"template"'},{value:'"blank-paper"'},{value:'"participation-level"'},{value:'"key"'},{value:'"minus"'},{value:'"inbox"'},{value:'"bookmark"'},{value:'"bookmark-outline"'},{value:'"eye"'},{value:'"eye-off"'},{value:'"open-in-new"'},{value:'"file"'},{value:'"file-add"'},{value:'"folder-solid"'},{value:'"folder-outline"'},{value:'"flag"'},{value:'"user"'},{value:'"basket"'},{value:'"basket-plus"'},{value:'"basket-minus"'},{value:'"basket-checkmark"'},{value:'"volunteer"'},{value:'"volunteer-off"'},{value:'"cl-logo"'},{value:'"arrow-left-circle"'},{value:'"whatsapp"'},{value:'"sidebar-reporting"'},{value:'"alert-octagon"'},{value:'"alert-octagon-off"'},{value:'"filter-2"'},{value:'"categories"'},{value:'"token"'},{value:'"coin-stack"'},{value:'"image"'},{value:'"accordion"'},{value:'"layout-1column"'},{value:'"layout-2column-1"'},{value:'"layout-3column"'},{value:'"layout-2column-3"'},{value:'"layout-2column-2"'},{value:'"message"'},{value:'"layout-white-space"'},{value:'"section-info-accordion"'},{value:'"section-image-text"'},{value:'"tablet"'},{value:'"desktop"'},{value:'"survey-number-field"'},{value:'"sort"'},{value:'"survey-short-answer"'},{value:'"survey-long-answer"'},{value:'"survey-linear-scale"'},{value:'"survey-multiple-choice"'},{value:'"survey-long-answer-2"'},{value:'"survey-short-answer-2"'},{value:'"survey-multiple-choice-2"'},{value:'"survey-single-choice"'},{value:'"section"'},{value:'"rectangle"'},{value:'"line"'},{value:'"logic"'},{value:'"save"'},{value:'"projects"'},{value:'"messages"'},{value:'"users"'},{value:'"proposals"'},{value:'"messages-inbox"'},{value:'"dashboard"'},{value:'"help"'},{value:'"cog"'},{value:'"organigram"'},{value:'"community"'},{value:'"academy"'},{value:'"book"'},{value:'"reports"'},{value:'"unlock"'},{value:'"notification-outline"'},{value:'"vote-ballot"'},{value:'"print"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"top"'},{value:'"bottom"'},{value:'"left"'},{value:'"right"'},{value:'"auto"'},{value:'"auto-start"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"right-start"'},{value:'"right-end"'},{value:'"left-start"'},{value:'"left-end"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"light"'}]}},iconSize:{defaultValue:null,description:"",name:"iconSize",required:!1,type:{name:"string | undefined"}},iconColor:{defaultValue:null,description:"",name:"iconColor",required:!1,type:{name:"string | undefined"}},iconHoverColor:{defaultValue:null,description:"",name:"iconHoverColor",required:!1,type:{name:"string | undefined"}},maxTooltipWidth:{defaultValue:null,description:"",name:"maxTooltipWidth",required:!1,type:{name:"number | undefined"}},iconAriaTitle:{defaultValue:null,description:"",name:"iconAriaTitle",required:!1,type:{name:"string | undefined"}},transform:{defaultValue:null,description:"",name:"transform",required:!1,type:{name:"string | undefined"}},position:{defaultValue:null,description:"",name:"position",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"static"'},{value:'"relative"'},{value:'"fixed"'},{value:'"absolute"'},{value:'"sticky"'}]}},top:{defaultValue:null,description:"",name:"top",required:!1,type:{name:"string | undefined"}},bottom:{defaultValue:null,description:"",name:"bottom",required:!1,type:{name:"string | undefined"}},left:{defaultValue:null,description:"",name:"left",required:!1,type:{name:"string | undefined"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"string | undefined"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string | undefined"}},m:{defaultValue:null,description:"",name:"m",required:!1,type:{name:"string | undefined"}},marginLeft:{defaultValue:null,description:"",name:"marginLeft",required:!1,type:{name:"string | undefined"}},ml:{defaultValue:null,description:"",name:"ml",required:!1,type:{name:"string | undefined"}},marginRight:{defaultValue:null,description:"",name:"marginRight",required:!1,type:{name:"string | undefined"}},mr:{defaultValue:null,description:"",name:"mr",required:!1,type:{name:"string | undefined"}},marginTop:{defaultValue:null,description:"",name:"marginTop",required:!1,type:{name:"string | undefined"}},mt:{defaultValue:null,description:"",name:"mt",required:!1,type:{name:"string | undefined"}},marginBottom:{defaultValue:null,description:"",name:"marginBottom",required:!1,type:{name:"string | undefined"}},mb:{defaultValue:null,description:"",name:"mb",required:!1,type:{name:"string | undefined"}},marginX:{defaultValue:null,description:"",name:"marginX",required:!1,type:{name:"string | undefined"}},mx:{defaultValue:null,description:"",name:"mx",required:!1,type:{name:"string | undefined"}},marginY:{defaultValue:null,description:"",name:"marginY",required:!1,type:{name:"string | undefined"}},my:{defaultValue:null,description:"",name:"my",required:!1,type:{name:"string | undefined"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string | undefined"}},p:{defaultValue:null,description:"",name:"p",required:!1,type:{name:"string | undefined"}},paddingLeft:{defaultValue:null,description:"",name:"paddingLeft",required:!1,type:{name:"string | undefined"}},pl:{defaultValue:null,description:"",name:"pl",required:!1,type:{name:"string | undefined"}},paddingRight:{defaultValue:null,description:"",name:"paddingRight",required:!1,type:{name:"string | undefined"}},pr:{defaultValue:null,description:"",name:"pr",required:!1,type:{name:"string | undefined"}},paddingTop:{defaultValue:null,description:"",name:"paddingTop",required:!1,type:{name:"string | undefined"}},pt:{defaultValue:null,description:"",name:"pt",required:!1,type:{name:"string | undefined"}},paddingBottom:{defaultValue:null,description:"",name:"paddingBottom",required:!1,type:{name:"string | undefined"}},pb:{defaultValue:null,description:"",name:"pb",required:!1,type:{name:"string | undefined"}},paddingX:{defaultValue:null,description:"",name:"paddingX",required:!1,type:{name:"string | undefined"}},px:{defaultValue:null,description:"",name:"px",required:!1,type:{name:"string | undefined"}},paddingY:{defaultValue:null,description:"",name:"paddingY",required:!1,type:{name:"string | undefined"}},py:{defaultValue:null,description:"",name:"py",required:!1,type:{name:"string | undefined"}},visibility:{defaultValue:null,description:"",name:"visibility",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"hidden"'},{value:'"initial"'},{value:'"inherit"'},{value:'"visible"'}]}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"enum",value:[{value:"undefined"},{value:'"inherit"'},{value:'"block"'},{value:'"inline-block"'},{value:'"inline"'},{value:'"flex"'},{value:'"inline-flex"'},{value:'"none"'}]}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!1,type:{name:"string | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/IconTooltip/index.tsx#IconTooltip"]={docgenInfo:IconTooltip.__docgenInfo,name:"IconTooltip",path:"src/components/IconTooltip/index.tsx#IconTooltip"})}catch(__react_docgen_typescript_loader_error){}},"./src/utils/testUtils/testEnv.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>testEnv});__webpack_require__("./node_modules/process/browser.js");function testEnv(input){0}}}]); +//# sourceMappingURL=components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js.map \ No newline at end of file diff --git a/docs/components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js.map b/docs/components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js.map similarity index 99% rename from docs/components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js.map rename to docs/components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js.map index 401a9929a228..496978be6ad6 100644 --- a/docs/components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js.map +++ b/docs/components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"components-Table-Table-stories-mdx.7e4110a4.iframe.bundle.js","mappings":";;AAgBA;AACA;;;;AAIA;;;AAGA;;AAaA;AAkBA;AC1CA;AAQA;ACFA;AAWA;;AClBA;;AAIA;;;;ACKA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Table/Table.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Table/Tr.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Table/Th.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Table/Tfoot.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx"],"sourcesContent":["import React from 'react';\n\n// components\nimport Box, { BoxProps } from '../Box';\n\n// styling\nimport styled from 'styled-components';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\ninterface InnerBorders {\n headerCells?: boolean;\n bodyRows?: boolean;\n}\n\nconst StyledBox = styled(Box)<{ innerBorders?: InnerBorders }>`\n text-align: left;\n font-size: ${fontSizes.s}px;\n color: ${colors.primary};\n border-collapse: separate;\n\n thead > tr > th {\n border-bottom: 1px solid ${colors.grey200};\n }\n\n ${({ innerBorders }) =>\n !innerBorders?.headerCells\n ? ''\n : `\n thead > tr > th {\n border-right: 1px solid ${colors.grey200};\n }\n\n thead > tr > th:last-child {\n border-right: none;\n }\n `}\n\n ${({ innerBorders }) =>\n !innerBorders?.bodyRows\n ? ''\n : `\n tbody > tr > td {\n border-bottom: 1px solid ${colors.grey200};\n }\n\n tbody > tr:last-child > td {\n border-bottom: none;\n }\n `}\n`;\n\nexport interface Props extends BoxProps {\n innerBorders?: InnerBorders;\n}\n\nconst Table = ({ children, innerBorders, ...otherProps }: Props) => (\n \n {children}\n \n);\n\nexport default Table;\n","import React from 'react';\n\n// styling\nimport styled from 'styled-components';\n\nexport interface Props {\n children: React.ReactNode;\n className?: string;\n background?: string;\n innerRef?: React.RefObject;\n}\n\nconst StyledTr = styled.tr<{ background?: string }>`\n ${({ background }) =>\n !background\n ? ''\n : `\n background: ${background};\n `}\n`;\n\nconst Tr = ({ children, className, background, innerRef }: Props) => (\n \n {children}\n \n);\n\nexport default Tr;\n","import React from 'react';\n\n// components\nimport Box, { BoxProps } from '../Box';\nimport Icon from '../Icon';\nimport IconTooltip from '../IconTooltip';\n\n// styling\nimport styled from 'styled-components';\nimport { colors } from '../../utils/styleUtils';\n\nexport interface Props extends BoxProps {\n colSpan?: number;\n clickable?: boolean;\n sortDirection?: 'ascending' | 'descending';\n infoTooltip?: React.ReactChild;\n}\n\nconst StyledBox = styled(Box)<{ clickable?: boolean }>`\n ${({ clickable }) =>\n !clickable\n ? ''\n : `\n &:hover {\n background: ${colors.grey200};\n }\n cursor: pointer;\n `}\n`;\n\nconst Th = ({\n children,\n colSpan,\n sortDirection,\n infoTooltip,\n ...otherProps\n}: Props) => (\n \n {children}\n\n {sortDirection && (\n \n )}\n\n {infoTooltip && (\n \n )}\n \n);\n\nexport default Th;\n","import React from 'react';\n\n// styling\nimport styled from 'styled-components';\nimport { colors } from '../../utils/styleUtils';\n\nexport interface Props {\n children: React.ReactNode;\n}\n\nconst StyledTFoot = styled.tfoot`\n tr:first-child > td {\n border-top: 1px solid ${colors.grey200};\n }\n`;\n\nconst Tfoot = ({ children }: Props) => {children};\n\nexport default Tfoot;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"components-Table-Table-stories-mdx.8cfd4e0c.iframe.bundle.js","mappings":";;AAgBA;AACA;;;;AAIA;;;AAGA;;AAaA;AAkBA;AC1CA;AAQA;ACFA;AAWA;;AClBA;;AAIA;;;;ACKA;;;;;;;;;AAUA;;;;AAUA;AAMA;AACA;AACA;;AAEA;;;AAGA;;AAyBA","sources":["webpack://@citizenlab/cl2-component-library/./src/components/Table/Table.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Table/Tr.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Table/Th.tsx","webpack://@citizenlab/cl2-component-library/./src/components/Table/Tfoot.tsx","webpack://@citizenlab/cl2-component-library/./src/components/IconTooltip/index.tsx"],"sourcesContent":["import React from 'react';\n\n// components\nimport Box, { BoxProps } from '../Box';\n\n// styling\nimport styled from 'styled-components';\nimport { colors, fontSizes } from '../../utils/styleUtils';\n\ninterface InnerBorders {\n headerCells?: boolean;\n bodyRows?: boolean;\n}\n\nconst StyledBox = styled(Box)<{ innerBorders?: InnerBorders }>`\n text-align: left;\n font-size: ${fontSizes.s}px;\n color: ${colors.primary};\n border-collapse: separate;\n\n thead > tr > th {\n border-bottom: 1px solid ${colors.grey200};\n }\n\n ${({ innerBorders }) =>\n !innerBorders?.headerCells\n ? ''\n : `\n thead > tr > th {\n border-right: 1px solid ${colors.grey200};\n }\n\n thead > tr > th:last-child {\n border-right: none;\n }\n `}\n\n ${({ innerBorders }) =>\n !innerBorders?.bodyRows\n ? ''\n : `\n tbody > tr > td {\n border-bottom: 1px solid ${colors.grey200};\n }\n\n tbody > tr:last-child > td {\n border-bottom: none;\n }\n `}\n`;\n\nexport interface Props extends BoxProps {\n innerBorders?: InnerBorders;\n}\n\nconst Table = ({ children, innerBorders, ...otherProps }: Props) => (\n \n {children}\n \n);\n\nexport default Table;\n","import React from 'react';\n\n// styling\nimport styled from 'styled-components';\n\nexport interface Props {\n children: React.ReactNode;\n className?: string;\n background?: string;\n innerRef?: React.RefObject;\n}\n\nconst StyledTr = styled.tr<{ background?: string }>`\n ${({ background }) =>\n !background\n ? ''\n : `\n background: ${background};\n `}\n`;\n\nconst Tr = ({ children, className, background, innerRef }: Props) => (\n \n {children}\n \n);\n\nexport default Tr;\n","import React from 'react';\n\n// components\nimport Box, { BoxProps } from '../Box';\nimport Icon from '../Icon';\nimport IconTooltip from '../IconTooltip';\n\n// styling\nimport styled from 'styled-components';\nimport { colors } from '../../utils/styleUtils';\n\nexport interface Props extends BoxProps {\n colSpan?: number;\n clickable?: boolean;\n sortDirection?: 'ascending' | 'descending';\n infoTooltip?: React.ReactChild;\n}\n\nconst StyledBox = styled(Box)<{ clickable?: boolean }>`\n ${({ clickable }) =>\n !clickable\n ? ''\n : `\n &:hover {\n background: ${colors.grey200};\n }\n cursor: pointer;\n `}\n`;\n\nconst Th = ({\n children,\n colSpan,\n sortDirection,\n infoTooltip,\n ...otherProps\n}: Props) => (\n \n {children}\n\n {sortDirection && (\n \n )}\n\n {infoTooltip && (\n \n )}\n \n);\n\nexport default Th;\n","import React from 'react';\n\n// styling\nimport styled from 'styled-components';\nimport { colors } from '../../utils/styleUtils';\n\nexport interface Props {\n children: React.ReactNode;\n}\n\nconst StyledTFoot = styled.tfoot`\n tr:first-child > td {\n border-top: 1px solid ${colors.grey200};\n }\n`;\n\nconst Tfoot = ({ children }: Props) => {children};\n\nexport default Tfoot;\n","import React, { memo, ReactChild, FC } from 'react';\nimport Tippy from '@tippyjs/react';\nimport styled from 'styled-components';\nimport { darken } from 'polished';\nimport Icon, { IconNames } from '../Icon';\nimport { colors } from '../../utils/styleUtils';\nimport testEnv from '../../utils/testUtils/testEnv';\nimport Box, {\n BoxPositionProps,\n BoxMarginProps,\n BoxPaddingProps,\n BoxVisibilityProps,\n BoxDisplayProps,\n BoxZIndexProps,\n} from '../Box';\nimport { Placement } from 'tippy.js';\n\nexport const ContentWrapper = styled.div<{ tippytheme: 'light' | undefined }>`\n padding: 5px;\n\n a {\n color: ${(props) =>\n props.tippytheme === 'light' ? colors.primary : colors.white};\n text-decoration: underline;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-all;\n word-break: break-word;\n hyphens: auto;\n\n &:hover {\n color: ${(props) =>\n darken(\n 0.15,\n props.tippytheme === 'light' ? colors.primary : colors.white\n )};\n text-decoration: underline;\n }\n }\n`;\n\nconst TooltipIcon = styled(Icon)<{\n iconColor: string | undefined;\n iconHoverColor: string | undefined;\n iconSize: string | undefined;\n transform: string | undefined;\n}>`\n width: ${({ iconSize }) => iconSize};\n height: ${({ iconSize }) => iconSize};\n fill: ${({ iconColor }) => iconColor || colors.textSecondary};\n cursor: pointer;\n ${({ transform }) => (transform ? `transform: ${transform};` : '')}\n\n &:hover {\n fill: ${({ iconColor, iconHoverColor }) =>\n iconHoverColor ||\n (iconColor ? darken(0.2, iconColor) : darken(0.2, colors.textSecondary))};\n }\n`;\n\nexport type Props = {\n className?: string;\n content: ReactChild;\n icon?: IconNames;\n placement?: Placement;\n theme?: 'light';\n iconSize?: string;\n iconColor?: string;\n iconHoverColor?: string;\n maxTooltipWidth?: number;\n iconAriaTitle?: string;\n transform?: string;\n} & BoxPositionProps &\n BoxMarginProps &\n BoxPaddingProps &\n BoxVisibilityProps &\n BoxDisplayProps &\n BoxZIndexProps;\n\nconst IconTooltip: FC = memo(\n ({\n content,\n icon,\n placement,\n theme,\n iconSize = '20px',\n iconColor,\n iconHoverColor,\n maxTooltipWidth,\n iconAriaTitle,\n className,\n transform,\n ...rest\n }) => {\n return (\n \n {content}\n \n }\n >\n \n \n \n \n );\n }\n);\n\nexport default IconTooltip;\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/iframe.html b/docs/iframe.html index 7fc69a5ebe05..d68a9ad3bb0e 100644 --- a/docs/iframe.html +++ b/docs/iframe.html @@ -348,7 +348,7 @@ window['DOCS_OPTIONS'] = {"defaultName":"Docs","autodocs":true};