@accelint/design-toolkit 2.5.0 → 2.6.0

package/dist/styles.css

@@ -406,9 +406,6 @@
   .top-\[var\(--classification-banner-height\)\] {
     top: var(--classification-banner-height);
   }
-  .right-xs {
-    right: var(--spacing-xs);
-  }
   .left-1\/2 {
     left: calc(1/2 * 100%);
   }
@@ -514,9 +511,15 @@
       max-width: 96rem;
     }
   }
+  .m-xl {
+    margin: var(--spacing-xl);
+  }
   .m-xs {
     margin: var(--spacing-xs);
   }
+  .-mx-xs {
+    margin-inline: calc(var(--spacing-xs) * -1);
+  }
   .my-s {
     margin-block: var(--spacing-s);
   }
@@ -526,9 +529,6 @@
   .mt-l {
     margin-top: var(--spacing-l);
   }
-  .mt-m {
-    margin-top: var(--spacing-m);
-  }
   .mt-oversized {
     margin-top: var(--spacing-oversized);
   }
@@ -550,6 +550,9 @@
   .mb-xs {
     margin-bottom: var(--spacing-xs);
   }
+  .-ml-s {
+    margin-left: calc(var(--spacing-s) * -1);
+  }
   .block {
     display: block;
   }
@@ -620,9 +623,6 @@
   .h-\[90px\] {
     height: 90px;
   }
-  .h-\[300px\] {
-    height: 300px;
-  }
   .h-\[600px\] {
     height: 600px;
   }
@@ -641,6 +641,9 @@
   .h-m {
     height: var(--spacing-m);
   }
+  .h-oversized {
+    height: var(--spacing-oversized);
+  }
   .h-s {
     height: var(--spacing-s);
   }
@@ -665,12 +668,6 @@
   .min-h-\[1lh\] {
     min-height: 1lh;
   }
-  .w-\(--trigger-width\) {
-    width: var(--trigger-width);
-  }
-  .w-\(--trigger-width\) {
-    width: var(--trigger-width);
-  }
   .w-1\/2 {
     width: calc(1/2 * 100%);
   }
@@ -773,6 +770,9 @@
   .w-content {
     width: fit-content;
   }
+  .w-dvh {
+    width: 100dvh;
+  }
   .w-fit {
     width: fit-content;
   }
@@ -800,6 +800,9 @@
   .max-w-\[720px\] {
     max-width: 720px;
   }
+  .min-w-\(--trigger-width\) {
+    min-width: var(--trigger-width);
+  }
   .min-w-0 {
     min-width: var(--spacing-0);
   }
@@ -809,9 +812,15 @@
   .min-w-\[320px\] {
     min-width: 320px;
   }
+  .min-w-\[calc\(var\(--trigger-width\)\+\(var\(--spacing-s\)\*2\)\)\] {
+    min-width: calc(var(--trigger-width) + (var(--spacing-s) * 2));
+  }
   .min-w-sm {
     min-width: var(--container-sm);
   }
+  .min-w-xl {
+    min-width: var(--spacing-xl);
+  }
   .flex-1 {
     flex: 1;
   }
@@ -840,9 +849,6 @@
     --tw-translate-y: 50%;
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
-  .rotate-180 {
-    rotate: 180deg;
-  }
   .transform {
     transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
   }
@@ -1080,6 +1086,14 @@
     border-style: var(--tw-border-style);
     border-width: 2px;
   }
+  .border-b-\[3px\] {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 3px;
+  }
+  .border-dotted {
+    --tw-border-style: dotted;
+    border-style: dotted;
+  }
   .border-\[\#E8178A\] {
     border-color: #E8178A;
   }
@@ -1125,6 +1139,9 @@
   .border-transparent {
     border-color: transparent;
   }
