@elizaos/ui 2.0.0-alpha.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +6 -0
  3. package/dist/components/ui/badge.d.ts +10 -0
  4. package/dist/components/ui/badge.d.ts.map +1 -0
  5. package/dist/components/ui/badge.js +20 -0
  6. package/dist/components/ui/banner.d.ts +18 -0
  7. package/dist/components/ui/banner.d.ts.map +1 -0
  8. package/dist/components/ui/banner.js +27 -0
  9. package/dist/components/ui/button.d.ts +12 -0
  10. package/dist/components/ui/button.d.ts.map +1 -0
  11. package/dist/components/ui/button.js +33 -0
  12. package/dist/components/ui/card.d.ts +9 -0
  13. package/dist/components/ui/card.d.ts.map +1 -0
  14. package/dist/components/ui/card.js +16 -0
  15. package/dist/components/ui/chat-atoms.d.ts +26 -0
  16. package/dist/components/ui/chat-atoms.d.ts.map +1 -0
  17. package/dist/components/ui/chat-atoms.js +17 -0
  18. package/dist/components/ui/checkbox.d.ts +5 -0
  19. package/dist/components/ui/checkbox.d.ts.map +1 -0
  20. package/dist/components/ui/checkbox.js +8 -0
  21. package/dist/components/ui/confirm-delete.d.ts +12 -0
  22. package/dist/components/ui/confirm-delete.d.ts.map +1 -0
  23. package/dist/components/ui/confirm-delete.js +13 -0
  24. package/dist/components/ui/confirm-dialog.d.ts +24 -0
  25. package/dist/components/ui/confirm-dialog.d.ts.map +1 -0
  26. package/dist/components/ui/confirm-dialog.js +55 -0
  27. package/dist/components/ui/connection-status.d.ts +9 -0
  28. package/dist/components/ui/connection-status.d.ts.map +1 -0
  29. package/dist/components/ui/connection-status.js +25 -0
  30. package/dist/components/ui/copy-button.d.ts +13 -0
  31. package/dist/components/ui/copy-button.d.ts.map +1 -0
  32. package/dist/components/ui/copy-button.js +14 -0
  33. package/dist/components/ui/dialog.d.ts +20 -0
  34. package/dist/components/ui/dialog.d.ts.map +1 -0
  35. package/dist/components/ui/dialog.js +22 -0
  36. package/dist/components/ui/dropdown-menu.d.ts +28 -0
  37. package/dist/components/ui/dropdown-menu.d.ts.map +1 -0
  38. package/dist/components/ui/dropdown-menu.js +35 -0
  39. package/dist/components/ui/empty-state.d.ts +13 -0
  40. package/dist/components/ui/empty-state.d.ts.map +1 -0
  41. package/dist/components/ui/empty-state.js +5 -0
  42. package/dist/components/ui/error-boundary.d.ts +18 -0
  43. package/dist/components/ui/error-boundary.d.ts.map +1 -0
  44. package/dist/components/ui/error-boundary.js +27 -0
  45. package/dist/components/ui/grid.d.ts +11 -0
  46. package/dist/components/ui/grid.d.ts.map +1 -0
  47. package/dist/components/ui/grid.js +30 -0
  48. package/dist/components/ui/input.d.ts +6 -0
  49. package/dist/components/ui/input.d.ts.map +1 -0
  50. package/dist/components/ui/input.js +8 -0
  51. package/dist/components/ui/label.d.ts +6 -0
  52. package/dist/components/ui/label.d.ts.map +1 -0
  53. package/dist/components/ui/label.js +9 -0
  54. package/dist/components/ui/popover.d.ts +7 -0
  55. package/dist/components/ui/popover.d.ts.map +1 -0
  56. package/dist/components/ui/popover.js +9 -0
  57. package/dist/components/ui/save-footer.d.ts +13 -0
  58. package/dist/components/ui/save-footer.d.ts.map +1 -0
  59. package/dist/components/ui/save-footer.js +9 -0
  60. package/dist/components/ui/search-bar.d.ts +17 -0
  61. package/dist/components/ui/search-bar.d.ts.map +1 -0
  62. package/dist/components/ui/search-bar.js +19 -0
  63. package/dist/components/ui/search-input.d.ts +11 -0
  64. package/dist/components/ui/search-input.d.ts.map +1 -0
  65. package/dist/components/ui/search-input.js +9 -0
  66. package/dist/components/ui/section-card.d.ts +15 -0
  67. package/dist/components/ui/section-card.d.ts.map +1 -0
  68. package/dist/components/ui/section-card.js +9 -0
  69. package/dist/components/ui/select.d.ts +14 -0
  70. package/dist/components/ui/select.d.ts.map +1 -0
  71. package/dist/components/ui/select.js +26 -0
  72. package/dist/components/ui/separator.d.ts +5 -0
  73. package/dist/components/ui/separator.d.ts.map +1 -0
  74. package/dist/components/ui/separator.js +7 -0
  75. package/dist/components/ui/skeleton.d.ts +17 -0
  76. package/dist/components/ui/skeleton.d.ts.map +1 -0
  77. package/dist/components/ui/skeleton.js +25 -0
  78. package/dist/components/ui/slider.d.ts +5 -0
  79. package/dist/components/ui/slider.d.ts.map +1 -0
  80. package/dist/components/ui/slider.js +7 -0
  81. package/dist/components/ui/sonner.d.ts +5 -0
  82. package/dist/components/ui/sonner.d.ts.map +1 -0
  83. package/dist/components/ui/sonner.js +15 -0
  84. package/dist/components/ui/spinner.d.ts +6 -0
  85. package/dist/components/ui/spinner.d.ts.map +1 -0
  86. package/dist/components/ui/spinner.js +8 -0
  87. package/dist/components/ui/stack.d.ts +13 -0
  88. package/dist/components/ui/stack.d.ts.map +1 -0
  89. package/dist/components/ui/stack.js +39 -0
  90. package/dist/components/ui/status-badge.d.ts +20 -0
  91. package/dist/components/ui/status-badge.d.ts.map +1 -0
  92. package/dist/components/ui/status-badge.js +41 -0
  93. package/dist/components/ui/switch.d.ts +5 -0
  94. package/dist/components/ui/switch.d.ts.map +1 -0
  95. package/dist/components/ui/switch.js +7 -0
  96. package/dist/components/ui/tabs.d.ts +8 -0
  97. package/dist/components/ui/tabs.d.ts.map +1 -0
  98. package/dist/components/ui/tabs.js +12 -0
  99. package/dist/components/ui/tag-editor.d.ts +24 -0
  100. package/dist/components/ui/tag-editor.d.ts.map +1 -0
  101. package/dist/components/ui/tag-editor.js +32 -0
  102. package/dist/components/ui/tag-input.d.ts +19 -0
  103. package/dist/components/ui/tag-input.d.ts.map +1 -0
  104. package/dist/components/ui/tag-input.js +28 -0
  105. package/dist/components/ui/textarea.d.ts +6 -0
  106. package/dist/components/ui/textarea.d.ts.map +1 -0
  107. package/dist/components/ui/textarea.js +8 -0
  108. package/dist/components/ui/themed-select.d.ts +27 -0
  109. package/dist/components/ui/themed-select.d.ts.map +1 -0
  110. package/dist/components/ui/themed-select.js +57 -0
  111. package/dist/components/ui/tooltip-extended.d.ts +76 -0
  112. package/dist/components/ui/tooltip-extended.d.ts.map +1 -0
  113. package/dist/components/ui/tooltip-extended.js +128 -0
  114. package/dist/components/ui/tooltip.d.ts +8 -0
  115. package/dist/components/ui/tooltip.d.ts.map +1 -0
  116. package/dist/components/ui/tooltip.js +10 -0
  117. package/dist/components/ui/typography.d.ts +17 -0
  118. package/dist/components/ui/typography.d.ts.map +1 -0
  119. package/dist/components/ui/typography.js +44 -0
  120. package/dist/index.d.ts +42 -0
  121. package/dist/index.d.ts.map +1 -0
  122. package/dist/index.js +43 -0
  123. package/dist/lib/button-styles.d.ts +12 -0
  124. package/dist/lib/button-styles.d.ts.map +1 -0
  125. package/dist/lib/button-styles.js +11 -0
  126. package/dist/lib/utils.d.ts +6 -0
  127. package/dist/lib/utils.d.ts.map +1 -0
  128. package/dist/lib/utils.js +8 -0
  129. package/dist/package.json +69 -0
  130. package/dist/styles/theme.css +193 -0
  131. package/package.json +94 -0
  132. package/src/styles/theme.css +193 -0
