mirror of
https://github.com/actualbudget/actual.git
synced 2026-07-29 23:34:31 -05:00
8f0265e0b0
* [AI] Convert theme color TS modules to CSS files with CSS variables
Replace `palette.ts` and `themes/{light,dark,midnight}.ts` with plain CSS
files that declare the same variables directly via `:root` blocks. The
palette becomes `--palette-*` variables; each theme defines `--color-*`
variables referencing those (or other `--color-*` for intra-theme aliases).
`theme.tsx` and Storybook's `preview.tsx` now import each CSS file as a
string via Vite's `?inline` query and render two `<style>` tags (palette +
active theme) instead of building the variable declarations at runtime
from a TS object.
Auto/dark-preference selection, `prefers-color-scheme` listening, the
custom-theme baseTheme override, and the `CustomThemeStyle` override layer
are all preserved.
* [AI] Move theme CSS files to component-library
Move palette.css and themes/{light,dark,midnight}.css from desktop-client's
style/ directory into component-library at src/themes/, and add explicit
package.json exports for each. desktop-client's theme.tsx now imports them
via `@actual-app/components/themes/*.css?inline`, and Storybook's
preview.tsx uses a normal relative path inside its own package instead of
reaching across the monorepo boundary.
* [AI] Minimize theme.tsx rename churn
Keep the original variable names — `themes[*].colors`, `themeColors` state,
`lightColors` / `darkColors` locals, and `getBaseThemeColors` — even though
they now hold CSS strings rather than color objects. Limits the diff to the
import changes, the state type, and the render path.
* [AI] Add release note for theme CSS conversion
---------
Co-authored-by: Claude <noreply@anthropic.com>
79 lines
2.7 KiB
JSON
79 lines
2.7 KiB
JSON
{
|
|
"name": "@actual-app/components",
|
|
"version": "0.0.1",
|
|
"license": "MIT",
|
|
"imports": {
|
|
"#tokens": "./src/tokens.ts"
|
|
},
|
|
"exports": {
|
|
"./hooks/*": "./src/hooks/*.ts",
|
|
"./icons/logo": "./src/icons/logo/index.ts",
|
|
"./icons/v0": "./src/icons/v0/index.ts",
|
|
"./icons/v1": "./src/icons/v1/index.ts",
|
|
"./icons/v2": "./src/icons/v2/index.ts",
|
|
"./icons/AnimatedLoading": "./src/icons/AnimatedLoading.tsx",
|
|
"./icons/Loading": "./src/icons/Loading.tsx",
|
|
"./aligned-text": "./src/AlignedText.tsx",
|
|
"./block": "./src/Block.tsx",
|
|
"./button": "./src/Button.tsx",
|
|
"./card": "./src/Card.tsx",
|
|
"./form-error": "./src/FormError.tsx",
|
|
"./initial-focus": "./src/InitialFocus.ts",
|
|
"./inline-field": "./src/InlineField.tsx",
|
|
"./input": "./src/Input.tsx",
|
|
"./label": "./src/Label.tsx",
|
|
"./menu": "./src/Menu.tsx",
|
|
"./paragraph": "./src/Paragraph.tsx",
|
|
"./popover": "./src/Popover.tsx",
|
|
"./select": "./src/Select.tsx",
|
|
"./space-between": "./src/SpaceBetween.tsx",
|
|
"./styles": "./src/styles.ts",
|
|
"./text": "./src/Text.tsx",
|
|
"./text-one-line": "./src/TextOneLine.tsx",
|
|
"./theme": "./src/theme.ts",
|
|
"./themes/palette.css": "./src/themes/palette.css",
|
|
"./themes/light.css": "./src/themes/light.css",
|
|
"./themes/dark.css": "./src/themes/dark.css",
|
|
"./themes/midnight.css": "./src/themes/midnight.css",
|
|
"./tokens": "./src/tokens.ts",
|
|
"./toggle": "./src/Toggle.tsx",
|
|
"./tooltip": "./src/Tooltip.tsx",
|
|
"./view": "./src/View.tsx",
|
|
"./color-picker": "./src/ColorPicker.tsx"
|
|
},
|
|
"scripts": {
|
|
"generate:icons": "rm src/icons/*/*.tsx; cd src/icons && svgr --template template.ts --index-template index-template.ts --typescript --expand-props start -d . .",
|
|
"test": "npm-run-all -cp 'test:*'",
|
|
"test:web": "ENV=web vitest --run -c vitest.web.config.ts",
|
|
"start:storybook": "storybook dev -p 6006",
|
|
"build:storybook": "storybook build",
|
|
"typecheck": "tsgo -b"
|
|
},
|
|
"dependencies": {
|
|
"@emotion/css": "^11.13.5",
|
|
"react-aria-components": "^1.16.0",
|
|
"usehooks-ts": "^3.1.1"
|
|
},
|
|
"devDependencies": {
|
|
"@chromatic-com/storybook": "^5.1.1",
|
|
"@storybook/addon-a11y": "^10.3.4",
|
|
"@storybook/addon-docs": "^10.3.4",
|
|
"@storybook/react-vite": "^10.3.4",
|
|
"@svgr/babel-plugin-add-jsx-attribute": "^8.0.0",
|
|
"@svgr/cli": "^8.1.0",
|
|
"@types/react": "^19.2.14",
|
|
"@typescript/native-preview": "beta",
|
|
"@vitejs/plugin-react": "^6.0.1",
|
|
"eslint-plugin-storybook": "^10.3.4",
|
|
"react": "19.2.4",
|
|
"react-dom": "19.2.4",
|
|
"storybook": "^10.3.4",
|
|
"vite": "^8.0.5",
|
|
"vitest": "^4.1.2"
|
|
},
|
|
"peerDependencies": {
|
|
"react": ">=19.2",
|
|
"react-dom": ">=19.2"
|
|
}
|
|
}
|