+  .border-b-default-dark {
+    border-bottom-color: var(--color-default-dark);
+  }
   .bg-\[\#E8178A\]\/40 {
     background-color: color-mix(in oklab, #E8178A 40%, transparent);
   }
@@ -1278,9 +1295,6 @@
   .object-center {
     object-position: center;
   }
-  .p-0 {
-    padding: var(--spacing-0);
-  }
   .p-l {
     padding: var(--spacing-l);
   }
@@ -1293,9 +1307,15 @@
   .p-xl {
     padding: var(--spacing-xl);
   }
+  .p-xs {
+    padding: var(--spacing-xs);
+  }
   .p-xxs {
     padding: var(--spacing-xxs);
   }
+  .px-0 {
+    padding-inline: var(--spacing-0);
+  }
   .px-l {
     padding-inline: var(--spacing-l);
   }
@@ -1320,9 +1340,6 @@
   .pt-xs {
     padding-top: var(--spacing-xs);
   }
-  .pr-\[32px\] {
-    padding-right: 32px;
-  }
   .pr-\[calc\(var\(--room\)\+var\(--spacing-s\)\)\] {
     padding-right: calc(var(--room) + var(--spacing-s));
   }
@@ -1537,9 +1554,6 @@
   .text-default-light {
     color: var(--color-default-light);
   }
-  .text-disabled {
-    color: var(--color-disabled);
-  }
   .text-highlight {
     color: var(--color-highlight);
   }
@@ -1610,9 +1624,6 @@
   .outline-interactive {
     outline-color: var(--color-interactive);
   }
-  .outline-interactive-disabled {
-    outline-color: var(--color-interactive-disabled);
-  }
   .outline-normal {
     outline-color: var(--color-normal);
   }
@@ -1725,9 +1736,11 @@
   .text-shadow-2xs {
     text-shadow: 0px 1px 0px var(--tw-text-shadow-color, rgb(0 0 0 / 0.15));
   }
-  .group-not-focus-within\/input\:hidden {
-    &:is(:where(.group\/input):not(*:where([data-focus-within], :focus-within)) *) {
-      display: none;
+  .group-not-empty\/input\:group-not-focus-within\/input\:invisible {
+    &:is(:where(.group\/input):not(*:where([data-empty], :empty)) *) {
+      &:is(:where(.group\/input):not(*:where([data-focus-within], :focus-within)) *) {
+        visibility: hidden;
+      }
     }
   }
   .group-not-has-\[\>_\[slot\=description\]\]\/menu-item\:row-span-full {
@@ -1735,6 +1748,16 @@
       grid-row: 1 / -1;
     }
   }
+  .group-open\/combobox-field\:rotate-180 {
+    &:is(:where(.group\/combobox-field):where([open], [data-open], :open) *) {
+      rotate: 180deg;
+    }
+  }
+  .group-open\/combobox-field\:transform {
+    &:is(:where(.group\/combobox-field):where([open], [data-open], :open) *) {
+      transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
+    }
+  }
   .group-open\/drawer\:flex {
     &:is(:where(.group\/drawer):where([open], [data-open], :open) *) {
       display: flex;
@@ -1745,6 +1768,16 @@
       rotate: 180deg;
     }
   }
+  .group-open\/select-field\:rotate-180 {
+    &:is(:where(.group\/select-field):where([open], [data-open], :open) *) {
+      rotate: 180deg;
+    }
+  }
+  .group-empty\/input\:invisible {
+    &:is(:where(.group\/input):where([data-empty], :empty) *) {
+      visibility: hidden;
+    }
+  }
   .group-empty\/search-field\:invisible {
     &:is(:where(.group\/search-field):where([data-empty], :empty) *) {
       visibility: hidden;
@@ -1814,6 +1847,19 @@
       }
     }
   }
+  .group-enabled\/combobox-field\:fg-default-light {
+    &:is(:where(.group\/combobox-field):where(:not([disabled], [data-disabled]), :enabled) *) {
+      color: var(--color-default-light);
+      --icon-color: var(--color-default-light);
+    }
+  }
+  .group-enabled\/combobox-field\:group-invalid\/combobox-field\:outline-serious {
+    &:is(:where(.group\/combobox-field):where(:not([disabled], [data-disabled]), :enabled) *) {
+      &:is(:where(.group\/combobox-field):where([invalid], [data-invalid], :invalid) *) {
+        outline-color: var(--color-serious);
+      }
+    }
+  }
   .group-enabled\/options-item\:fg-default-dark {
     &:is(:where(.group\/options-item):where(:not([disabled], [data-disabled]), :enabled) *) {
       color: var(--color-default-dark);
@@ -1921,6 +1967,17 @@
       }
     }
   }
+  .group-disabled\/combobox-field\:fg-disabled {
+    &:is(:where(.group\/combobox-field):where([disabled], [data-disabled], :disabled) *) {
+      color: var(--color-disabled);
+      --icon-color: var(--color-disabled);
+    }
+  }
+  .group-disabled\/combobox-field\:outline-interactive-disabled {
+    &:is(:where(.group\/combobox-field):where([disabled], [data-disabled], :disabled) *) {
+      outline-color: var(--color-interactive-disabled);
+    }
+  }
   .group-disabled\/date-field\:fg-disabled {
     &:is(:where(.group\/date-field):where([disabled], [data-disabled], :disabled) *) {
       color: var(--color-disabled);
@@ -1959,6 +2016,12 @@
       visibility: hidden;
     }
   }
+  .group-disabled\/select-field\:fg-disabled {
+    &:is(:where(.group\/select-field):where([disabled], [data-disabled], :disabled) *) {
+      color: var(--color-disabled);
+      --icon-color: var(--color-disabled);
+    }
+  }
   .group-disabled\/switch\:bg-interactive-disabled {
     &:is(:where(.group\/switch):where([disabled], [data-disabled], :disabled) *) {
       background-color: var(--color-interactive-disabled);
@@ -2343,6 +2406,14 @@
       padding-bottom: var(--spacing-s);
     }
   }
