@toolr/ui-design 0.1.0 → 0.1.2

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 (41) hide show
  1. package/components/lib/theme-engine.ts +48 -15
  2. package/components/sections/ai-tools-paths/tools-paths-panel.tsx +11 -11
  3. package/components/sections/captured-issues/captured-issues-panel.tsx +20 -20
  4. package/components/sections/golden-snapshots/file-diff-viewer.tsx +19 -19
  5. package/components/sections/golden-snapshots/golden-sync-panel.tsx +3 -3
  6. package/components/sections/golden-snapshots/snapshot-manager.tsx +15 -15
  7. package/components/sections/golden-snapshots/status-overview.tsx +40 -40
  8. package/components/sections/golden-snapshots/version-manager.tsx +10 -10
  9. package/components/sections/prompt-editor/file-type-tabbed-prompt-editor.tsx +11 -11
  10. package/components/sections/prompt-editor/simulator-prompt-editor.tsx +15 -15
  11. package/components/sections/prompt-editor/tabbed-prompt-editor.tsx +19 -19
  12. package/components/sections/snapshot-browser/snapshot-browser-panel.tsx +10 -10
  13. package/components/sections/snapshot-browser/snapshot-tree.tsx +11 -11
  14. package/components/sections/snippets-editor/snippets-editor.tsx +24 -24
  15. package/components/settings/SettingsHeader.tsx +78 -0
  16. package/components/settings/SettingsPanel.tsx +21 -0
  17. package/components/settings/SettingsTreeNav.tsx +256 -0
  18. package/components/settings/index.ts +7 -0
  19. package/components/settings/settings-tree-utils.ts +120 -0
  20. package/components/ui/breadcrumb.tsx +16 -4
  21. package/components/ui/cookie-consent.tsx +82 -0
  22. package/components/ui/file-tree.tsx +5 -5
  23. package/components/ui/filter-dropdown.tsx +4 -4
  24. package/components/ui/form-actions.tsx +1 -1
  25. package/components/ui/label.tsx +31 -3
  26. package/components/ui/resizable-textarea.tsx +2 -2
  27. package/components/ui/segmented-toggle.tsx +17 -4
  28. package/components/ui/select.tsx +3 -3
  29. package/components/ui/sort-dropdown.tsx +2 -2
  30. package/components/ui/status-card.tsx +1 -1
  31. package/components/ui/tooltip.tsx +2 -2
  32. package/dist/index.d.ts +79 -8
  33. package/dist/index.js +1119 -622
  34. package/dist/tokens/{tokens/primitives.css → primitives.css} +10 -8
  35. package/dist/tokens/{tokens/semantic.css → semantic.css} +5 -0
  36. package/index.ts +13 -0
  37. package/package.json +6 -2
  38. package/tokens/primitives.css +10 -8
  39. package/tokens/semantic.css +5 -0
  40. /package/dist/tokens/{tokens/theme.css → theme.css} +0 -0
  41. /package/dist/tokens/{tokens/tokens.json → tokens.json} +0 -0
@@ -1,17 +1,19 @@
1
1
  /* =============================================================================
2
- Primitive Design Tokens — OLED Pure Neutral Scale
3
- Pure achromatic scale with progressive surface lift from true black.
2
+ Primitive Design Tokens — Neutral Scale
3
+ Progressive surface lift from true black.
4
4
 
5
5
  These are raw color values. Use semantic tokens (semantic.css) in components.
6
6
  ============================================================================= */
7
7
 
