From 32ad5ca060836b79a8b9fd2fa3d915b82683580b Mon Sep 17 00:00:00 2001 From: miguelrk Date: Thu, 15 Jun 2023 23:35:16 +0000 Subject: [PATCH 01/31] feat(plugins): add unocss plugin (WIP) --- plugins/unocss.ts | 29 +++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) create mode 100644 plugins/unocss.ts diff --git a/plugins/unocss.ts b/plugins/unocss.ts new file mode 100644 index 00000000000..00da5b05202 --- /dev/null +++ b/plugins/unocss.ts @@ -0,0 +1,29 @@ +import type { Preset, UserConfig } from 'https://esm.sh/@unocss/core@0.53.1' +import { UnoGenerator } from 'https://esm.sh/@unocss/core@0.53.1' +import presetWind from 'https://esm.sh/@unocss/preset-wind@0.46.3?bundle&no-check' +import { Plugin } from '$fresh/server.ts' + +const unoResetCSS = `/* reset */ +*,:before,:after{box-sizing:border-box;border:0 solid}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto} +` + +const defaultConfig: UserConfig = { + presets: [presetWind() as unknown as Preset], +} + +export default function unocss(config: UserConfig = defaultConfig): Plugin { + const uno = new UnoGenerator(config) + return { + name: 'unocss', + async renderAsync(ctx) { + const { htmlText } = await ctx.renderAsync() + const { css } = await uno.generate(htmlText) + return { + scripts: [], + styles: [{ + cssText: `${unoResetCSS}\n${css}`, + }], + } + }, + } +} From b070bcd0fb0a4d7a4c26fc64bdbe3d490a90a59b Mon Sep 17 00:00:00 2001 From: miguelrk Date: Tue, 25 Jul 2023 18:52:19 +0000 Subject: [PATCH 02/31] fix(plugins/unocss): use presetUno instead of presetWind by default --- plugins/unocss.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/plugins/unocss.ts b/plugins/unocss.ts index 00da5b05202..85722e6eab4 100644 --- a/plugins/unocss.ts +++ b/plugins/unocss.ts @@ -1,6 +1,6 @@ import type { Preset, UserConfig } from 'https://esm.sh/@unocss/core@0.53.1' import { UnoGenerator } from 'https://esm.sh/@unocss/core@0.53.1' -import presetWind from 'https://esm.sh/@unocss/preset-wind@0.46.3?bundle&no-check' +import presetUno from 'https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check' import { Plugin } from '$fresh/server.ts' const unoResetCSS = `/* reset */ @@ -8,7 +8,7 @@ const unoResetCSS = `/* reset */ ` const defaultConfig: UserConfig = { - presets: [presetWind() as unknown as Preset], + presets: [presetUno() as unknown as Preset], } export default function unocss(config: UserConfig = defaultConfig): Plugin { From 4e09931ec3a3c392ceead5824b34a8fe0b518125 Mon Sep 17 00:00:00 2001 From: miguelrk Date: Tue, 1 Aug 2023 08:04:10 +0000 Subject: [PATCH 03/31] chore(plugins): add comment to inline reset for unocss --- plugins/unocss.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/plugins/unocss.ts b/plugins/unocss.ts index 85722e6eab4..485e3d38caf 100644 --- a/plugins/unocss.ts +++ b/plugins/unocss.ts @@ -3,6 +3,7 @@ import { UnoGenerator } from 'https://esm.sh/@unocss/core@0.53.1' import presetUno from 'https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check' import { Plugin } from '$fresh/server.ts' +// inline reset from https://github.com/Hladikes/fresh/blob/02ea872b1b4f91808ae2ba7ec565f0a7d4c2b194/plugins/unocss.ts const unoResetCSS = `/* reset */ *,:before,:after{box-sizing:border-box;border:0 solid}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto} ` From ca6461c9ad8f8fee57f6fa2ef62902418e9dae98 Mon Sep 17 00:00:00 2001 From: miguelrk Date: Tue, 1 Aug 2023 09:03:20 +0000 Subject: [PATCH 04/31] chore(plugins): update comment of inline reset for unocss --- plugins/unocss.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/unocss.ts b/plugins/unocss.ts index 485e3d38caf..edfb63cf224 100644 --- a/plugins/unocss.ts +++ b/plugins/unocss.ts @@ -3,7 +3,7 @@ import { UnoGenerator } from 'https://esm.sh/@unocss/core@0.53.1' import presetUno from 'https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check' import { Plugin } from '$fresh/server.ts' -// inline reset from https://github.com/Hladikes/fresh/blob/02ea872b1b4f91808ae2ba7ec565f0a7d4c2b194/plugins/unocss.ts +// inline reset from https://esm.sh/@unocss/reset@0.51.2/tailwind.css const unoResetCSS = `/* reset */ *,:before,:after{box-sizing:border-box;border:0 solid}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto} ` From 2bf9ce0397963ea134a05fc82c11764115958a5b Mon Sep 17 00:00:00 2001 From: Miguel Romero Karam Date: Tue, 8 Aug 2023 11:43:00 +0200 Subject: [PATCH 05/31] docs(plugins): add docs for unocss --- docs/latest/examples/using-unocss.md | 60 ++++++++++++++++++++++++++++ docs/toc.ts | 2 + plugins/unocss.ts | 26 ++++++------ 3 files changed, 75 insertions(+), 13 deletions(-) create mode 100644 docs/latest/examples/using-unocss.md diff --git a/docs/latest/examples/using-unocss.md b/docs/latest/examples/using-unocss.md new file mode 100644 index 00000000000..a5b0e24d145 --- /dev/null +++ b/docs/latest/examples/using-unocss.md @@ -0,0 +1,60 @@ +--- +description: | + One can use UnoCSS, an instant on-demand atomic CSS engine +--- + +When you initialize a project with `deno run -A -r https://fresh.deno.dev`, +you'll end up with a `main.ts` like the following: + +```ts +/// +/// +/// +/// +/// + +import { start } from "$fresh/server.ts"; +import manifest from "./fresh.gen.ts"; + +import unocssPlugin from "$fresh/plugins/unocss.ts"; +import unocssConfig from "./uno.config.ts"; + +await start(manifest, { plugins: [unocssPlugin(unocssConfig)] }); +``` + +The template generates a Twind v0 project by default. If you want to use UnoCSS +you can follow this guide. First of all, change the import path to use the +`unocss` plugin: + +```ts +/// +/// +/// +/// +/// + +import { start } from "$fresh/server.ts"; +import manifest from "./fresh.gen.ts"; + +import unocssPlugin from "$fresh/plugins/unocss.ts"; +import unocssConfig from "./uno.config.ts"; + +await start(manifest, { plugins: [unocssPlugin(unocssConfig)] }); +``` + +The unocss config object at `uno.config.ts` can be customized to your liking. +Refer to the [unocss docs](https://unocss.dev/guide/config-file) for more +information. If no config is provided, the default config is used, which +defaults to the following: + +```ts +import type { UserConfig } from "https://esm.sh/@unocss/core@0.53.1"; +import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check"; + +export default { + presets: [presetUno()], +} satisfies UserConfig; +``` + +To see what other presets exist, you can go to the +[unocss docs](https://unocss.dev/presets/). diff --git a/docs/toc.ts b/docs/toc.ts index e1430ec283a..498d8cf2430 100644 --- a/docs/toc.ts +++ b/docs/toc.ts @@ -80,6 +80,7 @@ const toc: RawTableOfContents = { "link:latest", ], ["using-twind-v1", "Using Twind v1", "link:latest"], + ["using-unocss", "Using UnoCSS", "link:latest"], ["init-the-server", "Initializing the server", "link:latest"], [ "using-fresh-canary-version", @@ -152,6 +153,7 @@ const toc: RawTableOfContents = { ["writing-tests", "Writing tests"], ["changing-the-src-dir", "Changing the source directory"], ["using-twind-v1", "Using Twind v1"], + ["using-unocss", "Using UnoCSS"], ["init-the-server", "Initializing the server"], ["using-fresh-canary-version", "Using Fresh canary version"], ["dealing-with-cors", "Dealing with CORS"], diff --git a/plugins/unocss.ts b/plugins/unocss.ts index edfb63cf224..2758563c3d2 100644 --- a/plugins/unocss.ts +++ b/plugins/unocss.ts @@ -1,30 +1,30 @@ -import type { Preset, UserConfig } from 'https://esm.sh/@unocss/core@0.53.1' -import { UnoGenerator } from 'https://esm.sh/@unocss/core@0.53.1' -import presetUno from 'https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check' -import { Plugin } from '$fresh/server.ts' +import type { UserConfig } from "https://esm.sh/@unocss/core@0.53.1"; +import { UnoGenerator } from "https://esm.sh/@unocss/core@0.53.1"; +import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check"; +import { Plugin } from "$fresh/server.ts"; // inline reset from https://esm.sh/@unocss/reset@0.51.2/tailwind.css const unoResetCSS = `/* reset */ *,:before,:after{box-sizing:border-box;border:0 solid}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto} -` +`; const defaultConfig: UserConfig = { - presets: [presetUno() as unknown as Preset], -} + presets: [presetUno()], +}; export default function unocss(config: UserConfig = defaultConfig): Plugin { - const uno = new UnoGenerator(config) + const uno = new UnoGenerator(config); return { - name: 'unocss', + name: "unocss", async renderAsync(ctx) { - const { htmlText } = await ctx.renderAsync() - const { css } = await uno.generate(htmlText) + const { htmlText } = await ctx.renderAsync(); + const { css } = await uno.generate(htmlText); return { scripts: [], styles: [{ cssText: `${unoResetCSS}\n${css}`, }], - } + }; }, - } + }; } From 2a64f85735d44e935261995b161d72ab5c549499 Mon Sep 17 00:00:00 2001 From: Miguel Romero Karam Date: Tue, 8 Aug 2023 18:40:47 +0200 Subject: [PATCH 06/31] fix(plugins): remove unnecessary `?bundle&no-check` from `@unocss/preset-uno` import --- docs/latest/examples/using-unocss.md | 2 +- plugins/unocss.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/latest/examples/using-unocss.md b/docs/latest/examples/using-unocss.md index a5b0e24d145..6043899e085 100644 --- a/docs/latest/examples/using-unocss.md +++ b/docs/latest/examples/using-unocss.md @@ -49,7 +49,7 @@ defaults to the following: ```ts import type { UserConfig } from "https://esm.sh/@unocss/core@0.53.1"; -import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check"; +import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3"; export default { presets: [presetUno()], diff --git a/plugins/unocss.ts b/plugins/unocss.ts index 2758563c3d2..120860fc547 100644 --- a/plugins/unocss.ts +++ b/plugins/unocss.ts @@ -1,6 +1,6 @@ import type { UserConfig } from "https://esm.sh/@unocss/core@0.53.1"; import { UnoGenerator } from "https://esm.sh/@unocss/core@0.53.1"; -import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3?bundle&no-check"; +import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3"; import { Plugin } from "$fresh/server.ts"; // inline reset from https://esm.sh/@unocss/reset@0.51.2/tailwind.css From 86c82278775bfe9cbba7d8fb1dcef7b92b247863 Mon Sep 17 00:00:00 2001 From: Miguel Romero Karam Date: Tue, 8 Aug 2023 18:49:03 +0200 Subject: [PATCH 07/31] docs(plugins): remove redundant text for unocss --- docs/latest/examples/using-unocss.md | 22 +--------------------- 1 file changed, 1 insertion(+), 21 deletions(-) diff --git a/docs/latest/examples/using-unocss.md b/docs/latest/examples/using-unocss.md index 6043899e085..f2eba4866ba 100644 --- a/docs/latest/examples/using-unocss.md +++ b/docs/latest/examples/using-unocss.md @@ -3,28 +3,8 @@ description: | One can use UnoCSS, an instant on-demand atomic CSS engine --- -When you initialize a project with `deno run -A -r https://fresh.deno.dev`, -you'll end up with a `main.ts` like the following: - -```ts -/// -/// -/// -/// -/// - -import { start } from "$fresh/server.ts"; -import manifest from "./fresh.gen.ts"; - -import unocssPlugin from "$fresh/plugins/unocss.ts"; -import unocssConfig from "./uno.config.ts"; - -await start(manifest, { plugins: [unocssPlugin(unocssConfig)] }); -``` - The template generates a Twind v0 project by default. If you want to use UnoCSS -you can follow this guide. First of all, change the import path to use the -`unocss` plugin: +you can update the `main.ts` as follows: ```ts /// From b397d6f89dcdf9f5133d6daf78a2ae8d34fb634d Mon Sep 17 00:00:00 2001 From: Miguel Romero Karam Date: Tue, 8 Aug 2023 20:33:20 +0200 Subject: [PATCH 08/31] fix(plugins): remove defaults from unocss plugin --- docs/latest/examples/using-twind-v1.md | 2 +- docs/latest/examples/using-unocss.md | 2 ++ plugins/unocss.ts | 7 +------ 3 files changed, 4 insertions(+), 7 deletions(-) diff --git a/docs/latest/examples/using-twind-v1.md b/docs/latest/examples/using-twind-v1.md index bd162c5e57f..d1022558466 100644 --- a/docs/latest/examples/using-twind-v1.md +++ b/docs/latest/examples/using-twind-v1.md @@ -58,7 +58,7 @@ export default { }; ``` -(Note: the `as Preset` cast is required to fix a typing issue with twind.) +Note: the `as Preset` cast is required to fix a typing issue with twind. To see what other presets exist, you can go to the [twind docs](https://twind.style/presets). diff --git a/docs/latest/examples/using-unocss.md b/docs/latest/examples/using-unocss.md index f2eba4866ba..bdd206d0765 100644 --- a/docs/latest/examples/using-unocss.md +++ b/docs/latest/examples/using-unocss.md @@ -36,5 +36,7 @@ export default { } satisfies UserConfig; ``` +Note: you could also inline the config object in `main.ts` instead of using a separate `uno.config.ts` file. + To see what other presets exist, you can go to the [unocss docs](https://unocss.dev/presets/). diff --git a/plugins/unocss.ts b/plugins/unocss.ts index 120860fc547..5baf082a0f1 100644 --- a/plugins/unocss.ts +++ b/plugins/unocss.ts @@ -1,6 +1,5 @@ import type { UserConfig } from "https://esm.sh/@unocss/core@0.53.1"; import { UnoGenerator } from "https://esm.sh/@unocss/core@0.53.1"; -import presetUno from "https://esm.sh/@unocss/preset-uno@0.46.3"; import { Plugin } from "$fresh/server.ts"; // inline reset from https://esm.sh/@unocss/reset@0.51.2/tailwind.css @@ -8,11 +7,7 @@ const unoResetCSS = `/* reset */ *,:before,:after{box-sizing:border-box;border:0 solid}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto} `; -const defaultConfig: UserConfig = { - presets: [presetUno()], -}; - -export default function unocss(config: UserConfig = defaultConfig): Plugin { +export default function unocss(config: UserConfig): Plugin { const uno = new UnoGenerator(config); return { name: "unocss", From c6e81c3551edf6318602cce373401d3f99b1715e Mon Sep 17 00:00:00 2001 From: Miguel Romero Karam Date: Wed, 9 Aug 2023 09:28:22 +0200 Subject: [PATCH 09/31] chore(plugins): add `fixture_unocss_hydrate` test --- .../islands/InsertCssrules.tsx | 2 +- tests/fixture_unocss_hydrate/deno.json | 18 +++++ tests/fixture_unocss_hydrate/dev.ts | 5 ++ tests/fixture_unocss_hydrate/fresh.gen.ts | 26 +++++++ .../islands/CheckDuplication.tsx | 59 ++++++++++++++ .../islands/InsertCssrules.tsx | 76 +++++++++++++++++++ tests/fixture_unocss_hydrate/main.ts | 11 +++ tests/fixture_unocss_hydrate/options.ts | 5 ++ .../routes/check-duplication.tsx | 9 +++ .../routes/insert-cssrules.tsx | 9 +++ .../fixture_unocss_hydrate/routes/static.tsx | 11 +++ .../fixture_unocss_hydrate/routes/unused.tsx | 4 + tests/fixture_unocss_hydrate/uno.config.ts | 6 ++ tests/fixture_unocss_hydrate/utils/utils.ts | 26 +++++++ 14 files changed, 266 insertions(+), 1 deletion(-) create mode 100644 tests/fixture_unocss_hydrate/deno.json create mode 100755 tests/fixture_unocss_hydrate/dev.ts create mode 100644 tests/fixture_unocss_hydrate/fresh.gen.ts create mode 100644 tests/fixture_unocss_hydrate/islands/CheckDuplication.tsx create mode 100644 tests/fixture_unocss_hydrate/islands/InsertCssrules.tsx create mode 100644 tests/fixture_unocss_hydrate/main.ts create mode 100644 tests/fixture_unocss_hydrate/options.ts create mode 100644 tests/fixture_unocss_hydrate/routes/check-duplication.tsx create mode 100644 tests/fixture_unocss_hydrate/routes/insert-cssrules.tsx create mode 100644 tests/fixture_unocss_hydrate/routes/static.tsx create mode 100644 tests/fixture_unocss_hydrate/routes/unused.tsx create mode 100644 tests/fixture_unocss_hydrate/uno.config.ts create mode 100644 tests/fixture_unocss_hydrate/utils/utils.ts diff --git a/tests/fixture_twind_hydrate/islands/InsertCssrules.tsx b/tests/fixture_twind_hydrate/islands/InsertCssrules.tsx index beea977b0c5..845969adbe9 100644 --- a/tests/fixture_twind_hydrate/islands/InsertCssrules.tsx +++ b/tests/fixture_twind_hydrate/islands/InsertCssrules.tsx @@ -69,7 +69,7 @@ export default function InsertCssrules() { }} disabled={insertedStyles.value === "" ? false : true} > - Add `text-green-600` to Cureent Number Class + Add `text-green-600` to Current Number Class ); diff --git a/tests/fixture_unocss_hydrate/deno.json b/tests/fixture_unocss_hydrate/deno.json new file mode 100644 index 00000000000..226bf74767b --- /dev/null +++ b/tests/fixture_unocss_hydrate/deno.json @@ -0,0 +1,18 @@ +{ + "lock": false, + "tasks": { + "start": "deno run -A --watch=static/,routes/ dev.ts" + }, + "imports": { + "$fresh/": "../../", + "preact": "https://esm.sh/preact@10.11.0", + "preact/": "https://esm.sh/preact@10.11.0/", + "preact-render-to-string": "https://esm.sh/*preact-render-to-string@6.2.0", + "@preact/signals": "https://esm.sh/*@preact/signals@1.0.3", + "@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.0.1" + }, + "compilerOptions": { + "jsx": "react-jsx", + "jsxImportSource": "preact" + } +} diff --git a/tests/fixture_unocss_hydrate/dev.ts b/tests/fixture_unocss_hydrate/dev.ts new file mode 100755 index 00000000000..2d85d6c183c --- /dev/null +++ b/tests/fixture_unocss_hydrate/dev.ts @@ -0,0 +1,5 @@ +#!/usr/bin/env -S deno run -A --watch=static/,routes/ + +import dev from "$fresh/dev.ts"; + +await dev(import.meta.url, "./main.ts"); diff --git a/tests/fixture_unocss_hydrate/fresh.gen.ts b/tests/fixture_unocss_hydrate/fresh.gen.ts new file mode 100644 index 00000000000..041757d712d --- /dev/null +++ b/tests/fixture_unocss_hydrate/fresh.gen.ts @@ -0,0 +1,26 @@ +// DO NOT EDIT. This file is generated by Fresh. +// This file SHOULD be checked into source version control. +// This file is automatically updated during development when running `dev.ts`. + +import * as $0 from "./routes/check-duplication.tsx"; +import * as $1 from "./routes/insert-cssrules.tsx"; +import * as $2 from "./routes/static.tsx"; +import * as $3 from "./routes/unused.tsx"; +import * as $$0 from "./islands/CheckDuplication.tsx"; +import * as $$1 from "./islands/InsertCssrules.tsx"; + +const manifest = { + routes: { + "./routes/check-duplication.tsx": $0, + "./routes/insert-cssrules.tsx": $1, + "./routes/static.tsx": $2, + "./routes/unused.tsx": $3, + }, + islands: { + "./islands/CheckDuplication.tsx": $$0, + "./islands/InsertCssrules.tsx": $$1, + }, + baseUrl: import.meta.url, +}; + +export default manifest; diff --git a/tests/fixture_unocss_hydrate/islands/CheckDuplication.tsx b/tests/fixture_unocss_hydrate/islands/CheckDuplication.tsx new file mode 100644 index 00000000000..419e56a5813 --- /dev/null +++ b/tests/fixture_unocss_hydrate/islands/CheckDuplication.tsx @@ -0,0 +1,59 @@ +// https://github.com/denoland/fresh/pull/1050 +import { useEffect } from "preact/hooks"; +import { cmpCssRules } from "../utils/utils.ts"; +import { useSignal } from "@preact/signals"; + +/** + * Returns a cssrulelist of styleElement matching the selector. + */ +function getCssrules(selector: string) { + const elem = document.querySelector(selector) as HTMLStyleElement; + return elem?.sheet?.cssRules; +} + +export default function CheckDuplication() { + const cssRulesFRSHUNOCSS = useSignal(undefined); + const cssRulesClaimed = useSignal(undefined); + + // Init + useEffect(() => { + // get