+  .group-size-medium\/combobox-field\:text-body-s {
+    &:is(:where(.group\/combobox-field):where([data-size="medium"]) *) {
+      font-size: var(--typography-body-s-size);
+      font-weight: 400;
+      letter-spacing: var(--typography-body-s-spacing);
+      line-height: var(--typography-body-s-height);
+    }
+  }
   .group-size-medium\/input\:mr-xs {
     &:is(:where(.group\/input):where([data-size="medium"]) *) {
       margin-right: var(--spacing-xs);
@@ -2381,6 +2452,16 @@
       line-height: var(--typography-body-s-height);
     }
   }
+  .group-size-medium\/select-field\:min-w-\[220px\] {
+    &:is(:where(.group\/select-field):where([data-size="medium"]) *) {
+      min-width: 220px;
+    }
+  }
+  .group-size-medium\/select-field\:gap-s {
+    &:is(:where(.group\/select-field):where([data-size="medium"]) *) {
+      gap: var(--spacing-s);
+    }
+  }
   .group-size-medium\/text-area-field\:text-body-s {
     &:is(:where(.group\/text-area-field):where([data-size="medium"]) *) {
       font-size: var(--typography-body-s-size);
@@ -2389,6 +2470,14 @@
       line-height: var(--typography-body-s-height);
     }
   }
+  .group-size-small\/combobox-field\:text-body-xs {
+    &:is(:where(.group\/combobox-field):where([data-size="small"]) *) {
+      font-size: var(--typography-body-xs-size);
+      font-weight: 400;
+      letter-spacing: var(--typography-body-xs-spacing);
+      line-height: var(--typography-body-xs-height);
+    }
+  }
   .group-size-small\/input\:mr-xxs {
     &:is(:where(.group\/input):where([data-size="small"]) *) {
       margin-right: var(--spacing-xxs);
@@ -2432,6 +2521,11 @@
       padding-bottom: var(--spacing-xs);
     }
   }
+  .group-size-small\/select-field\:gap-xs {
+    &:is(:where(.group\/select-field):where([data-size="small"]) *) {
+      gap: var(--spacing-xs);
+    }
+  }
   .group-size-small\/text-area-field\:text-body-xs {
     &:is(:where(.group\/text-area-field):where([data-size="small"]) *) {
       font-size: var(--typography-body-xs-size);
@@ -2685,9 +2779,12 @@
       color: var(--color-default-dark);
     }
   }
-  .placeholder\:text-disabled {
-    &::placeholder {
-      color: var(--color-disabled);
+  .group-enabled\/combobox-field\:placeholder\:fg-default-dark {
+    &:is(:where(.group\/combobox-field):where(:not([disabled], [data-disabled]), :enabled) *) {
+      &::placeholder {
+        color: var(--color-default-dark);
+        --icon-color: var(--color-default-dark);
+      }
     }
   }
   .group-disabled\/text-area-field\:placeholder\:text-disabled {
@@ -2854,34 +2951,6 @@
       outline-color: var(--color-serious);
     }
   }
-  .not-disabled\:read-only\:rounded-none {
-    &:not(*:where([disabled], [data-disabled], :disabled)) {
-      &:where([readonly], [data-readonly], :read-only) {
-        border-radius: 0;
-      }
-    }
-  }
-  .not-disabled\:read-only\:rounded-none {
-    &:not(*:where([disabled], [data-disabled], :disabled)) {
-      &:where([readonly], [data-readonly], :read-only) {
-        border-radius: var(--radius-none);
-      }
-    }
-  }
-  .not-disabled\:read-only\:p-0 {
-    &:not(*:where([disabled], [data-disabled], :disabled)) {
-      &:where([readonly], [data-readonly], :read-only) {
-        padding: var(--spacing-0);
-      }
-    }
-  }
-  .not-disabled\:read-only\:outline-transparent {
-    &:not(*:where([disabled], [data-disabled], :disabled)) {
-      &:where([readonly], [data-readonly], :read-only) {
-        outline-color: transparent;
-      }
-    }
-  }
   .empty\:hidden {
     &:where([data-empty], :empty) {
       display: none;
@@ -2910,6 +2979,13 @@
       }
     }
   }
+  .group-enabled\/combobox-field\:focus-within\:outline-highlight {
+    &:is(:where(.group\/combobox-field):where(:not([disabled], [data-disabled]), :enabled) *) {
+      &:where([data-focus-within], :focus-within) {
+        outline-color: var(--color-highlight);
+      }
+    }
+  }
   .hover\:\!bg-transparent {
     &:where([data-hovered], :hover) {
       background-color: transparent !important;
@@ -2961,19 +3037,17 @@
       }
     }
   }
