@svadmin/ui 0.29.0 → 0.29.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 (224) hide show
  1. package/package.json +20 -9
  2. package/src/README.md +0 -18
  3. package/src/actions.ts +0 -110
  4. package/src/app.css +0 -519
  5. package/src/component-registry.svelte.ts +0 -60
  6. package/src/components/AICommandBar.svelte +0 -180
  7. package/src/components/AboutSettings.svelte +0 -106
  8. package/src/components/AdminApp.svelte +0 -199
  9. package/src/components/AnimatedCounter.svelte +0 -46
  10. package/src/components/AnomalyBadge.svelte +0 -65
  11. package/src/components/AppearanceSettings.svelte +0 -183
  12. package/src/components/AuditLogDrawer.svelte +0 -93
  13. package/src/components/AuditLogViewer.svelte +0 -226
  14. package/src/components/Authenticated.svelte +0 -51
  15. package/src/components/AutoForm.svelte +0 -242
  16. package/src/components/AutoSaveIndicator.svelte +0 -35
  17. package/src/components/AutoTable.svelte +0 -839
  18. package/src/components/Breadcrumbs.svelte +0 -58
  19. package/src/components/CanAccess.svelte +0 -23
  20. package/src/components/CatchAllNavigate.svelte +0 -21
  21. package/src/components/ChatDialog.svelte +0 -535
  22. package/src/components/ComboboxField.svelte +0 -129
  23. package/src/components/CommandPalette.svelte +0 -135
  24. package/src/components/ConfigErrorScreen.svelte +0 -126
  25. package/src/components/ConfirmDialog.svelte +0 -53
  26. package/src/components/CopilotPanel.svelte +0 -163
  27. package/src/components/CreatePage.svelte +0 -39
  28. package/src/components/DevTools.svelte +0 -149
  29. package/src/components/DraggableGrid.svelte +0 -86
  30. package/src/components/DraggableHeader.svelte +0 -112
  31. package/src/components/DrawerForm.svelte +0 -35
  32. package/src/components/EditPage.svelte +0 -52
  33. package/src/components/EmptyState.svelte +0 -31
  34. package/src/components/ErrorBoundary.svelte +0 -49
  35. package/src/components/ErrorComponent.svelte +0 -36
  36. package/src/components/FieldRenderer.svelte +0 -357
  37. package/src/components/ForgotPasswordPage.svelte +0 -112
  38. package/src/components/Header.svelte +0 -94
  39. package/src/components/InferencerPanel.svelte +0 -192
  40. package/src/components/InfiniteList.svelte +0 -93
  41. package/src/components/InlineEdit.svelte +0 -88
  42. package/src/components/InsightCard.svelte +0 -98
  43. package/src/components/KeyboardShortcuts.svelte +0 -61
  44. package/src/components/Layout.svelte +0 -167
  45. package/src/components/ListPage.svelte +0 -71
  46. package/src/components/LiveIndicator.svelte +0 -58
  47. package/src/components/LoginPage.svelte +0 -163
  48. package/src/components/MarkdownRenderer.svelte +0 -127
  49. package/src/components/ModalForm.svelte +0 -38
  50. package/src/components/NavigateToResource.svelte +0 -20
  51. package/src/components/PageHeader.svelte +0 -39
  52. package/src/components/PageSkeleton.svelte +0 -71
  53. package/src/components/PasswordInput.svelte +0 -96
  54. package/src/components/PermissionMatrix.svelte +0 -185
  55. package/src/components/ProfilePage.svelte +0 -284
  56. package/src/components/RegisterPage.svelte +0 -112
  57. package/src/components/RolesSettings.svelte +0 -146
  58. package/src/components/SettingsPage.svelte +0 -113
  59. package/src/components/ShowPage.svelte +0 -73
  60. package/src/components/Sidebar.svelte +0 -417
  61. package/src/components/SidebarItem.svelte +0 -129
  62. package/src/components/SmartSuggest.svelte +0 -158
  63. package/src/components/StatsCard.svelte +0 -79
  64. package/src/components/StepsForm.svelte +0 -192
  65. package/src/components/TaskQueueDrawer.svelte +0 -158
  66. package/src/components/TenantSwitcher.svelte +0 -84
  67. package/src/components/ThemedTitle.svelte +0 -32
  68. package/src/components/Toast.svelte +0 -46
  69. package/src/components/TooltipButton.svelte +0 -42
  70. package/src/components/UndoableNotification.svelte +0 -69
  71. package/src/components/UpdatePasswordPage.svelte +0 -89
  72. package/src/components/VirtualTable.svelte +0 -76
  73. package/src/components/VoiceInput.svelte +0 -120
  74. package/src/components/buttons/CloneButton.svelte +0 -30
  75. package/src/components/buttons/CreateButton.svelte +0 -29
  76. package/src/components/buttons/DeleteButton.svelte +0 -59
  77. package/src/components/buttons/EditButton.svelte +0 -30
  78. package/src/components/buttons/ExportButton.svelte +0 -30
  79. package/src/components/buttons/ImportButton.svelte +0 -56
  80. package/src/components/buttons/ListButton.svelte +0 -23
  81. package/src/components/buttons/RefreshButton.svelte +0 -36
  82. package/src/components/buttons/SaveButton.svelte +0 -27
  83. package/src/components/buttons/ShowButton.svelte +0 -31
  84. package/src/components/buttons/index.ts +0 -10
  85. package/src/components/charts/BarChart.svelte +0 -69
  86. package/src/components/charts/LineChart.svelte +0 -115
  87. package/src/components/charts/PieChart.svelte +0 -95
  88. package/src/components/charts/index.ts +0 -3
  89. package/src/components/fieldComponentMap.ts +0 -79
  90. package/src/components/fields/ArrayField.svelte +0 -86
  91. package/src/components/fields/BooleanField.svelte +0 -13
  92. package/src/components/fields/DateField.svelte +0 -6
  93. package/src/components/fields/EmailField.svelte +0 -9
  94. package/src/components/fields/FileField.svelte +0 -14
  95. package/src/components/fields/ImageField.svelte +0 -9
  96. package/src/components/fields/JsonField.svelte +0 -72
  97. package/src/components/fields/MarkdownField.svelte +0 -9
  98. package/src/components/fields/MultiSelectField.svelte +0 -21
  99. package/src/components/fields/NumberField.svelte +0 -6
  100. package/src/components/fields/RelationField.svelte +0 -24
  101. package/src/components/fields/RichTextField.svelte +0 -35
  102. package/src/components/fields/SelectField.svelte +0 -14
  103. package/src/components/fields/TagField.svelte +0 -12
  104. package/src/components/fields/TextField.svelte +0 -11
  105. package/src/components/fields/UrlField.svelte +0 -14
  106. package/src/components/ui/alert/alert-description.svelte +0 -17
  107. package/src/components/ui/alert/alert-title.svelte +0 -17
  108. package/src/components/ui/alert/alert.svelte +0 -44
  109. package/src/components/ui/alert/index.ts +0 -15
  110. package/src/components/ui/alert-dialog/alert-dialog-content.svelte +0 -29
  111. package/src/components/ui/alert-dialog/alert-dialog-description.svelte +0 -16
  112. package/src/components/ui/alert-dialog/alert-dialog-footer.svelte +0 -11
  113. package/src/components/ui/alert-dialog/alert-dialog-header.svelte +0 -11
  114. package/src/components/ui/alert-dialog/alert-dialog-overlay.svelte +0 -16
  115. package/src/components/ui/alert-dialog/alert-dialog-portal.svelte +0 -6
  116. package/src/components/ui/alert-dialog/alert-dialog-title.svelte +0 -16
  117. package/src/components/ui/alert-dialog/index.ts +0 -20
  118. package/src/components/ui/avatar/avatar.svelte +0 -63
  119. package/src/components/ui/avatar/index.ts +0 -2
  120. package/src/components/ui/badge/badge.svelte +0 -49
  121. package/src/components/ui/badge/index.ts +0 -3
  122. package/src/components/ui/breadcrumb/breadcrumb-ellipsis.svelte +0 -18
  123. package/src/components/ui/breadcrumb/breadcrumb-item.svelte +0 -15
  124. package/src/components/ui/breadcrumb/breadcrumb-link.svelte +0 -15
  125. package/src/components/ui/breadcrumb/breadcrumb-list.svelte +0 -15
  126. package/src/components/ui/breadcrumb/breadcrumb-page.svelte +0 -18
  127. package/src/components/ui/breadcrumb/breadcrumb-separator.svelte +0 -22
  128. package/src/components/ui/breadcrumb/breadcrumb.svelte +0 -11
  129. package/src/components/ui/breadcrumb/index.ts +0 -7
  130. package/src/components/ui/button/button.svelte +0 -90
  131. package/src/components/ui/button/index.ts +0 -18
  132. package/src/components/ui/card/card-action.svelte +0 -23
  133. package/src/components/ui/card/card-content.svelte +0 -20
  134. package/src/components/ui/card/card-description.svelte +0 -20
  135. package/src/components/ui/card/card-footer.svelte +0 -20
  136. package/src/components/ui/card/card-header.svelte +0 -23
  137. package/src/components/ui/card/card-title.svelte +0 -15
  138. package/src/components/ui/card/card.svelte +0 -22
  139. package/src/components/ui/card/index.ts +0 -25
  140. package/src/components/ui/checkbox/checkbox.svelte +0 -39
  141. package/src/components/ui/checkbox/index.ts +0 -6
  142. package/src/components/ui/collapsible/index.ts +0 -7
  143. package/src/components/ui/command/command-dialog.svelte +0 -31
  144. package/src/components/ui/command/index.ts +0 -2
  145. package/src/components/ui/context-menu/index.ts +0 -11
  146. package/src/components/ui/dialog/dialog-close.svelte +0 -11
  147. package/src/components/ui/dialog/dialog-content.svelte +0 -48
  148. package/src/components/ui/dialog/dialog-description.svelte +0 -17
  149. package/src/components/ui/dialog/dialog-footer.svelte +0 -32
  150. package/src/components/ui/dialog/dialog-header.svelte +0 -20
  151. package/src/components/ui/dialog/dialog-overlay.svelte +0 -17
  152. package/src/components/ui/dialog/dialog-portal.svelte +0 -7
  153. package/src/components/ui/dialog/dialog-title.svelte +0 -17
  154. package/src/components/ui/dialog/dialog-trigger.svelte +0 -11
  155. package/src/components/ui/dialog/dialog.svelte +0 -7
  156. package/src/components/ui/dialog/index.ts +0 -34
  157. package/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte +0 -43
  158. package/src/components/ui/dropdown-menu/dropdown-menu-content.svelte +0 -35
  159. package/src/components/ui/dropdown-menu/dropdown-menu-item.svelte +0 -36
  160. package/src/components/ui/dropdown-menu/dropdown-menu-separator.svelte +0 -10
  161. package/src/components/ui/dropdown-menu/dropdown-menu-trigger.svelte +0 -27
  162. package/src/components/ui/dropdown-menu/dropdown-menu.svelte +0 -45
  163. package/src/components/ui/dropdown-menu/index.ts +0 -21
  164. package/src/components/ui/input/index.ts +0 -7
  165. package/src/components/ui/input/input.svelte +0 -48
  166. package/src/components/ui/label/index.ts +0 -1
  167. package/src/components/ui/label/label.svelte +0 -18
  168. package/src/components/ui/pagination/index.ts +0 -7
  169. package/src/components/ui/pagination/pagination-content.svelte +0 -11
  170. package/src/components/ui/pagination/pagination-ellipsis.svelte +0 -12
  171. package/src/components/ui/pagination/pagination-item.svelte +0 -11
  172. package/src/components/ui/pagination/pagination-link.svelte +0 -26
  173. package/src/components/ui/pagination/pagination-next.svelte +0 -22
  174. package/src/components/ui/pagination/pagination-previous.svelte +0 -22
  175. package/src/components/ui/pagination/pagination.svelte +0 -11
  176. package/src/components/ui/popover/index.ts +0 -12
  177. package/src/components/ui/popover/popover-content.svelte +0 -25
  178. package/src/components/ui/progress/index.ts +0 -1
  179. package/src/components/ui/progress/progress.svelte +0 -22
  180. package/src/components/ui/scroll-area/index.ts +0 -1
  181. package/src/components/ui/scroll-area/scroll-area.svelte +0 -20
  182. package/src/components/ui/select/index.ts +0 -2
  183. package/src/components/ui/select/select.svelte +0 -36
  184. package/src/components/ui/separator/index.ts +0 -7
  185. package/src/components/ui/separator/separator.svelte +0 -23
  186. package/src/components/ui/sheet/index.ts +0 -16
  187. package/src/components/ui/sheet/sheet-content.svelte +0 -28
  188. package/src/components/ui/sheet/sheet-description.svelte +0 -22
  189. package/src/components/ui/sheet/sheet-footer.svelte +0 -22
  190. package/src/components/ui/sheet/sheet-header.svelte +0 -22
  191. package/src/components/ui/sheet/sheet-title.svelte +0 -22
  192. package/src/components/ui/sheet/sheet.svelte +0 -78
  193. package/src/components/ui/skeleton/index.ts +0 -2
  194. package/src/components/ui/skeleton/skeleton.svelte +0 -21
  195. package/src/components/ui/switch/index.ts +0 -2
  196. package/src/components/ui/switch/switch.svelte +0 -49
  197. package/src/components/ui/table/index.ts +0 -28
  198. package/src/components/ui/table/table-body.svelte +0 -15
  199. package/src/components/ui/table/table-caption.svelte +0 -20
  200. package/src/components/ui/table/table-cell.svelte +0 -15
  201. package/src/components/ui/table/table-footer.svelte +0 -20
  202. package/src/components/ui/table/table-head.svelte +0 -15
  203. package/src/components/ui/table/table-header.svelte +0 -20
  204. package/src/components/ui/table/table-row.svelte +0 -15
  205. package/src/components/ui/table/table.svelte +0 -17
  206. package/src/components/ui/tabs/index.ts +0 -15
  207. package/src/components/ui/tabs/tabs-content.svelte +0 -30
  208. package/src/components/ui/tabs/tabs-list.svelte +0 -26
  209. package/src/components/ui/tabs/tabs-trigger.svelte +0 -37
  210. package/src/components/ui/tabs/tabs.svelte +0 -27
  211. package/src/components/ui/textarea/index.ts +0 -2
  212. package/src/components/ui/textarea/textarea.svelte +0 -24
  213. package/src/components/ui/tooltip/index.ts +0 -19
  214. package/src/components/ui/tooltip/tooltip-content.svelte +0 -52
  215. package/src/components/ui/tooltip/tooltip-portal.svelte +0 -7
  216. package/src/components/ui/tooltip/tooltip-provider.svelte +0 -7
  217. package/src/components/ui/tooltip/tooltip-trigger.svelte +0 -7
  218. package/src/components/ui/tooltip/tooltip.svelte +0 -10
  219. package/src/editor-config.svelte.ts +0 -23
  220. package/src/index.ts +0 -155
  221. package/src/markdown-deps.d.ts +0 -21
  222. package/src/router-state.svelte.ts +0 -65
  223. package/src/types.ts +0 -33
  224. package/src/utils.ts +0 -28
