@divayth/brick-ui 0.0.0-stage → 0.0.1

package/README.md

@@ -1,3 +1,44 @@
-# Temporary Holding Version
+# Brick UI
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+React components for React 19 and Next.js: Text, Flex, Button, Card, Chip, Skeleton,
+IconButton, CircularLoading and ProgressBar.
+
+## Development
+
+```sh
+npm install
+npm run typecheck
+npm run build
+npm run storybook
+```
+
+## Usage
+
+```tsx
+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>
+```
+
+The package ships compiled CSS; consumers do not need Tailwind.
+No global CSS reset is included. Colors can be overridden via CSS variables.
+Interactive Button preserves its 'use client' directive; Text and Flex remain server-compatible.
+The package has not been published to npm yet.
+
+## Structure
+
+- `src/ui` — components, CSS Modules and Storybook stories.
+- `src/lib` — shared size scale, types and tokens.
+
+`Size`: `xs | sm | md | lg | xl`.
+Button supports all five sizes (heights 24 / 32 / 40 / 48 / 56 px).
+Flex gap supports the same scale (4 / 8 / 16 / 24 / 32 px).
+Text uses the same names and defaults to `md`.
+Text also supports `inherit`, `2xl`, `3xl` and `4xl`.
+
+Control heights and horizontal padding can be overridden with
+`--height-*` and `--padding-*` CSS variables.

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+import './styles.css';
+export * from './ui/index.js';
+export * from './lib/index.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AAEtB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC"}

package/dist/index.js

@@ -0,0 +1,21 @@
+/* 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";
+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
+};

package/dist/lib/index.d.ts

@@ -0,0 +1,2 @@
+export type { Size } from "./sizes.js";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC"}

package/dist/lib/sizes.d.ts

@@ -0,0 +1,2 @@
+export type Size = "xs" | "sm" | "md" | "lg" | "xl";
+//# sourceMappingURL=sizes.d.ts.map

package/dist/lib/sizes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.d.ts","sourceRoot":"","sources":["../../src/lib/sizes.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC"}

package/dist/styles.css

@@ -0,0 +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}}

package/dist/ui/Button/Button.d.ts

@@ -0,0 +1,21 @@
+import type { AriaAttributes, ComponentPropsWithRef, ElementType, ReactNode } from 'react';
+import type { Size } from '../../lib/sizes.js';
+type ButtonOwnProps<T extends ElementType> = {
+    isLoading?: boolean;
+    disabled?: boolean;
+    'aria-disabled'?: AriaAttributes['aria-disabled'];
+    'aria-busy'?: AriaAttributes['aria-busy'];
+    type?: 'button' | 'submit' | 'reset';
+    variant?: 'filled' | 'outlined' | 'transparent';
+    size?: Size;
+    color?: 'primary' | 'error';
+    className?: string;
+    component?: T;
+    children?: ReactNode;
+    startIcon?: ReactNode;
+    endIcon?: ReactNode;
+};
+export type ButtonProps<T extends ElementType = 'button'> = ButtonOwnProps<T> & Omit<ComponentPropsWithRef<T>, keyof ButtonOwnProps<T>>;
+export declare const Button: <T extends ElementType = "button">({ isLoading, variant, size, color, type, component, children, startIcon, endIcon, className, disabled, onClick, onKeyDown, tabIndex, "aria-disabled": ariaDisabled, "aria-busy": ariaBusy, ...props }: ButtonProps<T>) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=Button.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,qBAAqB,EAAE,WAAW,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAItH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAM/C,KAAK,cAAc,CAAC,CAAC,SAAS,WAAW,IAAI;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC;IAClD,WAAW,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAC1C,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,aAAa,CAAC;IAChD,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,CAAC,CAAC;IACd,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,WAAW,GAAG,QAAQ,IACtD,cAAc,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;AAE9E,eAAO,MAAM,MAAM,GAAI,CAAC,SAAS,WAAW,GAAG,QAAQ,EAAE,uMAkBtD,WAAW,CAAC,CAAC,CAAC,gCA4ChB,CAAC"}

package/dist/ui/Button/Button.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsxs as l, jsx as n } from "react/jsx-runtime";
+import B from "clsx";
+import { Flex as m } from "../Flex/Flex.js";
+import { Text as P } from "../Text/Text.js";
+import o from "./Button.module.css.js";
+const q = ({
+  isLoading: e = !1,
+  variant: p = "filled",
+  size: c = "md",
+  color: d = "primary",
+  type: u = "button",
+  component: f,
+  children: b,
+  startIcon: y,
+  endIcon: x,
+  className: C,
+  disabled: h = !1,
+  onClick: D,
+  onKeyDown: g,
+  tabIndex: j,
+  "aria-disabled": k,
+  "aria-busy": I,
+  ...N
+}) => {
+  const s = f || "button", r = h || e, a = s === "button", i = typeof s != "string";
+  return /* @__PURE__ */ l(
+    s,
+    {
+      ...N,
+      type: a || i ? u : void 0,
+      disabled: a || i ? r : void 0,
+      "aria-disabled": r || k,
+      "aria-busy": e || I,
+      tabIndex: !a && r ? -1 : j,
+      className: B(o.root, o[p], o[c], o[d], { [o.disabled]: r }, C),
+      onClick: (t) => {
+        if (r) {
+          t.preventDefault(), t.stopPropagation();
+          return;
+        }
+        D?.(t);
+      },
+      onKeyDown: (t) => {
+        if (r && (t.key === "Enter" || t.key === " ")) {
+          t.preventDefault(), t.stopPropagation();
+          return;
+        }
+        g?.(t);
+      },
+      children: [
+        /* @__PURE__ */ l(m, { alignItems: "center", style: { opacity: e ? 0 : 1 }, children: [
+          y,
+          /* @__PURE__ */ n(P, { children: b }),
+          x
+        ] }),
+        e && /* @__PURE__ */ n(m, { alignItems: "center", justifyContent: "center", className: o.loading, "aria-hidden": "true", children: /* @__PURE__ */ n("span", { className: o.spinner }) })
+      ]
+    }
+  );
+};
+export {
+  q as Button
+};

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