8
8
  @theme {
9
- /* Neutral scale (OLED Pure) */
10
- --color-neutral-950: #000000;
11
- --color-neutral-900: #050505;
12
- --color-neutral-800: #0a0a0a;
13
- --color-neutral-700: #1a1a1a;
14
- --color-neutral-600: #333333;
9
+ /* Neutral scale */
10
+ --color-neutral-950: #0d0d0d;
11
+ --color-neutral-900: #1a1a1a;
12
+ --color-neutral-850: #1f1f1f;
13
+ --color-neutral-800: #262626;
14
+ --color-neutral-750: #2e2e2e;
15
+ --color-neutral-700: #383838;
16
+ --color-neutral-600: #4d4d4d;
15
17
  --color-neutral-500: #666666;
16
18
  --color-neutral-400: #999999;
17
19
  --color-neutral-300: #cccccc;
@@ -18,6 +18,11 @@
18
18
  --surface-foreground: var(--color-neutral-300);
19
19
  --surface-secondary: var(--color-neutral-900);
20
20
  --surface-overlay: var(--color-neutral-700);
21
+ --surface-hover: var(--color-neutral-750);
22
+
23
+ /* Popover: floating panels, dropdown menus */
24
+ --popover: rgba(0, 0, 0, 0.8);
25
+ --popover-foreground: var(--color-neutral-300);
21
26
 
22
27
  /* Muted: subdued elements, disabled states */
23
28
  --muted: var(--color-neutral-800);
package/index.ts CHANGED
@@ -2,8 +2,10 @@
2
2
  export { type FormColor } from './components/lib/form-colors.ts'
3
3
  export {
4
4
  SCALE_KEYS, type ScaleKey, type ThemeId,
5
+ SURFACE_KEYS, type SurfaceKey,
5
6
  DARK_THEMES, LIGHT_THEMES, BASE_THEMES,
6
7
  type AccentDef, ACCENT_DEFS,
8
+ DEFAULT_DIMS, DEFAULT_OUTLINE,
7
9
  satCurve, hslToHex, generateScale,
8
10
  isLightTheme, applyTheme,
9
11
  } from './components/lib/theme-engine.ts'
@@ -113,11 +115,22 @@ export { StatusCard, type StatusCardProps, type StatusItem } from './components/
113
115
  export { SnapshotCard, type SnapshotCardProps } from './components/ui/snapshot-card.tsx'
114
116
  export { DetailSection, type DetailSectionProps, type DetailRow } from './components/ui/detail-section.tsx'
115
117
  export { SelectionGrid, type SelectionGridProps, type SelectionCardItem, type CodingToolId, type CodingToolPresetConfig } from './components/ui/selection-grid.tsx'
118
+ export { CookieConsent, type CookieConsentProps, type ConsentChoice } from './components/ui/cookie-consent.tsx'
116
119
 
117
120
  // Hooks
118
121
  export { useClickOutside } from './components/hooks/use-click-outside.ts'
119
122
  export { useDropdownMaxHeight } from './components/hooks/use-dropdown-max-height.ts'
120
123
  export { useNavigationHistory, type UseNavigationHistoryReturn } from './components/hooks/use-navigation-history.ts'
121
124
 
125
+ // Settings
126
+ export {
127
+ SettingsPanel, type SettingsPanelProps,
128
+ SettingsTreeNav, type SettingsTreeNavProps,
129
+ SettingsHeader, type SettingsHeaderProps,
130
+ type SettingsTreeNode,
131
+ findNodeByPath, getBreadcrumbFromPath, isLeafNode,
132
+ getAllLeafPaths, collectExpandablePaths, getParentPaths, filterTree,
133
+ } from './components/settings/index.ts'
134
+
122
135
  // Utilities
123
136
  export { cn } from './components/lib/cn.ts'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@toolr/ui-design",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -31,6 +31,10 @@
31
31
  "types": "./dist/diagrams.d.ts"
32
32
  }
33
33
  },
34
+ "repository": {
35
+ "type": "git",
36
+ "url": "https://github.com/twiced-technology-gmbh/toolr-ui-design.git"
37
+ },
34
38
  "files": [
35
39
  "dist",
36
40
  "index.ts",
@@ -40,7 +44,7 @@
40
44
  ],
41
45
  "scripts": {
42
46
  "build": "tsup",
43
- "postbuild": "cp -r tokens dist/tokens"
47
+ "postbuild": "rm -rf dist/tokens && cp -r tokens dist/tokens"
44
48
  },
45
49
  "peerDependencies": {
46
50
  "react": "^18 || ^19",
@@ -1,17 +1,19 @@
1
1
  /* =============================================================================
2
- Primitive Design Tokens — OLED Pure Neutral Scale
3
- Pure achromatic scale with progressive surface lift from true black.
2
+ Primitive Design Tokens — Neutral Scale
3
+ Progressive surface lift from true black.
4
4
 
5
5
  These are raw color values. Use semantic tokens (semantic.css) in components.
6
6
  ============================================================================= */
7
7
 
8
8
  @theme {
9
- /* Neutral scale (OLED Pure) */
10
- --color-neutral-950: #000000;
11
- --color-neutral-900: #050505;
12
- --color-neutral-800: #0a0a0a;
13
- --color-neutral-700: #1a1a1a;
14
- --color-neutral-600: #333333;
9
+ /* Neutral scale */
10
+ --color-neutral-950: #0d0d0d;
11
+ --color-neutral-900: #1a1a1a;
12
+ --color-neutral-850: #1f1f1f;
13
+ --color-neutral-800: #262626;
14
+ --color-neutral-750: #2e2e2e;
15
+ --color-neutral-700: #383838;
16
+ --color-neutral-600: #4d4d4d;
15
17
  --color-neutral-500: #666666;
16
18
  --color-neutral-400: #999999;
17
19
  --color-neutral-300: #cccccc;
@@ -18,6 +18,11 @@
18
18
  --surface-foreground: var(--color-neutral-300);
19
19
  --surface-secondary: var(--color-neutral-900);
20
20
  --surface-overlay: var(--color-neutral-700);
21
+ --surface-hover: var(--color-neutral-750);
22
+
23
+ /* Popover: floating panels, dropdown menus */
24
+ --popover: rgba(0, 0, 0, 0.8);
25
+ --popover-foreground: var(--color-neutral-300);
21
26
 
22
27
  /* Muted: subdued elements, disabled states */
23
28
  --muted: var(--color-neutral-800);
File without changes
File without changes