@divayth/brick-ui 0.0.1 → 0.0.2

package/README.md

@@ -15,13 +15,13 @@ npm run storybook
 ## Usage
 
 ```tsx
-import { Button, Flex, Text } from '@divayth/brick-ui';
-import '@divayth/brick-ui/styles.css';
+import { Button, Flex, Text } from "@divayth/brick-ui";
+import "@divayth/brick-ui/styles.css";
 
 <Flex alignItems="center">
   <Text weight="medium">Brick UI</Text>
   <Button>Continue</Button>
-</Flex>
+</Flex>;
 ```
 
 The package ships compiled CSS; consumers do not need Tailwind.

package/dist/index.js

@@ -1,21 +1,27 @@
 /* empty css           */
-import { Button as e } from "./ui/Button/Button.js";
-import { Card as x } from "./ui/Card/Card.js";
-import { Chip as f } from "./ui/Chip/Chip.js";
-import { CircularLoading as a } from "./ui/CircularLoading/CircularLoading.js";
-import { Flex as l } from "./ui/Flex/Flex.js";
-import { IconButton as B } from "./ui/IconButton/IconButton.js";
-import { ProgressBar as c } from "./ui/ProgressBar/ProgressBar.js";
-import { Skeleton as g } from "./ui/Skeleton/Skeleton.js";
-import { Text as h } from "./ui/Text/Text.js";
+import { Accordion as e } from "./ui/Accordion/Accordion.js";
+import { Alert as x } from "./ui/Alert/Alert.js";
+import { Button as f } from "./ui/Button/Button.js";
+import { Card as n } from "./ui/Card/Card.js";
+import { Chip as c } from "./ui/Chip/Chip.js";
+import { CircularLoading as l } from "./ui/CircularLoading/CircularLoading.js";
+import { Flex as B } from "./ui/Flex/Flex.js";
+import { Grid as g } from "./ui/Grid/Grid.js";
+import { IconButton as A } from "./ui/IconButton/IconButton.js";
+import { ProgressBar as k } from "./ui/ProgressBar/ProgressBar.js";
+import { Skeleton as G } from "./ui/Skeleton/Skeleton.js";
+import { Text as L } from "./ui/Text/Text.js";
 export {
-  e as Button,
-  x as Card,
-  f as Chip,
-  a as CircularLoading,
-  l as Flex,
-  B as IconButton,
-  c as ProgressBar,
-  g as Skeleton,
-  h as Text
+  e as Accordion,
+  x as Alert,
+  f as Button,
+  n as Card,
+  c as Chip,
+  l as CircularLoading,
+  B as Flex,
+  g as Grid,
+  A as IconButton,
+  k as ProgressBar,
+  G as Skeleton,
+  L as Text
 };

package/dist/styles.css

