fic-designsystem-components 1.0.0

package/README.md

@@ -0,0 +1,73 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+
+      // Remove tseslint.configs.recommended and replace with this
+      tseslint.configs.recommendedTypeChecked,
+      // Alternatively, use this for stricter rules
+      tseslint.configs.strictTypeChecked,
+      // Optionally, add this for stylistic rules
+      tseslint.configs.stylisticTypeChecked,
+
+      // Other configs...
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+      // Enable lint rules for React
+      reactX.configs['recommended-typescript'],
+      // Enable lint rules for React DOM
+      reactDom.configs.recommended,
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```

package/dist/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="48" height="46" fill="none" viewBox="0 0 48 46"><path fill="#863bff" d="M25.946 44.938c-.664.845-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.287c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.497 0-3.578-1.842-3.578H1.237c-.92 0-1.456-1.04-.92-1.788L10.013.474c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.579 1.842 3.579h11.377c.943 0 1.473 1.088.89 1.83L25.947 44.94z" style="fill:#863bff;fill:color(display-p3 .5252 .23 1);fill-opacity:1"/><mask id="a" width="48" height="46" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="#000" d="M25.842 44.938c-.664.844-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.183c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.498 0-3.579-1.842-3.579H1.133c-.92 0-1.456-1.04-.92-1.787L9.91.473c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.578 1.842 3.578h11.377c.943 0 1.473 1.088.89 1.832L25.843 44.94z" style="fill:#000;fill-opacity:1"/></mask><g mask="url(#a)"><g filter="url(#b)"><ellipse cx="5.508" cy="14.704" fill="#ede6ff" rx="5.508" ry="14.704" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -4.47 31.516)"/></g><g filter="url(#c)"><ellipse cx="10.399" cy="29.851" fill="#ede6ff" rx="10.399" ry="29.851" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -39.328 7.883)"/></g><g filter="url(#d)"><ellipse cx="5.508" cy="30.487" fill="#7e14ff" rx="5.508" ry="30.487" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -25.913 -14.639)scale(1 -1)"/></g><g filter="url(#e)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -32.644 -3.334)scale(1 -1)"/></g><g filter="url(#f)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -34.34 30.47)"/></g><g filter="url(#g)"><ellipse cx="14.072" cy="22.078" fill="#ede6ff" rx="14.072" ry="22.078" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="rotate(93.35 24.506 48.493)scale(-1 1)"/></g><g filter="url(#h)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#i)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#j)"><ellipse cx=".387" cy="8.972" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(39.51 .387 8.972)"/></g><g filter="url(#k)"><ellipse cx="47.523" cy="-6.092" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 47.523 -6.092)"/></g><g filter="url(#l)"><ellipse cx="41.412" cy="6.333" fill="#47bfff" rx="5.971" ry="9.665" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 41.412 6.333)"/></g><g filter="url(#m)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#n)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#o)"><ellipse cx="35.651" cy="29.907" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 35.651 29.907)"/></g><g filter="url(#p)"><ellipse cx="38.418" cy="32.4" fill="#47bfff" rx="5.971" ry="15.297" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 38.418 32.4)"/></g></g><defs><filter id="b" width="60.045" height="41.654" x="-19.77" y="16.149" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="c" width="90.34" height="51.437" x="-54.613" y="-7.533" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="d" width="79.355" height="29.4" x="-49.64" y="2.03" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="e" width="79.579" height="29.4" x="-45.045" y="20.029" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="f" width="79.579" height="29.4" x="-43.513" y="21.178" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="g" width="74.749" height="58.852" x="15.756" y="-17.901" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="h" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="i" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="j" width="56.045" height="63.649" x="-27.636" y="-22.853" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="k" width="54.814" height="64.646" x="20.116" y="-38.415" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="l" width="33.541" height="35.313" x="24.641" y="-11.323" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="m" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="n" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="o" width="54.814" height="64.646" x="8.244" y="-2.416" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="p" width="39.409" height="43.623" x="18.713" y="10.588" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter></defs></svg>

package/dist/fic-designsystem-components.css

@@ -0,0 +1,3 @@
+/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+:root{--font-size:16px;--FontFamily-Family:"DM Sans", sans-serif;--FontFamily-Family-2:"DM Sans", sans-serif;--FontSize-Size80:80px;--FontSize-Size72:72px;--FontSize-Size64:64px;--FontSize-Size58:58px;--FontSize-Size48:48px;--FontSize-Size40:40px;--FontSize-Size-30:30px;--FontSize-Size-28:28px;--FontSize-Size-26:26px;--FontSize-Size-24:24px;--FontSize-Size-22:22px;--FontSize-Size-20:20px;--FontSize-Size-18:18px;--FontSize-Size-16:16px;--FontSize-Size-14:14px;--FontSize-Size-12:12px;--FontSize-Size-10:10px;--button-size-14:14px;--FontType-Thin:100;--FontType-Regular:400;--FontType-Medium:500;--FontType-SemiBold:600;--FontType-Bold:700;--FontType-ExtraBold:800;--FontType-Black:900;--TypographyTypes-Display-Display1-Family:var(--FontFamily-Family-2);--TypographyTypes-Display-Display1-Size:var(--FontSize-Size80);--TypographyTypes-Display-Display1-Type:var(--FontType-Thin);--TypographyTypes-Display-Display2-Family:var(--FontFamily-Family-2);--TypographyTypes-Display-Display2-Size:var(--FontSize-Size72);--TypographyTypes-Display-Display2-Type:var(--FontType-Thin);--TypographyTypes-Display-Display3-Family:var(--FontFamily-Family-2);--TypographyTypes-Display-Display3-Size:var(--FontSize-Size64);--TypographyTypes-Display-Display3-Type:var(--FontType-Thin);--TypographyTypes-Display-Display4-Family:var(--FontFamily-Family-2);--TypographyTypes-Display-Display4-Size:var(--FontSize-Size58);--TypographyTypes-Display-Display4-Type:var(--FontType-Thin);--TypographyTypes-Display-Display5-Family:var(--FontFamily-Family-2);--TypographyTypes-Display-Display5-Size:var(--FontSize-Size48);--TypographyTypes-Display-Display5-Type:var(--FontType-Thin);--TypographyTypes-Display-Display6-Family:var(--FontFamily-Family-2);--TypographyTypes-Display-Display6-Size:var(--FontSize-Size40);--TypographyTypes-Display-Display6-Type:var(--FontType-Thin);--TypographyTypes-Heading-Heading1-Family:var(--FontFamily-Family);--TypographyTypes-Fs-fs-xm-10-Family:var(--FontFamily-Family);--TypographyTypes-Body-Family:var(--FontFamily-Family);--TypographyTypes-Body-Size:var(--FontSize-Size-14);--TypographyTypes-Body-Type:var(--FontType-Regular);--TypographyTypes-Fs-fs-xm-10-Size:var(--FontSize-Size-10);--TypographyTypes-Fs-fs-xm-10-Extrabold:var(--FontType-ExtraBold);--TypographyTypes-Fs-fs-xm-10-Medium:var(--FontType-Medium);--TypographyTypes-Fs-fs-xm-10-Regular:var(--FontType-Medium);--TypographyTypes-Fs-fs-sm-12-Family:var(--FontFamily-Family);--TypographyTypes-Fs-fs-sm-12-Size:var(--FontSize-Size-12);--TypographyTypes-Fs-fs-sm-12-fs-sm:var(--FontType-Medium);--TypographyTypes-Fs-fs-sm-12-fs-sm-Regular:var(--FontType-Regular);--TypographyTypes-Heading-Heading1-Size:var(--FontSize-Size-30);--TypographyTypes-Heading-Heading1-Font-Weight-Thin:var(--FontType-Thin);--TypographyTypes-Heading-Heading1-Font-Weight-Regular:var(--FontType-Regular);--TypographyTypes-Heading-Heading1-Font-Weight-Medium:var(--FontType-Medium);--TypographyTypes-Heading-Heading1-Font-Weight-Semibold:var(--FontType-SemiBold);--TypographyTypes-Heading-Heading1-Font-Weight-Extrabold:var(--FontType-ExtraBold);--TypographyTypes-Heading-Heading1-Font-Weight-Black:var(--FontType-Black);--TypographyTypes-Heading-Heading2-Family:var(--FontFamily-Family);--TypographyTypes-Heading-Heading2-Size:var(--FontSize-Size-28);--TypographyTypes-Heading-Heading2-Heading2:var(--FontType-SemiBold);--TypographyTypes-Heading-Heading3-Family:var(--FontFamily-Family);--TypographyTypes-Heading-Heading4-Family:var(--FontFamily-Family);--TypographyTypes-Heading-Heading4-Size:var(--FontSize-Size-24);--TypographyTypes-Heading-Heading4-Heading4:var(--FontType-SemiBold);--TypographyTypes-Heading-Heading3-Size:var(--FontSize-Size-26);--TypographyTypes-Heading-Heading3-Heading3:var(--FontType-SemiBold);--TypographyTypes-Heading-Heading5-Family:var(--FontFamily-Family);--TypographyTypes-Heading-Heading5-Size:var(--FontSize-Size-22);--TypographyTypes-Heading-Heading5-Heading5:var(--FontType-SemiBold);--TypographyTypes-Heading-Heading6-Family:var(--FontFamily-Family);--TypographyTypes-Heading-Heading6-Size:var(--FontSize-Size-20);--TypographyTypes-Heading-Heading6-Heading6:var(--FontType-SemiBold);--TypographyTypes-Heading-SubHeading1-Family:var(--FontFamily-Family);--TypographyTypes-Heading-SubHeading1-Size:var(--FontSize-Size-18);--TypographyTypes-Heading-SubHeading1-Sbh1SemiBold:var(--FontType-SemiBold);--TypographyTypes-Heading-SubHeading1-Sbh1ExtraBold:var(--FontType-ExtraBold);--TypographyTypes-Heading-SubHeading1-Sbh1Regular:var(--FontType-Regular);--TypographyTypes-Heading-SubHeading1-Sbh1Medium:var(--FontType-Medium);--TypographyTypes-Heading-SubHeading2-Family:var(--FontFamily-Family);--TypographyTypes-Heading-SubHeading3-Family:var(--FontFamily-Family);--TypographyTypes-Heading-SubHeading3-Size:var(--FontSize-Size-14);--TypographyTypes-Heading-SubHeading3-Sbh3ExtraBold:var(--FontType-ExtraBold);--TypographyTypes-Heading-SubHeading3-Sbh3Semibold:var(--FontType-SemiBold);--TypographyTypes-Heading-SubHeading3-Sbh3Medium:var(--FontType-Medium);--TypographyTypes-Heading-SubHeading3-Sbh3Regular:var(--FontType-Regular);--TypographyTypes-Heading-SubHeading3-Sbh3Black:var(--FontType-Black);--TypographyTypes-Heading-SubHeading2-Size:var(--FontSize-Size-16);--TypographyTypes-Heading-SubHeading2-Sbh2SemiBold:var(--FontType-SemiBold);--TypographyTypes-Heading-SubHeading2-Sbh2ExtraBold:var(--FontType-ExtraBold);--TypographyTypes-Heading-SubHeading2-Sbh2Medium:var(--FontType-Medium);--TypographyTypes-Heading-SubHeading2-Sbh2Regular:var(--FontType-Regular);--TypographyTypes-ButtonsTypography-Standard_Button-Family:var(--FontFamily-Family);--TypographyTypes-ButtonsTypography-Standard_Button-Size:var(--button-size-14);--TypographyTypes-ButtonsTypography-Standard_Button-Type:var(--FontType-ExtraBold);--txt_textbox:var(--txt-ButtonLabelPrimary);--text-h1:var(--FontSize-Size-30);--text-h2:var(--FontSize-Size-28);--text-h3:var(--FontSize-Size-26);--text-h4:var(--FontSize-Size-24);--text-base:var(--FontSize-Size-14);--text-label:var(--FontSize-Size-12);--text-button-primary:var(--FontSize-Size-16);--text-large-number:var(--FontSize-Size-30);--font-weight-thin:var(--FontType-Thin);--font-weight-normal:var(--FontType-Regular);--font-weight-medium:var(--FontType-Medium);--font-weight-semibold:var(--FontType-SemiBold);--font-weight-bold:var(--FontType-Bold);--font-weight-extrabold:var(--FontType-ExtraBold);--font-weight-black:var(--FontType-Black);--colors-primitive-color-tokens-blue-50:#edf8ff;--colors-primitive-color-tokens-blue-100:#d2edff;--colors-primitive-color-tokens-blue-200:#b4e1ff;--colors-primitive-color-tokens-blue-300:#94d4ff;--colors-primitive-color-tokens-blue-400:#64b9f2;--colors-primitive-color-tokens-blue-500:#35a0e7;--colors-primitive-color-tokens-blue-600:#1a77b4;--colors-primitive-color-tokens-blue-700:#195f8e;--colors-primitive-color-tokens-blue-800:#024572;--colors-primitive-color-tokens-fuscia-50:#feecf6;--colors-primitive-color-tokens-fuscia-100:#ffdaef;--colors-primitive-color-tokens-fuscia-200:#ffaeda;--colors-primitive-color-tokens-fuscia-300:#f387c2;--colors-primitive-color-tokens-fuscia-400:#e65ca7;--colors-primitive-color-tokens-fuscia-500:#d72d8a;--colors-primitive-color-tokens-fuscia-600:#ac246e;--colors-primitive-color-tokens-fuscia-700:#811b53;--colors-primitive-color-tokens-fuscia-800:#561237;--colors-primitive-color-tokens-lime-50:#f0fae2;--colors-primitive-color-tokens-lime-100:#eeffd6;--colors-primitive-color-tokens-lime-200:#daf3b9;--colors-primitive-color-tokens-lime-300:#c5ed91;--colors-primitive-color-tokens-lime-400:#abdd65;--colors-primitive-color-tokens-lime-500:#92d03d;--colors-primitive-color-tokens-lime-600:#5e981d;--colors-primitive-color-tokens-lime-700:#578421;--colors-primitive-color-tokens-lime-800:#325b04;--colors-primitive-color-tokens-neutrals-bkg-50:#f9f9f6;--colors-primitive-color-tokens-neutrals-bkg-100:#f6f6f1;--colors-primitive-color-tokens-neutrals-bkg-200:#efeeea;--colors-primitive-color-tokens-neutrals-bkg-300:#e5e4dd;--colors-primitive-color-tokens-neutrals-bkg-400:#c3c1b5;--colors-primitive-color-tokens-neutrals-bkg-500:#959490;--colors-primitive-color-tokens-neutrals-bkg-600:#71706c;--colors-primitive-color-tokens-neutrals-bkg-700:#4b4b4a;--colors-primitive-color-tokens-neutrals-bkg-800:#303030;--colors-primitive-color-tokens-neutrals-inactive-50:#f4f8fb;--colors-primitive-color-tokens-neutrals-inactive-100:#eef2f6;--colors-primitive-color-tokens-neutrals-inactive-200:#d2dce6;--colors-primitive-color-tokens-neutrals-inactive-300:#b4c6d6;--colors-primitive-color-tokens-neutrals-inactive-400:#8ba1b9;--colors-primitive-color-tokens-neutrals-inactive-500:#6a809a;--colors-primitive-color-tokens-neutrals-inactive-600:#4b5867;--colors-primitive-color-tokens-neutrals-inactive-700:#2c3a4a;--colors-primitive-color-tokens-neutrals-inactive-800:#101725;--colors-primitive-color-tokens-neutrals-static-black:#000;--colors-primitive-color-tokens-neutrals-static-white:#fff;--colors-primitive-color-tokens-orange-50:#fff3e6;--colors-primitive-color-tokens-orange-100:#ffe9d3;--colors-primitive-color-tokens-orange-200:#ffd3b1;--colors-primitive-color-tokens-orange-300:#ffbe8d;--colors-primitive-color-tokens-orange-400:#ffa663;--colors-primitive-color-tokens-orange-500:#f27e25;--colors-primitive-color-tokens-orange-600:#b4530e;--colors-primitive-color-tokens-orange-700:#944b1d;--colors-primitive-color-tokens-orange-800:#6e3000;--colors-primitive-color-tokens-red-50:#ffeae9;--colors-primitive-color-tokens-red-100:#ffd3d2;--colors-primitive-color-tokens-red-200:#ffb0ae;--colors-primitive-color-tokens-red-300:#ff8884;--colors-primitive-color-tokens-red-400:#f1605b;--colors-primitive-color-tokens-red-500:#e73d36;--colors-primitive-color-tokens-red-600:#c9221c;--colors-primitive-color-tokens-red-700:#9a1712;--colors-primitive-color-tokens-red-800:#860501;--colors-primitive-color-tokens-teal-50:#edf8ff;--colors-primitive-color-tokens-teal-100:#d6fffb;--colors-primitive-color-tokens-teal-200:#b1f4ed;--colors-primitive-color-tokens-teal-300:#70e5dd;--colors-primitive-color-tokens-teal-400:#4ecfca;--colors-primitive-color-tokens-teal-500:#27bcb7;--colors-primitive-color-tokens-teal-600:#21a49f;--colors-primitive-color-tokens-teal-700:#118082;--colors-primitive-color-tokens-teal-800:#00575c;--colors-primitive-color-tokens-yellow-50:#fffaea;--colors-primitive-color-tokens-yellow-100:#fff4cd;--colors-primitive-color-tokens-yellow-200:#ffeaac;--colors-primitive-color-tokens-yellow-300:#ffda7f;--colors-primitive-color-tokens-yellow-400:#f7c544;--colors-primitive-color-tokens-yellow-500:#f3b51e;--colors-primitive-color-tokens-yellow-600:#d49a05;--colors-primitive-color-tokens-yellow-700:#976e00;--colors-primitive-color-tokens-yellow-800:#7c5300;--colors-buttons-primary-btn-primary-btn-bkg-default:var(--colors-primitive-color-tokens-teal-700);--colors-buttons-primary-btn-primary-btn-bkg-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-400);--colors-buttons-primary-btn-primary-btn-bkg-hover:var(--colors-primitive-color-tokens-teal-800);--colors-buttons-primary-btn-primary-btn-icon-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-primary-btn-primary-btn-icon-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-primary-btn-primary-btn-icon-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-primary-btn-primary-btn-label-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-primary-btn-primary-btn-label-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-primary-btn-primary-btn-label-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-secondary-btn-secondary-btn-bkg-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-secondary-btn-secondary-btn-bkg-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-400);--colors-buttons-secondary-btn-secondary-btn-bkg-hover:var(--colors-primitive-color-tokens-neutrals-bkg-600);--colors-buttons-secondary-btn-secondary-btn-border-default:var(--colors-primitive-color-tokens-teal-700);--colors-buttons-secondary-btn-secondary-btn-border-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-400);--colors-buttons-secondary-btn-secondary-btn-border-hover:var(--colors-primitive-color-tokens-neutrals-bkg-600);--colors-buttons-secondary-btn-secondary-btn-icon-default:var(--colors-primitive-color-tokens-neutrals-bkg-600);--colors-buttons-secondary-btn-secondary-btn-icon-disabled:var(--colors-primitive-color-tokens-teal-50);--colors-buttons-secondary-btn-secondary-btn-icon-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-secondary-btn-secondary-btn-label-default:var(--colors-primitive-color-tokens-neutrals-bkg-700);--colors-buttons-secondary-btn-secondary-btn-label-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-secondary-btn-secondary-btn-label-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-brand-btn-brand-btn-bkg-default:var(--colors-primitive-color-tokens-fuscia-500);--colors-buttons-brand-btn-brand-btn-bkg-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-400);--colors-buttons-brand-btn-brand-btn-bkg-hover:var(--colors-primitive-color-tokens-fuscia-800);--colors-buttons-brand-btn-brand-btn-icon-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-brand-btn-brand-btn-icon-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-brand-btn-brand-btn-icon-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-brand-btn-brand-btn-label-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-brand-btn-brand-btn-label-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-brand-btn-brand-btn-label-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-success-btn-brand-btn-bkg-default:var(--colors-primitive-color-tokens-lime-600);--colors-buttons-success-btn-brand-btn-bkg-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-400);--colors-buttons-success-btn-brand-btn-bkg-hover:var(--colors-primitive-color-tokens-lime-800);--colors-buttons-success-btn-brand-btn-icon-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-success-btn-brand-btn-icon-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-success-btn-brand-btn-icon-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-success-btn-brand-btn-label-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-success-btn-brand-btn-label-disabled:var(--colors-primitive-color-tokens-neutrals-inactive-100);--colors-buttons-success-btn-brand-btn-label-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-buttons-pill-badge-bkg-blue200:var(--colors-primitive-color-tokens-blue-100);--colors-buttons-pill-badge-bkg-fusia200:var(--colors-primitive-color-tokens-fuscia-100);--colors-buttons-pill-badge-bkg-lime200:var(--colors-primitive-color-tokens-lime-200);--colors-buttons-pill-badge-txt-pill-badge-label:var(--colors-primitive-color-tokens-neutrals-bkg-700);--Canvas:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-100);--Fusia:var(--Colors-PrimitiveColorTokens-Fuscia-500);--Plum:var(--Colors-PrimitiveColorTokens-Fuscia-800);--Colors-PrimitiveColorTokens-Neutrals-Bkg-50:#f9f9f6;--Colors-PrimitiveColorTokens-Neutrals-Bkg-100:#f6f6f1;--Colors-PrimitiveColorTokens-Neutrals-Bkg-200:#efeeea;--Colors-PrimitiveColorTokens-Neutrals-Bkg-300:#e5e4dd;--Colors-PrimitiveColorTokens-Neutrals-Bkg-400:#c3c1b5;--Colors-PrimitiveColorTokens-Neutrals-Bkg-500:#959490;--Colors-PrimitiveColorTokens-Neutrals-Bkg-600:#71706c;--Colors-PrimitiveColorTokens-Neutrals-Bkg-700:#4b4b4a;--Colors-PrimitiveColorTokens-Neutrals-Bkg-800:#303030;--Colors-PrimitiveColorTokens-Neutrals-Inactive-50:#f4f8fb;--Colors-PrimitiveColorTokens-Neutrals-Inactive-100:#eef2f6;--Colors-PrimitiveColorTokens-Neutrals-Inactive-200:#d2dce6;--Colors-PrimitiveColorTokens-Neutrals-Inactive-300:#b4c6d6;--Colors-PrimitiveColorTokens-Neutrals-Inactive-400:#8ba1b9;--Colors-PrimitiveColorTokens-Neutrals-Inactive-500:#6a809a;--Colors-PrimitiveColorTokens-Neutrals-Inactive-600:#4b5867;--Colors-PrimitiveColorTokens-Neutrals-Inactive-700:#2c3a4a;--Colors-PrimitiveColorTokens-Neutrals-Inactive-800:#101725;--Colors-PrimitiveColorTokens-Neutrals-StaticWhite:#fff;--Colors-PrimitiveColorTokens-Neutrals-StaticBlack:#000;--Colors-PrimitiveColorTokens-Purple-50:#fcf4fd;--Colors-PrimitiveColorTokens-Purple-100:#f8e6f9;--Colors-PrimitiveColorTokens-Purple-200:#f1c4f3;--Colors-PrimitiveColorTokens-Purple-300:#d795d9;--Colors-PrimitiveColorTokens-Purple-400:#b768b9;--Colors-PrimitiveColorTokens-Purple-500:#922d94;--Colors-PrimitiveColorTokens-Purple-600:#730f76;--Colors-PrimitiveColorTokens-Purple-700:#5c135d;--Colors-PrimitiveColorTokens-Purple-800:#3b053c;--Colors-PrimitiveColorTokens-Fuscia-50:#feecf6;--Colors-PrimitiveColorTokens-Fuscia-100:#ffdaef;--Colors-PrimitiveColorTokens-Fuscia-200:#ffaeda;--Colors-PrimitiveColorTokens-Fuscia-300:#f387c2;--Colors-PrimitiveColorTokens-Fuscia-400:#e65ca7;--Colors-PrimitiveColorTokens-Fuscia-500:#d72d8a;--Colors-PrimitiveColorTokens-Fuscia-600:#ac246e;--Colors-PrimitiveColorTokens-Fuscia-700:#811b53;--Colors-PrimitiveColorTokens-Fuscia-800:#561237;--Colors-PrimitiveColorTokens-Red-50:#ffeae9;--Colors-PrimitiveColorTokens-Red-100:#ffd3d2;--Colors-PrimitiveColorTokens-Red-200:#ffb0ae;--Colors-PrimitiveColorTokens-Red-300:#ff8884;--Colors-PrimitiveColorTokens-Red-400:#f1605b;--Colors-PrimitiveColorTokens-Red-500:#e73d36;--Colors-PrimitiveColorTokens-Red-600:#c9221c;--Colors-PrimitiveColorTokens-Red-700:#9a1712;--Colors-PrimitiveColorTokens-Red-800:#860501;--Colors-PrimitiveColorTokens-Yellow-50:#fffaea;--Colors-PrimitiveColorTokens-Yellow-100:#fff4cd;--Colors-PrimitiveColorTokens-Yellow-200:#ffeaac;--Colors-PrimitiveColorTokens-Yellow-300:#ffda7f;--Colors-PrimitiveColorTokens-Yellow-400:#f7c544;--Colors-PrimitiveColorTokens-Yellow-500:#f3b51e;--Colors-PrimitiveColorTokens-Yellow-600:#d49a05;--Colors-PrimitiveColorTokens-Yellow-700:#976e00;--Colors-PrimitiveColorTokens-Yellow-800:#7c5300;--Colors-PrimitiveColorTokens-Teal-50:#edf8ff;--Colors-PrimitiveColorTokens-Teal-100:#d6fffb;--Colors-PrimitiveColorTokens-Teal-200:#b1f4ed;--Colors-PrimitiveColorTokens-Teal-300:#70e5dd;--Colors-PrimitiveColorTokens-Teal-400:#4ecfca;--Colors-PrimitiveColorTokens-Teal-500:#27bcb7;--Colors-PrimitiveColorTokens-Teal-600:#21a49f;--Colors-PrimitiveColorTokens-Teal-700:#118082;--Colors-PrimitiveColorTokens-Teal-800:#00575c;--Colors-PrimitiveColorTokens-Blue-50:#edf8ff;--Colors-PrimitiveColorTokens-Blue-100:#d2edff;--Colors-PrimitiveColorTokens-Blue-200:#b4e1ff;--Colors-PrimitiveColorTokens-Blue-300:#94d4ff;--Colors-PrimitiveColorTokens-Blue-400:#64b9f2;--Colors-PrimitiveColorTokens-Blue-500:#35a0e7;--Colors-PrimitiveColorTokens-Blue-600:#1a77b4;--Colors-PrimitiveColorTokens-Blue-700:#195f8e;--Colors-PrimitiveColorTokens-Blue-800:#024572;--Colors-PrimitiveColorTokens-Orange-50:#fff3e6;--Colors-PrimitiveColorTokens-Orange-100:#ffe9d3;--Colors-PrimitiveColorTokens-Orange-200:#ffd3b1;--Colors-PrimitiveColorTokens-Orange-300:#ffbe8d;--Colors-PrimitiveColorTokens-Orange-400:#ffa663;--Colors-PrimitiveColorTokens-Orange-500:#f27e25;--Colors-PrimitiveColorTokens-Orange-600:#b4530e;--Colors-PrimitiveColorTokens-Orange-700:#944b1d;--Colors-PrimitiveColorTokens-Orange-800:#6e3000;--Colors-PrimitiveColorTokens-Lime-50:#f0fae2;--Colors-PrimitiveColorTokens-Lime-100:#eeffd6;--Colors-PrimitiveColorTokens-Lime-200:#daf3b9;--Colors-PrimitiveColorTokens-Lime-300:#c5ed91;--Colors-PrimitiveColorTokens-Lime-400:#abdd65;--Colors-PrimitiveColorTokens-Lime-500:#92d03d;--Colors-PrimitiveColorTokens-Lime-600:#5e981d;--Colors-PrimitiveColorTokens-Lime-700:#578421;--Colors-PrimitiveColorTokens-Lime-800:#325b04;--Colors-Buttons-PrimaryBtn-PrimaryBtn_Label_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Label_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Label_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Icon_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Icon_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Icon_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Bkg_Default:var(--Colors-PrimitiveColorTokens-Teal-700);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Bkg_Hover:var(--Colors-PrimitiveColorTokens-Teal-800);--Colors-Buttons-PrimaryBtn-PrimaryBtn_Bkg_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-400);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Label_Default:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-700);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Label_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Label_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Bkg_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Bkg_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-600);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Bkg_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-400);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Border_Default:var(--Colors-PrimitiveColorTokens-Teal-700);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Border_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-600);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Border_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-400);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Icon_Default:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-600);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Icon_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SecondaryBtn-SecondaryBtn_Icon_Disabled:var(--Colors-PrimitiveColorTokens-Teal-50);--Colors-Buttons-BrandBtn-BrandBtn_Label_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-BrandBtn-BrandBtn_Label_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-BrandBtn-BrandBtn_Label_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-BrandBtn-BrandBtn_Icon_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-BrandBtn-BrandBtn_Icon_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-BrandBtn-BrandBtn_Icon_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-BrandBtn-BrandBtn_Bkg_Default:var(--Colors-PrimitiveColorTokens-Fuscia-500);--Colors-Buttons-BrandBtn-BrandBtn_Bkg_Hover:var(--Colors-PrimitiveColorTokens-Fuscia-800);--Colors-Buttons-BrandBtn-BrandBtn_Bkg_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-400);--Colors-Buttons-SuccessBtn-BrandBtn_Label_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SuccessBtn-BrandBtn_Label_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SuccessBtn-BrandBtn_Label_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-SuccessBtn-BrandBtn_Icon_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SuccessBtn-BrandBtn_Icon_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Buttons-SuccessBtn-BrandBtn_Icon_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-100);--Colors-Buttons-SuccessBtn-BrandBtn_Bkg_Default:var(--Colors-PrimitiveColorTokens-Lime-600);--Colors-Buttons-SuccessBtn-BrandBtn_Bkg_Hover:var(--Colors-PrimitiveColorTokens-Lime-800);--Colors-Buttons-SuccessBtn-BrandBtn_Bkg_Disabled:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-400);--Colors-Buttons-Pill-Badge-Txt_Pill-Badge_Label:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-700);--Colors-Buttons-Pill-Badge-Bkg-Blue200:var(--Colors-PrimitiveColorTokens-Blue-100);--Colors-Buttons-Pill-Badge-Bkg-Fusia100:var(--Colors-PrimitiveColorTokens-Fuscia-100);--Colors-Buttons-Pill-Badge-Bkg-Lime200:var(--Colors-PrimitiveColorTokens-Lime-200);--Colors-Navigation-Other-Divider:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-200);--Colors-Navigation-Other-Txt_Sectionheader:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-500);--Colors-Navigation-Other-Txt_MenuLabels:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-700);--Colors-Navigation-Other-Txt_SubMenuLabels:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-600);--Colors-Navigation-Other-Bkg_ActiveCount:var(--Colors-PrimitiveColorTokens-Red-500);--Colors-Navigation-Other-Bkg_Panel:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Navigation-Other-Bkg_Menu_Hover:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-200);--Colors-Navigation-Other-Bkg_Menu_Selection:var(--Colors-PrimitiveColorTokens-Fuscia-50);--Colors-Functional-Border-Border_Default:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-400);--Colors-Functional-Border-Border_Focus:var(--Colors-PrimitiveColorTokens-Teal-600);--Colors-Functional-Bkg-Bkg_Default:var(--Colors-PrimitiveColorTokens-Neutrals-StaticWhite);--Colors-Functional-Txt-Txt_Default:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-800);--Colors-PrimitiveColorTokens-Brand-EVAA-EVAA-Canvas:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-100);--Colors-PrimitiveColorTokens-Brand-EVAA-EVAA-Fusia:var(--Colors-PrimitiveColorTokens-Fuscia-500);--Colors-PrimitiveColorTokens-Brand-EVAA-EVAA-Plum:var(--Colors-PrimitiveColorTokens-Fuscia-800);--Colors-PrimitiveColorTokens-Brand-MaximEyes-EVAA-Canvas:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-100);--Colors-PrimitiveColorTokens-Brand-MaximEyes-EVAA-Lime:#aee930;--Colors-PrimitiveColorTokens-Brand-MaximEyes-EVAA-InnerForest:#002515;--Colors-PrimitiveColorTokens-Brand-MaximEyes-EVAA-Springtime:#008a1e;--Colors-PrimitiveColorTokens-Brand-MaximEyes-EVAA-Goldenrod:#db9c42;--txt-ButtonLabelPrimary:DOWNLOAD;--txt-PrimaryButtonLabel14:DOWNLOAD;--ButtonCurves:25px;--PrimaryButtonDisabled:#a1a5ae;--ActiveStatusBG:#1a77b4;--ActiveStatusBadgeLabel:Active;--InputField-Stroke-Default:#d0cec3;--colors-badge-status-active-bkg:#1a77b4;--colors-badge-status-active-text:#fff;--colors-badge-status-active-icon:#fff;--colors-badge-status-inactive-bkg-light:#959490;--colors-badge-status-inactive-bkg-dark:#e5e4dd;--colors-badge-status-inactive-bkg:var(--colors-badge-status-inactive-bkg-light);--colors-badge-status-inactive-text:#fff;--colors-badge-status-inactive-icon:#fff;--colors-badge-pill-blue-bkg-light:#b4e1ff;--colors-badge-pill-blue-bkg-dark:#35a0e7;--colors-badge-pill-blue-bkg:var(--colors-badge-pill-blue-bkg-light);--colors-badge-pill-fusia-bkg-light:#ffdaef;--colors-badge-pill-fusia-bkg-dark:#811b53;--colors-badge-pill-fusia-bkg:var(--colors-badge-pill-fusia-bkg-light);--colors-badge-pill-lime-bkg-light:#daf3b9;--colors-badge-pill-lime-bkg-dark:#5e981d;--colors-badge-pill-lime-bkg:var(--colors-badge-pill-lime-bkg-light);--colors-badge-pill-text:var(--colors-primitive-color-tokens-neutrals-bkg-700);--colors-admin-nav-logo-brand:var(--colors-primitive-color-tokens-fuscia-500);--colors-admin-nav-dropdown-bkg:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-admin-nav-dropdown-border:var(--border);--colors-admin-nav-dropdown-text:var(--colors-primitive-color-tokens-neutrals-bkg-600);--colors-admin-nav-icon-help:var(--colors-primitive-color-tokens-fuscia-700);--colors-admin-nav-icon-setup:var(--colors-primitive-color-tokens-neutrals-bkg-500);--colors-admin-nav-icon-user:var(--colors-primitive-color-tokens-neutrals-bkg-500);--colors-admin-nav-icon-dropdown-arrow:var(--colors-primitive-color-tokens-neutrals-bkg-600);--colors-admin-nav-alert-warning:var(--colors-primitive-color-tokens-yellow-600);--colors-admin-nav-alert-error:var(--colors-primitive-color-tokens-red-500);--colors-admin-nav-alert-count-text:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-navigation-other-bkg-active-count:var(--colors-primitive-color-tokens-red-500);--colors-navigation-other-divider:var(--colors-primitive-color-tokens-neutrals-inactive-200);--colors-navigation-other-txt-menu-labels:var(--colors-primitive-color-tokens-neutrals-bkg-700);--colors-navigation-other-txt-sectionheader:var(--colors-primitive-color-tokens-neutrals-bkg-500);--colors-navigation-other-txt-sub-menu-labels:var(--colors-primitive-color-tokens-neutrals-bkg-600);--colors-navigation-icons-blue600:var(--colors-primitive-color-tokens-blue-600);--colors-navigation-icons-teal600:var(--colors-primitive-color-tokens-teal-700);--colors-navigation-icons-lime600:var(--colors-primitive-color-tokens-lime-600);--colors-navigation-icons-fusia600:var(--colors-primitive-color-tokens-fuscia-600);--colors-navigation-icons-gray-bkg-700:var(--colors-primitive-color-tokens-neutrals-bkg-700);--colors-navigation-text-primary:#374151;--colors-fusia-50:#fdf2f8;--colors-bkg-200:#f3f4f6;--colors-bkg-300:#e5e7eb;--colors-input-field-border-default:#d1d5db;--colors-input-field-border-hover:var(--colors-primitive-color-tokens-teal-400);--colors-input-field-border-focus:var(--colors-primitive-color-tokens-teal-500);--colors-input-field-border-disabled:#e5e7eb;--colors-input-field-border-readonly:var(--colors-primitive-color-tokens-blue-100);--colors-input-field-bkg-default:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-input-field-bkg-disabled:#f3f4f6;--colors-input-field-bkg-readonly:#edf8ff80;--colors-input-field-bkg-hover:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-input-field-bkg-focus:var(--colors-primitive-color-tokens-neutrals-static-white);--colors-input-field-text-default:#1f2937;--colors-input-field-text-placeholder:#9ca3af;--colors-input-field-text-disabled:#6b7280;--colors-input-field-text-label:#374151;--colors-input-field-text-helper:#9ca3af;--colors-input-field-text-counter:#9ca3af;--colors-input-field-border-error:#fca5a1;--colors-input-field-bkg-error:#fef2f2;--colors-input-field-text-error:#7f1d1d;--colors-input-field-text-helper-error:var(--colors-primitive-color-tokens-red-600);--colors-input-field-icon-error:var(--colors-primitive-color-tokens-red-500);--colors-input-field-prefix-bkg-default:#f9fafb;--colors-input-field-prefix-bkg-error:#fee2e2;--colors-input-field-prefix-border-default:#d1d5db;--colors-input-field-prefix-border-error:#fca5a1;--colors-input-field-prefix-text-default:#4b5563;--colors-input-field-prefix-text-error:var(--colors-primitive-color-tokens-red-500);--colors-input-field-icon-default:#6b7280;--colors-input-field-icon-disabled:#9ca3af;--input-field-height:40px;--input-field-padding-x:12px;--input-field-padding-y:10px;--input-field-prefix-padding-x:16px;--input-field-border-width:1px;--input-field-border-radius:var(--radius-md,8px);--colors-functional-bkg-bkg-active:var(--colors-primitive-color-tokens-teal-600);--colors-functional-bkg-bkg-info500:var(--colors-primitive-color-tokens-blue-500);--colors-functional-bkg-bkg-info100:var(--colors-primitive-color-tokens-blue-100);--colors-functional-bkg-bkg-success600:var(--colors-primitive-color-tokens-lime-600);--colors-functional-bkg-bkg-success100:var(--colors-primitive-color-tokens-lime-100);--colors-functional-bkg-bkg-warning-orange500:var(--colors-primitive-color-tokens-orange-500);--colors-functional-bkg-bkg-warning-orange100:var(--colors-primitive-color-tokens-orange-100);--colors-functional-bkg-bkg-error-red500:var(--colors-primitive-color-tokens-red-500);--colors-functional-bkg-bkg-error-red100:var(--colors-primitive-color-tokens-red-100);--colors-functional-txt-txt-default:var(--colors-primitive-color-tokens-neutrals-bkg-800);--colors-functional-txt-txt-info:var(--colors-primitive-color-tokens-blue-700);--colors-functional-txt-txt-success:var(--colors-primitive-color-tokens-lime-600);--colors-functional-txt-txt-warning-orange600:var(--colors-primitive-color-tokens-orange-600);--colors-functional-txt-txt-error:var(--colors-primitive-color-tokens-red-600);--colors-functional-txt-txt-selected-white:var(--colors-primitive-color-tokens-neutrals-static-white);--button-curves:1.5625rem;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--background:#fff;--foreground:#303030;--card:#fff;--card-foreground:#4b4b4a;--popover:#e5e4dd;--popover-foreground:#303030;--primary:#118082;--primary-foreground:#fff;--secondary:#0000;--secondary-foreground:#4b4b4a;--muted:#d2dce6;--muted-foreground:#8ba1b9;--accent:#118082;--accent-foreground:#fff;--destructive:#e73d36;--destructive-foreground:#fff;--border:#c3c1b5;--input:#fff;--input-background:#fff;--ring:#21a49f;--elevation-sm:0px 2px 4px 0px #00000014;--chart-1:#118082;--chart-2:#92d03d;--chart-3:#f27e25;--chart-4:#d72d8a;--chart-5:#35a0e7;--radius:13px;--radius-button:999px;--radius-card:13px;--radius-small:4px;--sidebar:#f6f6f1;--sidebar-foreground:#4b4b4a;--sidebar-primary:#118082;--sidebar-primary-foreground:#fff;--sidebar-accent:#118082;--sidebar-accent-foreground:#fff;--sidebar-border:#c3c1b5;--sidebar-ring:#21a49f}:root,:host{--radius-md:var(--radius)}@layer base{*{border-color:var(--border);outline-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){*{outline-color:color-mix(in oklab, var(--ring) 50%, transparent)}}body{background-color:var(--background);color:var(--foreground);font-family:DM Sans,sans-serif}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) h1{font-family:DM Sans,sans-serif;font-size:var(--text-h1);font-weight:var(--font-weight-thin);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) h2{font-family:DM Sans,sans-serif;font-size:var(--text-h2);font-weight:var(--font-weight-semibold);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) h3{font-family:DM Sans,sans-serif;font-size:var(--text-h3);font-weight:var(--font-weight-semibold);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) h4{font-family:DM Sans,sans-serif;font-size:var(--text-h4);font-weight:var(--font-weight-semibold);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) p{font-family:DM Sans,sans-serif;font-size:var(--text-base);font-weight:var(--font-weight-normal);color:var(--colors-primitive-color-tokens-neutrals-bkg-800);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) label{font-family:DM Sans,sans-serif;font-size:var(--text-label);font-weight:var(--font-weight-medium);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) button{font-family:DM Sans,sans-serif;font-size:var(--text-button-primary);font-weight:var(--font-weight-extrabold);text-transform:uppercase;line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) input{font-family:DM Sans,sans-serif;font-size:var(--text-base);font-weight:var(--font-weight-normal);line-height:1.5}:where(:not(:has([class*=\ text-]),:not(:has([class^=text-])))) select{font-family:DM Sans,sans-serif;font-size:var(--text-base);font-weight:var(--font-weight-medium);line-height:1.5}}.large-number{font-family:Roboto,sans-serif;font-size:var(--text-large-number);font-weight:var(--font-weight-normal);line-height:1.5}.txt-display1-thin-80{font-family:DM Sans,sans-serif;font-size:80px;font-weight:var(--font-weight-thin);line-height:1.2}.txt-display2-thin-72{font-family:DM Sans,sans-serif;font-size:72px;font-weight:var(--font-weight-thin);line-height:1.2}.txt-display3-thin-64{font-family:DM Sans,sans-serif;font-size:64px;font-weight:var(--font-weight-thin);line-height:1.2}.txt-display4-thin-58{font-family:DM Sans,sans-serif;font-size:58px;font-weight:var(--font-weight-thin);line-height:1.2}.txt-display5-thin-48{font-family:DM Sans,sans-serif;font-size:48px;font-weight:var(--font-weight-thin);line-height:1.2}.txt-display6-thin-40{font-family:DM Sans,sans-serif;font-size:40px;font-weight:var(--font-weight-thin);line-height:1.2}.txt-h1-heading-Regular-30{font-family:DM Sans,sans-serif;font-size:30px;font-weight:var(--font-weight-normal);line-height:1.5}.txt-h2-heading-SemiBold-28{font-family:DM Sans,sans-serif;font-size:28px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-h3-heading-SemiBold-26{font-family:DM Sans,sans-serif;font-size:26px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-h4-heading-SemiBold-24{font-family:DM Sans,sans-serif;font-size:24px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-h5-heading-SemiBold-22{font-family:DM Sans,sans-serif;font-size:22px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-h6-heading-SemiBold-20{font-family:DM Sans,sans-serif;font-size:20px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-sb1-semibold-18{font-family:DM Sans,sans-serif;font-size:18px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-sb1-Extrabold-18{font-family:DM Sans,sans-serif;font-size:18px;font-weight:var(--font-weight-extrabold);line-height:1.5}.txt-sb2-semibold-16{font-family:DM Sans,sans-serif;font-size:16px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-sb2-Extrabold-16{font-family:DM Sans,sans-serif;font-size:16px;font-weight:var(--font-weight-extrabold);line-height:1.5}.txt-sb2-Medium-16{font-family:DM Sans,sans-serif;font-size:16px;font-weight:var(--font-weight-medium);line-height:1.5}.txt-sb3-black-14{font-family:DM Sans,sans-serif;font-size:14px;font-weight:var(--font-weight-black);line-height:1.5}.txt-sb3-extrabold-14{font-family:DM Sans,sans-serif;font-size:14px;font-weight:var(--font-weight-extrabold);line-height:1.5}.txt-sb3-semibold-14{font-family:DM Sans,sans-serif;font-size:14px;font-weight:var(--font-weight-semibold);line-height:1.5}.txt-sb3-medium-14{font-family:DM Sans,sans-serif;font-size:14px;font-weight:var(--font-weight-medium);line-height:1.5}.txt-sb3-regular-14{font-family:DM Sans,sans-serif;font-size:14px;font-weight:var(--font-weight-normal);line-height:1.5}.txt-fs-sm-medium-12{font-family:DM Sans,sans-serif;font-size:12px;font-weight:var(--font-weight-medium);line-height:1.5}.txt-fs-sm-Regular-12{font-family:DM Sans,sans-serif;font-size:12px;font-weight:var(--font-weight-normal);line-height:1.5}.txt-fs-xm-medium-10{font-family:DM Sans,sans-serif;font-size:10px;font-weight:var(--font-weight-medium);line-height:1.5}.txt-fs-xm-extrabold-10{font-family:DM Sans,sans-serif;font-size:10px;font-weight:var(--font-weight-extrabold);line-height:1.5}.txt-body-regular-14,.txt-paragraph-regular-14{font-family:DM Sans,sans-serif;font-size:14px;font-weight:var(--font-weight-normal);line-height:1.5}html{font-size:var(--font-size)}.base-button{font-family:var(--TypographyTypes-ButtonsTypography-Standard_Button-Family,"DM Sans", sans-serif);font-size:var(--TypographyTypes-ButtonsTypography-Standard_Button-Size,14px);font-weight:var(--TypographyTypes-ButtonsTypography-Standard_Button-Type,800);cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;border:none;border-radius:999px;outline:none;justify-content:center;align-items:center;gap:8px;text-decoration:none;transition:all .2s ease-in-out;display:inline-flex}.base-button:disabled{cursor:not-allowed;opacity:.6}.base-button--md{height:48px;font-size:var(--FontSize-Size-16,16px);gap:8px;padding:12px 16px}.base-button--lg{height:72px;font-size:var(--FontSize-Size-18,18px);gap:12px;padding:20px 24px}.base-button--sm{height:35px;font-size:var(--FontSize-Size-14,14px);gap:4px;padding:10px 12px}.base-button--primary{background-color:var(--colors-buttons-primary-btn-primary-btn-bkg-default);color:var(--colors-buttons-primary-btn-primary-btn-label-default,white)}.base-button--primary:hover:not(:disabled){background-color:var(--colors-buttons-primary-btn-primary-btn-bkg-hover);color:var(--colors-buttons-primary-btn-primary-btn-label-hover,white)}.base-button--primary:disabled{background-color:var(--colors-buttons-primary-btn-primary-btn-bkg-disabled);color:var(--colors-buttons-primary-btn-primary-btn-label-disabled)}.base-button--brand{background-color:var(--colors-buttons-brand-btn-brand-btn-bkg-default);color:var(--colors-buttons-brand-btn-brand-btn-label-default,white)}.base-button--brand:hover:not(:disabled){background-color:var(--colors-buttons-brand-btn-brand-btn-bkg-hover);color:var(--colors-buttons-brand-btn-brand-btn-label-hover,white)}.base-button--brand:disabled{background-color:var(--colors-buttons-brand-btn-brand-btn-bkg-disabled);color:var(--colors-buttons-brand-btn-brand-btn-label-disabled)}.base-button--secondary{background-color:var(--colors-buttons-secondary-btn-secondary-btn-bkg-default,white);color:var(--colors-buttons-secondary-btn-secondary-btn-label-default);border:1px solid var(--colors-buttons-secondary-btn-secondary-btn-border-default)}.base-button--secondary:hover:not(:disabled){background-color:var(--colors-buttons-secondary-btn-secondary-btn-bkg-hover);color:var(--colors-buttons-secondary-btn-secondary-btn-label-hover,white);border:1px solid var(--colors-buttons-secondary-btn-secondary-btn-border-hover)}.base-button--secondary:disabled{background-color:var(--colors-buttons-secondary-btn-secondary-btn-bkg-disabled);color:var(--colors-buttons-secondary-btn-secondary-btn-label-disabled);border:1px solid var(--colors-buttons-secondary-btn-secondary-btn-border-disabled)}.base-button--success{background-color:var(--colors-buttons-success-btn-brand-btn-bkg-default);color:var(--colors-buttons-success-btn-brand-btn-label-default,white)}.base-button--success:hover:not(:disabled){background-color:var(--colors-buttons-success-btn-brand-btn-bkg-hover);color:var(--colors-buttons-success-btn-brand-btn-label-hover,white)}.base-button--success:disabled{background-color:var(--colors-buttons-success-btn-brand-btn-bkg-disabled);color:var(--colors-buttons-success-btn-brand-btn-label-disabled)}.base-button svg,.base-button i{flex-shrink:0;justify-content:center;align-items:center;display:flex}.base-button--md svg,.base-button--md i{width:24px;height:24px}.base-button--lg svg,.base-button--lg i{width:32px;height:32px}.base-button--sm svg,.base-button--sm i{width:20px;height:20px}.base-button--loading{pointer-events:none;position:relative;color:#0000!important}.base-button--loading .base-button__icon,.base-button--loading .base-button__label{visibility:hidden}.base-button__spinner{border:2px solid;border-top-color:#0000;border-radius:50%;width:1.5em;height:1.5em;animation:.6s linear infinite base-button-spin;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes base-button-spin{to{transform:translate(-50%,-50%)rotate(360deg)}}.checkbox-container{cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:flex-start;padding:10px;display:inline-flex}.checkbox-row{align-items:center;gap:10px;display:flex}.checkbox-box{box-sizing:border-box;background:var(--colors-primitive-color-tokens-neutrals-static-white,white);outline:1px var(--colors-primitive-color-tokens-neutrals-bkg-400,#c3c1b5) solid;outline-offset:-.5px;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;transition:all .2s ease-in-out;display:flex;position:relative}.checkbox-box--square{border-radius:2px}.checkbox-box--round{border-radius:9999px}.checkbox-box--checked{background:var(--colors-primitive-color-tokens-teal-700,#118082);outline:1px var(--colors-primitive-color-tokens-teal-700,#118082) solid}.checkbox-container:hover .checkbox-box:not(.checkbox-box--disabled):not(.checkbox-box--readonly),.checkbox-container--hover .checkbox-box{outline:1px var(--colors-primitive-color-tokens-neutrals-bkg-500,#959490) solid}.checkbox-box--disabled{background:var(--colors-primitive-color-tokens-neutrals-inactive-200,#d2dce6);outline:1px var(--colors-primitive-color-tokens-neutrals-inactive-300,#b4c6d6) solid;cursor:not-allowed}.checkbox-box--disabled.checkbox-box--checked{background:var(--colors-primitive-color-tokens-neutrals-inactive-400,#8ba1b9)}.checkbox-box--readonly{background:var(--colors-primitive-color-tokens-neutrals-inactive-200,#d2dce6);outline:1px var(--colors-primitive-color-tokens-neutrals-inactive-300,#b4c6d6) solid;cursor:default}.checkbox-box--readonly.checkbox-box--checked{background:var(--colors-primitive-color-tokens-neutrals-inactive-600,#4b5867)}.checkbox-container--focus .checkbox-label{color:var(--colors-primitive-color-tokens-teal-800,#00575c)}.checkbox-icon{width:12px;height:9px;color:var(--colors-primitive-color-tokens-neutrals-static-white,white);justify-content:center;align-items:center;display:flex}.checkbox-icon svg{width:100%;height:100%}.checkbox-label{word-wrap:break-word;color:var(--colors-primitive-color-tokens-neutrals-bkg-700,#4b4b4a);font-family:DM Sans,sans-serif;font-size:14px;font-weight:500;line-height:20.37px;transition:color .2s ease-in-out}.checkbox-label--disabled{color:var(--colors-primitive-color-tokens-neutrals-inactive-500,#6a809a)}.checkbox-label--readonly{color:var(--colors-primitive-color-tokens-neutrals-inactive-600,#4b5867)}.checkbox-subtext{color:var(--colors-primitive-color-tokens-neutrals-bkg-600,#71706c);word-wrap:break-word;margin-top:-2px;padding-left:26px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:400;line-height:20.37px}.datepicker{width:100%;max-width:250px;font-family:var(--FontFamily-Family,"DM Sans", sans-serif);flex-direction:column;gap:4px;display:inline-flex;position:relative}.datepicker__label-row{align-items:center;gap:4px;display:flex}.datepicker__label{color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a);font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-SemiBold,600);line-height:20.37px}.datepicker__required-star{justify-content:center;align-items:center;width:8px;height:8px;display:flex}.datepicker__input-wrapper{background:var(--Colors-Functional-Bkg-Bkg_Default,white);outline:1px var(--Colors-Functional-Border-Border_Default,#c3c1b5) solid;outline-offset:-1px;cursor:pointer;border-radius:13px;justify-content:space-between;align-items:center;gap:8px;min-width:200px;height:36px;padding:0 12px;transition:all .2s ease-in-out;display:flex;position:relative;overflow:hidden}.datepicker__input-wrapper:hover:not(.datepicker__input-wrapper--disabled):not(.datepicker__input-wrapper--readonly){outline:1px var(--colors-primitive-color-tokens-neutrals-bkg-500,#959490) solid}.datepicker__input-wrapper--focus{outline:1px var(--Colors-Functional-Border-Border_Focus,#21a49f) solid!important}.datepicker__input-wrapper--disabled{background:var(--colors-primitive-color-tokens-neutrals-inactive-100,#eef2f6);cursor:not-allowed;opacity:.6;outline:1px var(--colors-primitive-color-tokens-neutrals-inactive-300,#b4c6d6) solid}.datepicker__input-wrapper--readonly{background:var(--colors-primitive-color-tokens-neutrals-bkg-50,#f9f9f6);cursor:default;outline:1px var(--colors-primitive-color-tokens-neutrals-bkg-300,#e5e4dd) solid}.datepicker__placeholder{color:var(--Colors-Functional-Border-Border_Default,#c3c1b5);font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Medium,500);white-space:nowrap;text-overflow:ellipsis;flex:1;line-height:20.37px;overflow:hidden}.datepicker__value{color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a);font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Medium,500);white-space:nowrap;text-overflow:ellipsis;flex:1;line-height:20.37px;overflow:hidden}.datepicker__icon-wrapper{width:16px;height:16px;color:var(--Colors-Functional-Border-Border_Default,#c3c1b5);justify-content:center;align-items:center;display:flex}.datepicker__dropdown{z-index:1000;background:var(--Colors-Functional-Bkg-Bkg_Default,white);outline:1px var(--Colors-Functional-Border-Border_Default,#c3c1b5) solid;outline-offset:-1px;border-radius:13px;flex-direction:column;gap:12px;min-width:280px;padding:12px 10px;display:flex;position:absolute;top:calc(100% + 4px);left:0;box-shadow:0 4px 20px #00000014}.datepicker__dropdown--range{min-width:700px}.datepicker__dropdown-main{display:flex}.datepicker__calendar-container{flex:1;display:flex}.datepicker__calendar{flex-direction:column;flex:1;gap:12px;padding:0 12px;display:flex}.datepicker__header{justify-content:center;align-items:center;gap:8px;height:36px;display:flex}.datepicker__header-selectors{flex:1;gap:8px;display:flex}.datepicker__header-select{background:var(--Colors-Functional-Bkg-Bkg_Default,white);outline:1px var(--Colors-Functional-Border-Border_Default,#c3c1b5) solid;outline-offset:-1px;cursor:pointer;height:36px;font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-SemiBold,600);color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a);border-radius:13px;flex:1;justify-content:space-between;align-items:center;gap:8px;padding:0 12px;transition:all .2s;display:flex}.datepicker__header-select:hover{outline:1px var(--Colors-Functional-Border-Border_Focus,#21a49f) solid}.datepicker__header-icon{color:var(--Colors-Functional-Border-Border_Default,#c3c1b5);justify-content:center;align-items:center;display:flex}.datepicker__weekdays{text-align:center;grid-template-columns:repeat(7,1fr);display:grid}.datepicker__weekday{width:36px;height:28px;font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Medium,500);color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a);justify-content:center;align-items:center;line-height:16px;display:flex}.datepicker__days{grid-template-columns:repeat(7,1fr);gap:0;display:grid}.datepicker__day{cursor:pointer;width:36px;height:28px;font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Regular,400);color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a);border-radius:4px;justify-content:center;align-items:center;line-height:20.37px;transition:all .2s;display:flex;position:relative}.datepicker__day:hover:not(.datepicker__day--disabled):not(.datepicker__day--selected){background:var(--Colors-Functional-Bkg-Bkg_Default,#f6f6f3)}.datepicker__day--disabled{cursor:not-allowed;color:var(--Colors-Functional-Label-Txt_Label_Disabled,#6a809a)!important}.datepicker--range .datepicker__day--selected{color:var(--colors-primitive-color-tokens-neutrals-static-white,#fff)!important;background:#21a49f!important}.datepicker--range .datepicker__day--in-range{background:#d6fffb;border-radius:0}.datepicker__day--selected{color:var(--Colors-Functional-Txt-Txt_Selected-White,white)!important;background:#21a49f!important}.datepicker__day--in-range{background:#d6fffb;border-radius:0}.datepicker__day-text{z-index:1}.datepicker__divider{outline:1px var(--Colors-Functional-Border-Border_Default,#c3c1b5) solid;outline-offset:-.3px;align-self:stretch;height:0}.datepicker__footer{flex-direction:column;display:flex}.datepicker__presets{flex-direction:column;gap:8px;min-width:140px;padding-right:8px;display:flex}.datepicker__preset{font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Regular,400);color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a);cursor:pointer;border-radius:4px;padding:5px 20px;line-height:20.37px;transition:all .2s}.datepicker__preset:hover{background:var(--Colors-Functional-Bkg-Bkg_Default,#f6f6f3)}.datepicker--range .datepicker__preset--active{font-weight:var(--FontType-SemiBold,600);color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a)!important;background:#d6fffb!important}.datepicker__preset--active{font-weight:var(--FontType-SemiBold,600);color:var(--Colors-Functional-Label-Txt_Label_Default,#4b4b4a)}.datepicker__vertical-divider{background:var(--Colors-Functional-Border-Border_Default,#c3c1b5);align-self:stretch;width:1px;min-height:100%;margin:-12px 0}.datepicker__vertical-divider--calendar{margin:0}.datepicker__actions{justify-content:flex-end;gap:8px;padding-top:12px;display:flex}.datepicker__button{height:40px;font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-ExtraBold,800);cursor:pointer;text-transform:uppercase;letter-spacing:.02em;border:none;border-radius:999px;justify-content:center;align-items:center;gap:4px;padding:0 16px;line-height:20.37px;transition:all .2s;display:flex}.datepicker__button--cancel{background:var(--Colors-Buttons-SecondaryBtn-SecondaryBtn_Bkg_Default,white);color:var(--Colors-Buttons-SecondaryBtn-SecondaryBtn_Label_Default,#4b4b4a);border:1px var(--Colors-Buttons-SecondaryBtn-SecondaryBtn_Border_Default,#118082) solid}.datepicker__button--cancel:hover{background:var(--Colors-Functional-Bkg-Bkg_Default,#f6f6f3)}.datepicker__button--apply{background:var(--Colors-Buttons-PrimaryBtn-PrimaryBtn_Bkg_Default,#118082);color:var(--Colors-Buttons-PrimaryBtn-PrimaryBtn_Label_Default,white)}.datepicker__button--apply:hover{background:var(--Colors-Buttons-PrimaryBtn-PrimaryBtn_Bkg_Hover,#00575c)}.datepicker__button--apply:disabled{background:var(--Colors-Buttons-PrimaryBtn-PrimaryBtn_Bkg_Disabled,#8ba1b9);cursor:not-allowed}.pill-badge{box-sizing:border-box;color:var(--Colors-Buttons-Pill-Badge-Txt_Pill-Badge_Label,#4b4b4a);border-radius:18px;justify-content:center;align-items:center;width:fit-content;padding:0 9px;font-family:DM Sans,sans-serif;transition:all .2s ease-in-out;display:inline-flex}.pill-badge--stacked{flex-direction:column;padding:5px}.pill-badge--blue{background-color:var(--Colors-Buttons-Pill-Badge-Bkg-Blue200,#d2edff)}.pill-badge--fuchsia{background-color:var(--Colors-Buttons-Pill-Badge-Bkg-Fusia100,#ffdaef)}.pill-badge--lime{background-color:var(--Colors-Buttons-Pill-Badge-Bkg-Lime200,#daf3b9)}.pill-badge--sm{height:24px;font-size:12px;font-weight:500;line-height:17.46px}.pill-badge--md{height:26px;font-size:14px;font-weight:600;line-height:20.37px}.pill-badge__title{text-align:center;flex-direction:column;justify-content:center;display:flex}.pill-badge--stacked .pill-badge__title--md{font-size:14px;font-weight:500;line-height:20.37px}.pill-badge--stacked .pill-badge__title--lg{font-size:16px;font-weight:500;line-height:23.28px}.pill-badge__subtext{text-align:center;flex-direction:column;justify-content:center;font-size:10px;font-weight:500;line-height:14.55px;display:flex}.progressbar{flex-direction:column;gap:4px;width:211px;display:flex}.progressbar--card{background:var(--colors-primitive-color-tokens-neutrals-bkg-200,#efeeea);border:1px solid var(--colors-primitive-color-tokens-neutrals-bkg-400,#c3c1b5);border-radius:10px;width:fit-content;padding:5px 10px}.progressbar--card .progressbar__track,.progressbar--card .progressbar__header,.progressbar--card .progressbar__footer{width:100%}.progressbar__header{justify-content:space-between;align-items:center;width:100%;display:flex}.progressbar__label{color:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-700,#4b4b4a);font-size:var(--FontSize-Size-12,12px);font-weight:var(--FontType-Medium,500);white-space:nowrap;text-overflow:ellipsis;width:131px;line-height:1.45;overflow:hidden}.progressbar__percentage{color:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-700,#4b4b4a);font-size:var(--FontSize-Size-12,12px);font-weight:var(--FontType-Medium,500);line-height:1.45}.progressbar__track{background:var(--Colors-PrimitiveColorTokens-Neutrals-Inactive-200,#d2dce6);border-radius:20px;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.progressbar__track--sm{height:4px}.progressbar__track--md{height:10px}.progressbar__track--lg{height:16px}.progressbar__fill{border-radius:20px;height:100%;transition:width .3s ease-in-out}.progressbar__fill--default{background:var(--colors-primitive-color-tokens-teal-700,#118082)}.progressbar__fill--high-usage{background:var(--colors-primitive-color-tokens-orange-500,#f27e25)}.progressbar__footer{justify-content:space-between;align-items:center;width:100%;height:17px;display:flex}.progressbar__used{color:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-600,#71706c);font-size:var(--FontSize-Size-12,12px);font-weight:var(--FontType-Medium,500);line-height:1.45}.progressbar__remaining{color:var(--Colors-PrimitiveColorTokens-Neutrals-Bkg-600,#71706c);font-size:var(--FontSize-Size-12,12px);font-weight:var(--FontType-Regular,400);line-height:1.45}.radio-button{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;gap:5px;display:inline-flex;position:relative}.radio-button--disabled,.radio-button--readonly{cursor:default}.radio-button__input{opacity:0;width:0;height:0;margin:0;position:absolute}.radio-button__wrapper{flex-shrink:0;width:16px;height:16px;margin-top:2px;position:relative}.radio-button__visual{width:100%;height:100%;cursor:inherit;display:block}.radio-button__outer-circle{background:var(--colors-primitive-color-tokens-neutrals-static-white,#fff);border:1px solid var(--colors-primitive-color-tokens-neutrals-bkg-400,#c3c1b5);box-sizing:border-box;border-radius:50%;place-items:center;width:16px;height:16px;line-height:0;transition:border-color .2s;display:grid;overflow:hidden}.radio-button:not(.radio-button--disabled):not(.radio-button--readonly):hover .radio-button__outer-circle{border-color:var(--colors-primitive-color-tokens-neutrals-bkg-500,#959490)}.radio-button__inner-circle{background:var(--colors-primitive-color-tokens-teal-700,#118082);border-radius:50%;flex-shrink:0;width:10px;height:10px;display:block}.radio-button__content{flex-direction:column;display:flex}.radio-button__label{color:var(--colors-primitive-color-tokens-neutrals-bkg-700,#4b4b4a);font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Medium,500);cursor:inherit;line-height:20.37px;transition:color .2s}.radio-button:not(.radio-button--disabled):not(.radio-button--readonly):hover .radio-button__label{color:var(--colors-primitive-color-tokens-teal-800,#00575c)}.radio-button__subtext{color:var(--colors-primitive-color-tokens-neutrals-bkg-700,#4b4b4a);font-size:var(--FontSize-Size-10,10px);font-weight:var(--FontType-Medium,500);line-height:14.55px}.radio-button--disabled .radio-button__outer-circle{background:var(--colors-primitive-color-tokens-neutrals-inactive-200,#d2dce6);border-color:var(--colors-primitive-color-tokens-neutrals-inactive-300,#b4c6d6)}.radio-button--disabled .radio-button__inner-circle{background:var(--colors-primitive-color-tokens-neutrals-inactive-400,#8ba1b9)}.radio-button--disabled .radio-button__label,.radio-button--disabled .radio-button__subtext{color:var(--colors-primitive-color-tokens-neutrals-inactive-500,#6a809a)}.radio-button--readonly .radio-button__outer-circle{background:var(--colors-primitive-color-tokens-neutrals-inactive-200,#d2dce6);border-color:var(--colors-primitive-color-tokens-neutrals-inactive-300,#b4c6d6)}.radio-button--readonly .radio-button__inner-circle{background:var(--colors-primitive-color-tokens-neutrals-inactive-600,#4b5867)}.radio-button--readonly .radio-button__label,.radio-button--readonly .radio-button__subtext{color:var(--colors-primitive-color-tokens-neutrals-inactive-600,#4b5867)}.search-box{box-sizing:border-box;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative}.search-box__wrapper{background:var(--colors-primitive-color-tokens-neutrals-static-white,#fff);border:1px solid var(--colors-primitive-color-tokens-neutrals-bkg-400,#c3c1b5);cursor:text;border-radius:13px;align-items:center;height:36px;padding:0 10px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.search-box--collapsed .search-box__wrapper{cursor:pointer;justify-content:center;width:36px;padding:0}.search-box--expanded .search-box__wrapper{width:415px;max-width:100%}.search-box:not(.search-box--disabled) .search-box__wrapper:hover{border-color:var(--colors-primitive-color-tokens-neutrals-bkg-500,#959490)}.search-box:not(.search-box--disabled):focus-within .search-box__wrapper{border-color:var(--colors-primitive-color-tokens-teal-600,#21a49f);box-shadow:0 0 0 4px #27bcb740}.search-box__icon-container{width:16px;height:16px;color:var(--colors-primitive-color-tokens-blue-600,#1a77b4);flex-shrink:0;justify-content:center;align-items:center;transition:color .2s;display:flex}.search-box__input{height:100%;font-size:var(--FontSize-Size-14,14px);font-weight:var(--FontType-Medium,500);color:var(--colors-primitive-color-tokens-neutrals-bkg-800,#303030);background:0 0;border:none;outline:none;flex:1;margin-left:8px;line-height:20.37px}.search-box__input::placeholder{color:var(--colors-primitive-color-tokens-neutrals-bkg-600,#71706c)}.search-box--disabled .search-box__wrapper{background:var(--colors-primitive-color-tokens-neutrals-inactive-200,#d2dce6);border-color:var(--colors-primitive-color-tokens-neutrals-inactive-300,#b4c6d6);cursor:default}.search-box--disabled .search-box__icon-container,.search-box--disabled .search-box__input,.search-box--disabled .search-box__input::placeholder{color:var(--colors-primitive-color-tokens-neutrals-inactive-400,#8ba1b9)}.state-badge{box-sizing:border-box;border-radius:24px;justify-content:center;align-items:center;gap:5px;width:fit-content;height:24px;padding:8px;font-family:DM Sans,sans-serif;transition:all .2s ease-in-out;display:inline-flex}.state-badge--active{background-color:var(--Colors-Buttons-Active-Inactive-Bkg_Active,#1a77b4)}.state-badge--inactive{background-color:var(--Colors-Buttons-Active-Inactive-Bkg_Inactive,#959490)}.state-badge__label{color:var(--Colors-Buttons-Active-Inactive-Txt_Label_Active,white);white-space:nowrap;flex-direction:column;justify-content:center;font-size:12px;font-weight:500;line-height:17.46px;display:flex}.state-badge__icon{width:12px;height:12px;color:var(--Colors-Functional-Input-Icons-Icon_White,white);flex-shrink:0;justify-content:center;align-items:center;display:flex}.state-badge__icon-placeholder{background-color:var(--Colors-Functional-Input-Icons-Icon_White,white);width:14px;height:14px;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
+/*$vite$:1*/

package/dist/icons.svg

@@ -0,0 +1,24 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <symbol id="bluesky-icon" viewBox="0 0 16 17">
+    <g clip-path="url(#bluesky-clip)"><path fill="#08060d" d="M7.75 7.735c-.693-1.348-2.58-3.86-4.334-5.097-1.68-1.187-2.32-.981-2.74-.79C.188 2.065.1 2.812.1 3.251s.241 3.602.398 4.13c.52 1.744 2.367 2.333 4.07 2.145-2.495.37-4.71 1.278-1.805 4.512 3.196 3.309 4.38-.71 4.987-2.746.608 2.036 1.307 5.91 4.93 2.746 2.72-2.746.747-4.143-1.747-4.512 1.702.189 3.55-.4 4.07-2.145.156-.528.397-3.691.397-4.13s-.088-1.186-.575-1.406c-.42-.19-1.06-.395-2.741.79-1.755 1.24-3.64 3.752-4.334 5.099"/></g>
+    <defs><clipPath id="bluesky-clip"><path fill="#fff" d="M.1.85h15.3v15.3H.1z"/></clipPath></defs>
+  </symbol>
+  <symbol id="discord-icon" viewBox="0 0 20 19">
+    <path fill="#08060d" d="M16.224 3.768a14.5 14.5 0 0 0-3.67-1.153c-.158.286-.343.67-.47.976a13.5 13.5 0 0 0-4.067 0c-.128-.306-.317-.69-.476-.976A14.4 14.4 0 0 0 3.868 3.77C1.546 7.28.916 10.703 1.231 14.077a14.7 14.7 0 0 0 4.5 2.306q.545-.748.965-1.587a9.5 9.5 0 0 1-1.518-.74q.191-.14.372-.293c2.927 1.369 6.107 1.369 8.999 0q.183.152.372.294-.723.437-1.52.74.418.838.963 1.588a14.6 14.6 0 0 0 4.504-2.308c.37-3.911-.63-7.302-2.644-10.309m-9.13 8.234c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.894 0 1.614.82 1.599 1.82.001 1-.705 1.82-1.6 1.82m5.91 0c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.893 0 1.614.82 1.599 1.82 0 1-.706 1.82-1.6 1.82"/>
+  </symbol>
+  <symbol id="documentation-icon" viewBox="0 0 21 20">
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="m15.5 13.333 1.533 1.322c.645.555.967.833.967 1.178s-.322.623-.967 1.179L15.5 18.333m-3.333-5-1.534 1.322c-.644.555-.966.833-.966 1.178s.322.623.966 1.179l1.534 1.321"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M17.167 10.836v-4.32c0-1.41 0-2.117-.224-2.68-.359-.906-1.118-1.621-2.08-1.96-.599-.21-1.349-.21-2.848-.21-2.623 0-3.935 0-4.983.369-1.684.591-3.013 1.842-3.641 3.428C3 6.449 3 7.684 3 10.154v2.122c0 2.558 0 3.838.706 4.726q.306.383.713.671c.76.536 1.79.64 3.581.66"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M3 10a2.78 2.78 0 0 1 2.778-2.778c.555 0 1.209.097 1.748-.047.48-.129.854-.503.982-.982.145-.54.048-1.194.048-1.749a2.78 2.78 0 0 1 2.777-2.777"/>
+  </symbol>
+  <symbol id="github-icon" viewBox="0 0 19 19">
+    <path fill="#08060d" fill-rule="evenodd" d="M9.356 1.85C5.05 1.85 1.57 5.356 1.57 9.694a7.84 7.84 0 0 0 5.324 7.44c.387.079.528-.168.528-.376 0-.182-.013-.805-.013-1.454-2.165.467-2.616-.935-2.616-.935-.349-.91-.864-1.143-.864-1.143-.71-.48.051-.48.051-.48.787.051 1.2.805 1.2.805.695 1.194 1.817.857 2.268.649.064-.507.27-.857.49-1.052-1.728-.182-3.545-.857-3.545-3.87 0-.857.31-1.558.8-2.104-.078-.195-.349-1 .077-2.078 0 0 .657-.208 2.14.805a7.5 7.5 0 0 1 1.946-.26c.657 0 1.328.092 1.946.26 1.483-1.013 2.14-.805 2.14-.805.426 1.078.155 1.883.078 2.078.502.546.799 1.247.799 2.104 0 3.013-1.818 3.675-3.558 3.87.284.247.528.714.528 1.454 0 1.052-.012 1.896-.012 2.156 0 .208.142.455.528.377a7.84 7.84 0 0 0 5.324-7.441c.013-4.338-3.48-7.844-7.773-7.844" clip-rule="evenodd"/>
+  </symbol>
+  <symbol id="social-icon" viewBox="0 0 20 20">
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M12.5 6.667a4.167 4.167 0 1 0-8.334 0 4.167 4.167 0 0 0 8.334 0"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M2.5 16.667a5.833 5.833 0 0 1 8.75-5.053m3.837.474.513 1.035c.07.144.257.282.414.309l.93.155c.596.1.736.536.307.965l-.723.73a.64.64 0 0 0-.152.531l.207.903c.164.715-.213.991-.84.618l-.872-.52a.63.63 0 0 0-.577 0l-.872.52c-.624.373-1.003.094-.84-.618l.207-.903a.64.64 0 0 0-.152-.532l-.723-.729c-.426-.43-.289-.864.306-.964l.93-.156a.64.64 0 0 0 .412-.31l.513-1.034c.28-.562.735-.562 1.012 0"/>
+  </symbol>
+  <symbol id="x-icon" viewBox="0 0 19 19">
+    <path fill="#08060d" fill-rule="evenodd" d="M1.893 1.98c.052.072 1.245 1.769 2.653 3.77l2.892 4.114c.183.261.333.48.333.486s-.068.089-.152.183l-.522.593-.765.867-3.597 4.087c-.375.426-.734.834-.798.905a1 1 0 0 0-.118.148c0 .01.236.017.664.017h.663l.729-.83c.4-.457.796-.906.879-.999a692 692 0 0 0 1.794-2.038c.034-.037.301-.34.594-.675l.551-.624.345-.392a7 7 0 0 1 .34-.374c.006 0 .93 1.306 2.052 2.903l2.084 2.965.045.063h2.275c1.87 0 2.273-.003 2.266-.021-.008-.02-1.098-1.572-3.894-5.547-2.013-2.862-2.28-3.246-2.273-3.266.008-.019.282-.332 2.085-2.38l2-2.274 1.567-1.782c.022-.028-.016-.03-.65-.03h-.674l-.3.342a871 871 0 0 1-1.782 2.025c-.067.075-.405.458-.75.852a100 100 0 0 1-.803.91c-.148.172-.299.344-.99 1.127-.304.343-.32.358-.345.327-.015-.019-.904-1.282-1.976-2.808L6.365 1.85H1.8zm1.782.91 8.078 11.294c.772 1.08 1.413 1.973 1.425 1.984.016.017.241.02 1.05.017l1.03-.004-2.694-3.766L7.796 5.75 5.722 2.852l-1.039-.004-1.039-.004z" clip-rule="evenodd"/>
+  </symbol>
+</svg>

package/dist/index.d.ts

@@ -0,0 +1 @@
+export {}

package/dist/index.js

@@ -0,0 +1 @@
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.DesignCheckUI={},e.React,e.jsxRuntime))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e)))(t);var u={fontFamily:`'DM Sans', sans-serif`},d=t.default.forwardRef(({className:e=``,variant:t=`primary`,size:r=`md`,isLoading:i=!1,leftIcon:a,rightIcon:o,children:s,disabled:c,style:l,...d},f)=>{let p=e=>typeof e==`string`&&!e.includes(`+`)?(0,n.jsx)(`i`,{className:`fa-solid fa-${e}`,"aria-hidden":`true`}):e;return(0,n.jsxs)(`button`,{ref:f,className:[`base-button`,`base-button--${t}`,`base-button--${r}`,i?`base-button--loading`:``,e].filter(Boolean).join(` `),disabled:c||i,style:{...u,...l},...d,children:[i&&(0,n.jsx)(`span`,{className:`base-button__spinner`,"aria-hidden":`true`}),a&&!i&&(0,n.jsx)(`span`,{className:`base-button__icon base-button__icon--left`,"aria-hidden":`true`,children:p(a)}),(0,n.jsx)(`span`,{className:`base-button__label`,children:s}),o&&!i&&(0,n.jsx)(`span`,{className:`base-button__icon base-button__icon--right`,"aria-hidden":`true`,children:p(o)})]})});d.displayName=`BaseButton`;var f={fontFamily:`'DM Sans', sans-serif`},p=t.default.forwardRef(({label:e=`Label`,subtext:t,variant:r=`square`,state:i=`default`,checked:a=!1,className:o=``,onChange:s,disabled:c,readOnly:l,...u},d)=>{let p=i===`disabled`||c,m=i===`readonly`||l,h=[`checkbox-container`,i===`focus`?`checkbox-container--focus`:``,i===`hover`?`checkbox-container--hover`:``,o].filter(Boolean).join(` `),g=[`checkbox-box`,`checkbox-box--${r}`,a?`checkbox-box--checked`:``,p?`checkbox-box--disabled`:``,m?`checkbox-box--readonly`:``].filter(Boolean).join(` `),_=[`checkbox-label`,p?`checkbox-label--disabled`:``,m?`checkbox-label--readonly`:``].filter(Boolean).join(` `);return(0,n.jsxs)(`label`,{className:h,style:f,children:[(0,n.jsxs)(`div`,{className:`checkbox-row`,children:[(0,n.jsx)(`input`,{ref:d,type:`checkbox`,checked:a,onChange:e=>{p||m||s&&s(e)},disabled:p,readOnly:m,style:{display:`none`},...u}),(0,n.jsx)(`div`,{className:g,children:a&&(0,n.jsx)(`div`,{className:`checkbox-icon`,children:(0,n.jsx)(`svg`,{width:`12`,height:`9`,viewBox:`0 0 12 9`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:(0,n.jsx)(`path`,{d:`M1 4.5L4.5 8L11 1`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})})})}),(0,n.jsx)(`span`,{className:_,children:e})]}),t&&(0,n.jsx)(`div`,{className:`checkbox-subtext`,children:t})]})});p.displayName=`Checkbox`;var m={fontFamily:`'DM Sans', sans-serif`},h={Calendar:e=>(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,...e,children:[(0,n.jsx)(`rect`,{x:`2`,y:`3`,width:`12`,height:`11`,rx:`2`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M2 7H14`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M5 2V4`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`}),(0,n.jsx)(`path`,{d:`M11 2V4`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]}),ChevronDown:e=>(0,n.jsx)(`svg`,{width:`10`,height:`6`,viewBox:`0 0 10 6`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,...e,children:(0,n.jsx)(`path`,{d:`M1 1L5 5L9 1`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})}),Star:e=>(0,n.jsx)(`svg`,{width:`8`,height:`8`,viewBox:`0 0 8 8`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,...e,children:(0,n.jsx)(`path`,{d:`M4 0L4.8541 3.1459H8L5.44272 5L6.29682 8.1459L4 6.25L1.70318 8.1459L2.55728 5L0 3.1459H3.1459L4 0Z`,fill:`var(--colors-primitive-color-tokens-red-500, #E73D36)`})})},g=t.default.forwardRef(({label:e=`Label`,required:r=!1,placeholder:i=`Select Date`,value:a=``,onChange:o,className:s=``,mode:c=`single`,state:l=`default`,...u},d)=>{let[f,p]=(0,t.useState)(!1),[g,_]=(0,t.useState)(typeof a==`string`?a:``),[v,y]=(0,t.useState)(typeof a==`string`?a:``),[b,x]=(0,t.useState)(Array.isArray(a)?a:[``,``]),[S,C]=(0,t.useState)(Array.isArray(a)?a:[``,``]);(0,t.useEffect)(()=>{if(typeof a==`string`){if(_(a),y(a),a){let e=new Date(a);isNaN(e.getTime())||(T(e.getMonth()),D(e.getFullYear()))}}else if(Array.isArray(a)&&(x(a),C(a),a[0])){let e=new Date(a[0]);isNaN(e.getTime())||(T(e.getMonth()),D(e.getFullYear()))}},[a]);let[w,T]=(0,t.useState)(new Date().getMonth()),[E,D]=(0,t.useState)(new Date().getFullYear()),[O,k]=(0,t.useState)(!1),[A,j]=(0,t.useState)(!1),[M,N]=(0,t.useState)(null),P=(0,t.useRef)(null);t.default.useImperativeHandle(d,()=>P.current);let F=c===`range`,I=l===`disabled`,L=l===`readonly`,R=[`Mon`,`Tue`,`Wed`,`Thu`,`Fri`,`Sat`,`Sun`],z=[`Jan`,`Feb`,`Mar`,`Apr`,`May`,`Jun`,`Jul`,`Aug`,`Sep`,`Oct`,`Nov`,`Dec`],B=[{label:`Today`,getValue:()=>{let e=new Date().toISOString().split(`T`)[0];return[e,e]}},{label:`Yesterday`,getValue:()=>{let e=new Date;e.setDate(e.getDate()-1);let t=e.toISOString().split(`T`)[0];return[t,t]}},{label:`Last 7 days`,getValue:()=>{let e=new Date,t=new Date;return t.setDate(e.getDate()-6),[t.toISOString().split(`T`)[0],e.toISOString().split(`T`)[0]]}},{label:`Last 14 days`,getValue:()=>{let e=new Date,t=new Date;return t.setDate(e.getDate()-13),[t.toISOString().split(`T`)[0],e.toISOString().split(`T`)[0]]}},{label:`Custom`,getValue:()=>[``,``]}];(0,t.useEffect)(()=>{let e=e=>{P.current&&!P.current.contains(e.target)&&p(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]);let V=()=>{I||L||(f||(y(g),C(b),k(!1),j(!1)),p(!f))},H=(e,t)=>{if(!t)if(F)if(!S[0]||S[0]&&S[1])C([e,``]),N(null);else{let t=new Date(S[0]);C(new Date(e)<t?[e,S[0]]:[S[0],e]),N(null)}else y(e)},U=e=>{let t=e.getValue();if(C(t),N(null),t[0]){let e=new Date(t[0]);T(e.getMonth()),D(e.getFullYear())}},W=e=>{e.stopPropagation(),F?(x(S),o&&o(S)):(_(v),o&&o(v)),p(!1)},G=e=>{e.stopPropagation(),F?C(b):y(g),p(!1)},K=(e,t,r=!1)=>{let i=new Date(t,e,1).getDay(),a=new Date(t,e+1,0).getDate(),o=new Date(t,e,0).getDate(),s=i===0?6:i-1,c=[];for(let n=s-1;n>=0;n--){let r=o-n,i=e===0?11:e-1,a=e===0?t-1:t;c.push({day:r,month:i,year:a,currentMonth:!1})}for(let n=1;n<=a;n++)c.push({day:n,month:e,year:t,currentMonth:!0});let l=42-c.length;for(let n=1;n<=l;n++){let r=e===11?0:e+1,i=e===11?t+1:t;c.push({day:n,month:r,year:i,currentMonth:!1})}let u=[],d=new Date().getFullYear();for(let e=d-10;e<=d+10;e++)u.push(e);return(0,n.jsxs)(`div`,{className:`datepicker__calendar`,children:[(0,n.jsx)(`div`,{className:`datepicker__header`,children:(0,n.jsxs)(`div`,{className:`datepicker__header-selectors`,children:[(0,n.jsxs)(`div`,{className:`datepicker__header-select`,onClick:e=>{e.stopPropagation(),r||(k(!O),j(!1))},style:{position:`relative`},children:[z[e],(0,n.jsx)(`span`,{className:`datepicker__header-icon`,children:(0,n.jsx)(h.ChevronDown,{})}),!r&&O&&(0,n.jsx)(`div`,{className:`datepicker__select-dropdown`,style:{position:`absolute`,top:`100%`,left:0,width:`100%`,maxHeight:`200px`,overflowY:`auto`,background:`var(--Colors-Functional-Bkg-Bkg_Default, white)`,border:`1px solid var(--Colors-Functional-Border-Border_Default, #C3C1B5)`,borderRadius:`8px`,zIndex:10,boxShadow:`0 4px 12px rgba(0,0,0,0.1)`},children:z.map((t,r)=>(0,n.jsx)(`div`,{className:`datepicker__select-option`,style:{padding:`8px 12px`,cursor:`pointer`,background:e===r?`var(--Colors-Functional-Bkg-Bkg_Default, #F6F6F3)`:`transparent`,fontSize:`14px`},onClick:e=>{e.stopPropagation(),T(r),k(!1)},children:t},t))})]}),(0,n.jsxs)(`div`,{className:`datepicker__header-select`,onClick:e=>{e.stopPropagation(),r||(j(!A),k(!1))},style:{position:`relative`},children:[t,(0,n.jsx)(`span`,{className:`datepicker__header-icon`,children:(0,n.jsx)(h.ChevronDown,{})}),!r&&A&&(0,n.jsx)(`div`,{className:`datepicker__select-dropdown`,style:{position:`absolute`,top:`100%`,left:0,width:`100%`,maxHeight:`200px`,overflowY:`auto`,background:`var(--Colors-Functional-Bkg-Bkg_Default, white)`,border:`1px solid var(--Colors-Functional-Border-Border_Default, #C3C1B5)`,borderRadius:`8px`,zIndex:10,boxShadow:`0 4px 12px rgba(0,0,0,0.1)`},children:u.map(e=>(0,n.jsx)(`div`,{className:`datepicker__select-option`,style:{padding:`8px 12px`,cursor:`pointer`,background:t===e?`var(--Colors-Functional-Bkg-Bkg_Default, #F6F6F3)`:`transparent`,fontSize:`14px`},onClick:t=>{t.stopPropagation(),D(e),j(!1)},children:e},e))})]})]})}),!F&&(0,n.jsx)(`div`,{className:`datepicker__divider`}),(0,n.jsx)(`div`,{className:`datepicker__weekdays`,children:R.map(e=>(0,n.jsx)(`div`,{className:`datepicker__weekday`,children:e},e))}),(0,n.jsx)(`div`,{className:`datepicker__days`,onMouseLeave:()=>N(null),children:c.map((e,t)=>{let r=`${e.year}-${(e.month+1).toString().padStart(2,`0`)}-${e.day.toString().padStart(2,`0`)}`,i=F?S[0]===r||S[1]===r:v===r,a=!1;if(F&&S[0]){let e=new Date(S[0]),t=S[1]?new Date(S[1]):M?new Date(M):null,n=new Date(r);t&&(a=n>(e<t?e:t)&&n<(e<t?t:e))}return(0,n.jsx)(`div`,{className:`datepicker__day ${e.currentMonth?``:`datepicker__day--disabled`} ${i?`datepicker__day--selected`:``} ${a?`datepicker__day--in-range`:``}`,onClick:t=>{t.stopPropagation(),H(r,!e.currentMonth)},onMouseEnter:()=>{F&&S[0]&&!S[1]&&N(r)},children:(0,n.jsx)(`div`,{className:`datepicker__day-text`,children:e.day})},t)})})]})},q=(0,t.useMemo)(()=>F?b[0]&&b[1]?`${b[0]} - ${b[1]}`:b[0]?`${b[0]} - ...`:``:g,[F,b,g]),J=[`datepicker`,F?`datepicker--range`:``,s].filter(Boolean).join(` `),Y=[`datepicker__input-wrapper`,f?`datepicker__input-wrapper--focus`:``,`datepicker__input-wrapper--${l}`,I?`datepicker__input-wrapper--disabled`:``,L?`datepicker__input-wrapper--readonly`:``].filter(Boolean).join(` `);return(0,n.jsxs)(`div`,{className:J,ref:P,style:m,...u,children:[e&&(0,n.jsxs)(`div`,{className:`datepicker__label-row`,children:[(0,n.jsx)(`span`,{className:`datepicker__label`,children:e}),r&&(0,n.jsx)(`span`,{className:`datepicker__required-star`,children:(0,n.jsx)(h.Star,{})})]}),(0,n.jsxs)(`div`,{className:Y,onClick:V,children:[q?(0,n.jsx)(`span`,{className:`datepicker__value`,children:q}):(0,n.jsx)(`span`,{className:`datepicker__placeholder`,children:i}),(0,n.jsx)(`span`,{className:`datepicker__icon-wrapper`,children:(0,n.jsx)(h.Calendar,{})})]}),f&&(0,n.jsx)(`div`,{className:`datepicker__dropdown ${F?`datepicker__dropdown--range`:``}`,onClick:e=>e.stopPropagation(),children:F?(0,n.jsxs)(`div`,{style:{display:`flex`,flex:1},children:[(0,n.jsx)(`div`,{className:`datepicker__presets`,children:B.map(e=>(0,n.jsx)(`div`,{className:`datepicker__preset ${JSON.stringify(S)===JSON.stringify(e.getValue())?`datepicker__preset--active`:``}`,onClick:()=>U(e),children:e.label},e.label))}),(0,n.jsx)(`div`,{className:`datepicker__vertical-divider`}),(0,n.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,flex:1},children:[(0,n.jsxs)(`div`,{className:`datepicker__calendar-container`,children:[K(w,E,!1),(0,n.jsx)(`div`,{className:`datepicker__vertical-divider datepicker__vertical-divider--calendar`}),K(w===11?0:w+1,w===11?E+1:E,!0)]}),(0,n.jsxs)(`div`,{className:`datepicker__footer`,children:[(0,n.jsx)(`div`,{className:`datepicker__divider`}),(0,n.jsxs)(`div`,{className:`datepicker__actions`,children:[(0,n.jsx)(`button`,{className:`datepicker__button datepicker__button--cancel`,onClick:G,children:`CANCEL`}),(0,n.jsx)(`button`,{className:`datepicker__button datepicker__button--apply`,onClick:W,disabled:!S[0]||!S[1],children:`APPLY`})]})]})]})]}):(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`div`,{className:`datepicker__dropdown-main`,children:(0,n.jsx)(`div`,{className:`datepicker__calendar-container`,children:K(w,E,!1)})}),(0,n.jsxs)(`div`,{className:`datepicker__footer`,children:[(0,n.jsx)(`hr`,{}),(0,n.jsxs)(`div`,{className:`datepicker__actions`,children:[(0,n.jsx)(`button`,{className:`datepicker__button datepicker__button--cancel`,onClick:G,children:`CANCEL`}),(0,n.jsx)(`button`,{className:`datepicker__button datepicker__button--apply`,onClick:W,disabled:!v,children:`APPLY`})]})]})]})})]})});g.displayName=`DatePicker`;var _={fontFamily:`'DM Sans', sans-serif`},v=t.default.forwardRef(({className:e=``,variant:t=`blue`,size:r=`md`,stacked:i=!1,subtext:a,children:o,style:s,...c},l)=>{let u=[`pill-badge`,`pill-badge--${t}`,i?`pill-badge--stacked`:`pill-badge--${r===`lg`?`md`:r}`,e].filter(Boolean).join(` `),d=r===`lg`?`pill-badge__title--lg`:`pill-badge__title--md`;return(0,n.jsxs)(`div`,{ref:l,className:u,style:{..._,...s},...c,children:[(0,n.jsx)(`div`,{className:`pill-badge__title ${i?d:``}`,children:o}),i&&a&&(0,n.jsx)(`div`,{className:`pill-badge__subtext`,children:a})]})});v.displayName=`PillBadge`;var y={fontFamily:`'DM Sans', sans-serif`},b=t.default.forwardRef(({label:e,percentage:t=0,usedText:r,remainingText:i,variant:a=`default`,size:o=`sm`,withCard:s=!1,width:c,className:l=``,style:u,...d},f)=>{let p=Math.max(0,Math.min(100,t)),m=[`progressbar`,s?`progressbar--card`:``,l].filter(Boolean).join(` `),h=[`progressbar__track`,`progressbar__track--${o}`].join(` `),g=[`progressbar__fill`,`progressbar__fill--${a}`].join(` `);return(0,n.jsxs)(`div`,{ref:f,className:m,style:{...y,width:c,...u},...d,children:[(e||t!==void 0)&&(0,n.jsxs)(`div`,{className:`progressbar__header`,children:[e&&(0,n.jsx)(`span`,{className:`progressbar__label`,children:e}),t!==void 0&&(0,n.jsxs)(`span`,{className:`progressbar__percentage`,children:[p,`%`]})]}),(0,n.jsx)(`div`,{className:h,children:(0,n.jsx)(`div`,{className:g,style:{width:`${p}%`}})}),(r||i)&&(0,n.jsxs)(`div`,{className:`progressbar__footer`,children:[r&&(0,n.jsx)(`span`,{className:`progressbar__used`,children:r}),i&&(0,n.jsx)(`span`,{className:`progressbar__remaining`,children:i})]})]})});b.displayName=`ProgressBar`;var x={fontFamily:`"DM Sans", sans-serif`},S=t.default.forwardRef(({label:e,subtext:t,checked:r,disabled:i,readOnly:a=!1,className:o=``,id:s,...c},l)=>{let u=s||`radio-${Math.random().toString(36).substring(2,9)}`;return(0,n.jsxs)(`div`,{className:[`radio-button`,r?`radio-button--checked`:``,i?`radio-button--disabled`:``,a?`radio-button--readonly`:``,o].filter(Boolean).join(` `),style:x,children:[(0,n.jsxs)(`div`,{className:`radio-button__wrapper`,children:[(0,n.jsx)(`input`,{ref:l,type:`radio`,id:u,className:`radio-button__input`,checked:r,disabled:i||a,...c}),(0,n.jsx)(`label`,{htmlFor:u,className:`radio-button__visual`,children:(0,n.jsx)(`span`,{className:`radio-button__outer-circle`,children:r&&(0,n.jsx)(`span`,{className:`radio-button__inner-circle`})})})]}),(e||t)&&(0,n.jsxs)(`div`,{className:`radio-button__content`,children:[e&&(0,n.jsx)(`label`,{htmlFor:u,className:`radio-button__label`,children:e}),t&&(0,n.jsx)(`span`,{className:`radio-button__subtext`,children:t})]})]})});S.displayName=`RadioButton`;var C={fontFamily:`"DM Sans", sans-serif`},w=t.default.forwardRef(({collapsible:e=!1,className:r=``,disabled:i,placeholder:a=`Search by whatever thing...`,onSearch:o,...s},c)=>{let[l,u]=(0,t.useState)(!e),[d,f]=(0,t.useState)(``),p=(0,t.useRef)(null);return(0,t.useEffect)(()=>{u(!e)},[e]),(0,t.useEffect)(()=>{if(!e)return;let t=e=>{p.current&&!p.current.contains(e.target)&&d===``&&u(!1)};return document.addEventListener(`mousedown`,t),()=>document.removeEventListener(`mousedown`,t)},[e,d]),(0,n.jsx)(`div`,{className:[`search-box`,e?`search-box--collapsible`:``,l?`search-box--expanded`:`search-box--collapsed`,i?`search-box--disabled`:``,r].filter(Boolean).join(` `),style:C,ref:p,children:(0,n.jsxs)(`div`,{className:`search-box__wrapper`,onClick:()=>{e&&!i&&u(!l)},children:[(0,n.jsx)(`div`,{className:`search-box__icon-container`,children:(0,n.jsxs)(`svg`,{className:`search-box__icon`,width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,n.jsx)(`path`,{d:`M11.5 6.5C11.5 9.26142 9.26142 11.5 6.5 11.5C3.73858 11.5 1.5 9.26142 1.5 6.5C1.5 3.73858 3.73858 1.5 6.5 1.5C9.26142 1.5 11.5 3.73858 11.5 6.5Z`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M10 10L14 14`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]})}),l&&(0,n.jsx)(`input`,{ref:c,type:`text`,className:`search-box__input`,placeholder:a,value:d,disabled:i,onChange:e=>{f(e.target.value),s.onChange&&s.onChange(e)},onKeyDown:e=>{e.key===`Enter`&&o&&o(d),s.onKeyDown&&s.onKeyDown(e)},autoFocus:e&&l,...s})]})})});w.displayName=`SearchBox`;var T={fontFamily:`'DM Sans', sans-serif`},E=e=>{switch(e){case`plus`:return(0,n.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 14 14`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:(0,n.jsx)(`path`,{d:`M7 2.91666V11.0833M2.91666 7H11.0833`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})});case`check`:return(0,n.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 14 14`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:(0,n.jsx)(`path`,{d:`M11.6667 3.5L5.25 9.91667L2.33333 7`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})});case`chevron-down`:return(0,n.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 14 14`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:(0,n.jsx)(`path`,{d:`M3.5 5.25L7 8.75L10.5 5.25`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})});case`arrow-right`:return(0,n.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 14 14`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:(0,n.jsx)(`path`,{d:`M2.91666 7H11.0833M11.0833 7L7.58333 3.5M11.0833 7L7.58333 10.5`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})});default:return null}},D=t.default.forwardRef(({className:e=``,variant:t=`active`,icon:r,children:i,style:a,...o},s)=>{let c=[`state-badge`,`state-badge--${t}`,e].filter(Boolean).join(` `),l=()=>{if(!r)return null;if(typeof r==`string`){let e=E(r);return e?(0,n.jsx)(`span`,{className:`state-badge__icon`,children:e}):null}return(0,n.jsx)(`span`,{className:`state-badge__icon`,children:r})};return(0,n.jsxs)(`div`,{ref:s,className:c,style:{...T,...a},...o,children:[l(),(0,n.jsx)(`div`,{className:`state-badge__label`,children:i})]})});D.displayName=`StateBadge`,e.BaseButton=d,e.Checkbox=p,e.DatePicker=g,e.PillBadge=v,e.ProgressBar=b,e.RadioButton=S,e.SearchBox=w,e.StateBadge=D});

package/dist/index.mjs

@@ -0,0 +1,842 @@
+import e, { useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/BaseButton.tsx
+var c = { fontFamily: "'DM Sans', sans-serif" }, l = e.forwardRef(({ className: e = "", variant: t = "primary", size: n = "md", isLoading: r = !1, leftIcon: i, rightIcon: a, children: l, disabled: u, style: d, ...f }, p) => {
+	let m = (e) => typeof e == "string" && !e.includes("+") ? /* @__PURE__ */ o("i", {
+		className: `fa-solid fa-${e}`,
+		"aria-hidden": "true"
+	}) : e;
+	return /* @__PURE__ */ s("button", {
+		ref: p,
+		className: [
+			"base-button",
+			`base-button--${t}`,
+			`base-button--${n}`,
+			r ? "base-button--loading" : "",
+			e
+		].filter(Boolean).join(" "),
+		disabled: u || r,
+		style: {
+			...c,
+			...d
+		},
+		...f,
+		children: [
+			r && /* @__PURE__ */ o("span", {
+				className: "base-button__spinner",
+				"aria-hidden": "true"
+			}),
+			i && !r && /* @__PURE__ */ o("span", {
+				className: "base-button__icon base-button__icon--left",
+				"aria-hidden": "true",
+				children: m(i)
+			}),
+			/* @__PURE__ */ o("span", {
+				className: "base-button__label",
+				children: l
+			}),
+			a && !r && /* @__PURE__ */ o("span", {
+				className: "base-button__icon base-button__icon--right",
+				"aria-hidden": "true",
+				children: m(a)
+			})
+		]
+	});
+});
+l.displayName = "BaseButton";
+//#endregion
+//#region src/components/Checkbox.tsx
+var u = { fontFamily: "'DM Sans', sans-serif" }, d = e.forwardRef(({ label: e = "Label", subtext: t, variant: n = "square", state: r = "default", checked: i = !1, className: a = "", onChange: c, disabled: l, readOnly: d, ...f }, p) => {
+	let m = r === "disabled" || l, h = r === "readonly" || d, g = [
+		"checkbox-container",
+		r === "focus" ? "checkbox-container--focus" : "",
+		r === "hover" ? "checkbox-container--hover" : "",
+		a
+	].filter(Boolean).join(" "), _ = [
+		"checkbox-box",
+		`checkbox-box--${n}`,
+		i ? "checkbox-box--checked" : "",
+		m ? "checkbox-box--disabled" : "",
+		h ? "checkbox-box--readonly" : ""
+	].filter(Boolean).join(" "), v = [
+		"checkbox-label",
+		m ? "checkbox-label--disabled" : "",
+		h ? "checkbox-label--readonly" : ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ s("label", {
+		className: g,
+		style: u,
+		children: [/* @__PURE__ */ s("div", {
+			className: "checkbox-row",
+			children: [
+				/* @__PURE__ */ o("input", {
+					ref: p,
+					type: "checkbox",
+					checked: i,
+					onChange: (e) => {
+						m || h || c && c(e);
+					},
+					disabled: m,
+					readOnly: h,
+					style: { display: "none" },
+					...f
+				}),
+				/* @__PURE__ */ o("div", {
+					className: _,
+					children: i && /* @__PURE__ */ o("div", {
+						className: "checkbox-icon",
+						children: /* @__PURE__ */ o("svg", {
+							width: "12",
+							height: "9",
+							viewBox: "0 0 12 9",
+							fill: "none",
+							xmlns: "http://www.w3.org/2000/svg",
+							children: /* @__PURE__ */ o("path", {
+								d: "M1 4.5L4.5 8L11 1",
+								stroke: "currentColor",
+								strokeWidth: "1.5",
+								strokeLinecap: "round",
+								strokeLinejoin: "round"
+							})
+						})
+					})
+				}),
+				/* @__PURE__ */ o("span", {
+					className: v,
+					children: e
+				})
+			]
+		}), t && /* @__PURE__ */ o("div", {
+			className: "checkbox-subtext",
+			children: t
+		})]
+	});
+});
+d.displayName = "Checkbox";
+//#endregion
+//#region src/components/DatePicker.tsx
+var f = { fontFamily: "'DM Sans', sans-serif" }, p = {
+	Calendar: (e) => /* @__PURE__ */ s("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...e,
+		children: [
+			/* @__PURE__ */ o("rect", {
+				x: "2",
+				y: "3",
+				width: "12",
+				height: "11",
+				rx: "2",
+				stroke: "currentColor",
+				strokeWidth: "1.5"
+			}),
+			/* @__PURE__ */ o("path", {
+				d: "M2 7H14",
+				stroke: "currentColor",
+				strokeWidth: "1.5"
+			}),
+			/* @__PURE__ */ o("path", {
+				d: "M5 2V4",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round"
+			}),
+			/* @__PURE__ */ o("path", {
+				d: "M11 2V4",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round"
+			})
+		]
+	}),
+	ChevronDown: (e) => /* @__PURE__ */ o("svg", {
+		width: "10",
+		height: "6",
+		viewBox: "0 0 10 6",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...e,
+		children: /* @__PURE__ */ o("path", {
+			d: "M1 1L5 5L9 1",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	}),
+	Star: (e) => /* @__PURE__ */ o("svg", {
+		width: "8",
+		height: "8",
+		viewBox: "0 0 8 8",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...e,
+		children: /* @__PURE__ */ o("path", {
+			d: "M4 0L4.8541 3.1459H8L5.44272 5L6.29682 8.1459L4 6.25L1.70318 8.1459L2.55728 5L0 3.1459H3.1459L4 0Z",
+			fill: "var(--colors-primitive-color-tokens-red-500, #E73D36)"
+		})
+	})
+}, m = e.forwardRef(({ label: c = "Label", required: l = !1, placeholder: u = "Select Date", value: d = "", onChange: m, className: h = "", mode: g = "single", state: _ = "default", ...v }, y) => {
+	let [b, x] = i(!1), [S, C] = i(typeof d == "string" ? d : ""), [w, T] = i(typeof d == "string" ? d : ""), [E, D] = i(Array.isArray(d) ? d : ["", ""]), [O, k] = i(Array.isArray(d) ? d : ["", ""]);
+	t(() => {
+		if (typeof d == "string") {
+			if (C(d), T(d), d) {
+				let e = new Date(d);
+				isNaN(e.getTime()) || (j(e.getMonth()), N(e.getFullYear()));
+			}
+		} else if (Array.isArray(d) && (D(d), k(d), d[0])) {
+			let e = new Date(d[0]);
+			isNaN(e.getTime()) || (j(e.getMonth()), N(e.getFullYear()));
+		}
+	}, [d]);
+	let [A, j] = i((/* @__PURE__ */ new Date()).getMonth()), [M, N] = i((/* @__PURE__ */ new Date()).getFullYear()), [P, F] = i(!1), [I, L] = i(!1), [R, z] = i(null), B = r(null);
+	e.useImperativeHandle(y, () => B.current);
+	let V = g === "range", H = _ === "disabled", U = _ === "readonly", W = [
+		"Mon",
+		"Tue",
+		"Wed",
+		"Thu",
+		"Fri",
+		"Sat",
+		"Sun"
+	], G = [
+		"Jan",
+		"Feb",
+		"Mar",
+		"Apr",
+		"May",
+		"Jun",
+		"Jul",
+		"Aug",
+		"Sep",
+		"Oct",
+		"Nov",
+		"Dec"
+	], K = [
+		{
+			label: "Today",
+			getValue: () => {
+				let e = (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
+				return [e, e];
+			}
+		},
+		{
+			label: "Yesterday",
+			getValue: () => {
+				let e = /* @__PURE__ */ new Date();
+				e.setDate(e.getDate() - 1);
+				let t = e.toISOString().split("T")[0];
+				return [t, t];
+			}
+		},
+		{
+			label: "Last 7 days",
+			getValue: () => {
+				let e = /* @__PURE__ */ new Date(), t = /* @__PURE__ */ new Date();
+				return t.setDate(e.getDate() - 6), [t.toISOString().split("T")[0], e.toISOString().split("T")[0]];
+			}
+		},
+		{
+			label: "Last 14 days",
+			getValue: () => {
+				let e = /* @__PURE__ */ new Date(), t = /* @__PURE__ */ new Date();
+				return t.setDate(e.getDate() - 13), [t.toISOString().split("T")[0], e.toISOString().split("T")[0]];
+			}
+		},
+		{
+			label: "Custom",
+			getValue: () => ["", ""]
+		}
+	];
+	t(() => {
+		let e = (e) => {
+			B.current && !B.current.contains(e.target) && x(!1);
+		};
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, []);
+	let q = () => {
+		H || U || (b || (T(S), k(E), F(!1), L(!1)), x(!b));
+	}, J = (e, t) => {
+		if (!t) if (V) if (!O[0] || O[0] && O[1]) k([e, ""]), z(null);
+		else {
+			let t = new Date(O[0]);
+			k(new Date(e) < t ? [e, O[0]] : [O[0], e]), z(null);
+		}
+		else T(e);
+	}, Y = (e) => {
+		let t = e.getValue();
+		if (k(t), z(null), t[0]) {
+			let e = new Date(t[0]);
+			j(e.getMonth()), N(e.getFullYear());
+		}
+	}, X = (e) => {
+		e.stopPropagation(), V ? (D(O), m && m(O)) : (C(w), m && m(w)), x(!1);
+	}, Z = (e) => {
+		e.stopPropagation(), V ? k(E) : T(S), x(!1);
+	}, Q = (e, t, n = !1) => {
+		let r = new Date(t, e, 1).getDay(), i = new Date(t, e + 1, 0).getDate(), a = new Date(t, e, 0).getDate(), c = r === 0 ? 6 : r - 1, l = [];
+		for (let n = c - 1; n >= 0; n--) {
+			let r = a - n, i = e === 0 ? 11 : e - 1, o = e === 0 ? t - 1 : t;
+			l.push({
+				day: r,
+				month: i,
+				year: o,
+				currentMonth: !1
+			});
+		}
+		for (let n = 1; n <= i; n++) l.push({
+			day: n,
+			month: e,
+			year: t,
+			currentMonth: !0
+		});
+		let u = 42 - l.length;
+		for (let n = 1; n <= u; n++) {
+			let r = e === 11 ? 0 : e + 1, i = e === 11 ? t + 1 : t;
+			l.push({
+				day: n,
+				month: r,
+				year: i,
+				currentMonth: !1
+			});
+		}
+		let d = [], f = (/* @__PURE__ */ new Date()).getFullYear();
+		for (let e = f - 10; e <= f + 10; e++) d.push(e);
+		return /* @__PURE__ */ s("div", {
+			className: "datepicker__calendar",
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "datepicker__header",
+					children: /* @__PURE__ */ s("div", {
+						className: "datepicker__header-selectors",
+						children: [/* @__PURE__ */ s("div", {
+							className: "datepicker__header-select",
+							onClick: (e) => {
+								e.stopPropagation(), n || (F(!P), L(!1));
+							},
+							style: { position: "relative" },
+							children: [
+								G[e],
+								/* @__PURE__ */ o("span", {
+									className: "datepicker__header-icon",
+									children: /* @__PURE__ */ o(p.ChevronDown, {})
+								}),
+								!n && P && /* @__PURE__ */ o("div", {
+									className: "datepicker__select-dropdown",
+									style: {
+										position: "absolute",
+										top: "100%",
+										left: 0,
+										width: "100%",
+										maxHeight: "200px",
+										overflowY: "auto",
+										background: "var(--Colors-Functional-Bkg-Bkg_Default, white)",
+										border: "1px solid var(--Colors-Functional-Border-Border_Default, #C3C1B5)",
+										borderRadius: "8px",
+										zIndex: 10,
+										boxShadow: "0 4px 12px rgba(0,0,0,0.1)"
+									},
+									children: G.map((t, n) => /* @__PURE__ */ o("div", {
+										className: "datepicker__select-option",
+										style: {
+											padding: "8px 12px",
+											cursor: "pointer",
+											background: e === n ? "var(--Colors-Functional-Bkg-Bkg_Default, #F6F6F3)" : "transparent",
+											fontSize: "14px"
+										},
+										onClick: (e) => {
+											e.stopPropagation(), j(n), F(!1);
+										},
+										children: t
+									}, t))
+								})
+							]
+						}), /* @__PURE__ */ s("div", {
+							className: "datepicker__header-select",
+							onClick: (e) => {
+								e.stopPropagation(), n || (L(!I), F(!1));
+							},
+							style: { position: "relative" },
+							children: [
+								t,
+								/* @__PURE__ */ o("span", {
+									className: "datepicker__header-icon",
+									children: /* @__PURE__ */ o(p.ChevronDown, {})
+								}),
+								!n && I && /* @__PURE__ */ o("div", {
+									className: "datepicker__select-dropdown",
+									style: {
+										position: "absolute",
+										top: "100%",
+										left: 0,
+										width: "100%",
+										maxHeight: "200px",
+										overflowY: "auto",
+										background: "var(--Colors-Functional-Bkg-Bkg_Default, white)",
+										border: "1px solid var(--Colors-Functional-Border-Border_Default, #C3C1B5)",
+										borderRadius: "8px",
+										zIndex: 10,
+										boxShadow: "0 4px 12px rgba(0,0,0,0.1)"
+									},
+									children: d.map((e) => /* @__PURE__ */ o("div", {
+										className: "datepicker__select-option",
+										style: {
+											padding: "8px 12px",
+											cursor: "pointer",
+											background: t === e ? "var(--Colors-Functional-Bkg-Bkg_Default, #F6F6F3)" : "transparent",
+											fontSize: "14px"
+										},
+										onClick: (t) => {
+											t.stopPropagation(), N(e), L(!1);
+										},
+										children: e
+									}, e))
+								})
+							]
+						})]
+					})
+				}),
+				!V && /* @__PURE__ */ o("div", { className: "datepicker__divider" }),
+				/* @__PURE__ */ o("div", {
+					className: "datepicker__weekdays",
+					children: W.map((e) => /* @__PURE__ */ o("div", {
+						className: "datepicker__weekday",
+						children: e
+					}, e))
+				}),
+				/* @__PURE__ */ o("div", {
+					className: "datepicker__days",
+					onMouseLeave: () => z(null),
+					children: l.map((e, t) => {
+						let n = `${e.year}-${(e.month + 1).toString().padStart(2, "0")}-${e.day.toString().padStart(2, "0")}`, r = V ? O[0] === n || O[1] === n : w === n, i = !1;
+						if (V && O[0]) {
+							let e = new Date(O[0]), t = O[1] ? new Date(O[1]) : R ? new Date(R) : null, r = new Date(n);
+							t && (i = r > (e < t ? e : t) && r < (e < t ? t : e));
+						}
+						return /* @__PURE__ */ o("div", {
+							className: `datepicker__day ${e.currentMonth ? "" : "datepicker__day--disabled"} ${r ? "datepicker__day--selected" : ""} ${i ? "datepicker__day--in-range" : ""}`,
+							onClick: (t) => {
+								t.stopPropagation(), J(n, !e.currentMonth);
+							},
+							onMouseEnter: () => {
+								V && O[0] && !O[1] && z(n);
+							},
+							children: /* @__PURE__ */ o("div", {
+								className: "datepicker__day-text",
+								children: e.day
+							})
+						}, t);
+					})
+				})
+			]
+		});
+	}, $ = n(() => V ? E[0] && E[1] ? `${E[0]} - ${E[1]}` : E[0] ? `${E[0]} - ...` : "" : S, [
+		V,
+		E,
+		S
+	]), ee = [
+		"datepicker",
+		V ? "datepicker--range" : "",
+		h
+	].filter(Boolean).join(" "), te = [
+		"datepicker__input-wrapper",
+		b ? "datepicker__input-wrapper--focus" : "",
+		`datepicker__input-wrapper--${_}`,
+		H ? "datepicker__input-wrapper--disabled" : "",
+		U ? "datepicker__input-wrapper--readonly" : ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ s("div", {
+		className: ee,
+		ref: B,
+		style: f,
+		...v,
+		children: [
+			c && /* @__PURE__ */ s("div", {
+				className: "datepicker__label-row",
+				children: [/* @__PURE__ */ o("span", {
+					className: "datepicker__label",
+					children: c
+				}), l && /* @__PURE__ */ o("span", {
+					className: "datepicker__required-star",
+					children: /* @__PURE__ */ o(p.Star, {})
+				})]
+			}),
+			/* @__PURE__ */ s("div", {
+				className: te,
+				onClick: q,
+				children: [$ ? /* @__PURE__ */ o("span", {
+					className: "datepicker__value",
+					children: $
+				}) : /* @__PURE__ */ o("span", {
+					className: "datepicker__placeholder",
+					children: u
+				}), /* @__PURE__ */ o("span", {
+					className: "datepicker__icon-wrapper",
+					children: /* @__PURE__ */ o(p.Calendar, {})
+				})]
+			}),
+			b && /* @__PURE__ */ o("div", {
+				className: `datepicker__dropdown ${V ? "datepicker__dropdown--range" : ""}`,
+				onClick: (e) => e.stopPropagation(),
+				children: V ? /* @__PURE__ */ s("div", {
+					style: {
+						display: "flex",
+						flex: 1
+					},
+					children: [
+						/* @__PURE__ */ o("div", {
+							className: "datepicker__presets",
+							children: K.map((e) => /* @__PURE__ */ o("div", {
+								className: `datepicker__preset ${JSON.stringify(O) === JSON.stringify(e.getValue()) ? "datepicker__preset--active" : ""}`,
+								onClick: () => Y(e),
+								children: e.label
+							}, e.label))
+						}),
+						/* @__PURE__ */ o("div", { className: "datepicker__vertical-divider" }),
+						/* @__PURE__ */ s("div", {
+							style: {
+								display: "flex",
+								flexDirection: "column",
+								flex: 1
+							},
+							children: [/* @__PURE__ */ s("div", {
+								className: "datepicker__calendar-container",
+								children: [
+									Q(A, M, !1),
+									/* @__PURE__ */ o("div", { className: "datepicker__vertical-divider datepicker__vertical-divider--calendar" }),
+									Q(A === 11 ? 0 : A + 1, A === 11 ? M + 1 : M, !0)
+								]
+							}), /* @__PURE__ */ s("div", {
+								className: "datepicker__footer",
+								children: [/* @__PURE__ */ o("div", { className: "datepicker__divider" }), /* @__PURE__ */ s("div", {
+									className: "datepicker__actions",
+									children: [/* @__PURE__ */ o("button", {
+										className: "datepicker__button datepicker__button--cancel",
+										onClick: Z,
+										children: "CANCEL"
+									}), /* @__PURE__ */ o("button", {
+										className: "datepicker__button datepicker__button--apply",
+										onClick: X,
+										disabled: !O[0] || !O[1],
+										children: "APPLY"
+									})]
+								})]
+							})]
+						})
+					]
+				}) : /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", {
+					className: "datepicker__dropdown-main",
+					children: /* @__PURE__ */ o("div", {
+						className: "datepicker__calendar-container",
+						children: Q(A, M, !1)
+					})
+				}), /* @__PURE__ */ s("div", {
+					className: "datepicker__footer",
+					children: [/* @__PURE__ */ o("hr", {}), /* @__PURE__ */ s("div", {
+						className: "datepicker__actions",
+						children: [/* @__PURE__ */ o("button", {
+							className: "datepicker__button datepicker__button--cancel",
+							onClick: Z,
+							children: "CANCEL"
+						}), /* @__PURE__ */ o("button", {
+							className: "datepicker__button datepicker__button--apply",
+							onClick: X,
+							disabled: !w,
+							children: "APPLY"
+						})]
+					})]
+				})] })
+			})
+		]
+	});
+});
+m.displayName = "DatePicker";
+//#endregion
+//#region src/components/PillBadge.tsx
+var h = { fontFamily: "'DM Sans', sans-serif" }, g = e.forwardRef(({ className: e = "", variant: t = "blue", size: n = "md", stacked: r = !1, subtext: i, children: a, style: c, ...l }, u) => {
+	let d = [
+		"pill-badge",
+		`pill-badge--${t}`,
+		r ? "pill-badge--stacked" : `pill-badge--${n === "lg" ? "md" : n}`,
+		e
+	].filter(Boolean).join(" "), f = n === "lg" ? "pill-badge__title--lg" : "pill-badge__title--md";
+	return /* @__PURE__ */ s("div", {
+		ref: u,
+		className: d,
+		style: {
+			...h,
+			...c
+		},
+		...l,
+		children: [/* @__PURE__ */ o("div", {
+			className: `pill-badge__title ${r ? f : ""}`,
+			children: a
+		}), r && i && /* @__PURE__ */ o("div", {
+			className: "pill-badge__subtext",
+			children: i
+		})]
+	});
+});
+g.displayName = "PillBadge";
+//#endregion
+//#region src/components/ProgressBar.tsx
+var _ = { fontFamily: "'DM Sans', sans-serif" }, v = e.forwardRef(({ label: e, percentage: t = 0, usedText: n, remainingText: r, variant: i = "default", size: a = "sm", withCard: c = !1, width: l, className: u = "", style: d, ...f }, p) => {
+	let m = Math.max(0, Math.min(100, t)), h = [
+		"progressbar",
+		c ? "progressbar--card" : "",
+		u
+	].filter(Boolean).join(" "), g = ["progressbar__track", `progressbar__track--${a}`].join(" "), v = ["progressbar__fill", `progressbar__fill--${i}`].join(" ");
+	return /* @__PURE__ */ s("div", {
+		ref: p,
+		className: h,
+		style: {
+			..._,
+			width: l,
+			...d
+		},
+		...f,
+		children: [
+			(e || t !== void 0) && /* @__PURE__ */ s("div", {
+				className: "progressbar__header",
+				children: [e && /* @__PURE__ */ o("span", {
+					className: "progressbar__label",
+					children: e
+				}), t !== void 0 && /* @__PURE__ */ s("span", {
+					className: "progressbar__percentage",
+					children: [m, "%"]
+				})]
+			}),
+			/* @__PURE__ */ o("div", {
+				className: g,
+				children: /* @__PURE__ */ o("div", {
+					className: v,
+					style: { width: `${m}%` }
+				})
+			}),
+			(n || r) && /* @__PURE__ */ s("div", {
+				className: "progressbar__footer",
+				children: [n && /* @__PURE__ */ o("span", {
+					className: "progressbar__used",
+					children: n
+				}), r && /* @__PURE__ */ o("span", {
+					className: "progressbar__remaining",
+					children: r
+				})]
+			})
+		]
+	});
+});
+v.displayName = "ProgressBar";
+//#endregion
+//#region src/components/RadioButton.tsx
+var y = { fontFamily: "\"DM Sans\", sans-serif" }, b = e.forwardRef(({ label: e, subtext: t, checked: n, disabled: r, readOnly: i = !1, className: a = "", id: c, ...l }, u) => {
+	let d = c || `radio-${Math.random().toString(36).substring(2, 9)}`;
+	return /* @__PURE__ */ s("div", {
+		className: [
+			"radio-button",
+			n ? "radio-button--checked" : "",
+			r ? "radio-button--disabled" : "",
+			i ? "radio-button--readonly" : "",
+			a
+		].filter(Boolean).join(" "),
+		style: y,
+		children: [/* @__PURE__ */ s("div", {
+			className: "radio-button__wrapper",
+			children: [/* @__PURE__ */ o("input", {
+				ref: u,
+				type: "radio",
+				id: d,
+				className: "radio-button__input",
+				checked: n,
+				disabled: r || i,
+				...l
+			}), /* @__PURE__ */ o("label", {
+				htmlFor: d,
+				className: "radio-button__visual",
+				children: /* @__PURE__ */ o("span", {
+					className: "radio-button__outer-circle",
+					children: n && /* @__PURE__ */ o("span", { className: "radio-button__inner-circle" })
+				})
+			})]
+		}), (e || t) && /* @__PURE__ */ s("div", {
+			className: "radio-button__content",
+			children: [e && /* @__PURE__ */ o("label", {
+				htmlFor: d,
+				className: "radio-button__label",
+				children: e
+			}), t && /* @__PURE__ */ o("span", {
+				className: "radio-button__subtext",
+				children: t
+			})]
+		})]
+	});
+});
+b.displayName = "RadioButton";
+//#endregion
+//#region src/components/SearchBox.tsx
+var x = { fontFamily: "\"DM Sans\", sans-serif" }, S = e.forwardRef(({ collapsible: e = !1, className: n = "", disabled: a, placeholder: c = "Search by whatever thing...", onSearch: l, ...u }, d) => {
+	let [f, p] = i(!e), [m, h] = i(""), g = r(null);
+	return t(() => {
+		p(!e);
+	}, [e]), t(() => {
+		if (!e) return;
+		let t = (e) => {
+			g.current && !g.current.contains(e.target) && m === "" && p(!1);
+		};
+		return document.addEventListener("mousedown", t), () => document.removeEventListener("mousedown", t);
+	}, [e, m]), /* @__PURE__ */ o("div", {
+		className: [
+			"search-box",
+			e ? "search-box--collapsible" : "",
+			f ? "search-box--expanded" : "search-box--collapsed",
+			a ? "search-box--disabled" : "",
+			n
+		].filter(Boolean).join(" "),
+		style: x,
+		ref: g,
+		children: /* @__PURE__ */ s("div", {
+			className: "search-box__wrapper",
+			onClick: () => {
+				e && !a && p(!f);
+			},
+			children: [/* @__PURE__ */ o("div", {
+				className: "search-box__icon-container",
+				children: /* @__PURE__ */ s("svg", {
+					className: "search-box__icon",
+					width: "16",
+					height: "16",
+					viewBox: "0 0 16 16",
+					fill: "none",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: [/* @__PURE__ */ o("path", {
+						d: "M11.5 6.5C11.5 9.26142 9.26142 11.5 6.5 11.5C3.73858 11.5 1.5 9.26142 1.5 6.5C1.5 3.73858 3.73858 1.5 6.5 1.5C9.26142 1.5 11.5 3.73858 11.5 6.5Z",
+						stroke: "currentColor",
+						strokeWidth: "1.5"
+					}), /* @__PURE__ */ o("path", {
+						d: "M10 10L14 14",
+						stroke: "currentColor",
+						strokeWidth: "1.5",
+						strokeLinecap: "round"
+					})]
+				})
+			}), f && /* @__PURE__ */ o("input", {
+				ref: d,
+				type: "text",
+				className: "search-box__input",
+				placeholder: c,
+				value: m,
+				disabled: a,
+				onChange: (e) => {
+					h(e.target.value), u.onChange && u.onChange(e);
+				},
+				onKeyDown: (e) => {
+					e.key === "Enter" && l && l(m), u.onKeyDown && u.onKeyDown(e);
+				},
+				autoFocus: e && f,
+				...u
+			})]
+		})
+	});
+});
+S.displayName = "SearchBox";
+//#endregion
+//#region src/components/StateBadge.tsx
+var C = { fontFamily: "'DM Sans', sans-serif" }, w = (e) => {
+	switch (e) {
+		case "plus": return /* @__PURE__ */ o("svg", {
+			width: "12",
+			height: "12",
+			viewBox: "0 0 14 14",
+			fill: "none",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ o("path", {
+				d: "M7 2.91666V11.0833M2.91666 7H11.0833",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		});
+		case "check": return /* @__PURE__ */ o("svg", {
+			width: "12",
+			height: "12",
+			viewBox: "0 0 14 14",
+			fill: "none",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ o("path", {
+				d: "M11.6667 3.5L5.25 9.91667L2.33333 7",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		});
+		case "chevron-down": return /* @__PURE__ */ o("svg", {
+			width: "12",
+			height: "12",
+			viewBox: "0 0 14 14",
+			fill: "none",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ o("path", {
+				d: "M3.5 5.25L7 8.75L10.5 5.25",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		});
+		case "arrow-right": return /* @__PURE__ */ o("svg", {
+			width: "12",
+			height: "12",
+			viewBox: "0 0 14 14",
+			fill: "none",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ o("path", {
+				d: "M2.91666 7H11.0833M11.0833 7L7.58333 3.5M11.0833 7L7.58333 10.5",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		});
+		default: return null;
+	}
+}, T = e.forwardRef(({ className: e = "", variant: t = "active", icon: n, children: r, style: i, ...a }, c) => {
+	let l = [
+		"state-badge",
+		`state-badge--${t}`,
+		e
+	].filter(Boolean).join(" "), u = () => {
+		if (!n) return null;
+		if (typeof n == "string") {
+			let e = w(n);
+			return e ? /* @__PURE__ */ o("span", {
+				className: "state-badge__icon",
+				children: e
+			}) : null;
+		}
+		return /* @__PURE__ */ o("span", {
+			className: "state-badge__icon",
+			children: n
+		});
+	};
+	return /* @__PURE__ */ s("div", {
+		ref: c,
+		className: l,
+		style: {
+			...C,
+			...i
+		},
+		...a,
+		children: [u(), /* @__PURE__ */ o("div", {
+			className: "state-badge__label",
+			children: r
+		})]
+	});
+});
+T.displayName = "StateBadge";
+//#endregion
+export { l as BaseButton, d as Checkbox, m as DatePicker, g as PillBadge, v as ProgressBar, b as RadioButton, S as SearchBox, T as StateBadge };

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "fic-designsystem-components",
+  "version": "1.0.0",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./theme.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@radix-ui/react-slot": "^1.2.4",
+    "@tailwindcss/vite": "^4.2.1",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.577.0",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "tailwind-merge": "^3.5.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.4",
+    "@types/node": "^24.12.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.0",
+    "ajv": "^8.18.0",
+    "autoprefixer": "^10.4.27",
+    "eslint": "^9.39.4",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
+    "glob": "^13.0.6",
+    "globals": "^17.4.0",
+    "postcss": "^8.5.8",
+    "tailwindcss": "^4.2.1",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.56.1",
+    "vite": "^8.0.0",
+    "vite-plugin-dts": "^4.5.4"
+  }
+}