@@ -0,0 +1,33 @@
+const _ = "_root_19xvf_1", n = "_xs_19xvf_14", s = "_sm_19xvf_19", o = "_md_19xvf_24", t = "_lg_19xvf_29", l = "_xl_19xvf_34", r = "_filled_19xvf_39", x = "_outlined_19xvf_50", e = "_transparent_19xvf_61", d = "_error_19xvf_71", f = "_disabled_19xvf_96", i = "_loading_19xvf_115", c = "_spinner_19xvf_116", a = "_spin_19xvf_116", v = {
+  root: _,
+  xs: n,
+  sm: s,
+  md: o,
+  lg: t,
+  xl: l,
+  filled: r,
+  outlined: x,
+  transparent: e,
+  error: d,
+  disabled: f,
+  loading: i,
+  spinner: c,
+  spin: a
+};
+export {
+  v as default,
+  f as disabled,
+  d as error,
+  r as filled,
+  t as lg,
+  i as loading,
+  o as md,
+  x as outlined,
+  _ as root,
+  s as sm,
+  a as spin,
+  c as spinner,
+  e as transparent,
+  l as xl,
+  n as xs
+};

package/dist/ui/Card/Card.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentProps } from 'react';
+export type CardProps = ComponentProps<'div'>;
+export declare const Card: ({ children, className, onClick, onKeyDown, tabIndex, ...props }: CardProps) => import("react").JSX.Element;
+//# sourceMappingURL=Card.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/ui/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAM5C,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAE9C,eAAO,MAAM,IAAI,GAAI,iEAAiE,SAAS,gCAgC9F,CAAC"}

package/dist/ui/Card/Card.js

@@ -0,0 +1,20 @@
+import { jsx as i } from "react/jsx-runtime";
+import { twMerge as f } from "tailwind-merge";
+import o from "./Card.module.css.js";
+const p = ({ children: t, className: a, onClick: e, onKeyDown: d, tabIndex: u, ...g }) => e ? /* @__PURE__ */ i(
+  "div",
+  {
+    onClick: e,
+    onKeyDown: (r) => {
+      d?.(r), !(r.defaultPrevented || r.target !== r.currentTarget) && (r.key === "Enter" || r.key === " ") && (r.preventDefault(), r.repeat || r.currentTarget.click());
+    },
+    role: "button",
+    tabIndex: u ?? 0,
+    className: f(o.root, o.hover, "p-4", "rounded-lg", "bg-background-primary", a),
+    ...g,
+    children: t
+  }
+) : /* @__PURE__ */ i("div", { className: f(o.root, "p-4", "rounded-lg", "bg-background-primary", a), onKeyDown: d, tabIndex: u, ...g, children: t });
+export {
+  p as Card
+};

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