package/package.json CHANGED
@@ -1,26 +1,31 @@
1
1
  {
2
2
  "name": "@svadmin/ui",
3
- "version": "0.29.0",
3
+ "version": "0.29.2",
4
4
  "description": "Pre-built admin UI components — AdminApp, AutoTable, AutoForm, Sidebar, Layout",
5
5
  "type": "module",
6
6
  "sideEffects": [
7
7
  "./src/app.css"
8
8
  ],
9
9
  "files": [
10
- "src/**/*"
10
+ "dist/**/*"
11
11
  ],
12
- "main": "src/index.ts",
13
- "types": "src/index.ts",
12
+ "main": "dist/index.js",
13
+ "types": "dist/index.d.d.ts",
14
14
  "exports": {
15
15
  ".": {
16
- "types": "./src/index.ts",
17
- "default": "./src/index.ts"
16
+ "types": "./dist/index.d.ts",
17
+ "default": "./dist/index.js",
18
+ "svelte": "./dist/index.js"
18
19
  },
19
- "./app.css": "./src/app.css",
20
- "./components/*": "./src/components/*"
20
+ "./app.css": {
21
+ "style": "./dist/app.css",
22
+ "default": "./dist/app.css",
23
+ "svelte": "./dist/app.css"
24
+ },
25
+ "./components/*": "./dist/components/*"
21
26
  },
22
27
  "peerDependencies": {
23
- "@svadmin/core": "^0.20.0",
28
+ "@svadmin/core": "^0.20.2",
24
29
  "@tanstack/svelte-query": "^6.0.0",
25
30
  "highlight.js": "^11.11.1",
26
31
  "isomorphic-dompurify": "^3.7.1",
@@ -65,5 +70,11 @@
65
70
  "homepage": "https://github.com/zuohuadong/svadmin#readme",
66
71
  "bugs": {
67
72
  "url": "https://github.com/zuohuadong/svadmin/issues"
73
+ },
74
+ "devDependencies": {
75
+ "@tanstack/table-core": "8.21.3"
76
+ },
77
+ "scripts": {
78
+ "build": "svelte-package -i src -o dist"
68
79
  }
69
80
  }
package/src/README.md DELETED
@@ -1,18 +0,0 @@
1
- # Name
2
- ### {{module_name}}
3
-
4
- # Synopsis
5
- {{synopsis}}
6
-
7
- # Description
8
-
9
- # Example
10
-
11
- # Install:
12
- `npm install {{module_name}}`
13
-
14
- # Test:
15
- `npm test`
16
-
17
- #License:
18
- {{license}}
package/src/actions.ts DELETED
@@ -1,110 +0,0 @@
1
- // Svelte Actions — reusable DOM behavior directives
2
- // Usage: <div use:clickOutside={() => close()}>
3
- // <div use:shortcut={{ key: 'k', ctrl: true, action: open }}>
4
-
5
- /**
6
- * Fires callback when clicking outside the node.
7
- */
8
- export function clickOutside(node: HTMLElement, callback: () => void) {
9
- const handle = (e: MouseEvent) => {
10
- if (node && !node.contains(e.target as Node) && !e.defaultPrevented) {
11
- callback();
12
- }
13
- };
14
-
15
- document.addEventListener('pointerdown', handle, true);
16
-
17
- return {
18
- update(newCallback: () => void) {
19
- callback = newCallback;
20
- },
21
- destroy() {
22
- document.removeEventListener('pointerdown', handle, true);
23
- },
24
- };
25
- }
26
-
27
- export interface ShortcutParams {
28
- key: string;
29
- ctrl?: boolean;
30
- shift?: boolean;
31
- alt?: boolean;
32
- action: () => void;
33
- }
34
-
35
- /**
36
- * Fires action on keyboard shortcut.
37
- */
38
- export function shortcut(_node: HTMLElement, params: ShortcutParams) {
39
- let current = params;
40
-
41
- const handle = (e: KeyboardEvent) => {
42
- const match =
43
- e.key.toLowerCase() === current.key.toLowerCase() &&
44
- (!current.ctrl || e.ctrlKey || e.metaKey) &&
45
- (!current.shift || e.shiftKey) &&
46
- (!current.alt || e.altKey);
47
-
48
- if (match) {
49
- e.preventDefault();
50
- current.action();
51
- }
52
- };
53
-
54
- window.addEventListener('keydown', handle);
55
-
56
- return {
57
- update(newParams: ShortcutParams) {
58
- current = newParams;
59
- },
60
- destroy() {
61
- window.removeEventListener('keydown', handle);
62
- },
63
- };
64
- }
65
-
66
- /**
67
- * Fires callback when element enters the viewport (infinite scroll sentinel).
68
- */
69
- export function intersect(node: HTMLElement, callback: () => void) {
70
- const observer = new IntersectionObserver(
71
- ([entry]) => {
72
- if (entry.isIntersecting) callback();
73
- },
74
- { rootMargin: '200px' },
75
- );
76
-
77
- observer.observe(node);
78
-
79
- return {
80
- update(newCallback: () => void) {
81
- callback = newCallback;
82
- },
83
- destroy() {
84
- observer.disconnect();
85
- },
86
- };
87
- }
88
-
89
- /**
90
- * Copies text content to clipboard on click.
91
- */
92
- export function copyOnClick(node: HTMLElement, text?: string) {
93
- let value = text;
94
-
95
- const handle = async () => {
96
- const content = value ?? node.textContent ?? '';
97
- await navigator.clipboard.writeText(content);
98
- };
99
-
100
- node.addEventListener('click', handle);
101
-
102
- return {
103
- update(newText: string) {
104
- value = newText;
105
- },
106
- destroy() {
107
- node.removeEventListener('click', handle);
108
- },
109
- };
110
- }
package/src/app.css DELETED
@@ -1,519 +0,0 @@
1
- /* Typography — Inter font for clean, modern look */
2
-
3
- /* @svadmin/ui — Design Tokens (Elygate-inspired)
4
- * Auto-imported by AdminApp. Can be overridden by consumer's CSS.
5
- *
6
- * Based on Elygate dashboard style: Indigo primary, light glassmorphism,
7
- * professional admin aesthetic with subtle depth.
8
- */
9
-
10
- @layer base {
11
- /* Global border-color reset — ensures Tailwind border utilities
12
- * (border-r, border-t, etc.) use the theme color instead of currentColor */
13
- *,
14
- ::after,
15
- ::before {
16
- border-color: var(--border);
17
- }
18
-
19
- :root {
20
- --radius: 0.5rem;
21
- --background: oklch(0.98 0.002 264);
22
- --foreground: oklch(0.13 0.02 265);
23
- --card: oklch(1 0 0);
24
- --card-foreground: oklch(0.13 0.02 265);
25
- --popover: oklch(1 0 0);
26
- --popover-foreground: oklch(0.13 0.02 265);
27
- --primary: oklch(0.488 0.243 264.376);
28
- --primary-foreground: oklch(0.985 0 0);
29
- --secondary: oklch(0.955 0.008 264);
30
- --secondary-foreground: oklch(0.2 0.04 265);
31
- --muted: oklch(0.955 0.005 264);
32
- --muted-foreground: oklch(0.45 0.03 260);
33
- --accent: oklch(0.955 0.008 264);
34
- --accent-foreground: oklch(0.2 0.04 265);
35
- --destructive: oklch(0.577 0.245 27.325);
36
- --destructive-foreground: oklch(0.985 0 0);
37
- --border: oklch(0.935 0.005 264);
38
- --input: oklch(0.935 0.005 264);
39
- --ring: oklch(0.488 0.243 264.376);
40
- --chart-1: oklch(0.488 0.243 264.376);
41
- --chart-2: oklch(0.6 0.118 184.704);
42
- --chart-3: oklch(0.398 0.07 227.392);
43
- --chart-4: oklch(0.828 0.189 84.429);
44
- --chart-5: oklch(0.769 0.188 70.08);
45
- --success: oklch(0.6 0.2 145);
46
- --success-foreground: oklch(0.985 0 0);
47
- --warning: oklch(0.75 0.18 85);
48
- --warning-foreground: oklch(0.3 0.08 60);
49
- --info: oklch(0.6 0.15 250);
50
- --info-foreground: oklch(0.985 0 0);
51
- --sidebar: oklch(1 0 0 / 80%);
52
- --sidebar-foreground: oklch(0.13 0.02 265);
53
- --sidebar-primary: oklch(0.488 0.243 264.376);
54
- --sidebar-primary-foreground: oklch(0.985 0 0);
55
- --sidebar-accent: oklch(0.94 0.025 264);
56
- --sidebar-accent-foreground: oklch(0.33 0.17 264);
57
- --sidebar-border: oklch(0.935 0.005 264);
58
- --sidebar-ring: oklch(0.488 0.243 264.376);
59
- }
60
-
61
- .dark {
62
- --background: oklch(0.13 0.015 265);
63
- --foreground: oklch(0.985 0 0);
64
- --card: oklch(0.16 0.015 265);
65
- --card-foreground: oklch(0.985 0 0);
66
- --popover: oklch(0.16 0.015 265);
67
- --popover-foreground: oklch(0.985 0 0);
68
- --primary: oklch(0.585 0.233 264);
69
- --primary-foreground: oklch(0.15 0.04 265);
70
- --secondary: oklch(0.23 0.025 265);
71
- --secondary-foreground: oklch(0.985 0 0);
72
- --muted: oklch(0.23 0.025 265);
73
- --muted-foreground: oklch(0.7 0.02 260);
74
- --accent: oklch(0.23 0.025 265);
75
- --accent-foreground: oklch(0.985 0 0);
76
- --destructive: oklch(0.704 0.191 22.216);
77
- --destructive-foreground: oklch(0.985 0 0);
78
- --border: oklch(0.27 0.02 265);
79
- --input: oklch(0.27 0.02 265);
80
- --ring: oklch(0.55 0.18 264);
81
- --chart-1: oklch(0.585 0.233 264);
82
- --chart-2: oklch(0.696 0.17 162.48);
83
- --chart-3: oklch(0.769 0.188 70.08);
84
- --chart-4: oklch(0.627 0.265 303.9);
85
- --chart-5: oklch(0.645 0.246 16.439);
86
- --success: oklch(0.65 0.2 150);
87
- --success-foreground: oklch(0.985 0 0);
88
- --warning: oklch(0.8 0.15 85);
89
- --warning-foreground: oklch(0.25 0.05 60);
90
- --info: oklch(0.65 0.15 250);
91
- --info-foreground: oklch(0.985 0 0);
92
- --sidebar: oklch(0.16 0.015 265 / 80%);
93
- --sidebar-foreground: oklch(0.985 0 0);
94
- --sidebar-primary: oklch(0.585 0.233 264);
95
- --sidebar-primary-foreground: oklch(0.985 0 0);
96
- --sidebar-accent: oklch(0.488 0.243 264.376 / 10%);
97
- --sidebar-accent-foreground: oklch(0.7 0.15 264);
98
- --sidebar-border: oklch(0.27 0.02 265);
99
- --sidebar-ring: oklch(0.55 0.18 264);
100
- }
101
-
102
- /* Stripe-inspired Soft Shadows — premium, multi-layered depth */
103
- [data-slot="button"],
104
- [data-slot="input"],
105
- [data-slot="select-trigger"],
106
- [data-slot="select"],
107
- [data-slot="textarea"] {
108
- /* Subtle interaction shadow */
109
- box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.04), 0 0 0 1px rgb(0 0 0 / 0.02);
110
- }
111
-
112
- /* Stripe-style: form inputs use card background instead of transparent */
113
- [data-slot="input"],
114
- [data-slot="textarea"],
115
- [data-slot="select"] {
116
- background-color: var(--card);
117
- }
118
-
119
- [data-slot="card"] {
120
- /* Classic Stripe soft shadow: faint ambient + directional drop */
121
- box-shadow: 0 2px 8px -2px rgb(0 0 0 / 0.05), 0 4px 16px -4px rgb(0 0 0 / 0.02);
122
- }
123
-
124
- [data-slot="dialog-content"],
125
- [data-slot="sheet-content"] {
126
- /* Deep floating layer for modals */
127
- box-shadow: 0 10px 30px -5px rgb(0 0 0 / 0.08), 0 20px 40px -10px rgb(0 0 0 / 0.04);
128
- }
129
- }
130
-
131
- body {
132
- font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
133
- -webkit-font-smoothing: antialiased;
134
- -moz-osx-font-smoothing: grayscale;
135
- }
136
-
137
- /* Premium Typography Refinements */
138
- h1, h2, h3 {
139
- letter-spacing: -0.025em;
140
- font-weight: 600;
141
- }
142
- h4, h5, h6 {
143
- letter-spacing: -0.01em;
144
- }
145
-
146
- /* Micro-interactions: Linear/Apple ecosystem click scales */
147
- [data-slot="button"],
148
- button {
149
- transition: transform 0.1s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.15s ease, box-shadow 0.15s ease;
150
- }
151
- [data-slot="button"]:active:not(:disabled),
152
- button:active:not(:disabled) {
153
- transform: scale(0.97);
154
- }
155
-
156
- /* Subtle glowing focus ring for inputs */
157
- [data-slot="input"]:focus-visible,
158
- [data-slot="textarea"]:focus-visible,
159
- [data-slot="select-trigger"]:focus-visible {
160
- box-shadow: 0 0 0 1px var(--color-background), 0 0 0 3px color-mix(in oklch, var(--color-primary) 30%, transparent) !important;
161
- border-color: var(--color-primary);
162
- }
163
-
164
- /* Base scrollbar styling (Firefox + Standard) */
165
- * {
166
- scrollbar-width: thin;
167
- scrollbar-color: oklch(0.8 0 0) transparent;
168
- }
169
- .dark * {
170
- scrollbar-color: oklch(0.35 0 0) transparent;
171
- }
172
-
173
- /* Scrollbar styling (Webkit) */
174
- ::-webkit-scrollbar { width: 6px; height: 6px; }
175
- ::-webkit-scrollbar-track { background: transparent; }
176
- ::-webkit-scrollbar-thumb { background: oklch(0.8 0 0); border-radius: 3px; }
177
- ::-webkit-scrollbar-thumb:hover { background: oklch(0.65 0 0); }
178
- .dark ::-webkit-scrollbar-thumb { background: oklch(0.35 0 0); }
179
- .dark ::-webkit-scrollbar-thumb:hover { background: oklch(0.45 0 0); }
180
-
181
- /* ① Card Hover Elevation Lift — Stripe-style float on hover */
182
- [data-slot="card"] {
183
- transition: box-shadow 0.2s ease, transform 0.2s ease;
184
- }
185
- @media (hover: hover) {
186
- [data-slot="card"]:hover {
187
- box-shadow: 0 4px 12px -2px rgb(0 0 0 / 0.08), 0 8px 24px -6px rgb(0 0 0 / 0.04);
188
- transform: translateY(-1px);
189
- }
190
- }
191
-
192
- /* ② Table Row Hover — primary color tint instead of plain gray */
193
- [data-slot="table-row"]:hover {
194
- background-color: color-mix(in oklch, var(--primary) 4%, var(--background)) !important;
195
- }
196
- [data-slot="table-row"] {
197
- transition: background-color 0.15s ease;
198
- }
199
-
200
- /* ③ Sidebar Active Indicator — Linear-style left accent bar */
201
- .sidebar-nav-active {
202
- position: relative;
203
- }
204
- .sidebar-nav-active::before {
205
- content: '';
206
- position: absolute;
207
- left: 0;
208
- top: 50%;
209
- transform: translateY(-50%);
210
- width: 3px;
211
- height: 60%;
212
- border-radius: 0 3px 3px 0;
213
- background: var(--primary);
214
- opacity: 1;
215
- transition: opacity 0.2s ease;
216
- }
217
-
218
- /* ④ Skeleton Shimmer — metallic light sweep instead of static pulse */
219
- @keyframes svadmin-shimmer {
220
- 0% { background-position: -200% 0; }
221
- 100% { background-position: 200% 0; }
222
- }
223
- [data-slot="skeleton"] {
224
- animation: svadmin-shimmer 1.5s ease-in-out infinite !important;
225
- background: linear-gradient(90deg, var(--muted) 25%, color-mix(in oklch, var(--muted) 60%, white) 50%, var(--muted) 75%) !important;
226
- background-size: 200% 100% !important;
227
- }
228
- .dark [data-slot="skeleton"] {
229
- background: linear-gradient(90deg, var(--muted) 25%, color-mix(in oklch, var(--muted) 60%, var(--foreground)) 50%, var(--muted) 75%) !important;
230
- }
231
-
232
- /* ⑤ Route Page Transition — fade + subtle slide-up */
233
- @keyframes svadmin-page-enter {
234
- from {
235
- opacity: 0;
236
- transform: translateY(6px);
237
- }
238
- to {
239
- opacity: 1;
240
- transform: translateY(0);
241
- }
242
- }
243
- .svadmin-page-enter {
244
- animation: svadmin-page-enter 0.25s ease-out;
245
- }
246
-
247
- /* ⑥ Toast slide-in refinement (sonner-svelte) — tighter timing */
248
- [data-sonner-toaster] [data-sonner-toast] {
249
- transition-duration: 200ms !important;
250
- transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
251
- }
252
-
253
- /* ⑦ Gradient Top Border on Cards — Vercel dashboard style */
254
- [data-slot="card"]::before {
255
- content: '';
256
- position: absolute;
257
- top: 0;
258
- left: 0;
259
- right: 0;
260
- height: 1px;
261
- background: linear-gradient(90deg, transparent, color-mix(in oklch, var(--primary) 20%, transparent), transparent);
262
- border-radius: inherit;
263
- pointer-events: none;
264
- }
265
- [data-slot="card"] {
266
- position: relative;
267
- overflow: hidden;
268
- }
269
-
270
- /* ⑧ Dark Mode Primary Glow — Linear-style neon accents */
271
- .dark [data-slot="button"][data-variant="default"],
272
- .dark [data-slot="badge"][data-variant="default"] {
273
- box-shadow: 0 0 12px -3px color-mix(in oklch, var(--primary) 40%, transparent);
274
- }
275
-
276
- /* ⑨ Form Validation Shake Animation */
277
- @keyframes svadmin-shake {
278
- 0%, 100% { transform: translateX(0); }
279
- 20% { transform: translateX(-6px); }
280
- 40% { transform: translateX(5px); }
281
- 60% { transform: translateX(-4px); }
282
- 80% { transform: translateX(2px); }
283
- }
284
- .svadmin-shake {
285
- animation: svadmin-shake 0.4s ease-out;
286
- }
287
-
288
- /* ⑩ Table Row Staggered Entrance */
289
- @keyframes svadmin-row-enter {
290
- from {
291
- opacity: 0;
292
- transform: translateY(4px);
293
- }
294
- to {
295
- opacity: 1;
296
- transform: translateY(0);
297
- }
298
- }
299
- [data-slot="table-body"] [data-slot="table-row"] {
300
- animation: svadmin-row-enter 0.3s ease-out both;
301
- }
302
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(1) { animation-delay: 0s; }
303
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(2) { animation-delay: 0.03s; }
304
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(3) { animation-delay: 0.06s; }
305
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(4) { animation-delay: 0.09s; }
306
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(5) { animation-delay: 0.12s; }
307
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(6) { animation-delay: 0.15s; }
308
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(7) { animation-delay: 0.18s; }
309
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(8) { animation-delay: 0.21s; }
310
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(9) { animation-delay: 0.24s; }
311
- [data-slot="table-body"] [data-slot="table-row"]:nth-child(10) { animation-delay: 0.27s; }
312
-
313
- /* ⑪ Accessibility: Respect reduced motion preferences */
314
- @media (prefers-reduced-motion: reduce) {
315
- *, *::before, *::after {
316
- animation-duration: 0.01ms !important;
317
- animation-iteration-count: 1 !important;
318
- transition-duration: 0.01ms !important;
319
- scroll-behavior: auto !important;
320
- }
321
- }
322
-
323
- /* ⑫b Safe Area Inset — iPhone notch / Home Bar support */
324
- @supports (padding-bottom: env(safe-area-inset-bottom)) {
325
- main {
326
- padding-bottom: env(safe-area-inset-bottom);
327
- }
328
- }
329
-
330
- /* ⑫ Optimistic Delete — row fade-out visual feedback */
331
- @keyframes svadmin-row-delete {
332
- from {
333
- opacity: 1;
334
- transform: translateX(0);
335
- }
336
- to {
337
- opacity: 0;
338
- transform: translateX(20px);
339
- height: 0;
340
- padding: 0;
341
- margin: 0;
342
- }
343
- }
344
- .svadmin-deleting {
345
- animation: svadmin-row-delete 0.3s ease-out forwards;
346
- pointer-events: none;
347
- }
348
-
349
- /* ⑬ Popover & Dropdown — frosted glass backdrop + spring entrance */
350
- [data-slot="popover-content"],
351
- [data-slot="dropdown-menu-content"],
352
- [data-slot="context-menu-content"] {
353
- backdrop-filter: blur(8px);
354
- -webkit-backdrop-filter: blur(8px);
355
- }
356
-
357
- /* ⑭ Tooltip spring entrance */
358
- [data-slot="tooltip-content"] {
359
- animation: svadmin-tooltip-enter 0.15s cubic-bezier(0.16, 1, 0.3, 1);
360
- }
361
- @keyframes svadmin-tooltip-enter {
362
- from {
363
- opacity: 0;
364
- transform: scale(0.96);
365
- }
366
- to {
367
- opacity: 1;
368
- transform: scale(1);
369
- }
370
- }
371
-
372
- /* ⑮ Smooth scrolling for content areas */
373
- main {
374
- scroll-behavior: smooth;
375
- }
376
-
377
- /* ⑯ RTL (Right-to-Left) Language Support */
378
- [dir="rtl"] {
379
- direction: rtl;
380
- }
381
- [dir="rtl"] aside {
382
- left: auto;
383
- right: 0;
384
- }
385
- [dir="rtl"] .sidebar-nav-active::before {
386
- left: auto;
387
- right: 0;
388
- border-radius: 3px 0 0 3px;
389
- }
390
- /* Mirror sidebar margins for RTL */
391
- [dir="rtl"] .md\:ml-64 {
392
- margin-left: 0;
393
- margin-right: 16rem;
394
- }
395
- [dir="rtl"] .md\:ml-16 {
396
- margin-left: 0;
397
- margin-right: 4rem;
398
- }
399
-
400
- /* ⑰ Accessibility Minimum Touch Target — Apple HIG 44px minimum */
401
- @media (max-width: 640px) and (pointer: coarse) {
402
- [data-slot="button"] {
403
- position: relative;
404
- }
405
- [data-slot="button"]::after {
406
- content: '';
407
- position: absolute;
408
- top: 50%;
409
- left: 50%;
410
- transform: translate(-50%, -50%);
411
- min-width: 44px;
412
- min-height: 44px;
413
- width: 100%;
414
- height: 100%;
415
- z-index: 1;
416
- }
417
- }
418
-
419
- /* Tailwind CSS v4 — Map design tokens to utility classes */
420
- @theme {
421
- --color-background: var(--background);
422
- --color-foreground: var(--foreground);
423
- --color-card: var(--card);
424
- --color-card-foreground: var(--card-foreground);
425
- --color-popover: var(--popover);
426
- --color-popover-foreground: var(--popover-foreground);
427
- --color-primary: var(--primary);
428
- --color-primary-foreground: var(--primary-foreground);
429
- --color-secondary: var(--secondary);
430
- --color-secondary-foreground: var(--secondary-foreground);
431
- --color-muted: var(--muted);
432
- --color-muted-foreground: var(--muted-foreground);
433
- --color-accent: var(--accent);
434
- --color-accent-foreground: var(--accent-foreground);
435
- --color-destructive: var(--destructive);
436
- --color-destructive-foreground: var(--destructive-foreground);
437
- --color-border: var(--border);
438
- --color-input: var(--input);
439
- --color-ring: var(--ring);
440
- --color-chart-1: var(--chart-1);
441
- --color-chart-2: var(--chart-2);
442
- --color-chart-3: var(--chart-3);
443
- --color-chart-4: var(--chart-4);
444
- --color-chart-5: var(--chart-5);
445
- --color-sidebar: var(--sidebar);
446
- --color-sidebar-foreground: var(--sidebar-foreground);
447
- --color-sidebar-primary: var(--sidebar-primary);
448
- --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
449
- --color-sidebar-accent: var(--sidebar-accent);
450
- --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
451
- --color-sidebar-border: var(--sidebar-border);
452
- --color-sidebar-ring: var(--sidebar-ring);
453
- --color-success: var(--success);
454
- --color-success-foreground: var(--success-foreground);
455
- --color-warning: var(--warning);
456
- --color-warning-foreground: var(--warning-foreground);
457
- --color-info: var(--info);
458
- --color-info-foreground: var(--info-foreground);
459
- --radius-sm: calc(var(--radius) - 4px);
460
- --radius-md: calc(var(--radius) - 2px);
461
- --radius-lg: var(--radius);
462
- --radius-xl: calc(var(--radius) + 4px);
463
- }
464
-
465
- /* ─── svadmin UI Components CSS ─────────────────────────────── */
466
- /* These rules were moved from .svelte files to eliminate <style> tags */
467
-
468
- /* MarkdownRenderer Styles */
469
- .prose {
470
- line-height: 1.6;
471
- }
472
- .prose p {
473
- margin-top: 0.5em;
474
- margin-bottom: 0.5em;
475
- }
476
-
477
- /* Streaming cursor effect */
478
- .streaming > *:last-child::after {
479
- content: '▋';
480
- display: inline-block;
481
- animation: svadmin-blink 1s step-start infinite;
482
- margin-left: 2px;
483
- vertical-align: baseline;
484
- color: currentColor;
485
- }
486
-
487
- @keyframes svadmin-blink {
488
- 50% { opacity: 0; }
489
- }
490
-
491
- /* Handle copied state for dynamically injected buttons */
492
- .copy-btn[data-copied-id] {
493
- color: #10b981; /* Tailwind emerald-500 */
494
- }
495
- .copy-btn[data-copied-id] svg {
496
- /* Swap to Check icon */
497
- content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%2310b981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>');
498
- }
499
-
500
- /* ChatDialog Styles */
501
- .chat-markdown pre.chat-code-block {
502
- background: var(--color-muted, hsl(var(--muted)));
503
- border-radius: 0.5rem;
504
- padding: 0.75rem;
505
- margin: 0.5rem 0;
506
- overflow-x: auto;
507
- font-size: 0.75rem;
508
- line-height: 1.5;
509
- }
510
- .chat-markdown code.chat-inline-code {
511
- background: var(--color-muted, hsl(var(--muted)));
512
- padding: 0.125rem 0.375rem;
513
- border-radius: 0.25rem;
514
- font-size: 0.8125em;
515
- font-family: ui-monospace, monospace;
516
- }
517
- .chat-markdown strong {
518
- font-weight: 600;
519
- }