@grasp-labs/ds-react-components 1.0.0 → 1.1.0

package/dist/{index.esm-C32CGj2t.js → index.esm-DDTEaO23.js}

@@ -1,4 +1,4 @@
-import { j as o } from "./index-DbrsXeBO.js";
+import { j as o } from "./index-3FfnDfv1.js";
 import { useState as G, useEffect as Oe, createContext as Xt, useRef as ce, useContext as Zt, useMemo as le, useCallback as Ie } from "react";
 const Be = (e, t, n, r, a) => {
   if (!r) throw new Error(a ?? `Invalid property path: ${t}

package/dist/index.js

@@ -1,4 +1,4 @@
-import { aj as o, A as e, c as n, ak as c, al as t, am as r, an as I, B as l, a as i, ao as d, af as b, e as C, f as g, ap as u, C as T, aq as B, V as D, ar as p, h as L, i as h, as as w, at as P, au as S, av as F, aw as f, ax as y, k as x, ay as E, az as m, aA as k, aB as A, aC as H, aD as v, ai as R, aE as M, aF as N, D as O, aG as U, aH as W, l as _, m as G, n as J, o as K, G as V, aI as Y, aJ as q, E as z, aK as Q, p as X, aL as Z, aN as $, F as j, r as aa, w as sa, q as oa, u as ea, s as na, x as ca, t as ta, aM as ra, aO as Ia, y as la, aa as ia, ab as da, ac as ba, ad as Ca, ae as ga, aP as ua, I as Ta, aQ as Ba, aR as Da, J as pa, K as La, ag as ha, aS as wa, aT as Pa, L as Sa, z as Fa, aU as fa, H as ya, M as xa, aV as Ea, N as ma, aW as ka, aX as Aa, Z as Ha, P as va, aY as Ra, aZ as Ma, O as Na, Q as Oa, a_ as Ua, R as Wa, a$ as _a, b0 as Ga, b1 as Ja, b2 as Ka, b3 as Va, U as Ya, b4 as qa, S as za, W as Qa, X as Xa, Y as Za, b5 as $a, a1 as ja, a2 as as, _ as ss, $ as os, a0 as es, b6 as ns, a3 as cs, a4 as ts, a5 as rs, a6 as Is, a7 as ls, a8 as is, a9 as ds, T as bs, ah as Cs, b7 as gs, b8 as us, b as Ts, d as Bs, g as Ds, b9 as ps, ba as Ls, v as hs } from "./index-DbrsXeBO.js";
+import { aj as o, A as e, c as n, ak as c, al as t, am as r, an as I, B as l, a as i, ao as d, af as b, e as C, ap as g, f as u, aq as B, C as T, ar as D, V as p, as as L, h, i as w, at as P, au as S, av as f, aw as F, ax as y, ay as x, k as E, az as m, aA as k, aB as A, aC as H, aD as v, aE as R, ai as M, aF as N, aG as U, D as O, aH as G, aI as W, l as _, m as J, n as K, o as V, G as Y, aJ as q, aK as z, E as Q, aL as X, p as Z, aM as $, aO as j, F as aa, r as sa, w as oa, q as ea, u as na, s as ca, x as ta, t as ra, aN as Ia, aP as la, y as ia, aQ as da, aa as ba, ab as Ca, ac as ga, ad as ua, ae as Ba, aR as Ta, I as Da, aS as pa, aT as La, J as ha, K as wa, ag as Pa, aU as Sa, aV as fa, L as Fa, z as ya, aW as xa, H as Ea, M as ma, aX as ka, N as Aa, aY as Ha, aZ as va, Z as Ra, P as Ma, a_ as Na, a$ as Ua, O as Oa, Q as Ga, b0 as Wa, R as _a, b1 as Ja, b2 as Ka, b3 as Va, b4 as Ya, b5 as qa, U as za, b6 as Qa, S as Xa, W as Za, X as $a, Y as ja, b7 as as, a1 as ss, a2 as os, _ as es, $ as ns, a0 as cs, b8 as ts, a3 as rs, a4 as Is, a5 as ls, a6 as is, a7 as ds, a8 as bs, a9 as Cs, T as gs, ah as us, b9 as Bs, ba as Ts, bb as Ds, b as ps, d as Ls, g as hs, bc as ws, bd as Ps, v as Ss } from "./index-3FfnDfv1.js";
 export {
   o as AddressIcon,
   e as Alert,
@@ -12,120 +12,123 @@ export {
   d as BellIcon,
   b as Body,
   C as Breadcrumb,
-  g as Button,
-  u as CalendarIcon,
+  g as BriefcaseIcon,
+  u as Button,
+  B as CalendarIcon,
   T as Card,
-  B as CautionIcon,
-  D as CenteredSpinner,
-  p as CheckIcon,
-  L as Checkbox,
-  h as CheckboxIcon,
-  w as ChevronDoubleLeftIcon,
-  P as ChevronDoubleRightIcon,
-  S as CircleIcon,
+  D as CautionIcon,
+  p as CenteredSpinner,
+  L as CheckIcon,
+  h as Checkbox,
+  w as CheckboxIcon,
+  P as ChevronDoubleLeftIcon,
+  S as ChevronDoubleRightIcon,
+  f as CircleIcon,
   F as ClockIcon,
-  f as CloseIcon,
-  y as CogWheelIcon,
-  x as ConfirmationDialog,
-  E as ConnectionIcon,
-  m as CopyIcon,
-  k as CorrectIcon,
-  A as DashIcon,
-  H as DashboardIcon,
-  v as DatabaseIcon,
-  R as DatePicker,
-  M as DeleteIcon,
-  N as DetailsIcon,
+  y as CloseIcon,
+  x as CogWheelIcon,
+  E as ConfirmationDialog,
+  m as ConnectionIcon,
+  k as CopyIcon,
+  A as CorrectIcon,
+  H as DashIcon,
+  v as DashboardIcon,
+  R as DatabaseIcon,
+  M as DatePicker,
+  N as DeleteIcon,
+  U as DetailsIcon,
   O as Dialog,
-  U as DownIcon,
+  G as DownIcon,
   W as DownloadIcon,
   _ as Drawer,
-  G as Dropdown,
-  J as DropdownItem,
-  K as DynamicIcon,
-  V as EMPTY_OPTION_ID,
-  Y as EarthIcon,
-  q as EditIcon,
-  z as ErrorBoundary,
-  Q as ErrorIcon,
-  X as ErrorPage,
-  Z as EyeIcon,
-  $ as EyeOffIcon,
-  j as Field,
-  aa as FieldContent,
-  sa as FieldGroup,
-  oa as FieldLabel,
-  ea as FieldLegend,
-  na as FieldMessage,
-  ca as FieldSeparator,
-  ta as FieldSet,
-  ra as FileIcon,
-  Ia as FilterIcon,
-  la as FlowTile,
-  ia as H1,
-  da as H2,
-  ba as H3,
-  Ca as H4,
-  ga as H5,
-  ua as HourglassIcon,
-  Ta as IconButton,
-  Ba as IdeaIcon,
-  Da as InfoIcon,
-  pa as JsonEditor,
-  La as KeyValueList,
-  ha as Label,
-  wa as LeftBarIcon,
-  Pa as LeftIcon,
-  Sa as Link,
-  Fa as List,
-  fa as ListIcon,
-  ya as ListItem,
-  xa as Logo,
-  Ea as MoreIcon,
-  ma as MultiSelect,
-  ka as NotepadIcon,
-  Aa as NotesIcon,
-  Ha as Pagination,
-  va as PasswordTextBox,
-  Ra as PlayIcon,
-  Ma as PlusIcon,
-  Na as Popover,
-  Oa as Portal,
-  Ua as ProfileIcon,
-  Wa as RadioButton,
-  _a as RecycleIcon,
-  Ga as ReloadIcon,
-  Ja as RightIcon,
-  Ka as SaveIcon,
-  Va as SearchIcon,
-  Ya as Select,
-  qa as ServerIcon,
-  za as Sidebar,
-  Qa as Spinner,
-  Xa as Step,
-  Za as Stepper,
-  $a as SuccessIcon,
-  ja as Tab,
-  as as TabPanel,
-  ss as Table,
-  os as TableCell,
-  es as TableHeaderCell,
-  ns as TableIcon,
-  cs as Tag,
-  ts as TagList,
-  rs as TextBox,
-  Is as Toast,
-  ls as Toaster,
-  is as ToggleButton,
-  ds as ToggleButtonTrack,
-  bs as Tooltip,
-  Cs as UnstyledButton,
-  gs as UpIcon,
-  us as WarningIcon,
-  Ts as baseClasses,
-  Bs as disabledClasses,
-  Ds as getBaseButtonClassName,
-  ps as icons,
-  Ls as useDropdownPosition,
-  hs as variantClasses
+  J as Dropdown,
+  K as DropdownItem,
+  V as DynamicIcon,
+  Y as EMPTY_OPTION_ID,
+  q as EarthIcon,
+  z as EditIcon,
+  Q as ErrorBoundary,
+  X as ErrorIcon,
+  Z as ErrorPage,
+  $ as EyeIcon,
+  j as EyeOffIcon,
+  aa as Field,
+  sa as FieldContent,
+  oa as FieldGroup,
+  ea as FieldLabel,
+  na as FieldLegend,
+  ca as FieldMessage,
+  ta as FieldSeparator,
+  ra as FieldSet,
+  Ia as FileIcon,
+  la as FilterIcon,
+  ia as FlowTile,
+  da as GlobeIcon,
+  ba as H1,
+  Ca as H2,
+  ga as H3,
+  ua as H4,
+  Ba as H5,
+  Ta as HourglassIcon,
+  Da as IconButton,
+  pa as IdeaIcon,
+  La as InfoIcon,
+  ha as JsonEditor,
+  wa as KeyValueList,
+  Pa as Label,
+  Sa as LeftBarIcon,
+  fa as LeftIcon,
+  Fa as Link,
+  ya as List,
+  xa as ListIcon,
+  Ea as ListItem,
+  ma as Logo,
+  ka as MoreIcon,
+  Aa as MultiSelect,
+  Ha as NotepadIcon,
+  va as NotesIcon,
+  Ra as Pagination,
+  Ma as PasswordTextBox,
+  Na as PlayIcon,
+  Ua as PlusIcon,
+  Oa as Popover,
+  Ga as Portal,
+  Wa as ProfileIcon,
+  _a as RadioButton,
+  Ja as RecycleIcon,
+  Ka as ReloadIcon,
+  Va as RightIcon,
+  Ya as SaveIcon,
+  qa as SearchIcon,
+  za as Select,
+  Qa as ServerIcon,
+  Xa as Sidebar,
+  Za as Spinner,
+  $a as Step,
+  ja as Stepper,
+  as as SuccessIcon,
+  ss as Tab,
+  os as TabPanel,
+  es as Table,
+  ns as TableCell,
+  cs as TableHeaderCell,
+  ts as TableIcon,
+  rs as Tag,
+  Is as TagList,
+  ls as TextBox,
+  is as Toast,
+  ds as Toaster,
+  bs as ToggleButton,
+  Cs as ToggleButtonTrack,
+  gs as Tooltip,
+  us as UnstyledButton,
+  Bs as UpIcon,
+  Ts as UserIcon,
+  Ds as WarningIcon,
+  ps as baseClasses,
+  Ls as disabledClasses,
+  hs as getBaseButtonClassName,
+  ws as icons,
+  Ps as useDropdownPosition,
+  Ss as variantClasses
 };

package/dist/tailwind-styles.css

@@ -106,7 +106,9 @@
 
   --spacing-full: 100%;
 
-  --shadow-md: 0 0 12px 2px rgba(100, 103, 198, 0.25);
+  --shadow-md: 0 1px 4px 0 #0c0c0d1a;
+  --shadow-lg: 0 4px 4px -1px #0c0c0d1a;
+  --shadow-xl: 0 16px 32px -4px #0c0c0d1a;
 
   --ease-default: ease-out;
   --default-transition-timing-function: var(--ease-default);
@@ -121,31 +123,51 @@
 }
 
 @theme inline {
+  /* Primary */
   --color-primary: var(--primary);
   --color-primary-light: var(--primary-light);
-  --color-primary-light-hover: var(--primary-light-hover);
-  --color-primary-super-light: var(--primary-super-light);
   --color-primary-dark: var(--primary-dark);
+  --color-primary-contrast: var(--primary-contrast);
+
+  /* Secondary */
   --color-secondary: var(--secondary);
   --color-secondary-light: var(--secondary-light);
   --color-secondary-dark: var(--secondary-dark);
+  --color-secondary-contrast: var(--secondary-contrast);
+
+  /* Border */
+  --color-border: var(--border);
+
+  /* Text */
   --color-text: var(--text);
-  --color-text-contrast: var(--text-contrast);
   --color-text-disabled: var(--text-disabled);
+
+  /* Background */
   --color-background: var(--background);
   --color-background-disabled: var(--background-disabled);
-  --color-background-success: var(--background-success);
-  --color-background-error: var(--background-error);
-  --color-background-warning: var(--background-warning);
-  --color-contrast: var(--contrast);
+
+  /* Info */
+  --color-info: var(--info);
+  --color-info-contrast: var(--info-contrast);
+  --color-info-dark: var(--info-dark);
+
+  /* Error */
   --color-error: var(--error);
   --color-error-light: var(--error-light);
   --color-error-dark: var(--error-dark);
-  --color-error-darker: var(--error-darker);
+  --color-error-contrast: var(--error-contrast);
+
+  /* Success */
   --color-success: var(--success);
+  --color-success-contrast: var(--success-contrast);
+  --color-success-dark: var(--success-dark);
+
+  /* Warning */
   --color-warning: var(--warning);
-  --color-shade: var(--shade);
-  --color-shade-light: var(--shade-light);
+  --color-warning-contrast: var(--warning-contrast);
+  --color-warning-dark: var(--warning-dark);
+
+  /* Utils */
   --color-mask: var(--mask);
 
   --font-inter: var(--inter);
@@ -162,61 +184,102 @@
 :root {
   --inter: Inter, sans-serif;
   --font-base: 16px;
-  --primary: #2a2a2a;
-  --primary-light: #5c5c5c;
-  --primary-light-hover: #6e6e6e;
-  --primary-super-light: #e0e0df;
-  --primary-dark: #111111;
-  --secondary: #8b8b8b;
-  --secondary-light: #a5a5a5;
-  --secondary-dark: #727272;
+
+  /* Primary */
+  --primary: rgb(40, 40, 40);
+  --primary-light: rgb(80, 80, 80);
+  --primary-dark: rgb(10, 10, 10);
+  --primary-contrast: #f8f7f6;
+
+  /* Secondary */
+  --secondary: rgb(220, 220, 220);
+  --secondary-light: rgb(170, 170, 170);
+  --secondary-dark: rgb(120, 120, 120);
+  --secondary-contrast: #f8f7f6;
+
+  /* Border */
+  --border: #f2f4f7;
+
+  /* Text */
   --text: #1e1e1e;
-  --text-contrast: #f8f7f6;
-  --text-disabled: #acaaa9;
+  --text-disabled: #757575;
+
+  /* Background */
   --background: #ffffff;
-  --background-disabled: #eaeaea;
-  --background-error: #ff4d4f1a;
-  --background-success: #52c41a1a;
-  --background-warning: #ffa5001a;
-  --contrast: #ffffff;
+  --background-disabled: #f5f5f5;
+
+  /* Info */
+  --info: #00a4d2;
+  --info-dark: #0f5b73;
+  --info-contrast: #f4f8fa;
+
+  /* Error */
   --error: #ec221f;
-  --error-light: #fdd3d0;
-  --error-dark: #c00f0c;
-  --error-darker: #900b09;
-  --success: #52c41a;
+  --error-light: #c00f0c;
+  --error-dark: #900b09;
+  --error-contrast: #fee9e7;
+
+  /* Success */
+  --success: #009951;
+  --success-dark: #02542d;
+  --success-contrast: #ebffee;
+
+  /* Warning */
   --warning: #ffa500;
-  --shade: #d1d1d1;
-  --shade-light: #f3f2f4;
+  --warning-dark: #682d03;
+  --warning-contrast: #fffbeb;
+
+  /* Utils */
   --mask: #2a2a2a73;
 }
 
 .dark {
+  /* Primary */
   --primary: #e0e0df;
   --primary-light: #b8b8b8;
-  --primary-light-hover: #c8c8c8;
-  --primary-super-light: #3a3a3a;
-  --primary-dark: #f9f9f9;
-  --secondary: #8b8b8b;
+  --primary-dark: #c8c8c8;
+  --primary-contrast: #2b292a;
+
+  /* Secondary */
+  --secondary: #4f4f4f;
   --secondary-light: #a5a5a5;
   --secondary-dark: #727272;
+  --secondary-contrast: #2b292a;
+
+  /* Border */
+  --border: #f2f4f7;
+
+  /* Text */
   --text: #f8f7f6;
-  --text-contrast: #2b292a;
   --text-disabled: #6b6b6b;
+
+  /* Background */
   --background: #1a1a1a;
   --background-disabled: #2a2a2a;
-  --background-error: #ff4d4f1a;
-  --background-success: #52c41a1a;
-  --background-warning: #ffa5001a;
-  --contrast: #2a2a2a;
+
+  /* Info */
+  --info: #00a4d2;
+  --info-dark: #0f5b73;
+  --info-contrast: #f4f8fa;
+
+  /* Error */
   --error: #ec221f;
-  --error-light: #fdd3d0;
-  --error-dark: #c00f0c;
-  --error-darker: #900b09;
-  --success: #6fdb3f;
-  --warning: #ffb733;
-  --shade: #3f3f3f;
-  --shade-light: #2f2f2f;
-  --mask: #ffffff73;
+  --error-light: #c00f0c;
+  --error-dark: #900b09;
+  --error-contrast: #fee9e7;
+
+  /* Success */
+  --success: #009951;
+  --success-dark: #02542d;
+  --success-contrast: #ebffee;
+
+  /* Warning */
+  --warning: #ffa500;
+  --warning-dark: #682d03;
+  --warning-contrast: #fffbeb;
+
+  /* Utils */
+  --mask: #000000b2;
 }
 
 body {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grasp-labs/ds-react-components",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "private": false,
   "license": "Apache-2.0",
   "type": "module",