@@ -0,0 +1,9 @@
+const o = "_root_1cq4m_2", t = "_hover_1cq4m_12", r = {
+  root: o,
+  hover: t
+};
+export {
+  r as default,
+  t as hover,
+  o as root
+};

package/dist/ui/Chip/Chip.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps, ReactNode } from "react";
+import type { Size } from "../../lib/sizes.js";
+export type ChipVariant = "filled" | "outlined";
+export type ChipColor = "primary" | "info" | "error" | "success" | "warning" | "secondary";
+export interface ChipProps extends ComponentProps<"div"> {
+    variant?: ChipVariant;
+    color?: ChipColor;
+    label: string;
+    startIcon?: ReactNode;
+    endIcon?: ReactNode;
+    rounded?: Size;
+}
+export declare const Chip: ({ variant, color, className, label, startIcon, endIcon, rounded, onClick, ...props }: ChipProps) => import("react").JSX.Element;
+//# sourceMappingURL=Chip.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAM/C,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEhD,MAAM,MAAM,SAAS,GACjB,SAAS,GACT,MAAM,GACN,OAAO,GACP,SAAS,GACT,SAAS,GACT,WAAW,CAAC;AAUhB,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,KAAK,CAAC;IACtD,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,IAAI,CAAC;CAChB;AAED,eAAO,MAAM,IAAI,GAAI,sFAUlB,SAAS,gCAqBX,CAAC"}

package/dist/ui/Chip/Chip.js

@@ -0,0 +1,45 @@
+import { jsxs as i } from "react/jsx-runtime";
+import u from "clsx";
+import { Flex as x } from "../Flex/Flex.js";
+import r from "./Chip.module.css.js";
+const p = {
+  xs: "rounded-xs",
+  sm: "rounded-sm",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  xl: "rounded-xl"
+}, j = ({
+  variant: e = "filled",
+  color: s = "secondary",
+  className: t,
+  label: d,
+  startIcon: m,
+  endIcon: n,
+  rounded: l = "sm",
+  onClick: o,
+  ...c
+}) => /* @__PURE__ */ i(
+  x,
+  {
+    justifyContent: "center",
+    alignItems: "center",
+    className: u(
+      r.root,
+      r[e],
+      r[s],
+      p[l],
+      { "cursor-pointer": o },
+      t
+    ),
+    onClick: o,
+    ...c,
+    children: [
+      m,
+      d,
+      n
+    ]
+  }
+);
+export {
+  j as Chip
+};

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

@@ -0,0 +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,
+  primary: _,
+  info: n,
+  error: r,
+  success: c,
+  warning: t,
+  secondary: e,
+  outlined: i
+};
+export {
+  a as default,
+  r as error,
+  o as filled,
+  n as info,
+  i as outlined,
+  _ as primary,
+  s as root,
+  e as secondary,
+  c as success,
+  t as warning
+};

package/dist/ui/CircularLoading/CircularLoading.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentProps } from 'react';
+import type { Size } from '../../lib/sizes.js';
+export interface CircularLoadingProps extends ComponentProps<'div'> {
+    size?: Size;
+    fullScreen?: boolean;
+}
+export declare const CircularLoading: ({ size, fullScreen, className, ...props }: CircularLoadingProps) => import("react").JSX.Element;
+//# sourceMappingURL=CircularLoading.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CircularLoading.d.ts","sourceRoot":"","sources":["../../../src/ui/CircularLoading/CircularLoading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG/C,MAAM,WAAW,oBAAqB,SAAQ,cAAc,CAAC,KAAK,CAAC;IACjE,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAUD,eAAO,MAAM,eAAe,GAAI,2CAE7B,oBAAoB,gCAUtB,CAAC"}

package/dist/ui/CircularLoading/CircularLoading.js

