@kodaicoder/shadcn-svelte-daisyui-adapter 0.1.0 → 0.2.0
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.
- package/CHANGELOG.md +15 -9
- package/README.md +110 -103
- package/cli/init.mjs +6 -15
- package/package.json +40 -40
package/CHANGELOG.md
CHANGED
|
@@ -1,9 +1,15 @@
|
|
|
1
|
-
# Changelog
|
|
2
|
-
|
|
3
|
-
## 0.
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
## 0.2.0
|
|
4
|
+
|
|
5
|
+
The CLI no longer creates `daisyui-adapter.overrides.css` or writes its `@import` line. Overrides are opt-in: the user adds the file and the import, and the README's Overrides section describes how. An existing file and import are left untouched, so a project that installed 0.1.0 keeps both.
|
|
6
|
+
|
|
7
|
+
A re-run applies the change to a 0.1.0 project, and the header comment updates to 0.2.0.
|
|
8
|
+
|
|
9
|
+
## 0.1.0
|
|
10
|
+
|
|
11
|
+
First release. The CLI writes the header comment, the `@plugin "@kodaicoder/shadcn-svelte-daisyui-adapter";` line, the `daisyui-adapter.overrides.css` file and its import, and the 32 bindings per block; the plugin emits `--daisy-color-*` and `--daisy-radius` from `src/daisyui-theme.css` at build time.
|
|
12
|
+
|
|
13
|
+
The first install is the only required run. A later `shadcn-svelte init` keeps the header comment and the override import, wipes the bindings, and the next `init` restores them.
|
|
14
|
+
|
|
15
|
+
A change to the mapping table or to the shape the plugin emits is a minor bump, and it requires a re-run. The header comment names the version that wrote the stylesheet, so a project can tell which one it holds.
|
package/README.md
CHANGED
|
@@ -1,103 +1,110 @@
|
|
|
1
|
-
# @kodaicoder/shadcn-svelte-daisyui-adapter
|
|
2
|
-
|
|
3
|
-
Generate a shadcn-svelte token set from a daisyUI v5 theme, at build time, with no daisyUI runtime dependency.
|
|
4
|
-
|
|
5
|
-
The CLI reads your stylesheet and your `src/daisyui-theme.css`, then rewrites each `:root` and `.dark` block so every shadcn token reads a daisyUI value, with the value that was already in the file as the fallback. It also writes the `@plugin` line and the chart ramp. The plugin then emits `--daisy-color-*` and `--daisy-radius` from the theme while Tailwind builds, so a theme change takes one rebuild and no re-run.
|
|
6
|
-
|
|
7
|
-
This package is not affiliated with shadcn-svelte or daisyUI. Both names are used only to say what it reads and what it writes.
|
|
8
|
-
|
|
9
|
-
## Prerequisites
|
|
10
|
-
|
|
11
|
-
- A SvelteKit project with `shadcn-svelte` set up through step 4 of its guide.
|
|
12
|
-
- `components.json` at the project root, with `tailwind.css` pointing at the project's global stylesheet (`src/routes/layout.css` on SvelteKit 3, `src/app.css` on older projects). The CLI reads that path on every run and never hardcodes it.
|
|
13
|
-
- That stylesheet imported by the root layout.
|
|
14
|
-
- `src/daisyui-theme.css` holding one light and one dark block from the [daisyUI theme generator](https://daisyui.com/theme-generator/). Copy the blocks as they are, including the `@plugin "daisyui/theme"` prelude.
|
|
15
|
-
|
|
16
|
-
## Usage
|
|
17
|
-
|
|
18
|
-
```bash
|
|
19
|
-
# 1. paste one light and one dark block from the theme generator
|
|
20
|
-
# into src/daisyui-theme.css
|
|
21
|
-
|
|
22
|
-
# 2. shadcn-svelte, as its guide says
|
|
23
|
-
pnpm dlx shadcn-svelte@latest init
|
|
24
|
-
|
|
25
|
-
# 3. the adapter, at an exact version
|
|
26
|
-
pnpm dlx @kodaicoder/shadcn-svelte-daisyui-adapter@0.
|
|
27
|
-
|
|
28
|
-
# 4. the gate
|
|
29
|
-
pnpm build
|
|
30
|
-
```
|
|
31
|
-
|
|
32
|
-
The CLI adds the package as a devDependency at its own version, because the `@plugin` specifier resolves through `node_modules` at build time. Run it from the project root.
|
|
33
|
-
|
|
34
|
-
## What the CLI prints
|
|
35
|
-
|
|
36
|
-
```
|
|
37
|
-
[daisyui-adapter] theme ok: light + dark
|
|
38
|
-
[daisyui-adapter] wrote src/routes/layout.css
|
|
39
|
-
[daisyui-adapter] 32 light, 32 dark
|
|
40
|
-
[daisyui-adapter]
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
-
|
|
59
|
-
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
html.dark
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
```
|
|
102
|
-
|
|
103
|
-
|
|
1
|
+
# @kodaicoder/shadcn-svelte-daisyui-adapter
|
|
2
|
+
|
|
3
|
+
Generate a shadcn-svelte token set from a daisyUI v5 theme, at build time, with no daisyUI runtime dependency.
|
|
4
|
+
|
|
5
|
+
The CLI reads your stylesheet and your `src/daisyui-theme.css`, then rewrites each `:root` and `.dark` block so every shadcn token reads a daisyUI value, with the value that was already in the file as the fallback. It also writes the `@plugin` line and the chart ramp. The plugin then emits `--daisy-color-*` and `--daisy-radius` from the theme while Tailwind builds, so a theme change takes one rebuild and no re-run.
|
|
6
|
+
|
|
7
|
+
This package is not affiliated with shadcn-svelte or daisyUI. Both names are used only to say what it reads and what it writes.
|
|
8
|
+
|
|
9
|
+
## Prerequisites
|
|
10
|
+
|
|
11
|
+
- A SvelteKit project with `shadcn-svelte` set up through step 4 of its guide.
|
|
12
|
+
- `components.json` at the project root, with `tailwind.css` pointing at the project's global stylesheet (`src/routes/layout.css` on SvelteKit 3, `src/app.css` on older projects). The CLI reads that path on every run and never hardcodes it.
|
|
13
|
+
- That stylesheet imported by the root layout.
|
|
14
|
+
- `src/daisyui-theme.css` holding one light and one dark block from the [daisyUI theme generator](https://daisyui.com/theme-generator/). Copy the blocks as they are, including the `@plugin "daisyui/theme"` prelude.
|
|
15
|
+
|
|
16
|
+
## Usage
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
# 1. paste one light and one dark block from the theme generator
|
|
20
|
+
# into src/daisyui-theme.css
|
|
21
|
+
|
|
22
|
+
# 2. shadcn-svelte, as its guide says
|
|
23
|
+
pnpm dlx shadcn-svelte@latest init
|
|
24
|
+
|
|
25
|
+
# 3. the adapter, at an exact version
|
|
26
|
+
pnpm dlx @kodaicoder/shadcn-svelte-daisyui-adapter@0.2.0 init
|
|
27
|
+
|
|
28
|
+
# 4. the gate
|
|
29
|
+
pnpm build
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
The CLI adds the package as a devDependency at its own version, because the `@plugin` specifier resolves through `node_modules` at build time. Run it from the project root.
|
|
33
|
+
|
|
34
|
+
## What the CLI prints
|
|
35
|
+
|
|
36
|
+
```
|
|
37
|
+
[daisyui-adapter] theme ok: light + dark
|
|
38
|
+
[daisyui-adapter] wrote src/routes/layout.css
|
|
39
|
+
[daisyui-adapter] 32 light, 32 dark
|
|
40
|
+
[daisyui-adapter] installed @kodaicoder/shadcn-svelte-daisyui-adapter@0.2.0
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
The declaration count comes back from the file it wrote, so a stylesheet missing a row the adapter expects shows a number below 32. A second run prints `already installed` instead of installing again. A run on a stylesheet from 0.1.0 prints `upgrading 0.1.0 -> 0.2.0` before the rest.
|
|
44
|
+
|
|
45
|
+
A missing theme file is a warning, not a failure. The CLI prints `E1`, writes the bindings with your own values as fallbacks, and the build renders the project's palette. A malformed theme file exits non-zero with `E2` or `E3`, because a wrong pair would render wrong colours silently.
|
|
46
|
+
|
|
47
|
+
## The header comment
|
|
48
|
+
|
|
49
|
+
The first line of the stylesheet is the version marker:
|
|
50
|
+
|
|
51
|
+
```
|
|
52
|
+
/* @kodaicoder/shadcn-svelte-daisyui-adapter 0.2.0 | re-run `pnpm dlx @kodaicoder/shadcn-svelte-daisyui-adapter@0.2.0 init` after `shadcn-svelte init` */
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
`shadcn-svelte init` keeps the header comment, wipes the bindings, and the next adapter run restores them. If the project has an override import, that import is kept too, but the CLI does not create it. Re-run when:
|
|
56
|
+
|
|
57
|
+
- `shadcn-svelte init` or a large `add` changed the stylesheet;
|
|
58
|
+
- you moved to a newer CLI and want the header to name it;
|
|
59
|
+
- the changelog says the mapping table or the emitted shape changed.
|
|
60
|
+
|
|
61
|
+
The CLI refuses to run when the header names a newer version than the CLI. It prints `E4`, exits non-zero and writes nothing, because an older CLI would undo bindings a newer one wrote. Run the version the header names, or upgrade the CLI.
|
|
62
|
+
|
|
63
|
+
## Overrides (optional)
|
|
64
|
+
|
|
65
|
+
The CLI does not create `daisyui-adapter.overrides.css` and does not write its import. Overrides are opt-in: you add both yourself.
|
|
66
|
+
|
|
67
|
+
To use overrides, create `daisyui-adapter.overrides.css` beside the global stylesheet, then add this line after the other `@import` lines and before the generated `:root` and `.dark` blocks:
|
|
68
|
+
|
|
69
|
+
```css
|
|
70
|
+
@import "./daisyui-adapter.overrides.css";
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
The CLI never writes or deletes the file. If the project installed 0.1.0, the file and the import already exist. Keep them if you use them, or delete both if you do not.
|
|
74
|
+
|
|
75
|
+
The import comes before the generated blocks, so a plain `:root` there loses on source order. Raise the specificity and keep the light block out of dark mode. Use `html:not(.dark)` for light and `html.dark` for dark:
|
|
76
|
+
|
|
77
|
+
```css
|
|
78
|
+
html:not(.dark) {
|
|
79
|
+
--daisy-derived-chart-1: oklch(0.62 0.08 250);
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
html.dark {
|
|
83
|
+
--daisy-derived-chart-1: oklch(0.72 0.08 250);
|
|
84
|
+
}
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
Both selectors beat the generated `:root` and `.dark`, and the light one does not leak into dark. Write the pair when you need both schemes.
|
|
88
|
+
|
|
89
|
+
## Version policy
|
|
90
|
+
|
|
91
|
+
The header records one exact version, and that number is what a project holds. A patch release fixes the CLI or the parser without moving a key or changing a shape, and does not need a re-run. A change to the mapping table, to a token's shape or to what the plugin emits is a minor bump, and it requires a re-run. The changelog names each one.
|
|
92
|
+
|
|
93
|
+
## Checking the result
|
|
94
|
+
|
|
95
|
+
`pnpm build` is the gate. The plugin reads `src/daisyui-theme.css` while Tailwind builds, so a malformed theme block fails there. With the theme removed, the build still passes and the page renders the pre-adapter palette.
|
|
96
|
+
|
|
97
|
+
## Testing a tarball before publish
|
|
98
|
+
|
|
99
|
+
`pnpm pack` writes `kodaicoder-shadcn-svelte-daisyui-adapter-0.2.0.tgz`. Set `DAISYUI_ADAPTER_INSTALL_SPEC` to that file and the CLI installs it instead of the registry copy. Pack from the package directory, then run the CLI from the app's root:
|
|
100
|
+
|
|
101
|
+
```bash
|
|
102
|
+
# in packages/daisyui-adapter, writing into the app's root
|
|
103
|
+
pnpm pack --pack-destination <app>
|
|
104
|
+
|
|
105
|
+
# in the app's root
|
|
106
|
+
DAISYUI_ADAPTER_INSTALL_SPEC=./kodaicoder-shadcn-svelte-daisyui-adapter-0.2.0.tgz \
|
|
107
|
+
node <repo>/packages/daisyui-adapter/cli/init.mjs
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
The CLI prints `installed ./kodaicoder-shadcn-svelte-daisyui-adapter-0.2.0.tgz`. Without the variable it installs `@kodaicoder/shadcn-svelte-daisyui-adapter@0.2.0` from the registry.
|
package/cli/init.mjs
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
2
|
// The adapter CLI. It reads components.json and the stylesheet, validates the theme, then writes the
|
|
3
|
-
// header comment, the plugin line, the
|
|
4
|
-
//
|
|
3
|
+
// header comment, the plugin line, the bindings for both blocks, and the five chart values. Re-running
|
|
4
|
+
// it is byte-identical. The override file and its import are the project's to add; this CLI never
|
|
5
|
+
// creates, deletes or rewrites either one.
|
|
5
6
|
//
|
|
6
7
|
// It never writes a raw `--color-*` name (ticket 14: that forms a cycle with `@theme inline`, and
|
|
7
8
|
// the fallback is then silently ignored), and it writes the chart ramp itself rather than leaving it
|
|
@@ -13,7 +14,7 @@
|
|
|
13
14
|
// that ran an older CLI must end up with exactly one line naming its version.
|
|
14
15
|
import { execSync } from 'node:child_process';
|
|
15
16
|
import { existsSync, readFileSync, writeFileSync } from 'node:fs';
|
|
16
|
-
import {
|
|
17
|
+
import { resolve } from 'node:path';
|
|
17
18
|
|
|
18
19
|
import { BINDING_KEYS, SINGLE, mixValue } from '../dist/map.mjs';
|
|
19
20
|
import { chartTokens, solveScheme } from '../dist/ramp.mjs';
|
|
@@ -26,7 +27,6 @@ const BIN = Object.keys(manifest.bin)[0];
|
|
|
26
27
|
const HEADER = `/* ${PKG} ${VERSION} | re-run \`pnpm dlx ${PKG}@${VERSION} init\` after \`shadcn-svelte init\` */`;
|
|
27
28
|
const HEADER_PATTERN = /^\/\* (\S+) (\d+\.\d+\.\d+(?:-[0-9A-Za-z.-]+)?) \| re-run [^\n]*\*\/\r?\n?/;
|
|
28
29
|
const OVERRIDE = 'daisyui-adapter.overrides.css';
|
|
29
|
-
const OVERRIDE_IMPORT = `@import "./${OVERRIDE}";`;
|
|
30
30
|
const BORDER_ENTRY = '--default-border-width: var(--daisy-border, 1px);';
|
|
31
31
|
const PLUGIN = `@plugin "${PKG}";`;
|
|
32
32
|
const PNPM = process.platform === 'win32' ? 'pnpm.cmd' : 'pnpm';
|
|
@@ -110,8 +110,8 @@ const warnBareRamp = (key) => {
|
|
|
110
110
|
rampWarned = true;
|
|
111
111
|
console.warn(
|
|
112
112
|
`[daisyui-adapter] --${key} holds a ramp written by an older CLI with no fallback. Its original ` +
|
|
113
|
-
`value is gone; restore the stylesheet from version control or set --daisyui-derived-${key} ` +
|
|
114
|
-
`in ${OVERRIDE}.`
|
|
113
|
+
`value is gone; restore the stylesheet from version control, or set --daisyui-derived-${key} ` +
|
|
114
|
+
`in the optional ${OVERRIDE} file, which the README's Overrides section describes.`
|
|
115
115
|
);
|
|
116
116
|
};
|
|
117
117
|
|
|
@@ -266,7 +266,6 @@ const main = () => {
|
|
|
266
266
|
);
|
|
267
267
|
if (!css) throw new Error(`[daisyui-adapter] ${where} has no :root block`);
|
|
268
268
|
|
|
269
|
-
css = insertAfterLastImport(css, OVERRIDE_IMPORT);
|
|
270
269
|
if (themes) {
|
|
271
270
|
css = insertAfterLastImport(css, PLUGIN);
|
|
272
271
|
css = insertThemeEntries(css);
|
|
@@ -275,10 +274,6 @@ const main = () => {
|
|
|
275
274
|
|
|
276
275
|
writeFileSync(cssPath, css);
|
|
277
276
|
|
|
278
|
-
const overridePath = resolve(dirname(cssPath), OVERRIDE);
|
|
279
|
-
const created = !existsSync(overridePath);
|
|
280
|
-
if (created) writeFileSync(overridePath, '');
|
|
281
|
-
|
|
282
277
|
// Read back what was written: a block the CLI matched but could not fill has to show a count
|
|
283
278
|
// below 32 rather than a number from the data it meant to write.
|
|
284
279
|
const written = readFileSync(cssPath, 'utf8');
|
|
@@ -291,10 +286,6 @@ const main = () => {
|
|
|
291
286
|
if (themes) console.log('[daisyui-adapter] theme ok: light + dark');
|
|
292
287
|
console.log(`[daisyui-adapter] wrote ${where}`);
|
|
293
288
|
console.log(`[daisyui-adapter] ${lightCount} light, ${darkCount} dark`);
|
|
294
|
-
const overrideRel = relative(process.cwd(), overridePath).replaceAll('\\', '/');
|
|
295
|
-
console.log(
|
|
296
|
-
`[daisyui-adapter] ${created ? `created ${overrideRel}` : `left ${overrideRel} untouched`}`
|
|
297
|
-
);
|
|
298
289
|
|
|
299
290
|
// The install is last, after the lines that describe what was written, so a failed install
|
|
300
291
|
// still tells the user the stylesheet is in place.
|
package/package.json
CHANGED
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@kodaicoder/shadcn-svelte-daisyui-adapter",
|
|
3
|
-
"version": "0.
|
|
4
|
-
"description": "Generate a shadcn-svelte token set from a daisyUI v5 theme, at build time, with no daisyUI runtime dependency.",
|
|
5
|
-
"license": "MIT",
|
|
6
|
-
"type": "module",
|
|
7
|
-
"bin": {
|
|
8
|
-
"daisyui-adapter": "cli/init.mjs"
|
|
9
|
-
},
|
|
10
|
-
"exports": {
|
|
11
|
-
".": {
|
|
12
|
-
"default": "./dist/index.mjs"
|
|
13
|
-
},
|
|
14
|
-
"./map": "./dist/map.mjs",
|
|
15
|
-
"./ramp": "./dist/ramp.mjs"
|
|
16
|
-
},
|
|
17
|
-
"files": [
|
|
18
|
-
"dist",
|
|
19
|
-
"cli",
|
|
20
|
-
"CHANGELOG.md"
|
|
21
|
-
],
|
|
22
|
-
"keywords": [
|
|
23
|
-
"daisyui",
|
|
24
|
-
"shadcn-svelte",
|
|
25
|
-
"sveltekit",
|
|
26
|
-
"tailwindcss",
|
|
27
|
-
"theme"
|
|
28
|
-
],
|
|
29
|
-
"repository": {
|
|
30
|
-
"type": "git",
|
|
31
|
-
"url": "git+https://github.com/kodaicoder/shadcn-svelte-daisyui-adapter.git",
|
|
32
|
-
"directory": "packages/daisyui-adapter"
|
|
33
|
-
},
|
|
34
|
-
"engines": {
|
|
35
|
-
"node": ">=20"
|
|
36
|
-
},
|
|
37
|
-
"publishConfig": {
|
|
38
|
-
"access": "public"
|
|
39
|
-
}
|
|
40
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@kodaicoder/shadcn-svelte-daisyui-adapter",
|
|
3
|
+
"version": "0.2.0",
|
|
4
|
+
"description": "Generate a shadcn-svelte token set from a daisyUI v5 theme, at build time, with no daisyUI runtime dependency.",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"type": "module",
|
|
7
|
+
"bin": {
|
|
8
|
+
"daisyui-adapter": "cli/init.mjs"
|
|
9
|
+
},
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"default": "./dist/index.mjs"
|
|
13
|
+
},
|
|
14
|
+
"./map": "./dist/map.mjs",
|
|
15
|
+
"./ramp": "./dist/ramp.mjs"
|
|
16
|
+
},
|
|
17
|
+
"files": [
|
|
18
|
+
"dist",
|
|
19
|
+
"cli",
|
|
20
|
+
"CHANGELOG.md"
|
|
21
|
+
],
|
|
22
|
+
"keywords": [
|
|
23
|
+
"daisyui",
|
|
24
|
+
"shadcn-svelte",
|
|
25
|
+
"sveltekit",
|
|
26
|
+
"tailwindcss",
|
|
27
|
+
"theme"
|
|
28
|
+
],
|
|
29
|
+
"repository": {
|
|
30
|
+
"type": "git",
|
|
31
|
+
"url": "git+https://github.com/kodaicoder/shadcn-svelte-daisyui-adapter.git",
|
|
32
|
+
"directory": "packages/daisyui-adapter"
|
|
33
|
+
},
|
|
34
|
+
"engines": {
|
|
35
|
+
"node": ">=20"
|
|
36
|
+
},
|
|
37
|
+
"publishConfig": {
|
|
38
|
+
"access": "public"
|
|
39
|
+
}
|
|
40
|
+
}
|