Use new design-core package (#10548)

* chore(ui): remove Terrazzo design tokens, config, and docs to stop generating CSS and simplify repo

* update tokens usage in UI package

* chore: update design-core ref, add core workspace, and adjust font paths and metadata

* update design-core usage for all packages

* update design-core import

* chore: pin @gitbutler/design-core to v1.0.3 instead of Git URL to ensure stable dev dependency resolution

Author: PavelLaptev

.github/pr-labeler.yml

@@ -19,7 +19,3 @@ rust:
 '@gitbutler/no-relative-imports':
   - changed-files:
       - any-glob-to-any-file: packages/no-relative-imports/**/*
-
-'@gitbutler/design-tokens':
-  - changed-files:
-      - any-glob-to-any-file: packages/design-tokens/**/*

.gitignore

@@ -64,3 +64,6 @@ storybook-static
 # Claude
 .swarm
 .claude-flow
+
+# Auto-generated design tokens
+packages/ui/src/styles/tokens.css

apps/desktop/package.json

@@ -24,6 +24,7 @@
 	},
 	"devDependencies": {
 		"@anthropic-ai/sdk": "^0.59.0",
+		"@gitbutler/design-core": "^1.0.3",
 		"@gitbutler/core": "workspace:*",
 		"@gitbutler/shared": "workspace:*",
 		"@gitbutler/svelte-comment-injector": "workspace:*",

apps/desktop/src/routes/+layout.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+	import '@gitbutler/design-core/tokens';
+	import '@gitbutler/design-core/fonts';
 	import '../styles/styles.css';
 	import { browser, dev } from '$app/environment';
 	import { afterNavigate, beforeNavigate } from '$app/navigation';

apps/web/package.json

@@ -15,6 +15,7 @@
 	},
 	"devDependencies": {
 		"@csstools/postcss-global-data": "^3.0.0",
+		"@gitbutler/design-core": "^1.0.3",
 		"@gitbutler/core": "workspace:*",
 		"@gitbutler/shared": "workspace:*",
 		"@gitbutler/ui": "workspace:*",

apps/web/src/routes/+layout.svelte

@@ -16,6 +16,8 @@
 	import { WebRoutesService, WEB_ROUTES_SERVICE } from '@gitbutler/shared/routing/webRoutes.svelte';
 	import { type Snippet } from 'svelte';
 	import { get } from 'svelte/store';
+	import '@gitbutler/design-core/tokens';
+	import '@gitbutler/design-core/fonts';
 	import '$lib/styles/global.css';
 
 	interface Props {

packages/ui/.storybook/preview.ts

@@ -1,6 +1,7 @@
 import type { Preview } from '@storybook/sveltekit';
+import '@gitbutler/design-core/tokens';
+import '@gitbutler/design-core/fonts';
 import '../src/styles/main.css';
-import '../src/styles/fonts/fonts.css';
 import './stories-styles.css';
 
 const preview: Preview = {

packages/ui/package.json

@@ -17,9 +17,7 @@
 		"dev:package:styles": "postcss ./src/styles/main.css -o ./dist/styles/main.css --watch",
 		"package": "pnpm run --sequential \"/^package:.*/\"",
 		"package:svelte": "svelte-kit sync && svelte-package",
-		"package:styles": "postcss ./src/styles/main.css -o ./dist/styles/main.css && npm run package:fonts",
-		"package:fonts": "cp -r ./src/styles/fonts ./dist/styles/",
-		"design-tokens:build": "npx tz build && prettier --write ./src/lib/data/design-tokens.json ./src/styles/core/design-tokens.css",
+		"package:styles": "postcss ./src/styles/main.css -o ./dist/styles/main.css",
 		"prepublishOnly": "pnpm run package",
 		"prepare": "svelte-kit sync",
 		"storybook": "storybook dev --no-open -p 6006",
@@ -45,7 +43,6 @@
 		"@codemirror/language": "^6.11.2",
 		"@codemirror/legacy-modes": "^6.5.1",
 		"@csstools/postcss-bundler": "^2.0.8",
-		"@gitbutler/core": "workspace:*",
 		"@lezer/common": "^1.2.3",
 		"@lezer/highlight": "^1.2.1",
 		"@replit/codemirror-lang-svelte": "^6.0.0",
@@ -59,9 +56,6 @@
 		"@sveltejs/kit": "catalog:svelte",
 		"@sveltejs/package": "catalog:svelte",
 		"@sveltejs/vite-plugin-svelte": "catalog:svelte",
-		"@terrazzo/cli": "0.6.0",
-		"@terrazzo/parser": "0.6.0",
-		"@terrazzo/plugin-css": "0.6.0",
 		"@types/diff-match-patch": "^1.0.36",
 		"@types/postcss-pxtorem": "^6.1.0",
 		"@vitest/browser": "catalog:",
@@ -82,7 +76,8 @@
 		"svelte": "catalog:svelte",
 		"svelte-check": "catalog:svelte",
 		"vite": "catalog:",
-		"vitest": "catalog:"
+		"vitest": "catalog:",
+		"@gitbutler/design-core": "^1.0.3"
 	},
 	"peerDependencies": {
 		"svelte": "^4.0.0 || ^5.0.0-0"
@@ -122,6 +117,7 @@
 		"@giphy/js-fetch-api": "^5.7.0",
 		"@giphy/js-types": "^5.1.0",
 		"@giphy/svelte-components": "^1.1.0",
+		"@gitbutler/core": "workspace:*",
 		"@lexical/link": "0.27.1",
 		"@lexical/list": "0.27.1",
 		"@lexical/markdown": "0.27.1",