@@ -0,0 +1,30 @@
+import { jsx as e } from "react/jsx-runtime";
+import a from "clsx";
+import { twMerge as i } from "tailwind-merge";
+import s from "./CircularLoading.module.css.js";
+const n = {
+  xs: ["w-2", "h-2", "border-2"],
+  sm: ["w-3", "h-3", "border-2"],
+  md: ["w-5", "h-5", "border-2"],
+  lg: ["w-8", "h-8", "border-3"],
+  xl: ["w-10", "h-10", "border-3"]
+}, p = ({
+  size: d = "md",
+  fullScreen: r,
+  className: o,
+  ...m
+}) => {
+  const t = /* @__PURE__ */ e(
+    "div",
+    {
+      role: "status",
+      "aria-label": "Loading",
+      ...m,
+      className: i(a(s.root, n[d], !r && o))
+    }
+  );
+  return r ? /* @__PURE__ */ e("div", { className: i(s.container, o), children: t }) : t;
+};
+export {
+  p as CircularLoading
+};

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

@@ -0,0 +1,9 @@
+const o = "_root_qpt33_2", t = "_container_qpt33_11", n = {
+  root: o,
+  container: t
+};
+export {
+  t as container,
+  n as default,
+  o as root
+};

package/dist/ui/Flex/Flex.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentProps } from "react";
+import { type DirectionType, type AlignItemsType, type GapType, type JustifayContentType } from "./constants.js";
+export interface FlexProps extends ComponentProps<"div"> {
+    direction?: DirectionType;
+    alignItems?: AlignItemsType;
+    justifyContent?: JustifayContentType;
+    gap?: GapType;
+}
+export declare const Flex: ({ children, direction, gap, justifyContent, alignItems, className, ...props }: FlexProps) => import("react").JSX.Element;
+//# sourceMappingURL=Flex.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.d.ts","sourceRoot":"","sources":["../../../src/ui/Flex/Flex.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,OAAO,EAKL,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,OAAO,EACZ,KAAK,mBAAmB,EACzB,MAAM,gBAAgB,CAAC;AAExB,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,KAAK,CAAC;IACtD,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;IACrC,GAAG,CAAC,EAAE,OAAO,CAAC;CACf;AAED,eAAO,MAAM,IAAI,GAAI,+EAQlB,SAAS,gCAgBX,CAAC"}

package/dist/ui/Flex/Flex.js

@@ -0,0 +1,29 @@
+import { jsx as _ } from "react/jsx-runtime";
+import { twMerge as I } from "tailwind-merge";
+import { GAP_SX as N, DIRECTION_SX as T, ALIGN_ITEMS_SX as f, JUSTIFY_CONTENT_SX as i } from "./constants.js";
+const a = ({
+  children: r,
+  direction: t = "row",
+  gap: o = "sm",
+  justifyContent: e = "start",
+  alignItems: m = "stretch",
+  className: s,
+  ...S
+}) => /* @__PURE__ */ _(
+  "div",
+  {
+    className: I(
+      "flex",
+      N[o],
+      T[t],
+      f[m],
+      i[e],
+      s
+    ),
+    ...S,
+    children: r
+  }
+);
+export {
+  a as Flex
+};

package/dist/ui/Flex/constants.d.ts

@@ -0,0 +1,30 @@
+import { type Size } from "../../lib/sizes.js";
+export declare const ALIGN_ITEMS_SX: {
+    readonly stretch: "items-stretch";
+    readonly center: "items-center";
+    readonly start: "items-start";
+    readonly end: "items-end";
+};
+export declare const JUSTIFY_CONTENT_SX: {
+    readonly start: "justify-start";
+    readonly center: "justify-center";
+    readonly end: "justify-end";
+    readonly between: "justify-between";
+};
+export declare const DIRECTION_SX: {
+    readonly row: "flex-row";
+    readonly col: "flex-col";
+};
+export declare const GAP_SX: {
+    readonly none: "gap-0";
+    readonly xs: "gap-1";
+    readonly sm: "gap-2";
+    readonly md: "gap-4";
+    readonly lg: "gap-6";
+    readonly xl: "gap-8";
+};
+export type AlignItemsType = keyof typeof ALIGN_ITEMS_SX;
+export type JustifayContentType = keyof typeof JUSTIFY_CONTENT_SX;
+export type DirectionType = keyof typeof DIRECTION_SX;
+export type GapType = Size;
+//# sourceMappingURL=constants.d.ts.map