-  .group-enabled\/text-area-field\:hover\:outline-interactive-hover {
-    &:is(:where(.group\/text-area-field):where(:not([disabled], [data-disabled]), :enabled) *) {
+  .group-enabled\/combobox-field\:hover\:outline-interactive-hover {
+    &:is(:where(.group\/combobox-field):where(:not([disabled], [data-disabled]), :enabled) *) {
       &:where([data-hovered], :hover) {
         outline-color: var(--color-interactive-hover);
       }
     }
   }
-  .not-disabled\:read-only\:hover\:outline-transparent {
-    &:not(*:where([disabled], [data-disabled], :disabled)) {
-      &:where([readonly], [data-readonly], :read-only) {
-        &:where([data-hovered], :hover) {
-          outline-color: transparent;
-        }
+  .group-enabled\/text-area-field\:hover\:outline-interactive-hover {
+    &:is(:where(.group\/text-area-field):where(:not([disabled], [data-disabled]), :enabled) *) {
+      &:where([data-hovered], :hover) {
+        outline-color: var(--color-interactive-hover);
       }
     }
   }
@@ -3021,11 +3095,6 @@
       outline-width: 4px;
     }
   }
-  .focus\:outline-highlight {
-    &:where([data-focused], :focus) {
-      outline-color: var(--color-highlight);
-    }
-  }
   .focus\:outline-interactive-hover {
     &:where([data-focused], :focus) {
       outline-color: var(--color-interactive-hover);
@@ -3044,15 +3113,6 @@
       }
     }
   }
-  .not-disabled\:read-only\:focus\:outline-transparent {
-    &:not(*:where([disabled], [data-disabled], :disabled)) {
-      &:where([readonly], [data-readonly], :read-only) {
-        &:where([data-focused], :focus) {
-          outline-color: transparent;
-        }
-      }
-    }
-  }
   .enabled\:cursor-pointer {
     &:where(:not([disabled], [data-disabled]), :enabled) {
       cursor: pointer;
@@ -3145,6 +3205,13 @@
       }
     }
   }
+  .group-invalid\/select-field\:enabled\:outline-serious {
+    &:is(:where(.group\/select-field):where([invalid], [data-invalid], :invalid) *) {
+      &:where(:not([disabled], [data-disabled]), :enabled) {
+        outline-color: var(--color-serious);
+      }
+    }
+  }
   .enabled\:group-hover\/input\:outline-interactive-hover {
     &:where(:not([disabled], [data-disabled]), :enabled) {
       &:is(:where(.group\/input):where([data-hovered], :hover) *) {
@@ -3159,6 +3226,13 @@
       }
     }
   }
+  .group-focus\/select-field\:enabled\:outline-highlight-bold {
+    &:is(:where(.group\/select-field):where([data-focused], :focus) *) {
+      &:where(:not([disabled], [data-disabled]), :enabled) {
+        outline-color: var(--color-highlight-bold);
+      }
+    }
+  }
   .enabled\:hover\:bg-critical-hover {
     &:where(:not([disabled], [data-disabled]), :enabled) {
       &:where([data-hovered], :hover) {
@@ -3902,6 +3976,11 @@
       padding-block: var(--spacing-xs);
     }
   }
+  .size-small\:py-xxs {
+    &:where([data-size="small"]) {
+      padding-block: var(--spacing-xxs);
+    }
+  }
   .size-small\:text-body-xs {
     &:where([data-size="small"]) {
       font-size: var(--typography-body-xs-size);
@@ -4583,6 +4662,19 @@ body {
   .hide-cancel::-webkit-search-cancel-button {
     display: none;
   }
+  *::-webkit-scrollbar {
+    width: var(--spacing-l);
+    height: var(--spacing-l);
+  }
+  *::-webkit-scrollbar-track {
+    background: var(--color-interactive);
+  }
+  *::-webkit-scrollbar-thumb {
+    background-color: var(--color-interactive-hover-light);
+    border-radius: var(--radius-large);
+    border: 5px solid transparent;
+    background-clip: padding-box;
+  }
   .queryBuilder .rule-lines::before {
     content: '';
     width: 10px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@accelint/design-toolkit",
-  "version": "2.5.0",
+  "version": "2.6.0",
   "private": false,
   "license": "Apache-2.0",
   "repository": {
@@ -49,11 +49,14 @@
     }
   },
   "peerDependencies": {
-    "@accelint/icons": "^2.0.2",
+    "@accelint/bus": "^0.1.2",
+    "@accelint/core": "^0.3.0",
+    "@accelint/icons": "^2.0.3",
     "@fontsource/roboto-flex": "^5.2.6",
     "@fontsource/roboto-mono": "^5.2.6",
     "@internationalized/date": "^3.8.2",
     "@radix-ui/react-avatar": "^1.1.10",
+    "@react-aria/interactions": "^3.25.3",
     "@react-aria/ssr": "^3.9.10",
     "@react-aria/utils": "^3.30.0",
     "@react-stately/color": "^3.9.0",
@@ -61,7 +64,6 @@
     "@react-stately/utils": "^3.10.8",
     "@react-types/overlays": "^3.9.0",
     "@react-types/shared": "^3.31.0",
-    "@react-aria/interactions": "^3.25.3",
     "class-variance-authority": "^0.7.1",
     "client-only": "^0.0.1",
     "clsx": "^2.1.1",
@@ -73,6 +75,7 @@
     "tailwind-merge": "^3.3.1",
     "tailwind-variants": "^2.0.1",
     "tailwindcss": "^4.1.11",
+    "uuid": "^11.1.0",
     "zod": "^4.0.13"
   },
   "devDependencies": {
@@ -80,6 +83,7 @@
     "@fontsource/roboto-mono": "^5.2.6",
     "@internationalized/date": "^3.8.2",
     "@radix-ui/react-avatar": "^1.1.10",
+    "@react-aria/interactions": "^3.25.3",
     "@react-aria/ssr": "^3.9.10",
     "@react-aria/utils": "^3.30.0",
     "@react-stately/color": "^3.9.0",
@@ -103,7 +107,6 @@
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
     "@types/lodash": "^4.17.20",
-    "@react-aria/interactions": "^3.25.3",
     "@types/node": "^24.1.0",
     "@types/react": "^19.1.9",
     "@types/react-dom": "^19.1.7",
@@ -126,13 +129,15 @@
     "tsup": "^8.5.0",
     "type-fest": "^4.41.0",
     "typescript": "^5.8.3",
+    "uuid": "^11.1.0",
     "vite": "^5.4.9",
     "vite-tsconfig-paths": "^5.1.4",
     "vitest": "^2.1.3",
     "zod": "^4.0.13",
     "@accelint/biome-config": "0.1.2",
-    "@accelint/core": "0.2.2",
-    "@accelint/icons": "2.0.2",
+    "@accelint/bus": "0.1.2",
+    "@accelint/core": "0.3.0",
+    "@accelint/icons": "2.0.3",
     "@accelint/typescript-config": "0.1.2",
     "@accelint/vitest-config": "0.1.3"
   },

package/dist/components/combobox/index.d.ts

@@ -1,27 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import { VariantProps } from 'class-variance-authority';
-import { ReactNode } from 'react';
-import { ComboBoxProps as ComboBoxProps$1, VirtualizerProps, ListLayoutOptions } from 'react-aria-components';
-import { OptionsDataItem } from '../options/types.js';
-import '../icon/types.js';
-
-declare const textFieldStyles: (props?: ({
-    isDisabled?: boolean | null | undefined;
-    isInvalid?: boolean | null | undefined;
-    size?: "small" | "medium" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-interface ComboBoxProps<T extends OptionsDataItem> extends Omit<VariantProps<typeof textFieldStyles>, 'isDisabled' | 'isInvalid' | 'isReadOnly'>, Omit<ComboBoxProps$1<T>, 'children'>, Pick<VirtualizerProps<ListLayoutOptions>, 'layoutOptions'> {
-    className?: string;
-    children: ReactNode | ((item: T) => ReactNode);
-    description?: string;
-    errorMessage?: string;
-    label?: string;
-    placeholder?: string;
-}
-declare function ComboBox<T extends OptionsDataItem>({ children, className, description, errorMessage, isDisabled, isInvalid, isReadOnly, label, placeholder, layoutOptions, size, ...props }: ComboBoxProps<T>): react_jsx_runtime.JSX.Element;
-declare namespace ComboBox {
-    var displayName: string;
-}
-
-export { ComboBox, type ComboBoxProps };

package/dist/components/combobox/index.js

@@ -1,2 +0,0 @@
-import {jsx,jsxs,Fragment}from'react/jsx-runtime';import'client-only';import {cn}from'./../../lib/utils.js';import {ChevronDown}from'@accelint/icons';import {cva}from'class-variance-authority';import {ComboBox,Button,Text,Popover,Virtualizer,ListLayout,Input}from'react-aria-components';import {Icon}from'../icon/index.js';import {Label}from'../label/index.js';import {Options}from'../options/index.js';const S=cva(["block w-full rounded-medium py-xs pr-[32px] pl-s font-display outline outline-interactive","not-disabled:read-only:rounded-none not-disabled:read-only:p-0 not-disabled:read-only:outline-transparent not-disabled:read-only:hover:outline-transparent not-disabled:read-only:focus:outline-transparent"],{variants:{isDisabled:{true:"text-disabled outline-interactive-disabled placeholder:text-disabled",false:"text-default-light placeholder:text-default-dark hover:outline-interactive-hover focus:outline-highlight"},isInvalid:{true:"outline-serious"},size:{medium:"text-body-s",small:"text-body-xs"}},compoundVariants:[{isDisabled:true,isInvalid:true,className:"outline-interactive-disabled"}],defaultVariants:{size:"medium"}}),y=({className:a,isReadOnly:d=false,size:s="medium",...r})=>jsx(Input,{...r,className:({isDisabled:e,isInvalid:o})=>cn(S({isDisabled:e,isInvalid:o,size:s,className:a}))});y.displayName="ComboBox.Input";function D({children:a,className:d,description:s,errorMessage:r,isDisabled:e,isInvalid:o,isReadOnly:i,label:p,placeholder:b,layoutOptions:h,size:m="medium",...u}){const c=m==="small",A=!(c||o)||e,g=o&&!e&&!i,P=!c&&p;return jsx(ComboBox,{...u,isDisabled:e,isInvalid:o,isReadOnly:i,className:"flex flex-col gap-xs",children:({isDisabled:l,isOpen:v})=>jsxs(Fragment,{children:[P&&jsx(Label,{className:"empty:hidden",isDisabled:l,isRequired:u.isRequired,children:p}),jsxs("div",{className:"relative flex items-center",children:[jsx(y,{className:d,isReadOnly:i,placeholder:b,size:m}),jsx(Button,{className:cn(["fg-default-light absolute right-xs transform",l&&"fg-disabled",v&&"rotate-180",i&&"hidden"]),children:jsx(Icon,{size:"small",children:jsx(ChevronDown,{})})})]}),A&&jsx(Text,{className:cn(["fg-default-dark text-body-xs empty:hidden",l&&"fg-disabled"]),slot:"description",children:s}),g&&jsx(Text,{className:"fg-serious text-body-xs empty:hidden",slot:"errorMessage",children:r}),jsx(Popover,{className:"w-(--trigger-width)",children:jsx(Virtualizer,{layout:ListLayout,layoutOptions:h,children:jsx(Options,{children:a})})})]})})}D.displayName="ComboBox";export{D as ComboBox};//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/components/combobox/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/combobox/index.tsx"],"names":["N","isReadOnly","size","jsx","t","L","isInvalid","cn","n","Input","ComboBox","errorMessage","isDisabled","layoutOptions","shouldShowDescription","isSmall","shouldShowError","label","AriaComboBox","props","B","shouldShowLabel","jsxs","f","placeholder","AriaButton","O","Icon","ChevronDown","I","x","AriaText","V","Options","C","children","R"],"mappings":"mZAsCI,MAAA,CAAA,CAAAA,GAAA,CAAA,CAAA,6YAQM,CAAA,KAAA,CAAA,0GAKJ,CAAA,CAAM,SACI,CAAA,CAAA,IAAA,CAAA,iBACD,CAAA,CAAA,IAAA,CAAA,CAAA,MAGX,CAAA,aAAA,CAAkB,KAEd,CAAA,cACA,CAAA,CAAA,CAAA,gBACW,CAAA,CAAA,CAAA,UAAA,CAAA,IAAA,CAAA,SAAA,CAAA,IAAA,CACb,SAEF,CAAA,8BAYW,CACb,CAAA,CAAA,eACA,CAAA,CAAA,IAAAC,CAAAA,QACA,CAAAC,CAAAA,CAAO,CAAA,CAAA,CAAA,CAAA,CAAA,SAET,CAAA,CAAA,CAEIC,UAEE,CAAA,CAAA,CAAA,KAAA,CAAA,IAAW,CAAC,CAAE,CAAA,QAAA,CAAA,GAAY,CAAA,CAAA,GAAAC,GAAA,CAAAC,KAAA,CAAA,CAAAC,GAAU,CAAA,CAClCC,SAEI,CAAA,CAAA,CAAA,UACA,CAAA,CAAA,CAAA,SACA,CAAAL,CAAAA,CACA,GAAAM,EAAA,CAAA,CAAA,CAAA,CAAA,UAOZC,CAAM,CAAA,CAAA,SAAA,CAAc,kBAiBb,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAASC,CAAAA,CAAoC,YAElD,gBACA,CAAA,SACA,aAAAC,CAAAA,SACA,CAAA,CAAA,CAAAC,WACA,CAAAN,EACA,YAAAL,CACA,YACA,CAAA,CAAA,CAAA,SACA,CAAA,CAAA,CAAA,UAAAY,CACA,CAAA,CAAA,KAAO,cAET,CAAqB,CACnB,cAAyB,CAAA,CAAA,CAAA,IACnBC,CAAwB,EAAEC,QAAyBH,CACnDI,KAA+B,CAACJ,CAAAA,OACd,CAACG,CAAAA,GAAWE,OAEpC,CACEd,EAACe,EAAA,CACE,EAAA,CAAGC,CAAAA,aACQP,CACZ,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAAA,CAAWN,OACXF,GAAA,CAAAgB,QAAA,CAAA,CAAA,GACA,YAAU,CAAA,CAAA,CAAA,SAAA,CAAA,CAAA,CAAA,UAET,CAAA,CAAA,CAAA,SAAG,CAAA,uBACF,QACG,CAAA,CAAA,CAAAC,UAEG,CAAA,CAAA,CAAA,mCACA,CAAA,CAAA,CAAA,EAAAjB,GAAYQ,CAAAA,KACZ,WAAYO,CAAAA,cAEX,CAAA,UAGLG,CAAAA,CAAC,CAAA,UAAI,CAAA,CAAA,CAAA,UAAU,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAAC,IAAA,CAAA,KAAA,CACb,UAAApB,CAAAA,4BAEcF,CACZ,cAAauB,CAAAA,CACb,CAAA,SAEFrB,CAACsB,CAAAA,CAAA,WACYlB,CAAAA,CAAG,WACZ,CAAA,CAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAAH,GAAA,CAAAsB,MAAA,CAAA,CAAA,SAAA,CAAAlB,EAAA,CAAA,CAAA,8CAGc,CAAA,CAAA,EAAA,aAGhBL,EAACwB,EAAA,YAAU,CAAA,CACT,EAAA,QAAAxB,CAACyB,CAAAA,CAAA,QAEL,CACFxB,GAAA,CACCU,MACCX,IAAC,CACC,OAAA,CAAA,QACE,CAAAC,GAAA,CAAAyB,WAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAAzB,GAAA,CAAA0B,IAAA,CAAA,CAAA,SAAA,CAAAtB,EAAA,CAAA,CAAA,2CAKD,CAAA,CAAA,EAAA,aAIFuB,CAAAA,CAAA,CACC,kBAAU,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAA3B,GAAA,CAAA0B,IAAA,CAAA,CAAA,SACV,CAAA,sCAKS,CAAA,IAAA,CAAA,yBACX,CAAA,CAAA,CAAA1B,GAAA,CAAA4B,OAAA,CAAA,CAAA,+BAIE,CAAA,QAAA7B,IAAC8B,CAAAA,WAAA,CAAS,CAAA,MAAA,CAAAC,UAAAC,CAAAA,cAQf,CAAA,CAAA,QAAA,CAAA/B,GAAc,CAAAgC,OAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,WAAA,CAAA,UAAA","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { cn } from '@/lib/utils';\nimport { ChevronDown } from '@accelint/icons';\nimport { type VariantProps, cva } from 'class-variance-authority';\nimport type { ReactNode } from 'react';\nimport {\n  Button as AriaButton,\n  ComboBox as AriaComboBox,\n  type ComboBoxProps as AriaComboBoxProps,\n  Input as AriaInput,\n  type InputProps as AriaInputProps,\n  ListLayout as AriaListLayout,\n  type ListLayoutOptions as AriaListLayoutOptions,\n  Popover as AriaPopover,\n  Text as AriaText,\n  Virtualizer as AriaVirtualizer,\n  type VirtualizerProps as AriaVirtualizerProps,\n} from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\nimport { Options } from '../options';\nimport type { OptionsDataItem } from '../options/types';\n\nconst textFieldStyles = cva(\n  [\n    'block w-full rounded-medium py-xs pr-[32px] pl-s font-display outline outline-interactive',\n    'not-disabled:read-only:rounded-none not-disabled:read-only:p-0 not-disabled:read-only:outline-transparent not-disabled:read-only:hover:outline-transparent not-disabled:read-only:focus:outline-transparent',\n  ],\n  {\n    variants: {\n      isDisabled: {\n        true: 'text-disabled outline-interactive-disabled placeholder:text-disabled',\n        false:\n          'text-default-light placeholder:text-default-dark hover:outline-interactive-hover focus:outline-highlight',\n      },\n      isInvalid: {\n        true: 'outline-serious',\n      },\n      size: {\n        medium: 'text-body-s',\n        small: 'text-body-xs',\n      },\n    },\n    compoundVariants: [\n      {\n        isDisabled: true,\n        isInvalid: true,\n        className: 'outline-interactive-disabled',\n      },\n    ],\n    defaultVariants: {\n      size: 'medium',\n    },\n  },\n);\n\ninterface InputProps\n  extends VariantProps<typeof textFieldStyles>,\n    Omit<AriaInputProps, 'size'> {\n  isReadOnly?: boolean;\n}\n\nconst Input = ({\n  className,\n  isReadOnly = false,\n  size = 'medium',\n  ...props\n}: InputProps) => {\n  return (\n    <AriaInput\n      {...props}\n      className={({ isDisabled, isInvalid }) =>\n        cn(\n          textFieldStyles({\n            isDisabled,\n            isInvalid,\n            size,\n            className,\n          }),\n        )\n      }\n    />\n  );\n};\nInput.displayName = 'ComboBox.Input';\n\nexport interface ComboBoxProps<T extends OptionsDataItem>\n  extends Omit<\n      VariantProps<typeof textFieldStyles>,\n      'isDisabled' | 'isInvalid' | 'isReadOnly'\n    >,\n    Omit<AriaComboBoxProps<T>, 'children'>,\n    Pick<AriaVirtualizerProps<AriaListLayoutOptions>, 'layoutOptions'> {\n  className?: string;\n  children: ReactNode | ((item: T) => ReactNode);\n  description?: string;\n  errorMessage?: string;\n  label?: string;\n  placeholder?: string;\n}\n\nexport function ComboBox<T extends OptionsDataItem>({\n  children,\n  className,\n  description,\n  errorMessage,\n  isDisabled,\n  isInvalid,\n  isReadOnly,\n  label,\n  placeholder,\n  layoutOptions,\n  size = 'medium',\n  ...props\n}: ComboBoxProps<T>) {\n  const isSmall = size === 'small';\n  const shouldShowDescription = !(isSmall || isInvalid) || isDisabled;\n  const shouldShowError = isInvalid && !isDisabled && !isReadOnly;\n  const shouldShowLabel = !isSmall && label;\n\n  return (\n    <AriaComboBox<T>\n      {...props}\n      isDisabled={isDisabled}\n      isInvalid={isInvalid}\n      isReadOnly={isReadOnly}\n      className='flex flex-col gap-xs'\n    >\n      {({ isDisabled, isOpen }) => (\n        <>\n          {shouldShowLabel && (\n            <Label\n              className='empty:hidden'\n              isDisabled={isDisabled}\n              isRequired={props.isRequired}\n            >\n              {label}\n            </Label>\n          )}\n          <div className='relative flex items-center'>\n            <Input\n              className={className}\n              isReadOnly={isReadOnly}\n              placeholder={placeholder}\n              size={size}\n            />\n            <AriaButton\n              className={cn([\n                'fg-default-light absolute right-xs transform',\n                isDisabled && 'fg-disabled',\n                isOpen && 'rotate-180',\n                isReadOnly && 'hidden',\n              ])}\n            >\n              <Icon size='small'>\n                <ChevronDown />\n              </Icon>\n            </AriaButton>\n          </div>\n          {shouldShowDescription && (\n            <AriaText\n              className={cn([\n                'fg-default-dark text-body-xs empty:hidden',\n                isDisabled && 'fg-disabled',\n              ])}\n              slot='description'\n            >\n              {description}\n            </AriaText>\n          )}\n          {shouldShowError && (\n            <AriaText\n              className='fg-serious text-body-xs empty:hidden'\n              slot='errorMessage'\n            >\n              {errorMessage}\n            </AriaText>\n          )}\n          <AriaPopover className='w-(--trigger-width)'>\n            <AriaVirtualizer\n              layout={AriaListLayout}\n              layoutOptions={layoutOptions}\n            >\n              <Options>{children}</Options>\n            </AriaVirtualizer>\n          </AriaPopover>\n        </>\n      )}\n    </AriaComboBox>\n  );\n}\nComboBox.displayName = 'ComboBox';\n"]}

package/dist/components/navigation-stack/index.d.ts

@@ -1,20 +0,0 @@
-import * as react from 'react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { NavigationStackProps, NavigationStackViewProps, NavigationStackNavigateProps } from './types.js';
-import '@react-types/shared';
-import 'type-fest';
-
-declare const NavigationStack: {
-    ({ children, defaultViewId, }: NavigationStackProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    View: {
-        ({ id, children }: NavigationStackViewProps): react.ReactNode;
-        displayName: string;
-    };
-    Navigate: {
-        ({ children, for: action, ...props }: NavigationStackNavigateProps): react_jsx_runtime.JSX.Element;
-        displayName: string;
-    };
-};
-
-export { NavigationStack };

package/dist/components/navigation-stack/index.js

@@ -1,2 +0,0 @@
-import {jsx}from'react/jsx-runtime';import'client-only';import {createContext,useState,useCallback,useMemo,useContext}from'react';import {PressResponder}from'@react-aria/interactions';import {Pressable}from'react-aria-components';const c=createContext({currentViewId:null,pushView:()=>{},popView:()=>{},clear:()=>{},canGoBack:false,viewStack:[]}),u=({id:i,children:t})=>useContext(c).currentViewId===i?t:null;u.displayName="NavigationStack.View";const S=({children:i,for:t,...a})=>{const e=useContext(c),o=useCallback(()=>{t==="back"?e.popView():t==="clear"?e.clear():e.pushView(t);},[t,e.popView,e.clear,e.pushView]);return jsx(PressResponder,{onPress:o,children:jsx(Pressable,{...a,children:i})})};S.displayName="NavigationStack.Navigate";const r=({children:i,defaultViewId:t})=>{const[a,e]=useState(t?[t]:[]),o=a[a.length-1]||null,v=a.length>1,l=useCallback(s=>{e(w=>[...w,s]);},[]),g=useCallback(()=>{e(s=>s.slice(0,-1));},[]),N=useCallback(()=>{e(t?[t]:[]);},[t]),V=useMemo(()=>({currentViewId:o,pushView:l,popView:g,clear:N,canGoBack:v,viewStack:a}),[o,v,a,l,g,N]);return jsx(c.Provider,{value:V,children:i})};r.displayName="NavigationStack",r.View=u,r.Navigate=S;export{r as NavigationStack};//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map