@unocss/svelte-scoped 66.5.4 → 66.5.6

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 (4) hide show
  1. package/dist/preprocess.mjs +1 -1
  2. package/dist/shared/{svelte-scoped.CzKGVta9.mjs → svelte-scoped.BF7qdJQ6.mjs} +6 -1
  3. package/dist/vite.mjs +30 -33
  4. package/package.json +6 -6
package/dist/preprocess.mjs CHANGED
@@ -1,4 +1,4 @@
1
- export { U as default } from './shared/svelte-scoped.CzKGVta9.mjs';
1
+ export { U as default } from './shared/svelte-scoped.BF7qdJQ6.mjs';
2
2
  import 'node:process';
3
3
  import '@unocss/config';
4
4
  import '@unocss/core';
package/dist/shared/{svelte-scoped.CzKGVta9.mjs → svelte-scoped.BF7qdJQ6.mjs} RENAMED
@@ -442,9 +442,14 @@ async function parseApply({ s, uno, applyVariables }, node, childNode) {
442
442
  const utils = await getUtils(body, uno);
443
443
  if (!utils.length)
444
444
  return;
445
+ let end = childNode.loc.end.offset;
446
+ const maybeSemi = s.slice(end, end + 1);
447
+ if (maybeSemi === ";") {
448
+ end += 1;
449
+ }
450
+ s.remove(childNode.loc.start.offset, end);
445
451
  for (const util of utils)
446
452
  writeUtilStyles(util, s, node, childNode);
447
- s.remove(childNode.loc.start.offset, childNode.loc.end.offset);
448
453
  }