package/dist/ui/Flex/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/ui/Flex/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAE/C,eAAO,MAAM,cAAc;;;;;CAKjB,CAAC;AAEX,eAAO,MAAM,kBAAkB;;;;;CAKrB,CAAC;AAEX,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;CAOT,CAAC;AAEX,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,cAAc,CAAC;AAEzD,MAAM,MAAM,mBAAmB,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAElE,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,YAAY,CAAC;AAEtD,MAAM,MAAM,OAAO,GAAG,IAAI,CAAC"}

package/dist/ui/Flex/constants.js

@@ -0,0 +1,27 @@
+const t = {
+  stretch: "items-stretch",
+  center: "items-center",
+  start: "items-start",
+  end: "items-end"
+}, e = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between"
+}, s = {
+  row: "flex-row",
+  col: "flex-col"
+}, n = {
+  none: "gap-0",
+  xs: "gap-1",
+  sm: "gap-2",
+  md: "gap-4",
+  lg: "gap-6",
+  xl: "gap-8"
+};
+export {
+  t as ALIGN_ITEMS_SX,
+  s as DIRECTION_SX,
+  n as GAP_SX,
+  e as JUSTIFY_CONTENT_SX
+};

package/dist/ui/IconButton/IconButton.d.ts

@@ -0,0 +1,19 @@
+import type { AriaAttributes, ComponentPropsWithRef, ElementType, ReactNode } from 'react';
+import type { Size } from '../../lib/sizes.js';
+export type IconButtonColor = 'primary' | 'secondary' | 'danger';
+type IconButtonOwnProps<T extends ElementType> = {
+    color?: IconButtonColor;
+    size?: Size;
+    isLoading?: boolean;
+    disabled?: boolean;
+    type?: 'button' | 'submit' | 'reset';
+    component?: T;
+    children?: ReactNode;
+    className?: string;
+    'aria-disabled'?: AriaAttributes['aria-disabled'];
+    'aria-busy'?: AriaAttributes['aria-busy'];
+};
+export type IconButtonProps<T extends ElementType = 'button'> = IconButtonOwnProps<T> & Omit<ComponentPropsWithRef<T>, keyof IconButtonOwnProps<T>>;
+export declare const IconButton: <T extends ElementType = "button">({ color, size, disabled, isLoading, component, children, className, type, onClick, onKeyDown, tabIndex, "aria-disabled": ariaDisabled, "aria-busy": ariaBusy, ...props }: IconButtonProps<T>) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=IconButton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/ui/IconButton/IconButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,qBAAqB,EAAE,WAAW,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAI/C,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,CAAC;AAEjE,KAAK,kBAAkB,CAAC,CAAC,SAAS,WAAW,IAAI;IAC/C,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,SAAS,CAAC,EAAE,CAAC,CAAC;IACd,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC;IAClD,WAAW,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;CAC3C,CAAC;AACF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,GAAG,QAAQ,IAC1D,kBAAkB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,MAAM,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtF,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,WAAW,GAAG,QAAQ,EAAE,0KAI1D,eAAe,CAAC,CAAC,CAAC,gCA8BpB,CAAC"}

package/dist/ui/IconButton/IconButton.js

@@ -0,0 +1,56 @@
+"use client";
+import { jsxs as g, jsx as l } from "react/jsx-runtime";
+import k from "clsx";
+import { CircularLoading as N } from "../CircularLoading/CircularLoading.js";
+import a from "./IconButton.module.css.js";
+const P = ({
+  color: m = "primary",
+  size: n = "md",
+  disabled: p = !1,
+  isLoading: r = !1,
+  component: c,
+  children: d,
+  className: u,
+  type: b = "button",
+  onClick: f,
+  onKeyDown: y,
+  tabIndex: h,
+  "aria-disabled": x,
+  "aria-busy": C,
+  ...D
+}) => {
+  const s = c || "button", o = p || r, i = s === "button", e = typeof s != "string";
+  return /* @__PURE__ */ g(
+    s,
+    {
+      ...D,
+      type: i || e ? b : void 0,
+      disabled: i || e ? o : void 0,
+      "aria-disabled": o || x,
+      "aria-busy": r || C,
+      tabIndex: !i && o ? -1 : h,
+      className: k(a.root, a[m], a[n], { [a.disabled]: o }, u),
+      onClick: (t) => {
+        if (o) {
+          t.preventDefault(), t.stopPropagation();
+          return;
+        }
+        f?.(t);
+      },
+      onKeyDown: (t) => {
+        if (o && (t.key === "Enter" || t.key === " ")) {
+          t.preventDefault(), t.stopPropagation();
+          return;
+        }
+        y?.(t);
+      },
+      children: [
+        /* @__PURE__ */ l("span", { className: a.content, style: { opacity: r ? 0 : 1 }, children: d }),
+        r && /* @__PURE__ */ l(N, { size: n, style: { width: "1em", height: "1em" }, className: a.loading, "aria-hidden": "true" })
+      ]
+    }
+  );
+};
+export {
+  P as IconButton
+};

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