@@ -0,0 +1,44 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { cva } from "class-variance-authority";
3
+ import * as React from "react";
4
+ import { cn } from "../../lib/utils";
5
+ const textVariants = cva("text-txt", {
6
+ variants: {
7
+ variant: {
8
+ default: "text-base",
9
+ medium: "text-sm",
10
+ small: "text-xs",
11
+ muted: "text-sm text-muted",
12
+ lead: "text-xl text-muted",
13
+ large: "text-lg font-semibold",
14
+ },
15
+ },
16
+ defaultVariants: {
17
+ variant: "default",
18
+ },
19
+ });
20
+ export const Text = React.forwardRef(({ className, variant, asChild = false, ...props }, ref) => {
21
+ const Comp = asChild ? "span" : "p";
22
+ return (_jsx(Comp, { ref: ref, className: cn(textVariants({ variant }), className), ...props }));
23
+ });
24
+ Text.displayName = "Text";
25
+ const headingVariants = cva("text-txt font-semibold tracking-tight", {
26
+ variants: {
27
+ level: {
28
+ h1: "text-4xl font-extrabold lg:text-5xl",
29
+ h2: "text-3xl",
30
+ h3: "text-2xl",
31
+ h4: "text-xl",
32
+ h5: "text-lg",
33
+ h6: "text-base",
34
+ },
35
+ },
36
+ defaultVariants: {
37
+ level: "h1",
38
+ },
39
+ });
40
+ export const Heading = React.forwardRef(({ className, level = "h1", ...props }, ref) => {
41
+ const Comp = level || "h1";
42
+ return (_jsx(Comp, { ref: ref, className: cn(headingVariants({ level }), className), ...props }));
43
+ });
44
+ Heading.displayName = "Heading";
@@ -0,0 +1,42 @@
1
+ export * from "./components/ui/badge";
2
+ export * from "./components/ui/banner";
3
+ export * from "./components/ui/button";
4
+ export * from "./components/ui/card";
5
+ export * from "./components/ui/chat-atoms";
6
+ export * from "./components/ui/checkbox";
7
+ export * from "./components/ui/confirm-delete";
8
+ export * from "./components/ui/confirm-dialog";
9
+ export * from "./components/ui/connection-status";
10
+ export * from "./components/ui/copy-button";
11
+ export * from "./components/ui/dialog";
12
+ export * from "./components/ui/dropdown-menu";
13
+ export * from "./components/ui/empty-state";
14
+ export * from "./components/ui/error-boundary";
15
+ export * from "./components/ui/grid";
16
+ export * from "./components/ui/input";
17
+ export * from "./components/ui/label";
18
+ export * from "./components/ui/popover";
19
+ export * from "./components/ui/save-footer";
20
+ export * from "./components/ui/search-bar";
21
+ export * from "./components/ui/search-input";
22
+ export * from "./components/ui/section-card";
23
+ export * from "./components/ui/select";
24
+ export * from "./components/ui/separator";
25
+ export * from "./components/ui/skeleton";
26
+ export * from "./components/ui/slider";
27
+ export * from "./components/ui/sonner";
28
+ export * from "./components/ui/spinner";
29
+ export * from "./components/ui/stack";
30
+ export * from "./components/ui/status-badge";
31
+ export * from "./components/ui/switch";
32
+ export * from "./components/ui/tabs";
33
+ export * from "./components/ui/tag-editor";
34
+ export * from "./components/ui/tag-input";
35
+ export * from "./components/ui/textarea";
36
+ export * from "./components/ui/themed-select";
37
+ export * from "./components/ui/tooltip";
38
+ export * from "./components/ui/tooltip-extended";
39
+ export * from "./components/ui/typography";
40
+ export * from "./lib/button-styles";
41
+ export * from "./lib/utils";
42
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,wBAAwB,CAAC;AAEvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,mCAAmC,CAAC;AAClD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,yBAAyB,CAAC;AACxC,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,43 @@
1
+ export * from "./components/ui/badge";
2
+ export * from "./components/ui/banner";
3
+ // Atoms
4
+ export * from "./components/ui/button";
5
+ // Molecules
6
+ export * from "./components/ui/card";
7
+ export * from "./components/ui/chat-atoms";
8
+ export * from "./components/ui/checkbox";
9
+ export * from "./components/ui/confirm-delete";
10
+ export * from "./components/ui/confirm-dialog";
11
+ export * from "./components/ui/connection-status";
12
+ export * from "./components/ui/copy-button";
13
+ export * from "./components/ui/dialog";
14
+ export * from "./components/ui/dropdown-menu";
15
+ export * from "./components/ui/empty-state";
16
+ export * from "./components/ui/error-boundary";
17
+ export * from "./components/ui/grid";
18
+ export * from "./components/ui/input";
19
+ export * from "./components/ui/label";
20
+ export * from "./components/ui/popover";
21
+ export * from "./components/ui/save-footer";
22
+ export * from "./components/ui/search-bar";
23
+ export * from "./components/ui/search-input";
24
+ export * from "./components/ui/section-card";
25
+ export * from "./components/ui/select";
26
+ export * from "./components/ui/separator";
27
+ export * from "./components/ui/skeleton";
28
+ export * from "./components/ui/slider";
29
+ export * from "./components/ui/sonner";
30
+ export * from "./components/ui/spinner";
31
+ export * from "./components/ui/stack";
32
+ export * from "./components/ui/status-badge";
33
+ export * from "./components/ui/switch";
34
+ export * from "./components/ui/tabs";
35
+ export * from "./components/ui/tag-editor";
36
+ export * from "./components/ui/tag-input";
37
+ export * from "./components/ui/textarea";
38
+ export * from "./components/ui/themed-select";
39
+ export * from "./components/ui/tooltip";
40
+ export * from "./components/ui/tooltip-extended";
41
+ export * from "./components/ui/typography";
42
+ export * from "./lib/button-styles";
43
+ export * from "./lib/utils";
@@ -0,0 +1,12 @@
1
+ /**
2
+ * Shared button class strings for consistent styling across views.
3
+ *
4
+ * These CSS class strings complement the `Button` component for cases where
5
+ * a plain HTML `button` element is used or Tailwind class composition is
6
+ * preferred over the variant prop.
7
+ */
8
+ export declare const btnPrimary = "px-4 py-2 text-sm font-medium bg-[var(--accent)] text-[var(--accent-foreground,#1a1f26)] border border-[var(--accent)] cursor-pointer hover:opacity-90 transition-opacity disabled:opacity-40 disabled:cursor-default rounded-lg";
9
+ export declare const btnGhost = "px-3 py-1.5 text-xs bg-transparent text-[var(--muted)] border border-[var(--border)] cursor-pointer hover:text-[var(--txt)] hover:border-[var(--txt)] transition-colors disabled:opacity-40 disabled:cursor-default rounded-lg";
10
+ export declare const btnDanger = "px-3 py-1.5 text-xs bg-transparent text-[var(--danger,#e74c3c)] border border-[var(--danger,#e74c3c)] cursor-pointer hover:bg-[var(--danger,#e74c3c)] hover:text-white transition-colors disabled:opacity-40 disabled:cursor-default rounded-lg";
11
+ export declare const inputCls = "flex-1 px-3 py-2 text-sm bg-[var(--card)] border border-[var(--border)] text-[var(--txt)] focus:border-[var(--accent)] focus:outline-none transition-colors rounded-lg";
12
+ //# sourceMappingURL=button-styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"button-styles.d.ts","sourceRoot":"","sources":["../../src/lib/button-styles.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,eAAO,MAAM,UAAU,qOAC6M,CAAC;AAErO,eAAO,MAAM,QAAQ,mOAC6M,CAAC;AAEnO,eAAO,MAAM,SAAS,oPAC6N,CAAC;AAEpP,eAAO,MAAM,QAAQ,2KACqJ,CAAC"}
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Shared button class strings for consistent styling across views.
3
+ *
4
+ * These CSS class strings complement the `Button` component for cases where
5
+ * a plain HTML `button` element is used or Tailwind class composition is
6
+ * preferred over the variant prop.
7
+ */
8
+ export const btnPrimary = "px-4 py-2 text-sm font-medium bg-[var(--accent)] text-[var(--accent-foreground,#1a1f26)] border border-[var(--accent)] cursor-pointer hover:opacity-90 transition-opacity disabled:opacity-40 disabled:cursor-default rounded-lg";
9
+ export const btnGhost = "px-3 py-1.5 text-xs bg-transparent text-[var(--muted)] border border-[var(--border)] cursor-pointer hover:text-[var(--txt)] hover:border-[var(--txt)] transition-colors disabled:opacity-40 disabled:cursor-default rounded-lg";
10
+ export const btnDanger = "px-3 py-1.5 text-xs bg-transparent text-[var(--danger,#e74c3c)] border border-[var(--danger,#e74c3c)] cursor-pointer hover:bg-[var(--danger,#e74c3c)] hover:text-white transition-colors disabled:opacity-40 disabled:cursor-default rounded-lg";
11
+ export const inputCls = "flex-1 px-3 py-2 text-sm bg-[var(--card)] border border-[var(--border)] text-[var(--txt)] focus:border-[var(--accent)] focus:outline-none transition-colors rounded-lg";
@@ -0,0 +1,6 @@
1
+ import { type ClassValue } from "clsx";
2
+ /**
3
+ * Utility function to merge tailwind classes with conditional class names.
4
+ */
5
+ export declare function cn(...inputs: ClassValue[]): string;
6
+ //# sourceMappingURL=utils.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAC;AAG7C;;GAEG;AACH,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}
@@ -0,0 +1,8 @@
1
+ import { clsx } from "clsx";
2
+ import { twMerge } from "tailwind-merge";
3
+ /**
4
+ * Utility function to merge tailwind classes with conditional class names.
5
+ */
6
+ export function cn(...inputs) {
7
+ return twMerge(clsx(inputs));
8
+ }
@@ -0,0 +1,69 @@
1
+ {
2
+ "name": "@elizaos/ui",
3
+ "version": "2.0.0-alpha.37",
4
+ "description": "Reusable UI primitives and components for elizaOS applications.",
5
+ "type": "module",
6
+ "main": "./dist/index.js",
7
+ "types": "./dist/index.js",
8
+ "license": "MIT",
9
+ "homepage": "https://elizaos.ai",
10
+ "repository": {
11
+ "type": "git",
12
+ "url": "https://github.com/elizaos/eliza.git",
13
+ "directory": "packages/ui"
14
+ },
15
+ "keywords": [
16
+ "elizaos",
17
+ "ui",
18
+ "react",
19
+ "components"
20
+ ],
21
+ "exports": {
22
+ ".": {
23
+ "types": "./dist/index.d.d.ts",
24
+ "import": "./dist/index.js"
25
+ },
26
+ "./utils": {
27
+ "types": "./dist/lib/utils.d.d.ts",
28
+ "import": "./dist/lib/utils.js"
29
+ },
30
+ "./styles/theme.css": "./styles/theme.css",
31
+ "./package.json": "./package.json"
32
+ },
33
+ "files": [
34
+ "dist",
35
+ "src/styles/theme.css",
36
+ "README.md"
37
+ ],
38
+ "peerDependencies": {
39
+ "react": "^19.0.0",
40
+ "react-dom": "^19.0.0"
41
+ },
42
+ "dependencies": {
43
+ "@radix-ui/react-checkbox": "^1.3.3",
44
+ "@radix-ui/react-dialog": "^1.1.15",
45
+ "@radix-ui/react-dropdown-menu": "^2.1.16",
46
+ "@radix-ui/react-label": "^2.1.8",
47
+ "@radix-ui/react-popover": "^1.1.15",
48
+ "@radix-ui/react-select": "^2.2.6",
49
+ "@radix-ui/react-separator": "^1.1.8",
50
+ "@radix-ui/react-slider": "^1.3.6",
51
+ "@radix-ui/react-slot": "^1.2.4",
52
+ "@radix-ui/react-switch": "^1.2.6",
53
+ "@radix-ui/react-tabs": "^1.1.13",
54
+ "@radix-ui/react-tooltip": "^1.2.8",
55
+ "class-variance-authority": "^0.7.1",
56
+ "clsx": "^2.1.1",
57
+ "lucide-react": "^0.575.0",
58
+ "next-themes": "^0.4.6",
59
+ "sonner": "^2.0.7",
60
+ "tailwind-merge": "^2.6.0"
61
+ },
62
+ "publishConfig": {
63
+ "access": "public"
64
+ },
65
+ "author": "elizaOS Team",
66
+ "engines": {
67
+ "node": ">=18.0.0"
68
+ }
69
+ }
@@ -0,0 +1,193 @@
1
+ @theme default {
2
+ --color-bg: var(--bg);
3
+ --color-bg-accent: var(--bg-accent);
4
+ --color-bg-elevated: var(--bg-elevated);
5
+ --color-bg-hover: var(--bg-hover);
6
+ --color-bg-muted: var(--bg-muted);
7
+
8
+ --color-card: var(--card);
9
+ --color-card-fg: var(--card-foreground);
10
+ --color-surface: var(--surface);
11
+
12
+ --color-txt: var(--text);
13
+ --color-txt-strong: var(--text-strong);
14
+ --color-txt-chat: var(--chat-text);
15
+ --color-muted: var(--muted);
16
+ --color-muted-strong: var(--muted-strong);
17
+
18
+ --color-border: var(--border);
19
+ --color-border-strong: var(--border-strong);
20
+ --color-border-hover: var(--border-hover);
21
+ --color-input: var(--input);
22
+ --color-ring: var(--ring);
23
+
24
+ --color-accent: var(--accent);
25
+ --color-accent-hover: var(--accent-hover);
26
+ --color-accent-muted: var(--accent-muted);
27
+ --color-accent-subtle: var(--accent-subtle);
28
+ --color-accent-fg: var(--accent-foreground);
29
+ --color-primary: var(--primary);
30
+ --color-primary-fg: var(--primary-foreground);
31
+
32
+ --color-ok: var(--ok);
33
+ --color-ok-muted: var(--ok-muted);
34
+ --color-ok-subtle: var(--ok-subtle);
35
+ --color-warn: var(--warn);
36
+ --color-warn-muted: var(--warn-muted);
37
+ --color-warn-subtle: var(--warn-subtle);
38
+ --color-danger: var(--danger);
39
+ --color-destructive: var(--destructive);
40
+ --color-destructive-fg: var(--destructive-foreground);
41
+ --color-destructive-subtle: var(--destructive-subtle);
42
+
43
+ --color-header-bg: var(--header-bar-bg);
44
+ --color-header-fg: var(--header-bar-fg);
45
+
46
+ --font-body: var(--font-body);
47
+ --font-mono: var(--mono);
48
+ --font-display: var(--font-display);
49
+
50
+ --shadow-sm: var(--shadow-sm);
51
+ --shadow-md: var(--shadow-md);
52
+ --shadow-lg: var(--shadow-lg);
53
+
54
+ --radius-sm: var(--radius-sm);
55
+ --radius-md: var(--radius-md);
56
+ --radius-lg: var(--radius-lg);
57
+ --radius-xl: var(--radius-xl);
58
+ }
59
+
60
+ @layer base {
61
+ :root {
62
+ --bg: #ffffff;
63
+ --bg-accent: #faf7ec;
64
+ --bg-elevated: #fffdf6;
65
+ --bg-hover: #f8f1d7;
66
+ --bg-muted: #fcf9ef;
67
+
68
+ --card: #fffdf6;
69
+ --card-foreground: #1e2329;
70
+ --surface: #ffffff;
71
+
72
+ --text: #1e2329;
73
+ --text-strong: #11161c;
74
+ --chat-text: #1e2329;
75
+ --muted: #6d737a;
76
+ --muted-strong: #4d535a;
77
+
78
+ --border: #d6d3c6;
79
+ --border-strong: #b8b29f;
80
+ --border-hover: #f0b90b;
81
+ --input: #d6d3c6;
82
+ --ring: #f0b90b;
83
+
84
+ --accent: #f0b90b;
85
+ --accent-hover: #d8a108;
86
+ --accent-muted: #d8a108;
87
+ --accent-subtle: rgba(240, 185, 11, 0.12);
88
+ --accent-foreground: #1a1f26;
89
+ --primary: #f0b90b;
90
+ --primary-foreground: #1a1f26;
91
+
92
+ --ok: #02c076;
93
+ --ok-muted: rgba(2, 192, 118, 0.7);
94
+ --ok-subtle: rgba(2, 192, 118, 0.12);
95
+ --destructive: #f6465d;
96
+ --destructive-foreground: #ffffff;
97
+ --destructive-subtle: rgba(246, 70, 93, 0.12);
98
+ --warn: #f0b90b;
99
+ --warn-muted: rgba(240, 185, 11, 0.7);
100
+ --warn-subtle: rgba(240, 185, 11, 0.12);
101
+ --danger: #f6465d;
102
+
103
+ --focus: rgba(240, 185, 11, 0.18);
104
+ --focus-ring: 0 0 0 2px #f0b90b;
105
+
106
+ --header-bar-bg: #fff8dc;
107
+ --header-bar-fg: #1e2329;
108
+
109
+ --mono: "Courier New", Courier, monospace;
110
+ --font-body:
111
+ "Hiragino Kaku Gothic Pro", Osaka, Meiryo, "MS PGothic", arial, helvetica,
112
+ clean, sans-serif;
113
+ --font-display:
114
+ "Hiragino Kaku Gothic Pro", Osaka, Meiryo, "MS PGothic", arial, helvetica,
115
+ clean, sans-serif;
116
+
117
+ --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
118
+ --shadow-md:
119
+ 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
120
+ --shadow-lg:
121
+ 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
122
+
123
+ --radius-sm: 0.375rem;
124
+ --radius-md: 0.5rem;
125
+ --radius-lg: 0.75rem;
126
+ --radius-xl: 1rem;
127
+ --radius-full: 9999px;
128
+ --radius: 0.5rem;
129
+
130
+ --duration-fast: 100ms;
131
+ --duration-normal: 150ms;
132
+ --duration-slow: 250ms;
133
+
134
+ color-scheme: light;
135
+ }
136
+
137
+ .dark {
138
+ --bg: hsl(220 16% 12%);
139
+ --bg-accent: hsl(220 14% 16%);
140
+ --bg-elevated: hsl(220 14% 10%);
141
+ --bg-hover: hsl(220 12% 20%);
142
+ --bg-muted: hsl(220 12% 20%);
143
+
144
+ --card: hsl(220 14% 14%);
145
+ --card-foreground: hsl(40 10% 94%);
146
+ --surface: hsl(220 14% 14%);
147
+
148
+ --text: hsl(40 10% 84%);
149
+ --text-strong: hsl(40 10% 96%);
150
+ --chat-text: hsl(40 10% 84%);
151
+ --muted: hsl(220 8% 56%);
152
+ --muted-strong: hsl(220 6% 68%);
153
+
154
+ --border: hsl(220 12% 22%);
155
+ --border-strong: hsl(220 10% 30%);
156
+ --border-hover: #f0b90b;
157
+ --input: hsl(220 12% 22%);
158
+ --ring: #f0b90b;
159
+
160
+ --accent: #f0b90b;
161
+ --accent-hover: #d8a108;
162
+ --accent-muted: #d8a108;
163
+ --accent-subtle: rgba(240, 185, 11, 0.12);
164
+ --accent-foreground: #1a1f26;
165
+ --primary: #f0b90b;
166
+ --primary-foreground: #1a1f26;
167
+
168
+ --ok: hsl(142 76% 36%);
169
+ --ok-muted: hsla(142 76% 36% / 0.7);
170
+ --ok-subtle: hsla(142 76% 36% / 0.1);
171
+ --destructive: hsl(0 84.2% 60.2%);
172
+ --destructive-foreground: hsl(0 0% 100%);
173
+ --destructive-subtle: hsla(0 84% 60% / 0.1);
174
+ --warn: #f0b90b;
175
+ --warn-muted: rgba(240, 185, 11, 0.7);
176
+ --warn-subtle: rgba(240, 185, 11, 0.12);
177
+ --danger: hsl(0 84.2% 60.2%);
178
+
179
+ --focus: rgba(240, 185, 11, 0.2);
180
+ --focus-ring: 0 0 0 2px rgba(240, 185, 11, 0.5);
181
+
182
+ --header-bar-bg: hsl(220 16% 12%);
183
+ --header-bar-fg: hsl(40 10% 96%);
184
+
185
+ --mono: "Courier New", Courier, monospace;
186
+ --font-body:
187
+ -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", sans-serif;
188
+ --font-display:
189
+ -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", sans-serif;
190
+
191
+ color-scheme: dark;
192
+ }
193
+ }
package/package.json ADDED
@@ -0,0 +1,94 @@
1
+ {
2
+ "name": "@elizaos/ui",
3
+ "version": "2.0.0-alpha.37",
4
+ "description": "Reusable UI primitives and components for elizaOS applications.",
5
+ "type": "module",
6
+ "main": "dist/index.js",
7
+ "types": "dist/index.d.ts",
8
+ "license": "MIT",
9
+ "homepage": "https://elizaos.ai",
10
+ "repository": {
11
+ "type": "git",
12
+ "url": "https://github.com/elizaos/eliza.git",
13
+ "directory": "packages/ui"
14
+ },
15
+ "keywords": [
16
+ "elizaos",
17
+ "ui",
18
+ "react",
19
+ "components"
20
+ ],
21
+ "scripts": {
22
+ "clean": "rm -rf dist && find src -type f \\( -name '*.js' -o -name '*.d.ts' -o -name '*.d.ts.map' -o -name '*.js.map' \\) -delete",
23
+ "build": "bun run build:dist",
24
+ "build:dist": "find src -type f \\( -name '*.js' -o -name '*.d.ts' -o -name '*.d.ts.map' -o -name '*.js.map' \\) -delete && rm -rf dist && tsc -p tsconfig.build.json && find src -type f \\( -name '*.js' -o -name '*.d.ts' -o -name '*.d.ts.map' -o -name '*.js.map' \\) -delete && node ../../scripts/copy-package-assets.mjs packages/ui src/styles && node ../../scripts/prepare-package-dist.mjs packages/ui",
25
+ "typecheck": "tsc --noEmit -p tsconfig.json",
26
+ "lint": "bunx @biomejs/biome check --write ./src/index.ts ./src/lib ./src/components ./src/stories",
27
+ "lint:check": "bunx @biomejs/biome check ./src/index.ts ./src/lib ./src/components ./src/stories",
28
+ "pack:dry-run": "cd dist && npm pack --dry-run",
29
+ "storybook": "storybook dev -p 6006",
30
+ "build-storybook": "storybook build"
31
+ },
32
+ "exports": {
33
+ ".": {
34
+ "types": "./dist/index.d.ts",
35
+ "import": "./dist/index.js"
36
+ },
37
+ "./utils": {
38
+ "types": "./dist/lib/utils.d.ts",
39
+ "import": "./dist/lib/utils.js"
40
+ },
41
+ "./styles/theme.css": "./src/styles/theme.css",
42
+ "./package.json": "./package.json"
43
+ },
44
+ "files": [
45
+ "dist",
46
+ "src/styles/theme.css",
47
+ "README.md"
48
+ ],
49
+ "peerDependencies": {
50
+ "react": "^19.0.0",
51
+ "react-dom": "^19.0.0"
52
+ },
53
+ "dependencies": {
54
+ "@radix-ui/react-checkbox": "^1.3.3",
55
+ "@radix-ui/react-dialog": "^1.1.15",
56
+ "@radix-ui/react-dropdown-menu": "^2.1.16",
57
+ "@radix-ui/react-label": "^2.1.8",
58
+ "@radix-ui/react-popover": "^1.1.15",
59
+ "@radix-ui/react-select": "^2.2.6",
60
+ "@radix-ui/react-separator": "^1.1.8",
61
+ "@radix-ui/react-slider": "^1.3.6",
62
+ "@radix-ui/react-slot": "^1.2.4",
63
+ "@radix-ui/react-switch": "^1.2.6",
64
+ "@radix-ui/react-tabs": "^1.1.13",
65
+ "@radix-ui/react-tooltip": "^1.2.8",
66
+ "class-variance-authority": "^0.7.1",
67
+ "clsx": "^2.1.1",
68
+ "lucide-react": "^0.575.0",
69
+ "next-themes": "^0.4.6",
70
+ "sonner": "^2.0.7",
71
+ "tailwind-merge": "^2.6.0"
72
+ },
73
+ "publishConfig": {
74
+ "access": "public"
75
+ },
76
+ "devDependencies": {
77
+ "@storybook/addon-essentials": "8.6.14",
78
+ "@storybook/blocks": "8.6.14",
79
+ "@storybook/react": "8.6.14",
80
+ "@storybook/react-vite": "8.6.14",
81
+ "@storybook/test": "8.6.14",
82
+ "@tailwindcss/vite": "^4.2.1",
83
+ "@types/react": "^19.0.0",
84
+ "@types/react-dom": "^19.0.0",
85
+ "storybook": "8.6.14",
86
+ "tailwindcss": "^4.1.18",
87
+ "typescript": "^5.9.3"
88
+ },
89
+ "author": "elizaOS Team",
90
+ "engines": {
91
+ "node": ">=18.0.0"
92
+ },
93
+ "gitHead": "062a66e2820ec50c70e73200a5664adb2784b16b"
94
+ }