@@ -1 +1 @@
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-font-weight:initial}}}@layer theme{:root,:host{--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-thin:100;--font-weight-extralight:200;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--color-primary-1:#3d63dd;--color-primary-2:#3d63dd66;--color-primary-3:#edf2fe;--color-primary-hover:#3657c3;--color-primary-text-inverted:#fdfffc;--color-error-1:#d22829;--color-error-2:#d2282947;--color-error-3:#ffebe9;--color-info-1:#4e79eb;--color-info-2:#4e79eb66;--color-info-3:#eef3fd;--color-success-1:#1bc455;--color-success-2:#1bc45566;--color-success-3:#e8faf0;--color-warning-1:#e39500;--color-warning-2:#e3950066;--color-warning-3:#fff5e6;--color-gray-1:#707070;--color-gray-2:#e0e0e0;--color-gray-3:#f5f5f5;--color-background-primary:#fff}}@layer base,components;@layer utilities{.block{display:block}.flex{display:flex}.table{display:table}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-3{height:calc(var(--spacing) * 3)}.h-5{height:calc(var(--spacing) * 5)}.h-8{height:calc(var(--spacing) * 8)}.h-10{height:calc(var(--spacing) * 10)}.w-1\/2{width:50%}.w-2{width:calc(var(--spacing) * 2)}.w-3{width:calc(var(--spacing) * 3)}.w-5{width:calc(var(--spacing) * 5)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-full{width:100%}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-0{gap:0}.gap-1{gap:var(--spacing)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-xs{border-radius:var(--radius-xs)}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-3{border-style:var(--tw-border-style);border-width:3px}.bg-background-primary{background-color:var(--color-background-primary)}.bg-error-1{background-color:var(--color-error-1)}.bg-gray-2{background-color:var(--color-gray-2)}.bg-primary-1{background-color:var(--color-primary-1)}.p-4{padding:calc(var(--spacing) * 4)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-2{padding-block:calc(var(--spacing) * 2)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-extrabold{--tw-font-weight:var(--font-weight-extrabold);font-weight:var(--font-weight-extrabold)}.font-extralight{--tw-font-weight:var(--font-weight-extralight);font-weight:var(--font-weight-extralight)}.font-light{--tw-font-weight:var(--font-weight-light);font-weight:var(--font-weight-light)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.font-thin{--tw-font-weight:var(--font-weight-thin);font-weight:var(--font-weight-thin)}.text-gray-1{color:var(--color-gray-1)}.text-primary-text-inverted{color:var(--color-primary-text-inverted)}}:root{--height-xs:1.5rem;--height-sm:2rem;--height-md:2.5rem;--height-lg:3rem;--height-xl:3.5rem;--padding-xs:.5rem;--padding-sm:.75rem;--padding-md:1rem;--padding-lg:1.25rem;--padding-xl:1.5rem}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}._root_19xvf_1{position:relative;box-sizing:border-box;font:inherit;display:flex;align-items:center;justify-content:center;border-radius:.5rem;cursor:pointer;transition:.3s;border:none}._xs_19xvf_14{height:var(--height-xs);padding:0 var(--padding-xs)}._sm_19xvf_19{height:var(--height-sm);padding:0 var(--padding-sm)}._md_19xvf_24{height:var(--height-md);padding:0 var(--padding-md)}._lg_19xvf_29{height:var(--height-lg);padding:0 var(--padding-lg)}._xl_19xvf_34{height:var(--height-xl);padding:0 var(--padding-xl)}._filled_19xvf_39{background:var(--color-primary-1);color:var(--color-primary-text-inverted)}._filled_19xvf_39:hover{text-decoration:none;background:var(--color-primary-hover);color:var(--color-primary-text-inverted)}._outlined_19xvf_50{background:transparent;color:var(--color-primary-1);border:1px solid var(--color-primary-1)}._outlined_19xvf_50:hover{text-decoration:none;background:var(--color-primary-3)}._transparent_19xvf_61{color:var(--color-primary-1);background:transparent}._transparent_19xvf_61:hover{background:var(--color-primary-3);text-decoration:none}._filled_19xvf_39._error_19xvf_71{background:var(--color-error-1)}._filled_19xvf_39._error_19xvf_71:hover{background:color-mix(in srgb,var(--color-error-1) 85%,black)}._outlined_19xvf_50._error_19xvf_71{color:var(--color-error-1);border-color:var(--color-error-1)}._outlined_19xvf_50._error_19xvf_71:hover{background:color-mix(in srgb,var(--color-error-1) 10%,transparent)}._transparent_19xvf_61._error_19xvf_71{color:var(--color-error-1)}._transparent_19xvf_61._error_19xvf_71:hover{background:color-mix(in srgb,var(--color-error-1) 10%,transparent)}._disabled_19xvf_96{pointer-events:none;color:var(--color-gray-1);background:var(--color-gray-2);border-color:var(--color-gray-2)}._disabled_19xvf_96:hover{cursor:auto;background:var(--color-gray-2)}._error_19xvf_71._disabled_19xvf_96,._error_19xvf_71._disabled_19xvf_96:hover{color:var(--color-gray-1);background:var(--color-gray-2);border-color:var(--color-gray-2)}._loading_19xvf_115{position:absolute}._spinner_19xvf_116{width:1.25rem;height:1.25rem;box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:_spin_19xvf_116 .8s linear infinite}._root_19xvf_1:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:3px}@keyframes _spin_19xvf_116{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){._spinner_19xvf_116{animation:none}._root_19xvf_1{transition:none}}@layer components{._root_1cq4m_2{box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;gap:.5rem;border:1px solid var(--color-gray-2);transition:all .2s ease-in-out}._hover_1cq4m_12:hover{background:var(--color-gray-3);cursor:pointer}._root_1cq4m_2:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:2px}@media(prefers-reduced-motion:reduce){._root_1cq4m_2{transition:none}}}._root_11js1_1{padding:.15rem 1rem;font-weight:500}._filled_11js1_6._primary_11js1_6{color:var(--color-primary-1);background:var(--color-primary-3);border:1px solid var(--color-primary-3)}._filled_11js1_6._info_11js1_12{color:var(--color-info-1);background:var(--color-info-3);border:1px solid var(--color-info-3)}._filled_11js1_6._error_11js1_18{color:var(--color-error-1);background:var(--color-error-3);border:1px solid var(--color-error-3)}._filled_11js1_6._success_11js1_24{color:var(--color-success-1);background:var(--color-success-3);border:1px solid var(--color-success-3)}._filled_11js1_6._warning_11js1_30{color:var(--color-warning-1);background:var(--color-warning-3);border:1px solid var(--color-warning-3)}._filled_11js1_6._secondary_11js1_36{color:var(--color-gray-1);background:var(--color-gray-3);border:1px solid var(--color-gray-3)}._outlined_11js1_42._primary_11js1_6{color:var(--color-primary-1);border:1px solid var(--color-primary-2)}._outlined_11js1_42._info_11js1_12{color:var(--color-info-1);border:1px solid var(--color-info-2)}._outlined_11js1_42._error_11js1_18{color:var(--color-error-1);border:1px solid var(--color-error-2)}._outlined_11js1_42._success_11js1_24{color:var(--color-success-1);border:1px solid var(--color-success-2)}._outlined_11js1_42._warning_11js1_30{color:var(--color-warning-1);border:1px solid var(--color-warning-2)}._outlined_11js1_42._secondary_11js1_36{color:var(--color-gray-1);border:1px solid var(--color-gray-2)}@layer components{._root_qpt33_2{box-sizing:border-box;flex-shrink:0;border-style:solid;border-color:var(--color-gray-3);border-top-color:var(--color-primary-1);border-radius:50%;animation:_spin_qpt33_1 1s linear infinite}._container_qpt33_11{display:flex;align-items:center;justify-content:center;flex:1;width:100%;height:100%}@keyframes _spin_qpt33_1{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){._root_qpt33_2{animation:none}}}@layer components{._root_1pw4c_2{position:relative;padding:.25rem;font:inherit;font-size:calc(var(--size) * .6);line-height:1;box-sizing:border-box;flex-shrink:0;transition:.3s;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;border:none;background:transparent;vertical-align:middle}._xs_1pw4c_21{--size: var(--height-xs);--stroke-width: 1.5}._sm_1pw4c_26{--size: var(--height-sm);--stroke-width: 1.75}._md_1pw4c_31{--size: var(--height-md);--stroke-width: 2}._lg_1pw4c_36{--size: var(--height-lg);--stroke-width: 2.25}._xl_1pw4c_41{--size: var(--height-xl);--stroke-width: 2.5}._primary_1pw4c_46{color:var(--color-primary-1)}._primary_1pw4c_46:hover{background:var(--color-primary-3)}._secondary_1pw4c_54{color:var(--color-gray-1)}._secondary_1pw4c_54:hover{color:var(--color-gray-1);background:var(--color-gray-3)}._danger_1pw4c_63{color:var(--color-error-1)}._danger_1pw4c_63:hover{color:var(--color-error-1);background:var(--color-error-3)}._disabled_1pw4c_72{color:var(--color-gray-1);pointer-events:none}._content_1pw4c_77{width:1em;height:1em;display:inline-flex;align-items:center;justify-content:center}._loading_1pw4c_85{position:absolute}._content_1pw4c_77 svg{width:1em;height:1em;flex-shrink:0;stroke-width:var(--stroke-width)}._content_1pw4c_77 svg *{vector-effect:non-scaling-stroke}._root_1pw4c_2:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:2px}@media(prefers-reduced-motion:reduce){._root_1pw4c_2{transition:none}}}._root_1rkuv_1{flex-shrink:0;background:var(--color-gray-3);border-radius:4px;animation:_pulse_1rkuv_1 1.5s ease-in-out infinite}@keyframes _pulse_1rkuv_1{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}@media(prefers-reduced-motion:reduce){._root_1rkuv_1{animation:none}}
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-font-weight:initial}}}@layer theme{:root,:host{--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-thin:100;--font-weight-extralight:200;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--color-primary-1:#3d63dd;--color-primary-2:#3d63dd66;--color-primary-3:#edf2fe;--color-primary-hover:#3657c3;--color-primary-text-inverted:#fdfffc;--color-error-1:#d22829;--color-error-2:#d2282947;--color-error-3:#ffebe9;--color-info-1:#4e79eb;--color-info-2:#4e79eb66;--color-info-3:#eef3fd;--color-success-1:#1bc455;--color-success-2:#1bc45566;--color-success-3:#e8faf0;--color-warning-1:#e39500;--color-warning-2:#e3950066;--color-warning-3:#fff5e6;--color-gray-1:#707070;--color-gray-2:#e0e0e0;--color-gray-3:#f5f5f5;--color-background-primary:#fff}}@layer base,components;@layer utilities{.block{display:block}.flex{display:flex}.table{display:table}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-3{height:calc(var(--spacing) * 3)}.h-5{height:calc(var(--spacing) * 5)}.h-8{height:calc(var(--spacing) * 8)}.h-10{height:calc(var(--spacing) * 10)}.w-1\/2{width:50%}.w-2{width:calc(var(--spacing) * 2)}.w-3{width:calc(var(--spacing) * 3)}.w-5{width:calc(var(--spacing) * 5)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-full{width:100%}.grow{flex-grow:1}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-0{gap:0}.gap-1{gap:var(--spacing)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-xs{border-radius:var(--radius-xs)}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-3{border-style:var(--tw-border-style);border-width:3px}.border-transparent{border-color:#0000}.bg-background-primary{background-color:var(--color-background-primary)}.bg-error-1{background-color:var(--color-error-1)}.bg-error-3{background-color:var(--color-error-3)}.bg-gray-2{background-color:var(--color-gray-2)}.bg-primary-1{background-color:var(--color-primary-1)}.bg-primary-3{background-color:var(--color-primary-3)}.p-4{padding:calc(var(--spacing) * 4)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-2{padding-block:calc(var(--spacing) * 2)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-extrabold{--tw-font-weight:var(--font-weight-extrabold);font-weight:var(--font-weight-extrabold)}.font-extralight{--tw-font-weight:var(--font-weight-extralight);font-weight:var(--font-weight-extralight)}.font-light{--tw-font-weight:var(--font-weight-light);font-weight:var(--font-weight-light)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.font-thin{--tw-font-weight:var(--font-weight-thin);font-weight:var(--font-weight-thin)}.text-error-1{color:var(--color-error-1)}.text-gray-1{color:var(--color-gray-1)}.text-primary-1{color:var(--color-primary-1)}.text-primary-text-inverted{color:var(--color-primary-text-inverted)}}:root{--height-xs:1.5rem;--height-sm:2rem;--height-md:2.5rem;--height-lg:3rem;--height-xl:3.5rem;--padding-xs:.5rem;--padding-sm:.75rem;--padding-md:1rem;--padding-lg:1.25rem;--padding-xl:1.5rem}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@layer components{@supports (interpolate-size: allow-keywords) and selector(::details-content){._root_oaq11_3{interpolate-size:allow-keywords}._root_oaq11_3::details-content{block-size:0;opacity:0;overflow:clip;transition:block-size .2s ease,opacity .2s ease,content-visibility .2s allow-discrete}._root_oaq11_3[open]::details-content{block-size:auto;opacity:1}}._trigger_oaq11_23{cursor:pointer;list-style:none;border-radius:.25rem}._trigger_oaq11_23::-webkit-details-marker{display:none}._trigger_oaq11_23:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:2px}._icon_oaq11_38{color:var(--color-gray-1);transition:transform .2s;margin-right:.5rem;flex-shrink:0}._trigger_oaq11_23:where(details[open]>summary) ._icon_oaq11_38{transform:rotate(180deg)}._content_oaq11_49{width:100%;padding-top:1rem}@media(prefers-reduced-motion:reduce){._icon_oaq11_38{transition:none}._root_oaq11_3::details-content{transition:none}}}@layer components{._root_1cq4m_2{box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;gap:.5rem;border:1px solid var(--color-gray-2);transition:all .2s ease-in-out}._hover_1cq4m_12:hover{background:var(--color-gray-3);cursor:pointer}._root_1cq4m_2:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:2px}@media(prefers-reduced-motion:reduce){._root_1cq4m_2{transition:none}}}._root_19xvf_1{position:relative;box-sizing:border-box;font:inherit;display:flex;align-items:center;justify-content:center;border-radius:.5rem;cursor:pointer;transition:.3s;border:none}._xs_19xvf_14{height:var(--height-xs);padding:0 var(--padding-xs)}._sm_19xvf_19{height:var(--height-sm);padding:0 var(--padding-sm)}._md_19xvf_24{height:var(--height-md);padding:0 var(--padding-md)}._lg_19xvf_29{height:var(--height-lg);padding:0 var(--padding-lg)}._xl_19xvf_34{height:var(--height-xl);padding:0 var(--padding-xl)}._filled_19xvf_39{background:var(--color-primary-1);color:var(--color-primary-text-inverted)}._filled_19xvf_39:hover{text-decoration:none;background:var(--color-primary-hover);color:var(--color-primary-text-inverted)}._outlined_19xvf_50{background:transparent;color:var(--color-primary-1);border:1px solid var(--color-primary-1)}._outlined_19xvf_50:hover{text-decoration:none;background:var(--color-primary-3)}._transparent_19xvf_61{color:var(--color-primary-1);background:transparent}._transparent_19xvf_61:hover{background:var(--color-primary-3);text-decoration:none}._filled_19xvf_39._error_19xvf_71{background:var(--color-error-1)}._filled_19xvf_39._error_19xvf_71:hover{background:color-mix(in srgb,var(--color-error-1) 85%,black)}._outlined_19xvf_50._error_19xvf_71{color:var(--color-error-1);border-color:var(--color-error-1)}._outlined_19xvf_50._error_19xvf_71:hover{background:color-mix(in srgb,var(--color-error-1) 10%,transparent)}._transparent_19xvf_61._error_19xvf_71{color:var(--color-error-1)}._transparent_19xvf_61._error_19xvf_71:hover{background:color-mix(in srgb,var(--color-error-1) 10%,transparent)}._disabled_19xvf_96{pointer-events:none;color:var(--color-gray-1);background:var(--color-gray-2);border-color:var(--color-gray-2)}._disabled_19xvf_96:hover{cursor:auto;background:var(--color-gray-2)}._error_19xvf_71._disabled_19xvf_96,._error_19xvf_71._disabled_19xvf_96:hover{color:var(--color-gray-1);background:var(--color-gray-2);border-color:var(--color-gray-2)}._loading_19xvf_115{position:absolute}._spinner_19xvf_116{width:1.25rem;height:1.25rem;box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:_spin_19xvf_116 .8s linear infinite}._root_19xvf_1:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:3px}@keyframes _spin_19xvf_116{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){._spinner_19xvf_116{animation:none}._root_19xvf_1{transition:none}}._root_zthip_1{width:fit-content;padding:0 1rem;font-weight:500}._filled_zthip_7._primary_zthip_7{color:var(--color-primary-1);background:var(--color-primary-3);border:1px solid var(--color-primary-3)}._filled_zthip_7._info_zthip_13{color:var(--color-info-1);background:var(--color-info-3);border:1px solid var(--color-info-3)}._filled_zthip_7._error_zthip_19{color:var(--color-error-1);background:var(--color-error-3);border:1px solid var(--color-error-3)}._filled_zthip_7._success_zthip_25{color:var(--color-success-1);background:var(--color-success-3);border:1px solid var(--color-success-3)}._filled_zthip_7._warning_zthip_31{color:var(--color-warning-1);background:var(--color-warning-3);border:1px solid var(--color-warning-3)}._filled_zthip_7._secondary_zthip_37{color:var(--color-gray-1);background:var(--color-gray-3);border:1px solid var(--color-gray-3)}._outlined_zthip_43._primary_zthip_7{color:var(--color-primary-1);border:1px solid var(--color-primary-2)}._outlined_zthip_43._info_zthip_13{color:var(--color-info-1);border:1px solid var(--color-info-2)}._outlined_zthip_43._error_zthip_19{color:var(--color-error-1);border:1px solid var(--color-error-2)}._outlined_zthip_43._success_zthip_25{color:var(--color-success-1);border:1px solid var(--color-success-2)}._outlined_zthip_43._warning_zthip_31{color:var(--color-warning-1);border:1px solid var(--color-warning-2)}._outlined_zthip_43._secondary_zthip_37{color:var(--color-gray-1);border:1px solid var(--color-gray-2)}@layer components{._root_qpt33_2{box-sizing:border-box;flex-shrink:0;border-style:solid;border-color:var(--color-gray-3);border-top-color:var(--color-primary-1);border-radius:50%;animation:_spin_qpt33_1 1s linear infinite}._container_qpt33_11{display:flex;align-items:center;justify-content:center;flex:1;width:100%;height:100%}@keyframes _spin_qpt33_1{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){._root_qpt33_2{animation:none}}}@layer components{._root_1l5eq_2{--grid-current-gap: var(--grid-gap-base, .5rem);--grid-current-row-gap: var(--grid-row-gap-base, var(--grid-current-gap));--grid-current-column-gap: var(--grid-column-gap-base, var(--grid-current-gap));display:grid;grid-template-columns:repeat(var(--grid-columns, 12),minmax(0,1fr));align-items:var(--grid-align, stretch);justify-content:var(--grid-justify, flex-start);row-gap:var(--grid-current-row-gap);column-gap:var(--grid-current-column-gap);min-width:0}._item_1l5eq_16{--grid-current-size: var(--grid-item-size-base, 1);--grid-current-offset: var(--grid-item-offset-base, auto);--grid-current-order: var(--grid-item-order-base, 0);--grid-current-item-align: var(--grid-item-align-base, auto);box-sizing:border-box;min-width:0;grid-column-start:var(--grid-current-offset);grid-column-end:span var(--grid-current-size);order:var(--grid-current-order);align-self:var(--grid-current-item-align)}._fit_1l5eq_30{width:fit-content}@media(min-width:40rem){._root_1l5eq_2{--grid-current-gap: var(--grid-gap-sm, var(--grid-gap-base, .5rem));--grid-current-row-gap: var(--grid-row-gap-sm, var(--grid-row-gap-base, var(--grid-current-gap)));--grid-current-column-gap: var(--grid-column-gap-sm, var(--grid-column-gap-base, var(--grid-current-gap)))}._item_1l5eq_16{--grid-current-size: var(--grid-item-size-sm, var(--grid-item-size-base, 1));--grid-current-offset: var(--grid-item-offset-sm, var(--grid-item-offset-base, auto));--grid-current-order: var(--grid-item-order-sm, var(--grid-item-order-base, 0));--grid-current-item-align: var(--grid-item-align-sm, var(--grid-item-align-base, auto))}}@media(min-width:48rem){._root_1l5eq_2{--grid-current-gap: var(--grid-gap-md, var(--grid-gap-sm, var(--grid-gap-base, .5rem)));--grid-current-row-gap: var(--grid-row-gap-md, var(--grid-row-gap-sm, var(--grid-row-gap-base, var(--grid-current-gap))));--grid-current-column-gap: var(--grid-column-gap-md, var(--grid-column-gap-sm, var(--grid-column-gap-base, var(--grid-current-gap))))}._item_1l5eq_16{--grid-current-size: var(--grid-item-size-md, var(--grid-item-size-sm, var(--grid-item-size-base, 1)));--grid-current-offset: var(--grid-item-offset-md, var(--grid-item-offset-sm, var(--grid-item-offset-base, auto)));--grid-current-order: var(--grid-item-order-md, var(--grid-item-order-sm, var(--grid-item-order-base, 0)));--grid-current-item-align: var(--grid-item-align-md, var(--grid-item-align-sm, var(--grid-item-align-base, auto)))}}@media(min-width:64rem){._root_1l5eq_2{--grid-current-gap: var(--grid-gap-lg, var(--grid-gap-md, var(--grid-gap-sm, var(--grid-gap-base, .5rem))));--grid-current-row-gap: var(--grid-row-gap-lg, var(--grid-row-gap-md, var(--grid-row-gap-sm, var(--grid-row-gap-base, var(--grid-current-gap)))));--grid-current-column-gap: var(--grid-column-gap-lg, var(--grid-column-gap-md, var(--grid-column-gap-sm, var(--grid-column-gap-base, var(--grid-current-gap)))))}._item_1l5eq_16{--grid-current-size: var(--grid-item-size-lg, var(--grid-item-size-md, var(--grid-item-size-sm, var(--grid-item-size-base, 1))));--grid-current-offset: var(--grid-item-offset-lg, var(--grid-item-offset-md, var(--grid-item-offset-sm, var(--grid-item-offset-base, auto))));--grid-current-order: var(--grid-item-order-lg, var(--grid-item-order-md, var(--grid-item-order-sm, var(--grid-item-order-base, 0))));--grid-current-item-align: var(--grid-item-align-lg, var(--grid-item-align-md, var(--grid-item-align-sm, var(--grid-item-align-base, auto))))}}@media(min-width:80rem){._root_1l5eq_2{--grid-current-gap: var(--grid-gap-xl, var(--grid-gap-lg, var(--grid-gap-md, var(--grid-gap-sm, var(--grid-gap-base, .5rem)))));--grid-current-row-gap: var(--grid-row-gap-xl, var(--grid-row-gap-lg, var(--grid-row-gap-md, var(--grid-row-gap-sm, var(--grid-row-gap-base, var(--grid-current-gap))))));--grid-current-column-gap: var(--grid-column-gap-xl, var(--grid-column-gap-lg, var(--grid-column-gap-md, var(--grid-column-gap-sm, var(--grid-column-gap-base, var(--grid-current-gap))))))}._item_1l5eq_16{--grid-current-size: var(--grid-item-size-xl, var(--grid-item-size-lg, var(--grid-item-size-md, var(--grid-item-size-sm, var(--grid-item-size-base, 1)))));--grid-current-offset: var(--grid-item-offset-xl, var(--grid-item-offset-lg, var(--grid-item-offset-md, var(--grid-item-offset-sm, var(--grid-item-offset-base, auto)))));--grid-current-order: var(--grid-item-order-xl, var(--grid-item-order-lg, var(--grid-item-order-md, var(--grid-item-order-sm, var(--grid-item-order-base, 0)))));--grid-current-item-align: var(--grid-item-align-xl, var(--grid-item-align-lg, var(--grid-item-align-md, var(--grid-item-align-sm, var(--grid-item-align-base, auto)))))}}@media(min-width:96rem){._root_1l5eq_2{--grid-current-gap: var(--grid-gap-2xl, var(--grid-gap-xl, var(--grid-gap-lg, var(--grid-gap-md, var(--grid-gap-sm, var(--grid-gap-base, .5rem))))));--grid-current-row-gap: var(--grid-row-gap-2xl, var(--grid-row-gap-xl, var(--grid-row-gap-lg, var(--grid-row-gap-md, var(--grid-row-gap-sm, var(--grid-row-gap-base, var(--grid-current-gap)))))));--grid-current-column-gap: var(--grid-column-gap-2xl, var(--grid-column-gap-xl, var(--grid-column-gap-lg, var(--grid-column-gap-md, var(--grid-column-gap-sm, var(--grid-column-gap-base, var(--grid-current-gap)))))))}._item_1l5eq_16{--grid-current-size: var(--grid-item-size-2xl, var(--grid-item-size-xl, var(--grid-item-size-lg, var(--grid-item-size-md, var(--grid-item-size-sm, var(--grid-item-size-base, 1))))));--grid-current-offset: var(--grid-item-offset-2xl, var(--grid-item-offset-xl, var(--grid-item-offset-lg, var(--grid-item-offset-md, var(--grid-item-offset-sm, var(--grid-item-offset-base, auto))))));--grid-current-order: var(--grid-item-order-2xl, var(--grid-item-order-xl, var(--grid-item-order-lg, var(--grid-item-order-md, var(--grid-item-order-sm, var(--grid-item-order-base, 0))))));--grid-current-item-align: var(--grid-item-align-2xl, var(--grid-item-align-xl, var(--grid-item-align-lg, var(--grid-item-align-md, var(--grid-item-align-sm, var(--grid-item-align-base, auto))))))}}}@layer components{._root_1o2bt_2{position:relative;padding:.25rem;font:inherit;font-size:calc(var(--size) * .6);line-height:1;box-sizing:border-box;flex-shrink:0;transition:.3s;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;border:none;background:transparent;vertical-align:middle}._xs_1o2bt_21{--size: var(--height-xs)}._sm_1o2bt_25{--size: var(--height-sm)}._md_1o2bt_29{--size: var(--height-md)}._lg_1o2bt_33{--size: var(--height-lg)}._xl_1o2bt_37{--size: var(--height-xl)}._primary_1o2bt_41{color:var(--color-primary-1)}._primary_1o2bt_41:hover{background:var(--color-primary-3)}._secondary_1o2bt_49{color:var(--color-gray-1)}._secondary_1o2bt_49:hover{color:var(--color-gray-1);background:var(--color-gray-3)}._danger_1o2bt_58{color:var(--color-error-1)}._danger_1o2bt_58:hover{color:var(--color-error-1);background:var(--color-error-3)}._disabled_1o2bt_67{color:var(--color-gray-1);pointer-events:none}._content_1o2bt_72{width:1em;height:1em;display:inline-flex;align-items:center;justify-content:center}._loading_1o2bt_80{position:absolute}._content_1o2bt_72 svg{width:1em;height:1em;flex-shrink:0;stroke-width:2}._content_1o2bt_72 svg *{vector-effect:non-scaling-stroke}._root_1o2bt_2:focus-visible{outline:2px solid var(--color-primary-1);outline-offset:2px}@media(prefers-reduced-motion:reduce){._root_1o2bt_2{transition:none}}}._root_1rkuv_1{flex-shrink:0;background:var(--color-gray-3);border-radius:4px;animation:_pulse_1rkuv_1 1.5s ease-in-out infinite}@keyframes _pulse_1rkuv_1{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}@media(prefers-reduced-motion:reduce){._root_1rkuv_1{animation:none}}

package/dist/ui/Accordion/Accordion.d.ts

@@ -0,0 +1,8 @@
+import { type ComponentProps, type ReactNode } from "react";
+export interface AccordionProps extends Omit<ComponentProps<"details">, "title" | "open" | "defaultValue"> {
+    title: ReactNode;
+    summary?: ReactNode;
+    defaultValue?: boolean;
+}
+export declare const Accordion: ({ title, summary, children, className, defaultValue, onToggle, ...props }: AccordionProps) => import("react").JSX.Element;
+//# sourceMappingURL=Accordion.d.ts.map

package/dist/ui/Accordion/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/ui/Accordion/Accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAOtE,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,cAAc,CAAC,SAAS,CAAC,EACzB,OAAO,GAAG,MAAM,GAAG,cAAc,CAClC;IACC,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,SAAS,GAAI,2EAQvB,cAAc,gCA2BhB,CAAC"}

package/dist/ui/Accordion/Accordion.js

@@ -0,0 +1,42 @@
+"use client";
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import { useState as u } from "react";
+import { ChevronDown as g } from "lucide-react";
+import { twMerge as h } from "tailwind-merge";
+import { Flex as t } from "../Flex/Flex.js";
+import e from "./Accordion.module.css.js";
+const I = ({
+  title: n,
+  summary: i,
+  children: l,
+  className: c,
+  defaultValue: m = !1,
+  onToggle: a,
+  ...f
+}) => {
+  const [p, d] = u(m);
+  return /* @__PURE__ */ r(
+    "details",
+    {
+      className: h(e.root, "w-full", c),
+      open: p,
+      onToggle: (s) => {
+        d(s.currentTarget.open), a?.(s);
+      },
+      ...f,
+      children: [
+        /* @__PURE__ */ o("summary", { className: e.trigger, children: /* @__PURE__ */ r(t, { direction: "col", className: "w-full", children: [
+          /* @__PURE__ */ r(t, { alignItems: "center", justifyContent: "between", className: "w-full", children: [
+            n,
+            /* @__PURE__ */ o(g, { className: e.icon, size: 20, "aria-hidden": "true" })
+          ] }),
+          i
+        ] }) }),
+        /* @__PURE__ */ o(t, { direction: "col", className: e.content, children: l })
+      ]
+    }
+  );
+};
+export {
+  I as Accordion
+};

package/dist/ui/Accordion/Accordion.module.css.js

@@ -0,0 +1,13 @@
+const o = "_root_oaq11_3", t = "_trigger_oaq11_23", n = "_icon_oaq11_38", c = "_content_oaq11_49", _ = {
+  root: o,
+  trigger: t,
+  icon: n,
+  content: c
+};
+export {
+  c as content,
+  _ as default,
+  n as icon,
+  o as root,
+  t as trigger
+};

package/dist/ui/Alert/Alert.d.ts

@@ -0,0 +1,8 @@
+import { type CardProps } from "../Card/Card.js";
+export interface AlertProps extends CardProps {
+    variant: "error" | "info";
+    title: string;
+    message?: string;
+}
+export declare const Alert: ({ variant, title, message, children, className, ...props }: AlertProps) => import("react").JSX.Element;
+//# sourceMappingURL=Alert.d.ts.map

package/dist/ui/Alert/Alert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/ui/Alert/Alert.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAIvD,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,OAAO,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,KAAK,GAAI,4DAOnB,UAAU,gCAyBZ,CAAC"}

package/dist/ui/Alert/Alert.js

@@ -0,0 +1,38 @@
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { TriangleAlert as p, Info as s } from "lucide-react";
+import { twMerge as a } from "tailwind-merge";
+import { Card as h } from "../Card/Card.js";
+import { Flex as m } from "../Flex/Flex.js";
+import { Text as n } from "../Text/Text.js";
+const w = ({
+  variant: e,
+  title: o,
+  message: t,
+  children: f,
+  className: l,
+  ...c
+}) => {
+  const d = e === "error" ? p : s;
+  return /* @__PURE__ */ r(
+    h,
+    {
+      role: e === "error" ? "alert" : "status",
+      className: a(
+        "border-transparent",
+        e === "error" ? "text-error-1 bg-error-3" : "text-primary-1 bg-primary-3",
+        l
+      ),
+      ...c,
+      children: /* @__PURE__ */ i(m, { direction: "col", children: [
+        /* @__PURE__ */ i(m, { alignItems: "center", gap: o ? "sm" : "md", children: [
+          /* @__PURE__ */ r(d, { size: 18, "aria-hidden": "true" }),
+          /* @__PURE__ */ r(n, { weight: "medium", children: o })
+        ] }),
+        t && /* @__PURE__ */ r(n, { children: t })
+      ] })
+    }
+  );
+};
+export {
+  w as Alert
+};

package/dist/ui/Chip/Chip.module.css.js

@@ -1,23 +1,23 @@
-const s = "_root_11js1_1", o = "_filled_11js1_6", _ = "_primary_11js1_6", n = "_info_11js1_12", r = "_error_11js1_18", c = "_success_11js1_24", t = "_warning_11js1_30", e = "_secondary_11js1_36", i = "_outlined_11js1_42", a = {
-  root: s,
-  filled: o,
+const o = "_root_zthip_1", t = "_filled_zthip_7", _ = "_primary_zthip_7", n = "_info_zthip_13", r = "_error_zthip_19", i = "_success_zthip_25", s = "_warning_zthip_31", c = "_secondary_zthip_37", e = "_outlined_zthip_43", p = {
+  root: o,
+  filled: t,
   primary: _,
   info: n,
   error: r,
-  success: c,
-  warning: t,
-  secondary: e,
-  outlined: i
+  success: i,
+  warning: s,
+  secondary: c,
+  outlined: e
 };
 export {
-  a as default,
+  p as default,
   r as error,
-  o as filled,
+  t as filled,
   n as info,
-  i as outlined,
+  e as outlined,
   _ as primary,
-  s as root,
-  e as secondary,
-  c as success,
-  t as warning
+  o as root,
+  c as secondary,
+  i as success,
+  s as warning
 };

package/dist/ui/Grid/Grid.d.ts

@@ -0,0 +1,6 @@
+export type { GridGap, GridItemProps, GridItemSize, GridRootProps, ResponsiveValue, } from "./Grid.types.js";
+export declare const Grid: {
+    Root: ({ columns, gap, rowGap, columnGap, align, justify, className, style, children, ...props }: import("./Grid.types.js").GridRootProps) => import("react").JSX.Element;
+    Item: ({ size, offset, order, align, className, style, children, ...props }: import("./Grid.types.js").GridItemProps) => import("react").JSX.Element;
+};
+//# sourceMappingURL=Grid.d.ts.map

package/dist/ui/Grid/Grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.d.ts","sourceRoot":"","sources":["../../../src/ui/Grid/Grid.ts"],"names":[],"mappings":"AAGA,YAAY,EACV,OAAO,EACP,aAAa,EACb,YAAY,EACZ,aAAa,EACb,eAAe,GAChB,MAAM,iBAAiB,CAAC;AAEzB,eAAO,MAAM,IAAI;;;CAGhB,CAAC"}

package/dist/ui/Grid/Grid.js

@@ -0,0 +1,9 @@
+import { GridItem as o } from "./GridItem.js";
+import { GridRoot as r } from "./GridRoot.js";
+const i = {
+  Root: r,
+  Item: o
+};
+export {
+  i as Grid
+};

package/dist/ui/Grid/Grid.module.css.js

@@ -0,0 +1,11 @@
+const t = "_root_1l5eq_2", o = "_item_1l5eq_16", _ = "_fit_1l5eq_30", e = {
+  root: t,
+  item: o,
+  fit: _
+};
+export {
+  e as default,
+  _ as fit,
+  o as item,
+  t as root
+};

package/dist/ui/Grid/Grid.types.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentProps } from "react";
+import type { AlignItemsType, JustifayContentType } from "../Flex/constants.js";
+import type { Size } from "../../lib/sizes.js";
+export type GridGap = Size | "none";
+export type ResponsiveValue<T> = T | Partial<Record<Size, T>>;
+export type GridItemSize = ResponsiveValue<number> | "fit" | "grow";
+export interface GridRootProps extends ComponentProps<"div"> {
+    columns?: number;
+    gap?: ResponsiveValue<GridGap>;
+    rowGap?: ResponsiveValue<GridGap>;
+    columnGap?: ResponsiveValue<GridGap>;
+    align?: AlignItemsType;
+    justify?: JustifayContentType;
+}
+export interface GridItemProps extends ComponentProps<"div"> {
+    size?: GridItemSize;
+    offset?: ResponsiveValue<number>;
+    order?: ResponsiveValue<number>;
+    align?: ResponsiveValue<AlignItemsType | "auto">;
+}
+//# sourceMappingURL=Grid.types.d.ts.map

package/dist/ui/Grid/Grid.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.types.d.ts","sourceRoot":"","sources":["../../../src/ui/Grid/Grid.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAEhF,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAE/C,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG,MAAM,CAAC;AAEpC,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;AAE9D,MAAM,MAAM,YAAY,GAAG,eAAe,CAAC,MAAM,CAAC,GAAG,KAAK,GAAG,MAAM,CAAC;AAEpE,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC1D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAClC,SAAS,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IACrC,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,OAAO,CAAC,EAAE,mBAAmB,CAAC;CAC/B;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC1D,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACjC,KAAK,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,eAAe,CAAC,cAAc,GAAG,MAAM,CAAC,CAAC;CAClD"}

package/dist/ui/Grid/GridItem.d.ts

@@ -0,0 +1,3 @@
+import type { GridItemProps } from "./Grid.types.js";
+export declare const GridItem: ({ size, offset, order, align, className, style, children, ...props }: GridItemProps) => import("react").JSX.Element;
+//# sourceMappingURL=GridItem.d.ts.map

package/dist/ui/Grid/GridItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridItem.d.ts","sourceRoot":"","sources":["../../../src/ui/Grid/GridItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAarD,eAAO,MAAM,QAAQ,GAAI,sEAStB,aAAa,gCAyBf,CAAC"}

package/dist/ui/Grid/GridItem.js

@@ -0,0 +1,48 @@
+import { jsx as g } from "react/jsx-runtime";
+import p from "clsx";
+import { getResponsiveCssVariables as e } from "./utils.js";
+import o from "./Grid.module.css.js";
+const u = {
+  auto: "auto",
+  stretch: "stretch",
+  center: "center",
+  start: "flex-start",
+  end: "flex-end"
+}, G = ({
+  size: r = "grow",
+  offset: s = 0,
+  order: m = 0,
+  align: a = "auto",
+  className: c,
+  style: d,
+  children: f,
+  ...n
+}) => {
+  const i = r === "fit", l = i ? 1 : r;
+  return /* @__PURE__ */ g(
+    "div",
+    {
+      ...n,
+      className: p(o.item, i && o.fit, c),
+      style: {
+        ...e("grid-item-size", l),
+        ...e(
+          "grid-item-offset",
+          s,
+          (t) => t === 0 ? "auto" : t + 1
+        ),
+        ...e("grid-item-order", m),
+        ...e(
+          "grid-item-align",
+          a,
+          (t) => u[t]
+        ),
+        ...d
+      },
+      children: f
+    }
+  );
+};
+export {
+  G as GridItem
+};

package/dist/ui/Grid/GridRoot.d.ts

@@ -0,0 +1,3 @@
+import type { GridRootProps } from "./Grid.types.js";
+export declare const GridRoot: ({ columns, gap, rowGap, columnGap, align, justify, className, style, children, ...props }: GridRootProps) => import("react").JSX.Element;
+//# sourceMappingURL=GridRoot.d.ts.map

package/dist/ui/Grid/GridRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridRoot.d.ts","sourceRoot":"","sources":["../../../src/ui/Grid/GridRoot.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAGV,aAAa,EACd,MAAM,iBAAiB,CAAC;AAgFzB,eAAO,MAAM,QAAQ,GAAI,2FAWtB,aAAa,gCA+Bf,CAAC"}

package/dist/ui/Grid/GridRoot.js

@@ -0,0 +1,71 @@
+import { jsx as h } from "react/jsx-runtime";
+import { Children as w, isValidElement as C, cloneElement as S } from "react";
+import b from "clsx";
+import { getResponsiveCssVariables as p, GRID_GAP_VALUES as d } from "./utils.js";
+import { GridItem as z } from "./GridItem.js";
+import I from "./Grid.module.css.js";
+const v = {
+  stretch: "stretch",
+  center: "center",
+  start: "flex-start",
+  end: "flex-end"
+}, y = {
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  between: "space-between"
+}, g = (t) => t === "grow" || t === "fit" ? 0 : typeof t == "number" ? t : t?.md ?? 1, G = (t, a) => {
+  const m = w.toArray(t), n = m.filter(
+    (e) => C(e) && e.type === z
+  );
+  if (!n.some(({ props: e }) => e.size === "fit" || e.size === "grow" ? !0 : !Number.isInteger(g(e.size))))
+    return { children: t, templateColumns: void 0 };
+  const s = n.filter(
+    ({ props: e }) => e.size === "grow"
+  ).length, u = n.reduce(
+    (e, { props: f }) => e + g(f.size),
+    0
+  ), o = Math.max(s, a - u), c = s > 0 ? o / s : 0, r = [], l = m.map((e) => !C(e) || e.type !== z ? e : (e.props.size === "fit" ? r.push("max-content") : e.props.size === "grow" ? r.push(`minmax(0, ${c}fr)`) : r.push(`minmax(0, ${g(e.props.size)}fr)`), S(e, { size: 1 })));
+  return s === 0 && o > 0 && r.push(`minmax(0, ${o}fr)`), {
+    children: l,
+    templateColumns: r.join(" ")
+  };
+}, j = ({
+  columns: t = 12,
+  gap: a = "sm",
+  rowGap: m,
+  columnGap: n,
+  align: x = "stretch",
+  justify: s = "start",
+  className: u,
+  style: o,
+  children: c,
+  ...r
+}) => {
+  const l = Math.max(1, t), e = G(c, l), f = {
+    "--grid-columns": l,
+    "--grid-align": v[x],
+    "--grid-justify": y[s],
+    gridTemplateColumns: e.templateColumns,
+    ...p(
+      "grid-gap",
+      a,
+      (i) => d[i]
+    ),
+    ...p(
+      "grid-row-gap",
+      m,
+      (i) => d[i]
+    ),
+    ...p(
+      "grid-column-gap",
+      n,
+      (i) => d[i]
+    ),
+    ...o
+  };
+  return /* @__PURE__ */ h("div", { ...r, className: b(I.root, u), style: f, children: e.children });
+};
+export {
+  j as GridRoot
+};

package/dist/ui/Grid/utils.d.ts

@@ -0,0 +1,6 @@
+import type { CSSProperties } from "react";
+import type { GridGap, ResponsiveValue } from "./Grid.types.js";
+export type GridCssVariables = CSSProperties & Record<`--${string}`, string | number | undefined>;
+export declare const GRID_GAP_VALUES: Record<GridGap, string>;
+export declare const getResponsiveCssVariables: <T>(name: string, value: ResponsiveValue<T> | undefined, transform?: (entry: T) => string | number) => GridCssVariables;
+//# sourceMappingURL=utils.d.ts.map

package/dist/ui/Grid/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/ui/Grid/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,KAAK,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAGhE,MAAM,MAAM,gBAAgB,GAAG,aAAa,GAC1C,MAAM,CAAC,KAAK,MAAM,EAAE,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAIrD,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,OAAO,EAAE,MAAM,CAOnD,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,CAAC,EACzC,MAAM,MAAM,EACZ,OAAO,eAAe,CAAC,CAAC,CAAC,GAAG,SAAS,EACrC,YAAW,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,GAAG,MAAiC,KAClE,gBAeF,CAAC"}

package/dist/ui/Grid/utils.js

@@ -0,0 +1,21 @@
+const c = ["xs", "sm", "md", "lg", "xl"], i = {
+  none: "0rem",
+  xs: "0.25rem",
+  sm: "0.5rem",
+  md: "1rem",
+  lg: "1.5rem",
+  xl: "2rem"
+}, d = (s, e, n = (r) => String(r)) => {
+  if (e === void 0) return {};
+  if (typeof e != "object" || e === null)
+    return { [`--${s}-base`]: n(e) };
+  const r = e;
+  return c.reduce((t, o) => {
+    const m = r[o];
+    return m !== void 0 && (t[`--${s}-${o}`] = n(m)), t;
+  }, {});
+};
+export {
+  i as GRID_GAP_VALUES,
+  d as getResponsiveCssVariables
+};

package/dist/ui/IconButton/IconButton.module.css.js

@@ -1,29 +1,29 @@
-const _ = "_root_1pw4c_2", c = "_xs_1pw4c_21", o = "_sm_1pw4c_26", n = "_md_1pw4c_31", s = "_lg_1pw4c_36", t = "_xl_1pw4c_41", d = "_primary_1pw4c_46", a = "_secondary_1pw4c_54", p = "_danger_1pw4c_63", r = "_disabled_1pw4c_72", e = "_content_1pw4c_77", l = "_loading_1pw4c_85", w = {
-  root: _,
-  xs: c,
-  sm: o,
+const o = "_root_1o2bt_2", t = "_xs_1o2bt_21", _ = "_sm_1o2bt_25", n = "_md_1o2bt_29", s = "_lg_1o2bt_33", c = "_xl_1o2bt_37", d = "_primary_1o2bt_41", a = "_secondary_1o2bt_49", r = "_danger_1o2bt_58", b = "_disabled_1o2bt_67", e = "_content_1o2bt_72", l = "_loading_1o2bt_80", g = {
+  root: o,
+  xs: t,
+  sm: _,
   md: n,
   lg: s,
-  xl: t,
+  xl: c,
   primary: d,
   secondary: a,
-  danger: p,
-  disabled: r,
+  danger: r,
+  disabled: b,
   content: e,
   loading: l
 };
 export {
   e as content,
-  p as danger,
-  w as default,
-  r as disabled,
+  r as danger,
+  g as default,
+  b as disabled,
   s as lg,
   l as loading,
   n as md,
   d as primary,
-  _ as root,
+  o as root,
   a as secondary,
-  o as sm,
-  t as xl,
-  c as xs
+  _ as sm,
+  c as xl,
+  t as xs
 };

package/dist/ui/index.d.ts

@@ -4,7 +4,10 @@ export { Button, type ButtonProps } from "./Button/Button.js";
 export { Card, type CardProps } from "./Card/Card.js";
 export { Chip, type ChipProps, type ChipColor, type ChipVariant, } from "./Chip/Chip.js";
 export { Skeleton, type SkeletonProps } from "./Skeleton/Skeleton.js";
-export { IconButton, type IconButtonProps, type IconButtonColor } from "./IconButton/IconButton.js";
-export { CircularLoading, type CircularLoadingProps } from "./CircularLoading/CircularLoading.js";
-export { ProgressBar, type ProgressBarProps } from "./ProgressBar/ProgressBar.js";
+export { IconButton, type IconButtonProps, type IconButtonColor, } from "./IconButton/IconButton.js";
+export { CircularLoading, type CircularLoadingProps, } from "./CircularLoading/CircularLoading.js";
+export { ProgressBar, type ProgressBarProps, } from "./ProgressBar/ProgressBar.js";
+export { Accordion, type AccordionProps } from "./Accordion/Accordion.js";
+export { Alert, type AlertProps } from "./Alert/Alert.js";
+export { Grid, type GridGap, type GridItemProps, type GridItemSize, type GridRootProps, type ResponsiveValue, } from "./Grid/Grid.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/ui/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EACL,IAAI,EACJ,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,WAAW,GACjB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AACpG,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAClG,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EACL,IAAI,EACJ,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,WAAW,GACjB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EACL,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,eAAe,GACrB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,GAC1B,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,GACtB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EACL,IAAI,EACJ,KAAK,OAAO,EACZ,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,aAAa,EAClB,KAAK,eAAe,GACrB,MAAM,gBAAgB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@divayth/brick-ui",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "React components for Brick UI",
   "type": "module",
   "files": [
@@ -29,6 +29,7 @@
   },
   "dependencies": {
     "clsx": "^2.1.1",
+    "lucide-react": "^1.57.0",
     "tailwind-merge": "^3.7.0"
   },
   "devDependencies": {
@@ -40,7 +41,6 @@
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@vitejs/plugin-react": "^5.0.0",
-    "lucide-react": "^1.56.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "rollup-plugin-preserve-directives": "^0.4.0",