@@ -0,0 +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,
+  md: n,
+  lg: s,
+  xl: t,
+  primary: d,
+  secondary: a,
+  danger: p,
+  disabled: r,
+  content: e,
+  loading: l
+};
+export {
+  e as content,
+  p as danger,
+  w as default,
+  r as disabled,
+  s as lg,
+  l as loading,
+  n as md,
+  d as primary,
+  _ as root,
+  a as secondary,
+  o as sm,
+  t as xl,
+  c as xs
+};

package/dist/ui/ProgressBar/ProgressBar.d.ts

@@ -0,0 +1,12 @@
+export interface ProgressBarProps {
+    current: {
+        value: number;
+        label?: string;
+    };
+    max: {
+        value: number;
+        label?: string;
+    };
+}
+export declare const ProgressBar: ({ current, max }: ProgressBarProps) => import("react").JSX.Element;
+//# sourceMappingURL=ProgressBar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../src/ui/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3C,GAAG,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACxC;AAED,eAAO,MAAM,WAAW,GAAI,kBAAkB,gBAAgB,gCA+B7D,CAAC"}

package/dist/ui/ProgressBar/ProgressBar.js

@@ -0,0 +1,34 @@
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import t from "clsx";
+import { Flex as r } from "../Flex/Flex.js";
+import { Text as o } from "../Text/Text.js";
+const b = ({ current: e, max: l }) => {
+  const i = Number.isFinite(e.value) && Number.isFinite(l.value) && l.value > 0 ? Math.min(100, Math.max(0, e.value * 100 / l.value)) : 0;
+  return /* @__PURE__ */ s(r, { direction: "col", className: "w-full", gap: "xs", children: [
+    /* @__PURE__ */ s(r, { justifyContent: "between", children: [
+      e.label && /* @__PURE__ */ a(o, { size: "sm", className: "text-gray-1", children: e.label }),
+      l.label && /* @__PURE__ */ a(o, { size: "sm", className: "text-gray-1", children: l.label })
+    ] }),
+    /* @__PURE__ */ a(
+      r,
+      {
+        className: "gap-0 bg-gray-2 rounded-full overflow-hidden",
+        role: "progressbar",
+        "aria-label": e.label,
+        "aria-valuemin": 0,
+        "aria-valuemax": 100,
+        "aria-valuenow": Math.round(i),
+        children: /* @__PURE__ */ a(
+          r,
+          {
+            className: t("gap-0 h-1.5 rounded-full", e.value > l.value ? "bg-error-1" : "bg-primary-1"),
+            style: { width: `${i}%` }
+          }
+        )
+      }
+    )
+  ] });
+};
+export {
+  b as ProgressBar
+};

package/dist/ui/Skeleton/Skeleton.d.ts

@@ -0,0 +1,8 @@
+export interface SkeletonProps {
+    width?: string | number;
+    height?: string | number;
+    borderRadius?: string | number;
+    className?: string;
+}
+export declare const Skeleton: ({ width, height, borderRadius, className }: SkeletonProps) => import("react").JSX.Element;
+//# sourceMappingURL=Skeleton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/ui/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,GAAI,4CAAqD,aAAa,gCAQ1F,CAAC"}

package/dist/ui/Skeleton/Skeleton.js