449
454
  function getChildNodeValue(childNode, applyVariables) {
450
455
  if (childNode.type === "Atrule" && childNode.name === "apply" && childNode.prelude && childNode.prelude.type === "Raw")
package/dist/vite.mjs CHANGED
@@ -7,7 +7,7 @@ import MagicString from 'magic-string';
7
7
  import { readFileSync, existsSync, statSync } from 'node:fs';
8
8
  import { resolve, dirname } from 'node:path';
9
9
  import { fileURLToPath } from 'node:url';
10
- import { U as UnocssSveltePreprocess } from './shared/svelte-scoped.CzKGVta9.mjs';
10
+ import { U as UnocssSveltePreprocess } from './shared/svelte-scoped.BF7qdJQ6.mjs';
11
11
  import '@unocss/preset-wind3';
12
12
  import 'acorn';
13
13
  import 'zimmerframe';
@@ -118,8 +118,8 @@ function createCssTransformerPlugins(context, cssTransformers) {
118
118
  }
119
119
 
120
120
  const PLACEHOLDER_USER_SETS_IN_INDEX_HTML = "%unocss-svelte-scoped.global%";
121
- const GLOBAL_STYLES_PLACEHOLDER = "unocss_svelte_scoped_global_styles";
122
121
  const DEV_GLOBAL_STYLES_DATA_TITLE = "unocss-svelte-scoped global styles";
122
+ const GLOBAL_STYLES_CSS_FILE_NAME = "unocss-svelte-scoped-global.css";
123
123
 
124
124
  const _dirname = typeof __dirname !== "undefined" ? __dirname : dirname(fileURLToPath(import.meta.url));
125
125
  function getReset(injectReset) {
@@ -152,31 +152,18 @@ function isFile(path) {
152
152
  return existsSync(path) && statSync(path).isFile();
153
153
  }
154
154
 
155
- function isServerHooksFile(path) {
156
- return path.includes("hooks") && path.includes("server");
157
- }
158
- function replaceGlobalStylesPlaceholder(code, stylesTag) {
159
- const captureQuoteMark = "([\"'`])";
160
- const matchCapturedQuoteMark = "\\1";
161
- const QUOTES_WITH_PLACEHOLDER_RE = new RegExp(captureQuoteMark + GLOBAL_STYLES_PLACEHOLDER + matchCapturedQuoteMark);
162
- const escapedStylesTag = stylesTag.replaceAll(/\\(?![`$])/g, "\\\\").replaceAll(/(?<!\\)([`$])/g, "\\$1");
163
- return code.replace(QUOTES_WITH_PLACEHOLDER_RE, `\`${escapedStylesTag}\``);
164
- }
165
155
  async function generateGlobalCss(uno, injectReset) {
166
156
  const { css } = await uno.generate("", { preflights: true, safelist: true, minify: true });
167
157
  const reset = injectReset ? getReset(injectReset) : "";
168
158
  return reset + css;
169
159
  }
170
- const SVELTE_ERROR = `[unocss] You have not setup the svelte-scoped global styles correctly. You must place '${PLACEHOLDER_USER_SETS_IN_INDEX_HTML}' in your index.html file.
171
- `;
172
- const SVELTE_KIT_ERROR = `[unocss] You have not setup the svelte-scoped global styles correctly. You must place '${PLACEHOLDER_USER_SETS_IN_INDEX_HTML}' in your app.html file. You also need to have a transformPageChunk hook in your hooks.server.js file with: \`html.replace('${PLACEHOLDER_USER_SETS_IN_INDEX_HTML}', '${GLOBAL_STYLES_PLACEHOLDER}')\`. You can see an example of the usage at https://github.com/unocss/unocss/tree/main/examples/sveltekit-scoped.`;
173
160
  function checkTransformPageChunkHook(server, isSvelteKit) {
174
161
  server.middlewares.use((req, res, next) => {
175
162
  const originalWrite = res.write;
176
163
  res.write = function(chunk, ...rest) {
177
164
  const str = typeof chunk === "string" ? chunk : chunk instanceof Buffer ? chunk.toString() : Array.isArray(chunk) || "at" in chunk ? Buffer.from(chunk).toString() : `${chunk}`;
178
165
  if (str.includes("<head>") && !str.includes(DEV_GLOBAL_STYLES_DATA_TITLE))
179
- server.config.logger.error(isSvelteKit ? SVELTE_KIT_ERROR : SVELTE_ERROR, { timestamp: true });
166
+ server.config.logger.error(`[unocss] You have not setup the svelte-scoped global styles correctly. You must place '${PLACEHOLDER_USER_SETS_IN_INDEX_HTML}' in your \`${isSvelteKit ? "app.html" : "index.html"}\` file.`, { timestamp: true });
180
167
  return originalWrite.call(this, chunk, ...rest);
181
168
  };
182
169
  next();
@@ -187,7 +174,7 @@ function GlobalStylesPlugin(ctx, injectReset) {
187
174
  let isSvelteKit;
188
175
  let viteConfig;
189
176
  let unoCssFileReferenceId;
190
- let unoCssHashedLinkTag;
177
+ let unoCssGlobalFileName;
191
178
  return {
192
179
  name: "unocss:svelte-scoped:global-styles",
193
180
  async configResolved(_viteConfig) {
@@ -196,15 +183,26 @@ function GlobalStylesPlugin(ctx, injectReset) {
196
183
  isSvelteKit = viteConfig.plugins.some((p) => p.name.includes("sveltekit"));
197
184
  },
198
185
  // serve
199
- configureServer: (server) => checkTransformPageChunkHook(server, isSvelteKit),
186
+ configureServer: (server) => {
187
+ checkTransformPageChunkHook(server, isSvelteKit);
188
+ server.middlewares.use(`${viteConfig.base ?? "/"}${GLOBAL_STYLES_CSS_FILE_NAME}`, async (_req, res) => {
189
+ res.appendHeader("Content-Type", "text/css");
190
+ res.end(await generateGlobalCss(ctx.uno, injectReset));
191
+ });
192
+ },
200
193
  // serve
201
194
  async transform(code, id) {
202
195
  await ctx.ready;
203
- if (isSvelteKit && viteConfig.command === "serve" && isServerHooksFile(id)) {
204
- const css = await generateGlobalCss(ctx.uno, injectReset);
205
- return {
206
- code: replaceGlobalStylesPlaceholder(code, `<style type="text/css" data-title="${DEV_GLOBAL_STYLES_DATA_TITLE}">${css}</style>`)
207
- };
196
+ if (isSvelteKit) {
197
+ if (id.includes("hooks") && id.includes("server") && code.includes("unocss_svelte_scoped_global_styles")) {
198
+ this.warn(`[unocss] You are probably using an outdated setup for your sveltekit app. The server hook to handle an unocss styles placeholder is no longer needed.`);
199
+ }
200
+ if (viteConfig.command === "serve" && code.includes(PLACEHOLDER_USER_SETS_IN_INDEX_HTML)) {
201
+ const tag = `<link href=\\"${viteConfig.base ?? "/"}${GLOBAL_STYLES_CSS_FILE_NAME}\\" rel=\\"stylesheet\\" data-title=\\"${DEV_GLOBAL_STYLES_DATA_TITLE}\\" />`;
202
+ return {
203
+ code: code.replace(PLACEHOLDER_USER_SETS_IN_INDEX_HTML, tag)
204
+ };
205
+ }
208
206
  }
209
207
  },
210
208
  // build
@@ -213,30 +211,29 @@ function GlobalStylesPlugin(ctx, injectReset) {
213
211
  const css = await generateGlobalCss(ctx.uno, injectReset);
214
212
  unoCssFileReferenceId = this.emitFile({
215
213
  type: "asset",
216
- name: "unocss-svelte-scoped-global.css",
214
+ name: GLOBAL_STYLES_CSS_FILE_NAME,
217
215
  source: css
218
216
  });
219
217
  }
220
218
  },
221
219
  // build
222
220
  renderStart() {
223
- const unoCssFileName = this.getFileName(unoCssFileReferenceId);
224
- const base = viteConfig.base ?? "/";
225
- unoCssHashedLinkTag = `<link href="${base}${unoCssFileName}" rel="stylesheet" />`;
221
+ unoCssGlobalFileName = this.getFileName(unoCssFileReferenceId);
226
222
  },
227
223
  // build
228
- renderChunk(code, chunk) {
229
- if (isSvelteKit && chunk.moduleIds.some((id) => isServerHooksFile(id)))
230
- return replaceGlobalStylesPlaceholder(code, unoCssHashedLinkTag);
224
+ renderChunk(code) {
225
+ if (isSvelteKit && code.includes(PLACEHOLDER_USER_SETS_IN_INDEX_HTML)) {
226
+ const tag = `<link href=\\"${viteConfig.base ?? "/"}${unoCssGlobalFileName}\\" rel=\\"stylesheet\\" />`;
227
+ return code.replace(PLACEHOLDER_USER_SETS_IN_INDEX_HTML, tag);
228
+ }
231
229
  },
232
230
  // serve and build
233
231
  async transformIndexHtml(html) {
234
232
  if (!isSvelteKit) {
235
233
  if (viteConfig.command === "build")
236
- return html.replace(PLACEHOLDER_USER_SETS_IN_INDEX_HTML, unoCssHashedLinkTag);
234
+ return html.replace(PLACEHOLDER_USER_SETS_IN_INDEX_HTML, `<link href="${viteConfig.base ?? "/"}${unoCssGlobalFileName}" rel="stylesheet" />`);
237
235
  if (viteConfig.command === "serve") {
238
- const css = await generateGlobalCss(ctx.uno, injectReset);
239
- return html.replace(PLACEHOLDER_USER_SETS_IN_INDEX_HTML, `<style type="text/css" data-title="${DEV_GLOBAL_STYLES_DATA_TITLE}">${css}</style>`);
236
+ return html.replace(PLACEHOLDER_USER_SETS_IN_INDEX_HTML, `<link href="${viteConfig.base ?? "/"}${GLOBAL_STYLES_CSS_FILE_NAME}" rel="stylesheet" data-title="${DEV_GLOBAL_STYLES_DATA_TITLE}" />`);
240
237
  }
241
238
  }
242
239
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@unocss/svelte-scoped",
3
3
  "type": "module",
4
- "version": "66.5.4",
4
+ "version": "66.5.6",
5
5
  "description": "Use UnoCSS in a modular fashion with styles being stored only in the Svelte component they are used in: Vite plugin for apps, Svelte preprocessor for component libraries",
6
6
  "author": "Jacob Bowdoin",
7
7
  "license": "MIT",
@@ -52,15 +52,15 @@
52
52
  "dependencies": {
53
53
  "acorn": "^8.15.0",
54
54
  "css-tree": "^3.1.0",
55
- "magic-string": "^0.30.19",
55
+ "magic-string": "^0.30.21",
56
56
  "zimmerframe": "^1.1.4",
57
- "@unocss/config": "66.5.4",
58
- "@unocss/reset": "66.5.4",
59
- "@unocss/preset-uno": "66.5.4"
57
+ "@unocss/preset-uno": "66.5.6",
58
+ "@unocss/reset": "66.5.6",
59
+ "@unocss/config": "66.5.6"
60
60
  },
61
61
  "devDependencies": {
62
62
  "prettier-plugin-svelte": "^2.10.1",
63
- "svelte": "^5.39.8"
63
+ "svelte": "^5.43.6"
64
64
  },
65
65
  "scripts": {
66
66
  "build": "unbuild",