@@ -0,0 +1,14 @@
+import { jsx as m } from "react/jsx-runtime";
+import i from "clsx";
+import c from "./Skeleton.module.css.js";
+const p = ({ width: o, height: r = 16, borderRadius: t = 4, className: e }) => {
+  const s = {
+    width: o,
+    height: r,
+    borderRadius: t
+  };
+  return /* @__PURE__ */ m("div", { "aria-hidden": "true", className: i(c.root, e), style: s });
+};
+export {
+  p as Skeleton
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_1rkuv_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

package/dist/ui/Text/Text.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentProps } from "react";
+declare const WEIGHTS_MAP: {
+    readonly thin: "font-thin";
+    readonly extralight: "font-extralight";
+    readonly light: "font-light";
+    readonly normal: "font-normal";
+    readonly medium: "font-medium";
+    readonly semibold: "font-semibold";
+    readonly bold: "font-bold";
+    readonly extrabold: "font-extrabold";
+    readonly black: "font-black";
+};
+declare const FONT_SIZES: {
+    readonly xs: "text-xs";
+    readonly sm: "text-sm";
+    readonly md: "text-base";
+    readonly lg: "text-lg";
+    readonly xl: "text-xl";
+    readonly "2xl": "text-2xl";
+    readonly "3xl": "text-3xl";
+    readonly "4xl": "text-4xl";
+    readonly inherit: "";
+};
+export interface TextProps extends ComponentProps<"span"> {
+    size?: keyof typeof FONT_SIZES;
+    weight?: keyof typeof WEIGHTS_MAP;
+}
+export declare const Text: ({ children, weight, size, className, ...props }: TextProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=Text.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/ui/Text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,QAAA,MAAM,WAAW;;;;;;;;;;CAUP,CAAC;AAEX,QAAA,MAAM,UAAU;;;;;;;;;;CAUN,CAAC;AAEX,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,MAAM,CAAC;IACvD,IAAI,CAAC,EAAE,MAAM,OAAO,UAAU,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;CACnC;AAED,eAAO,MAAM,IAAI,GAAI,iDAMlB,SAAS,gCASX,CAAC"}

package/dist/ui/Text/Text.js

@@ -0,0 +1,39 @@
+import { jsx as n } from "react/jsx-runtime";
+import { twMerge as m } from "tailwind-merge";
+const r = {
+  thin: "font-thin",
+  extralight: "font-extralight",
+  light: "font-light",
+  normal: "font-normal",
+  medium: "font-medium",
+  semibold: "font-semibold",
+  bold: "font-bold",
+  extrabold: "font-extrabold",
+  black: "font-black"
+}, i = {
+  xs: "text-xs",
+  sm: "text-sm",
+  md: "text-base",
+  lg: "text-lg",
+  xl: "text-xl",
+  "2xl": "text-2xl",
+  "3xl": "text-3xl",
+  "4xl": "text-4xl",
+  inherit: ""
+}, f = ({
+  children: t,
+  weight: l = "normal",
+  size: o = "md",
+  className: x,
+  ...e
+}) => /* @__PURE__ */ n(
+  "span",
+  {
+    className: m(i[o], r[l], x),
+    ...e,
+    children: t
+  }
+);
+export {
+  f as Text
+};

package/dist/ui/index.d.ts

@@ -0,0 +1,10 @@
+export { Text, type TextProps } from "./Text/Text.js";
+export { Flex, type FlexProps } from "./Flex/Flex.js";
+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";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +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"}

package/package.json

@@ -1,6 +1,55 @@
 {
   "name": "@divayth/brick-ui",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.0.1",
+  "description": "React components for Brick UI",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./dist/styles.css"
+  },
+  "scripts": {
+    "build": "vite build && tsc -p tsconfig.build.json",
+    "typecheck": "tsc --noEmit",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "prepack": "npm run build"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "tailwind-merge": "^3.7.0"
+  },
+  "devDependencies": {
+    "@fontsource-variable/inter": "^5.3.0",
+    "@storybook/addon-docs": "^10.3.6",
+    "@storybook/react-vite": "^10.3.6",
+    "@tailwindcss/vite": "^4.0.0",
+    "@types/node": "^22.0.0",
+    "@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",
+    "storybook": "^10.3.6",
+    "tailwindcss": "^4.0.0",
+    "typescript": "^5.0.0",
+    "vite": "^7.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}